/* ============================================================
   INVESTABLE
   Opal Ice Investments (Pty) Ltd
   Single file build. No dependencies beyond Google Fonts.
   ============================================================ */

:root{
  --navy:#2D3A4A;
  --navy-deep:#1a2430;
  --ink:#101822;
  --ink-2:#141d28;
  --gold:#F5A623;
  --gold-deep:#C4841A;
  --cream:#F7F4EE;
  --cream-2:#EFEAE0;
  --line:rgba(245,166,35,.18);
  --line-soft:rgba(255,255,255,.10);
  --text:rgba(255,255,255,.74);
  --text-dim:rgba(255,255,255,.48);
  --display:'Syne',system-ui,sans-serif;
  --body:'DM Sans',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --wrap:1180px;
  --pad:clamp(20px,5vw,48px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ink);color:var(--text);
  font-family:var(--body);font-weight:300;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);color:#fff;margin:0;line-height:1.08;letter-spacing:-.02em;font-weight:700}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.sec{padding:clamp(72px,10vw,132px) 0;position:relative}
.sec-tight{padding:clamp(48px,6vw,80px) 0}

/* --- utility type --- */
.eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin:0 0 22px;display:block;font-weight:500;
}
.eyebrow-dim{color:var(--text-dim)}
.h1{font-size:clamp(38px,6.4vw,74px)}
.h2{font-size:clamp(29px,4.2vw,50px)}
.h3{font-size:clamp(20px,2.2vw,27px)}
.h4{font-size:17px;letter-spacing:-.01em}
.lead{font-size:clamp(17px,1.7vw,20px);line-height:1.6;color:var(--text);max-width:62ch}
.small{font-size:14px;line-height:1.6;color:var(--text-dim)}
.gold{color:var(--gold)}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.maxw{max-width:74ch}

/* --- buttons --- */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--body);font-size:14.5px;font-weight:500;letter-spacing:.01em;
  padding:14px 24px;border-radius:2px;text-decoration:none;border:1px solid transparent;
  cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
}
.btn-gold{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.btn-gold:hover{background:#ffb838;transform:translateY(-2px)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.22)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
.btn-dark{background:var(--navy-deep);color:#fff;border-color:var(--navy-deep)}
.btn-dark:hover{background:var(--ink);transform:translateY(-2px)}
.btn:disabled{opacity:.35;cursor:not-allowed;transform:none}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;
}

/* --- cookie consent --- */
#cookieBar{
  position:fixed;left:0;right:0;bottom:0;z-index:200;display:none;
  background:rgba(13,20,29,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);
}
#cookieBar.show{display:block}
.cb-in{
  max-width:var(--wrap);margin:0 auto;padding:20px var(--pad);
  display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap;
}
.cb-in p{margin:0;font-size:13.5px;line-height:1.6;color:var(--text);max-width:64ch}
.cb-in a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(245,166,35,.4)}
.cb-btns{display:flex;gap:10px;flex-shrink:0}
.cb-btns .btn{padding:11px 20px;font-size:13.5px}
@media(max-width:640px){.cb-in{gap:14px}.cb-btns{width:100%}.cb-btns .btn{flex:1;justify-content:center}}

/* --- nav --- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(16,24,34,.72);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);transition:background .3s ease;
}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);height:66px;display:flex;align-items:center;gap:26px}
.logo{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;line-height:0}
.logo img{height:30px;width:auto;display:block;transition:opacity .2s ease}
.logo:hover img{opacity:.82}
.foot .logo img{height:34px}
@media(max-width:520px){.logo img{height:25px}}
.nav-links{display:flex;gap:22px;margin-left:auto;align-items:center}
.nav-links a{
  font-size:13.5px;color:var(--text-dim);text-decoration:none;transition:color .18s ease;white-space:nowrap;
}
.nav-links a:hover,.nav-links a.on{color:#fff}
.nav-cta{
  font-size:13px;padding:9px 16px;border:1px solid var(--gold);color:var(--gold) !important;border-radius:2px;
  transition:background .18s ease,color .18s ease;
}
.nav-cta:hover{background:var(--gold);color:var(--ink) !important}
.has-sub{position:relative}
.sub-toggle{
  background:none;border:0;padding:0;cursor:pointer;font-family:var(--body);
  font-size:13.5px;color:var(--text-dim);transition:color .18s ease;white-space:nowrap;
}
.sub-toggle:hover,.sub-toggle.on{color:#fff}
.sub{
  position:absolute;top:calc(100% + 14px);left:-18px;min-width:212px;
  background:#141d28;border:1px solid rgba(255,255,255,.11);padding:7px 0;display:none;z-index:120;
}
.has-sub:hover .sub,.has-sub:focus-within .sub,.sub.open{display:block}
.has-sub::after{content:'';position:absolute;top:100%;left:0;right:0;height:16px}
.nav-links .sub a{display:block;padding:10px 20px;font-size:13.5px}
.nav-links .sub a:hover{background:rgba(245,166,35,.08);color:var(--gold)}
.burger{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:22px;cursor:pointer;padding:6px 4px;line-height:1}
@media(max-width:960px){
  .burger{display:block}
  .nav-links{
    position:absolute;top:66px;left:0;right:0;background:var(--ink-2);
    flex-direction:column;align-items:flex-start;gap:0;padding:8px var(--pad) 20px;
    border-bottom:1px solid var(--line-soft);display:none;
  }
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 0;width:100%;font-size:16px}
  .nav-cta{margin-top:10px}
  .has-sub{width:100%}
  .sub-toggle{display:none}
  .sub{position:static;display:block;background:transparent;border:0;padding:0;min-width:0}
  .nav-links .sub a{padding:12px 0 12px 0;font-size:16px}
}

/* --- page routing --- */
.page{display:block}
main{padding-top:66px}

/* --- hero --- */
.hero{position:relative;padding:clamp(74px,12vw,132px) 0 clamp(58px,8vw,96px)}
.hero::before{overflow:hidden}
.hero::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:74px 74px;
  mask-image:radial-gradient(ellipse 90% 68% at 20% 0%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 90% 68% at 20% 0%,#000 0%,transparent 72%);
  opacity:.5;
}
.hero-in{position:relative;z-index:1;transform:none !important}
.hero .h1{max-width:16ch}
.hero .lead{margin-top:26px}

