/* ============================================================
   ONRAV — shared site stylesheet
   Sovereign & Institutional Public Health Advisory
   ============================================================ */

:root{
  --ink:#0a0f0d;
  --ink-2:#070b09;
  --surface:#121a17;
  --surface-2:#182220;
  --line:#233029;
  --line-soft:#182420;
  --teal:#14bfb5;
  --teal-dim:#0f6b65;
  --teal-glow:rgba(20,191,181,0.16);
  --gold:#c9a24b;
  --gold-dim:#7a6636;
  --risk:#c1554a;
  --risk-dim:#6e3128;
  --text:#edf2f0;
  --text-muted:#94a49d;
  --text-faint:#586a62;
  --font-display:'Archivo Expanded', 'Arial Narrow', sans-serif;
  --font-wordmark:'Unbounded', 'Archivo Expanded', sans-serif;
  --font-body:'IBM Plex Sans', 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'Consolas', monospace;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  background:var(--ink);
  color:var(--text);
  font-family:var(--font-body);
  margin:0;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}

img,svg{ display:block; max-width:100%; }
a{ color:inherit; }
:focus-visible{ outline:2px solid var(--teal); outline-offset:2px; }

.shell{ max-width:1180px; margin:0 auto; padding:0 1.75rem; }
section{ position:relative; }

.reveal{ opacity:0; transform:translateY(18px); transition:opacity 0.7s ease, transform 0.7s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* ---------------- NAV ---------------- */
nav.topnav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.5rem 1.75rem;
  background:rgba(10,15,13,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  transition:background 0.35s ease, border-color 0.35s ease, padding 0.35s ease;
}
nav.topnav.home-nav{ background:rgba(10,15,13,0); border-bottom-color:transparent; }
nav.topnav.home-nav.scrolled{ background:rgba(9,13,12,0.88); border-bottom-color:var(--line); padding:0.9rem 1.75rem; }
.nav-brand{ display:flex; align-items:center; gap:0.9rem; text-decoration:none; }
.nav-brand svg{ width:40px; height:auto; }
.nav-brand span{ font-family:var(--font-wordmark); font-weight:900; font-size:1.9rem; line-height:1; letter-spacing:-0.02em; }
.nav-links{ display:flex; gap:1.85rem; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-family:var(--font-mono); font-size:0.72rem; text-transform:uppercase;
  letter-spacing:0.07em; text-decoration:none; color:var(--text-muted); transition:color 0.2s ease;
}
.nav-links a:hover, .nav-links a.active{ color:var(--teal); }
.nav-cta{
  font-family:var(--font-mono); font-size:0.72rem; text-transform:uppercase;
  letter-spacing:0.06em; text-decoration:none; color:var(--ink);
  background:var(--teal); padding:0.6rem 1.1rem; border-radius:2px; transition:filter 0.2s ease;
}
.nav-cta:hover{ filter:brightness(1.12); }
.nav-mobile-hide{ display:flex; align-items:center; gap:2.25rem; }
@media (max-width:860px){ .nav-links{ display:none; } }

/* ---------------- HOME HERO (canvas) ---------------- */
.hero{ min-height:100svh; display:flex; align-items:center; padding-top:6rem; padding-bottom:4rem; overflow:hidden; }
#hero-canvas{ position:absolute; inset:0; width:100%; height:100%; }
.hero-scrim{
  position:absolute; inset:0;
  background:linear-gradient(100deg, var(--ink) 0%, var(--ink) 28%, rgba(10,15,13,0.78) 46%, rgba(10,15,13,0.25) 68%, rgba(10,15,13,0.55) 100%);
  pointer-events:none;
}
.hero-inner{ position:relative; z-index:2; max-width:760px; }
.eyebrow{
  font-family:var(--font-mono); font-size:0.76rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--teal); margin-bottom:1.4rem; display:flex; align-items:center; gap:0.6rem;
}
.eyebrow::before{ content:''; width:22px; height:1px; background:var(--teal); }
h1.hero-title{
  font-family:var(--font-display); font-weight:800; font-size:clamp(2.4rem, 5.4vw, 4.4rem);
  line-height:1.06; letter-spacing:-0.01em; text-wrap:balance; margin:0 0 1.6rem;
}
h1.hero-title em{ font-style:normal; color:var(--teal); }
.hero-lede{ font-size:1.15rem; color:var(--text-muted); max-width:52ch; margin:0 0 2.4rem; }
.hero-actions{ display:flex; gap:1rem; flex-wrap:wrap; }
.btn{
  font-family:var(--font-mono); font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em;
  text-decoration:none; padding:0.85rem 1.5rem; border-radius:2px; display:inline-flex; align-items:center;
  gap:0.5rem; transition:all 0.2s ease; border:1px solid transparent; cursor:pointer; background:none;
}
.btn-primary{ background:var(--teal); color:var(--ink); }
.btn-primary:hover{ filter:brightness(1.12); }
.btn-ghost{ border-color:var(--line); color:var(--text); background:transparent; }
.btn-ghost:hover{ border-color:var(--teal); color:var(--teal); }
.btn-sm{ padding:0.6rem 1.1rem; font-size:0.7rem; }
.scroll-cue{
  position:absolute; bottom:2rem; left:1.75rem; z-index:2; font-family:var(--font-mono); font-size:0.68rem;
  color:var(--text-faint); display:flex; align-items:center; gap:0.6rem; letter-spacing:0.08em;
}
.scroll-cue::after{ content:''; width:1px; height:34px; background:linear-gradient(var(--teal), transparent); }

