/* ============ STORY: the light comes on (pinned, scrubbed by JS vars) ============ */
.story{position:relative;height:500vh;background:var(--ivory)}
.story-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;color:var(--cream)}
.sky{position:absolute;inset:0;z-index:-1;background:var(--ivory)}
.sky i{position:absolute;inset:0;display:block}
.dusk{opacity:var(--dk,1);background:
  radial-gradient(70% 80% at 72% 62%,#9C4A1E 0%,#6A2615 36%,#3A130D 72%,#2A0F0B 100%)}
.amber{opacity:calc(var(--dk,1) * var(--g,0));background:radial-gradient(38% 46% at 72% 58%,rgba(255,176,64,.55) 0%,rgba(255,140,40,.18) 45%,rgba(255,140,40,0) 70%);mix-blend-mode:screen}
.dust{position:absolute;inset:0;width:100%;height:100%;opacity:var(--dk,1)}

.story-grid{position:relative;height:100%;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(30px,5vw,90px);padding:var(--nav) var(--gut) 40px}
.beats{display:grid}
.beat{grid-area:1/1;--o:0;opacity:var(--o);filter:blur(calc((1 - var(--o)) * 10px));transform:translateY(calc((1 - var(--o)) * 34px));will-change:opacity,transform}
.beat-day{color:var(--ink)}
.b-txt{font-family:var(--serif);font-weight:400;font-size:clamp(52px,6.6vw,120px);line-height:.98;letter-spacing:-.018em;text-shadow:0 2px 40px rgba(42,15,11,.35)}
.beat-day .b-txt{text-shadow:none}
.b-txt em{font-style:normal;color:#FFC15A}
.beat-day .b-txt em{color:var(--red)}
.b-sub{margin-top:26px;max-width:30ch;font-size:clamp(19px,1.5vw,23px);line-height:1.5;color:rgba(251,244,232,.9)}
.beat-day .b-sub{color:var(--ink-2)}
.b-txt .w{opacity:clamp(.08,calc(var(--o) * 1.6 * var(--n) - var(--i)),1)}

.props{position:relative;display:grid;place-items:center;height:100%}
.dash{grid-area:1/1;position:relative;width:clamp(240px,26vw,380px);aspect-ratio:1;display:grid;place-items:center;--d:1;opacity:var(--d);transform:scale(calc(.9 + var(--d) * .1))}
.dash-ring{position:absolute;inset:0;width:100%;height:100%}
.dash-ring circle{fill:rgba(20,8,6,.55);stroke:rgba(255,220,180,.22);stroke-width:1.5}
.dash-ticks line{stroke:rgba(255,226,190,.5);stroke-width:2;stroke-linecap:round}
.engine{width:46%;fill:#3a1a0f;filter:drop-shadow(0 0 0 rgba(255,170,40,0));transition:none}
.dash.lit .engine{fill:#FFB238;filter:drop-shadow(0 0 calc(var(--g) * 22px) rgba(255,170,40,.95)) drop-shadow(0 0 calc(var(--g) * 60px) rgba(255,140,30,.6))}
.dash-lbl{position:absolute;bottom:22%;font-size:13px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,214,160,calc(.6 + var(--g) * .4))}

.story .receipt{grid-area:1/1;position:relative;inset:auto;right:auto;bottom:auto;width:clamp(310px,25vw,370px);margin:0;--r:0;opacity:var(--r);transform:translateY(calc((1 - var(--r)) * 80px)) rotate(calc((1 - var(--r)) * 4deg));filter:drop-shadow(0 40px 60px rgba(20,6,4,.5))}
.story .paper{animation:none!important}
.story .strike i{animation:none!important;transform:scaleX(var(--s,0))}
.story .rl{opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s}
.story .rl.on{opacity:1;transform:none}
.story .r-total{transition:background .4s,box-shadow .4s}
.story .receipt.hl .r-total{background:rgba(255,193,90,.28);box-shadow:0 0 0 6px rgba(255,193,90,.28);border-radius:2px}
.story-bar{position:absolute;left:var(--gut);right:var(--gut);bottom:26px;height:2px;background:rgba(255,236,210,.22)}
.story-bar i{display:block;height:100%;background:#FFC15A;transform-origin:left;transform:scaleX(var(--w,0))}

/* ============ PROOF: 436 rolls up, cards fly in ============ */
.proof{position:relative;height:360vh;background:var(--ox)}
.proof-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;color:var(--cream)}
.proof-glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 60% at 24% 46%,rgba(214,92,52,.35) 0%,rgba(74,19,15,0) 70%),radial-gradient(50% 55% at 78% 60%,rgba(255,180,90,.12) 0%,rgba(74,19,15,0) 70%)}
.proof-grid{height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(40px,6vw,120px);padding:var(--nav) var(--gut) 40px}
.p-count{font-family:var(--serif);font-size:clamp(130px,15vw,260px);line-height:.8;letter-spacing:-.03em;color:#FFF5E6;font-variant-numeric:tabular-nums}
.p-line{margin-top:14px;font-family:var(--serif);font-weight:400;font-size:clamp(34px,3.2vw,56px);line-height:1.05;color:#FFF5E6}
.p-rating{display:flex;align-items:center;gap:16px;margin-top:26px;font-size:18px;color:rgba(251,244,232,.9)}
.p-stars{position:relative;display:inline-block;color:rgba(255,236,210,.22);font-size:26px;letter-spacing:4px;line-height:1}
.p-fill{position:absolute;inset:0;width:0;overflow:hidden;white-space:nowrap;color:var(--gold-l)}
.p-topics{display:flex;flex-direction:column;gap:18px;margin:34px 0 32px;padding-top:28px;border-top:1px solid rgba(251,244,232,.2);max-width:460px}
.p-topics .topic{display:grid;grid-template-columns:1fr auto;row-gap:10px;font-size:17px}
.p-topics .t-n{color:rgba(251,244,232,.85)}
.p-topics .t-bar{grid-column:1/-1;height:3px;background:rgba(251,244,232,.16)}
.p-topics .t-bar i{display:block;height:100%;width:100%;background:var(--gold-l);transform-origin:left;transform:scaleX(calc(var(--w) * var(--tb,0)))}
.deck{position:relative;height:min(64vh,520px)}
.deck .card{position:absolute;left:0;right:0;top:50%;--c:0;--k:0;opacity:var(--c);
  transform:translateY(calc(-50% + (1 - var(--c)) * 140px + var(--k) * -26px)) scale(calc(.82 + var(--c) * .18 - var(--k) * .05)) rotate(calc((1 - var(--c)) * -5deg));
  filter:blur(calc((1 - var(--c)) * 8px)) brightness(calc(1 - var(--k) * .18));
  background:var(--ox-2);border:1px solid rgba(251,244,232,.16);border-radius:6px;padding:clamp(30px,3vw,48px);box-shadow:0 50px 80px -40px rgba(0,0,0,.65)}
.deck .c-stars{color:var(--gold-l);letter-spacing:4px;font-size:18px}
.deck .c-text{margin-top:16px;font-family:var(--serif);font-size:clamp(26px,2.3vw,38px);line-height:1.2;color:#FFF5E6}
.deck .c-by{margin-top:22px;font-weight:700;font-size:17px;color:var(--cream)}
.deck .c-by span{font-weight:400;color:rgba(251,244,232,.85);margin-left:8px}

/* manny + visit scroll moments */
.manny .lead-p .w{opacity:.18}
.pin.drop{animation:drop .8s cubic-bezier(.3,1.6,.5,1) both}
@keyframes drop{from{transform:translateY(-120px) rotate(-45deg);opacity:0}to{transform:rotate(-45deg);opacity:1}}
.js .pin{opacity:0}
.js .pin.drop{opacity:1}

@media (max-width:1180px) and (min-width:761px){
  .story-grid,.proof-grid{grid-template-columns:1fr 1fr}
  .b-txt{font-size:clamp(46px,6vw,80px)}
}

@media (max-width:760px){
  .story{height:460vh}
  .story-grid{display:flex;flex-direction:column;justify-content:flex-start;gap:0;padding:calc(var(--nav) + 18px) var(--gut) 30px}
  .b-txt{font-size:clamp(40px,11.4vw,50px)}
  .b-sub{margin-top:14px;font-size:17.5px}
  .props{flex:1;width:100%;min-height:0;align-items:center}
  .dash{width:min(62vw,250px)}
  .story .receipt{width:min(84vw,330px);transform:translateY(calc((1 - var(--r)) * 60px)) scale(.9)}
  .story .paper{padding:18px 18px 26px;font-size:12px}
  .story .r-quote{font-size:17px}
  .story-bar{bottom:16px}

  .proof{height:340vh}
  .proof-grid{display:flex;flex-direction:column;justify-content:flex-start;gap:22px;padding:calc(var(--nav) + 20px) var(--gut) 30px}
  .p-count{font-size:clamp(96px,30vw,128px)}
  .p-line{font-size:26px;margin-top:8px}
  .p-rating{margin-top:14px;font-size:15.5px;gap:12px}
  .p-stars{font-size:20px}
  .p-topics,.proof-left .text{display:none}
  .deck{flex:1;width:100%;height:auto;min-height:0}
  .deck .card{padding:24px 22px}
  .deck .c-text{font-size:22px}
}
@media (prefers-reduced-motion:reduce){
  .story,.proof{height:auto}
  .story-pin,.proof-pin{position:relative;height:auto;min-height:100svh}
  .beat,.story .rl,.deck .card{opacity:1!important;filter:none!important;transform:none!important}
  .beat:not(.beat-day){display:none}
  .dash{display:none}
  .story .receipt{opacity:1;transform:none}
  .deck{height:auto}.deck .card{position:relative;top:auto;margin-bottom:16px}
}