/* --- signature: the evidence spine --- */
.spine{
  margin-top:clamp(50px,7vw,84px);border-top:1px solid var(--line-soft);padding-top:26px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);
}
.spine-cell{background:var(--ink);padding:22px 20px 24px;position:relative;transition:background .3s ease}
.spine-cell:hover{background:#16202c}
.spine-bar{height:3px;background:rgba(255,255,255,.09);margin-bottom:18px;overflow:hidden}
.spine-bar i{display:block;height:100%;width:0;background:var(--gold);transition:width 1.1s cubic-bezier(.22,1,.36,1)}
.spine.lit .spine-cell:nth-child(1) .spine-bar i{width:100%;transition-delay:.05s}
.spine.lit .spine-cell:nth-child(2) .spine-bar i{width:100%;transition-delay:.3s}
.spine.lit .spine-cell:nth-child(3) .spine-bar i{width:100%;transition-delay:.55s}
.spine.lit .spine-cell:nth-child(4) .spine-bar i{width:100%;transition-delay:.8s}
.spine-k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--gold);display:block;margin-bottom:8px}
.spine-t{font-family:var(--display);font-weight:700;color:#fff;font-size:19px;margin-bottom:7px}
.spine-d{font-size:13.5px;line-height:1.55;color:var(--text-dim)}
.spine-gate{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-dim);margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.13);
}
.spine-gate b{color:#fff;font-weight:500}
@media(max-width:880px){.spine{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.spine{grid-template-columns:1fr}}

/* --- credential strip --- */
.strip{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:#0d141d}
.strip-in{display:flex;flex-wrap:wrap;gap:14px 40px;padding:20px 0;align-items:center}
.strip-item{font-family:var(--mono);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--text-dim)}
.strip-item b{color:var(--gold);font-weight:500}

/* --- generic grids --- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:880px){.grid-2,.grid-3{grid-template-columns:1fr}}

.card{
  background:#131c26;border:1px solid rgba(255,255,255,.07);padding:30px 28px 32px;
  transition:border-color .25s ease,transform .25s ease,background .25s ease;position:relative;
}
.card:hover{border-color:var(--line);transform:translateY(-3px);background:#16202c}
.card .h4{margin-bottom:10px}
.card p{font-size:14.5px;line-height:1.6;color:var(--text-dim)}

/* service card */
.svc{display:block;text-decoration:none}
.svc-meta{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-dim);margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);
  display:grid;gap:6px;
}
.svc-meta b{color:rgba(255,255,255,.8);font-weight:500}
.svc-go{color:var(--gold);font-size:13.5px;margin-top:18px;display:inline-block;font-family:var(--body);letter-spacing:.01em}

/* --- assessment promo band --- */
.band{background:linear-gradient(105deg,#182534 0%,#101822 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band-in{display:flex;gap:36px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:clamp(44px,6vw,68px) 0}
.band-in .h2{max-width:18ch}

/* --- loop / process --- */
.loop{display:grid;gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);margin-top:44px}
.loop-row{
  background:var(--ink);display:grid;grid-template-columns:96px 1.1fr 1.4fr 1fr;gap:24px;
  padding:26px 26px;align-items:start;transition:background .25s ease;
}
.loop-row:hover{background:#16202c}
.loop-n{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--gold)}
.loop-t{font-family:var(--display);font-weight:700;color:#fff;font-size:19px}
.loop-d{font-size:14.5px;color:var(--text-dim);line-height:1.6}
.loop-g{font-size:13px;color:rgba(255,255,255,.72);line-height:1.5}
.loop-g span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--text-dim);margin-bottom:6px}
@media(max-width:880px){
  .loop-row{grid-template-columns:1fr;gap:10px;padding:22px}
}



/* ============================================================
   PROCESS FLOW  (Ground Truth Loop, Decision Ledger)
   ============================================================ */
.flow{display:grid;grid-template-columns:repeat(4,1fr);margin-top:50px;position:relative}
.flow-step{position:relative;padding:0 28px 0 0;opacity:0;transform:translateY(24px)}
.flow.in .flow-step{animation:stepin .7s cubic-bezier(.22,1,.36,1) forwards}
.flow.in .flow-step:nth-child(1){animation-delay:.05s}
.flow.in .flow-step:nth-child(2){animation-delay:.35s}
.flow.in .flow-step:nth-child(3){animation-delay:.65s}
.flow.in .flow-step:nth-child(4){animation-delay:.95s}
@keyframes stepin{to{opacity:1;transform:none}}
.flow-head{position:relative;margin-bottom:24px;height:70px}
.flow-icon{
  width:70px;height:70px;border:1px solid rgba(245,166,35,.34);background:#141d28;
  display:grid;place-items:center;position:relative;z-index:2;transition:border-color .3s ease,background .3s ease;
}
.flow-step:hover .flow-icon{border-color:var(--gold);background:#1a2634}
.flow-icon svg{width:34px;height:34px;overflow:visible}
.flow-icon svg path,.flow-icon svg circle,.flow-icon svg line,.flow-icon svg rect,.flow-icon svg polyline{
  stroke:var(--gold);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;
}
.flow-conn{position:absolute;top:35px;left:70px;right:28px;height:1px;background:rgba(255,255,255,.12);z-index:1}
.flow-conn i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),rgba(245,166,35,.25));transition:width .9s cubic-bezier(.4,0,.2,1)}
.flow.in .flow-step:nth-child(1) .flow-conn i{width:100%;transition-delay:.3s}
.flow.in .flow-step:nth-child(2) .flow-conn i{width:100%;transition-delay:.6s}
.flow.in .flow-step:nth-child(3) .flow-conn i{width:100%;transition-delay:.9s}
.flow-step:last-child .flow-conn{display:none}
.flow-k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:10px}
.flow-t{font-family:var(--display);font-weight:700;font-size:20px;color:#fff;letter-spacing:-.01em;margin-bottom:10px}
.flow-d{font-size:14px;line-height:1.6;color:var(--text-dim);margin-bottom:18px}
.flow-gate{
  display:inline-block;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
  color:rgba(255,255,255,.72);border:1px dashed rgba(245,166,35,.4);padding:7px 11px;
}
.flow-return{
  margin-top:34px;border-top:1px dashed rgba(245,166,35,.3);padding-top:18px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.45);
}
.flow-return b{color:var(--gold);font-weight:500}
@media(max-width:900px){
  .flow{grid-template-columns:1fr 1fr;gap:34px 0}
  .flow-step:nth-child(2) .flow-conn{display:none}
}
@media(max-width:560px){
  .flow{grid-template-columns:1fr;gap:30px}
  .flow-conn{display:none}
  .flow-head{height:auto;margin-bottom:18px}
}

