/* What Owners Need — shared stylesheet, v2
   Brand tokens: navy, gold, paper. Archivo, Newsreader, IBM Plex Mono. */

:root{
  --navy:#16293F;
  --navy-deep:#101F31;
  --navy-raised:#1E3550;
  --navy-line:#2C4562;
  --gold:#B8902B;
  --gold-bright:#D8B04A;
  --gold-text:#7C6018;
  --paper:#F4F2EC;
  --paper-sunk:#EAE7DF;
  --sheet:#FFFFFF;
  --ink:#14202E;
  --ink-muted:#4C5862;
  --on-navy:#F4F2EC;
  --on-navy-muted:#A9B6C4;
  --rule:#D2CEC4;
  --border-strong:#78818A;

  --r-sm:4px; --r-md:8px; --r-lg:14px; --r-xl:20px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* Depth. Shadows are tinted navy so they sit in the palette. */
  --sh-1:0 1px 2px rgba(16,31,49,.06), 0 3px 8px rgba(16,31,49,.05);
  --sh-2:0 1px 2px rgba(16,31,49,.05), 0 6px 14px -4px rgba(16,31,49,.10), 0 18px 36px -18px rgba(16,31,49,.22);
  --sh-3:0 2px 4px rgba(16,31,49,.05), 0 14px 28px -10px rgba(16,31,49,.18), 0 40px 70px -30px rgba(16,31,49,.40);
  --sh-dark:0 2px 4px rgba(0,0,0,.20), 0 24px 48px -20px rgba(0,0,0,.55);

  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-spring:cubic-bezier(.3,1.35,.5,1);

  --sans:Archivo,system-ui,-apple-system,sans-serif;
  --serif:Newsreader,Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --surface:var(--paper);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:104px;}

body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--serif); font-size:18px; line-height:31px;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--sans); letter-spacing:-.022em; margin:0; text-wrap:balance;}
p{margin:0; text-wrap:pretty;}
a{color:var(--ink); text-decoration-color:var(--gold); text-underline-offset:3px;}
:focus-visible{outline:2px solid var(--gold-bright); outline-offset:3px; border-radius:3px;}
img{max-width:100%; display:block;}
::selection{background:var(--gold-bright); color:var(--navy);}

.wrap{max-width:1120px; margin:0 auto; padding:0 var(--s6);}
.narrow{max-width:700px;}
.skip{
  position:absolute; left:-9999px; background:var(--gold); color:var(--navy);
  font-family:var(--sans); font-weight:600;
  padding:var(--s3) var(--s5); border-radius:0 0 var(--r-md) 0; z-index:100;
}
.skip:focus{left:0; top:0;}

/* ===================== page-to-page transition ===================== */
@view-transition{navigation:auto;}
::view-transition-old(root){animation:vt-out .2s ease both;}
::view-transition-new(root){animation:vt-in .45s var(--ease) both;}
@keyframes vt-out{to{opacity:0; transform:translateY(-8px);}}
@keyframes vt-in{from{opacity:0; transform:translateY(14px);}}
.nav{view-transition-name:site-nav;}

/* ===================== nav ===================== */
.nav{
  position:sticky; top:0; z-index:50;
  background:var(--navy);
  -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid rgba(44,69,98,.7);
  transition:background .3s ease, box-shadow .3s ease;
}
.nav.is-scrolled{
  background:rgba(16,31,49,.90);
  box-shadow:0 10px 30px -12px rgba(0,0,0,.55);
}
.nav .inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s5); padding-top:14px; padding-bottom:14px;
  transition:padding .3s var(--ease);
}
.nav.is-scrolled .inner{padding-top:9px; padding-bottom:9px;}
.nav-progress{
  position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold-bright));
  transform-origin:0 50%; transform:scaleX(var(--scroll,0));
}

