/* =========================================================
   ULTRA layer: cinematic dark, realistic device mockups, motion
   ========================================================= */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:95;background:var(--brand-2);transform-origin:0 50%;transform:scaleX(0)}
.topbar{background:oklch(0.1 0.02 285);border-bottom:1px solid var(--line);color:var(--ink-2)}
.topbar a{color:var(--brand-2)}
.h-xl,.h-lg,.phero h1{font-family:var(--display);font-weight:600}
.mono{font-family:var(--mono)}

/* split-word mask reveal */
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.sw>span{display:inline-block;will-change:transform}

/* ---------- hero ---------- */
.uhero{position:relative;padding:56px 0 110px;overflow:hidden;isolation:isolate}
.uhero .bgfx{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.aurora{position:absolute;inset:-20%;filter:blur(90px);opacity:.5}
.aurora i{position:absolute;border-radius:50%;width:46vw;height:46vw;max-width:720px;max-height:720px}
.aurora i:nth-child(1){background:oklch(0.55 0.25 293);top:-10%;right:-6%;animation:drift 20s var(--ease) infinite alternate}
.aurora i:nth-child(2){background:oklch(0.5 0.2 265);top:30%;left:-12%;opacity:.6;animation:drift 26s var(--ease) infinite alternate-reverse}
.aurora i:nth-child(3){background:oklch(0.62 0.17 330);bottom:-30%;right:20%;opacity:.35;animation:drift 30s var(--ease) infinite alternate}
@keyframes drift{to{transform:translate3d(6%,-8%,0) scale(1.15)}}
.gridfx{position:absolute;inset:0;background-image:linear-gradient(oklch(1 0 0 / .045) 1px,transparent 1px),linear-gradient(90deg,oklch(1 0 0 / .045) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent 80%);mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent 80%)}
.spotfx{position:absolute;width:760px;height:760px;left:0;top:0;border-radius:50%;background:radial-gradient(circle,oklch(0.72 0.17 295 / .16),transparent 60%);transform:translate(-50%,-50%);pointer-events:none;opacity:0;transition:opacity .6s}
.uhero:hover .spotfx{opacity:1}
.uhero-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.uhero h1{font-size:clamp(2.7rem,5.4vw,5rem);line-height:.98;letter-spacing:-.045em;margin:1.4rem 0 1.5rem}
.uhero h1 .serif{font-weight:400;color:var(--brand-2);letter-spacing:-.02em}
.pill{background:oklch(1 0 0 / .05);border-color:var(--line-2);color:var(--ink-2);backdrop-filter:blur(8px)}
.kpis{display:grid;grid-template-columns:repeat(3,auto);gap:2.4rem;margin-top:2.4rem;padding-top:1.8rem;border-top:1px solid var(--line);justify-content:start}
.kpis b{display:block;font-family:var(--display);font-size:2rem;letter-spacing:-.04em;line-height:1;font-weight:600}
.kpis span{font-size:.8rem;color:var(--mute);font-family:var(--mono);letter-spacing:.02em}

