/* Reelstory sales page (story.reelzign.com).
   Same bands, components and behaviours as Reelshop's page (public/reelshop/sales.css), told as a film:
   the page starts at dusk (night bands) and the story section brightens to dawn, so everything after
   "Until finally" sits in morning light. The end credits (footer) go back to night.
   Reelstory "Orchid" (big-plan/logos/final/palette.json): brand #25B8C4, brandDark #1A8189 for buttons
   (white text passes AA), tint #E9F8F9. The gradient #3ED8CF -> #0B97B8 is used in the logo and as soft sky glow only. */
:root{
  --night:#091618;--night-2:#102226;--night-3:#162F34;--night-line:rgba(255,255,255,.1);
  --moon:#F3FBFC;--moon-muted:#C0D7DC;--moon-faint:#91ABB0;
  --day:#fffbfa;--day-2:#F5FCFD;--tint:#E9F8F9;--day-line:#E4EFF1;--day-line-strong:#D0E3E7;
  --ink:#132326;--ink-muted:#526B70;--ink-faint:#7A9196;
  --orchid:#25B8C4;--orchid-dark:#1A8189;--orchid-deeper:#136A71;--orchid-light:#3ED8CF;--orchid-deep:#0B97B8;--orchid-rgb:37 184 196;
  --peach:#ffc6a8;
  --font-text:"Geist",-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --radius:12px;--radius-lg:20px;--radius-xl:28px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;min-width:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip;background:var(--night)}
body{margin:0;background:var(--day);color:var(--ink);font:17px/1.6 var(--font-text);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0 0 16px}
h1,h2,h3,h4{margin:0;font-family:var(--font-text);font-weight:600}
h1{font-size:clamp(40px,6.6vw,86px);line-height:1.02;letter-spacing:-.05em;text-wrap:balance}
h2{font-size:clamp(32px,4.8vw,60px);line-height:1.05;letter-spacing:-.045em;text-wrap:balance}
h3{font-size:21px;line-height:1.3;letter-spacing:-.02em}
:focus-visible{outline:2px solid var(--orchid);outline-offset:3px}
[hidden]{display:none!important}
.skip-link{position:fixed;z-index:100;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);padding:10px 14px;border-radius:8px;background:var(--orchid-dark);color:#fff;font-weight:600}
.skip-link:focus{top:12px;left:12px;width:auto;height:auto;clip-path:none}

