:root{
  --ink:#100B18;
  --ink-soft:#241a33;
  --paper:#F7F0E1;
  --paper-2:#EFE4CE;
  --mag:#FF2D6F;
  --violet:#6C3BF4;
  --amber:#FFB13B;
  --teal:#00C2A8;
  --display:'Anton',Impact,sans-serif;
  --serif:'Instrument Serif',Georgia,serif;
  --body:'Inter Tight','Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ink);color:var(--paper);
  font-family:var(--body);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%}

/* ---------- chrome ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:4px;background:rgba(255,255,255,.14);z-index:50}
.progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--mag),var(--amber),var(--teal),var(--violet));transition:width .18s linear}
.counter{
  position:fixed;bottom:14px;right:14px;z-index:50;
  font-family:var(--display);font-size:14px;letter-spacing:.14em;
  background:var(--ink);color:var(--paper);border:1px solid rgba(247,240,225,.35);
  padding:6px 10px;border-radius:999px;mix-blend-mode:difference;
}

/* ---------- slide frame ---------- */
#deck{scroll-snap-type:y proximity}
.slide{
  position:relative;scroll-snap-align:start;
  min-height:100svh;padding:64px 20px 72px;
  display:flex;flex-direction:column;justify-content:center;gap:18px;
  border-bottom:1px solid rgba(255,255,255,.08);overflow:hidden;
}
.slide.paper{background:var(--paper);color:var(--ink);border-bottom-color:rgba(16,11,24,.12)}
.slide.dark{background:var(--ink);color:var(--paper)}
.slide.paper::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(16,11,24,.16) 1px,transparent 1px);
  background-size:16px 16px;opacity:.5;
}
.noise{position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1px);
  background-size:18px 18px;opacity:.35}

/* reveal */
.slide > *{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.slide.in > *{opacity:1;transform:none}
.slide.in > *:nth-child(2){transition-delay:.06s}
.slide.in > *:nth-child(3){transition-delay:.12s}
.slide.in > *:nth-child(4){transition-delay:.18s}
.slide.in > *:nth-child(5){transition-delay:.24s}
.noise{opacity:.35!important;transform:none!important}

/* ---------- type ---------- */
.eyebrow{
  font-family:var(--body);font-weight:700;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--mag);margin:0;
}
.eyebrow.light{color:var(--amber)}
.mega{font-family:var(--display);margin:0;line-height:.86;letter-spacing:-.01em;
  font-size:clamp(3.4rem,17vw,10rem);text-transform:uppercase}
.mega .line{display:block}
.mega .huge{font-size:clamp(4.4rem,24vw,15rem);line-height:.82}
.mega.mid{font-size:clamp(2.9rem,13vw,8rem)}
.big{font-family:var(--display);text-transform:uppercase;line-height:.94;
  font-size:clamp(2.1rem,8.4vw,4.6rem);margin:0;letter-spacing:-.005em}