/* stage */
.stage{position:relative;height:720px;perspective:1600px}
.stage-in{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.chip{position:absolute;z-index:6;display:flex;align-items:center;gap:.65rem;padding:.7rem 1rem;border-radius:16px;background:oklch(0.22 0.03 285 / .72);border:1px solid var(--line-2);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow);font-size:.8rem;color:var(--ink-2)}
.chip b{display:block;font-family:var(--display);font-size:1.15rem;color:var(--ink);letter-spacing:-.02em;line-height:1.1}
.chip .ci{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
.chip.c1{left:-2%;top:10%}
.chip.c2{right:-2%;top:46%}

/* ---------- realistic iPhone ---------- */
.iphone{position:absolute;left:50%;top:0;width:320px;height:668px;margin-left:-80px;border-radius:56px;padding:11px;background:linear-gradient(145deg,#4a4a52,#1c1c21 30%,#2a2a30 70%,#55555e);box-shadow:inset 0 0 0 1.5px #6b6b75,inset 0 0 0 5px #121215,0 50px 100px -20px oklch(0 0 0 / .8),0 30px 80px -30px oklch(0.6 0.23 293 / .55);z-index:4}
.iphone::before{content:"";position:absolute;left:-3px;top:150px;width:3px;height:60px;border-radius:2px 0 0 2px;background:#3a3a42;box-shadow:0 80px 0 #3a3a42}
.iphone::after{content:"";position:absolute;right:-3px;top:200px;width:3px;height:90px;border-radius:0 2px 2px 0;background:#3a3a42}
.screen{position:relative;width:100%;height:100%;border-radius:46px;overflow:hidden;background:#f8f7f4;font-family:Roboto,"Segoe UI",Arial,sans-serif;color:#202124;isolation:isolate}
.island{position:absolute;top:10px;left:50%;width:96px;height:28px;margin-left:-48px;background:#000;border-radius:20px;z-index:30}
.sbar{position:absolute;top:0;left:0;right:0;height:48px;display:flex;justify-content:space-between;align-items:center;padding:6px 28px 0 34px;font:600 14px/1 -apple-system,"SF Pro Text","Segoe UI",sans-serif;color:#000;z-index:25}
.sbar .ic{display:flex;gap:5px;align-items:center}
.map{position:absolute;inset:0 0 auto 0;height:360px}
.map svg{width:100%;height:100%;display:block}
.msearch{position:absolute;top:54px;left:12px;right:12px;height:46px;background:#fff;border-radius:24px;box-shadow:0 1px 3px rgba(60,64,67,.3),0 4px 8px 3px rgba(60,64,67,.15);display:flex;align-items:center;gap:10px;padding:0 10px 0 14px;z-index:10;font-size:14px;color:#202124}
.msearch .q{flex:1;white-space:nowrap;overflow:hidden}
.msearch .q::after{content:"";display:inline-block;width:1.5px;height:16px;background:#1a73e8;vertical-align:-3px;margin-left:1px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.mav{width:28px;height:28px;border-radius:50%;background:#7b1fa2;color:#fff;font:600 12px/28px Roboto,sans-serif;text-align:center;flex:none}
.mchips{position:absolute;top:108px;left:12px;right:0;display:flex;gap:6px;z-index:10;overflow:hidden}
.mchips span{flex:none;background:#fff;border-radius:16px;padding:6px 12px;font-size:12px;color:#3c4043;box-shadow:0 1px 2px rgba(60,64,67,.3)}
.gpin{position:absolute;z-index:5;width:26px;height:36px;transform:translate(-50%,-100%)}
.gpin.you{z-index:7}
.gpin .lbl{position:absolute;left:26px;top:5px;white-space:nowrap;font-size:11px;font-weight:500;color:#c5221f;text-shadow:0 0 2px #fff,0 0 2px #fff,0 0 3px #fff}
.gpin.you .lbl{color:#7b1fa2;font-weight:700}
.sheet{position:absolute;left:0;right:0;top:318px;bottom:0;background:#fff;border-radius:22px 22px 0 0;box-shadow:0 -2px 10px rgba(60,64,67,.18);z-index:12;overflow:hidden}
.sheet .hdl{width:36px;height:4px;border-radius:2px;background:#dadce0;margin:8px auto 6px}
.sheet .hd{display:flex;justify-content:space-between;align-items:center;padding:0 16px 6px;font-size:12px;color:#5f6368}
.sheet .hd b{font-size:16px;color:#202124;font-weight:500}
.mlist{position:relative;height:300px}
.mrow{position:absolute;left:0;right:0;top:0;height:100px;padding:10px 14px 10px 16px;border-top:1px solid #ecedef;display:flex;gap:10px;background:#fff;will-change:transform}
.mrow .tx{flex:1;min-width:0}
.mrow h6{margin:0;font:500 15px/1.25 Roboto,"Segoe UI",Arial,sans-serif;color:#202124;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow .rt{font-size:12.5px;color:#5f6368;margin-top:2px}
.mrow .rt i{font-style:normal;color:#fbbc04;letter-spacing:-1px}
.mrow .op{font-size:12.5px;color:#5f6368;margin-top:1px;white-space:nowrap}
.mrow .op em{font-style:normal;color:#188038}
.mrow .bt{display:flex;gap:6px;margin-top:7px}
.mrow .bt span{font-size:11.5px;padding:5px 10px;border-radius:14px;border:1px solid #dadce0;color:#0b57d0;font-weight:500;white-space:nowrap}
.mrow .bt span.p{background:#0b57d0;color:#fff;border-color:#0b57d0}
.mrow .th{width:60px;height:60px;border-radius:10px;flex:none;overflow:hidden;align-self:center}
.mrow .th svg{width:100%;height:100%;display:block}
.mrow.you{background:#fbf7ff}
.mrow.you::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:#7b1fa2}
.mrow.you h6{color:#6a1b9a;font-weight:700}
.badge1{display:inline-block;font-size:10px;font-weight:700;color:#fff;background:#7b1fa2;border-radius:4px;padding:1px 5px;margin-left:5px;vertical-align:2px}
.homebar{position:absolute;bottom:8px;left:50%;width:120px;height:5px;margin-left:-60px;border-radius:3px;background:#111;z-index:30}
/* iOS notifications */
.notifs{position:absolute;top:50px;left:9px;right:9px;z-index:20;display:grid;gap:7px}
.nt{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:20px;background:rgba(246,246,248,.84);backdrop-filter:blur(24px) saturate(1.8);-webkit-backdrop-filter:blur(24px) saturate(1.8);box-shadow:0 8px 24px rgba(0,0,0,.2);font:13px/1.3 -apple-system,"SF Pro Text","Segoe UI",sans-serif;color:#111;opacity:0;transform:translateY(-24px) scale(.96)}
.nt .ap{width:36px;height:36px;border-radius:9px;flex:none;display:grid;place-items:center}
.nt .bd{flex:1;min-width:0}
.nt .t{display:flex;justify-content:space-between;font-weight:600;font-size:13px}
.nt .t span{font-weight:400;color:#6e6e73;font-size:12px}
.nt p{margin:1px 0 0;color:#1d1d1f;font-size:13px}
.no-motion .nt{opacity:1;transform:none}

/* ---------- realistic Search Console card ---------- */
.gsc{position:absolute;left:-6%;bottom:-24px;width:360px;z-index:5;background:#fff;border-radius:14px;box-shadow:0 40px 80px -20px oklch(0 0 0 / .75),0 0 0 1px oklch(1 0 0 / .1);font-family:Roboto,"Segoe UI",Arial,sans-serif;color:#202124;overflow:hidden;transform:rotate(-3deg)}
.gsc-top{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid #e8eaed;font-size:13px;color:#3c4043}
.gsc-top span:last-child{margin-left:auto;font-size:11px;color:#5f6368}
.gsc-tiles{display:grid;grid-template-columns:1fr 1fr .85fr .85fr;margin:10px 12px 0}
.gsc-tiles div{padding:9px 10px;font-size:10.5px;line-height:1.3}
.gsc-tiles b{display:block;font:400 20px/1.2 Roboto,"Segoe UI",Arial,sans-serif;margin-top:3px;letter-spacing:0}
.gsc-tiles .c{background:#4285f4;color:#fff;border-radius:6px 0 0 6px}
.gsc-tiles .i{background:#5e35b1;color:#fff}
.gsc-tiles .x{border:1px solid #e8eaed;color:#5f6368}
.gsc .gchart{display:block;width:100%;height:130px;padding:6px 8px 0}
.gsc .ax{display:flex;justify-content:space-between;font-size:9.5px;color:#80868b;padding:0 14px 10px}

/* ---------- marquee rows ---------- */
.marq{padding:2.2rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:oklch(0.12 0.02 285);overflow:hidden;display:grid;gap:1rem}
.mq{display:flex;gap:1rem;width:max-content;animation:mqa 50s linear infinite}
.mq.rev{animation-direction:reverse;animation-duration:62s}
.marq:hover .mq{animation-play-state:paused}
@keyframes mqa{to{transform:translateX(-50%)}}
.mq span{display:inline-flex;align-items:center;gap:.7rem;padding:.7rem 1.2rem;border-radius:999px;border:1px solid var(--line);background:oklch(1 0 0 / .03);white-space:nowrap;font-size:.92rem;color:var(--ink-2)}
.mq span b{font-family:var(--display);color:var(--up);font-weight:600;font-size:1.05rem}
.mq span i{font-style:normal;color:var(--brand-2)}

/* ---------- leak (sticky pain) ---------- */
.leak{display:grid;grid-template-columns:.85fr 1.15fr;gap:5rem;align-items:start}
.leak-l{position:sticky;top:130px}
.leak-l .big{font-family:var(--display);font-size:clamp(3.4rem,7vw,6rem);letter-spacing:-.05em;line-height:.9;color:var(--loss);margin:1.8rem 0 .7rem;font-weight:600;font-variant-numeric:tabular-nums}
.leak-l small{color:var(--mute);font-size:.9rem;display:block;max-width:24rem;font-family:var(--mono)}
.leak-r{display:grid;gap:1rem}
.lk{position:relative;padding:1.9rem 2rem;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);overflow:hidden}
.lk .n{font-family:var(--mono);font-size:.76rem;color:var(--brand-2);letter-spacing:.1em}
.lk h3{font-size:1.32rem;margin:.7rem 0 .55rem}
.lk p{color:var(--ink-2);font-size:.98rem}
.lk .cost{margin-top:1rem;display:inline-flex;gap:.5rem;align-items:center;font-size:.84rem;font-weight:500;color:oklch(0.86 0.08 25);background:var(--loss-soft);border:1px solid oklch(0.72 0.18 25 / .22);padding:.4rem .85rem;border-radius:999px}

/* spotlight cards (cursor-follow glow) */
.spot{position:relative;isolation:isolate}
.spot::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),oklch(0.72 0.17 295 / .13),transparent 45%);opacity:0;transition:opacity .4s}
.spot::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),oklch(0.78 0.16 295 / .8),transparent 50%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s;pointer-events:none;z-index:2}
.spot:hover::before,.spot:hover::after{opacity:1}

/* ---------- climb (pinned story) ---------- */
.climb{position:relative;padding:80px 0;background:oklch(0.11 0.02 285);overflow:hidden}
.climb-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:3rem;align-items:center}
.browser{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 50px 100px -30px oklch(0 0 0 / .8),0 0 0 1px oklch(1 0 0 / .1);font-family:Arial,"Segoe UI",sans-serif;color:#202124}
.bchrome{background:#dee1e6;padding:9px 12px 0;display:flex;align-items:flex-end;gap:12px}
.bchrome .dots{display:flex;gap:7px;padding-bottom:11px}
.bchrome .dots i{width:11px;height:11px;border-radius:50%}
.btab{background:#fff;border-radius:9px 9px 0 0;padding:8px 14px;font-size:12px;color:#3c4043;display:flex;align-items:center;gap:8px;width:240px;white-space:nowrap;overflow:hidden}
.baddr{background:#fff;padding:7px 12px;border-bottom:1px solid #dadce0}
.baddr div{background:#f1f3f4;border-radius:16px;padding:6px 14px;font-size:12.5px;color:#3c4043;white-space:nowrap;overflow:hidden}
.serp-h{display:flex;align-items:center;gap:26px;padding:16px 26px 0}
.glogo{font:400 26px/1 Arial,sans-serif;letter-spacing:-1px;flex:none}
.glogo .b{color:#4285f4}.glogo .r{color:#ea4335}.glogo .y{color:#fbbc05}.glogo .g{color:#34a853}
.sbox{flex:1;max-width:520px;border-radius:24px;box-shadow:0 1px 6px rgba(32,33,36,.28);padding:10px 18px;font-size:14px;display:flex;justify-content:space-between;align-items:center;white-space:nowrap;overflow:hidden}
.stabs{display:flex;gap:22px;padding:14px 26px 0 128px;font-size:13px;color:#5f6368;border-bottom:1px solid #ebebeb}
.stabs b{color:#1a0dab;font-weight:400;border-bottom:3px solid #1a0dab;padding-bottom:9px}
.stabs span{padding-bottom:12px}
.sres-wrap{margin-left:128px;margin-right:26px}
.sres-wrap .meta{font-size:12.5px;color:#70757a;padding:10px 0 2px}
.sres{position:relative;height:376px;overflow:hidden}
.srow{position:absolute;left:0;right:0;top:0;height:94px;padding:8px 0;background:#fff;will-change:transform}
.srow .site{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.25}
.srow .fav{width:26px;height:26px;border-radius:50%;background:#f1f3f4;border:1px solid #ecedef;display:grid;place-items:center;font-size:11px;font-weight:700;color:#5f6368;flex:none}
.srow .site small{display:block;font-size:11.5px;color:#4d5156}
.srow h6{margin:5px 0 3px;font:400 19px/1.25 Arial,sans-serif;color:#1a0dab;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow p{font-size:13px;color:#4d5156;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow.you{z-index:2}
.srow.you::before{content:"";position:absolute;left:-14px;top:6px;bottom:6px;width:3px;border-radius:3px;background:#7b1fa2}
.srow.you h6{color:#6a1b9a}
.srow.you .fav{background:#7b1fa2;color:#fff;border-color:#7b1fa2}
.climb-side h2{margin:1rem 0 1rem}
.cstat{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.6rem 0}
.cstat div{padding:1.2rem 1.3rem;border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.cstat span{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.cstat b{display:block;font-family:var(--display);font-size:2.4rem;letter-spacing:-.04em;line-height:1.05;margin-top:.4rem;font-variant-numeric:tabular-nums}
.cstat .pos b{color:var(--brand-2)}
.cstat .call b{color:var(--up)}
.phases{display:grid;gap:.3rem}
.phases div{display:flex;gap:.9rem;align-items:center;padding:.65rem .9rem;border-radius:12px;color:var(--mute);font-size:.94rem;transition:background .4s,color .4s}
.phases div i{font-style:normal;font-family:var(--mono);font-size:.7rem;width:64px;flex:none;letter-spacing:.06em}
.phases div.on{background:oklch(1 0 0 / .06);color:var(--ink)}
.phases div.on i{color:var(--brand-2)}
.climb-note{font-size:.74rem;color:var(--mute);margin-top:1rem;font-family:var(--mono)}

/* ---------- horizontal case gallery ---------- */
.hgal{position:relative;overflow:hidden;padding:80px 0 90px}
.hgal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:3rem;flex-wrap:wrap}
.hgal-head .sec-head{margin-bottom:0}
.htrack{display:flex;gap:24px;padding:0 max(20px,calc((100vw - 1160px) / 2));width:max-content;will-change:transform}
.hcard{width:540px;flex:none;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--line);overflow:hidden;cursor:zoom-in}
.bframe{background:oklch(0.24 0.02 285);padding:10px 12px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line)}
.bframe i{width:10px;height:10px;border-radius:50%;background:oklch(1 0 0 / .18)}
.bframe span{margin-left:10px;flex:1;background:oklch(1 0 0 / .06);border-radius:8px;padding:4px 10px;font-family:var(--mono);font-size:.7rem;color:var(--mute);white-space:nowrap;overflow:hidden}
.hshot{height:230px;background:#fff;overflow:hidden}
.hshot img{width:100%;height:100%;object-fit:cover;object-position:left top;transition:transform 1.2s var(--ease)}
.hcard:hover .hshot img{transform:scale(1.04)}
.hbody{padding:1.6rem 1.8rem 1.8rem}
.hbody .m{font-family:var(--display);font-size:2.8rem;font-weight:600;letter-spacing:-.05em;color:var(--up);line-height:1}
.hbody .m small{font-size:1rem;color:var(--mute);letter-spacing:0;font-weight:400;margin-left:.4rem}
.hbody .tg{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-top:.8rem}
.hbody h3{font-size:1.2rem;margin-top:.4rem}
.hcard.end{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:3rem;background:var(--brand);border-color:transparent;cursor:default}
.hcard.end h3{font-size:2.2rem;color:#fff;margin-bottom:1rem}
.hcard.end p{color:oklch(0.92 0.04 293);margin-bottom:1.8rem}

/* process line */
.pline{height:2px;background:var(--line);border-radius:2px;margin-bottom:1.6rem;overflow:hidden}
.pline i{display:block;height:100%;background:var(--brand-2);transform-origin:0 50%;transform:scaleX(1)}
.js .pline i{transform:scaleX(0)}

/* glowing hot price card */
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
.price.hot{background:transparent;border:0;isolation:isolate}
.price.hot::before{content:"";position:absolute;inset:-1.5px;border-radius:inherit;z-index:-2;background:conic-gradient(from var(--ang),oklch(1 0 0 / .1) 0 55%,oklch(0.75 0.17 295) 72%,oklch(0.84 0.15 80) 82%,oklch(1 0 0 / .1) 95%);animation:spin 5s linear infinite}
.price.hot::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;background:radial-gradient(120% 60% at 50% 0%,oklch(0.3 0.08 293),oklch(0.15 0.03 290) 70%)}
@keyframes spin{to{--ang:360deg}}

/* founder phone */
.vphone{position:relative;width:300px;height:620px;margin:0 auto;border-radius:54px;padding:11px;background:linear-gradient(145deg,#4a4a52,#1c1c21 30%,#2a2a30 70%,#55555e);box-shadow:inset 0 0 0 1.5px #6b6b75,inset 0 0 0 5px #121215,0 50px 100px -20px oklch(0 0 0 / .8),0 30px 80px -30px oklch(0.6 0.23 293 / .5)}
.vphone .screen{background:#000}
.vphone video{width:100%;height:100%;object-fit:cover}
.vphone .vid-cap{position:absolute;bottom:26px;left:14px;right:14px;z-index:5}
.vphone.playing .vid-cap{opacity:0}

/* big footer wordmark */
.wordmark{font-family:var(--display);font-weight:700;font-size:clamp(4rem,17vw,15rem);letter-spacing:-.06em;line-height:.85;text-align:center;color:transparent;-webkit-text-stroke:1px oklch(1 0 0 / .16);margin:3.5rem 0 0;user-select:none;white-space:nowrap;overflow:hidden}

/* responsive ULTRA */
@media (max-width:1080px){
  .uhero-grid{grid-template-columns:1fr;gap:56px}
  .stage{max-width:620px;width:100%;margin:0 auto}
  .climb-grid{grid-template-columns:1fr}
  .leak{grid-template-columns:1fr;gap:2.4rem}
  .leak-l{position:static}
  .htrack{overflow-x:auto;scroll-snap-type:x mandatory;width:auto;scrollbar-width:none}
  .hcard{scroll-snap-align:center}
}
@media (max-width:640px){
  .uhero{padding:40px 0 80px}
  .stage{height:650px}
  .iphone{transform:scale(.86);transform-origin:top center;margin-left:-160px}
  .gsc{width:300px;left:0;bottom:0;transform:rotate(-3deg) scale(.82);transform-origin:left bottom}
  .gsc-tiles b{font-size:16px}
  .chip.c1{left:0;top:3%}
  .chip.c2{right:0;top:40%}
  .kpis{grid-template-columns:repeat(3,1fr);gap:1rem}
  .kpis b{font-size:1.5rem}
  .serp-h{padding:14px 16px 0;gap:12px}
  .glogo{font-size:20px}
  .btab{width:150px}
  .stabs{padding-left:16px;gap:16px}
  .sres-wrap{margin-left:16px;margin-right:16px}
  .srow h6{font-size:16px}
  .hcard{width:84vw}
  .hshot{height:190px}
  .vphone{width:260px;height:540px}
  .lk{padding:1.5rem}
  .cstat b{font-size:1.9rem}
}
@media (prefers-reduced-motion:reduce){.grain{display:none}.nt{opacity:1;transform:none}.js .pline i{transform:none}}

.cmp-col.good,.svc.dark{background:radial-gradient(120% 90% at 100% 0%,oklch(0.3 0.1 293),oklch(0.17 0.03 290) 62%);border:1px solid oklch(0.6 0.23 293 / .35)}
.cmp-col.good::after{display:none}
.step.free{background:radial-gradient(120% 90% at 100% 0%,oklch(0.62 0.22 293),oklch(0.45 0.2 290))}
.cc{color:var(--ink);font:inherit}
.cc h3{color:var(--ink)}
@media (max-width:640px){.chip.c1{display:none}.chip.c2{top:52%}}

/* ===== performance pass: cheap GPU work ===== */
.grain{animation:none;inset:0;opacity:.04}
.aurora{filter:none;opacity:.7}
.aurora i:nth-child(1){background:radial-gradient(circle,oklch(0.55 0.25 293 / .55),transparent 65%)}
.aurora i:nth-child(2){background:radial-gradient(circle,oklch(0.5 0.2 265 / .4),transparent 65%)}
.aurora i:nth-child(3){background:radial-gradient(circle,oklch(0.62 0.17 330 / .3),transparent 65%)}
.aurora i{will-change:transform}
.chip,.pchip,.cs-label,.vphone .vid-cap{backdrop-filter:none;-webkit-backdrop-filter:none}
.chip,.pchip{background:oklch(0.22 0.03 285 / .95)}
/* pause decorative loops when not needed */
@media (hover:none),(max-width:900px){.aurora i{animation:none}.price.hot::before,.offer.hot::before{animation-duration:9s}}