/* ==========================================================================
   Shortlisted — Rebuilt design system (v2)
   Premium, instrument-grade, dark-first. Zero external requests.
   Progressive enhancement: fully readable with JS disabled.
   ========================================================================== */

/* ---------- LIGHT (default fallback) ---------- */
:root{
  --paper:#F4F6F8;
  --bg-2:#EBEEF1;
  --surface:#FFFFFF;
  --surface-2:#F1F4F6;
  --ink:#0C1116;
  --ink-2:#41525A;
  --ink-3:#647579;
  --rule:#E1E6EA;
  --rule-soft:#EDF0F2;

  --accent:#0A7C8F;
  --accent-hi:#0E97AB;
  --accent-deep:#0A6373;
  --accent-grad:linear-gradient(135deg,#0E97AB,#0A6373);
  --accent-wash:#E4F0F2;
  --gold:#9A6A12;
  --gold-wash:#F6EEDD;

  --yes:#1C7A4E;
  --yes-wash:#E2F1E9;
  --no:#B23A2C;
  --no-wash:#F8E6E2;

  /* Inverted (brand) sections keep a fixed dark palette in BOTH themes */
  --dk-paper:#070A0D;
  --dk-bg:#0A0E12;
  --dk-bg-2:#0F151B;
  --dk-surface:#131B22;
  --dk-ink:#ECF3F5;
  --dk-ink-2:#A8B9C0;
  --dk-ink-3:#73888F;
  --dk-rule:#1E2A31;
  --dk-rule-soft:#172127;
  --dk-accent:#46D6EC;
  --dk-accent-hi:#6EE3F2;
  --dk-accent-grad:linear-gradient(135deg,#5BE0F0,#1AA6BD);
  --dk-gold:#E0A93B;

  --shadow-s:0 1px 2px rgba(12,17,22,.06);
  --shadow-m:0 2px 6px rgba(12,17,22,.05),0 18px 40px -22px rgba(12,17,22,.22);
  --shadow-l:0 6px 14px rgba(12,17,22,.06),0 40px 80px -32px rgba(12,17,22,.32);
  --glow:0 0 0 1px rgba(70,214,236,.35),0 14px 40px -16px rgba(70,214,236,.45);

  --display:"Iowan Old Style",Georgia,"Times New Roman",serif;
  --sans:"Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,Helvetica,Arial,sans-serif;
  --mono:"Cascadia Code","SFMono-Regular",ui-monospace,Consolas,"Liberation Mono",monospace;
  --maxw:1120px;
  --radius:8px;
}

/* ---------- DARK via OS, unless an explicit light choice is stamped ---------- */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#070A0D; --bg-2:#0C1116; --surface:#10171D; --surface-2:#141D24;
    --ink:#EBF2F4; --ink-2:#A6B8BF; --ink-3:#74878E; --rule:#1E2A31; --rule-soft:#172127;
    --accent:#46D6EC; --accent-hi:#6EE3F2; --accent-deep:#1AA6BD;
    --accent-grad:linear-gradient(135deg,#5BE0F0,#1AA6BD);
    --accent-wash:rgba(70,214,236,.08);
    --gold:#E0A93B; --gold-wash:rgba(224,169,59,.1);
    --yes:#4FB98A; --yes-wash:rgba(79,185,138,.12);
    --no:#E0796B; --no-wash:rgba(224,121,107,.12);
    --dk-paper:#070A0D; --dk-bg:#0A0E12; --dk-bg-2:#0F151B; --dk-surface:#131B22;
    --dk-ink:#ECF3F5; --dk-ink-2:#A8B9C0; --dk-ink-3:#73888E; --dk-rule:#1E2A31;
    --dk-rule-soft:#172127; --dk-accent:#46D6EC; --dk-accent-hi:#6EE3F2;
    --dk-accent-grad:linear-gradient(135deg,#5BE0F0,#1AA6BD); --dk-gold:#E0A93B;
    --shadow-s:0 1px 2px rgba(0,0,0,.5);
    --shadow-m:0 2px 6px rgba(0,0,0,.4),0 18px 40px -22px rgba(0,0,0,.7);
    --shadow-l:0 6px 14px rgba(0,0,0,.4),0 40px 80px -32px rgba(0,0,0,.8);
    --glow:0 0 0 1px rgba(70,214,236,.4),0 14px 40px -16px rgba(70,214,236,.5);
  }
}

/* ---------- DARK via explicit stamp ---------- */
:root[data-theme="dark"]{
  --paper:#070A0D; --bg-2:#0C1116; --surface:#10171D; --surface-2:#141D24;
  --ink:#EBF2F4; --ink-2:#A6B8BF; --ink-3:#74878E; --rule:#1E2A31; --rule-soft:#172127;
  --accent:#46D6EC; --accent-hi:#6EE3F2; --accent-deep:#1AA6BD;
  --accent-grad:linear-gradient(135deg,#5BE0F0,#1AA6BD);
  --accent-wash:rgba(70,214,236,.08);
  --gold:#E0A93B; --gold-wash:rgba(224,169,59,.1);
  --yes:#4FB98A; --yes-wash:rgba(79,185,138,.12);
  --no:#E0796B; --no-wash:rgba(224,121,107,.12);
  --dk-paper:#070A0D; --dk-bg:#0A0E12; --dk-bg-2:#0F151B; --dk-surface:#131B22;
  --dk-ink:#ECF3F5; --dk-ink-2:#A8B9C0; --dk-ink-3:#73888E; --dk-rule:#1E2A31;
  --dk-rule-soft:#172127; --dk-accent:#46D6EC; --dk-accent-hi:#6EE3F2;
  --dk-accent-grad:linear-gradient(135deg,#5BE0F0,#1AA6BD); --dk-gold:#E0A93B;
  --shadow-s:0 1px 2px rgba(0,0,0,.5);
  --shadow-m:0 2px 6px rgba(0,0,0,.4),0 18px 40px -22px rgba(0,0,0,.7);
  --shadow-l:0 6px 14px rgba(0,0,0,.4),0 40px 80px -32px rgba(0,0,0,.8);
  --glow:0 0 0 1px rgba(70,214,236,.4),0 14px 40px -16px rgba(70,214,236,.5);
}

/* ========================= BASE ========================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; } }

body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.narrow{ max-width:760px; margin-left:auto; margin-right:auto; }

h1,h2,h3,h4,h5{ font-family:var(--display); font-weight:600; margin:0; text-wrap:balance; letter-spacing:-.018em; }
h1{ font-size:clamp(2.4rem,5.8vw,4.1rem); line-height:1.03; }
h2{ font-size:clamp(1.8rem,4vw,2.7rem); line-height:1.12; }
h3{ font-size:1.34rem; line-height:1.26; letter-spacing:-.01em; }
h4{ font-size:1.06rem; line-height:1.3; }
p{ margin:0; }
a{ color:var(--accent); text-underline-offset:3px; text-decoration-thickness:1px; transition:color .15s ease; }
strong{ font-weight:660; }
:focus-visible{ outline:2px solid var(--accent-hi); outline-offset:3px; border-radius:4px; }
hr{ border:none; border-top:1px solid var(--rule); margin:0; }

.skip{ position:absolute; left:-9999px; top:0; z-index:200; background:var(--accent); color:#fff; padding:12px 18px; border-radius:0 0 5px 0; font-weight:700; }
.skip:focus{ left:0; }

.eyebrow{ font-family:var(--mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; font-weight:700; color:var(--accent); display:inline-block; }
.dk-accent{ color:var(--dk-accent); }
.mono{ font-family:var(--mono); font-variant-numeric:tabular-nums; }
.lede{ font-size:1.16rem; line-height:1.56; color:var(--ink-2); }
.muted{ color:var(--ink-3); }
.small{ font-size:.85rem; }
.grad{ background:var(--dk-accent-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }

/* ========================= BUTTONS ========================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--sans); font-size:.95rem; font-weight:680; line-height:1;
  padding:15px 26px; border-radius:var(--radius); border:1px solid transparent;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:transform .14s ease, background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--accent-grad); color:#042027; box-shadow:var(--glow); }
:root[data-theme="light"] .btn-primary{ color:#fff; }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 0 0 1px rgba(70,214,236,.5),0 20px 48px -18px rgba(70,214,236,.6); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--rule); }
.btn-ghost:hover{ border-color:var(--accent); color:var(--accent); }
.btn-lg{ padding:18px 32px; font-size:1.02rem; }
.btn-onDark{ background:var(--dk-accent-grad); color:#042027; box-shadow:0 0 0 1px rgba(70,214,236,.3),0 16px 40px -18px rgba(70,214,236,.55); }
.btn-onDark:hover{ transform:translateY(-2px); box-shadow:0 0 0 1px rgba(110,227,242,.6),0 24px 56px -18px rgba(70,214,236,.7); }
.btn-onDarkGhost{ background:transparent; color:var(--dk-ink); border-color:var(--dk-rule); }
.btn-onDarkGhost:hover{ border-color:var(--dk-accent); color:var(--dk-accent); }

/* ========================= HEADER / NAV ========================= */
.nav{ position:sticky; top:0; z-index:100; background:color-mix(in srgb,var(--paper) 82%,transparent); backdrop-filter:blur(14px) saturate(1.2); border-bottom:1px solid var(--rule); }
.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:68px; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); font-weight:760; font-size:1.06rem; letter-spacing:-.01em; }
.brand .mk{ display:grid; place-items:center; width:30px; height:30px; border:1.5px solid var(--accent); border-radius:7px; color:var(--accent); font-family:var(--mono); font-size:.82rem; font-weight:800; flex:none; box-shadow:0 0 18px -6px var(--accent); }
.nav-links{ display:flex; gap:26px; align-items:center; }
.nav-links a{ font-size:.9rem; color:var(--ink-2); text-decoration:none; font-weight:560; white-space:nowrap; position:relative; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:-6px; width:0; height:2px; background:var(--accent); transition:width .2s ease; }
.nav-links a:hover{ color:var(--accent); }
.nav-links a:hover::after{ width:100%; }
.nav-links a[aria-current="page"]{ color:var(--accent); font-weight:700; }
.nav-cta{ flex:none; }
.nav-tools{ display:flex; align-items:center; gap:10px; }
.theme-toggle{ display:inline-grid; place-items:center; width:38px; height:38px; border-radius:8px; border:1px solid var(--rule); background:var(--surface); color:var(--ink-2); cursor:pointer; transition:border-color .15s,color .15s; }
.theme-toggle:hover{ border-color:var(--accent); color:var(--accent); }
.burger{ display:none; width:42px; height:42px; border-radius:8px; border:1px solid var(--rule); background:var(--surface); cursor:pointer; flex-direction:column; gap:4px; align-items:center; justify-content:center; }
.burger span{ width:18px; height:2px; background:var(--ink-2); border-radius:2px; transition:.2s; }
.burger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
.mobile-menu{ display:none; }
@media (max-width:940px){
  .nav-links{ display:none; }
  .burger{ display:flex; }
  .mobile-menu{ display:block; position:fixed; inset:68px 0 auto 0; background:var(--surface); border-bottom:1px solid var(--rule); padding:14px 24px 22px; transform:translateY(-12px); opacity:0; pointer-events:none; transition:.22s ease; z-index:99; box-shadow:var(--shadow-m); }
  .mobile-menu.open{ transform:none; opacity:1; pointer-events:auto; }
  .mobile-menu a{ display:block; padding:13px 4px; color:var(--ink-2); text-decoration:none; font-weight:600; border-bottom:1px solid var(--rule-soft); }
  .mobile-menu a:last-of-type{ border-bottom:none; }
  .mobile-menu .btn{ width:100%; margin-top:14px; }
}
@media (max-width:420px){ .nav-cta{ display:none; } }

/* ========================= SECTIONS ========================= */
section{ padding:96px 0; position:relative; }
section.tight{ padding:68px 0; }
section.flush-top{ padding-top:0; }
.dark{ background:var(--dk-bg); color:var(--dk-ink); }
.dark::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image:radial-gradient(circle at 50% 0,rgba(70,214,236,.07),transparent 60%); }
.dark h1,.dark h2,.dark h3,.dark h4{ color:var(--dk-ink); }
.dark p,.dark li{ color:var(--dk-ink-2); }
.dark .eyebrow{ color:var(--dk-accent); }
.dark a:not(.btn){ color:var(--dk-accent); }
.sechead{ display:flex; flex-direction:column; gap:16px; margin-bottom:46px; max-width:68ch; }
.sechead.center{ margin-left:auto; margin-right:auto; text-align:center; align-items:center; }

/* reveal on scroll */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1!important; transform:none!important; } }

