/* Layout: the world of his story highlights — a bright heaven of white light, pale sky and real clouds, with one
   glossy cobalt object at the centre: a realistic 3D brain. The page drifts through cloud banks as she scrolls.
   Palette: white, cream, pale sky; cobalt only for the brain, the buttons and a few words. No gold, brown or black. */
:root{
  --white:#FFFFFF;
  --cream:#FFFBF4;
  --mist:#F3F9FF;
  --sky:#E2F0FF;
  --sky2:#C6E2FF;
  --azure:#6FB4FF;
  --cobalt:#2A62F2;
  --cobalt-d:#1A47CF;
  --ink:#1D3A63;
  --ink-2:#3C5880;
  --muted:#6A7FA2;
  --line:rgba(42,98,242,.14);
  --f-sacred:"Frank Ruhl Libre","David Libre","Times New Roman",serif;
  --f-ui:"Heebo","Assistant",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-body:"Assistant","Heebo",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --glass-bg:rgba(255,255,255,.62);
  --rim:rgba(255,255,255,.96);
  --shadow:0 30px 70px -38px rgba(29,58,99,.32);
  --glow:0 0 0 1px rgba(255,255,255,.96),0 0 80px rgba(190,224,255,.75);
  --gl:max(16px, env(safe-area-inset-left,0px));
  --gr:max(16px, env(safe-area-inset-right,0px));
  color-scheme:light;
}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--mist);color:var(--ink);font-family:var(--f-body);font-size:18px;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:90;background:rgba(255,255,255,.92)}
.page{position:relative;overflow-x:clip;min-height:100vh;-webkit-tap-highlight-color:transparent}
.wrap{max-width:1200px;margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr)}
section[id]{scroll-margin-top:84px}
img{max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px;border-radius:10px}
::selection{background:var(--sky2);color:var(--ink)}