.brand{display:flex; align-items:center; gap:var(--s3); text-decoration:none;}
.brand img{
  width:42px; height:42px; border-radius:50%;
  box-shadow:0 0 0 1px rgba(216,176,74,.35), 0 6px 14px -4px rgba(0,0,0,.5);
  transition:transform .5s var(--ease-spring);
}
.brand:hover img{transform:rotate(-8deg) scale(1.05);}
.brand-text{display:flex; flex-direction:column; gap:3px;}
.brand b{
  font-family:var(--sans); font-weight:700; font-size:17.5px; line-height:1;
  color:var(--on-navy); letter-spacing:-.01em; white-space:nowrap;
}
.brand i{
  font-family:var(--sans); font-style:normal; font-weight:600;
  font-size:10px; line-height:1; letter-spacing:.17em; text-transform:uppercase;
  color:var(--gold-bright); white-space:nowrap;
}
.nav ul{
  display:flex; align-items:center; gap:var(--s6);
  list-style:none; margin:0; padding:0;
}
.nav a.link{
  position:relative; display:block;
  font-family:var(--sans); font-size:15px; font-weight:500;
  color:var(--on-navy-muted); text-decoration:none; padding:var(--s2) 0;
  transition:color .2s ease;
}
.nav a.link::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:var(--gold-bright); border-radius:2px;
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform .35s var(--ease);
}
.nav a.link:hover{color:var(--on-navy);}
.nav a.link:hover::after,
.nav a.link[aria-current="page"]::after{transform:scaleX(1);}
.nav a.link[aria-current="page"]{color:var(--on-navy);}
.nav .nav-cta{
  font-family:var(--sans); font-size:14.5px; font-weight:600; text-decoration:none;
  color:var(--navy); background:var(--gold); padding:9px 16px; border-radius:var(--r-md);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 6px 14px -6px rgba(0,0,0,.6);
  transition:background .2s ease, transform .2s var(--ease);
}
.nav .nav-cta:hover{background:var(--gold-bright); transform:translateY(-1px);}

.nav-toggle{
  display:none; width:44px; height:44px; padding:0; border:0; cursor:pointer;
  background:transparent; border-radius:var(--r-md); position:relative;
}
.nav-toggle span{
  position:absolute; left:11px; right:11px; height:2px; border-radius:2px;
  background:var(--on-navy); transition:transform .3s var(--ease), opacity .2s ease, top .3s var(--ease);
}
.nav-toggle span:nth-child(1){top:15px;}
.nav-toggle span:nth-child(2){top:21px;}
.nav-toggle span:nth-child(3){top:27px;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){top:21px; transform:rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){top:21px; transform:rotate(-45deg);}

/* ===================== buttons ===================== */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-size:16px; font-weight:600; line-height:24px;
  padding:14px 28px; border-radius:var(--r-md); border:none;
  text-decoration:none; cursor:pointer; min-height:52px; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .2s ease, color .2s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0) scale(.985); transition-duration:.08s;}
.btn-gold{
  background:linear-gradient(180deg,#C29A33,var(--gold)); color:var(--navy);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 1px 2px rgba(16,31,49,.2), 0 10px 22px -10px rgba(184,144,43,.75);
}
.btn-gold:hover{
  background:linear-gradient(180deg,var(--gold-bright),#C9A03A);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 2px 4px rgba(16,31,49,.2), 0 18px 30px -12px rgba(184,144,43,.85);
}
.btn-navy{
  background:linear-gradient(180deg,var(--navy-raised),var(--navy)); color:var(--on-navy);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 1px 2px rgba(16,31,49,.25), 0 10px 22px -10px rgba(16,31,49,.6);
}
.btn-navy:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 2px 4px rgba(16,31,49,.25), 0 18px 30px -12px rgba(16,31,49,.7);}
.btn-ghost{
  background:rgba(244,242,236,.04); color:var(--on-navy);
  box-shadow:inset 0 0 0 1.5px var(--navy-line);
}
.btn-ghost:hover{background:rgba(244,242,236,.09); box-shadow:inset 0 0 0 1.5px var(--on-navy-muted);}
.btn[disabled]{opacity:.7; cursor:progress; transform:none;}
.btnrow{display:flex; flex-wrap:wrap; gap:var(--s4);}

/* ===================== sections ===================== */
.sec{padding:var(--s9) 0;}
.sec-sm{padding:var(--s8) 0;}
.on-navy{background:var(--navy); color:var(--on-navy);}
.on-navy h1,.on-navy h2,.on-navy h3{color:var(--on-navy);}
.on-navy p{color:var(--on-navy-muted);}
.on-sheet{background:var(--sheet); --surface:var(--sheet);}
.edged{border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);}