/* ========================= PAGE HEADER ========================= */
.pagehead{ padding:66px 0 46px; border-bottom:1px solid var(--rule); background:linear-gradient(180deg,var(--surface-2),var(--paper)); }
.pagehead .inner{ display:flex; flex-direction:column; gap:16px; max-width:72ch; }
.crumbs{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
.crumbs a{ color:var(--ink-3); text-decoration:none; }
.crumbs a:hover{ color:var(--accent); }
.crumbs span[aria-hidden]{ opacity:.5; }
.updated{ font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }

/* ========================= ANSWER BLOCK (AEO) ========================= */
.answer{ background:var(--accent-wash); border:1px solid color-mix(in srgb,var(--accent) 26%,transparent); border-left:3px solid var(--accent); border-radius:0 6px 6px 0; padding:22px 26px; display:flex; flex-direction:column; gap:9px; }
.answer .tag{ font-family:var(--mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); font-weight:800; }
.answer p{ font-size:1.04rem; line-height:1.62; color:var(--ink); }
.dark .answer{ background:rgba(70,214,236,.07); border-color:var(--dk-rule); border-left-color:var(--dk-accent); }
.dark .answer p{ color:var(--dk-ink); }
.dark .answer .tag{ color:var(--dk-accent); }

/* ========================= PROSE ========================= */
.prose{ display:flex; flex-direction:column; gap:22px; max-width:72ch; }
.prose h2{ margin-top:24px; }
.prose h3{ margin-top:16px; }
.prose ul,.prose ol{ margin:0; padding-left:24px; display:flex; flex-direction:column; gap:10px; color:var(--ink-2); }
.prose li strong{ color:var(--ink); }
.prose p{ color:var(--ink-2); }
.prose > p:first-of-type{ font-size:1.08rem; }

ul.clean{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
ul.clean li{ padding-left:22px; position:relative; color:var(--ink-2); }
ul.clean li::before{ content:""; position:absolute; left:0; top:.7em; width:9px; height:1px; background:var(--accent); }
ul.clean li strong{ color:var(--ink); }
.dark ul.clean li::before{ background:var(--dk-accent); }
.dark ul.clean li strong{ color:var(--dk-ink); }

ul.ticks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
ul.ticks li{ padding-left:30px; position:relative; color:var(--ink-2); }
ul.ticks li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--yes); font-weight:800; }
ul.ticks li strong{ color:var(--ink); }
.dark ul.ticks li{ color:var(--dk-ink-2); }
.dark ul.ticks li strong{ color:var(--dk-ink); }

