:root {
  --navy:#121847;
  --red:#ef2b2d;
  --white:#fff;
  --ink:#161a2b;
  --muted:#687086;
  --line:#e5e7ee;
  --soft:#f7f8fb;
  --success:#138a5b;
  --shadow:0 24px 70px rgba(18,24,71,.10);
  --radius:18px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:#fff; }
body {
  margin:0;
  min-height:100vh;
  background:var(--white);
  color:var(--ink);
  font-family:"Montserrat",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
.site-header {
  min-height:82px;
  padding:14px clamp(18px,5vw,80px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.96);
  position:sticky;
  top:0;
  z-index:20;
  backdrop-filter:blur(14px);
}
.brand { width:190px; flex:0 0 auto; }
.brand img { width:100%; height:auto; }
.top-nav { display:flex; align-items:center; justify-content:flex-end; gap:8px; color:var(--navy); font-size:11px; font-weight:800; }
.top-nav a,.portal-pill {
  min-height:38px;
  padding:0 13px;
  border:1px solid var(--line);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#fff;
  white-space:nowrap;
}
.top-nav a:hover { border-color:#b9c0cf; background:var(--soft); }
.portal-pill { color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-size:9px; }
.portal-pill span {
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--success);
  box-shadow:0 0 0 4px rgba(19,138,91,.10);
}
.hero {
  min-height:590px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);
  gap:34px;
  align-items:center;
  padding:72px clamp(20px,6vw,96px);
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 8% 10%, rgba(239,43,45,.08), transparent 28%),
    linear-gradient(135deg,#fff 0%, #fff 56%, #f9fafc 100%);
}
.hero-copy { max-width:760px; }
.eyebrow,.section-kicker {
  color:var(--red);
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.hero h1 {
  margin:16px 0 20px;
  color:var(--navy);
  font-size:clamp(44px,6vw,76px);
  line-height:.98;
  letter-spacing:-.06em;
  font-weight:900;
}
.hero p {
  max-width:660px;
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.85;
  font-weight:600;
}
.hero-actions { margin-top:30px; display:flex; gap:10px; flex-wrap:wrap; }
.btn {
  min-height:48px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:12px;
  font-size:11px;
  font-weight:900;
  transition:transform .16s ease, border-color .16s ease, background-color .16s ease;
}
.btn:hover { transform:translateY(-1px); }
.btn.primary { background:var(--navy); color:#fff; border:1px solid var(--navy); }
.btn.secondary { background:#fff; color:var(--navy); border:1px solid var(--line); }
.btn.secondary:hover { border-color:#b9c0cf; background:var(--soft); }
.hero-panel {
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.logo-card {
  min-height:290px;
  display:grid;
  place-items:center;
  padding:34px;
  border-bottom:1px solid var(--line);
  background:#fff;
}
.logo-card img { width:min(100%,430px); height:auto; }
.portal-summary { padding:26px; }
.portal-summary span {
  color:var(--red);
  font-size:9px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.portal-summary strong {
  display:block;
  margin-top:8px;
  color:var(--navy);
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.035em;
}
.portal-summary p { margin:10px 0 0; color:var(--muted); font-size:12px; line-height:1.7; font-weight:650; }
.systems-section {
  max-width:1420px;
  margin:0 auto;
  padding:78px clamp(20px,5vw,72px) 46px;
}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  margin-bottom:26px;
}
.section-heading h2,.manuals-card h2,.help-section h2 {
  margin:8px 0 0;
  color:var(--navy);
  font-weight:900;
  letter-spacing:-.045em;
}
.section-heading h2,.manuals-card h2 { font-size:clamp(30px,3.2vw,44px); }
.section-heading p { margin:0 0 5px; color:var(--muted); font-size:12px; font-weight:700; }
.systems-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.system-card {
  min-height:360px;
  padding:20px;
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 12px 34px rgba(18,24,71,.04);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.system-card:hover {
  transform:translateY(-4px);
  border-color:#c9ceda;
  box-shadow:0 18px 42px rgba(18,24,71,.09);
}
.system-card.navy { --accent:var(--navy); }
.system-card.red { --accent:var(--red); }
.system-card-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.system-index {
  width:48px;
  height:48px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:color-mix(in srgb,var(--accent) 10%,white);
  color:var(--accent);
  font-size:13px;
  font-weight:900;
}
.system-status {
  min-height:28px;
  padding:0 9px;
  border:1px solid var(--line);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  color:var(--muted);
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.system-copy { margin-top:42px; }
.system-copy>span {
  color:var(--accent);
  font-size:9px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.system-copy h3 {
  margin:9px 0 10px;
  color:var(--navy);
  font-size:22px;
  line-height:1.18;
  letter-spacing:-.035em;
  font-weight:900;
}
.system-copy p { margin:0; color:var(--muted); font-size:12px; line-height:1.75; font-weight:600; }
.system-link {
  margin-top:auto;
  padding-top:20px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--navy);
}
.system-link>span:first-child {
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  font-weight:900;
}
.system-link small {
  max-width:190px;
  color:#8d94a5;
  font-size:8px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.arrow-button {
  width:38px;
  height:38px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:12px;
  color:#fff;
  background:var(--accent);
  transition:transform .18s ease;
}
.system-link:hover .arrow-button,.manuals-link:hover span:last-child,.help-section a:hover span { transform:translateX(3px); }
.manuals-section {
  max-width:1420px;
  margin:0 auto;
  padding:18px clamp(20px,5vw,72px) 34px;
}
.manuals-card {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--navy);
  color:#fff;
  overflow:hidden;
  position:relative;
}
.manuals-card::after {
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:50%;
  right:-54px;
  top:-70px;
}
.manuals-card .section-kicker { color:#fff; opacity:.74; }
.manuals-card h2 { color:#fff; margin-top:6px; }
.manuals-card p { max-width:760px; margin:10px 0 0; color:rgba(255,255,255,.72); font-size:13px; line-height:1.75; font-weight:600; }
.manuals-icon {
  width:72px;
  height:72px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--red);
  box-shadow:0 16px 34px rgba(0,0,0,.18);
  font-size:31px;
  font-weight:900;
}
.manuals-link {
  min-width:210px;
  min-height:56px;
  padding:10px 15px;
  border-radius:14px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 9px;
  align-items:center;
  background:#fff;
  color:var(--navy);
  font-size:12px;
  font-weight:900;
  position:relative;
  z-index:1;
}
.manuals-link small {
  grid-column:1/-1;
  color:#8d94a5;
  font-size:8px;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.notes-section {
  max-width:1420px;
  margin:0 auto;
  padding:0 clamp(20px,5vw,72px) 56px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.note {
  min-height:86px;
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  display:flex;
  align-items:flex-start;
  gap:12px;
  background:#fff;
}
.note span { color:var(--red); font-size:11px; font-weight:900; letter-spacing:.1em; }
.note p { margin:0; color:var(--muted); font-size:12px; line-height:1.65; font-weight:650; }
.help-section {
  margin:0 clamp(20px,6vw,96px) 66px;
  padding:28px 30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 34px rgba(18,24,71,.05);
}
.help-section>div { display:flex; align-items:center; gap:17px; }
.help-icon {
  width:48px;
  height:48px;
  flex:0 0 auto;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(239,43,45,.08);
  color:var(--red);
  font-size:20px;
  font-weight:900;
}
.help-section h2 { font-size:19px; margin:0 0 5px; }
.help-section p { margin:0; color:var(--muted); font-size:12px; line-height:1.6; font-weight:650; }
.help-section a {
  min-height:44px;
  flex:0 0 auto;
  padding:0 15px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--navy);
  color:#fff;
  font-size:11px;
  font-weight:900;
}
footer {
  padding:28px clamp(20px,6vw,96px);
  display:grid;
  grid-template-columns:160px 1fr auto;
  align-items:center;
  gap:22px;
  border-top:1px solid var(--line);
  color:#7f8798;
  font-size:10px;
  font-weight:700;
}
footer img { width:160px; }
footer p { margin:0; }
footer p:last-child { text-align:right; }
@media (max-width:1120px) {
  .hero { grid-template-columns:1fr; }
  .hero-panel { max-width:620px; }
  .systems-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .manuals-card { grid-template-columns:auto minmax(0,1fr); }
  .manuals-link { grid-column:2; justify-self:start; }
}
@media (max-width:760px) {
  .site-header { position:static; align-items:flex-start; flex-direction:column; }
  .brand { width:170px; }
  .top-nav { width:100%; justify-content:flex-start; overflow:auto; padding-bottom:2px; }
  .hero { min-height:0; padding-top:54px; padding-bottom:54px; }
  .hero h1 { font-size:43px; }
  .logo-card { min-height:220px; padding:26px; }
  .systems-section { padding-top:58px; }
  .section-heading { align-items:flex-start; flex-direction:column; gap:10px; }
  .systems-grid,.notes-section { grid-template-columns:1fr; }
  .system-card { min-height:310px; }
  .system-copy { margin-top:28px; }
  .manuals-card { grid-template-columns:1fr; padding:24px; }
  .manuals-icon { width:62px; height:62px; }
  .manuals-link { grid-column:auto; width:100%; min-width:0; }
  .help-section { align-items:flex-start; flex-direction:column; padding:24px; }
  .help-section>div { align-items:flex-start; }
  footer { grid-template-columns:1fr; text-align:center; }
  footer img { margin:0 auto; }
  footer p:last-child { text-align:center; }
}
@media (max-width:420px) {
  .hero h1 { font-size:36px; }
  .top-nav a,.portal-pill { min-height:34px; padding:0 10px; }
  .btn { width:100%; }
  .system-card { padding:18px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition-duration:.01ms!important; }
}