/* ---------------- SUBPAGE HERO ---------------- */
.page-hero{
  padding:9.5rem 0 5rem; border-bottom:1px solid var(--line); background:var(--ink-2);
  overflow:hidden;
}
.page-hero .shell{ display:grid; grid-template-columns:1fr auto; gap:3rem; align-items:center; }
.page-hero .breadcrumb{
  font-family:var(--font-mono); font-size:0.7rem; color:var(--text-faint); text-transform:uppercase;
  letter-spacing:0.06em; margin-bottom:1.25rem; display:flex; gap:0.5rem; align-items:center;
}
.page-hero .breadcrumb a{ color:var(--text-faint); text-decoration:none; }
.page-hero .breadcrumb a:hover{ color:var(--teal); }
.page-hero h1{
  font-family:var(--font-display); font-weight:800; font-size:clamp(2.1rem, 4.4vw, 3.4rem);
  line-height:1.08; letter-spacing:-0.01em; text-wrap:balance; margin:0 0 1.25rem; max-width:20ch;
}
.page-hero h1 em{ font-style:normal; color:var(--teal); }
.page-hero .lede{ font-size:1.08rem; color:var(--text-muted); max-width:56ch; margin:0 0 2rem; }
.page-hero .hero-icon{ width:180px; height:180px; flex-shrink:0; }
.page-hero .hero-icon svg{ width:100%; height:100%; filter:drop-shadow(0 0 40px var(--teal-glow)); }
@media (max-width:860px){
  .page-hero .shell{ grid-template-columns:1fr; }
  .page-hero .hero-icon{ width:110px; height:110px; order:-1; }
}

/* ---------------- STAT STRIP ---------------- */
.stat-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--ink-2); padding:2.75rem 0; }
.stat-strip .shell{ display:grid; grid-template-columns:1.3fr repeat(3, 1fr); gap:2rem; align-items:center; }
.stat-intro p{ margin:0; font-size:0.98rem; color:var(--text-muted); max-width:38ch; }
.stat{ border-left:1px solid var(--line); padding-left:1.5rem; }
.stat .num{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; font-size:2.1rem; color:var(--teal); line-height:1; margin-bottom:0.5rem; }
.stat .label{ font-size:0.82rem; color:var(--text-muted); max-width:22ch; }
.stat-source{ grid-column:1 / -1; font-family:var(--font-mono); font-size:0.7rem; color:var(--text-faint); margin-top:1.75rem; padding-top:1.5rem; border-top:1px solid var(--line-soft); }
.stat-source a{ color:var(--text-muted); text-decoration:underline; text-underline-offset:2px; }
@media (max-width:860px){ .stat-strip .shell{ grid-template-columns:1fr 1fr; } .stat-intro{ grid-column:1/-1; } }