/* ========================= TOC ========================= */
.toc{ background:var(--surface); border:1px solid var(--rule); border-radius:8px; padding:24px 28px; display:flex; flex-direction:column; gap:14px; box-shadow:var(--shadow-s); }
.toc ol{ margin:0; padding:0; list-style:none; counter-reset:t; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px 26px; }
.toc li{ counter-increment:t; }
.toc a{ font-size:.9rem; text-decoration:none; color:var(--ink-2); display:flex; gap:11px; }
.toc a::before{ content:counter(t,decimal-leading-zero); font-family:var(--mono); font-size:.7rem; color:var(--ink-3); padding-top:3px; flex:none; }
.toc a:hover{ color:var(--accent); }

/* ========================= CARDS / BOXES ========================= */
.grid2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; }
.grid3{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }
.box{ background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:28px; display:flex; flex-direction:column; gap:12px; box-shadow:var(--shadow-s); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.box:hover{ transform:translateY(-4px); border-color:color-mix(in srgb,var(--accent) 40%,var(--rule)); box-shadow:var(--shadow-m); }
.box p{ font-size:.94rem; color:var(--ink-2); }
.box .ic{ font-family:var(--mono); font-size:.66rem; font-weight:800; color:var(--accent); letter-spacing:.12em; text-transform:uppercase; }
.dark .box{ background:var(--dk-bg-2); border-color:var(--dk-rule); }
.dark .box p{ color:var(--dk-ink-2); }
.dark .box .ic{ color:var(--dk-accent); }
.dark .box:hover{ border-color:color-mix(in srgb,var(--dk-accent) 45%,var(--dk-rule)); }

.callout{ background:var(--surface); border:1px solid var(--rule); border-left:3px solid var(--accent); padding:26px 30px; border-radius:0 8px 8px 0; box-shadow:var(--shadow-m); display:flex; flex-direction:column; gap:12px; }
.callout p{ font-family:var(--display); font-size:1.12rem; line-height:1.56; color:var(--ink-2); }
.callout p strong{ color:var(--ink); }
.dark .callout{ background:var(--dk-bg-2); border-color:var(--dk-rule); border-left-color:var(--dk-accent); }
.dark .callout p{ color:var(--dk-ink-2); }
.dark .callout p strong{ color:var(--dk-ink); }

/* ========================= STATS ========================= */
.statbar{ border-top:1px solid var(--dk-rule); border-bottom:1px solid var(--dk-rule); background:var(--dk-bg-2); position:relative; }
.statbar::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(70,214,236,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(70,214,236,.04) 1px,transparent 1px); background-size:48px 48px; pointer-events:none; }
.statbar-in{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); position:relative; }
.sb{ padding:34px 26px; border-right:1px solid var(--dk-rule); display:flex; flex-direction:column; gap:8px; }
.sb:last-child{ border-right:none; }
.sb .n{ font-family:var(--mono); font-size:2.1rem; font-weight:700; color:var(--dk-accent); line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.sb .l{ font-size:.82rem; color:var(--dk-ink-2); line-height:1.45; }
@media (max-width:640px){ .sb{ border-right:none; border-bottom:1px solid var(--dk-rule); } .sb:last-child{ border-bottom:none; } }

/* ========================= TABLES ========================= */
.tscroll{ overflow-x:auto; border:1px solid var(--rule); border-radius:10px; background:var(--surface); box-shadow:var(--shadow-s); }
table{ border-collapse:collapse; width:100%; min-width:600px; font-size:.88rem; }
caption{ text-align:left; padding:16px 18px 12px; font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); font-weight:700; }
thead th{ text-align:left; padding:13px 16px; background:var(--surface-2); font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); font-weight:700; border-bottom:1px solid var(--rule); vertical-align:bottom; }
tbody td,tbody th{ padding:14px 16px; border-bottom:1px solid var(--rule-soft); vertical-align:top; color:var(--ink-2); line-height:1.5; text-align:left; font-weight:400; }
tbody tr:last-child td,tbody tr:last-child th{ border-bottom:none; }
tbody tr:hover td,tbody tr:hover th{ background:var(--surface-2); }
th[scope="row"]{ color:var(--ink); font-weight:680; }
td.num{ font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap; }
.dark .tscroll{ background:var(--dk-bg-2); border-color:var(--dk-rule); }
.dark thead th{ background:rgba(255,255,255,.03); color:var(--dk-ink-2); border-bottom-color:var(--dk-rule); }
.dark tbody td,.dark tbody th{ border-bottom-color:var(--dk-rule); color:var(--dk-ink-2); }
.dark th[scope="row"]{ color:var(--dk-ink); }
.dark tbody tr:hover td,.dark tbody tr:hover th{ background:rgba(255,255,255,.02); }

