/* ============ Tokens ============ */
:root{
  --paper:#FAFAF8; --ink:#0A0E1F; --cobalt:#2646FF; --yellow:#FFD23F; --violet:#7A5CFF;
  --coral:#FF5A36; --teal:#0FB5A6; --amber:#F5A524;
  --nav-h:64px;
  --pad:clamp(20px,5vw,72px);
  --max:1240px;
  --chapter:clamp(88px,12vw,168px);
  --r-lg:28px; --r-md:18px; --r-sm:12px;
  box-sizing:border-box;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:calc(var(--nav-h) + env(safe-area-inset-top,0px) + 16px);-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.55;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
@media (min-width:768px){body{font-size:19px}}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img,svg,canvas,video{display:block;max-width:100%}
button{font:inherit;color:inherit}

/* ============ Chapter theming ============ */
.chapter{
  --bg:var(--paper); --fg:var(--ink);
  --muted:rgba(10,14,31,.7); --line:rgba(10,14,31,.14); --tile:rgba(10,14,31,.045);
  --accent:var(--cobalt); --focus:var(--cobalt);
  position:relative;background:var(--bg);color:var(--fg);
}
.chapter[data-theme="dark"]{
  --bg:var(--ink); --fg:var(--paper);
  --muted:rgba(250,250,248,.72); --line:rgba(250,250,248,.18); --tile:rgba(250,250,248,.06);
  --accent:var(--paper); --focus:var(--yellow);
}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.chapter-pad{padding-block:var(--chapter)}

/* ============ Type ============ */
h1,h2{font-weight:800;letter-spacing:-.02em;line-height:1.05;text-wrap:balance}
#who-h,#hl-h,#where-h,#why-h,#part-h,#proof-h,#ins-h{font-size:clamp(40px,7vw,108px);letter-spacing:-.03em;line-height:1.02;max-width:16ch}
h1{font-size:clamp(44px,6vw,72px)}
h2{font-size:clamp(34px,4.4vw,52px);max-width:20ch}
h3{font-size:24px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;line-height:1.4;color:var(--muted)}
.chapter[data-theme="light"] .chapter-head .eyebrow{color:var(--cobalt)}
.chapter-head{display:grid;gap:18px;margin-bottom:clamp(40px,6vw,72px)}
.muted{color:var(--muted)}

/* ============ Buttons ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:12px 26px;border-radius:999px;border:1.5px solid var(--cobalt);
  background:var(--cobalt);color:#fff;font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.2;text-align:center;text-decoration:none;
  cursor:pointer;transition:background-color .2s,color .2s,border-color .2s;
}
.btn:hover{background:#1B36D6;border-color:#1B36D6}
.btn.ghost{background:transparent;color:var(--fg);border-color:currentColor}
.btn.ghost:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn-sm{min-height:40px;padding:8px 18px;font-size:13px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}
:focus-visible{outline:3px solid var(--focus,#2646FF);outline-offset:3px;border-radius:6px}
.btn:focus-visible{border-radius:999px}

/* ============ Nav ============ */
.nav{
  --nfg:var(--ink); --nbg:rgba(250,250,248,.74); --nline:rgba(10,14,31,.1); --focus:var(--cobalt);
  position:fixed;inset:0 0 auto 0;z-index:50;
  padding-top:env(safe-area-inset-top,0px);
  color:var(--nfg);background:var(--nbg);border-bottom:1px solid var(--nline);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  transition:background-color .3s,color .3s,border-color .3s;
}
.nav[data-theme="dark"]{--nfg:var(--paper);--nbg:rgba(10,14,31,.72);--nline:rgba(250,250,248,.14);--focus:var(--yellow)}
.nav-in{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1}
.brand-name{font-weight:800;font-size:19px;letter-spacing:-.02em}
.brand-blue{color:var(--cobalt);transition:color .3s}
.nav[data-theme="dark"] .brand-blue{color:#6B82FF}
.brand-slogan{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.72;margin-top:3px}
.nav-right{display:flex;align-items:center;gap:8px}
.nav-links{display:none;align-items:center;gap:4px}
.nav-links a{padding:10px 14px;font-size:15px;font-weight:500;text-decoration:none;border-radius:999px;opacity:.86}
.nav-links a:hover{opacity:1;background:var(--nline)}
.nav .btn{transition:background-color .3s,color .3s,border-color .3s}
.nav[data-theme="dark"] .btn{background:var(--paper);border-color:var(--paper);color:var(--ink)}
.menu-btn{
  display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  background:none;border:0;border-radius:999px;cursor:pointer;
}
.menu-btn span,.menu-btn span::before{content:"";display:block;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .25s}
.menu-btn span{transform:translateY(-3px)}
.menu-btn span::before{transform:translateY(6px)}
.menu-btn[aria-expanded="true"] span{transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] span::before{transform:rotate(-90deg)}
.nav.menu-open{--nbg:var(--paper)}
.nav.menu-open[data-theme="dark"]{--nbg:var(--ink)}
.nav-sheet{display:none;padding:4px 0 20px}
.nav-sheet.open{display:block}
.nav-sheet a{display:block;padding:14px 0;font-size:22px;font-weight:700;letter-spacing:-.01em;text-decoration:none;border-top:1px solid var(--nline)}
@media (min-width:768px){
  .nav-links{display:flex}
  .menu-btn,.nav-sheet,.nav-sheet.open{display:none}
  .nav-right{gap:14px}
}