.display{font-size:clamp(40px,6.2vw,66px); line-height:1.02; font-weight:700; letter-spacing:-.03em;}
.h1{font-size:clamp(34px,4.8vw,50px); line-height:1.06; font-weight:700; letter-spacing:-.028em;}
.h2{font-size:clamp(27px,3.3vw,36px); line-height:1.14; font-weight:700;}
.h3{font-size:20px; line-height:28px; font-weight:600;}
.lede{font-size:20px; line-height:33px; color:var(--ink-muted);}
.on-navy .lede{color:var(--on-navy-muted);}
.sm{font-size:16px; line-height:26px; color:var(--ink-muted);}
.sec-head{max-width:58ch; margin-bottom:var(--s8);}
.sec-head > * + *{margin-top:var(--s5);}

.two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s8);}
.stack-4 > * + *{margin-top:var(--s4);}
.stack-5 > * + *{margin-top:var(--s5);}
.stack-6 > * + *{margin-top:var(--s6);}

/* Navy surfaces share one backdrop: ledger rules fading out, and a low gold light. */
.backdrop{position:relative; isolation:isolate; overflow:hidden;}
.backdrop::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(720px 420px at 88% -8%, rgba(216,176,74,.17), transparent 68%),
    radial-gradient(560px 380px at -6% 108%, rgba(44,69,98,.75), transparent 70%),
    repeating-linear-gradient(180deg, transparent 0 31px, rgba(244,242,236,.045) 31px 32px);
  -webkit-mask-image:linear-gradient(180deg,#000 30%,rgba(0,0,0,.35));
          mask-image:linear-gradient(180deg,#000 30%,rgba(0,0,0,.35));
}

/* ===================== hero ===================== */
.hero{
  background:var(--navy); color:var(--on-navy);
  padding:var(--s9) 0 var(--s9);
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:104px;
  background:var(--paper); z-index:-1;
}
.hero .grid{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,470px);
  gap:var(--s8); align-items:start;
}
.hero-copy{padding-top:var(--s6);}
.hero h1{margin-bottom:var(--s5); max-width:13ch;}
.hero h1 span{display:block; color:var(--gold-bright);}
.hero .lede,.page-head .lede,.page-head p{color:#C2CCD7;}
.hero .lede{margin-bottom:var(--s7); max-width:44ch;}

/* One orchestrated entrance, on the hero only. */
.js [data-load]{
  opacity:0; animation:rise .8s var(--ease) forwards;
  animation-delay:calc(var(--i,0) * 95ms + 60ms);
}
@keyframes rise{from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:none;}}

/* ===================== the statement ===================== */
.stmt-wrap{position:relative; --mx:0; --my:0;}
.stmt-wrap::before,
.stmt-wrap::after{
  content:""; position:absolute; inset:0; border-radius:var(--r-xl);
  transition:transform .6s var(--ease);
}
.stmt-wrap::before{
  background:#B9C3CE; box-shadow:var(--sh-dark);
  transform:translate(calc(var(--mx) * -10px), calc(var(--my) * -6px)) rotate(-4.5deg);
}
.stmt-wrap::after{
  background:#DCE1E7; box-shadow:0 14px 30px -18px rgba(0,0,0,.6);
  transform:translate(calc(var(--mx) * -5px), calc(var(--my) * -3px)) rotate(2.6deg);
}
.js .stmt-wrap::before{animation:fan-a 1.1s var(--ease) .25s backwards;}
.js .stmt-wrap::after{animation:fan-b 1.1s var(--ease) .35s backwards;}
@keyframes fan-a{from{transform:rotate(0); opacity:0;}}
@keyframes fan-b{from{transform:rotate(0); opacity:0;}}

.stmt{
  position:relative; z-index:1;
  background:var(--sheet); color:var(--ink);
  border-radius:var(--r-xl); padding:var(--s5) var(--s6) var(--s6);
  box-shadow:0 0 0 1px rgba(16,31,49,.05), 0 2px 4px rgba(0,0,0,.10), 0 40px 80px -36px rgba(0,0,0,.75);
}