/* ---------------- SECTION HEADERS ---------------- */
.section-pad{ padding:7rem 0; }
.section-pad.tight{ padding:5rem 0; }
.section-tag{
  font-family:var(--font-mono); font-size:0.74rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gold); display:flex; align-items:center; gap:0.75rem; margin-bottom:1rem;
}
.section-tag::after{ content:''; flex:1; height:1px; background:var(--line); }
.section-tag.tag-teal{ color:var(--teal); }
h2.section-title{
  font-family:var(--font-display); font-weight:800; font-size:clamp(1.7rem, 3.4vw, 2.6rem);
  letter-spacing:-0.005em; text-wrap:balance; margin:0 0 1.1rem; max-width:28ch;
}
.section-intro{ font-size:1.05rem; color:var(--text-muted); max-width:62ch; margin:0 0 3rem; }
.prose{ max-width:68ch; }
.prose p{ font-size:1.02rem; color:var(--text-muted); margin:0 0 1.25rem; }
.prose p strong{ color:var(--text); font-weight:600; }
.prose h3{ font-family:var(--font-display); font-weight:700; font-size:1.3rem; color:var(--text); margin:2.5rem 0 1rem; }

/* ---------------- SPLIT LAYOUT + PIXEL ICONS ---------------- */
.split-layout{ display:grid; grid-template-columns:1fr 280px; gap:3rem; align-items:start; }
.icon-rail{ position:sticky; top:130px; display:flex; flex-direction:column; gap:2.75rem; padding-top:0.5rem; }
.icon-item{ display:flex; flex-direction:column; align-items:flex-start; gap:0.7rem; }
.pixel-icon{ width:92px; height:92px; }
.pixel-icon svg{ width:100%; height:100%; display:block; }
.icon-label{ font-family:var(--font-mono); font-size:0.66rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.07em; }
@media (max-width:960px){ .split-layout{ grid-template-columns:1fr; } .icon-rail{ display:none; } }
.icon-rail.single{ justify-content:center; height:100%; }
.icon-rail.single .pixel-icon{ width:150px; height:150px; }
.icon-rail.single .icon-label{ font-size:0.7rem; letter-spacing:0.08em; }

/* ---------------- SCHEMATIC ---------------- */
.schematic{
  position:relative; aspect-ratio:1000/640; margin-top:1rem;
  background-image:radial-gradient(circle, rgba(35,48,41,0.9) 1px, transparent 1px);
  background-size:22px 22px; border:1px solid var(--line-soft);
}
.schem-lines{ position:absolute; inset:0; width:100%; height:100%; }
.schem-node{ position:absolute; transform:translate(-50%, -50%); background:var(--surface); border:1px solid var(--line); }
.schem-node .cnr{ position:absolute; width:11px; height:11px; pointer-events:none; }
.schem-node .cnr.tl{ top:-1px; left:-1px; border-top:1.5px solid var(--teal); border-left:1.5px solid var(--teal); }
.schem-node .cnr.tr{ top:-1px; right:-1px; border-top:1.5px solid var(--teal); border-right:1.5px solid var(--teal); }
.schem-node .cnr.bl{ bottom:-1px; left:-1px; border-bottom:1.5px solid var(--teal); border-left:1.5px solid var(--teal); }
.schem-node .cnr.br{ bottom:-1px; right:-1px; border-bottom:1.5px solid var(--teal); border-right:1.5px solid var(--teal); }
.mod-tag{ font-family:var(--font-mono); font-size:0.63rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal); display:block; margin-bottom:0.6rem; }
.schem-node.hub{
  width:25%; padding:1.5rem; text-align:center; display:flex; flex-direction:column; align-items:center;
  justify-content:center; box-shadow:0 0 70px var(--teal-glow);
}
.schem-node.hub .cnr{ border-color:var(--teal) !important; width:14px; height:14px; }
.schem-node.hub svg{ width:40px; height:auto; margin-bottom:0.8rem; }
.schem-node.hub h3{ font-family:var(--font-display); font-weight:800; font-size:1.05rem; line-height:1.18; margin:0; text-wrap:balance; }
.schem-node.module{ width:25%; padding:1rem 1.15rem; text-align:left; transition:border-color 0.25s ease; }
.schem-node.module:hover{ border-color:var(--teal-dim); }
.schem-node.module .mod-tag{ color:var(--gold); }
.schem-node.module h4{ font-weight:600; font-size:0.98rem; margin:0 0 0.4rem; }
.schem-node.module p{ font-size:0.85rem; color:var(--text-muted); margin:0; }
@media (max-width:780px){
  .schematic{ position:static; aspect-ratio:auto; display:flex; flex-direction:column; gap:1rem; background-size:16px 16px; padding:1rem 0; }
  .schem-lines{ display:none; }
  .schem-node{ position:static; transform:none; width:100% !important; text-align:left; }
  .schem-node.hub{ flex-direction:row; text-align:left; justify-content:flex-start; gap:1rem; padding:1.4rem; }
  .schem-node.hub svg{ margin-bottom:0; flex-shrink:0; }
}