.pill{ display:inline-block; font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; padding:2px 8px; border-radius:3px; font-weight:700; white-space:nowrap; }
.pill.g{ border:1px solid var(--yes); color:var(--yes); }
.pill.w{ border:1px solid var(--gold); color:var(--gold); }
.pill.b{ border:1px solid var(--no); color:var(--no); }
.pill.a{ background:var(--accent-wash); color:var(--accent); }

/* ========================= DEFINITION LIST (GLOSSARY) ========================= */
.defs{ display:flex; flex-direction:column; gap:0; border:1px solid var(--rule); border-radius:10px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow-s); }
.def{ padding:26px 28px; border-bottom:1px solid var(--rule-soft); display:flex; flex-direction:column; gap:9px; scroll-margin-top:92px; }
.def:last-child{ border-bottom:none; }
.def dt{ font-family:var(--display); font-size:1.22rem; font-weight:600; color:var(--ink); letter-spacing:-.01em; }
.def dt .abbr{ font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; color:var(--ink-3); margin-left:9px; text-transform:uppercase; }
.def dd{ margin:0; font-size:.95rem; color:var(--ink-2); line-height:1.62; }
.def dd + dd{ margin-top:8px; }
.def dd.also{ font-size:.83rem; color:var(--ink-3); }
.def dd.also a{ color:var(--accent); }