/* ---------- bands: night (dark) and day (light) ---------- */
.band{position:relative;padding:clamp(80px,11vw,150px) 0;background:var(--day);color:var(--ink)}
.band.day-2{background:var(--day-2)}
.band.tinted{background:linear-gradient(180deg,var(--day) 0%,var(--tint) 100%)}
.band.night{background:var(--night);color:var(--moon)}
.band.night-2{background:var(--night-2);color:var(--moon)}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px;margin-left:auto;margin-right:auto}
.center{text-align:center}
.eyebrow{display:block;margin:0 0 18px;color:var(--orchid-dark);font:500 12.5px/1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase}
.night .eyebrow,.night-2 .eyebrow,.on-dark .eyebrow{color:var(--orchid-light)}
.sec-head{max-width:820px;margin:0 auto clamp(40px,6vw,64px);text-align:center}
.sec-head p{margin:20px auto 0;max-width:680px;color:var(--ink-muted);font-size:20px;line-height:1.6}
.night .sec-head p,.night-2 .sec-head p{color:var(--moon-muted)}
.lead{font-size:clamp(19px,1.8vw,22px);line-height:1.65;color:var(--ink-muted)}
.night .lead,.night-2 .lead,.on-dark .lead{color:var(--moon-muted)}
.prose>p{color:var(--ink-muted);font-size:19px;line-height:1.75}
.night .prose>p,.night-2 .prose>p,.on-dark .prose>p{color:var(--moon-muted)}
.prose strong{color:var(--ink)}
.night .prose strong,.night-2 .prose strong,.on-dark .prose strong{color:var(--moon)}
.hl{background:linear-gradient(100deg,var(--orchid-light),var(--orchid-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.day-hl{color:var(--orchid-dark)}
.muted{color:var(--ink-muted)}
.small{font-size:14px}
.disclosure{margin:28px auto 0;max-width:760px;text-align:center;color:var(--ink-faint);font-size:13.5px;line-height:1.6}
.night .disclosure,.night-2 .disclosure,.on-dark .disclosure{color:var(--moon-faint)}
.todo{border-bottom:1px dashed currentColor}
html.show-slots [data-todo]{background:rgba(255,214,0,.35);outline:1px dashed #c49a00}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border-radius:999px;border:0;font:600 17px/1 var(--font-text);letter-spacing:-.01em;text-decoration:none;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .2s}
.btn-primary{background:var(--orchid-dark);color:#fff;box-shadow:0 10px 30px -10px rgba(var(--orchid-rgb)/.7),inset 0 1px 0 rgba(255,255,255,.18)}
.btn-primary:hover{background:var(--orchid-deeper);transform:translateY(-1px);box-shadow:0 16px 40px -12px rgba(var(--orchid-rgb)/.8),inset 0 1px 0 rgba(255,255,255,.2)}
.btn-glow{position:relative}
.btn-glow::after{content:"";position:absolute;inset:-6px;border-radius:inherit;background:radial-gradient(closest-side,rgba(var(--orchid-rgb)/.45),transparent);filter:blur(10px);z-index:-1;opacity:.8}
.btn-wide{width:100%}
.cta-block{margin-top:40px}
.cta-block.center{display:flex;flex-direction:column;align-items:center;text-align:center}
.cta-note{margin:14px 0 0;color:var(--ink-faint);font-size:14.5px}
.night .cta-note,.on-dark .cta-note{color:var(--moon-faint)}

/* ---------- launch bar ---------- */
.cdbar{position:relative;z-index:40;background:linear-gradient(90deg,#173F47,#225B66 50%,#173F47);color:var(--moon);font-size:14px}
.cdbar-in{max-width:1180px;margin:0 auto;padding:9px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 10px;text-align:center}
.cdbar strong{color:#fff}
.cdbar .dot{opacity:.5}
.cdbar .clock{font:500 13.5px/1 var(--font-mono);color:var(--orchid-light)}
.cdbar .clock b{color:#fff;font-weight:600}

/* ---------- nav ---------- */
.sales-nav{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px max(20px,calc((100vw - 1180px)/2 + 24px));background:linear-gradient(180deg,#122B30,#0B1C1F);backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);border-bottom:1px solid var(--night-line)}
.brand-link img{height:30px;width:auto}
.sales-nav nav{display:flex;align-items:center;gap:26px;font-size:14.5px;color:var(--moon-muted)}
.sales-nav nav a{text-decoration:none;transition:color .2s}
.sales-nav nav a:hover{color:#fff}
.sales-nav .nav-cta{padding:8px 16px;border-radius:999px;background:var(--orchid-dark);color:#fff;font-weight:600}
.sales-nav .nav-cta:hover{background:var(--orchid-deeper)}

/* ---------- hero: dusk ---------- */
.hero{padding:clamp(56px,8vw,96px) 0 clamp(80px,10vw,130px);background:
  radial-gradient(1200px 600px at 70% 0%,rgba(60,202,230,.35),transparent 60%),
  radial-gradient(900px 500px at 10% 30%,rgba(255,170,140,.12),transparent 60%),
  linear-gradient(180deg,#0C2226 0%,#123036 55%,#0E2529 100%);color:var(--moon);overflow:hidden}
.stars{position:absolute;inset:0;pointer-events:none;background-image:
  radial-gradient(1.4px 1.4px at 12% 18%,rgba(255,255,255,.8),transparent 60%),
  radial-gradient(1px 1px at 28% 8%,rgba(255,255,255,.6),transparent 60%),
  radial-gradient(1.2px 1.2px at 46% 22%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1px 1px at 63% 12%,rgba(255,255,255,.7),transparent 60%),
  radial-gradient(1.6px 1.6px at 82% 6%,rgba(255,255,255,.8),transparent 60%),
  radial-gradient(1px 1px at 91% 28%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1.2px 1.2px at 7% 44%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1px 1px at 37% 38%,rgba(255,255,255,.4),transparent 60%);opacity:.9}
.hero-origin{display:inline-flex;align-items:center;gap:8px;margin:0 0 26px;padding:7px 14px;border:1px solid var(--night-line);border-radius:999px;background:rgba(255,255,255,.04);color:var(--moon-muted);font-size:14px}
.hero-origin a{color:var(--moon);text-decoration:none}
.hero-origin a:hover{text-decoration:underline}
.hero-origin .divider{opacity:.4}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--orchid-light);box-shadow:0 0 0 0 rgba(var(--orchid-rgb)/.6);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(var(--orchid-rgb)/.6)}70%{box-shadow:0 0 0 10px rgba(var(--orchid-rgb)/0)}100%{box-shadow:0 0 0 0 rgba(var(--orchid-rgb)/0)}}
.hero-copy{position:relative;max-width:980px;margin:0 auto;text-align:center}
.hero h1{color:#fff}
.hero-subhead{max-width:760px;margin:28px auto 0;color:var(--moon-muted);font-size:clamp(18px,1.7vw,21px);line-height:1.65}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:30px 0 0;padding:0;list-style:none}
.chips li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--night-line);background:rgba(255,255,255,.05);color:var(--moon);font-size:14px}
.chips li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orchid-light)}
.chips .arrow{border:0;background:none;padding:8px 0;color:var(--moon-faint)}
.chips .arrow::before{display:none}

.stage{position:relative;margin:clamp(48px,6vw,72px) auto 0;max-width:1180px}
.stage-art{position:relative;border-radius:var(--radius-xl);overflow:hidden;box-shadow:0 40px 120px -40px rgba(60,202,230,.55),0 0 0 1px rgba(255,255,255,.08)}
.stage-art img{width:100%;aspect-ratio:1376/768;object-fit:cover}
.stage-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(9,22,24,.35))}
.stage-phone{position:absolute;z-index:2;left:clamp(16px,5%,64px);bottom:clamp(-60px,-4vw,-24px);width:clamp(150px,21%,250px);aspect-ratio:9/16;border-radius:26px;padding:7px;background:#091112;box-shadow:0 30px 60px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.12),0 0 60px rgba(var(--orchid-rgb)/.35)}
.stage-phone video,.stage-phone img{width:100%;height:100%;object-fit:cover;border-radius:20px;background:#123036}
.stage-phone .phone-play{position:absolute;inset:auto 14px 14px 14px;display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border:0;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);font:600 13.5px/1 var(--font-text);cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.3)}
.stage-phone .phone-play svg{width:15px;height:15px}
.stage-phone.playing .phone-play{display:none}
.stage-caption{margin:clamp(30px,5vw,48px) 0 0 auto;color:var(--moon-faint);font-size:13.5px;text-align:right;max-width:60%}
.vsl-frame{position:relative;margin:clamp(40px,5vw,56px) auto 0;max-width:960px;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 30px 90px -30px rgba(60,202,230,.5),0 0 0 1px rgba(255,255,255,.08)}
.vsl-frame{aspect-ratio:16/9;background:#060A0B}
.vsl-frame img,.vsl-frame video{display:block;width:100%;height:100%;object-fit:cover}
.vsl-frame video{background:#060A0B}
.vsl-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:88px;height:88px;border:0;border-radius:50%;padding:0;background:linear-gradient(180deg,var(--orchid-light),var(--orchid-deep));color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(var(--orchid-rgb)/.45),0 10px 30px rgba(var(--orchid-rgb)/.45)}
.vsl-play:hover{filter:brightness(1.06)}
.vsl-play svg{width:32px;height:32px;margin-left:4px}
.vsl-play-label{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);white-space:nowrap;background:rgba(10,10,12,.9);color:#fff;padding:7px 12px;border-radius:8px;font:600 14px var(--font-text);pointer-events:none}
.vsl-frame.playing .vsl-play{display:none}
@media(max-width:639px){.vsl-play{width:68px;height:68px}.vsl-play svg{width:24px;height:24px}.vsl-play-label{font-size:12px}}
.slot-note{display:none}
html.show-slots .slot-note{display:block;padding:10px 14px;border:1px dashed rgba(255,255,255,.3);border-radius:10px;color:var(--moon-faint);font:12px/1.4 var(--font-mono)}

/* ---------- reviews ---------- */
.review-band{background:linear-gradient(180deg,#0E2529 0%,var(--night) 100%);color:var(--moon);padding-top:clamp(90px,10vw,130px)}
.review-note{color:var(--moon-muted)}
.rs-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:1000px;margin:0 auto}
.rs-review{margin:0;padding:30px;border-radius:var(--radius-lg);background:rgba(255,255,255,.04);border:1px solid var(--night-line);display:flex;flex-direction:column-reverse;gap:22px}
.rs-review blockquote{margin:0;color:var(--moon);font-size:18px;line-height:1.65}
.rs-review-person{display:flex;align-items:center;gap:14px}
.rs-review-person img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.rs-review-person cite{display:block;font-style:normal;font-weight:600;color:#fff}
.rs-review-person a,.rs-review-person span{display:block;font-size:13.5px;color:var(--moon-faint);text-decoration:none}
.rs-review-person a:hover{color:var(--moon)}

/* ---------- the story: night to dawn ---------- */
.story{padding:0;background:linear-gradient(180deg,
  var(--night) 0%,#0F262A 14%,#143940 28%,#1C4C55 40%,#2F6772 52%,#4C848F 60%,#c98196 68%,#efb7a6 76%,#fbdccf 84%,#fff1ea 92%,var(--day) 100%);color:var(--moon)}
.story .stars{height:30%}
.chapter{position:relative;padding:clamp(90px,12vw,160px) 0}
.chapter-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(36px,6vw,88px);align-items:center}
.chapter-grid.flip>.chapter-art{order:-1}
.chapter h2{margin:0 0 26px}
.chapter.on-dark h2{color:#fff}
/* W7: the dark chapters sit on the dusk-to-dawn gradient, which turns pink around "You paste his page";
   moon-muted text measured 2.0-3.7:1 there, white with a soft shadow 3.5-6.4:1. */
.chapter.on-dark .prose>p{color:#fff;text-shadow:0 1px 3px rgba(14,52,60,.45)}
.chapter.on-light{color:var(--ink)}
.chapter.on-light .prose>p{color:var(--ink-muted)}
.chapter.on-light .eyebrow{color:var(--orchid-deeper)}
.chapter-art{margin:0;position:relative}
.chapter-art img{width:100%;border-radius:var(--radius-xl);box-shadow:0 40px 90px -40px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08)}
.chapter.on-light .chapter-art img{box-shadow:0 40px 90px -40px rgba(68,155,172,.45),0 0 0 1px rgba(255,255,255,.6)}
.chapter-art::before{content:"";position:absolute;inset:8% -6% -8% 6%;border-radius:40px;background:radial-gradient(closest-side,rgba(var(--orchid-rgb)/.35),transparent);filter:blur(30px);z-index:-1}
.chapter-art figcaption{margin-top:14px;font-size:13px;color:var(--moon-faint);text-align:center}
.chapter.on-light .chapter-art figcaption{color:var(--ink-faint)}
.pullquote{margin:28px 0;padding:22px 26px;border-radius:var(--radius-lg);background:rgba(255,255,255,.06);border:1px solid var(--night-line);font-size:20px;line-height:1.55;color:#fff}
.chapter.on-light .pullquote{background:rgba(255,255,255,.65);border-color:rgba(255,255,255,.9);color:var(--ink);box-shadow:0 20px 40px -24px rgba(68,155,172,.35)}
.pullquote.reply{display:inline-block;padding:14px 20px;border-radius:22px 22px 22px 6px;background:linear-gradient(180deg,#8BECFF,#5DCAE0);border:0;color:#fff;font-weight:500}
.chapter-wide{max-width:900px;margin:0 auto;text-align:center}
.chapter-wide .prose>p{max-width:720px;margin-left:auto;margin-right:auto}
.illustrative{font-size:13.5px!important;color:var(--ink-faint)!important;font-style:italic}
.on-dark .illustrative{color:var(--moon-faint)!important}
.moral-roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:44px auto 0;max-width:900px;text-align:left}
.moral-roles div{padding:22px;border-radius:var(--radius-lg);background:rgba(255,255,255,.7);border:1px solid #fff;box-shadow:0 20px 40px -28px rgba(68,155,172,.4)}
.moral-roles b{display:block;margin-bottom:6px;font:500 12px/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--orchid-deeper)}
.moral-roles p{margin:0;color:var(--ink);font-size:16px;line-height:1.55}

/* ---------- proof before pitch: thread ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,80px);align-items:start}
.thread{display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:var(--radius-xl);background:#fff;border:1px solid var(--day-line);box-shadow:0 30px 70px -40px rgba(68,155,172,.35)}
.bubble{max-width:88%;padding:16px 18px;border-radius:20px;font-size:15.5px;line-height:1.55}
.bubble .who{display:block;margin-bottom:6px;font:500 11.5px/1.3 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.bubble .subj{display:block;font-weight:600;margin-bottom:6px}
.bubble.out{align-self:flex-end;background:linear-gradient(180deg,#6EDAF0,#4FBED4);color:#fff;border-bottom-right-radius:6px}
.bubble.in{align-self:flex-start;background:var(--day-2);border:1px solid var(--day-line);color:var(--ink);border-bottom-left-radius:6px}
.bubble p{margin:0}
.thread-note{margin:6px 0 0;text-align:center;color:var(--ink-faint);font-size:13px}
.steps-2{display:grid;gap:14px;margin:30px 0 0}
.steps-2 div{padding:20px 22px;border-radius:var(--radius-lg);background:var(--tint);border:1px solid #DEF6FB}
.steps-2 b{display:block;margin-bottom:4px;color:var(--ink)}
.steps-2 p{margin:0;color:var(--ink-muted);font-size:16.5px}

/* ---------- cost ---------- */
.cost-list{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0;padding:0;list-style:none}
.cost-list li{padding:7px 13px;border-radius:999px;border:1px solid var(--day-line-strong);background:#fff;color:var(--ink-muted);font-size:14px}
.cost-list li.done{border-color:transparent;background:var(--orchid-dark);color:#fff}

/* ---------- page to ad (demo) ---------- */
.demo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr);gap:20px;align-items:start}
.demo-card{padding:26px;border-radius:var(--radius-lg);background:rgba(255,255,255,.05);border:1px solid var(--night-line)}
.demo-card h3{margin:0 0 16px;color:#fff;font-size:17px}
.demo-step{display:inline-block;margin-bottom:10px;color:var(--orchid-light);font:500 11.5px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}
.source-page{border-radius:12px;background:#fff;color:#2b2b33;padding:18px;font-size:14.5px;line-height:1.6}
.source-page .src-url{display:block;margin-bottom:10px;padding:6px 10px;border-radius:8px;background:#F0F4F5;color:#657578;font:12px/1.4 var(--font-mono);overflow-wrap:anywhere}
.source-page .src-title{margin:0 0 10px;font-weight:600;font-size:16px;color:#111}
.source-page p{margin:0 0 10px}
.source-page mark{background:linear-gradient(180deg,transparent 45%,rgba(155,238,255,.55) 45%);color:inherit;padding:0 1px}
.story-spec{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.story-spec li{font-size:15px;line-height:1.5;color:var(--moon-muted)}
.story-spec b{display:block;color:#fff;font-size:12px;font:500 11.5px/1.4 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--orchid-light);margin-bottom:2px}
.vo-script{margin:18px 0 0;padding:16px 18px;border-left:2px solid var(--orchid);color:var(--moon);font-size:15px;line-height:1.65;background:rgba(255,255,255,.03);border-radius:0 12px 12px 0}
.demo-video{position:relative;border-radius:22px;overflow:hidden;background:#000;aspect-ratio:9/16;box-shadow:0 30px 70px -30px rgba(var(--orchid-rgb)/.6)}
.demo-video video{width:100%;height:100%;object-fit:cover}
.demo-note{margin:14px 0 0;color:var(--moon-faint);font-size:13.5px}

/* ---------- gallery ---------- */
.sc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.sc-card{margin:0;cursor:pointer}
.sc-frame{position:relative;aspect-ratio:9/16;border-radius:20px;overflow:hidden;background:linear-gradient(180deg,#1D3E45,#0F262B);box-shadow:0 24px 50px -30px rgba(30,97,110,.6),0 0 0 1px rgba(0,0,0,.04);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.sc-card:hover .sc-frame{transform:translateY(-4px);box-shadow:0 34px 70px -30px rgba(68,155,172,.7)}
.sc-frame video,.sc-frame img{width:100%;height:100%;object-fit:cover}
.sc-sound{position:absolute;right:10px;bottom:10px;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(9,22,24,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;cursor:pointer}
.sc-sound svg{width:18px;height:18px}
.sc-sound[aria-pressed="true"]{background:var(--orchid-dark)}
.sc-label{margin:14px 0 2px;font-weight:600;font-size:15.5px;color:var(--ink);letter-spacing:-.01em}
.sc-meta{margin:0 0 4px;color:var(--orchid-dark);font-size:13px;font-weight:500}
.sc-cap{margin:0;color:var(--ink-muted);font-size:13.5px;line-height:1.5}
.sc-pending .sc-frame{display:grid;place-items:center;border:1.5px dashed var(--day-line-strong);background:var(--tint);box-shadow:none}
.sc-pending .sc-frame span{padding:0 14px;text-align:center;color:var(--ink-faint);font:12px/1.4 var(--font-mono)}

/* ---------- how it works ---------- */
.workflow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none;counter-reset:none}
.workflow-step{padding:28px 24px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line);box-shadow:0 20px 50px -40px rgba(68,155,172,.4)}
.step-number{display:inline-grid;place-items:center;width:40px;height:40px;margin-bottom:18px;border-radius:12px;background:linear-gradient(180deg,var(--orchid-light),var(--orchid-deep));color:#fff;font:600 14px/1 var(--font-mono)}
.workflow-step h3{margin:0 0 10px;font-size:19px}
.workflow-step p{margin:0;color:var(--ink-muted);font-size:15.5px;line-height:1.6}

/* ---------- angles ---------- */
.angle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.angle-grid li{padding:24px;border-radius:var(--radius-lg);background:var(--day);border:1px solid var(--day-line)}
.angle-grid b{display:block;margin-bottom:8px;font-size:17px;letter-spacing:-.01em}
.angle-grid p{margin:0;color:var(--ink-muted);font-size:15.5px;line-height:1.6}
.facts-panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,64px);align-items:center;margin-top:clamp(70px,9vw,110px)}
.facts-panel img{border-radius:var(--radius-xl);box-shadow:0 40px 80px -44px rgba(68,155,172,.55)}

/* ---------- owner email ---------- */
.email-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.email-flow li{position:relative;padding:20px;border-radius:var(--radius-lg);background:rgba(255,255,255,.05);border:1px solid var(--night-line);color:var(--moon);font-weight:500;font-size:15.5px}
.email-flow li span{display:block;margin-top:4px;color:var(--moon-faint);font-weight:400;font-size:13.5px}
.email-flow li:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);color:var(--orchid-light);font-size:14px}

/* ---------- commercial use ---------- */
.use-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.use-cases div{padding:26px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line)}
.use-cases h3{margin:0 0 10px;font-size:18px}
.use-cases p{margin:0;color:var(--ink-muted);font-size:15.5px;line-height:1.65}
.package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
.package{position:relative;padding:30px 26px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line)}
.package.featured{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(180deg,var(--orchid-light),var(--orchid-deep)) border-box;border:1.5px solid transparent;box-shadow:0 30px 60px -36px rgba(68,155,172,.55)}
.package .price{display:block;font-size:34px;font-weight:600;letter-spacing:-.04em}
.package .price small{font-size:15px;font-weight:500;color:var(--ink-faint);letter-spacing:0}
.package h4{margin:6px 0 10px;font-size:17px}
.package p{margin:0;color:var(--ink-muted);font-size:15px;line-height:1.6}
.suggest-label{display:block;text-align:center;margin:56px 0 0;color:var(--ink-faint);font:500 12px/1.4 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}
.package-notes{max-width:760px;margin:28px auto 0;text-align:center;color:var(--ink-muted);font-size:15.5px}
.package-notes p{margin:0 0 8px}

/* ---------- language ---------- */
.lang-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px}
.lang-row span{padding:8px 16px;border-radius:999px;background:#fff;border:1px solid var(--day-line);font-size:14.5px;color:var(--ink-muted)}
.lang-row span b{color:var(--ink);font-weight:600}

/* ---------- makers ---------- */
.maker-profile{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,5vw,70px);align-items:start}
.maker-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;margin-bottom:22px;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--day-line)}
.maker-signature{margin:22px 0 0;font-weight:600;font-size:18px}
.maker-signature span{display:block;font-weight:400;font-size:14px;color:var(--ink-faint)}
.maker-story p{color:var(--ink-muted);font-size:18px;line-height:1.75}
.maker-stat a{text-decoration:none;color:var(--ink)}
.maker-stat strong{color:var(--orchid-dark)}
.review-heading{margin:64px 0 22px;text-align:center}
.review-heading h3{margin:0 0 6px}
.review-heading p{margin:0;color:var(--ink-faint);font-size:14.5px}
.quote-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.customer-quote{margin:0;padding:22px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line);display:flex;flex-direction:column-reverse;gap:16px}
.customer-quote blockquote{margin:0;font-size:15px;line-height:1.55;color:var(--ink)}
.review-person{display:flex;align-items:center;gap:10px}
.review-person img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.review-person cite{display:block;font-style:normal;font-weight:600;font-size:14px}
.review-person span{display:block;font-size:12.5px;color:var(--ink-faint)}

/* ---------- bonuses ---------- */
.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.guide{position:relative;padding:30px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line);overflow:hidden}
.guide::before{content:"";position:absolute;top:-60px;right:-60px;width:160px;height:160px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--orchid-rgb)/.18),transparent)}
.guide .eyebrow{margin-bottom:10px}
.guide h3{margin:0 0 12px;font-size:20px}
.guide p{margin:0 0 10px;color:var(--ink-muted);font-size:15.5px;line-height:1.65}
.guide .incl{margin:14px 0 0;color:var(--orchid-dark);font-weight:600;font-size:14px}
.guide-summary{max-width:720px;margin:34px auto 0;text-align:center;color:var(--ink-muted)}

/* ---------- credits ---------- */
.credit-table{width:100%;margin:30px 0;border-collapse:collapse;border-radius:var(--radius-lg);overflow:hidden;background:#fff;border:1px solid var(--day-line);font-size:16px}
.credit-table th,.credit-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--day-line)}
.credit-table thead th{background:var(--tint);font:500 12px/1.4 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted)}
.credit-table tbody tr:last-child th,.credit-table tbody tr:last-child td{border-bottom:0}

/* ---------- guarantee ---------- */
.guarantee-panel{max-width:860px;margin:0 auto;text-align:center}
.guarantee-mark{position:relative;display:inline-grid;place-items:center;width:110px;height:110px;margin-bottom:26px;color:var(--orchid-dark)}
.guarantee-mark svg{position:absolute;inset:0;width:100%;height:100%}
.guarantee-mark span{position:relative;font-size:34px;font-weight:600;letter-spacing:-.04em;color:var(--ink)}
.guarantee-panel h2{margin-bottom:22px}
.guarantee-panel p{color:var(--ink-muted);font-size:18.5px;line-height:1.7}
.guarantee-panel a{color:var(--orchid-dark)}

/* ---------- price box: sunrise ---------- */
.price-band{background:radial-gradient(900px 500px at 50% 0%,rgba(255,198,168,.45),transparent 70%),radial-gradient(900px 600px at 50% 100%,rgba(var(--orchid-rgb)/.2),transparent 70%),var(--day)}
.price-art{max-width:1180px;margin:0 auto clamp(-90px,-8vw,-50px);padding:0 24px}
.price-art img{width:100%;border-radius:var(--radius-xl);aspect-ratio:1376/768;object-fit:cover;box-shadow:0 40px 90px -50px rgba(68,155,172,.6)}
.pricecard{position:relative;z-index:2;max-width:620px;margin:0 auto;padding:44px clamp(22px,5vw,48px);border-radius:var(--radius-xl);background:rgba(255,255,255,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #fff;box-shadow:0 50px 100px -50px rgba(40,107,120,.55),0 0 0 1px var(--day-line)}
.pricecard-ribbon{position:absolute;top:-14px;left:50%;transform:translateX(-50%);padding:7px 16px;border-radius:999px;background:linear-gradient(90deg,var(--orchid-light),var(--orchid-deep));color:#fff;font:600 12px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.pricecard h2{font-size:clamp(28px,3.4vw,40px);margin:0 0 24px;text-align:center}
.pricecard .eyebrow{text-align:center}
.included-list{margin:0 0 28px;padding:0;list-style:none;display:grid;gap:11px}
.included-list li{position:relative;padding-left:30px;color:var(--ink);font-size:16px;line-height:1.5}
.included-list li::before{content:"";position:absolute;left:0;top:3px;width:19px;height:19px;border-radius:50%;background:var(--tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A256C2' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.order-price{display:flex;align-items:baseline;justify-content:center;gap:12px;margin:8px 0}
.order-price strong{font-size:68px;line-height:1;font-weight:600;letter-spacing:-.05em}
.order-price s{color:var(--ink-faint);font-size:24px}
.order-price span{color:var(--ink-faint)}
.order-deadline{text-align:center;color:var(--ink-muted);font-size:15px}
.offer-countdown{margin:22px 0 26px;text-align:center}
.countdown-title{margin:0 0 10px;color:var(--ink-faint);font:500 12px/1.4 var(--font-mono);letter-spacing:.1em;text-transform:uppercase}
.countdown-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.countdown-grid div{padding:12px 4px;border-radius:14px;background:var(--tint);border:1px solid #DEF6FB}
.countdown-grid strong{display:block;font-size:28px;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.countdown-grid span{font-size:12px;color:var(--ink-faint)}
.payment-trust{display:flex;justify-content:center;gap:8px;margin:16px 0 0;color:var(--ink-faint);font-size:13.5px}
.checkout-error{display:none;margin:14px 0 0;text-align:center;color:#c0392b;font-size:14.5px}
.optional-note{max-width:620px;margin:22px auto 0;text-align:center;color:var(--ink-faint);font-size:14px}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;margin-top:30px}
.faq details{border-radius:var(--radius-lg);background:#fff;border:1px solid var(--day-line);transition:box-shadow .3s}
.faq details[open]{box-shadow:0 20px 40px -32px rgba(68,155,172,.45)}
.faq summary{position:relative;padding:20px 54px 20px 22px;font-weight:600;font-size:16.5px;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:22px;top:50%;transform:translateY(-50%);color:var(--orchid-dark);font-size:22px;font-weight:400;transition:transform .3s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{margin:0;padding:0 22px 22px;color:var(--ink-muted);font-size:16px;line-height:1.7}

/* ---------- footer: end credits ---------- */
footer{padding:80px 0 120px;background:radial-gradient(800px 400px at 50% 0%,rgba(60,202,230,.22),transparent 70%),var(--night);color:var(--moon-muted);text-align:center}
.the-end{margin:0 0 30px;color:var(--moon-faint);font:500 12px/1.4 var(--font-mono);letter-spacing:.3em;text-transform:uppercase}
.foot-top{display:flex;flex-direction:column;align-items:center;gap:22px}
.foot-top img{height:34px;width:auto}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;font-size:14px}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:#fff}
.disclaimer{max-width:780px;margin:30px auto 0;color:var(--moon-faint);font-size:12.5px;line-height:1.7}

/* ---------- sticky bar ---------- */
.stickybar{position:fixed;z-index:50;left:50%;bottom:16px;transform:translate(-50%,140%);display:flex;align-items:center;gap:16px;padding:10px 10px 10px 20px;border-radius:999px;background:rgba(9,22,24,.86);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 50px -20px rgba(0,0,0,.6);color:var(--moon);transition:transform .5s var(--ease);max-width:calc(100vw - 24px)}
.stickybar.show{transform:translate(-50%,0)}
.stickybar .btn{min-height:44px;padding:0 20px;font-size:15px;white-space:nowrap}
.sticky-price{display:flex;align-items:baseline;gap:8px;font-size:13.5px;color:var(--moon-muted);white-space:nowrap}
.sticky-price strong{font-size:20px;color:#fff}
.sticky-price s{color:var(--moon-faint)}
.sticky-price b{color:#fff;font-variant-numeric:tabular-nums}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease) var(--d,0ms),transform 1.1s var(--ease) var(--d,0ms)}
.rv.in{opacity:1;transform:none}
.float{animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.float,.pulse-dot{animation:none}.btn,.sc-frame{transition:none}html{scroll-behavior:auto}}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .sc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .workflow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .demo-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .demo-grid .demo-out{grid-column:1/-1;max-width:340px;margin:0 auto;width:100%}
  .quote-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .angle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  body{font-size:16px}
  .sales-nav nav a:not(.nav-cta){display:none}
  .chapter-grid,.chapter-grid.flip,.split,.facts-panel,.maker-profile{grid-template-columns:minmax(0,1fr)}
  .chapter-grid.flip>.chapter-art{order:0}
  .chapter-art{order:-1}
  .chapter-grid .chapter-art{order:-1}
  .rs-review-grid,.guide-grid,.use-cases,.package-grid,.moral-roles{grid-template-columns:minmax(0,1fr)}
  .email-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .email-flow li:nth-child(2)::after{display:none}
  .stage-phone{left:12px;bottom:-40px;width:34%;border-radius:20px;padding:5px}
  .stage-phone video,.stage-phone img{border-radius:16px}
  .stage-phone .phone-play{inset:auto 8px 8px 8px;min-height:34px;font-size:12px}
  .stage-caption{max-width:58%;margin-top:22px;font-size:12.5px}
  .prose>p{font-size:17.5px}
}
@media (max-width:600px){
  .wrap{padding:0 16px}
  .sc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .workflow,.angle-grid,.demo-grid,.quote-grid{grid-template-columns:minmax(0,1fr)}
  .stage-art{border-radius:18px}
  .stage-art img{aspect-ratio:4/3.4;object-position:72% 50%}
  .chapter-art img,.price-art img{border-radius:20px}
  .price-art{margin-bottom:-28px}
  .price-art img{aspect-ratio:4/3;object-position:30% 50%}
  .cdbar-in{font-size:12.5px;padding:7px 12px}
  .cdbar .bar-long{display:none}
  .sales-nav{padding:10px 16px}
  .brand-link img{height:26px}
  .order-price strong{font-size:56px}
  .countdown-grid strong{font-size:22px}
  .stickybar{left:12px;right:12px;bottom:12px;transform:translateY(140%);justify-content:space-between;padding-left:16px;max-width:none}
  .stickybar.show{transform:none}
  .email-flow{grid-template-columns:minmax(0,1fr)}
  .email-flow li::after{display:none}
  .sc-label{font-size:14.5px}
  .sc-cap{font-size:13px}
  .pullquote{font-size:18px}
}

/* Focus-group fixes (7 Oct 2026): refund line, time line, overview label, sample vs HD note, Explee note. */
.refund-line{color:var(--ink-muted)}
.night .refund-line,.on-dark .refund-line,.hero .refund-line{color:var(--moon-muted)}
.cta-note.refund-line{margin-top:4px;font-weight:500}
.refund-box{text-align:center;margin:6px 0 0;font-size:14px}
.time-line{margin:34px auto 0;max-width:720px;color:var(--ink-muted);font-size:17px}
.vsl-label{margin:clamp(40px,5vw,56px) auto 14px;max-width:960px;text-align:center;color:#fff;font-weight:600;font-size:clamp(17px,2vw,21px);letter-spacing:-.01em}
.vsl-label+.vsl-frame{margin-top:0}
.hd-note{margin:18px 0 0}
.guide .incl-note{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--tint);color:var(--ink);font-size:14.5px;line-height:1.55}
.stickybar .sticky-refund{color:var(--moon-faint);font-size:12.5px;white-space:nowrap}
@media(max-width:639px){.stickybar .sticky-refund{display:none}.vsl-label{margin-bottom:12px}}