/* ---------------- FRAMEWORK ---------------- */
.framework-rail{ margin-top:1rem; }
.fstep{ display:grid; grid-template-columns:5rem 1fr; gap:1.5rem; padding:2rem 0; border-top:1px solid var(--line); }
.fstep:last-child{ border-bottom:1px solid var(--line); }
.fstep .fnum{ font-family:var(--font-mono); font-size:0.78rem; color:var(--gold); padding-top:0.2rem; }
.fstep h4{ font-family:var(--font-display); font-weight:700; font-size:1.15rem; margin:0 0 0.5rem; }
.fstep p{ color:var(--text-muted); margin:0; max-width:56ch; font-size:0.96rem; }

/* ---------------- STAGE DETAIL (approach page) ---------------- */
.stage-card{ display:grid; grid-template-columns:5.5rem 1fr; gap:2rem; padding:3rem 0; border-top:1px solid var(--line); }
.stage-card:last-child{ border-bottom:1px solid var(--line); }
.stage-card .snum{ font-family:var(--font-mono); font-size:0.85rem; color:var(--gold); padding-top:0.3rem; }
.stage-card h3{ font-family:var(--font-display); font-weight:800; font-size:1.5rem; margin:0 0 0.75rem; }
.stage-card .sdesc{ color:var(--text-muted); font-size:1rem; max-width:60ch; margin:0 0 1.75rem; }
.stage-card .produces-label{ font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-faint); margin-bottom:0.85rem; }
.stage-card .produces-list{ list-style:none; margin:0 0 1.75rem; padding:0; display:flex; flex-direction:column; gap:0.6rem; }
.stage-card .produces-list li{ font-size:0.92rem; color:var(--text); padding-left:1.15rem; position:relative; max-width:60ch; }
.stage-card .produces-list li::before{ content:''; position:absolute; left:0; top:0.5em; width:6px; height:6px; background:var(--teal); }
.stage-card .why-it-matters{ border-left:2px solid var(--gold-dim); padding-left:1.1rem; font-size:0.92rem; color:var(--text-muted); max-width:58ch; }
.stage-card .why-it-matters strong{ color:var(--gold); font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; display:block; margin-bottom:0.4rem; }

