/* SPLIT. — style */
:root{
  --canvas:#120b08;
  --stage:#1c100a;
  --panel:#211511;
  --ink:#3a1c0e;
  --accent:#e6a63c;
  --accent-hover:#f4bc5a;
  --accent-muted:rgba(230,166,60,.16);
  --accent-hero:#ffd68f; /* the accent lifted for words over live footage, so the worst-frame audit clears 3.5:1 */
  --text-secondary:#b9a48f;
  --text-primary:#f6eadb;
  --line:rgba(246,234,219,.12);
  --line-strong:#8a6a45;
  --display:'Bricolage Grotesque',system-ui,sans-serif;
  --body:'Archivo',system-ui,sans-serif;
  --mono:'Space Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --tshadow:0 1px 2px rgba(5,5,10,.95),0 3px 12px rgba(5,5,10,.78),0 10px 44px rgba(5,5,10,.8);
  --wrap:1180px;
}
*{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip;scroll-behavior:smooth}
body{margin:0;background:var(--canvas);color:var(--text-primary);font-family:var(--body);font-size:17px;line-height:1.55;overflow-x:hidden;overflow-x:clip;-webkit-font-smoothing:antialiased;animation:pagein 1.2s var(--ease) both}
@keyframes pagein{from{opacity:0}to{opacity:1}}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--accent);color:var(--canvas);padding:10px 14px;border-radius:8px;font-weight:600;transition:top .3s var(--ease)}
.skip:focus{top:16px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}

/* type */
.display{font-family:var(--display);font-weight:800;letter-spacing:-.02em;line-height:.95;text-transform:uppercase}
.h2{font-size:clamp(34px,4.6vw,64px);max-width:16ch}
.h3{font-size:clamp(24px,2.4vw,32px)}
.kicker{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--accent);text-transform:uppercase}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:var(--text-secondary)}
.lede{font-size:clamp(17px,1.4vw,20px);color:var(--text-secondary);max-width:52ch}
.micro{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--text-secondary)}
.sub{font-size:clamp(17px,1.5vw,21px);max-width:38ch}

/* the environment layer */
.env{position:fixed;inset:-10%;z-index:-1;pointer-events:none;background:
  radial-gradient(60% 50% at 20% 20%,rgba(230,166,60,.10),transparent 60%),
  radial-gradient(50% 45% at 80% 70%,rgba(140,70,25,.14),transparent 60%),
  var(--canvas);
  animation:drift 90s ease-in-out -30s infinite alternate}
.env::after{content:"";position:absolute;inset:0;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");background-size:160px}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(-3%,2%) scale(1.06)}}

/* buttons */
.btn{display:inline-block;background:var(--accent);color:var(--canvas);font-weight:600;font-size:15px;letter-spacing:.01em;padding:14px 22px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;font-family:var(--body);transition:background .3s var(--ease),transform .5s var(--ease-out),box-shadow .4s var(--ease);position:relative}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 rgba(230,166,60,.0),0 10px 40px rgba(230,166,60,.35);opacity:0;transition:opacity .4s var(--ease)}
.btn:hover{background:var(--accent-hover);transform:translateY(-2px)}
.btn:hover::after{opacity:1}
.btn-line{background:transparent;color:var(--text-primary);box-shadow:inset 0 0 0 1.5px var(--line-strong)}
.btn-line:hover{background:rgba(246,234,219,.06);color:var(--text-primary)}
.ghost{color:var(--text-primary);text-decoration:none;font-weight:600;padding:14px 4px;border-bottom:1.5px solid var(--accent);transition:color .3s var(--ease),border-color .3s var(--ease)}
.ghost:hover{color:var(--accent)}
@media (pointer:coarse){.btn,.ghost{min-height:44px;display:inline-flex;align-items:center;justify-content:center}}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 24px;transition:background .5s var(--ease),backdrop-filter .5s var(--ease),box-shadow .5s var(--ease)}
.nav.solid{background:rgba(18,11,8,.82);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.02em}
.mark{width:30px;height:30px;fill:var(--accent);stroke:var(--canvas);stroke-width:5;stroke-linejoin:round;stroke-linecap:round}
.mark path{fill:none}
.nav nav{display:flex;gap:26px}
.nav nav a{text-decoration:none;font-size:14px;font-weight:600;color:var(--text-secondary);transition:color .3s var(--ease)}
.nav nav a:hover{color:var(--text-primary)}
.btn-nav{padding:10px 18px;font-size:14px}
@media (max-width:820px){.nav nav{display:none}.nav{padding:12px 16px}}