/* ========================= FAQ ========================= */
.faq{ border:1px solid var(--rule); border-radius:10px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow-s); }
details{ border-bottom:1px solid var(--rule-soft); }
details:last-child{ border-bottom:none; }
summary{ cursor:pointer; padding:20px 24px; font-weight:640; font-size:1.02rem; color:var(--ink); display:flex; align-items:center; gap:14px; list-style:none; transition:background .15s; }
summary::-webkit-details-marker{ display:none; }
summary:hover{ background:var(--surface-2); }
summary::after{ content:"+"; margin-left:auto; font-family:var(--mono); font-size:1.3rem; color:var(--accent); font-weight:400; flex:none; transition:transform .2s; }
details[open] summary::after{ transform:rotate(45deg); }
details .a{ padding:0 24px 22px; font-size:.95rem; color:var(--ink-2); line-height:1.64; max-width:74ch; }
details .a p + p{ margin-top:11px; }
details .a ul{ margin:11px 0 0; padding-left:22px; display:flex; flex-direction:column; gap:7px; }

/* ========================= STEPS ========================= */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); border:1px solid var(--rule); border-radius:10px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow-m); }
.stp{ padding:32px 26px; border-right:1px solid var(--rule); display:flex; flex-direction:column; gap:12px; }
.stp:last-child{ border-right:none; }
.stp .sn{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:800; }
.stp p{ font-size:.92rem; color:var(--ink-2); }
.stp .when{ margin-top:auto; padding-top:12px; font-family:var(--mono); font-size:.7rem; color:var(--ink-3); border-top:1px solid var(--rule-soft); }
@media (max-width:820px){ .stp{ border-right:none; border-bottom:1px solid var(--rule); } .stp:last-child{ border-bottom:none; } }