/* ---------------- DASHBOARD MOCK ---------------- */
.dash-card{ border:1px solid var(--line); background:var(--surface); border-radius:6px; overflow:hidden; margin-top:2.5rem; }
.dash-head{ display:flex; justify-content:space-between; align-items:center; padding:1.1rem 1.5rem; border-bottom:1px solid var(--line); background:var(--surface-2); }
.dash-head .dash-title{ font-family:var(--font-mono); font-size:0.75rem; color:var(--text-muted); letter-spacing:0.04em; }
.dash-head .dash-flag{ font-family:var(--font-mono); font-size:0.65rem; color:var(--gold); border:1px solid var(--gold-dim); padding:0.25rem 0.6rem; border-radius:2px; letter-spacing:0.05em; }
.dash-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); }
.kpi-tile{ background:var(--surface); padding:1.25rem 1.4rem; }
.kpi-tile .klabel{ font-family:var(--font-mono); font-size:0.66rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:0.6rem; }
.kpi-tile .kval{ font-family:var(--font-mono); font-size:1.55rem; color:var(--text); font-variant-numeric:tabular-nums; }
.kpi-tile .kdelta{ font-family:var(--font-mono); font-size:0.74rem; margin-top:0.35rem; display:flex; align-items:center; gap:0.3rem; }
.kdelta.up, .kdelta.down-good{ color:var(--teal); }
.dash-body{ display:grid; grid-template-columns:1.3fr 1fr; gap:0; }
.dash-states{ padding:1.5rem; border-right:1px solid var(--line); border-top:1px solid var(--line); }
.dash-row{ display:grid; grid-template-columns:4.2rem 5.2rem 1fr 3.6rem; gap:0.8rem; align-items:center; margin-bottom:0.85rem; }
.dash-row:last-child{ margin-bottom:0; }
.dash-row .dname{ font-family:var(--font-mono); font-size:0.76rem; color:var(--text-muted); }
.pill{ font-family:var(--font-mono); font-size:0.62rem; text-transform:uppercase; letter-spacing:0.04em; padding:0.2rem 0.5rem; border-radius:2px; text-align:center; white-space:nowrap; }
.pill.ok{ color:var(--teal); border:1px solid var(--teal-dim); }
.pill.warn{ color:var(--gold); border:1px solid var(--gold-dim); }
.pill.risk{ color:var(--risk); border:1px solid var(--risk-dim); }
.dash-bar{ height:5px; background:var(--line); border-radius:3px; overflow:hidden; }
.dash-bar span{ display:block; height:100%; border-radius:3px; }
.dash-row .dpct{ font-family:var(--font-mono); font-size:0.76rem; color:var(--text-muted); text-align:right; font-variant-numeric:tabular-nums; }
.dash-chart{ padding:1.5rem; border-top:1px solid var(--line); }
.dash-chart .chead{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:0.75rem; }
.dash-chart .chead .ctitle{ font-family:var(--font-mono); font-size:0.72rem; color:var(--text-muted); }
.dash-chart .chead .cdelta{ font-family:var(--font-mono); font-size:0.72rem; color:var(--teal); }
.dash-chart svg{ width:100%; height:auto; }
.dash-caption{ font-size:0.95rem; color:var(--text-muted); margin-top:1.5rem; max-width:62ch; }
@media (max-width:860px){ .dash-kpis{ grid-template-columns:1fr 1fr; } .dash-body{ grid-template-columns:1fr; } .dash-states{ border-right:none; } }

/* ---------------- FAQ ---------------- */
.faq-list{ margin-top:1rem; border-top:1px solid var(--line); }
.faq-item{ padding:1.75rem 0; border-bottom:1px solid var(--line); }
.faq-item h4{ font-family:var(--font-body); font-weight:600; font-size:1.02rem; margin:0 0 0.6rem; }
.faq-item p{ color:var(--text-muted); margin:0; font-size:0.94rem; max-width:70ch; }

/* ---------------- CAPABILITY DETAIL GRID (subpages) ---------------- */
.cap-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:1rem; }
.cap-item{ background:var(--surface); padding:1.75rem; }
.cap-item .cidx{ font-family:var(--font-mono); font-size:0.7rem; color:var(--teal); display:block; margin-bottom:0.9rem; }
.cap-item h4{ font-family:var(--font-display); font-weight:700; font-size:1.02rem; margin:0 0 0.6rem; text-wrap:balance; }
.cap-item p{ font-size:0.88rem; color:var(--text-muted); margin:0; }
@media (max-width:780px){ .cap-grid{ grid-template-columns:1fr; } }