.seg{
  position:relative; display:grid; grid-template-columns:1fr 1fr;
  background:var(--paper-sunk); border-radius:10px; padding:4px; margin-bottom:var(--s5);
  box-shadow:inset 0 1px 2px rgba(16,31,49,.10);
}
.seg button{
  position:relative; z-index:1; border:0; background:transparent; cursor:pointer;
  font-family:var(--sans); font-size:14px; font-weight:600; line-height:20px;
  color:var(--ink-muted); padding:9px 8px; border-radius:7px;
  transition:color .25s ease;
}
.seg button[aria-selected="true"]{color:var(--navy);}
.seg-thumb{
  position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px);
  background:var(--sheet); border-radius:7px; box-shadow:var(--sh-1);
  transition:transform .4s var(--ease-spring);
}
.seg[data-active="1"] .seg-thumb{transform:translateX(100%);}
html:not(.js) .seg{display:none;}

.panels{display:grid;}
.panel{grid-area:1 / 1; transition:opacity .35s ease, transform .45s var(--ease), visibility 0s;}
.js .panel[hidden]{
  display:block; visibility:hidden; opacity:0; transform:translateY(10px);
  transition:opacity .2s ease, transform .2s ease, visibility 0s .2s;
}
html:not(.js) .panel{grid-area:auto;}
html:not(.js) .panel[hidden]{display:block; margin-top:var(--s6);}

.stmt table{width:100%; border-collapse:collapse;}
.stmt caption{
  text-align:left; font-family:var(--sans); font-size:13px; font-weight:600;
  color:var(--ink-muted); padding-bottom:var(--s4);
}
.stmt th{font-weight:400; text-align:left;}
.stmt td,.stmt th{padding:7px 0;}
.stmt .line th{font-family:var(--sans); font-size:16px; font-weight:500; color:var(--ink);}
.stmt .line td{
  text-align:right; font-size:16px; color:var(--ink);
  font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap;
}
.stmt .sum th,.stmt .sum td{border-top:1px solid var(--rule); padding-top:11px; font-weight:600;}
.stmt .total th,.stmt .total td{border-top:2.5px solid var(--ink); padding-top:13px; padding-bottom:var(--s5);}
.stmt .total th{font-size:18px; font-weight:700;}
.stmt .total td{font-size:21px; font-weight:600;}

.cash{
  position:relative;
  background:linear-gradient(90deg,#F7F1E0,var(--paper)); border-left:3px solid var(--gold);
  border-radius:0 var(--r-md) var(--r-md) 0; padding:var(--s4) var(--s5);
  display:flex; align-items:baseline; justify-content:space-between; gap:var(--s4);
  box-shadow:var(--sh-1);
}
.js .panel:not([hidden]) > .cash{animation:land .7s var(--ease-spring) 1.25s backwards;}
@keyframes land{from{opacity:0; transform:translateY(14px) scale(.96);}}
.cash .k{font-family:var(--sans); font-size:17px; font-weight:700;}
.cash .v{
  font-family:var(--mono); font-variant-numeric:tabular-nums;
  font-size:21px; font-weight:600; color:var(--gold-text); white-space:nowrap;
}
.stmt .after{margin-top:var(--s5); font-size:16px; line-height:26px; color:var(--ink-muted);}
.stmt .fineprint{
  margin-top:var(--s5); padding-top:var(--s4); border-top:1px solid var(--rule);
  font-family:var(--sans); font-size:12.5px; line-height:19px; color:var(--ink-muted);
}

/* second view: following the money */
.flow{list-style:none; margin:0; padding:0;}
.flow li{
  display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:var(--s4);
  align-items:baseline; padding:6px 0 9px; position:relative;
}
.flow .k{font-family:var(--sans); font-size:15px; line-height:22px; font-weight:500;}
.flow .v{
  font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:15px; white-space:nowrap;
}
.flow .out .v{color:var(--ink-muted);}
.flow .bar{
  grid-column:1 / -1; height:4px; margin-top:6px; border-radius:4px;
  background:var(--paper-sunk); overflow:hidden;
}
.flow .bar b{
  display:block; height:100%; width:var(--w); border-radius:4px;
  background:var(--navy); transform-origin:0 50%;
}
.flow .end .bar b,.flow .in .bar b{background:var(--gold);}
.flow .end{margin-top:var(--s2); padding-top:var(--s3); border-top:2.5px solid var(--ink);}
.flow .end .k{font-size:17px; font-weight:700;}
.flow .end .v{font-size:21px; font-weight:600; color:var(--gold-text);}
.flow-title{
  font-family:var(--sans); font-size:13px; font-weight:600; color:var(--ink-muted);
  padding-bottom:var(--s3);
}
.js .panel.play .flow li{animation:rise .5s var(--ease) backwards; animation-delay:calc(var(--n) * 90ms);}
.js .panel.play .flow .bar b{animation:grow .8s var(--ease) backwards; animation-delay:calc(var(--n) * 90ms + 120ms);}
@keyframes grow{from{transform:scaleX(0);}}

/* ===================== scroll reveal ===================== */
.js [data-reveal]{
  opacity:0; transform:translateY(22px);
  transition:opacity .7s ease, transform .9s var(--ease);
  transition-delay:var(--d,0ms);
}
.js [data-reveal].in{opacity:1; transform:none;}

/* ===================== opening statement block ===================== */
.manual h2{position:sticky; top:120px;}
.manual .mark{
  display:block; width:56px; height:4px; border-radius:4px; margin-bottom:var(--s5);
  background:linear-gradient(90deg,var(--gold),var(--gold-bright));
}

/* ===================== audience cards ===================== */
.aud{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s5);}
.aud > div{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,var(--navy-raised),#1A2F48);
  border:1px solid var(--navy-line); border-radius:var(--r-lg);
  padding:var(--s6) var(--s6) var(--s6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), var(--sh-dark);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s ease,
             opacity .7s ease;
}
.aud > div::before{
  content:""; position:absolute; left:var(--s6); top:0; width:44px; height:3px;
  background:var(--gold); border-radius:0 0 3px 3px;
  transition:width .5s var(--ease), background .3s ease;
}
.aud > div:hover{
  transform:translateY(-6px); border-color:#3C5878;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 4px 8px rgba(0,0,0,.2), 0 36px 60px -24px rgba(0,0,0,.7);
}
.aud > div:hover::before{width:calc(100% - var(--s6) * 2); background:var(--gold-bright);}
.aud h3{font-size:19px; line-height:26px; font-weight:600; margin-bottom:var(--s3);}
.aud p{font-size:16.5px; line-height:27px;}