/* ===== heaven ===== */
.sky-fallback{position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse 80% 55% at 50% -5%,#fff 0%,rgba(255,255,255,.95) 30%,transparent 62%),radial-gradient(ellipse 60% 30% at 20% 88%,#fff,transparent 70%),radial-gradient(ellipse 60% 30% at 80% 96%,#fff,transparent 70%),linear-gradient(180deg,#DDEEFF 0%,#EEF7FF 45%,#FFFDF8 100%)}
#sky{position:fixed;left:0;top:0;width:100vw;height:100vh;height:100lvh;z-index:0;display:block;pointer-events:none}
#motes{position:fixed;left:0;top:0;width:100vw;height:100vh;height:100lvh;z-index:1;display:block;pointer-events:none}
.page>header,.page>main,.page>footer{position:relative;z-index:2}
.tap-ring{position:fixed;z-index:70;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;border:1.5px solid rgba(255,255,255,.95);box-shadow:0 0 22px rgba(160,210,255,.95),inset 0 0 12px rgba(255,255,255,.9);pointer-events:none;animation:ring .9s cubic-bezier(.2,.8,.2,1) forwards}
.progress{position:fixed;inset:env(safe-area-inset-top,0px) 0 auto;height:2px;z-index:95;pointer-events:none}
.progress span{display:block;height:100%;background:linear-gradient(90deg,#fff,var(--azure),var(--cobalt));transform-origin:right;transform:scaleX(0);box-shadow:0 0 10px rgba(111,180,255,.8)}

.glass{background:var(--glass-bg);border:1px solid var(--rim);box-shadow:var(--shadow)}
@media (hover:hover) and (min-width:900px){ .glass{-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2)} }
@media not all and (hover:hover){ .glass{background:rgba(255,255,255,.84)} }

/* cloud banks between sections */
.clouds{position:relative;z-index:0;height:190px;margin-block:-95px;pointer-events:none}
.sec{position:relative;z-index:1}
.clouds .layer{position:absolute;inset:0}
.cl-puff{position:absolute;bottom:0;border-radius:50%;background:radial-gradient(circle at 50% 42%,#fff 0 34%,rgba(250,252,255,.94) 48%,rgba(226,238,252,.55) 60%,rgba(226,238,252,0) 71%);animation:drift 22s ease-in-out infinite alternate}
.cl-puff:nth-child(1){left:-6%;width:34%;height:100%;animation-duration:26s}
.cl-puff:nth-child(2){left:16%;width:30%;height:78%;animation-duration:20s;animation-delay:-6s}
.cl-puff:nth-child(3){left:36%;width:36%;height:96%;animation-duration:24s;animation-delay:-10s}
.cl-puff:nth-child(4){left:58%;width:30%;height:82%;animation-duration:21s;animation-delay:-3s}
.cl-puff:nth-child(5){left:76%;width:34%;height:100%;animation-duration:27s;animation-delay:-14s}
.cl-puff:nth-child(6){left:6%;width:88%;height:44%;bottom:-8%;animation-duration:30s}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:80}
.top::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.58);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid rgba(255,255,255,.9);box-shadow:0 10px 30px -22px rgba(29,58,99,.3)}
.top .bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}
.brand{display:inline-flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;direction:ltr}
.brand b{font:500 13px/1 var(--f-ui);letter-spacing:.36em;color:var(--ink);padding-left:.36em}
.brand i{display:block;width:34px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--cobalt),transparent)}
.top-cta{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;text-decoration:none;font:700 15px/1 var(--f-ui);color:#fff;background:linear-gradient(180deg,#5A95FF 0%,var(--cobalt) 55%,var(--cobalt-d) 100%);box-shadow:0 10px 24px -12px rgba(42,98,242,.7),inset 0 1px 0 rgba(255,255,255,.55)}
.top-cta span{opacity:.85;font-weight:500}

/* buttons: glossy like the highlight icons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;border-radius:999px;padding:18px 32px;font:700 19px/1.2 var(--f-ui);text-decoration:none;cursor:pointer;border:0;overflow:hidden;transform:translate(var(--tx,0),var(--ty,0));transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;isolation:isolate}
.btn-primary{color:#fff;background:linear-gradient(180deg,#6AA2FF 0%,var(--cobalt) 52%,var(--cobalt-d) 100%);box-shadow:0 22px 46px -18px rgba(42,98,242,.65),inset 0 1px 0 rgba(255,255,255,.6),inset 0 -6px 14px rgba(16,50,170,.35),0 0 50px rgba(160,210,255,.6)}
.btn-primary::before{content:"";position:absolute;left:8%;right:8%;top:3px;height:44%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));pointer-events:none}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.45) 50%,transparent 62%);transform:translateX(130%);animation:shine 5s ease-in-out infinite;pointer-events:none}
.btn-primary:hover{box-shadow:0 28px 60px -18px rgba(42,98,242,.75),inset 0 1px 0 rgba(255,255,255,.65),inset 0 -6px 14px rgba(16,50,170,.35),0 0 80px rgba(160,210,255,.85)}
.btn .tag{position:relative;font:600 16px/1 var(--f-ui);padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.45)}
.btn-ghost{color:var(--ink);background:rgba(255,255,255,.82);border:1px solid #fff;box-shadow:var(--shadow),0 0 40px rgba(190,224,255,.6)}
.btn-ghost .pl{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#6AA2FF,var(--cobalt-d));color:#fff;box-shadow:0 0 0 4px rgba(111,180,255,.22),inset 0 1px 0 rgba(255,255,255,.6)}
.btn-ghost .pl svg{width:11px;height:11px;margin-left:2px}

/* sky word */
.sk{background:linear-gradient(100deg,var(--cobalt-d) 0%,var(--cobalt) 34%,#7DBBFF 46%,#E8F4FF 50%,#7DBBFF 54%,var(--cobalt) 66%,var(--cobalt-d) 100%);background-size:300% 100%;background-position:100% 50%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sweep 9s ease-in-out infinite}
em.sk,.sk em{font-style:normal}

/* split words */
.w{display:inline-block;perspective:600px}
.w>span{display:inline-block;transform-origin:50% 100%;transition:transform 1.1s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0) * 60ms)}
.js [data-split]:not(.in) .w>span{transform:translateY(.45em) rotateX(-55deg)}
.rv{transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.js .rv:not(.in){transform:translateY(50px) scale(.985)}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}

/* ===== hero ===== */
.hero{padding-block:26px 40px;position:relative}
.hero-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:20px;align-items:center}
.hero-copy{min-width:0;position:relative;z-index:4}
.chip{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.8);border:1px solid #fff;box-shadow:0 10px 30px -18px rgba(29,58,99,.35);color:var(--cobalt);font:600 14px/1.2 var(--f-ui)}
.chip .dot{width:7px;height:7px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 10px 3px rgba(111,180,255,.9);animation:breathe 2.4s ease-in-out infinite}
.title{font-family:var(--f-sacred);font-weight:900;font-size:clamp(76px,10.4vw,160px);line-height:.92;letter-spacing:-.01em;margin:18px 0 12px;filter:drop-shadow(0 0 28px rgba(255,255,255,1))}
.title .ln{display:block;overflow:hidden;padding:.02em 0 .14em;margin-bottom:-.14em}
.title .ln>span{display:inline-block;animation:rise 1.4s cubic-bezier(.2,.8,.2,1) both;background-size:320% 100%;background-position:100% 50%;-webkit-background-clip:text;background-clip:text;color:transparent}
.title .l1>span{background-image:linear-gradient(100deg,var(--ink) 0%,var(--ink) 42%,#7DBBFF 47%,#fff 50%,#7DBBFF 53%,var(--ink) 58%,var(--ink) 100%);animation:rise 1.4s cubic-bezier(.2,.8,.2,1) both,sweep 10s ease-in-out 1.8s infinite}
.title .l2>span{background-image:linear-gradient(100deg,var(--cobalt-d) 0%,var(--cobalt) 38%,#8CC4FF 47%,#fff 50%,#8CC4FF 53%,var(--cobalt) 62%,var(--cobalt-d) 100%);animation:rise 1.4s cubic-bezier(.2,.8,.2,1) .14s both,sweep 10s ease-in-out 2.6s infinite}
.kicker{font:300 clamp(25px,3vw,38px)/1.2 var(--f-ui);color:var(--ink);margin:0 0 14px;text-wrap:balance}
.kicker b{font-weight:500;color:var(--cobalt)}
.lead{color:var(--ink-2);font-size:19px;max-width:500px;margin:0}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;align-items:center}
.facts{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.facts li{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid #fff;color:var(--cobalt);font:600 14px/1.3 var(--f-ui);box-shadow:0 8px 20px -14px rgba(29,58,99,.35)}

.stage{position:relative;width:100%;max-width:780px;aspect-ratio:1/.98;margin-inline:auto;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.stage.drag{cursor:grabbing}
.stage .rays{position:absolute;left:-30%;right:-30%;top:-40%;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,0) 0deg 5deg,rgba(255,255,255,.85) 6.5deg 8deg,rgba(255,255,255,0) 9.5deg 15deg);-webkit-mask-image:radial-gradient(circle,#000 0%,rgba(0,0,0,.45) 32%,transparent 62%);mask-image:radial-gradient(circle,#000 0%,rgba(0,0,0,.45) 32%,transparent 62%);animation:spin 140s linear infinite;pointer-events:none}
.stage .halo{position:absolute;left:6%;right:6%;top:2%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff 0%,rgba(255,255,255,.95) 22%,rgba(220,238,255,.6) 44%,rgba(200,228,255,.2) 58%,transparent 70%);filter:blur(6px);animation:breathe 7s ease-in-out infinite;pointer-events:none}
.stage canvas{position:absolute;left:-9%;top:-9%;width:118%;height:118%;display:block;z-index:2}
.stage .bed{position:absolute;left:-12%;right:-12%;bottom:-6%;height:30%;z-index:3;pointer-events:none}
.stage .leads{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:4;pointer-events:none}
.leads path{fill:none;stroke:#8CC0FF;stroke-width:1.2;opacity:.7;transition:opacity .5s,stroke-width .5s,stroke .5s}
.leads path.on{opacity:1;stroke-width:1.8;stroke:var(--cobalt)}
.leads circle.dot{fill:#fff;stroke:var(--cobalt);stroke-width:1.6}
.leads circle.pulse{fill:none;stroke:rgba(111,180,255,.95);stroke-width:1.2;transform-box:fill-box;transform-origin:center;animation:dotpulse 2.2s ease-out infinite}
.qcard{position:absolute;z-index:5;max-width:230px;display:flex;gap:10px;align-items:flex-start;padding:12px 15px;border-radius:20px;background:rgba(255,255,255,.86);border:1px solid #fff;box-shadow:0 18px 40px -22px rgba(29,58,99,.45),0 0 30px rgba(220,238,255,.8);font:600 15px/1.35 var(--f-ui);color:var(--ink);cursor:pointer;text-align:start;transition:box-shadow .5s,transform .5s cubic-bezier(.2,.8,.2,1),background .5s}
@media (hover:hover) and (min-width:900px){ .qcard{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)} }
.qcard .n{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(42,98,242,.35);color:var(--cobalt);font:700 14px/1 var(--f-sacred)}
.qcard.on{background:#fff;box-shadow:0 22px 50px -24px rgba(42,98,242,.55),0 0 60px rgba(170,215,255,.95);transform:translateY(-3px) scale(1.03)}
.qcard.on .n{background:linear-gradient(180deg,#6AA2FF,var(--cobalt-d));color:#fff;border-color:transparent}
.qa{top:6%;inset-inline-start:2%}
.qb{top:4%;inset-inline-end:0}
.qc{top:64%;inset-inline-start:0}
.qd{top:70%;inset-inline-end:3%}
.hud{position:absolute;z-index:5;left:50%;bottom:1%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 15px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid #fff;box-shadow:0 10px 30px -18px rgba(29,58,99,.4);font:600 12.5px/1 var(--f-ui);letter-spacing:.04em;color:var(--cobalt);white-space:nowrap}
.hud i{width:6px;height:6px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 8px 2px rgba(111,180,255,.9);animation:blink 1.4s ease-in-out infinite}
.hud .bar{position:relative;width:60px;height:2px;border-radius:2px;background:rgba(42,98,242,.15);overflow:hidden}
.hud .bar b{position:absolute;inset:0;background:var(--cobalt);transform-origin:right;transform:scaleX(var(--hp,0))}
.stage .loading{position:absolute;inset:0;display:grid;place-items:center;z-index:1;pointer-events:none;transition:opacity .8s}
.stage .loading i{width:46%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(111,180,255,.35),transparent 65%);animation:breathe 2s ease-in-out infinite}
.stage.ready .loading{opacity:0}

/* sections */
.sec{padding-block:clamp(80px,10vw,140px)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 14px/1.2 var(--f-ui);letter-spacing:.14em;color:var(--cobalt);margin-bottom:14px}
.eyebrow::before{content:"";width:24px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,var(--azure),transparent)}
h2{font-family:var(--f-sacred);font-weight:700;font-size:clamp(38px,5.4vw,68px);line-height:1.06;margin:0 0 18px;text-wrap:balance;color:var(--ink)}
.sub{color:var(--ink-2);font-size:19px;max-width:640px;margin:0}
.center{text-align:center}
.center .sub{margin-inline:auto}

/* verse */
.verse{position:relative;z-index:2;padding-block:80px 30px;text-align:center}
.verse .orn{display:flex;align-items:center;justify-content:center;gap:16px;color:var(--azure)}
.verse .orn i{width:min(140px,22vw);height:1.5px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--azure))}
.verse .orn i:last-child{background:linear-gradient(90deg,var(--azure),transparent)}
.verse .orn svg{width:18px;height:18px;filter:drop-shadow(0 0 6px rgba(111,180,255,.9))}
.verse .lines{position:relative;height:clamp(90px,9vw,124px);margin:18px auto 14px;max-width:1000px}
.verse .lines p{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding-inline:var(--gr) var(--gl);font:500 clamp(26px,3.6vw,46px)/1.2 var(--f-sacred);color:var(--ink);opacity:0;filter:blur(10px);transform:translateY(12px);transition:opacity 1.2s,filter 1.2s,transform 1.2s cubic-bezier(.2,.8,.2,1);text-wrap:balance}
.verse .lines p.on{opacity:1;filter:none;transform:none}
.verse small{font:500 13px/1 var(--f-ui);letter-spacing:.16em;color:var(--muted)}

/* video */
.player{position:relative;max-width:1000px;margin:46px auto 0;aspect-ratio:16/9;border-radius:36px;overflow:hidden;background:#C9DDF2;box-shadow:0 0 0 7px rgba(255,255,255,.92),0 0 120px rgba(190,224,255,.9),0 60px 110px -50px rgba(29,58,99,.5)}
.player>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.player::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.3),transparent 55%),linear-gradient(180deg,rgba(20,40,80,0) 40%,rgba(20,40,80,.62));pointer-events:none}
.play{position:absolute;inset:0;margin:auto;z-index:3;width:104px;height:104px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;color:var(--cobalt);background:radial-gradient(circle at 35% 30%,#fff,#F2F8FF 60%,#D8EAFF);box-shadow:0 0 0 1px rgba(255,255,255,.9),0 0 70px rgba(200,230,255,1);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.play::before,.play::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:1.5px solid rgba(255,255,255,.95);animation:halo 2.6s ease-out infinite}
.play::after{animation-delay:1.3s}
.play svg{width:30px;height:30px;margin-left:6px}
.play:hover{transform:scale(1.07)}
.player .cap{position:absolute;z-index:3;bottom:24px;inset-inline:28px;display:flex;flex-direction:column;gap:6px;color:#fff}
.player .cap b{font:500 clamp(18px,2.4vw,28px)/1.25 var(--f-sacred);text-wrap:balance;text-shadow:0 2px 20px rgba(10,30,70,.4)}
.player .cap span{font:600 13px/1.2 var(--f-ui);color:#D6EBFF;letter-spacing:.12em}
.player.playing>img,.player.playing .play,.player.playing .cap,.player.playing::after{display:none}
.player .media{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}

/* phone section */
.pain{padding-top:50px}
.pain-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.pain-grid>*{min-width:0}
.pain-list{list-style:none;padding:0;margin:30px 0;display:grid;gap:12px}
.pain-list li{position:relative;display:flex;gap:14px;align-items:flex-start;padding:16px 20px;border-radius:20px;font:600 19px/1.45 var(--f-body);color:var(--ink);overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.pain-list li:hover{transform:translateX(-6px);box-shadow:0 30px 60px -36px rgba(29,58,99,.45),0 0 50px rgba(190,224,255,.8)}
.pain-list li::before{content:"";flex:none;width:18px;height:18px;margin-top:5px;border-radius:50%;background:radial-gradient(circle,var(--cobalt) 0 28%,transparent 31%),rgba(42,98,242,.12);box-shadow:0 0 12px rgba(111,180,255,.6)}
.pain-end{font:700 clamp(32px,4vw,50px)/1.1 var(--f-sacred);margin:0;color:var(--ink)}
.scene{position:relative;max-width:520px;margin-inline:auto;padding-bottom:60px}
.arch-photo{position:relative;width:74%;margin:0;padding:7px;aspect-ratio:3/4.15;border-radius:999px 999px 30px 30px;background:linear-gradient(180deg,#fff,rgba(255,255,255,.6));box-shadow:var(--glow),0 50px 90px -40px rgba(29,58,99,.45)}
.arch-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 20%;border-radius:999px 999px 24px 24px}
.glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.65),transparent 45%);opacity:var(--go,0);transition:opacity .5s;mix-blend-mode:soft-light;z-index:5}
.device{--base:rotate(-5deg);position:absolute;inset-inline-end:0;bottom:0;width:58%;max-width:270px;aspect-ratio:9/18.6;border-radius:44px;padding:3px;background:linear-gradient(150deg,#FFFFFF 0%,#DDE7F3 30%,#F7FAFE 55%,#CFDCEC 80%,#F2F6FB 100%);box-shadow:0 60px 90px -36px rgba(29,58,99,.5),0 0 70px rgba(190,224,255,.9),inset 0 0 0 1px rgba(255,255,255,.9);z-index:3;animation:hover 7s ease-in-out infinite}
.device .bezel{height:100%;border-radius:41px;padding:6px;background:linear-gradient(180deg,#EEF3F9,#E3EAF3)}
.screen{position:relative;height:100%;border-radius:35px;overflow:hidden;background:linear-gradient(180deg,#FFFFFF,#EEF5FD);display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px rgba(29,58,99,.06)}
.screen::before{content:"";position:absolute;top:9px;left:50%;width:76px;height:22px;margin-left:-38px;border-radius:12px;background:#1F2C40;z-index:3}
.chat-head{display:flex;align-items:center;gap:9px;padding:40px 14px 10px;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(29,58,99,.06)}
.chat-head .av{flex:none;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 50% 38%,#e6eef8 0 22%,transparent 23%),radial-gradient(ellipse at 50% 100%,#e6eef8 0 42%,transparent 43%),linear-gradient(180deg,#9DB9DE,#5F84B8)}
.chat-head b{display:block;font:800 14px/1.1 var(--f-ui);color:var(--ink)}
.chat-head small{display:block;font:500 11px/1.2 var(--f-ui);color:var(--muted);transition:color .3s}
.chat-head small.on{color:var(--cobalt)}
.chat-body{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;padding:10px 10px 6px;overflow:hidden;transition:opacity .5s}
.chat-body.fade{opacity:0}
.msg{max-width:84%;padding:7px 11px 5px;border-radius:15px;font:500 13.5px/1.35 var(--f-body);animation:pop .4s cubic-bezier(.2,.9,.3,1.3) both}
.msg .tm{display:block;font:500 9.5px/1 var(--f-ui);opacity:.7;margin-top:3px;text-align:end}
.msg.her{align-self:flex-start;background:linear-gradient(180deg,#5B96FF,var(--cobalt));color:#fff;border-end-start-radius:4px;box-shadow:0 4px 12px -4px rgba(42,98,242,.5)}
.msg.him{align-self:flex-end;background:#fff;color:var(--ink);border-end-end-radius:4px;box-shadow:0 2px 8px rgba(29,58,99,.08)}
.day{align-self:center;padding:3px 10px;border-radius:999px;background:rgba(42,98,242,.08);font:600 10.5px/1.4 var(--f-ui);color:var(--muted);margin-block:4px;animation:pop .4s both}
.seen{align-self:flex-start;font:600 10px/1 var(--f-ui);color:var(--muted);padding-inline-start:4px;animation:pop .4s both}
.typing{align-self:flex-end;display:flex;gap:4px;padding:11px 13px;border-radius:15px;border-end-end-radius:4px;background:#fff;box-shadow:0 2px 8px rgba(29,58,99,.08);animation:pop .3s both}
.typing i{width:6px;height:6px;border-radius:50%;background:#9DB0CC;animation:dots 1.1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
.chat-input{margin:6px 10px 12px;padding:9px 12px;border-radius:999px;background:#fff;font:500 12px/1 var(--f-ui);color:#A9B8CE;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px rgba(29,58,99,.06)}
.chat-input i{width:22px;height:22px;border-radius:50%;background:linear-gradient(180deg,#5B96FF,var(--cobalt))}
.verdict{position:absolute;inset-inline-start:2%;bottom:6px;z-index:4;padding:12px 22px;border-radius:999px;background:#fff;box-shadow:0 20px 40px -18px rgba(29,58,99,.45),0 0 50px rgba(190,224,255,.95);font:700 22px/1.2 var(--f-sacred);color:var(--ink);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.verdict.off{opacity:0;transform:translateY(14px) scale(.96)}

/* why */
.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.why-grid>*{min-width:0}
.why-photo{position:relative;max-width:440px;margin-inline:auto;width:100%}
.why-photo::before{content:"";position:absolute;inset:-12% -14%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(200,228,255,.5) 40%,transparent 66%);filter:blur(10px)}
.why-photo .frame{position:relative;padding:7px;border-radius:999px 999px 32px 32px;background:linear-gradient(180deg,#fff,rgba(255,255,255,.6));box-shadow:var(--glow),0 50px 90px -40px rgba(29,58,99,.45)}
.why-photo img{display:block;width:100%;aspect-ratio:4/5.3;object-fit:cover;object-position:50% 25%;border-radius:999px 999px 26px 26px}
.why-photo .badge{position:absolute;bottom:26px;inset-inline-start:-18px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.95);box-shadow:var(--shadow),0 0 30px rgba(190,224,255,.8);font:700 16px/1.2 var(--f-ui);color:var(--ink);z-index:6;animation:float 8s ease-in-out infinite}
.why-photo .badge span{display:block;font-weight:500;font-size:13px;color:var(--cobalt);margin-top:3px}
.why-copy .big-quote{font:900 clamp(52px,7vw,92px)/.98 var(--f-sacred);margin:0 0 22px;color:var(--ink);max-width:none}
.why-copy .big-quote>span{display:block}
.why-copy p{color:var(--ink-2);font-size:19px;margin:0 0 14px;max-width:580px}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.cmp{position:relative;padding:18px 18px 20px;border-radius:22px;overflow:hidden}
.cmp b{display:block;font:600 13px/1 var(--f-ui);letter-spacing:.16em;color:var(--muted);margin-bottom:10px}
.cmp p{margin:0 !important;font:600 17px/1.45 var(--f-body) !important;color:var(--muted)}
.cmp.in-side{background:linear-gradient(180deg,#6AA2FF 0%,var(--cobalt) 55%,var(--cobalt-d) 100%);border:1px solid rgba(255,255,255,.6);box-shadow:0 24px 50px -24px rgba(42,98,242,.7),0 0 50px rgba(170,215,255,.7),inset 0 1px 0 rgba(255,255,255,.5)}
.cmp.in-side b{color:#DCEEFF}
.cmp.in-side p{color:#fff !important}

/* four answers */
.answers{position:relative;isolation:isolate}
.answers::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(800px 420px at 70% 30%,rgba(255,255,255,.95),transparent 60%),linear-gradient(180deg,rgba(226,240,255,0) 0%,rgba(226,240,255,.85) 16%,rgba(214,234,255,.85) 50%,rgba(226,240,255,.85) 84%,rgba(226,240,255,0) 100%)}
.ans-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:stretch;margin-top:36px}
.ans-grid>*{min-width:0}
.qs{display:grid;gap:10px;align-content:center}
.q{position:relative;width:100%;display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;border:1px solid #fff;background:rgba(255,255,255,.6);color:var(--ink);font:600 19px/1.3 var(--f-ui);text-align:start;cursor:pointer;overflow:hidden;transition:background .5s,box-shadow .5s,transform .5s cubic-bezier(.2,.8,.2,1)}
.q:hover{transform:translateX(-4px)}
.q .n{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(42,98,242,.35);color:var(--cobalt);font:700 16px/1 var(--f-sacred)}
.q[aria-selected="true"]{background:#fff;box-shadow:0 24px 50px -30px rgba(42,98,242,.5),0 0 50px rgba(190,224,255,.9)}
.q[aria-selected="true"] .n{background:linear-gradient(180deg,#6AA2FF,var(--cobalt-d));color:#fff;border-color:transparent}
.answer{position:relative;padding:40px 40px 44px;border-radius:30px;background:rgba(255,255,255,.86);border:1px solid #fff;box-shadow:var(--shadow),0 0 90px rgba(255,255,255,.9);overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:360px}
.answer .big{position:absolute;inset-inline-end:-10px;bottom:-60px;font:900 280px/1 var(--f-sacred);color:transparent;-webkit-text-stroke:1.5px rgba(111,180,255,.4);pointer-events:none}
.answer .lbl{display:block;font:600 13px/1 var(--f-ui);letter-spacing:.16em;color:var(--cobalt);margin-bottom:14px}
.answer h3{position:relative;margin:0 0 16px;font:700 clamp(26px,2.8vw,36px)/1.2 var(--f-sacred);color:var(--ink);text-wrap:balance}
.answer p{position:relative;margin:0;font:500 19.5px/1.7 var(--f-body);color:var(--ink-2);max-width:56ch}
.answer .timer{position:absolute;inset:auto 0 0 0;height:2px;background:linear-gradient(90deg,var(--azure),var(--cobalt));transform-origin:right;transform:scaleX(0)}
.answer.run .timer{animation:timer 7s linear forwards}
.answer.flash h3,.answer.flash p{animation:fadeup .8s cubic-bezier(.2,.8,.2,1)}
.rule{margin:70px auto 0;max-width:900px;text-align:center;font:700 clamp(30px,4.2vw,54px)/1.15 var(--f-sacred);color:var(--ink);text-wrap:balance}
.rule small{display:block;margin-top:16px;font:500 14px/1.2 var(--f-ui);letter-spacing:.14em;color:var(--muted)}

/* decoder */
.dec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.flip{position:relative;perspective:1400px;min-height:260px;cursor:pointer;border-radius:24px}
.flip-in{position:relative;height:100%;min-height:260px;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1);transform:rotateY(var(--fy,0deg)) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.flip.on .flip-in{--fy:180deg}
.face{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:24px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:12px;overflow:hidden}
.front{background:rgba(255,255,255,.8);border:1px solid #fff;box-shadow:var(--shadow)}
.back{transform:rotateY(180deg);background:radial-gradient(circle at 80% 0%,rgba(255,255,255,.35),transparent 55%),linear-gradient(180deg,#6AA2FF 0%,var(--cobalt) 55%,var(--cobalt-d) 100%);color:#fff;box-shadow:0 26px 50px -26px rgba(42,98,242,.8),inset 0 1px 0 rgba(255,255,255,.5)}
.face .k{font:600 13px/1 var(--f-ui);letter-spacing:.16em;color:var(--muted)}
.back .k{color:#DCEEFF}
.front p{margin:0;font:700 24px/1.3 var(--f-sacred);color:var(--ink);text-wrap:balance}
.back p{margin:0;font:500 21px/1.5 var(--f-sacred);text-wrap:balance}
.face .hint{display:inline-flex;align-items:center;gap:8px;font:600 14px/1 var(--f-ui);color:var(--cobalt)}
.face .hint svg{width:18px;height:18px;animation:spin 6s linear infinite}
.back .src{font:500 13px/1.2 var(--f-ui);color:rgba(255,255,255,.8)}

/* get */
.get-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:44px}
.pillar{position:relative;padding:38px 34px 40px;border-radius:30px;overflow:hidden}
.pillar::after{content:"";position:absolute;width:280px;height:280px;inset-inline-end:-100px;top:-120px;border-radius:50%;background:radial-gradient(circle,rgba(190,224,255,.7),transparent 70%);animation:breathe 7s ease-in-out infinite}
.pillar .ic{position:relative;width:62px;height:62px;border-radius:20px;display:grid;place-items:center;color:#fff;background:linear-gradient(180deg,#6AA2FF 0%,var(--cobalt) 55%,var(--cobalt-d) 100%);box-shadow:0 14px 30px -14px rgba(42,98,242,.8),0 0 30px rgba(170,215,255,.8),inset 0 1px 0 rgba(255,255,255,.6);margin-bottom:22px}
.pillar .ic svg{width:28px;height:28px}
.pillar h3{position:relative;font:700 32px/1.15 var(--f-sacred);margin:0 0 12px}
.pillar p{position:relative;margin:0;color:var(--ink-2);font-size:18.5px}
.statement{margin:70px auto 0;max-width:980px;text-align:center;font:900 clamp(36px,5.4vw,70px)/1.08 var(--f-sacred);text-wrap:balance;color:var(--ink)}

/* ladder */
.ladder-wrap{position:relative;max-width:1040px;margin:60px auto 0}
.beam{position:absolute;top:10px;bottom:10px;left:50%;width:2px;margin-left:-1px;border-radius:2px;background:rgba(42,98,242,.12)}
.beam i{position:absolute;inset:0;border-radius:2px;background:linear-gradient(180deg,#fff,var(--azure) 30%,var(--cobalt));transform-origin:top;transform:scaleY(var(--fill,0));box-shadow:0 0 18px 2px rgba(111,180,255,.8)}
.beam i::after{content:"";position:absolute;left:50%;bottom:-10px;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:#fff;box-shadow:0 0 24px 10px rgba(150,205,255,.95)}
.ladder{list-style:none;padding:0;margin:0}
.step{position:relative;display:grid;grid-template-columns:1fr 76px 1fr;align-items:center}
.step+.step{margin-top:-30px}
.step .node{grid-column:2;grid-row:1;justify-self:center;width:16px;height:16px;border-radius:50%;background:#fff;border:1.5px solid rgba(42,98,242,.35);transition:background .6s,box-shadow .6s,border-color .6s,transform .6s}
.step .card{grid-row:1;position:relative;padding:20px 24px 22px;border-radius:24px;background:rgba(255,255,255,.55);border:1px solid #fff;box-shadow:0 20px 50px -36px rgba(29,58,99,.4);transition:background .7s,box-shadow .7s,transform .7s cubic-bezier(.2,.8,.2,1);overflow:hidden}
.step:nth-child(odd) .card{grid-column:1;transform:translateX(18px)}
.step:nth-child(even) .card{grid-column:3;transform:translateX(-18px)}
.step .num{font:600 13px/1 var(--f-ui);letter-spacing:.14em;color:var(--muted);transition:color .6s}
.step h3{font:700 22px/1.25 var(--f-sacred);color:var(--ink);margin:8px 0 6px;text-wrap:balance}
.step p{margin:0;font:500 15.5px/1.5 var(--f-body);color:var(--ink-2)}
.step.lit .node{background:var(--cobalt);border-color:#fff;transform:scale(1.3);box-shadow:0 0 0 6px rgba(42,98,242,.12),0 0 22px 6px rgba(111,180,255,.9)}
.step.lit .card{background:#fff;transform:none;box-shadow:0 26px 56px -32px rgba(42,98,242,.45),0 0 60px rgba(190,224,255,.85)}
.step.lit .num{color:var(--cobalt)}
.ladder-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:34px}
.ladder-meta span{padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid #fff;font:600 14px/1.2 var(--f-ui);color:var(--cobalt)}

/* not */
.not-list{list-style:none;padding:0;margin:34px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:900px}
.not-list li{position:relative;padding:12px 22px;border-radius:999px;background:rgba(255,255,255,.75);border:1px solid #fff;color:var(--muted);font:600 18px/1.3 var(--f-ui)}
.not-list li::after{content:"";position:absolute;inset-inline:16px;top:52%;height:1.5px;border-radius:2px;background:var(--cobalt);transform:scaleX(1);transform-origin:right;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.js .not-list:not(.in) li::after{transform:scaleX(0)}
.not-list li:nth-child(2)::after{transition-delay:.15s}.not-list li:nth-child(3)::after{transition-delay:.3s}.not-list li:nth-child(4)::after{transition-delay:.45s}
.yes{margin:40px 0 14px;font:900 clamp(64px,10vw,140px)/.95 var(--f-sacred)}

/* for */
.for-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:44px}
.who{position:relative;display:flex;gap:20px;align-items:flex-start;padding:30px;border-radius:28px;overflow:hidden}
.who .ic{flex:none;width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(180deg,#fff,#E6F2FF);color:var(--cobalt);box-shadow:0 0 0 1px rgba(42,98,242,.15),0 0 26px rgba(190,224,255,.9)}
.who .ic svg{width:26px;height:26px}
.who h3{margin:0 0 8px;font:700 28px/1.2 var(--f-sacred)}
.who p{margin:0;color:var(--ink-2);font-size:18.5px}

/* offer */
.offer-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;margin-top:44px;align-items:stretch}
.offer-grid>*{min-width:0}
.offer-shell{position:relative;isolation:isolate;border-radius:36px;padding:1.5px}