/* ---------------- WHO WE SERVE — full segments ---------------- */
.who-segment{ padding:3.5rem 0; border-top:1px solid var(--line); }
.who-segment:last-child{ border-bottom:1px solid var(--line); }
.who-head{ display:flex; align-items:flex-start; gap:1.5rem; margin-bottom:1.75rem; }
.who-head .pixel-icon{ width:56px; height:56px; flex-shrink:0; }
.who-head .sidx{ font-family:var(--font-mono); font-size:0.72rem; color:var(--teal); display:block; margin-bottom:0.5rem; }
.who-head h3{ font-family:var(--font-display); font-weight:800; font-size:1.5rem; margin:0; text-wrap:balance; }
.who-body{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; margin-bottom:1.75rem; }
.who-body h4{ font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-faint); margin:0 0 0.75rem; }
.who-body p{ color:var(--text-muted); font-size:0.96rem; margin:0; }
.who-body p strong{ color:var(--text); font-weight:600; }
.who-body .src{ display:block; margin-top:0.6rem; font-family:var(--font-mono); font-size:0.7rem; color:var(--text-faint); }
.who-body .src a{ color:var(--text-muted); text-decoration:underline; text-underline-offset:2px; }
.who-engage-label{ font-family:var(--font-mono); font-size:0.66rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.9rem; }
.who-engage-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0.6rem 2rem; list-style:none; margin:0; padding:0; }
.who-engage-grid li{ font-size:0.9rem; color:var(--text); padding-left:1.1rem; position:relative; }
.who-engage-grid li::before{ content:''; position:absolute; left:0; top:0.5em; width:6px; height:6px; background:var(--teal); }
@media (max-width:780px){ .who-body{ grid-template-columns:1fr; gap:1.25rem; } .who-engage-grid{ grid-template-columns:1fr; } }

.also-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:1.5rem; }
.also-item{ background:var(--surface); padding:1.5rem; }
.also-item h5{ font-family:var(--font-display); font-weight:700; font-size:0.98rem; margin:0 0 0.6rem; }
.also-item p{ font-size:0.86rem; color:var(--text-muted); margin:0; }
@media (max-width:780px){ .also-grid{ grid-template-columns:1fr; } }

/* ---------------- WHO WE SERVE ---------------- */
.serve-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:1rem; }
.serve-card{ background:var(--surface); padding:2rem; }
.serve-card .sidx{ font-family:var(--font-mono); font-size:0.72rem; color:var(--teal); display:block; margin-bottom:1.1rem; }
.serve-card .scard-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.serve-card .scard-icon{ width:44px; height:44px; flex-shrink:0; }
.serve-card h4{ font-size:1.1rem; font-weight:700; margin:0.9rem 0 0.65rem; text-wrap:balance; font-family:var(--font-display); }
.serve-card p{ font-size:0.92rem; color:var(--text-muted); margin:0 0 1.1rem; }
.serve-card .stag{ font-family:var(--font-mono); font-size:0.65rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.6rem; }
.serve-card ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.45rem; }
.serve-card ul li{ font-size:0.85rem; color:var(--text-muted); padding-left:1rem; position:relative; }
.serve-card ul li::before{ content:'—'; position:absolute; left:0; color:var(--teal-dim); }
@media (max-width:780px){ .serve-grid{ grid-template-columns:1fr; } }

/* ---------------- INSIGHTS ---------------- */
.insight-list{ margin-top:1rem; display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line); }
.insight-card{ padding:2.25rem 0; border-bottom:1px solid var(--line); }
.insight-card .itag{ font-family:var(--font-mono); font-size:0.66rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.8rem; display:block; }
.insight-card h4{ font-family:var(--font-display); font-weight:700; font-size:1.25rem; margin:0 0 0.9rem; max-width:52ch; text-wrap:balance; }
.insight-card p{ color:var(--text-muted); margin:0 0 1rem; max-width:66ch; font-size:0.98rem; }
.insight-card .isource{ font-family:var(--font-mono); font-size:0.72rem; color:var(--text-faint); }
.insight-card .isource a{ color:var(--text-muted); text-decoration:underline; text-underline-offset:2px; }

/* ---------------- ENGAGE / CTA ---------------- */
.engage{ background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:3rem; display:grid; grid-template-columns:1.1fr 1fr; gap:3rem; margin-top:1rem; }
.engage h2{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.6rem,3vw,2.2rem); margin:0 0 1rem; text-wrap:balance; }
.engage p{ color:var(--text-muted); margin:0 0 1.5rem; max-width:44ch; }
.engage-contacts{ display:flex; flex-direction:column; gap:1.4rem; justify-content:center; }
.contact-line{ border-left:2px solid var(--teal-dim); padding-left:1rem; }
.contact-line .clabel{ font-family:var(--font-mono); font-size:0.68rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.06em; }
.contact-line a{ font-size:1.05rem; text-decoration:none; color:var(--text); }
.contact-line a:hover{ color:var(--teal); }
@media (max-width:780px){ .engage{ grid-template-columns:1fr; padding:2rem; } }