/* ========================= RULES (numbered method) ========================= */
.rules{ border:1px solid var(--dk-rule); border-radius:10px; overflow:hidden; background:var(--dk-bg-2); }
.rule{ display:grid; grid-template-columns:84px 1fr; border-bottom:1px solid var(--dk-rule); }
.rule:last-child{ border-bottom:none; }
.rule .rn{ display:grid; place-items:center; font-family:var(--mono); font-size:1rem; font-weight:800; color:var(--dk-accent); border-right:1px solid var(--dk-rule); background:rgba(70,214,236,.05); }
.rule .rb{ padding:24px 28px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.rule .rb h3{ color:var(--dk-ink); font-size:1.1rem; }
.rule .rb p{ font-size:.93rem; color:var(--dk-ink-2); }
@media (max-width:600px){ .rule{ grid-template-columns:1fr; } .rule .rn{ padding:14px 28px 0; place-items:start; border-right:none; background:none; } .rule .rb{ padding-top:8px; } }

/* ========================= HERO + DEMO ========================= */
.hero{ padding:88px 0 96px; position:relative; overflow:hidden; background:var(--dk-bg); }
.hero::after{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(900px 460px at 80% -10%,rgba(70,214,236,.12),transparent 62%),radial-gradient(700px 380px at 10% 110%,rgba(70,214,236,.05),transparent 60%); }
.hero-in{ position:relative; z-index:1; display:grid; grid-template-columns:1.04fr .96fr; gap:56px; align-items:center; }
@media (max-width:940px){ .hero-in{ grid-template-columns:1fr; gap:44px; } }
.hero h1 em{ font-style:normal; color:var(--dk-accent); }
.hero-copy{ display:flex; flex-direction:column; gap:26px; }
.hero .lede{ max-width:54ch; font-size:1.2rem; color:var(--dk-ink-2); }
.cta-row{ display:flex; flex-wrap:wrap; gap:13px; align-items:center; }
.cta-sub{ font-size:.84rem; color:var(--dk-ink-3); display:flex; align-items:center; gap:8px; }

.demo{ background:var(--dk-bg-2); border:1px solid var(--dk-rule); border-radius:12px; box-shadow:var(--shadow-l); overflow:hidden; position:relative; }
.demo::before{ content:""; position:absolute; inset:0; background:radial-gradient(420px 200px at 90% 0,rgba(70,214,236,.08),transparent 70%); pointer-events:none; }
.demo-bar{ display:flex; align-items:center; gap:10px; padding:12px 15px; border-bottom:1px solid var(--dk-rule); background:rgba(255,255,255,.02); position:relative; }
.demo-bar .dot{ width:9px; height:9px; border-radius:50%; background:var(--dk-rule); }
.demo-bar .lbl{ font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dk-ink-3); margin-left:4px; }
.demo-bar .badge{ margin-left:auto; font-family:var(--mono); font-size:.56rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dk-ink-3); border:1px solid var(--dk-rule); padding:2px 7px; border-radius:3px; }
.demo-body{ padding:22px; display:flex; flex-direction:column; gap:16px; min-height:330px; }
.q,.ans{ display:flex; gap:11px; align-items:flex-start; }
.q .who,.ans .who{ font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; padding-top:4px; min-width:36px; flex:none; }
.q .who{ color:var(--dk-ink-3); }
.ans .who{ color:var(--dk-accent); }
.q .txt{ font-size:.98rem; color:var(--dk-ink); font-weight:600; }
.ans .txt{ font-size:.94rem; color:var(--dk-ink-2); line-height:1.62; min-height:1.6em; white-space:pre-wrap; }
.ans .txt .caret{ display:inline-block; width:7px; height:1.05em; background:var(--dk-accent); vertical-align:-2px; animation:blink 1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.named{ color:var(--dk-ink); font-weight:700; border-bottom:1.5px solid var(--yes); }
.verdict{ margin-top:auto; display:flex; align-items:center; gap:12px; padding:15px 16px; border:1px dashed var(--no); border-radius:6px; background:rgba(178,58,44,.1); opacity:0; transform:translateY(6px); transition:opacity .5s ease,transform .5s ease; }
.verdict.on{ opacity:1; transform:none; }
.verdict .x{ font-family:var(--mono); font-weight:800; color:var(--no); font-size:1.1rem; line-height:1; }
.verdict .t{ font-size:.85rem; color:var(--dk-ink); }
.verdict .t strong{ color:var(--no); }
.replay{ background:none; border:none; color:var(--dk-ink-3); font-family:var(--mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; padding:4px 0; text-align:left; transition:color .15s; }
.replay:hover{ color:var(--dk-accent); }

/* ========================= BENCHMARK WIDGET ========================= */
.bench{ background:var(--surface); border:1px solid var(--rule); border-radius:12px; box-shadow:var(--shadow-m); overflow:hidden; }
.bench-tabs{ display:flex; flex-wrap:wrap; border-bottom:1px solid var(--rule); background:var(--surface-2); }
.bench-tabs button{ flex:1 1 auto; min-width:140px; padding:16px 16px; background:none; border:none; cursor:pointer; font-family:var(--mono); font-size:.65rem; letter-spacing:.11em; text-transform:uppercase; font-weight:700; color:var(--ink-3); border-bottom:2px solid transparent; border-right:1px solid var(--rule-soft); transition:color .15s,border-color .15s,background .15s; }
.bench-tabs button:last-child{ border-right:none; }
.bench-tabs button:hover{ color:var(--ink); }
.bench-tabs button[aria-selected="true"]{ color:var(--accent); border-bottom-color:var(--accent); background:var(--surface); }
.bench-body{ padding:30px 32px; display:flex; flex-direction:column; gap:20px; }
.bench-q{ font-family:var(--mono); font-size:.8rem; color:var(--ink-3); }
.bench-q strong{ color:var(--ink); font-weight:600; }
.bars{ display:flex; flex-direction:column; gap:14px; }
.bar{ display:grid; grid-template-columns:140px 1fr 54px; align-items:center; gap:14px; }
@media (max-width:560px){ .bar{ grid-template-columns:104px 1fr 44px; gap:10px; } }
.bar .nm{ font-size:.92rem; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bar .track{ height:28px; background:var(--surface-2); border:1px solid var(--rule-soft); border-radius:3px; overflow:hidden; }
.bar .fill{ height:100%; width:0; border-radius:1px; transition:width .9s cubic-bezier(.22,1,.36,1); }
.bar .fill.win{ background:linear-gradient(90deg,var(--yes),color-mix(in srgb,var(--yes) 72%,transparent)); }
.bar .fill.lose{ background:linear-gradient(90deg,var(--no),color-mix(in srgb,var(--no) 72%,transparent)); }
.bar .sc{ font-family:var(--mono); font-size:.98rem; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; color:var(--ink); }
.bench-note{ font-size:.82rem; color:var(--ink-3); border-top:1px solid var(--rule-soft); padding-top:16px; line-height:1.55; }
.bench-gap{ display:inline-flex; align-items:center; gap:8px; font-size:.9rem; color:var(--ink-2); background:var(--no-wash); border:1px solid color-mix(in srgb,var(--no) 30%,transparent); padding:9px 14px; border-radius:5px; align-self:flex-start; }
.bench-gap strong{ color:var(--no); font-family:var(--mono); font-weight:800; }

/* ========================= PRICING ========================= */
.prices{ display:grid; grid-template-columns:repeat(auto-fit,minmax(274px,1fr)); gap:20px; align-items:stretch; }
.price{ background:var(--surface); border:1px solid var(--rule); border-radius:12px; padding:32px 30px; display:flex; flex-direction:column; gap:16px; box-shadow:var(--shadow-s); position:relative; transition:transform .2s ease,box-shadow .2s ease; }
.price:hover{ transform:translateY(-4px); box-shadow:var(--shadow-m); }
.price.feature{ border-color:var(--accent); border-width:1.5px; box-shadow:var(--shadow-l); }
.price.feature::before{ content:""; position:absolute; inset:0; border-radius:12px; background:var(--accent-wash); opacity:.5; pointer-events:none; }
:root[data-theme="dark"] .price.feature::before{ background:rgba(70,214,236,.05); }
.price .flag{ position:absolute; top:0; right:20px; transform:translateY(-50%); font-family:var(--mono); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase; font-weight:800; background:var(--accent-grad); color:#042027; padding:5px 11px; border-radius:3px; }
.price .pname{ font-family:var(--display); font-size:1.26rem; font-weight:600; color:var(--ink); position:relative; }
.price .amt{ font-family:var(--mono); font-size:2.2rem; font-weight:700; color:var(--ink); line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; position:relative; }
.price .amt span{ font-size:.84rem; color:var(--ink-3); font-weight:400; letter-spacing:0; }
.price .desc{ font-size:.88rem; color:var(--ink-2); position:relative; }
.price ul{ list-style:none; margin:0; padding:16px 0 0; display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--rule-soft); position:relative; }
.price li{ font-size:.87rem; color:var(--ink-2); padding-left:24px; position:relative; line-height:1.46; }
.price li::before{ content:"›"; position:absolute; left:4px; top:-1px; color:var(--accent); font-weight:800; }
.price .btn{ margin-top:auto; width:100%; position:relative; }

/* ========================= FORM ========================= */
.formwrap{ display:grid; grid-template-columns:1fr .92fr; gap:46px; align-items:start; }
@media (max-width:900px){ .formwrap{ grid-template-columns:1fr; gap:34px; } }
form.lead{ background:var(--dk-bg-2); border:1px solid var(--dk-rule); border-radius:12px; padding:32px 30px 28px; display:flex; flex-direction:column; gap:16px; box-shadow:var(--shadow-l); }
.field{ display:flex; flex-direction:column; gap:7px; }
.field label{ font-family:var(--mono); font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--dk-ink-3); font-weight:700; }
.field label .opt{ text-transform:none; letter-spacing:0; }
.field input,.field select,.field textarea{ font-family:var(--sans); font-size:.96rem; color:var(--dk-ink); background:rgba(255,255,255,.03); border:1px solid var(--dk-rule); border-radius:5px; padding:13px 14px; width:100%; transition:border-color .15s,box-shadow .15s; }
.field textarea{ resize:vertical; min-height:78px; }
.field input::placeholder,.field textarea::placeholder{ color:var(--dk-ink-3); }
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--dk-accent); outline:none; box-shadow:0 0 0 3px rgba(70,214,236,.15); }
.frow{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:520px){ .frow{ grid-template-columns:1fr; } }
.fnote{ font-size:.8rem; color:var(--dk-ink-3); line-height:1.55; }
.fnote a{ color:var(--dk-accent); }
.status{ font-size:.85rem; padding:12px 14px; border-radius:5px; display:none; }
.status.on{ display:block; }
.status.ok{ background:var(--yes-wash); color:var(--yes); border:1px solid color-mix(in srgb,var(--yes) 34%,transparent); }
.status.err{ background:var(--no-wash); color:var(--no); border:1px solid color-mix(in srgb,var(--no) 34%,transparent); }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.sell{ display:flex; flex-direction:column; gap:20px; }