/* hero */
.hero{position:relative;height:450vh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--stage)}
.stage video,.poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.poster{background-size:cover;background-position:center}
.stage video{opacity:0;transition:opacity .8s var(--ease);will-change:transform;transform:translateZ(0)}
.stage.video-ready video{opacity:1}
.stage.video-failed video{display:none}
.scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(10,6,4,0) 35%,rgba(10,6,4,.62) 100%)}
.ring{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);width:36px;height:36px;color:var(--accent);opacity:.9;transition:opacity .5s var(--ease)}
.ring circle{transition:stroke-dashoffset .15s linear}
.stage.video-ready .ring{opacity:0}
.cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary);opacity:0;transition:opacity .6s var(--ease)}
.cue i{width:1px;height:34px;background:linear-gradient(var(--accent),transparent);animation:cue 2.4s var(--ease) -1.2s infinite}
.stage.video-ready .cue,.stage.video-failed .cue{opacity:1}
.stage.past .cue{opacity:0}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-height:560px){.cue{display:none}}

/* bands */
.band{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 6vw;opacity:0;pointer-events:none;text-shadow:var(--tshadow)}
.band.active{pointer-events:auto}
.band .btn,.band .ghost{text-shadow:none}
.band::before,.band::after{content:"";position:absolute;inset:-4%;pointer-events:none;z-index:0;opacity:calc(.25 + .75*var(--k,1))}
.band::after{display:none}
.band>*{z-index:1}
.col-left{align-items:flex-start}
.col-left>*{position:relative;width:min(30vw,440px)}
.col-left::before{background:radial-gradient(ellipse 42% 64% at 22% 50%,rgba(8,4,2,.84) 0%,rgba(8,4,2,.62) 46%,rgba(8,4,2,0) 76%)}
.col-right{align-items:flex-end;text-align:right}
.col-right>*{position:relative;width:min(30vw,440px)}
.col-right::before{background:radial-gradient(ellipse 42% 64% at 78% 50%,rgba(8,4,2,.84) 0%,rgba(8,4,2,.62) 46%,rgba(8,4,2,0) 76%)}
.col-both{flex-direction:row;justify-content:space-between;align-items:center}
.col-both>*{position:relative;width:min(28vw,400px)}
.col-both .side-r{text-align:right}
.col-both::before{background:radial-gradient(ellipse 40% 62% at 19% 50%,rgba(8,4,2,.88) 0%,rgba(8,4,2,.68) 46%,rgba(8,4,2,0) 76%)}
.col-both::after{display:block;background:radial-gradient(ellipse 40% 62% at 81% 50%,rgba(8,4,2,.88) 0%,rgba(8,4,2,.68) 46%,rgba(8,4,2,0) 76%)}
.settle{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:4vw;padding:0 6vw 7vh}
.settle>*{position:relative}
.settle::before{inset:0;background:linear-gradient(180deg,rgba(8,4,2,0) 38%,rgba(8,4,2,.5) 66%,rgba(8,4,2,.86) 100%)}
.settle-right{width:min(40vw,520px);display:flex;flex-direction:column;gap:20px;padding-bottom:1.2vh}
.band .kicker{margin-bottom:18px}
.band h1,.band .display{font-size:clamp(36px,4.8vw,80px);max-width:9ch}
.col-right .display{margin-left:auto}
.settle .hero-title{font-size:clamp(72px,11vw,168px);line-height:.82;max-width:none;margin-bottom:-.06em}
.settle .sub{color:var(--text-primary);max-width:none}
.cta-row{display:flex;gap:22px;align-items:baseline;justify-content:flex-start;flex-wrap:wrap}
.chip{display:inline-block;background:rgba(14,8,5,.55);border:1px solid rgba(120,90,60,.35);border-radius:10px;padding:8px 12px;backdrop-filter:blur(10px);text-shadow:0 1px 3px rgba(5,5,10,.85)}