/* ===================== stage list (home) ===================== */
ol.stage{list-style:none; margin:0; padding:0; counter-reset:stage; position:relative; --p:0;}
ol.stage::before,
ol.stage::after{
  content:""; position:absolute; left:16px; top:20px; bottom:20px; width:2px; border-radius:2px;
}
ol.stage::before{background:var(--rule);}
ol.stage::after{
  background:linear-gradient(180deg,var(--gold),var(--gold-bright));
  transform-origin:50% 0; transform:scaleY(var(--p));
}
ol.stage > li{
  counter-increment:stage; position:relative;
  padding:var(--s6) var(--s5) var(--s6) 72px; margin-left:0;
  border-radius:var(--r-lg);
  transition:background .35s ease, box-shadow .35s ease, opacity .7s ease, transform .9s var(--ease);
}
ol.stage > li:hover{background:var(--paper); box-shadow:inset 0 0 0 1px var(--rule);}
@media (min-width:941px){
  ol.stage > li{
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,0.95fr);
    column-gap:var(--s8); align-items:start;
  }
  ol.stage > li > h3,
  ol.stage > li > p{grid-column:1;}
  ol.stage > li > ul{grid-column:2; grid-row:1 / span 3; margin-top:0; align-content:start;}
}
ol.stage > li::before{
  content:counter(stage); position:absolute; left:0; top:var(--s6); z-index:1;
  font-family:var(--mono); font-variant-numeric:tabular-nums;
  font-size:14px; font-weight:600; color:var(--gold-text);
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--surface);
  box-shadow:inset 0 0 0 1.5px var(--gold), 0 0 0 5px var(--surface);
  transition:background .4s ease, color .4s ease, box-shadow .4s ease;
}
.js ol.stage > li.in::before{
  background:var(--gold); color:var(--navy);
  box-shadow:inset 0 0 0 1.5px var(--gold), 0 0 0 5px var(--surface), 0 8px 16px -4px rgba(184,144,43,.6);
}
ol.stage h3{margin-bottom:var(--s3);}
ol.stage p{color:var(--ink-muted); font-size:17px; line-height:28px; max-width:58ch;}
ol.stage ul{
  margin:var(--s4) 0 0; padding:0; list-style:none;
  display:flex; flex-wrap:wrap; gap:var(--s2) var(--s2);
}
ol.stage ul li{
  font-family:var(--sans); font-size:13.5px; line-height:20px; color:var(--ink);
  background:var(--paper); border:1px solid var(--rule);
  border-radius:9999px; padding:5px 13px;
  transition:transform .25s var(--ease), border-color .2s ease, background .2s ease;
}
ol.stage > li:hover ul li{background:var(--sheet);}
ol.stage ul li:hover{transform:translateY(-2px); border-color:var(--gold);}

