.offer-shell::before{content:"";position:absolute;inset:0;border-radius:36px;z-index:-1;background:conic-gradient(from var(--ang),#fff,var(--sky2),var(--azure),#fff,var(--sky),var(--cobalt),#fff);animation:spin-ang 9s linear infinite}
.offer-shell::after{content:"";position:absolute;inset:6%;z-index:-2;border-radius:50%;background:radial-gradient(circle,rgba(170,215,255,.85),rgba(255,255,255,.4) 50%,transparent 72%);filter:blur(40px);animation:breathe 6s ease-in-out infinite}
.offer{position:relative;height:100%;border-radius:34px;padding:38px 36px 34px;background:linear-gradient(170deg,#fff 0%,#F6FAFF 100%);overflow:hidden}
.offer .k{display:inline-flex;gap:8px;align-items:center;font:600 14px/1 var(--f-ui);letter-spacing:.14em;color:var(--cobalt)}
.offer h3{margin:12px 0 4px;font:700 clamp(32px,3.8vw,44px)/1.1 var(--f-sacred)}
.price-row{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin:18px 0 6px}
.price{font:900 clamp(80px,9.5vw,124px)/.85 var(--f-sacred);color:var(--ink);font-variant-numeric:tabular-nums}
.price small{font-size:.42em;color:var(--cobalt);margin-inline-start:6px}
.price-note{font:600 16px/1.3 var(--f-ui);color:var(--muted);padding-bottom:12px}
.incl{list-style:none;padding:0;margin:24px 0 28px;display:grid;gap:12px}
.incl li{position:relative;padding-inline-start:38px;font:600 18px/1.45 var(--f-body);color:var(--ink)}
.incl li::before{content:"";position:absolute;inset-inline-start:0;top:2px;width:24px;height:24px;border-radius:50%;background:linear-gradient(180deg,#6AA2FF,var(--cobalt-d));box-shadow:0 0 12px rgba(111,180,255,.7),inset 0 1px 0 rgba(255,255,255,.6)}
.incl li::after{content:"";position:absolute;inset-inline-start:9px;top:7px;width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.incl .gift{display:inline-block;margin-inline-start:8px;padding:3px 10px;border-radius:999px;background:linear-gradient(180deg,#fff,#E2F0FF);border:1px solid rgba(42,98,242,.2);color:var(--cobalt);font:700 12px/1.4 var(--f-ui);vertical-align:2px}
.offer .btn{width:100%;font-size:21px;padding:21px 26px}
.secure{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin-top:16px;font:500 14px/1.4 var(--f-ui);color:var(--muted)}
.secure span{display:inline-flex;align-items:center;gap:6px}
.secure svg{width:15px;height:15px;color:var(--cobalt)}
.after{position:relative;padding:32px 30px;border-radius:32px;overflow:hidden}
.after h3{margin:0 0 22px;font:700 26px/1.2 var(--f-sacred)}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:22px;position:relative}
.steps::before{content:"";position:absolute;inset-inline-start:19px;top:20px;bottom:20px;width:1.5px;background:linear-gradient(180deg,var(--cobalt),var(--azure))}
.steps li{position:relative;display:flex;gap:16px;align-items:flex-start}
.steps .n{position:relative;flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1.5px solid var(--cobalt);color:var(--cobalt);font:700 17px/1 var(--f-sacred);box-shadow:0 0 16px rgba(111,180,255,.6)}
.steps b{display:block;font:700 18px/1.3 var(--f-ui);margin-bottom:2px}
.steps p{margin:0;color:var(--ink-2);font-size:16.5px;line-height:1.5}
.community{margin-top:26px;padding:18px 18px 18px 20px;border-radius:22px;background:linear-gradient(150deg,rgba(214,234,255,.7),rgba(255,255,255,.7));border:1px solid #fff;display:flex;gap:14px;align-items:center}
.community .ic{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:0 0 20px rgba(170,215,255,.9)}
.community .ic svg{width:22px;height:22px}
.community b{display:block;font:700 17px/1.25 var(--f-ui)}
.community span{font-size:15px;color:var(--ink-2);line-height:1.4;display:block}

/* faq */
.faq{max-width:880px;margin:40px auto 0;display:grid;gap:10px}
.faq details{border-radius:20px;background:rgba(255,255,255,.75);border:1px solid #fff;box-shadow:0 14px 34px -26px rgba(29,58,99,.4);transition:box-shadow .4s,background .4s}
.faq details[open]{background:#fff;box-shadow:var(--shadow),0 0 50px rgba(190,224,255,.7)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;font:700 19px/1.35 var(--f-ui);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(42,98,242,.08);color:var(--cobalt);font:400 24px/1 var(--f-ui);transition:transform .4s,background .4s,color .4s}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--cobalt);color:#fff}
.faq details p{margin:0;padding:0 24px 22px;color:var(--ink-2);font-size:18px;animation:fadeup .5s cubic-bezier(.2,.8,.2,1)}

/* final */
.gates{position:relative;text-align:center;overflow:hidden;isolation:isolate}
.gates .burst{position:absolute;left:50%;top:44%;width:1500px;height:1500px;margin:-750px 0 0 -750px;z-index:-1;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,0) 0deg 6deg,rgba(255,255,255,.95) 7.5deg 9deg,rgba(255,255,255,0) 10.5deg 18deg);-webkit-mask-image:radial-gradient(circle,#000 0%,transparent 55%);mask-image:radial-gradient(circle,#000 0%,transparent 55%);animation:spin 100s linear infinite}
.gates .core{position:absolute;left:50%;top:44%;width:900px;height:900px;margin:-450px 0 0 -450px;z-index:-1;border-radius:50%;background:radial-gradient(circle,#fff 0%,rgba(255,255,255,.95) 22%,rgba(214,234,255,.55) 42%,transparent 66%);animation:breathe 6s ease-in-out infinite}
.gates h2{font-size:clamp(46px,7.4vw,104px);font-weight:900;line-height:1.02;margin-bottom:26px}
.gates h2>span{display:block}
.gates p{color:var(--ink-2);font-size:19px;max-width:560px;margin:0 auto 34px}

/* footer */
.foot{background:linear-gradient(180deg,rgba(255,255,255,.4),#E6F2FF);color:var(--muted);font-size:14px;border-top:1px solid #fff}
.foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 28px;padding-block:30px calc(30px + env(safe-area-inset-bottom,0px))}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot a{color:var(--ink)}
.foot .biz{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;border-top:1px solid rgba(42,98,242,.12);padding-top:16px}

.mbar{position:fixed;inset-inline:0;bottom:0;z-index:85;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px var(--gr) calc(10px + env(safe-area-inset-bottom,0px)) var(--gl);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid #fff;box-shadow:0 -12px 30px -18px rgba(29,58,99,.35);transform:translateY(110%);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.mbar.show{transform:none}
.mbar .t{font:700 16px/1.2 var(--f-ui);color:var(--ink)}
.mbar .t span{display:block;font-weight:500;font-size:13px;color:var(--cobalt)}
.mbar .btn{padding:13px 22px;font-size:16px}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:99;transform:translate(-50%,20px);opacity:0;padding:12px 18px;border-radius:14px;background:var(--cobalt);color:#fff;font:600 15px/1.3 var(--f-ui);box-shadow:0 20px 40px -16px rgba(42,98,242,.6);transition:opacity .3s,transform .3s;max-width:calc(100vw - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

[data-tilt]{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) var(--base,);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.flip[data-tilt]{transform:none}

/* ================= v5: typography, lux cards, highlight icons ================= */
h2{font-weight:500;letter-spacing:-.012em}
h2 .sk,h2 em{font-weight:700}
.eyebrow{padding:7px 15px 7px 13px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid #fff;box-shadow:0 10px 24px -16px rgba(29,58,99,.35),0 0 24px rgba(214,234,255,.8)}
.eyebrow::before{width:7px;height:7px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 10px 3px rgba(111,180,255,.85);animation:breathe 2.6s ease-in-out infinite}

.lux{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.66));box-shadow:inset 0 1px 0 #fff,0 30px 60px -36px rgba(29,58,99,.36),0 0 50px rgba(214,234,255,.55)}
.lux::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.2px;background:linear-gradient(160deg,#fff 0%,rgba(150,200,255,.75) 35%,rgba(255,255,255,.35) 65%,#fff 100%);-webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:1}
@media (hover:hover) and (min-width:900px){ .lux{-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)} }

.hl{position:relative;flex:none;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#fff 0 38%,#EEF6FF 66%,#D3E7FF 100%);box-shadow:0 0 0 4px rgba(255,255,255,.85),0 16px 30px -14px rgba(42,98,242,.5),0 0 40px rgba(170,215,255,.85);overflow:hidden;isolation:isolate}
.hl::before{content:"";position:absolute;inset:-30%;background:repeating-conic-gradient(rgba(255,255,255,0) 0deg 9deg,rgba(255,255,255,.95) 11deg 13deg,rgba(255,255,255,0) 15deg 24deg);-webkit-mask:radial-gradient(circle,transparent 26%,#000 30%,transparent 62%);mask:radial-gradient(circle,transparent 26%,#000 30%,transparent 62%);animation:spin 40s linear infinite;z-index:-1}
.hl svg{width:52%;height:52%;filter:drop-shadow(0 5px 6px rgba(26,71,207,.35));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.hl.sm{width:60px;height:60px}
.hl.sm svg{width:56%;height:56%}
.hl.lg{width:92px;height:92px}
*:hover>.hl svg,.live .hl svg{transform:scale(1.12) rotate(-4deg)}

/* hero: thoughts */
.qcard.th{max-width:184px;padding:10px 14px;font:500 15px/1.35 var(--f-sacred);color:var(--ink-2);background:rgba(255,255,255,.72)}
.qcard.th .n{width:9px;height:9px;margin-top:6px;border:0;background:var(--azure);box-shadow:0 0 10px 3px rgba(111,180,255,.75)}
.qcard.th.on{color:var(--ink);background:#fff}
.qcard.th.on .n{background:var(--cobalt)}
.t5{top:38%;inset-inline-start:-8%}
.t6{top:41%;inset-inline-end:-8%}
.t7{top:3%;left:50%;transform:translateX(-50%)}
.t7.on{transform:translateX(-50%) translateY(-3px) scale(1.03)}
.t8{top:85%;left:50%;transform:translateX(-50%)}
.t8.on{transform:translateX(-50%) translateY(-3px) scale(1.03)}
.qa{top:2%}.qb{top:0%}.qc{top:62%}.qd{top:66%}
.hud{bottom:-3%}

/* phone scene: photo and phone side by side */
.scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);align-items:end;gap:20px;max-width:580px;width:100%;padding-bottom:80px}
.scene>*{min-width:0}
.scene .arch-photo{width:100%;align-self:center}
.dwrap{position:relative;width:100%;aspect-ratio:270/558;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.scene .device{position:absolute;inset-inline:auto;width:270px;max-width:none;height:558px;aspect-ratio:auto;top:0;bottom:auto;left:0;right:auto;transform:scale(var(--ds,1));transform-origin:top left}
.verdict{left:50%;inset-inline-start:auto;bottom:4px;transform:translateX(-50%)}
.verdict.off{transform:translateX(-50%) translateY(14px) scale(.96)}

/* the four feelings */
.pain-list{gap:14px}
.pcard{display:flex;gap:18px;align-items:center;padding:16px 22px 16px 18px;border-radius:24px;overflow:hidden;transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}
.pcard::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%);transform:translateX(120%);pointer-events:none;z-index:2}
.pcard.live::after{animation:sheen 1.4s cubic-bezier(.2,.8,.2,1)}
.pcard.live,.pcard:hover{transform:translateX(-8px);box-shadow:inset 0 1px 0 #fff,0 34px 70px -36px rgba(42,98,242,.45),0 0 70px rgba(190,224,255,.95)}
.pcard p{position:relative;z-index:3;margin:0;font:500 21px/1.4 var(--f-sacred);color:var(--ink)}
.pcard .hl{z-index:3}
.pain-list li.pcard::before{display:none}

/* video caption, centred */
.player .cap{left:0;right:0;inset-inline:0;bottom:30px;align-items:center;text-align:center;gap:10px;padding-inline:24px}
.player .cap span{display:inline-flex;align-items:center;gap:12px;font:500 12.5px/1 var(--f-ui);letter-spacing:.32em;color:#EAF4FF}
.player .cap span::before,.player .cap span::after{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.85))}
.player .cap span::after{background:linear-gradient(90deg,rgba(255,255,255,.85),transparent)}
.player .cap b{font:500 clamp(28px,3.8vw,48px)/1.1 var(--f-sacred);letter-spacing:-.01em}
.player .cap small{font:400 clamp(15px,1.6vw,19px)/1.4 var(--f-body);color:rgba(255,255,255,.88);max-width:34ch}
.player::after{background:radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.25),transparent 55%),linear-gradient(180deg,rgba(20,40,80,0) 30%,rgba(16,34,72,.78))}
.play{top:-18%}

/* four questions as a 3D deck */
.deck-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:48px;align-items:center;margin-top:44px}
.deck-grid>*{min-width:0}
.deck{position:relative;height:440px;perspective:1600px;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.dcard{position:absolute;inset:0;border-radius:34px;padding:44px 44px 40px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity .9s,filter .9s;cursor:grab}
.dcard[data-pos="0"]{z-index:4;transform:none;opacity:1}
.dcard[data-pos="1"]{z-index:3;transform:translate3d(-30px,-20px,-90px) rotate(-3deg);opacity:.9;filter:saturate(.8)}
.dcard[data-pos="2"]{z-index:2;transform:translate3d(-60px,-40px,-180px) rotate(-6deg);opacity:.7;filter:saturate(.6) blur(.4px)}
.dcard[data-pos="3"]{z-index:1;transform:translate3d(-90px,-60px,-270px) rotate(-9deg);opacity:.45;filter:saturate(.5) blur(.8px)}
.dcard[data-pos="out"]{z-index:5;transform:translate3d(115%,30px,60px) rotate(14deg);opacity:0;transition-duration:.55s}
.dcard .big{position:absolute;inset-inline-end:18px;top:-30px;font:900 230px/1 var(--f-sacred);color:transparent;-webkit-text-stroke:1.5px rgba(111,180,255,.45);pointer-events:none;z-index:0}
.dcard .lbl{position:relative;z-index:2;display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--f-ui);letter-spacing:.18em;color:var(--cobalt);margin-bottom:18px}
.dcard .lbl i{width:7px;height:7px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 10px 3px rgba(111,180,255,.85)}
.dcard h3{position:relative;z-index:2;margin:0 0 18px;font:600 clamp(28px,3vw,40px)/1.18 var(--f-sacred);color:var(--ink);text-wrap:balance}
.dcard .rule2{position:relative;z-index:2;display:flex;align-items:center;gap:10px;margin:0 0 18px}
.dcard .rule2::before{content:"";width:48px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,var(--cobalt),var(--azure))}
.dcard .rule2::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--azure)}
.dcard p{position:relative;z-index:2;margin:0;font:400 19.5px/1.75 var(--f-body);color:var(--ink-2);max-width:54ch}
.dcard .foot2{position:absolute;z-index:2;inset-inline:44px;bottom:22px;display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 13px/1 var(--f-ui);color:var(--muted);letter-spacing:.1em}
.dcard .foot2 .bar{flex:1;height:2px;border-radius:2px;background:rgba(42,98,242,.12);overflow:hidden}
.dcard .foot2 .bar b{display:block;height:100%;background:linear-gradient(90deg,var(--azure),var(--cobalt));transform-origin:right;transform:scaleX(0)}
.deck.run .dcard[data-pos="0"] .foot2 .bar b{animation:timer 7s linear forwards}
.deck-side{display:grid;gap:12px}
.deck-side .q{padding:15px 18px;border-radius:20px;font:500 19px/1.35 var(--f-sacred)}
.deck-side .q .arr{margin-inline-start:auto;color:var(--azure);font:400 20px/1 var(--f-ui);transition:transform .5s,color .5s}
.deck-side .q[aria-selected="true"] .arr{transform:translateX(-6px);color:var(--cobalt)}
.deck-nav{display:flex;align-items:center;gap:10px;margin-top:8px}
.deck-nav button{width:46px;height:46px;border-radius:50%;border:1px solid #fff;background:rgba(255,255,255,.8);color:var(--cobalt);font:400 20px/1 var(--f-ui);cursor:pointer;box-shadow:0 10px 24px -14px rgba(29,58,99,.4);transition:transform .4s,box-shadow .4s}
.deck-nav button:hover{transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(42,98,242,.5),0 0 30px rgba(190,224,255,.9)}
.deck-nav span{font:600 13px/1 var(--f-ui);color:var(--muted);letter-spacing:.1em}

/* decoder: her message, his truth */
.flip{animation:bob 7s ease-in-out infinite}
.flip:nth-child(2){animation-delay:-1.2s}.flip:nth-child(3){animation-delay:-2.4s}.flip:nth-child(4){animation-delay:-3.6s}.flip:nth-child(5){animation-delay:-4.8s}.flip:nth-child(6){animation-delay:-6s}
.flip.peek .flip-in{animation:peek 1.1s cubic-bezier(.2,.8,.2,1)}
.front{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.7))}
.front .top2,.back .top2{display:flex;align-items:center;gap:10px}
.front .bub{position:relative;align-self:flex-start;max-width:92%;padding:13px 16px;border-radius:20px 20px 6px 20px;background:linear-gradient(180deg,#6AA2FF,var(--cobalt));color:#fff;font:500 18px/1.45 var(--f-body);box-shadow:0 14px 30px -14px rgba(42,98,242,.65),inset 0 1px 0 rgba(255,255,255,.5)}
.front .bub small{display:block;margin-top:6px;font:500 11px/1 var(--f-ui);opacity:.8;text-align:end}
.front .hint{align-self:flex-start;padding:9px 14px 9px 12px;border-radius:999px;background:rgba(42,98,242,.07);border:1px solid rgba(42,98,242,.15);animation:none}
.front .hint svg{animation:none}
.flip:hover .front .hint{background:rgba(42,98,242,.12)}
.back p{font:500 21px/1.55 var(--f-sacred);min-height:3em}
.back p .caret{display:inline-block;width:2px;height:1em;margin-inline-start:2px;background:#fff;vertical-align:-2px;animation:blink 1s steps(1) infinite}
.back .hl{width:44px;height:44px;box-shadow:0 0 0 3px rgba(255,255,255,.35),0 0 30px rgba(255,255,255,.4)}
.front .hl{width:44px;height:44px}

/* pillars & who */
.pillar .hl{margin-bottom:24px}
.pillar::before{z-index:1}
.pillar .blob{position:absolute;width:60%;aspect-ratio:1;inset-inline-start:-20%;bottom:-40%;border-radius:50%;background:radial-gradient(circle,rgba(170,215,255,.55),transparent 70%);animation:wander 14s ease-in-out infinite alternate;pointer-events:none}
.pillar h3{font-weight:600}
.who .hl{width:58px;height:58px}

@keyframes sheen{to{transform:translateX(-120%)}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes peek{0%,100%{transform:rotateY(0)}35%{transform:rotateY(-22deg)}65%{transform:rotateY(8deg)}}
@keyframes wander{from{transform:translate(0,0)}to{transform:translate(40%,-30%)}}

/* ================= v6: editorial type system + big phone ================= */
:root{--f-lux:"Bellefair","Frank Ruhl Libre","Times New Roman",serif}

/* headings: hair-thin serif, the key words in bold Frank Ruhl with the sky sweep */
h2{font-family:var(--f-lux);font-weight:400;font-size:clamp(44px,6.2vw,82px);line-height:1.02;letter-spacing:-.015em}
h2 .sk,h2 em{font-family:var(--f-sacred);font-weight:700;letter-spacing:-.02em}
.title .l1>span{font-family:var(--f-lux);font-weight:400;letter-spacing:-.02em}
.title .l2>span{font-family:var(--f-sacred);font-weight:900}
.title{font-size:clamp(84px,11.4vw,176px);line-height:.9}
.kicker{font:300 clamp(25px,3vw,38px)/1.2 var(--f-ui)}
.rot{position:relative;display:inline-grid;vertical-align:bottom}
.rot>span{grid-area:1/1;font-weight:500;color:var(--cobalt);opacity:0;filter:blur(10px);transform:translateY(.45em) rotateX(-40deg);transition:opacity .8s,filter .8s,transform .9s cubic-bezier(.2,.8,.2,1);white-space:nowrap}
.rot>span.on{opacity:1;filter:none;transform:none}
.mark{background:linear-gradient(transparent 58%,rgba(140,195,255,.42) 58%,rgba(140,195,255,.42) 92%,transparent 92%) no-repeat right bottom/0% 100%;transition:background-size 1.3s cubic-bezier(.2,.8,.2,1) .35s;padding-inline:2px;color:var(--ink)}
.mark.in{background-size:100% 100%}

.eyebrow{font:600 13px/1.2 var(--f-ui);letter-spacing:.24em}
.sub{font-size:20px;line-height:1.7}

.why-copy .big-quote{font-family:var(--f-lux);font-weight:400;font-size:clamp(60px,8vw,110px);line-height:.95}
.why-copy .big-quote .sk{font-family:var(--f-sacred);font-weight:900}
.pain-end{font:400 clamp(40px,5vw,64px)/1.05 var(--f-lux)}
.pain-end .sk{font-family:var(--f-sacred);font-weight:700}
.pcard p{font:400 23px/1.38 var(--f-lux);letter-spacing:.005em}
.verse .lines p{font:400 clamp(30px,4.2vw,56px)/1.15 var(--f-lux)}
.verse .lines p em{font-family:var(--f-sacred);font-weight:700}
.player .cap b{font:400 clamp(34px,4.6vw,60px)/1 var(--f-lux);letter-spacing:-.01em}
.rule{font:400 clamp(34px,4.8vw,62px)/1.1 var(--f-lux)}
.rule em{font-family:var(--f-sacred);font-weight:700}
.dcard h3{font:400 clamp(32px,3.4vw,46px)/1.12 var(--f-lux)}
.dcard .big{font:400 260px/1 var(--f-lux);-webkit-text-stroke:0;color:rgba(111,180,255,.16);top:-50px}
.deck-side .q{font:400 21px/1.3 var(--f-lux)}
.front .bub{font:500 18px/1.45 var(--f-body)}
.back p{font:400 24px/1.45 var(--f-lux)}
.front p.bub{font-family:var(--f-body)}
.pillar h3{font:400 40px/1.08 var(--f-lux)}
.statement{font:400 clamp(42px,6vw,84px)/1.04 var(--f-lux);letter-spacing:-.015em}
.statement .sk{font-family:var(--f-sacred);font-weight:900}
.step h3{font:400 25px/1.2 var(--f-lux)}
.yes{font:400 clamp(80px,12vw,170px)/.9 var(--f-lux)}
.yes .sk{font-family:var(--f-sacred);font-weight:900}
.who h3{font:400 34px/1.15 var(--f-lux)}
.offer h3{font:400 clamp(36px,4.2vw,52px)/1.05 var(--f-lux)}
.price{font:400 clamp(110px,12vw,170px)/.8 var(--f-lux);letter-spacing:-.03em}
.price small{font-family:var(--f-sacred);font-weight:700}
.after h3{font:400 30px/1.15 var(--f-lux)}
.gates h2{font-family:var(--f-lux);font-weight:400;font-size:clamp(52px,8.4vw,124px);line-height:.98}
.gates h2 .sk{font-family:var(--f-sacred);font-weight:900}
.faq summary{font:400 22px/1.3 var(--f-lux)}
.qcard{font:500 15px/1.35 var(--f-ui)}
.qcard.th{font:400 17px/1.3 var(--f-lux)}
.answer h3{font-family:var(--f-lux);font-weight:400}

/* big phone, smaller photo, woven together */
.scene{grid-template-columns:minmax(0,1fr) minmax(0,.72fr);gap:0;max-width:640px;align-items:start;padding-bottom:90px}
.scene .arch-photo{width:100%;margin-top:70px;z-index:1;align-self:start}
.dwrap{order:-1;width:112%;max-width:340px;margin-inline-end:-12%;z-index:3;justify-self:start}
.scene .device{box-shadow:0 70px 110px -40px rgba(29,58,99,.55),0 0 90px rgba(190,224,255,.95),inset 0 0 0 1px rgba(255,255,255,.9)}
.verdict{bottom:10px;font:400 26px/1.1 var(--f-lux);padding:13px 26px}
.verdict .sk{font-family:var(--f-sacred);font-weight:700}

@keyframes rise{from{transform:translateY(110%)}to{transform:none}}
@keyframes sweep{0%,15%{background-position:100% 50%}60%,100%{background-position:0% 50%}}
@keyframes shine{0%,55%{transform:translateX(130%)}85%,100%{transform:translateX(-130%)}}
@keyframes breathe{0%,100%{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes hover{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes drift{from{transform:translateX(-4%) scale(1)}to{transform:translateX(5%) scale(1.06)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spin-ang{to{--ang:360deg}}
@keyframes halo{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.9);opacity:0}}
@keyframes ring{0%{transform:scale(.4);opacity:1}100%{transform:scale(5);opacity:0}}
@keyframes timer{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fadeup{from{transform:translateY(10px);opacity:.2}to{transform:none;opacity:1}}
@keyframes pop{from{transform:translateY(8px) scale(.9);opacity:0}to{transform:none;opacity:1}}
@keyframes dots{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes dotpulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(3.2);opacity:0}}

@media (max-width:1100px){ .qcard{max-width:200px;font-size:14px} }
@media (max-width:920px){
  .hero{padding-top:20px}
  .hero-grid,.pain-grid,.why-grid,.ans-grid,.offer-grid{grid-template-columns:1fr}
  .hero-grid{gap:0}
  .stage{max-width:640px;aspect-ratio:1/1.08;margin-top:6px}
  .why-photo{max-width:400px}
  .why-grid{gap:48px}
  .dec-grid{grid-template-columns:repeat(2,1fr)}
  .scene{max-width:460px}
  .answer{min-height:300px}
}
@media (max-width:760px){
  .mbar{display:flex}
  .top-cta span{display:none}
  .get-grid,.for-grid{grid-template-columns:1fr}
  .compare{grid-template-columns:1fr}
  .player{border-radius:24px}
  .play{width:80px;height:80px}
  .play svg{width:24px;height:24px}
  .offer{padding:30px 22px 26px}
  .after{padding:26px 22px}
  .answer{padding:30px 24px 34px}
  .answer .big{font-size:200px;bottom:-40px}
  .beam{left:auto;inset-inline-start:17px;margin:0}
  .step{grid-template-columns:36px 1fr}
  .step+.step{margin-top:12px}
  .step .node{grid-column:1}
  .step:nth-child(odd) .card,.step:nth-child(even) .card{grid-column:2;transform:translateX(-10px)}
  .step.lit .card{transform:none}
  .clouds{height:130px;margin-block:-65px}
  .foot .wrap{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:560px){
  body{font-size:17px}
  .dec-grid{grid-template-columns:1fr}
  .stage{aspect-ratio:1/1.2}
  .qcard{max-width:46%;padding:9px 10px;gap:7px;font-size:12.5px;border-radius:15px}
  .qcard .n{width:21px;height:21px;font-size:12px}
  .qa{top:2%;inset-inline-start:0}
  .qb{top:2%;inset-inline-end:0}
  .qc{top:76%;inset-inline-start:0}
  .qd{top:76%;inset-inline-end:0}
  .hud{bottom:-2%;font-size:11px}
  .btn{padding:16px 22px;font-size:18px}
  .cta-row .btn{width:100%}
  .flip,.flip-in{min-height:230px}
  .why-photo .badge{inset-inline-start:6px}
  .pillar{padding:30px 24px 32px}
  .who{padding:24px 20px}
  .player .cap b{display:none}
  .player .cap{bottom:14px;inset-inline-start:18px}
  .verdict{font-size:18px;padding:10px 16px}
  .device{width:60%}
  .scene{padding-bottom:70px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .js .rv:not(.in),.js [data-split]:not(.in) .w>span{transform:none}
  .verse .lines p{transition:none}
}

/* v5 responsive */
@media (max-width:1100px){
  .qcard.th{max-width:170px;font-size:14px}
  .t5{inset-inline-start:-2%}.t6{inset-inline-end:-2%}
}
@media (max-width:920px){
  .deck-grid{grid-template-columns:1fr;gap:28px}
  .deck{height:430px}
  .scene{max-width:520px}
}
@media (max-width:760px){
  .deck{height:470px}
  .dcard{padding:34px 26px 48px}
  .dcard .big{font-size:170px;top:-20px}
  .dcard .foot2{inset-inline:26px}
  .dcard[data-pos="1"]{transform:translate3d(-14px,-14px,-70px) rotate(-2deg)}
  .dcard[data-pos="2"]{transform:translate3d(-28px,-28px,-140px) rotate(-4deg)}
  .dcard[data-pos="3"]{transform:translate3d(-42px,-42px,-210px) rotate(-6deg)}
}
@media (max-width:560px){
  .qcard.th{display:none}
  .scene{grid-template-columns:minmax(0,1fr);justify-items:center;gap:18px;padding-bottom:70px}
  .scene .arch-photo{width:78%}
  .dwrap{width:64%}
  .pcard{padding:14px 16px 14px 14px;gap:14px}
  .pcard p{font-size:18.5px}
  .hl.sm{width:46px;height:46px}
  .player .cap{bottom:16px}
  .player .cap b{display:block;font-size:22px}
  .player .cap small{display:none}
  .player .cap span{font-size:10.5px;letter-spacing:.24em}
  .player .cap span::before,.player .cap span::after{width:18px}
  .play{top:-26%}
  .deck{height:520px}
  .dcard h3{font-size:26px}
  .dcard p{font-size:17.5px;line-height:1.65}
  .front .bub{font-size:16.5px}
}

/* v6 responsive */
@media (max-width:920px){
  .scene{max-width:560px}
}
@media (max-width:560px){
  h2{font-size:clamp(40px,11vw,52px)}
  .title{font-size:clamp(78px,23vw,100px)}
  .scene{grid-template-columns:minmax(0,1fr);gap:0;padding-bottom:80px}
  .scene .arch-photo{width:54%;margin-top:0;justify-self:end}
  .dwrap{order:0;width:80%;max-width:none;margin-inline-end:0;margin-top:-34%;justify-self:start}
  .pcard p{font-size:20px}
  .dcard h3{font-size:30px}
  .back p{font-size:21px}
  .pillar h3{font-size:34px}
  .price{font-size:110px}
  .faq summary{font-size:20px}
  .verdict{font-size:22px}
  .player .cap b{font-size:30px}
}