/* split-text choreography: transform + opacity only, driven by --k */
.w{display:inline-block;white-space:pre}
.band-1 .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);--ks:clamp(0,(var(--k,0) - var(--th,0) - var(--sd,.1))*var(--ss,3.2),1);opacity:var(--kc);transform:scale(calc(.6 + (.4 + var(--ov,.12))*var(--kc) - var(--ov,.12)*var(--ks)));transform-origin:50% 80%}
.band-1 .w.em{--ov:.24;--sd:.16;--ss:2.6;color:var(--accent-hero)}
.band-2 .half{display:inline-block;--kc:clamp(0,(var(--k,0) - var(--th,0))*2.4,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc))*var(--jx,0px)))}
.band-2 .half-l{--jx:44px;--th:0}.band-2 .half-r{--jx:-44px;--th:.08;color:var(--accent-hero)}
.band-3 .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*-28px))}
.band-4 .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*34px))}
.band-4 .sub{--ks:clamp(0,(var(--k,0) - .5)*3,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks))*14px))}
.band-4 .cta-row{--kb:clamp(0,(var(--k,0) - .7)*4,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*12px))}

/* static hero (five gates, identical in JS) */
.static-hero{display:none}
@media (max-width:720px),(orientation:portrait) and (max-width:1024px),(orientation:portrait) and (pointer:coarse),(orientation:landscape) and (pointer:coarse) and (max-height:560px),(prefers-reduced-motion:reduce){
  .hero{height:auto}
  .stage{position:relative;height:100svh;min-height:560px}
  .stage video,.poster,.ring,.cue,.band{display:none}
  .static-hero{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:14px;position:absolute;inset:0;padding:0 6vw 12vh;background:linear-gradient(180deg,rgba(18,11,8,.1),rgba(18,11,8,.25) 50%,rgba(18,11,8,.9)),url("hero-static.jpg") center 40%/cover no-repeat var(--stage);text-shadow:var(--tshadow)}
  .static-hero .display{font-size:clamp(84px,24vw,180px);line-height:.85}
}
/* phones in portrait get a native portrait still, sharp on 3x displays; wide static heroes keep the landscape ending frame */
@media (max-width:720px) and (orientation:portrait),(orientation:portrait) and (pointer:coarse) and (max-width:1024px){
  .static-hero{background-image:linear-gradient(180deg,rgba(18,11,8,.05),rgba(18,11,8,.2) 55%,rgba(18,11,8,.92)),url("hero-static-portrait.jpg");background-position:center top;background-size:cover}
  .static-hero .btn{text-shadow:none;margin-top:6px}
}

/* ticker */
.ticker{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;font-family:var(--mono);font-size:13px;letter-spacing:.18em;color:var(--accent);background:rgba(18,11,8,.6)}
.track{display:flex;white-space:nowrap;width:max-content;animation:tick 38s linear -10s infinite}
.track span{padding-right:.5em}
@keyframes tick{to{transform:translateX(-50%)}}