/* ===================== callout ===================== */
.callout{
  position:relative;
  background:var(--sheet); border-left:3px solid var(--gold);
  border-radius:0 var(--r-lg) var(--r-lg) 0; padding:var(--s6);
  box-shadow:var(--sh-2);
}
.callout p{font-size:20px; line-height:32px; color:var(--ink);}
.on-sheet .callout{background:var(--paper);}

/* ===================== inner page header ===================== */
.page-head{
  background:var(--navy); color:var(--on-navy);
  padding:var(--s8) 0 calc(var(--s9) + var(--s6));
}
.page-head .lede{max-width:60ch; margin-top:var(--s5);}
.pull-up{margin-top:calc(var(--s8) * -1); position:relative; z-index:2; padding-bottom:var(--s9);}

.card{
  background:var(--sheet); border-radius:var(--r-xl);
  box-shadow:0 0 0 1px rgba(16,31,49,.05), var(--sh-3);
  padding:var(--s7);
}

/* ===================== what we cover ===================== */
.cover{display:grid; grid-template-columns:220px minmax(0,1fr); gap:var(--s7); align-items:start;}
.spy{
  position:sticky; top:112px; margin-top:var(--s9);
  list-style:none; padding:0; counter-reset:spy;
}
.spy li{counter-increment:spy;}
.spy a{
  position:relative; display:flex; gap:var(--s3); align-items:baseline;
  font-family:var(--sans); font-size:15px; line-height:22px; font-weight:500;
  color:var(--ink-muted); text-decoration:none;
  padding:10px 0 10px var(--s4); border-left:2px solid var(--rule);
  transition:color .25s ease, border-color .25s ease, padding .35s var(--ease);
}
.spy a::before{
  content:counter(spy); font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--gold-text);
}
.spy a:hover{color:var(--ink);}
.spy a.on{color:var(--ink); border-left-color:var(--gold); padding-left:var(--s5); font-weight:600;}

.stage-cards{list-style:none; margin:0; padding:0; counter-reset:sc; display:grid; gap:var(--s5);}
.stage-cards > li{
  counter-increment:sc; position:relative; scroll-margin-top:112px;
  transition:box-shadow .45s var(--ease), transform .45s var(--ease), opacity .7s ease;
}
.stage-cards > li.card:hover{box-shadow:0 0 0 1px rgba(184,144,43,.35), var(--sh-3);}
.stage-cards .top{display:flex; align-items:center; gap:var(--s4); margin-bottom:var(--s4);}
.stage-cards .top::before{
  content:counter(sc); flex:none;
  font-family:var(--mono); font-size:16px; font-weight:600; color:var(--navy);
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(180deg,var(--gold-bright),var(--gold));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 8px 16px -6px rgba(184,144,43,.7);
}
.stage-cards h2{font-size:26px; line-height:32px; font-weight:700;}
.stage-cards p{color:var(--ink-muted); max-width:60ch;}
.checks{
  list-style:none; margin:var(--s6) 0 0; padding:var(--s5) 0 0; border-top:1px solid var(--rule);
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s3) var(--s6);
}
.checks li{
  position:relative; padding-left:30px;
  font-family:var(--sans); font-size:15.5px; line-height:24px; color:var(--ink);
}
.checks li::before{
  content:""; position:absolute; left:0; top:3px; width:18px; height:18px; border-radius:50%;
  background:var(--paper); box-shadow:inset 0 0 0 1px var(--rule);
}
.checks li::after{
  content:""; position:absolute; left:6px; top:7.5px; width:6px; height:9px;
  border:solid var(--gold-text); border-width:0 2px 2px 0; transform:rotate(42deg) translateY(-2px);
}