/* ============================================================
   LAYER STACK  (where this goes)
   ============================================================ */
.stack{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,56px);margin-top:46px;align-items:start}
@media(max-width:900px){.stack{grid-template-columns:1fr}}
.slabs{display:grid;gap:8px;perspective:900px}
.slab{
  position:relative;display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center;
  background:linear-gradient(100deg,#16202c,#111a24);border:1px solid rgba(255,255,255,.09);
  padding:16px 18px;cursor:default;text-align:left;font-family:var(--body);color:inherit;width:100%;
  transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .3s ease,opacity .3s ease,box-shadow .35s ease;
}
.slab::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold);transform:scaleY(0);transform-origin:center;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.slab-n{font-family:var(--mono);font-size:11.5px;color:var(--gold);letter-spacing:.08em}
.slab-t{font-family:var(--display);font-weight:700;font-size:16.5px;color:#fff;letter-spacing:-.01em}
.slab-bar{width:54px;height:3px;background:rgba(255,255,255,.14);overflow:hidden}
.slab-bar i{display:block;height:100%;width:0;background:var(--gold);transition:width .5s ease}
.slabs.active .slab{opacity:.42}
.slab.on{opacity:1;transform:translateX(14px) scale(1.015);border-color:rgba(245,166,35,.45);box-shadow:-8px 0 34px rgba(245,166,35,.10)}
.slab.on::before{transform:scaleY(1)}
.slab.on .slab-bar i{width:100%}
.stack-detail{border:1px solid rgba(255,255,255,.09);background:#131c26;padding:30px 28px;min-height:236px}
.stack-detail .sd-k{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:12px}
.stack-detail .sd-t{font-family:var(--display);font-weight:700;font-size:24px;color:#fff;letter-spacing:-.02em;margin-bottom:14px}
.stack-detail .sd-d{font-size:15px;line-height:1.65;color:var(--text)}
.stack-detail .sd-p{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:13.5px;color:var(--text-dim);line-height:1.55}
.stack-detail .sd-p b{color:rgba(255,255,255,.8);font-weight:500;display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:7px}

/* ============================================================
   FIT CHECKLIST
   ============================================================ */
.fitgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:38px}
@media(max-width:760px){.fitgrid{grid-template-columns:1fr}}
.fit{
  display:grid;grid-template-columns:40px 1fr;gap:18px;align-items:start;
  background:#131c26;border:1px solid rgba(255,255,255,.08);padding:26px 26px;position:relative;overflow:hidden;
  transition:border-color .3s ease,transform .3s ease;
}
.fit:hover{border-color:rgba(245,166,35,.4);transform:translateY(-3px)}
.fit svg{width:30px;height:30px;overflow:visible}
.fit svg path{stroke:var(--gold);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.fitgrid.in .fit:nth-child(1) svg path{animation:drawline .6s ease .15s forwards}
.fitgrid.in .fit:nth-child(2) svg path{animation:drawline .6s ease .3s forwards}
.fitgrid.in .fit:nth-child(3) svg path{animation:drawline .6s ease .45s forwards}
.fitgrid.in .fit:nth-child(4) svg path{animation:drawline .6s ease .6s forwards}
.fit-t{font-family:var(--display);font-weight:700;font-size:17px;color:#fff;letter-spacing:-.01em;margin-bottom:9px}
.fit-d{font-size:14.5px;line-height:1.6;color:var(--text-dim)}

/* alumni spotlight */
.al{margin-top:44px}
.al-stage{
  position:relative;background:var(--navy-deep);color:#fff;overflow:hidden;
  padding:clamp(34px,5vw,60px) clamp(26px,4vw,56px) clamp(70px,7vw,84px);
}
.al-stage::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 90% at 88% 6%,rgba(245,166,35,.22),transparent 62%);
}
.al-stage > *{position:relative;z-index:1}
.al-progress{position:absolute;top:0;left:0;right:0;height:2px;background:rgba(255,255,255,.12);z-index:2}
.al-progress i{display:block;height:100%;width:0;background:var(--gold)}
.al-count{
  position:absolute;top:clamp(24px,3vw,34px);right:clamp(26px,4vw,56px);
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:rgba(255,255,255,.4);z-index:2;
}
.al-count span{color:var(--gold)}
.al-body{min-height:230px;max-width:60ch}
.al-venture{
  font-family:var(--display);font-weight:800;font-size:clamp(30px,4.6vw,54px);color:#fff;
  letter-spacing:-.03em;line-height:1.05;margin-bottom:16px;
}
.al-meta{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-bottom:22px}
.al-meta span{font-family:var(--body);font-size:16px;color:#fff}
.al-meta em{font-family:var(--mono);font-style:normal;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.al-desc{font-size:16.5px;line-height:1.65;color:rgba(255,255,255,.68);margin:0}
.al-fade{animation:alin .55s cubic-bezier(.22,1,.36,1)}
@keyframes alin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.al-nav{position:absolute;left:clamp(26px,4vw,56px);bottom:clamp(26px,3.4vw,38px);display:flex;gap:8px;z-index:2}
.al-nav button{
  width:42px;height:42px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;
  cursor:pointer;font-size:16px;transition:border-color .2s ease,color .2s ease,background .2s ease;
}
.al-nav button:hover{border-color:var(--gold);color:var(--gold);background:rgba(245,166,35,.08)}
.al-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.al-chip{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  border:1px solid var(--cream-2);background:#fff;color:#6b7683;padding:10px 14px;cursor:pointer;
  transition:border-color .2s ease,color .2s ease,background .2s ease,transform .2s ease;
}
.al-chip:hover{border-color:var(--gold);color:var(--navy-deep);transform:translateY(-2px)}
.al-chip.on{background:var(--navy-deep);border-color:var(--navy-deep);color:#fff}
@media(max-width:640px){
  .al-body{min-height:300px}
  .al-count{top:auto;bottom:clamp(26px,3.4vw,38px);right:clamp(26px,4vw,56px)}
}
@media(prefers-reduced-motion:reduce){.al-fade{animation:none}.al-progress i{display:none}}

/* turnkey rail  (Foundation) */
.rail{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--cream-2);border:1px solid var(--cream-2);margin-top:40px}
@media(max-width:860px){.rail{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.rail{grid-template-columns:1fr}}
.rail-step{background:#fff;padding:26px 22px;position:relative;transition:background .3s ease}
.rail-step:hover{background:#fdfbf7}
.rail-step span{font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-deep);display:block;margin-bottom:12px}
.rail-step b{font-family:var(--display);font-weight:700;font-size:17px;color:var(--navy-deep);display:block;margin-bottom:9px;letter-spacing:-.01em}
.rail-step p{font-size:13.5px;line-height:1.55;color:#5b6673;margin:0}
.rail-note{background:var(--navy-deep);color:#fff;padding:24px 28px;margin-top:0;display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.rail-note b{font-family:var(--display);font-weight:700;font-size:19px;color:#fff}
.rail-note span{font-size:15px;color:rgba(255,255,255,.68)}

@media(prefers-reduced-motion:reduce){
  .flow-step{opacity:1 !important;transform:none !important}
  .flow-conn i{width:100% !important}
  .fit svg path{stroke-dashoffset:0 !important}
  .slabs.active .slab{opacity:1}
}

/* ============================================================
   ATMOSPHERE
   Fixed particle field, cursor light, depth and response.
   Everything here degrades to still under prefers-reduced-motion.
   ============================================================ */
#fx{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
#spot{
  position:fixed;top:0;left:0;width:720px;height:720px;margin:-360px 0 0 -360px;border-radius:50%;
  pointer-events:none;z-index:1;opacity:0;transition:opacity .5s ease;will-change:transform;
  background:radial-gradient(circle,rgba(245,166,35,.13) 0%,rgba(245,166,35,.05) 34%,transparent 64%);
}
body.lit #spot{opacity:1}
main,.foot{position:relative;z-index:2}
.hero::before{opacity:.22;background-position:0 var(--hp,0px)}

/* let the field breathe through the alternate sections */
.sec.tone{background:rgba(13,20,29,.82);backdrop-filter:blur(2px)}

/* hero headline assembly */
.w{display:inline-block;opacity:0;transform:translateY(22px);filter:blur(8px)}
.w.on{animation:wordin .8s cubic-bezier(.22,1,.36,1) forwards}
@keyframes wordin{to{opacity:1;transform:none;filter:blur(0)}}

/* parallax layers */
.plx{will-change:transform}

/* cards that respond to the pointer */
.card,.pick-card,.f-card{position:relative;overflow:hidden;transform-style:preserve-3d}
.card::before,.pick-card::before,.f-card::before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s ease;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(245,166,35,.16),transparent 62%);
}
.card:hover::before,.pick-card:hover::before{opacity:1}
.f-card::before{background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(245,166,35,.22),transparent 62%)}
.f-card:hover::before{opacity:1}
.card>*,.pick-card>*,.f-card>*{position:relative;z-index:1}

/* section entry hairline */
.rule{height:1px;background:linear-gradient(90deg,var(--gold),rgba(245,166,35,0));transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.22,1,.36,1)}
.rule.in{transform:scaleX(1)}

/* counting numbers */
.num{font-variant-numeric:tabular-nums}

/* ============================================================
   THE OPERATING SYSTEM STACK
   ============================================================ */
.osx{position:relative;margin-top:44px;display:grid;grid-template-columns:34px 1fr;gap:0 22px}
.osx-spine{position:relative;width:2px;background:rgba(255,255,255,.1);margin-left:16px;overflow:hidden}
.osx-spine i{position:absolute;left:0;width:2px;height:22%;background:linear-gradient(180deg,transparent,var(--gold),transparent);animation:pulse 4.2s linear infinite}
@keyframes pulse{from{top:-25%}to{top:110%}}
.osx-rows{display:grid;gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.osx-row{
  background:var(--ink);border:0;text-align:left;font-family:var(--body);color:inherit;cursor:default;width:100%;
  display:grid;grid-template-columns:54px 210px 1fr;gap:10px 22px;align-items:start;padding:20px 24px;
  transition:background .3s ease,opacity .3s ease,padding-left .3s ease;position:relative;
}
.osx-row::after{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.osx-row .osx-n{font-family:var(--mono);font-size:12px;color:var(--gold);letter-spacing:.1em;padding-top:2px}
.osx-row .osx-t{font-family:var(--display);font-weight:700;color:#fff;font-size:17.5px;letter-spacing:-.01em}
.osx-row .osx-d{font-size:14px;color:var(--text-dim);line-height:1.55}
.osx-row .osx-x{
  grid-column:2/-1;font-size:14px;color:rgba(255,255,255,.78);line-height:1.6;
  max-height:0;opacity:0;overflow:hidden;transition:max-height .4s ease,opacity .3s ease,margin-top .4s ease;
}
.osx.active .osx-row{opacity:.34}
.osx-row.on{background:#16202c;opacity:1 !important;padding-left:32px}
.osx-row.on::after{transform:scaleY(1)}
.osx-row.on .osx-x{max-height:180px;opacity:1;margin-top:10px}
@media(max-width:760px){
  .osx{grid-template-columns:1fr}
  .osx-spine{display:none}
  .osx-row{grid-template-columns:48px 1fr;padding:18px 20px}
  .osx-row .osx-d{grid-column:2}
  .osx-row .osx-x{grid-column:2}
}

@media(prefers-reduced-motion:reduce){
  #fx,#spot{display:none}
  .w{opacity:1 !important;transform:none !important;filter:none !important}
  .rule{transform:scaleX(1) !important}
  .osx-spine i{display:none}
  .osx.active .osx-row{opacity:1}
  .plx{transform:none !important}
}

/* --- dark focal figure + draw animation --- */
.fig-dark{background:var(--navy-deep);border-color:var(--navy-deep);padding:clamp(26px,4vw,46px) clamp(20px,3vw,40px)}
.f-body .fig-dark{background:var(--navy-deep);border-color:var(--navy-deep)}
.f-body .fig-dark figcaption{color:rgba(255,255,255,.55);border-top-color:rgba(255,255,255,.14)}
.draw{stroke-dasharray:1;stroke-dashoffset:1}
.fig.in .draw-fast{animation:drawline .9s cubic-bezier(.4,0,.2,1) .25s forwards}
.fig.in .draw-slow{animation:drawline 2.6s cubic-bezier(.5,0,.5,1) .25s forwards}
@keyframes drawline{to{stroke-dashoffset:0}}
.reveal{transform-box:fill-box;transform-origin:left center;transform:scaleX(0)}
.fig.in .reveal{animation:sweep 2s cubic-bezier(.42,0,.3,1) .2s forwards}
@keyframes sweep{to{transform:scaleX(1)}}
.fade{opacity:0}
.fig.in .fade{animation:fadein .6s ease forwards}
@keyframes fadein{to{opacity:1}}
.g1{animation-delay:2.15s !important}
.g2{animation-delay:2.45s !important}
.g3{animation-delay:2.7s !important}
.pop{opacity:0}
.fig.in .pop{animation:popin .5s ease forwards}
@keyframes popin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.d1{animation-delay:1.05s !important}
.d2{animation-delay:1.35s !important}
.d3{animation-delay:2.75s !important}
.d4{animation-delay:3.05s !important}
@media(prefers-reduced-motion:reduce){
  .draw{stroke-dashoffset:0 !important}
  .pop{opacity:1 !important}
  .fade{opacity:1 !important}
  .reveal{transform:none !important}
}

.legal{margin-top:22px}
.legal h4{font-family:var(--display);font-weight:700;font-size:16px;color:#fff;letter-spacing:-.01em;margin:26px 0 8px}
.legal h4:first-child{margin-top:0}
.legal p{font-size:14.5px;line-height:1.7;color:var(--text-dim);margin:0}

/* --- qualifier callout --- */
.qualifier{border-left:2px solid var(--gold);background:#131c26;padding:26px 28px;margin-top:24px}
.qualifier p{font-size:15.5px;line-height:1.65;color:var(--text)}
.qualifier a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(245,166,35,.4)}
.qualifier a:hover{border-bottom-color:var(--gold)}

/* --- figures --- */
.fig{margin-top:clamp(34px,5vw,54px);border:1px solid rgba(255,255,255,.08);background:#0f1721;padding:clamp(20px,3vw,34px)}
.fig svg{width:100%;height:auto;display:block}
.fig figcaption{margin-top:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);font-size:13.5px;line-height:1.6;color:var(--text-dim);max-width:70ch}
.f-body .fig{background:#fff;border-color:var(--cream-2)}
.f-body .fig figcaption{color:#5b6673;border-top-color:var(--cream-2)}

/* --- proof stat row (dark) --- */
.statrow{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);margin-top:40px}
@media(max-width:760px){.statrow{grid-template-columns:1fr}}
.stat{background:var(--ink);padding:30px 26px;transition:background .25s ease}
.stat:hover{background:#16202c}
.stat b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(38px,5vw,54px);color:#fff;line-height:1;letter-spacing:-.03em}
.stat span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);margin:14px 0 8px}
.stat p{font-size:14px;color:var(--text-dim);margin:0;line-height:1.55}

/* --- partners --- */
.partners{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.tag{
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.14);padding:8px 14px;color:var(--text-dim);
}
.quote{
  border-left:2px solid var(--gold);padding:6px 0 6px 26px;
  font-family:var(--display);font-weight:600;font-size:clamp(19px,2.4vw,25px);line-height:1.45;color:#fff;letter-spacing:-.01em;
}
.attrib{margin-top:20px;font-size:14px;color:var(--text-dim)}
.attrib b{color:#fff;font-weight:500;display:block;font-size:15px;font-family:var(--body)}

/* --- OS layers --- */
.layers{margin-top:40px;border:1px solid rgba(255,255,255,.08)}
.layer{
  display:grid;grid-template-columns:52px 200px 1fr;gap:22px;align-items:center;
  padding:20px 24px;border-bottom:1px solid rgba(255,255,255,.07);
  transition:background .25s ease,padding-left .25s ease;
}
.layer:last-child{border-bottom:0}
.layer:hover{background:#16202c;padding-left:32px}
.layer-n{font-family:var(--mono);font-size:12px;color:var(--gold)}
.layer-t{font-family:var(--display);font-weight:700;color:#fff;font-size:17px}
.layer-d{font-size:14px;color:var(--text-dim)}
@media(max-width:720px){.layer{grid-template-columns:44px 1fr;gap:8px 16px}.layer-d{grid-column:2}}

/* --- forms --- */
.form{margin-top:38px;display:grid;gap:16px;max-width:640px}
.field{display:grid;gap:7px}
.field label{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}
.field input,.field select,.field textarea{
  background:#0d141d;border:1px solid rgba(255,255,255,.13);color:#fff;
  padding:13px 14px;font-family:var(--body);font-size:15px;font-weight:300;border-radius:2px;width:100%;
}
.field textarea{min-height:110px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:rgba(255,255,255,.28)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.field-row{grid-template-columns:1fr}}
.form-note{font-size:12.5px;color:var(--text-dim);line-height:1.55}
.form-msg{font-size:14px;padding:14px 16px;border:1px solid var(--line);background:rgba(245,166,35,.07);color:#fff;display:none}
.form-msg.show{display:block}

/* ============================================================
   ASSESSMENT
   ============================================================ */
/* instrument selector */
.pick{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:36px}
@media(max-width:760px){.pick{grid-template-columns:1fr}}
.pick-card{
  background:#131c26;border:1px solid rgba(255,255,255,.1);padding:28px 26px;cursor:pointer;text-align:left;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;font-family:var(--body);color:inherit;
}
.pick-card:hover{border-color:var(--line);transform:translateY(-3px);background:#16202c}
.pick-card.on{border-color:var(--gold);background:rgba(245,166,35,.07)}
.pick-card em{display:block;font-family:var(--mono);font-style:normal;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);margin-bottom:11px}
.pick-card b{display:block;font-family:var(--display);font-weight:700;font-size:21px;color:#fff;letter-spacing:-.01em;margin-bottom:9px}
.pick-card p{font-size:14px;color:var(--text-dim);margin:0;line-height:1.55}

/* screener */
.screener{border:1px solid rgba(255,255,255,.09);background:#131c26;padding:clamp(24px,3vw,32px);margin-top:20px}
.screener-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
@media(max-width:760px){.screener-grid{grid-template-columns:1fr}}
.ctx{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);margin-top:22px}
@media(max-width:860px){.ctx{grid-template-columns:1fr 1fr}}
.ctx div{background:var(--ink);padding:16px 18px}
.ctx span{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);margin-bottom:7px}
.ctx p{margin:0;font-size:13.5px;color:rgba(255,255,255,.8);line-height:1.45}

.asmt-intro{border:1px solid rgba(255,255,255,.09);background:#131c26;padding:clamp(26px,4vw,40px);margin-top:0;overflow:visible}
.asmt-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 30px;margin-top:0}
.asmt-facts .fact{min-width:0}
@media(max-width:720px){.asmt-facts{grid-template-columns:1fr}}
.fact span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--gold);margin-bottom:7px}
.fact p{font-size:14px;color:var(--text-dim);margin:0;line-height:1.6;overflow-wrap:break-word}

.disclaimer{margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1)}
.disclaimer span{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);margin-bottom:10px}
.disclaimer p{margin:0;font-size:12.5px;line-height:1.65;color:rgba(255,255,255,.42);max-width:none}

.progress{position:relative;background:var(--ink);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);padding:16px 0}
.progress-in{display:flex;align-items:center;gap:16px}
.progress-track{flex:1;height:3px;background:rgba(255,255,255,.1);overflow:hidden}
.progress-track i{display:block;height:100%;width:0;background:var(--gold);transition:width .35s ease}
.progress-txt{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--text-dim);white-space:nowrap}

.q{border:1px solid rgba(255,255,255,.08);background:#131c26;padding:clamp(22px,3vw,32px);margin-bottom:16px}
.q-dim{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;display:block}
.q-t{font-family:var(--display);font-weight:700;color:#fff;font-size:19px;line-height:1.3;margin-bottom:10px;letter-spacing:-.01em}
.q-h{font-size:13.5px;line-height:1.55;color:var(--text-dim);margin:0 0 18px;max-width:62ch;border-left:2px solid rgba(245,166,35,.3);padding-left:13px}
.opts{display:grid;gap:8px}
.opt{display:flex;gap:13px;align-items:flex-start;padding:13px 15px;border:1px solid rgba(255,255,255,.1);cursor:pointer;transition:border-color .18s ease,background .18s ease}
.opt:hover{border-color:rgba(245,166,35,.4);background:rgba(245,166,35,.04)}
.opt input{margin:4px 0 0;accent-color:var(--gold);width:15px;height:15px;flex-shrink:0}
.opt span{font-size:14.5px;line-height:1.55;color:var(--text)}
.opt.sel{border-color:var(--gold);background:rgba(245,166,35,.08)}
.opt.sel span{color:#fff}

.asmt-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:26px}
.asmt-warn{font-size:13px;color:var(--gold);display:none}
.asmt-warn.show{display:block}

/* results */
.result{display:none}
.result.show{display:block}
.verdict{border:1px solid var(--gold);background:linear-gradient(120deg,rgba(245,166,35,.12),rgba(245,166,35,.02));padding:clamp(28px,4vw,44px)}
.verdict-band{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;display:block}
.verdict-score{font-family:var(--display);font-weight:800;font-size:clamp(52px,9vw,88px);color:#fff;line-height:1;letter-spacing:-.04em}
.verdict-score small{font-size:.32em;color:var(--text-dim);font-weight:600;letter-spacing:0}
.verdict-t{font-family:var(--display);font-weight:700;font-size:clamp(24px,3.4vw,34px);color:#fff;margin:18px 0 12px;letter-spacing:-.02em}
.verdict p{font-size:15.5px;line-height:1.65;color:var(--text);max-width:66ch}

.levelbox{margin-top:26px;padding-top:24px;border-top:1px solid rgba(245,166,35,.3)}
.level-k{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:10px}
.level-n{font-family:var(--display);font-weight:800;font-size:clamp(20px,2.6vw,26px);color:#fff;letter-spacing:-.02em;margin-bottom:10px}
.levelbox p{font-size:14.5px;line-height:1.6;color:var(--text);max-width:64ch;margin:0}
.level-next{margin-top:14px !important;font-size:13.5px !important;color:var(--text-dim) !important}
.level-next b{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7);font-weight:500;margin-bottom:6px}

.gatebox{border:1px solid #d9534f;background:rgba(217,83,79,.1);padding:22px 24px;margin-top:20px}
.gatebox span{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#ff8b87;display:block;margin-bottom:9px}
.gatebox p{font-size:14.5px;color:rgba(255,255,255,.85);margin:0;line-height:1.6}

.dims{margin-top:34px;display:grid;gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.dim{background:var(--ink);padding:18px 22px;display:grid;grid-template-columns:1fr 96px;gap:8px 20px;align-items:center}
.dim-n{font-family:var(--display);font-weight:700;color:#fff;font-size:16px}
.dim-w{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase}
.dim-v{font-family:var(--mono);font-size:18px;color:var(--gold);text-align:right;font-weight:500}
.dim-track{grid-column:1/-1;height:4px;background:rgba(255,255,255,.09);overflow:hidden}
.dim-track i{display:block;height:100%;width:0;background:var(--gold);transition:width .8s cubic-bezier(.22,1,.36,1)}
.dim-track.low i{background:#d9534f}
.dim-note{grid-column:1/-1;font-size:13px;color:var(--text-dim);line-height:1.5}

.moves{margin-top:34px;display:grid;gap:10px}
.move{display:flex;gap:14px;align-items:flex-start;border:1px solid rgba(255,255,255,.09);padding:16px 18px;background:#131c26}
.move b{font-family:var(--mono);font-size:11px;color:var(--gold);letter-spacing:.1em;flex-shrink:0;padding-top:3px}
.move p{font-size:14.5px;color:var(--text);margin:0;line-height:1.6}

/* ============================================================
   FOUNDATION (light)
   ============================================================ */
.f-body{background:var(--cream);color:#3a4450}
.f-body h1,.f-body h2,.f-body h3,.f-body h4{color:var(--navy-deep)}
.f-body .lead,.f-body p{color:#4a5563}
.f-body .eyebrow{color:var(--gold-deep)}
.f-hero{background:var(--navy-deep);position:relative;overflow:hidden}
.f-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 62% 78% at 78% 12%,rgba(245,166,35,.26),transparent 66%);
}
.f-hero .hero-in{position:relative;z-index:2}
.f-hero h1,.f-hero .lead{color:#fff}
.f-hero .lead{color:rgba(255,255,255,.76)}
.f-rule{height:4px;background:var(--gold)}
.f-card{background:#fff;border:1px solid var(--cream-2);padding:30px 28px;transition:transform .25s ease,box-shadow .25s ease}
.f-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(45,58,74,.11)}
.f-card p{font-size:14.5px;color:#5b6673}
.f-split{border:1px solid var(--cream-2);background:#fff;display:grid;grid-template-columns:1fr 1fr;margin-top:38px}
@media(max-width:720px){.f-split{grid-template-columns:1fr}}
.f-half{padding:30px 28px}
.f-half:first-child{border-right:1px solid var(--cream-2)}
@media(max-width:720px){.f-half:first-child{border-right:0;border-bottom:1px solid var(--cream-2)}}
.f-half .mono{color:var(--gold-deep);display:block;margin-bottom:10px}
.f-disclaimer{background:var(--cream-2);border-left:3px solid var(--navy);padding:22px 24px;margin-top:40px;font-size:13.5px;line-height:1.65;color:#4a5563}

/* light variants of shared components, Foundation only */
.f-body .strip{background:#fff;border-color:var(--cream-2)}
.f-body .strip-item{color:#6b7683}
.f-body .strip-item b{color:var(--gold-deep)}
.f-body .tag{border-color:#ded7c9;color:#6b7683}
.f-body .small{color:#6b7683}
.f-body .btn-ghost{color:var(--navy-deep);border-color:rgba(45,58,74,.28)}
.f-body .btn-ghost:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.f-body .field label{color:#6b7683}
.f-body .field input,.f-body .field select,.f-body .field textarea{background:#fff;border-color:#ded7c9;color:#26303c}
.f-body .field input::placeholder,.f-body .field textarea::placeholder{color:#a9b0ba}
.f-body .form-note{color:#6b7683}
.f-body .form-msg{background:#fff;border-color:var(--gold-deep);color:#26303c}
.f-body .quote{color:var(--navy-deep);border-left-color:var(--gold-deep)}
.f-body .attrib{color:#6b7683}
.f-body .attrib b{color:var(--navy-deep)}

/* impact figures */
.f-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--cream-2);border:1px solid var(--cream-2);margin-top:44px}
.f-stats .f-stat{min-width:0}
@media(max-width:1000px){.f-stats{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.f-stats{grid-template-columns:1fr}}
.f-stat{background:#fff;padding:30px 26px}
.f-stat b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(32px,3.6vw,44px);color:var(--navy-deep);line-height:1;letter-spacing:-.03em}
.f-stat span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--gold-deep);margin:14px 0 8px}
.f-stat p{font-size:14px;color:#5b6673;margin:0;line-height:1.55}

/* giving tiers */
.f-tiers{display:grid;gap:12px;margin-top:38px}
.f-tier{
  background:#fff;border:1px solid var(--cream-2);padding:24px 26px;
  display:grid;grid-template-columns:210px 1fr;gap:10px 28px;align-items:start;
  transition:border-color .22s ease,transform .22s ease;
}
.f-tier:hover{border-color:var(--gold);transform:translateY(-2px)}
.f-tier b{font-family:var(--display);font-weight:800;font-size:clamp(18px,2vw,21px);color:var(--navy-deep);letter-spacing:-.02em;line-height:1.2}
.f-tier em{display:block;font-family:var(--mono);font-style:normal;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);margin-top:8px}
.f-tier p{margin:0;font-size:15px;color:#4a5563;line-height:1.6}
@media(max-width:760px){.f-tier{grid-template-columns:1fr;gap:12px}}


/* accountability list */
.f-acc{display:grid;gap:1px;background:var(--cream-2);border:1px solid var(--cream-2);margin-top:36px}
.f-acc div{background:#fff;padding:20px 24px;display:grid;grid-template-columns:170px 1fr;gap:8px 26px}
.f-acc span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep);padding-top:3px}
.f-acc p{margin:0;font-size:14.5px;color:#4a5563;line-height:1.6}
.f-acc a{color:var(--gold-deep);text-decoration:none;border-bottom:1px solid rgba(196,132,26,.4)}
.f-acc a:hover{border-bottom-color:var(--gold-deep)}
@media(max-width:760px){.f-acc div{grid-template-columns:1fr;gap:6px}}

/* --- footer --- */
.foot{background:#0b1119;border-top:1px solid rgba(255,255,255,.08);padding:56px 0 32px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr}}
.foot h5{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 16px;font-weight:500}
.foot a{color:var(--text-dim);text-decoration:none;font-size:14px;display:block;margin-bottom:9px;transition:color .18s ease}
.foot a:hover{color:#fff}
.foot-legal{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);font-size:12.5px;color:rgba(255,255,255,.36);line-height:1.7}

/* --- reveal --- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.rv.in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .rv{opacity:1;transform:none}
  .spine-bar i{width:100% !important}
}

/* --- print (assessment result) --- */
@media print{
  body{background:#fff;color:#000}
  .nav,.foot,.progress,.asmt-actions,.no-print{display:none !important}
  .page{display:block !important}
  .verdict,.q,.dim,.move,.card{border-color:#ccc !important;background:#fff !important}
  h1,h2,h3,h4,.verdict-score,.dim-n,.q-t{color:#000 !important}
  p,.dim-note,.small{color:#333 !important}
  .verdict-band,.dim-v,.move b{color:#8a5c0f !important}
}

/* ============================================================
   SCALABILITY STRESS TEST
   New rules only. Nothing above this point is modified.
   ============================================================ */
.stress-intro{border:1px solid rgba(255,255,255,.09);background:#131c26;padding:clamp(24px,3.4vw,38px);margin-top:36px}
.stress-10x{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
@media(max-width:760px){.stress-10x{grid-template-columns:1fr 1fr}}
.stress-10x span{display:block;background:#0d141d;border:1px solid rgba(255,255,255,.09);padding:12px 14px;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:rgba(255,255,255,.7);text-align:center}
.stress-facts{display:flex;gap:26px;flex-wrap:wrap;margin-top:22px}
.stress-facts div{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.stress-facts b{color:var(--gold);font-weight:500}

/* radar chart */
.radar-wrap{border:1px solid rgba(255,255,255,.09);background:#0d141d;padding:clamp(20px,3vw,36px);margin-top:8px}
.radar-wrap svg{width:100%;height:auto;display:block;max-width:560px;margin:0 auto}

/* score dashboard */
.score-hero{text-align:center;padding:clamp(30px,5vw,50px) 0 clamp(20px,3vw,30px)}
.score-num{font-family:var(--display);font-weight:800;font-size:clamp(64px,10vw,110px);color:#fff;line-height:1;letter-spacing:-.03em}
.score-num span{font-size:.32em;color:var(--text-dim);font-weight:600}
.score-band{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:13px;letter-spacing:.16em;color:var(--gold);border:1px solid rgba(245,166,35,.4);padding:8px 18px}
.score-body{max-width:56ch;margin:20px auto 0;font-size:16px;line-height:1.6;color:var(--text)}

.lever-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);margin-top:14px}
@media(max-width:700px){.lever-grid{grid-template-columns:1fr}}
.lever-col{background:var(--ink);padding:24px 26px}
.lever-col h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px}
.lever-col.strong h4{color:#5fd88a}
.lever-col.weak h4{color:#ff8b87}
.lever-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid rgba(255,255,255,.06)}
.lever-item:first-of-type{border-top:0}
.lever-item span:first-child{font-size:14.5px;color:#fff}
.lever-item span:last-child{font-family:var(--mono);font-size:13px;color:var(--gold)}

.gate-panel{border:1px solid rgba(245,166,35,.35);background:linear-gradient(150deg,rgba(245,166,35,.08),rgba(245,166,35,.01));padding:clamp(26px,4vw,40px);margin-top:34px;text-align:center}
.gate-panel h3{font-size:clamp(20px,2.6vw,26px);margin-bottom:12px}
.gate-panel p{max-width:52ch;margin:0 auto 22px;color:var(--text)}

.report-section{margin-top:44px;padding-top:34px;border-top:1px solid rgba(255,255,255,.1)}
.tenx-box{border:1px dashed rgba(245,166,35,.4);padding:22px 24px;margin-top:20px}
.tenx-box span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.tenx-box p{margin:0;font-size:16px;color:#fff;font-family:var(--display);font-weight:700}

.move-card{border:1px solid rgba(255,255,255,.09);background:#131c26;padding:22px 24px;margin-bottom:12px}
.move-card .mv-n{font-family:var(--mono);font-size:11px;color:var(--gold);letter-spacing:.1em}
.move-card h4{margin:8px 0 8px;font-size:17px}
.move-card p{font-size:14.5px;color:var(--text-dim);margin-bottom:10px}
.move-card .mv-metric{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.05em}
.move-card .mv-metric b{color:var(--gold);font-weight:500;text-transform:uppercase;letter-spacing:.1em;font-size:9.5px;display:block;margin-bottom:5px}

.leverage-panel{border:1px solid rgba(255,255,255,.1);background:linear-gradient(160deg,#16202c,#0d141d);padding:clamp(28px,4vw,44px);text-align:center;margin-top:8px}
.leverage-eq{font-family:var(--display);font-weight:800;font-size:clamp(18px,2.6vw,26px);color:#fff;letter-spacing:-.01em;line-height:1.5}
.leverage-eq .up{color:#5fd88a}
.leverage-eq .flat{color:var(--text-dim)}
.leverage-eq .eq{color:var(--gold);margin:0 14px}

.share-card{border:1px solid rgba(255,255,255,.09);background:#0d141d;padding:22px 24px;margin-top:30px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.share-card p{margin:0;font-size:13.5px;color:var(--text-dim)}

#stressForm .field-row{margin-bottom:0}
.consent-row{display:flex;gap:10px;align-items:flex-start;margin-top:4px}
.consent-row input{margin-top:4px;accent-color:var(--gold)}
.consent-row label{font-size:12.5px;color:var(--text-dim);line-height:1.5}
.hp-field{position:absolute;left:-9999px;top:-9999px}

/* progressive question reveal, used by both assessment tools */
.q-hidden{display:none}
.q-reveal{animation:qreveal .5s cubic-bezier(.22,1,.36,1)}
@keyframes qreveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.q-reveal{animation:none}}