/* sections */
.sec{position:relative;padding:clamp(80px,12vw,150px) 0}
/* an anchor jump must clear the fixed header, or the heading lands behind it */
.sec,#top,#main{scroll-margin-top:84px}
@media (max-width:820px){.sec,#top,#main{scroll-margin-top:70px}}
.wrap{width:min(var(--wrap),100% - 32px);margin:0 auto}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center}
.head{margin-bottom:clamp(40px,5vw,70px)}
.kicker+.h2,.kicker+.display{margin-top:18px}
.h2+.lede{margin-top:22px}
@media (max-width:820px){.two{grid-template-columns:1fr}}

/* entrance choreography */
.reveal .part{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease-out),transform 1s var(--ease-out)}
.reveal.in .part{opacity:1;transform:none}
.reveal.in .part:nth-child(2){transition-delay:.08s}
.reveal.in .part:nth-child(3){transition-delay:.16s}
.reveal.in .part:nth-child(4){transition-delay:.24s}
.reveal.in .part:nth-child(5){transition-delay:.32s}
.reveal.in .part:nth-child(6){transition-delay:.4s}
.reveal.done .part:nth-child(n){transition-delay:0s}

/* idea + hold */
.idea .done-line{margin-top:26px;color:var(--accent);font-weight:600}
.idea .reveal.in .done-line{opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.idea.split-done .reveal.in .done-line{opacity:1;transform:none}
.hold-wrap{display:flex;flex-direction:column;align-items:center;gap:18px}
.hold-label{text-align:center}
/* pan-y, not none: a finger that starts on the frame can still scroll the page away, and a still finger performs the hold */
.hold{background:transparent;border:0;padding:0;cursor:pointer;width:100%;max-width:560px;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:20px;color:inherit;font:inherit}
.hold-frame{position:relative;display:block;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:var(--stage);border:1px solid var(--line);box-shadow:0 30px 80px rgba(0,0,0,.55);transition:transform .7s var(--ease-out),border-color .5s var(--ease)}
.hold:hover .hold-frame{transform:translateY(-3px);border-color:var(--line-strong)}
.hold-frame img,.hold-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hold-b{opacity:var(--hp,0)}
.hold-v{opacity:0}
.hold.has-video .hold-v{opacity:1}
.hold-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 50% at 50% 55%,rgba(230,166,60,.28),transparent 70%);opacity:calc(var(--hp,0)*.9);mix-blend-mode:screen}
.hold-bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(246,234,219,.12)}
.hold-bar i{display:block;height:100%;width:calc(var(--hp,0)*100%);background:var(--accent);box-shadow:0 0 16px rgba(230,166,60,.8)}
.hold-hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-primary);opacity:calc(1 - var(--hp,0)*2.2);transition:opacity .2s var(--ease)}
.hold.done .hold-hint{opacity:0}
.hold:focus-visible{outline:3px solid var(--accent);outline-offset:4px}

/* crack lines (signature) */
.crack{display:block;width:100%;height:44px;fill:none;stroke:var(--accent);stroke-width:2;stroke-linejoin:round;opacity:.9}
.crack path{stroke-dasharray:1;stroke-dashoffset:var(--d,1)}

/* flavors */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,32px)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px 18px 26px;position:relative;overflow:hidden;transition:transform .6s var(--ease-out),border-color .5s var(--ease)}
.card figure{border-radius:12px;overflow:hidden;aspect-ratio:3/2;background:var(--stage);margin-bottom:18px}
.card img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.card:hover{transform:translateY(-4px);border-color:var(--line-strong)}
.card:hover img{transform:scale(1.04)}
.card .mono{color:var(--accent)}
.card .h3{margin:6px 0 10px}
.card p:not(.mono){color:var(--text-secondary);font-size:16px}
.card .lit{}
.flavors .micro{margin-top:28px}
.cards .card{--lit:0}
.cards .card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1.5px var(--accent),0 0 60px rgba(230,166,60,.18);opacity:var(--lit);transition:opacity .9s var(--ease)}
.cards.lit .card:nth-child(1){--lit:1;transition-delay:0s}
.cards.lit .card:nth-child(2){--lit:1}
.cards.lit .card:nth-child(3){--lit:1}
.cards.lit .card:nth-child(1)::after{transition-delay:0s}
.cards.lit .card:nth-child(2)::after{transition-delay:.25s}
.cards.lit .card:nth-child(3)::after{transition-delay:.5s}
@media (max-width:820px){.cards{grid-template-columns:1fr}}