/* ===================== about ===================== */
.nope{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5);}
.nope li{
  position:relative; background:var(--paper); border:1px solid var(--rule); border-radius:var(--r-lg);
  padding:var(--s6) var(--s6) var(--s6) 84px;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), background .3s ease, opacity .7s ease;
}
.nope li:hover{transform:translateY(-4px); box-shadow:var(--sh-2); background:var(--sheet);}
.nope li::before,
.nope li::after{
  content:""; position:absolute; left:var(--s6); top:var(--s6);
}
.nope li::before{
  width:36px; height:36px; border-radius:50%; background:var(--navy);
  box-shadow:0 8px 16px -6px rgba(16,31,49,.6);
}
.nope li::after{
  left:calc(var(--s6) + 10px); top:calc(var(--s6) + 17px); width:16px; height:2px; border-radius:2px;
  background:var(--gold-bright); transform:rotate(-45deg);
}
.nope h3{margin-bottom:var(--s2);}
.nope p{font-size:17px; line-height:28px; color:var(--ink-muted);}

.bio{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--s8); align-items:start;}
.sides{display:grid; grid-template-columns:1fr 1fr; gap:var(--s4); margin-top:var(--s6);}
.sides div{
  background:var(--paper); border-radius:var(--r-lg); padding:var(--s5);
  border:1px solid var(--rule);
}
.sides b{display:block; font-family:var(--sans); font-size:15px; line-height:22px; font-weight:700; color:var(--navy); margin-bottom:var(--s1);}
.sides span{display:block; font-family:var(--sans); font-size:14.5px; line-height:22px; color:var(--ink-muted);}

/* ===================== forms ===================== */
.contact{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:var(--s8); align-items:start;}
form{display:flex; flex-direction:column; gap:var(--s5);}
.field{display:flex; flex-direction:column; gap:var(--s2);}
label{font-family:var(--sans); font-size:14px; font-weight:600; color:var(--ink);}
input,textarea{
  font-family:var(--sans); font-size:16px; line-height:24px; color:var(--ink);
  background:var(--paper); border:1px solid var(--border-strong);
  border-radius:var(--r-md); padding:13px 15px; width:100%;
  transition:border-color .2s ease, box-shadow .25s ease, background .2s ease;
}
input:hover,textarea:hover{border-color:var(--ink-muted);}
textarea{min-height:170px; resize:vertical;}
input:focus,textarea:focus{
  outline:none; background:var(--sheet); border-color:var(--gold-text);
  box-shadow:0 0 0 4px rgba(184,144,43,.22);
}
.hp{position:absolute; left:-9999px;}
.note{
  font-family:var(--sans); font-size:15px; line-height:23px;
  padding:var(--s4) var(--s5); border-radius:0 var(--r-md) var(--r-md) 0;
  background:var(--paper); border-left:3px solid var(--gold);
  margin-bottom:var(--s5);
}
.aside{padding-top:var(--s9);}
.aside > div{padding:var(--s5) 0; border-top:1px solid var(--rule);}
.aside > div:first-child{border-top:0; padding-top:0;}
.aside h2{margin-bottom:var(--s2);}

/* ===================== closing panel ===================== */
.cta-sec{padding:0; position:relative; z-index:2;}
.cta{
  background:linear-gradient(135deg,var(--navy-raised),var(--navy) 60%);
  color:var(--on-navy); border:1px solid var(--navy-line); border-radius:var(--r-xl);
  padding:var(--s7) var(--s7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), var(--sh-3);
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s6) var(--s7); align-items:center;
  margin-bottom:calc(var(--s8) * -1);
}
.cta h2{color:var(--on-navy);}
.cta p{color:var(--on-navy-muted); margin-top:var(--s3); max-width:48ch;}
footer.after-cta{padding-top:calc(var(--s8) + var(--s9));}

/* ===================== footer ===================== */
footer{background:var(--navy-deep); color:var(--on-navy-muted); padding:var(--s8) 0 var(--s6);}
footer .cols{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:var(--s7); margin-bottom:var(--s7);}
footer .brand{margin-bottom:var(--s4);}
footer h4{
  font-family:var(--sans); font-size:13px; font-weight:600; color:var(--on-navy);
  margin-bottom:var(--s4); letter-spacing:0;
}
footer ul{list-style:none; margin:0; padding:0;}
footer li{margin-bottom:var(--s3);}
footer a:not(.brand){
  font-family:var(--sans); font-size:15px; color:var(--on-navy-muted); text-decoration:none;
  background:linear-gradient(var(--gold-bright),var(--gold-bright)) 0 100% / 0 1.5px no-repeat;
  padding-bottom:2px; transition:color .2s ease, background-size .35s var(--ease);
}
footer a:not(.brand):hover{color:var(--on-navy); background-size:100% 1.5px;}
footer .tag{font-family:var(--sans); font-size:15px; line-height:24px; max-width:36ch;}
footer .fine{
  font-family:var(--sans); font-size:13px; line-height:21px;
  padding-top:var(--s5); border-top:1px solid var(--navy-line);
}