/* ---------------- FORM (Engage page) ---------------- */
.form-card{ background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:2.5rem; }
.form-row{ margin-bottom:1.35rem; }
.form-row label{ display:block; font-family:var(--font-mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-muted); margin-bottom:0.5rem; }
.form-row input, .form-row select, .form-row textarea{
  width:100%; background:var(--ink); border:1px solid var(--line); color:var(--text);
  font-family:var(--font-body); font-size:0.95rem; padding:0.75rem 0.9rem; border-radius:3px;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{ outline:none; border-color:var(--teal); }
.form-row textarea{ min-height:130px; resize:vertical; }
.form-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:1.35rem; }
@media (max-width:600px){ .form-grid-2{ grid-template-columns:1fr; } }
.form-note{ font-size:0.8rem; color:var(--text-faint); margin-top:1rem; }
.form-alert{ font-family:var(--font-mono); font-size:0.82rem; padding:0.9rem 1.1rem; border-radius:4px; margin-bottom:1.5rem; }
.form-alert.success{ background:rgba(20,191,181,0.1); border:1px solid var(--teal-dim); color:var(--teal); }
.form-alert.error{ background:rgba(193,85,74,0.1); border:1px solid var(--risk-dim); color:var(--risk); }
.hp-field{ position:absolute; left:-9999px; top:-9999px; }

/* ---------------- FOOTER ---------------- */
footer{ border-top:1px solid var(--line); background:var(--ink-2); padding:4.5rem 0 0; }
.foot-top{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2.5rem; padding-bottom:3rem; border-bottom:1px solid var(--line-soft); }
.foot-brand{ display:flex; align-items:center; gap:0.85rem; margin-bottom:1.1rem; }
.foot-brand svg{ width:38px; }
.foot-brand span{ font-family:var(--font-wordmark); font-weight:900; font-size:1.8rem; line-height:1; letter-spacing:-0.02em; }
.foot-tagline{ font-family:var(--font-mono); font-size:0.68rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--teal); margin:0 0 1.1rem; }
.foot-desc{ font-size:0.88rem; color:var(--text-muted); max-width:30ch; margin:0 0 1rem; }
.foot-reg{ font-family:var(--font-mono); font-size:0.72rem; color:var(--text-faint); line-height:1.7; margin:0 0 1.5rem; letter-spacing:0.02em; }
.foot-social{ display:flex; gap:0.85rem; }
.foot-social a{ width:32px; height:32px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; text-decoration:none; color:var(--text-muted); transition:all 0.2s ease; }
.foot-social a:hover{ border-color:var(--teal); color:var(--teal); }
.foot-social svg{ width:14px; height:14px; }
.foot-col h5{ font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-faint); margin:0 0 1.2rem; }
.foot-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.75rem; }
.foot-col a{ text-decoration:none; font-size:0.9rem; color:var(--text-muted); transition:color 0.2s ease; }
.foot-col a:hover{ color:var(--teal); }
.foot-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.75rem; padding:1.75rem 0 2.5rem; font-family:var(--font-mono); font-size:0.7rem; color:var(--text-faint); }
.foot-bottom a{ text-decoration:none; color:var(--text-faint); }
.foot-bottom a:hover{ color:var(--teal); }
.foot-bottom .fb-links{ display:flex; gap:1.25rem; flex-wrap:wrap; }
@media (max-width:900px){ .foot-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .foot-top{ grid-template-columns:1fr; } }