/* oven */
.oven-grid{grid-template-columns:.8fr 1.2fr}
.bignum-wrap{position:relative}
.bignum{font-size:clamp(88px,14vw,200px);letter-spacing:-.04em;line-height:1;color:var(--text-primary);font-weight:700;position:relative}
.bignum::after{content:"";position:absolute;inset:-10%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(230,166,60,.22),transparent 65%);opacity:.7;animation:glow 5s ease-in-out -2s infinite alternate}
@keyframes glow{from{opacity:.4}to{opacity:1}}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.chips .chip{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--text-primary);backdrop-filter:none;text-shadow:none}
@media (max-width:820px){.oven-grid{grid-template-columns:1fr}}

/* ship */
.ship{overflow:hidden}
.crumbfield{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.crumbfield i{position:absolute;top:-4%;width:4px;height:4px;border-radius:50%;background:#7a4a22;opacity:0;animation:fall var(--t,14s) linear var(--dl,0s) infinite}
@keyframes fall{0%{transform:translateY(0) translateX(0);opacity:0}10%{opacity:.7}90%{opacity:.5}100%{transform:translateY(110vh) translateX(var(--x,20px));opacity:0}}
.box-fig{border-radius:20px;overflow:hidden;aspect-ratio:3/2;background:var(--panel);border:1px solid var(--line)}
.box-fig img{width:100%;height:100%;object-fit:cover}
.ship-grid{position:relative}

/* steps */
.steps-grid{position:relative;padding-top:30px}
.steps-line{position:absolute;left:0;right:0;top:0;height:60px}
.step-list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,60px);padding-top:30px}
.step .num{width:64px;height:64px;fill:none;stroke:var(--accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:18px}
.step .num path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--ease-out) .2s}
.step.in .num path{stroke-dashoffset:0}
.step .h3{margin-bottom:10px}
.step p:not(.mono){color:var(--text-secondary);font-size:16px;max-width:30ch}
@media (max-width:820px){.step-list{grid-template-columns:1fr}.steps-line{display:none}}

/* price */
.boxes{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,32px);max-width:860px}
.box{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:30px 28px 28px;display:flex;flex-direction:column;gap:12px;align-items:flex-start;transition:transform .6s var(--ease-out),border-color .5s var(--ease)}
.box:hover{transform:translateY(-4px);border-color:var(--line-strong)}
.box-hi{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset,0 30px 80px rgba(230,166,60,.10)}
.box .amount{font-size:clamp(56px,7vw,96px);line-height:.9;letter-spacing:-.03em}
.box .tag{position:absolute;top:-12px;right:22px;background:var(--accent);color:var(--canvas);border-radius:999px;padding:5px 10px;font-size:11px;font-weight:700;letter-spacing:.12em}
.box .btn{margin-top:10px}
.box p:not(.mono):not(.amount){color:var(--text-secondary)}
@media (max-width:640px){.boxes{grid-template-columns:1fr}}

/* voices */
.voices{overflow:hidden}
.voices-bg{position:absolute;inset:0;background:url("hero-ending.jpg") center/cover no-repeat;opacity:.22;filter:saturate(.8)}
@media (max-width:820px){.voices-bg{background-image:url("hero-ending-760.jpg")}}
.voices-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--canvas),rgba(18,11,8,.7) 30%,rgba(18,11,8,.7) 70%,var(--canvas))}
.voices .wrap{position:relative}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);margin-top:36px}
.quote blockquote p{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.2vw,30px);line-height:1.1;letter-spacing:-.01em}
.quote blockquote p::before{content:"\201E"}.quote blockquote p::after{content:"\201C"}
.quote .mono{margin-top:16px}
@media (max-width:820px){.quotes{grid-template-columns:1fr}}