.big .ital,.ital{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:0}
.grad{
  background:linear-gradient(96deg,var(--mag) 0%,var(--amber) 42%,var(--teal) 70%,var(--violet) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.grad-text{background:linear-gradient(96deg,var(--mag),var(--violet));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.lede{font-size:1.02rem;line-height:1.6;max-width:62ch;margin:0;color:inherit}
.lede.small{font-size:.92rem;opacity:.8}
.lede.center{max-width:56ch}
.slide.dark .lede,.slide.andrew .lede,.slide.ubiquity .lede{color:rgba(247,240,225,.86)}
.lede b{color:inherit}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,5.4vw,2.2rem);
  line-height:1.2;margin:0;border-top:2px solid currentColor;padding-top:16px;max-width:34ch}
.pull.light{color:var(--amber);border-color:rgba(255,177,59,.5)}

/* ---------- cover ---------- */
.cover{background:var(--ink);justify-content:space-between;padding-top:44px}
.cover-top{display:flex;flex-direction:column;gap:6px}
.wordmark{font-family:var(--display);font-size:1.5rem;letter-spacing:.02em;color:var(--mag);text-transform:lowercase}
.kicker{font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:.6}
.cover-sub{font-family:var(--serif);font-size:clamp(1.1rem,4.8vw,1.7rem);line-height:1.32;
  margin:0;max-width:30ch;color:var(--paper)}
.cover-sub em{color:var(--amber);font-style:italic}
.cover-sub b{font-family:var(--body);font-weight:700;font-size:.86em}
.cover-foot{display:flex;flex-direction:column;gap:8px;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;opacity:.65}
.cover-foot.solo{opacity:.6;text-align:center;align-items:center}
.scroll-hint span{display:inline-block;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

/* ---------- three-up ---------- */
.three{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.three li{position:relative;padding:18px 16px 16px;border:1px solid currentColor;border-radius:2px}
.slide.dark .three li{border-color:rgba(247,240,225,.28);background:rgba(247,240,225,.035)}
.three .n{position:absolute;top:-14px;left:14px;font-family:var(--display);font-size:1.5rem;
  line-height:1;padding:2px 9px;background:var(--mag);color:#fff}
.three li:nth-child(2) .n{background:var(--amber);color:var(--ink)}
.three li:nth-child(3) .n{background:var(--teal);color:var(--ink)}
.three li b{display:block;font-size:1.05rem;margin-bottom:4px}
.three li p{margin:0;font-size:.92rem;opacity:.82}
.three li em{font-family:var(--serif);font-style:italic}

/* ---------- stats ---------- */
.stat-row{display:grid;gap:12px}
.stat{border:2px solid var(--ink);padding:16px;background:#fff}
.stat b{display:block;font-family:var(--display);font-size:clamp(2.6rem,13vw,4.4rem);line-height:.9;color:var(--mag)}
.stat.alt b{color:var(--violet)}
.stat span{display:block;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-top:8px;opacity:.72}

/* ---------- andrew ---------- */
.andrew{background:
  radial-gradient(120% 80% at 8% 0%,rgba(108,59,244,.5),transparent 60%),
  radial-gradient(100% 70% at 100% 100%,rgba(255,45,111,.45),transparent 62%),
  var(--ink)}
.andrew-grid{display:grid;gap:22px}
.name{font-family:var(--display);font-size:clamp(3rem,16vw,7rem);line-height:.84;margin:0;
  text-transform:uppercase;letter-spacing:-.01em}
.role{font-family:var(--serif);font-style:italic;font-size:clamp(1rem,4.6vw,1.5rem);
  margin:10px 0 0;color:var(--amber)}
.badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.badges span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(247,240,225,.4);padding:5px 10px;border-radius:999px}
.andrew-bio p{font-size:1rem;line-height:1.62;margin:0 0 13px;color:rgba(247,240,225,.88);max-width:56ch}
.andrew-bio b{color:#fff}
.ubi{font-family:var(--serif);font-style:italic;font-size:1.12em;color:var(--amber)}
.why{font-family:var(--serif);font-style:italic;font-size:1.3rem!important;color:#fff!important;
  border-left:3px solid var(--mag);padding-left:14px;margin-top:18px!important}

/* ---------- ubiquity ---------- */
.ubiquity{background:var(--ink);text-align:center;align-items:center}
.ubiquity .mega{letter-spacing:.01em}
.ubiquity .grad{background-size:220% 100%;animation:shimmer 6s linear infinite}
@keyframes shimmer{to{background-position:220% 0}}
.quote-card{border:1px solid rgba(247,240,225,.3);background:rgba(247,240,225,.05);
  padding:20px;max-width:52ch;text-align:left}
.quote-card p{font-family:var(--serif);font-size:clamp(1.15rem,5vw,1.55rem);line-height:1.32;margin:0 0 12px}
.quote-card cite{font-style:normal;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;opacity:.6}

/* ---------- plan ---------- */
.plan{list-style:none;counter-reset:p;margin:0;padding:0;display:grid;gap:16px}
.plan li{counter-increment:p;border-top:2px solid var(--ink);padding-top:14px;position:relative}
.plan li::before{content:counter(p,decimal-leading-zero);font-family:var(--display);
  font-size:.95rem;letter-spacing:.1em;color:var(--mag);display:block;margin-bottom:6px}
.plan h3{font-family:var(--display);text-transform:uppercase;font-size:1.25rem;margin:0 0 6px;line-height:1.05}
.plan p{margin:0;font-size:.95rem;max-width:58ch}
.plan .metric{display:inline-block;margin-top:10px;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;background:var(--ink);color:var(--paper);padding:5px 10px}
.arrow{color:var(--amber)}

/* ---------- funds ---------- */
.funds{display:grid;gap:14px}
.fund{border-top:1px solid rgba(247,240,225,.3);padding-top:12px}
.fund-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.fund-head b{font-family:var(--display);text-transform:uppercase;font-size:1.02rem;line-height:1.1}
.fund-head span{font-family:var(--display);color:var(--amber);font-size:1.1rem;white-space:nowrap}
.fund .track{height:9px;background:rgba(247,240,225,.14);margin:10px 0 8px;overflow:hidden}
.fund .fill{height:100%;width:0;transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.fund:nth-child(1) .fill{background:var(--mag)}
.fund:nth-child(2) .fill{background:var(--amber)}
.fund:nth-child(3) .fill{background:var(--teal)}
.fund:nth-child(4) .fill{background:var(--violet)}
.fund:nth-child(5) .fill{background:var(--paper)}
.fund p{margin:0;font-size:.88rem;opacity:.75;max-width:52ch}

/* ---------- timeline ---------- */
.timeline{display:grid;gap:0}
.tl{display:grid;grid-template-columns:1fr auto;gap:10px 14px;align-items:start;
  padding:16px 0;border-top:2px solid var(--ink)}
.tl:last-child{border-bottom:2px solid var(--ink)}
.tl .when{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--violet);
  grid-column:1/-1;margin:0 0 2px;font-weight:700}
.tl h3{font-family:var(--display);text-transform:uppercase;font-size:1.2rem;margin:0 0 5px;line-height:1.05}
.tl p{margin:0;font-size:.93rem;max-width:52ch}
.tl .target{font-family:var(--display);font-size:1.15rem;color:var(--mag);white-space:nowrap;
  align-self:center;justify-self:end}

/* ---------- close ---------- */
.close{background:
  radial-gradient(120% 90% at 50% 0%,rgba(255,45,111,.45),transparent 62%),
  radial-gradient(100% 80% at 20% 100%,rgba(0,194,168,.32),transparent 60%),
  var(--ink);text-align:center;align-items:center}
.cta{display:inline-block;font-family:var(--display);text-transform:uppercase;
  font-size:1.1rem;letter-spacing:.06em;background:var(--paper);color:var(--ink);
  padding:16px 28px;text-decoration:none;border-radius:999px;min-height:44px;
  box-shadow:6px 6px 0 var(--mag);transition:transform .18s ease,box-shadow .18s ease}
.cta:hover,.cta:focus{transform:translate(-2px,-2px);box-shadow:9px 9px 0 var(--mag)}

/* ---------- desktop ---------- */
@media (min-width:760px){
  body{font-size:17px}
  .slide{padding:88px 8vw 96px;gap:24px}
  .three{grid-template-columns:repeat(3,1fr);gap:20px}
  .three.tight li{padding:22px 20px 18px}
  .stat-row{grid-template-columns:1fr 1fr;gap:20px}
  .andrew-grid{grid-template-columns:0.85fr 1.15fr;gap:44px;align-items:start}
  .plan{grid-template-columns:repeat(3,1fr);gap:26px}
  .funds{grid-template-columns:1fr 1fr;gap:20px 40px}
  .tl{grid-template-columns:170px 1fr auto;align-items:center}
  .tl .when{grid-column:auto;margin:0}
  .cover{padding:56px 8vw 64px}
  .cover .mega{font-size:clamp(3.2rem,8.4vw,7rem)}
  .cover .mega .huge{font-size:clamp(4.6rem,13vw,10.5rem)}
  .cover-sub{max-width:34ch}
  .cover-foot{flex-direction:row;justify-content:space-between}
  .counter{bottom:22px;right:22px;font-size:16px}
}
@media (min-width:1100px){
  .slide{padding:96px 10vw}
  .funds{grid-template-columns:repeat(2,1fr)}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .slide > *{opacity:1;transform:none}
}