/* ---------------- COOKIE CONSENT ---------------- */
#cookie-banner{
  position:fixed; left:1.5rem; right:1.5rem; bottom:1.5rem; z-index:100; max-width:640px;
  background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:1.6rem 1.75rem;
  box-shadow:0 20px 60px rgba(0,0,0,0.45); opacity:0; transform:translateY(16px); pointer-events:none;
  transition:opacity 0.4s ease, transform 0.4s ease;
}
#cookie-banner.visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
#cookie-banner p{ margin:0 0 1.1rem; font-size:0.88rem; color:var(--text-muted); }
#cookie-banner p a{ color:var(--teal); text-decoration:underline; text-underline-offset:2px; }
.cookie-actions{ display:flex; gap:0.75rem; flex-wrap:wrap; align-items:center; }
.cookie-panel{ display:none; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--line); }
.cookie-panel.open{ display:block; }
.cookie-toggle-row{ display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:0.5rem; }
.cookie-toggle-row .ctlabel{ font-size:0.85rem; }
.cookie-toggle-row .ctdesc{ font-size:0.76rem; color:var(--text-faint); margin-top:0.2rem; }
.switch{ position:relative; width:38px; height:22px; flex-shrink:0; }
.switch input{ opacity:0; width:0; height:0; }
.switch .slider{ position:absolute; inset:0; background:var(--line); border-radius:22px; cursor:pointer; transition:background 0.2s ease; }
.switch .slider::before{ content:''; position:absolute; width:16px; height:16px; left:3px; top:3px; background:var(--text-muted); border-radius:50%; transition:transform 0.2s ease, background 0.2s ease; }
.switch input:checked + .slider{ background:var(--teal-dim); }
.switch input:checked + .slider::before{ transform:translateX(16px); background:var(--teal); }
.switch input:disabled + .slider{ opacity:0.5; cursor:not-allowed; }

/* ---------------- LEGAL PAGE ---------------- */
.legal-jumpbar{
  position:sticky; top:0; z-index:19; background:var(--ink); border-bottom:1px solid var(--line-soft);
  display:flex; gap:0; overflow-x:auto; margin-top:5.5rem;
}
.legal-jumpbar a{
  font-family:var(--font-mono); font-size:0.72rem; text-transform:uppercase; letter-spacing:0.05em;
  text-decoration:none; color:var(--text-muted); padding:0.9rem 1.4rem; white-space:nowrap; border-bottom:2px solid transparent;
}
.legal-jumpbar a:hover{ color:var(--text); }
.legal-jumpbar a.active{ color:var(--teal); border-bottom-color:var(--teal); }
.legal-wrap{ max-width:760px; margin:0 auto; padding:4rem 1.75rem 8rem; }
.legal-block{ padding-top:4rem; margin-top:1rem; border-top:1px solid var(--line-soft); scroll-margin-top:70px; }
.legal-block:first-of-type{ border-top:none; padding-top:0; }
.legal-block h2{ font-family:var(--font-display); font-weight:800; font-size:1.5rem; margin:0 0 1.5rem; letter-spacing:-0.005em; }
.legal-block h3{ font-family:var(--font-body); font-weight:600; font-size:1.02rem; margin:2rem 0 0.75rem; color:var(--text); }
.legal-block p{ color:var(--text-muted); margin:0 0 1.1rem; max-width:66ch; }
.legal-block ul{ margin:0 0 1.1rem; padding-left:1.2rem; color:var(--text-muted); }
.legal-block li{ margin-bottom:0.5rem; max-width:62ch; }
.legal-block strong{ color:var(--text); font-weight:600; }
.legal-block table{ width:100%; border-collapse:collapse; margin:1rem 0 1.5rem; font-size:0.88rem; }
.legal-block th, .legal-block td{ text-align:left; padding:0.65rem 0.9rem; border-bottom:1px solid var(--line); color:var(--text-muted); }
.legal-block th{ font-family:var(--font-mono); font-size:0.68rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-faint); }
.legal-block td strong{ color:var(--text); }
.contact-box{ border:1px solid var(--line); background:var(--surface); border-radius:6px; padding:1.5rem 1.75rem; margin-top:1.5rem; }
.contact-box p{ margin:0; }
.contact-box a{ text-decoration:none; color:var(--teal); }
.contact-box a:hover{ text-decoration:underline; }

/* ---------------- 404 ---------------- */
.notfound{ min-height:70vh; display:flex; align-items:center; padding:8rem 0 4rem; }
.notfound .shell{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:1.5rem; }
.notfound .pixel-icon{ width:140px; height:140px; }