/* faq */
.faq-grid{align-items:start;grid-template-columns:.8fr 1.2fr}
.q{border-top:1px solid var(--line)}
.q:last-child{border-bottom:1px solid var(--line)}
.q summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:22px 0;font-weight:600;font-size:18px;transition:color .3s var(--ease)}
.q summary::-webkit-details-marker{display:none}
.q summary:hover{color:var(--accent)}
.plus{position:relative;width:16px;height:16px;flex:none;align-self:center}
.plus::before,.plus::after{content:"";position:absolute;background:var(--accent);left:0;top:7px;width:16px;height:2px;transition:transform .5s var(--ease-out)}
.plus::after{transform:rotate(90deg)}
.q[open] .plus::after{transform:rotate(0)}
.q .a{overflow:hidden;padding:0 0 22px;color:var(--text-secondary);max-width:56ch}
.q .a p{transform:translateY(-6px);opacity:0;transition:transform .5s var(--ease-out),opacity .5s var(--ease)}
.q[open] .a p{transform:none;opacity:1}
@media (max-width:820px){.faq-grid{grid-template-columns:1fr}}

/* drop */
.drop{padding-bottom:clamp(100px,14vw,180px)}
.drop-wrap{max-width:720px;text-align:center;display:flex;flex-direction:column;align-items:center}
.drop .lede{margin:22px auto 34px}
.form{width:100%;max-width:560px;text-align:left}
.form label{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--text-secondary);margin-bottom:10px;text-transform:uppercase}
.form .row{display:flex;gap:10px}
.form input{flex:1;min-width:0;background:rgba(246,234,219,.04);border:1.5px solid var(--line-strong);color:var(--text-primary);border-radius:999px;padding:14px 20px;font:inherit;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.form input::placeholder{color:rgba(185,164,143,.6)}
.form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-muted)}
.form .err{min-height:22px;color:#ffb58a;font-size:14px;margin-top:10px}
.form .micro{margin-top:4px;text-align:center}
.success{padding-top:10px}
.success .lede{margin-top:16px}
@media (max-width:560px){.form .row{flex-direction:column}.form .btn{width:100%}}

/* footer */
.foot{border-top:1px solid var(--line);padding:50px 0 40px;color:var(--text-secondary);font-size:14px}
.foot-grid{display:grid;grid-template-columns:auto 1fr;gap:24px 60px;align-items:center}
.foot nav{display:flex;gap:22px;flex-wrap:wrap}
.foot nav a{text-decoration:none;color:var(--text-secondary);transition:color .3s var(--ease)}
.foot nav a:hover{color:var(--text-primary)}
@media (pointer:coarse){
  .foot nav{gap:10px 26px}
  .foot nav a{display:inline-flex;align-items:center;min-height:44px}
  .brand{min-height:44px}
}
.disclose{grid-column:1/-1;max-width:70ch}
.credit{grid-column:1/-1;font-size:12px}
@media (max-width:640px){.foot-grid{grid-template-columns:1fr}}

/* pause everything on hidden tabs */
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* reduced motion + pinned final states */
body.pinned .crack path,body.pinned .step .num path{stroke-dashoffset:0!important}
body.pinned .hold{--hp:1}
body.pinned .reveal .part{opacity:1!important;transform:none!important}
body.pinned .idea .done-line{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important}
  body{animation:none}
  .reveal .part{opacity:1;transform:none}
  .crack path,.step .num path{stroke-dashoffset:0!important}
  .hold{--hp:1}
  .idea .done-line{opacity:1;transform:none}
  .cards.lit .card{--lit:1}
  .q .a p{opacity:1;transform:none}
}