/* ========================= CROSS-LINKS ========================= */
.readnext{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.rn-card{ background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:24px 26px; display:flex; flex-direction:column; gap:8px; text-decoration:none; box-shadow:var(--shadow-s); transition:border-color .15s,transform .15s,box-shadow .15s; }
.rn-card:hover{ border-color:var(--accent); transform:translateY(-3px); box-shadow:var(--shadow-m); }
.rn-card .k{ font-family:var(--mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:800; }
.rn-card .t{ font-family:var(--display); font-size:1.1rem; font-weight:600; color:var(--ink); line-height:1.3; }
.rn-card .d{ font-size:.85rem; color:var(--ink-2); line-height:1.5; }

/* ========================= FOOTER ========================= */
footer{ background:var(--dk-bg); border-top:1px solid var(--dk-rule); padding:60px 0 42px; position:relative; }
footer::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(70,214,236,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(70,214,236,.03) 1px,transparent 1px); background-size:48px 48px; pointer-events:none; }
.foot{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:32px; position:relative; }
@media (max-width:820px){ .foot{ grid-template-columns:1fr 1fr; gap:28px; } }
@media (max-width:480px){ .foot{ grid-template-columns:1fr; } }
.foot .col{ display:flex; flex-direction:column; gap:9px; }
.foot a{ color:var(--dk-ink-2); text-decoration:none; font-size:.86rem; transition:color .15s; }
.foot a:hover{ color:var(--dk-accent); }
.foot .ttl{ font-family:var(--mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dk-ink-3); font-weight:700; margin-bottom:3px; }
.foot p{ font-size:.86rem; color:var(--dk-ink-2); line-height:1.55; }
.legal{ margin-top:38px; padding-top:22px; border-top:1px solid var(--dk-rule); font-size:.76rem; color:var(--dk-ink-3); line-height:1.65; max-width:92ch; position:relative; }
.legal a{ color:var(--dk-ink-2); }

/* ========================= UTILITIES ========================= */
.vh{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.stack{ display:flex; flex-direction:column; }
.gap-s{ gap:12px; } .gap-m{ gap:20px; } .gap-l{ gap:32px; }
.mt-l{ margin-top:34px; } .mt-m{ margin-top:22px; }

/* ========================= CITABLE / SOURCE / CLAIM ========================= */
/* Inline source citations — the single highest-leverage GEO signal (Princeton KDD 2024:
   citing external sources lifts visibility +115%; ChatGPT weights cited claims ~40% higher). */
.cite{ font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.02em; vertical-align:super; line-height:0; color:var(--accent); text-decoration:none; padding:0 1px; white-space:nowrap; }
.cite:hover{ text-decoration:underline; }
.dark .cite{ color:var(--dk-accent); }
.cite::before{ content:"["; }
.cite::after{ content:"]"; }
/* grouped source list at foot of a section */
.sources{ margin-top:22px; border-top:1px dashed var(--rule); padding-top:14px; font-size:.76rem; color:var(--ink-2); line-height:1.8; }
.sources .lbl{ font-family:var(--mono); text-transform:uppercase; letter-spacing:.12em; font-size:.6rem; color:var(--accent); font-weight:800; display:block; margin-bottom:6px; }
.sources ol{ margin:0; padding-left:18px; }
.sources li{ margin:0; }
.dark .sources{ border-top-color:var(--dk-rule); color:var(--dk-ink-3); }
.dark .sources .lbl{ color:var(--dk-accent); }
.sources a{ color:var(--accent); }
.dark .sources a{ color:var(--dk-accent); }

/* Citable definition block — front-loaded BLUF, the format Claude (+30%) & Perplexity favor */
.citable{ border-left:3px solid var(--accent); background:var(--surface); border-radius:0 10px 10px 0; padding:18px 22px; margin:22px 0; }
.citable .bl{ font-family:var(--mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:800; display:block; margin-bottom:8px; }
.citable p{ margin:0; font-size:1.02rem; line-height:1.6; color:var(--ink); }
.dark .citable{ border-left-color:var(--dk-accent); background:var(--dk-surface); }
.dark .citable .bl{ color:var(--dk-accent); }
.dark .citable p{ color:var(--dk-ink); }

/* "How we know this works" — turns the method into the firm's own proof */
.proof{ display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center; }
@media (max-width:820px){ .proof{ grid-template-columns:1fr; gap:20px; } }
.proof .stats{ display:flex; flex-direction:column; gap:14px; }
.proof .ps{ display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:baseline; background:var(--dk-surface); border:1px solid var(--dk-rule); border-radius:9px; padding:14px 16px; }
.proof .ps .v{ font-family:var(--display); font-weight:700; font-size:1.5rem; color:var(--dk-accent); line-height:1; white-space:nowrap; }
.proof .ps .x{ font-size:.88rem; color:var(--dk-ink-2); line-height:1.5; }
.proof .ps .x b{ color:var(--dk-ink); font-weight:600; }

/* ========================= PRINT ========================= */
@media print{
  .nav,.theme-toggle,.burger,.mobile-menu,.demo,.cta-sub{ display:none!important; }
  body{ background:#fff; color:#000; }
  .dark{ background:#fff; color:#000; }
  .reveal{ opacity:1!important; transform:none!important; }
}