/* ===================== 404 ===================== */
.lost{
  font-family:var(--mono); font-variant-numeric:tabular-nums;
  font-size:clamp(72px,14vw,132px); line-height:1; font-weight:600;
  color:var(--gold-bright); letter-spacing:-.03em; margin-bottom:var(--s5);
}

/* ===================== responsive ===================== */
@media (max-width:940px){
  .hero .grid{grid-template-columns:minmax(0,1fr); gap:var(--s8);}
  .hero-copy{padding-top:0;}
  .hero{padding-bottom:var(--s8);}
  .hero::after{display:none;}
  .stmt-wrap{max-width:520px;}
  .two,.bio,.contact{grid-template-columns:minmax(0,1fr); gap:var(--s6);}
  .manual h2{position:static;}
  .aud{grid-template-columns:minmax(0,1fr);}
  .cover{grid-template-columns:minmax(0,1fr);}
  .spy{display:none;}
  .aside{padding-top:0;}
  .cta{grid-template-columns:minmax(0,1fr);}
  footer .cols{grid-template-columns:1fr 1fr; gap:var(--s6);}
}
@media (max-width:820px){
  .js .nav-toggle{display:block;}
  .js .nav ul{
    position:absolute; left:0; right:0; top:100%;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--navy-deep); border-bottom:1px solid var(--navy-line);
    padding:var(--s3) var(--s5) var(--s5);
    box-shadow:0 30px 40px -20px rgba(0,0,0,.6);
    visibility:hidden; opacity:0; transform:translateY(-10px);
    transition:opacity .25s ease, transform .35s var(--ease), visibility 0s .35s;
  }
  .js .nav.open ul{visibility:visible; opacity:1; transform:none; transition-delay:0s;}
  .js .nav ul a.link{font-size:18px; padding:var(--s4) 0; border-bottom:1px solid var(--navy-line);}
  .js .nav ul a.link::after{display:none;}
  .js .nav ul a.link[aria-current="page"]{color:var(--gold-bright);}
  .js .nav ul .nav-cta{display:block; text-align:center; margin-top:var(--s5); padding:14px; font-size:16px;}
  html:not(.js) .nav .inner{flex-wrap:wrap;}
  html:not(.js) .nav ul{width:100%; gap:var(--s5); flex-wrap:wrap;}
}
@media (max-width:720px){
  body{font-size:17px; line-height:29px;}
  .wrap{padding:0 var(--s5);}
  .sec{padding:var(--s8) 0;}
  .hero{padding:var(--s7) 0 var(--s8);}
  .stmt{padding:var(--s5) var(--s5) var(--s5);}
  .cash{flex-direction:column; gap:var(--s1);}
  ol.stage > li{padding-left:56px; padding-right:var(--s3);}
  .card{padding:var(--s6) var(--s5);}
  .checks,.nope,.sides{grid-template-columns:minmax(0,1fr);}
  .nope li{padding:calc(var(--s6) + 52px) var(--s5) var(--s5);}
  .nope li::before{left:var(--s5);}
  .nope li::after{left:calc(var(--s5) + 10px);}
  .cta{padding:var(--s6) var(--s5);}
  .page-head{padding:var(--s7) 0 calc(var(--s9) + var(--s4));}
  footer .cols{grid-template-columns:1fr; gap:var(--s6);}
  .lede{font-size:18px; line-height:30px;}
  .brand img{width:38px; height:38px;}
  .brand b{font-size:16px;}
  .brand i{font-size:9px; letter-spacing:.14em;}
}

/* ===================== reduced motion ===================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important; transition:none !important;}
  .js [data-reveal],.js [data-load]{opacity:1; transform:none;}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none !important;}
}

@media (max-width:480px){
  .seg button{font-size:12.5px; padding:9px 2px; white-space:nowrap;}
}
