/* Marketing home, ported from website/design/home-v3 (design system v2). Standalone: the home page does not load product.css. */

/* Layout: one pinned scene from the top. Hero copy, CTA and the laptop share the first screen; scrolling drives every step (and reverses it). Single light look by choice. */
:root{
  --ivory:#f7f6f2; --white:#ffffff; --ink:#111111; --ink-2:#55534d; --ink-3:#6b685f; --line:#e4e1d8;
  --coral:#e8432a; --coral-btn:#d43a22; --peach:#ffd9cf; --dot:rgba(232,67,42,0.5);
  --serif:"Outfit",system-ui,sans-serif; --sans:"Plus Jakarta Sans",system-ui,sans-serif; --book:"EB Garamond",Georgia,serif; --mono:"Geist Mono",ui-monospace,Menlo,monospace; --hand:"Caveat",cursive;
  --ease:cubic-bezier(.22,1,.36,1);
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ivory);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

header{position:absolute;left:0;right:0;top:0;z-index:20}
.nav{height:76px;display:flex;align-items:center;gap:28px}
.logo{display:flex;align-items:center;gap:9px;font:600 23px var(--serif);text-decoration:none}
.nav .sp{flex:1}
.nav a.lk{font-size:14.5px;color:var(--ink-2);text-decoration:none}
.nav a.lk:hover{color:var(--ink)}
.nav .login{font-size:14.5px;text-decoration:none;border:1px solid rgba(0,0,0,.15);border-radius:999px;padding:8px 16px;background:rgba(255,255,255,.6)}
@media(max-width:760px){.nav a.lk{display:none}.nav a.lk.keep{display:inline;font-size:14px;margin-right:4px}.nav{gap:14px}.nav .login{white-space:nowrap;flex:none;padding:7px 13px}}

.stage{position:relative;height:calc(1130*var(--vh,1vh))}
.pin{position:sticky;top:0;height:calc(100*var(--vh,1vh));overflow:hidden}
.bg{position:absolute;inset:0;pointer-events:none}
.bg .tone{position:absolute;inset:0;background-image:radial-gradient(circle,var(--dot) 1.4px,transparent 1.9px);background-size:12px 12px;
  -webkit-mask-image:radial-gradient(ellipse 34% 46% at 4% 70%,#000,transparent 70%),radial-gradient(ellipse 32% 40% at 97% 16%,#000,transparent 70%);
          mask-image:radial-gradient(ellipse 34% 46% at 4% 70%,#000,transparent 70%),radial-gradient(ellipse 32% 40% at 97% 16%,#000,transparent 70%)}
.bg .grid{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(17,17,17,.13) 1px,transparent 1.4px);background-size:12px 12px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 45%);mask-image:linear-gradient(180deg,#000,transparent 45%)}
.bg .glow{position:absolute;left:50%;top:58%;width:1300px;height:760px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(255,196,180,.75),rgba(255,217,207,.35) 55%,transparent 100%);opacity:0;will-change:opacity}
.bg .lines{position:absolute;inset:0;opacity:0;background-image:repeating-linear-gradient(115deg,rgba(17,17,17,.035) 0 1px,transparent 1px 22px);will-change:opacity}

.hero{position:absolute;left:0;right:0;top:118px;text-align:center;z-index:6;will-change:transform,opacity}
h1{margin:0;font:600 clamp(48px,calc(6.6*var(--vw,1vw)),90px)/.98 var(--serif);letter-spacing:-.035em;text-wrap:balance}
h1 em{color:var(--coral)}
.lead{margin:22px auto 0;font-size:18.5px;line-height:1.55;color:var(--ink-2);max-width:560px}
.check{margin:28px auto 0;display:flex;align-items:center;gap:8px;width:min(540px,calc(92*var(--vw,1vw)));height:62px;padding:6px 6px 6px 22px;border-radius:999px;background:var(--white);box-shadow:0 0 0 1px rgba(0,0,0,.08),0 12px 30px -14px rgba(0,0,0,.2)}
.check input{flex:1;min-width:0;border:0;background:transparent;font:16px var(--mono);color:var(--ink);outline:none}
.check input::placeholder{color:#9a978d}
.check:focus-within{box-shadow:0 0 0 2px var(--ink),0 12px 30px -14px rgba(0,0,0,.2)}
.check button{height:50px;padding:0 24px;border:0;border-radius:999px;background:var(--coral-btn);color:#fff;font:600 15.5px var(--sans);cursor:pointer;box-shadow:inset 0 1px rgba(255,255,255,.25),inset 0 -2px 2px rgba(0,0,0,.18);transition:transform .15s var(--ease)}
.check button:active{transform:scale(.97)}
.fine{margin-top:12px;font-size:13.5px;color:var(--ink-3)}
.msg{min-height:18px;margin-top:4px;font:13px var(--mono);color:var(--coral-btn)}

.cap{position:absolute;left:0;right:0;top:calc(11*var(--vh,1vh));text-align:center;opacity:0;z-index:6;will-change:opacity,transform}
.cap h2{margin:0;font:600 clamp(30px,calc(3.5*var(--vw,1vw)),46px)/1.08 var(--serif);letter-spacing:-.02em}
.cap h2 em{color:var(--coral)}
.cap p{margin:10px 0 0;font-size:15.5px;color:var(--ink-2)}

.scene{position:absolute;left:50%;top:50%;width:1040px;height:624px;margin:-312px 0 0 -520px;z-index:4;will-change:transform}
.lid{padding:12px;border-radius:24px;background:#1b1b1d;box-shadow:0 50px 90px -40px rgba(60,40,20,.5)}
.screen{position:relative;height:600px;border-radius:13px;overflow:hidden;background:linear-gradient(180deg,#ebe6de,#dad3c7)}
.menubar{height:24px;display:flex;align-items:center;gap:16px;padding:0 14px;font:500 12px -apple-system,var(--sans);color:#1d1d1f;background:rgba(255,255,255,.55)}
.win{position:absolute;left:40px;right:40px;top:40px;bottom:0;border-radius:12px 12px 0 0;background:#fff;box-shadow:0 20px 50px -20px rgba(0,0,0,.35),0 0 0 .5px rgba(0,0,0,.25);display:flex;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",var(--sans)}
.side{width:210px;background:#f9f9f9;border-right:.5px solid #e5e5e5;padding:12px 10px;display:flex;flex-direction:column;gap:3px;font-size:13px;color:#0d0d0d}
.lights{display:flex;gap:7px;padding:2px 4px 12px}.lights i{width:11px;height:11px;border-radius:50%}
.side .it{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px}
.side .h{padding:14px 8px 4px;font-size:12px;color:#8f8f8f}
.side .ch{padding:6px 8px;border-radius:8px}
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.top{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 16px}
.top b{font-size:16px;font-weight:500}
.thread{flex:1;padding:6px 56px 0;display:flex;flex-direction:column;gap:14px;overflow:hidden;position:relative}
.empty{position:absolute;left:0;right:0;top:38%;text-align:center;font-size:25px;color:#0d0d0d}
.ask{align-self:flex-end;transform-origin:100% 100%;will-change:transform;max-width:72%;background:#f4f4f4;border-radius:20px;padding:10px 17px;font-size:15px}
.searched{font-size:13px;color:#8e8e93;display:flex;align-items:center;gap:6px}
.ans{font-size:15.5px;line-height:1.75;color:#0d0d0d;white-space:pre-line;min-height:150px}
.ans .r{font-weight:600}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips span{font-size:12px;color:#5d5d5d;background:#f4f4f4;border-radius:999px;padding:3px 10px}
.hide{opacity:0}
.fade{transition:none}
.composer{margin:12px 56px 20px;border-radius:26px;background:#fff;box-shadow:0 0 0 .5px #d9d9d9,0 6px 20px -8px rgba(0,0,0,.15);padding:13px 16px 10px;display:flex;flex-direction:column;gap:12px}
.composer .tx{font-size:15px;color:#0d0d0d;min-height:22px}
.composer .tx.ph{color:#9b9ba0}
.caret{display:inline-block;width:2px;height:17px;background:#0d0d0d;vertical-align:-3px;margin-left:1px}
.tools{display:flex;align-items:center;gap:10px;color:#5d5d5d;font-size:13px}
.tools .pill{border:.5px solid #d9d9d9;border-radius:999px;padding:3px 10px}
.send{width:32px;height:32px;border-radius:50%;background:#0d0d0d;color:#fff;display:flex;align-items:center;justify-content:center;margin-left:auto}

.marks{position:absolute;inset:0;pointer-events:none;overflow:visible}
.marks ellipse{fill:none;stroke:var(--coral);stroke-width:2.6;stroke-linecap:round}
.note{position:absolute;font:700 25px/1 var(--hand);color:var(--coral);opacity:0;transform:rotate(-4deg);white-space:nowrap;transition:opacity .3s}
.cursor{position:absolute;left:0;top:0;display:flex;align-items:flex-start;opacity:0;z-index:5;will-change:transform;transition:opacity .25s}
.cursor .tag{margin-top:14px;font:600 12px var(--sans);color:#fff;background:#1b1b1d;border-radius:4px 10px 10px 10px;padding:4px 8px}

.rays{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:3;pointer-events:none}
.rays .band{fill:none;stroke:#111;stroke-linecap:round}
.rays .inTxt{fill:#f7f6f2;font:500 16px var(--sans);letter-spacing:.01em}
.rays .outTxt{font-family:var(--mono);font-weight:500}
.count{position:absolute;left:0;right:0;bottom:calc(6*var(--vh,1vh));text-align:center;font:14px var(--mono);color:var(--ink-2);opacity:0;z-index:6}
.count .z{color:var(--coral)}

/* Phase 2: frames 4 to 6, each a pinned scene driven by its own scroll progress */
.st{position:relative}
.st4{height:calc(420*var(--vh,1vh))}.st5{height:calc(400*var(--vh,1vh))}.st6{height:calc(400*var(--vh,1vh))}
.st .cap{top:calc(9*var(--vh,1vh))}
.board{position:absolute;left:50%;top:50%;width:1200px;height:600px;margin:-300px 0 0 -600px;transform-origin:50% 50%;z-index:4}
.ov{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:5}
.ov ellipse{fill:none;stroke:var(--coral);stroke-width:2.6;stroke-linecap:round}
.w{opacity:0}.w.on{opacity:1}
.hn{position:absolute;font:700 27px/1 var(--hand);color:var(--coral);white-space:nowrap;transform:rotate(-4deg);opacity:0;z-index:6}
.score{position:absolute;left:0;right:0;bottom:-34px;text-align:center;font:14px var(--mono);color:var(--ink-2);opacity:0}
.score b{color:var(--ink)}.score .z{color:var(--coral)}
.st .cursor{transition:none}

/* frame 4: four engines, as their iPhone apps (looked up from the App Store screenshots, Oct 2026) */
.eng{position:absolute;left:0;top:18px;width:262px;height:560px;will-change:transform,opacity}
.iph{padding:7px;border-radius:46px;background:#1b1b1d;box-shadow:0 0 0 1.5px #3a3a3d inset,0 40px 70px -36px rgba(60,40,20,.55)}
.iph .scr{position:relative;height:100%;border-radius:39px;overflow:hidden;display:flex;flex-direction:column;font:11.5px/1.55 -apple-system,BlinkMacSystemFont,"SF Pro Text",var(--sans);color:#0d0d0d;background:#fff}
.sbar{height:40px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:3px 18px 0 24px;font:600 11.5px -apple-system,var(--sans)}
.sic svg{transform:scale(.82)}.sic{gap:2px}
.sbar .isl{position:absolute;left:50%;top:10px;width:66px;height:20px;margin-left:-33px;border-radius:12px;background:#000}
.sic{display:flex;align-items:center;gap:5px}.sic svg{fill:currentColor}
.bat{width:19px;height:9px;border:1.2px solid currentColor;border-radius:3px;opacity:.9;padding:1px;display:flex}.bat i{flex:1;background:currentColor;border-radius:1.5px}
.hd{height:42px;flex:none;display:flex;align-items:center;gap:8px;padding:0 12px}
.hd .sp{flex:1}
.cb{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.85);box-shadow:0 1px 6px rgba(0,0,0,.08),0 0 0 .5px rgba(0,0,0,.08)}
.pill{height:32px;padding:0 11px;border-radius:16px;display:flex;align-items:center;gap:13px;background:rgba(255,255,255,.85);box-shadow:0 1px 6px rgba(0,0,0,.08),0 0 0 .5px rgba(0,0,0,.08)}
.iph .body{flex:1;padding:8px 14px;display:flex;flex-direction:column;gap:11px;position:relative;min-height:0}
.iph .q{align-self:flex-end;max-width:82%;padding:7px 12px;border-radius:17px}
.iph .a{white-space:pre-line}
.iph .a b{font-weight:600}
.acts{display:flex;gap:11px}.acts svg{width:12px;height:12px;fill:none;stroke:#8e8e93;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cmp{flex:none;margin:0 10px 22px;height:40px;border-radius:20px;display:flex;align-items:center;gap:8px;padding:0 5px 0 12px;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.08),0 0 0 .5px rgba(0,0,0,.1)}
.cmp .pl{flex:1;color:#9b9ba0;font-size:12px}
.cmp .ic{display:flex;color:#5d5d5d}
.cmp .go{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.home{position:absolute;left:50%;bottom:7px;width:96px;height:4px;margin-left:-48px;border-radius:3px;background:#111}
.e-gpt .q{background:#eaf2fe;color:#2462c9}
.e-claude .scr{background:#f8f7f2}
.e-claude .cb,.e-claude .pill{background:rgba(255,255,255,.7)}
.e-claude .dk{width:20px;height:20px;border-radius:50%;background:#1f1e1b;color:#fff;display:flex;align-items:center;justify-content:center}
.e-claude .dk svg{width:11px;height:11px}
.e-claude .q{background:#ebe7dd;color:#29261b}
.e-claude .a{font:12.5px/1.6 Georgia,"Times New Roman",serif;color:#29261b}
.e-claude .cc{height:auto;flex-direction:column;align-items:stretch;gap:8px;padding:10px 8px 7px 12px;border-radius:20px}
.e-claude .cc .row{display:flex;align-items:center;gap:7px}.e-claude .cc .sp{flex:1}
.e-claude .ring{width:24px;height:24px;border-radius:50%;box-shadow:0 0 0 .5px #cfcbbf;align-items:center;justify-content:center}
.e-claude .mdl{font-size:10.5px;padding:3px 9px;border-radius:10px;box-shadow:0 0 0 .5px #cfcbbf;color:#3d3a32}
.e-claude .go{width:26px;height:26px}
.e-gem .scr{background:#0e0e10;color:#e8e8ea}
.e-gem .home{background:#e8e8ea}
.e-gem .cb,.e-gem .pill{background:#232326;box-shadow:0 0 0 .5px rgba(255,255,255,.1);color:#e8e8ea}
.e-gem .ttl{font-size:13px;font-weight:500}.e-gem .ttl em{font-style:normal;color:#9aa0a6}.e-gem .ttl small{color:#9aa0a6}
.e-gem .q{background:#26272b;color:#e8e8ea;border-radius:18px}
.e-gem .cmp{background:#1c1c1f;box-shadow:0 0 0 .5px rgba(255,255,255,.12)}
.e-gem .cmp .ic{color:#c4c7c5}.e-gem .cmp .pl{color:#8e918f}
.e-px .scr{background:#f6f5f1}
.e-px .cb{background:#fff}
.e-px .seg{height:30px;border-radius:15px;background:#fff;box-shadow:0 1px 6px rgba(0,0,0,.08),0 0 0 .5px rgba(0,0,0,.08);display:flex;align-items:center;padding:3px;gap:2px}
.e-px .seg span{width:30px;height:24px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#5f6368}
.e-px .seg .on{background:#e7ebea;color:#1f6f78}
.e-px .q{background:#e9e8e3;color:#202020}
.e-px .a{color:#202020}
.e-px .a b{color:#1f6f78}
.e-px .a .ref{display:inline-block;font-size:8.5px;line-height:13px;padding:0 4px;border-radius:5px;background:#e7e6e0;color:#5f6368;vertical-align:1px}
.srcs{display:flex;align-items:center;gap:0}.srcs i{width:14px;height:14px;border-radius:50%;margin-right:-4px;box-shadow:0 0 0 1.5px #f6f5f1}.srcs span{margin-left:10px;font-size:10.5px;color:#5f6368}
.e-px .pxc{margin-right:58px}
.e-px .nw{position:absolute;right:12px;bottom:22px;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.08),0 0 0 .5px rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center}
.stamp{position:absolute;left:14px;bottom:8px;font:700 22px/1 var(--hand);color:var(--coral);border:2px solid var(--coral);border-radius:10px;padding:5px 10px 3px;background:rgba(255,255,255,.92);opacity:0;transform-origin:30% 50%;z-index:3}

/* frame 5: the sources AI read */
.chipG{position:absolute;left:450px;top:6px;width:300px;height:42px;border-radius:999px;background:#1b1b1d;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px;font:500 13.5px var(--sans);z-index:4}
.chipG svg{flex:none}
.sc{position:absolute;width:330px;border-radius:14px;background:#fff;padding:16px 18px;font:13px/1.5 var(--sans);color:#1a1a1b;box-shadow:0 30px 60px -32px rgba(60,40,20,.45),0 0 0 1px rgba(0,0,0,.07);will-change:transform,opacity;z-index:3}
.sc .ov{z-index:2}
.sc .who{display:flex;align-items:center;gap:8px;font-size:11.5px;color:#576f76}
.sc .rv{font-weight:600;white-space:nowrap}
.rd .dot{width:20px;height:20px;border-radius:50%;background:#ff4500;color:#fff;font:700 11px/20px var(--sans);text-align:center}
.rd h4{margin:9px 0 8px;font-size:15.5px;line-height:1.3}
.rd .cm{border-left:2px solid #edeff1;padding-left:11px}
.rd .vt{margin-top:10px;font-size:11.5px;color:#576f76;font-weight:600;display:flex;gap:14px}
.tp .brand{display:flex;align-items:center;gap:6px;font-weight:700;font-size:14px;color:#191919}
.tp .brand i{color:#00b67a;font-style:normal;font-size:17px}
.tp .stars{display:flex;gap:3px;margin:10px 0 6px}
.tp .stars i{width:21px;height:21px;background:#00b67a;color:#fff;font:13px/21px var(--sans);text-align:center;font-style:normal}
.tp .meta{font-size:11.5px;color:#6b6b6b}
.tp h5{margin:10px 0 3px;font-size:14px}
.gr .nmx{font-size:16px;color:#202124;font-weight:500;display:flex;align-items:center;gap:8px}
.gr .pinI{width:18px;height:18px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#ea4335;flex:none}
.gr .rate{margin:6px 0 2px;font-size:13px;color:#70757a;display:flex;align-items:center;gap:6px}
.gr .rate b{color:#202124}.gr .rate .s{color:#fbbc04;letter-spacing:1px}
.gr .rev{margin-top:10px;display:flex;gap:9px}
.gr .av{width:26px;height:26px;border-radius:50%;background:#7b5ea7;color:#fff;font:600 12px/26px var(--sans);text-align:center;flex:none}
.ru{font-family:var(--book)}
.ru .kick{font:600 10.5px var(--mono);letter-spacing:.12em;color:#b5121b}
.ru h4{margin:6px 0 8px;font:500 22px/1.12 var(--book)}
.ru ol{margin:0;padding-left:20px;font:14.5px/1.55 var(--book)}
.ru .by{margin-top:8px;font:11px var(--sans);color:#8a867c}
.you{position:absolute;left:465px;top:228px;width:270px;height:150px;border:2px dashed rgba(232,67,42,.65);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;background:rgba(255,255,255,.55);opacity:0;z-index:2}
.you b{font:500 15px var(--mono)}
.you span{font-size:13px;color:var(--ink-2);max-width:200px}
.lines5{position:absolute;left:0;top:0;width:1200px;height:600px;overflow:visible;pointer-events:none;z-index:1}
.lines5 path{fill:none;stroke:rgba(17,17,17,.3);stroke-width:1.4}

/* frame 6: spot the difference */
.shop{position:absolute;left:0;top:90px;width:600px;height:410px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 34px 60px -34px rgba(60,40,20,.5),0 0 0 1px rgba(0,0,0,.08);font:14px/1.5 var(--sans);will-change:transform,opacity}
.urlbar{height:38px;display:flex;align-items:center;gap:7px;padding:0 14px;background:#f1efea;border-bottom:1px solid #e4e1d8}
.urlbar i{width:10px;height:10px;border-radius:50%}
.urlbar span{margin-left:14px;flex:1;height:24px;border-radius:7px;background:#fff;font:12px/24px var(--mono);color:#55534d;padding:0 10px}
.shopIn{display:flex;gap:28px;padding:30px 30px}
.bag{width:190px;height:250px;flex:none;border-radius:10px 10px 16px 16px;background:linear-gradient(160deg,#cfa77b,#b0855a);position:relative;box-shadow:inset 0 -14px 24px rgba(0,0,0,.12)}
.bag:before{content:"";position:absolute;left:0;right:0;top:0;height:26px;border-radius:10px 10px 0 0;background:repeating-linear-gradient(90deg,#a87c52 0 6px,#b98d62 6px 12px)}
.bag .lab{position:absolute;left:22px;right:22px;top:72px;bottom:46px;background:#f7f2e8;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font:500 15px/1.1 var(--book);color:#3b2a1a}
.bag .lab small{font:9px var(--mono);letter-spacing:.14em;margin-top:6px;color:#8a6a4a}
.pinfo{flex:1}
.pinfo .br{font:11px var(--mono);letter-spacing:.12em;color:#8a867c}
.pinfo h4{margin:4px 0 2px;font:500 27px/1.1 var(--book)}
.pinfo .pr{font:600 20px var(--sans);margin:6px 0 14px}
.pinfo .buy{display:inline-block;margin-bottom:18px;padding:9px 18px;border-radius:999px;background:#1b1b1d;color:#fff;font-size:13px}
.fact{display:flex;align-items:center;gap:9px;padding:7px 0;border-top:1px solid #efece4;font-size:13.5px}
.fact i{width:18px;height:18px;border-radius:50%;background:#f1efea;font:11px/18px var(--sans);text-align:center;font-style:normal;color:#55534d;flex:none}
.gpt{position:absolute;left:720px;top:60px;width:480px;border-radius:14px;overflow:hidden;background:#fff;display:flex;flex-direction:column;
  font:14px/1.6 -apple-system,BlinkMacSystemFont,"SF Pro Text",var(--sans);color:#0d0d0d;box-shadow:0 34px 60px -34px rgba(60,40,20,.5),0 0 0 1px rgba(0,0,0,.08);will-change:transform,opacity}
.gpt .body{flex:1;padding:16px 22px 26px;display:flex;flex-direction:column;gap:0}
.gpt .q{margin-bottom:12px}
.gpt .g{min-height:35px;line-height:35px}
.gpt .bar i{width:9px;height:9px;border-radius:50%}
.gpt .q{align-self:flex-end;padding:8px 14px;border-radius:18px;background:#f4f4f4}
.gpt .g{padding:0}
.gpt .g b{font-weight:600}
.lines6{position:absolute;left:0;top:0;width:1200px;height:600px;overflow:visible;pointer-events:none;z-index:6}
.lines6 path{fill:none;stroke-width:2;stroke-linecap:round}
.bd{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;color:#fff;font:700 13px/24px var(--sans);text-align:center;opacity:0;z-index:7}
.bd.no{background:var(--coral)}.bd.ok{background:#2f8f5b}
html.solo .stage,html.solo .st:not(.tgt),html.solo .after,html.solo .sec,html.solo .final,html.solo footer{display:none}html.solo .tgt{height:calc(100*var(--vh,1vh))}
/* frame 7: an AI agent tries to buy (dark band) */
.st7{height:calc(540*var(--vh,1vh))}
.st7 .pin{background:#141413}
.st7 .bg:after{content:"";position:absolute;left:0;right:0;top:0;height:160px;background:linear-gradient(#141413,rgba(20,20,19,0));z-index:1}
.st7 .bg:before{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(0deg,#141413,rgba(20,20,19,0));z-index:1}
.st7 .cap h2{color:#f7f6f2}.st7 .cap p{color:#a8a69e}
.st7 .bg .grid{background-image:radial-gradient(circle,rgba(255,255,255,.09) 1px,transparent 1.4px)}
.st7 .score{color:#a8a69e}.st7 .score b{color:#f7f6f2}
.st7 .cursor.pf .tag{box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.cursor.ag .tag{background:#3a63d8}
.cursor.ag path{fill:#3a63d8}
.store{position:absolute;left:0;top:24px;width:760px;height:540px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 40px 80px -30px rgba(0,0,0,.7);font:14px/1.5 var(--sans);color:#111;will-change:transform,opacity}
.store .urlbar span{transition:none}
.sv{position:absolute;left:0;right:0;top:38px;bottom:0}
.snav{height:58px;display:flex;align-items:center;gap:22px;padding:0 28px;border-bottom:1px solid #efece4}
.snav .lg{font:500 20px var(--book)}
.snav .lk{font-size:13px;color:#55534d}
.snav .sp{flex:1}
.sbox{width:220px;height:34px;border-radius:17px;background:#f3f1ec;display:flex;align-items:center;gap:8px;padding:0 14px;font-size:13px;color:#8a867c}
.sbox .t{color:#111}
.hero7{padding:26px 28px 10px;font:500 30px/1.1 var(--book)}
.grid7{display:flex;gap:20px;padding:10px 28px}
.card7{flex:1;border-radius:12px;background:#f7f5f0;padding:14px;position:relative}
.card7 .bg7{height:200px;border-radius:9px;display:flex;align-items:center;justify-content:center}
.mini{width:96px;height:130px;border-radius:7px 7px 11px 11px;background:linear-gradient(160deg,#cfa77b,#b0855a);position:relative}
.mini:after{content:attr(data-n);position:absolute;left:12px;right:12px;top:40px;bottom:26px;background:#f7f2e8;border-radius:4px;font:500 11px/1.1 var(--book);color:#3b2a1a;display:flex;align-items:center;justify-content:center;text-align:center;white-space:pre-line}
.card7 h5{margin:10px 0 0;font:500 16px var(--book)}.card7 .pp{font-size:13px;color:#55534d}
.pd{display:flex;gap:30px;padding:30px 30px}
.pd .bag{width:230px;height:300px}
.pd .pinfo h4{font-size:30px}
.picker{position:relative;margin:4px 0 16px;width:250px;height:44px;border-radius:10px;border:1.5px solid #d8d4c9;display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:14px;color:#8a867c;background:#fff}
.picker.ok{color:#111;border-color:#2f8f5b}
.picker .chev{font-size:12px}
.plab{font:11px var(--mono);letter-spacing:.1em;color:#8a867c}
.addc{display:inline-block;padding:12px 26px;border-radius:999px;background:#d9d6ce;color:#fff;font-weight:600;font-size:14px}
.addc.on{background:#111}
.pulse{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:2px solid #3a63d8;opacity:0;pointer-events:none;z-index:8}
.alog{position:absolute;left:800px;top:24px;width:400px;height:540px;border-radius:14px;background:#1f1f1e;box-shadow:0 0 0 1px rgba(255,255,255,.08);color:#e9e7e1;font:13px/1.5 var(--mono);padding:20px 22px;will-change:transform,opacity}
.alog .hd7{display:flex;align-items:center;gap:8px;font:600 12px var(--sans);letter-spacing:.06em;color:#a8a69e;text-transform:uppercase}
.alog .hd7 i{width:8px;height:8px;border-radius:50%;background:#3a63d8;box-shadow:0 0 0 4px rgba(58,99,216,.25)}
.alog .task{margin:12px 0 16px;padding:12px 14px;border-radius:10px;background:#2a2a28;font:14px/1.45 var(--sans);color:#f7f6f2}
.alog .task small{display:block;font:11px var(--mono);color:#8f8d86;margin-bottom:3px}
.step{display:flex;gap:10px;padding:8px 0;border-top:1px solid #2e2e2c;opacity:0}
.step .tm{color:#929089;flex:none;width:42px}
.step .ok{color:#5fbf8a}.step .no{color:#ff6a4d}
.step.bad{color:#ffb4a3}
.step.won{color:#9fe0bb}
.fixchip{position:absolute;padding:8px 12px;border-radius:10px;background:#f7f6f2;color:#111;font:12.5px var(--mono);box-shadow:0 14px 30px -12px rgba(0,0,0,.6);opacity:0;z-index:7;white-space:nowrap}
.fixchip small{display:block;font:600 10px var(--sans);letter-spacing:.08em;color:var(--coral);margin-bottom:2px}
.fadeband{height:clamp(160px,calc(28*var(--vh,1vh)),300px);pointer-events:none;background:linear-gradient(180deg,rgb(247,246,242) 0%,rgb(241,240,236) 10%,rgb(223,222,219) 20%,rgb(198,197,194) 30%,rgb(167,166,164) 40%,rgb(134,133,130) 50%,rgb(100,100,97) 60%,rgb(69,69,67) 70%,rgb(44,44,42) 80%,rgb(26,26,25) 90%,rgb(20,20,19) 100%)}
.fadeband.up{background:linear-gradient(0deg,rgb(247,246,242) 0%,rgb(241,240,236) 10%,rgb(223,222,219) 20%,rgb(198,197,194) 30%,rgb(167,166,164) 40%,rgb(134,133,130) 50%,rgb(100,100,97) 60%,rgb(69,69,67) 70%,rgb(44,44,42) 80%,rgb(26,26,25) 90%,rgb(20,20,19) 100%)}
html.solo .fadeband{display:none}
/* frame 8: the before/after climax */

/* closing sections */
.sec{padding-top:140px;padding-bottom:40px}
.kick{font:500 12px var(--mono);letter-spacing:.14em;color:#b8331d;text-transform:uppercase}
.sec h2{margin:12px 0 0;font:600 clamp(34px,calc(3.7*var(--vw,1vw)),50px)/1.06 var(--serif);letter-spacing:-.02em;max-width:760px}
.sec h2 em{color:var(--coral)}
.sec .sub{margin:14px 0 0;font-size:17px;color:var(--ink-2);max-width:620px}
.up{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.up.in{opacity:1;transform:none}
.gets{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.get{position:relative;background:#fff;border-radius:16px;padding:22px 24px 24px;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 20px 40px -30px rgba(60,40,20,.35);min-height:250px;display:flex;flex-direction:column}
.get .n{font:12px var(--mono);color:var(--ink-3)}
.get h3{margin:auto 0 6px;font:600 21px/1.2 var(--serif)}
.get p{margin:0;font-size:14.5px;color:var(--ink-2)}
.get .art{height:96px;margin:12px 0 18px;border-radius:10px;background:#f7f5f0;position:relative;overflow:hidden}
.bars{position:absolute;left:16px;right:16px;bottom:14px;display:flex;align-items:flex-end;gap:10px;height:62px}
.bars i{flex:1;border-radius:4px 4px 0 0;background:#d9d5cb}.bars i.me{background:var(--coral)}
.chipsA{position:absolute;inset:14px;display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start}
.chipsA span{font:10.5px var(--mono);padding:3px 8px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px #e4e1d8;color:#55534d}
.factA{position:absolute;inset:14px 16px;font:12px/1.9 var(--sans);color:#3b3a35}
.factA s{color:#b0ada3}.factA b{color:var(--coral-btn);font-weight:600}.factA .k{color:#2f8f5b;font-weight:600}
.codeA{position:absolute;inset:12px 14px;font:11px/1.6 var(--mono);color:#55534d;background:#1b1b1d;border-radius:8px;padding:10px 12px;color:#e9e7e1}
.codeA em{font-style:normal;color:#ff9a85}.codeA u{text-decoration:none;color:#9fe0bb}
.agentA{position:absolute;inset:14px 16px;display:flex;flex-direction:column;gap:6px;font:11.5px var(--mono);color:#3b3a35}
.agentA span{display:flex;gap:8px}.agentA .ok{color:#2f8f5b}.agentA .no{color:var(--coral-btn)}
.proofA{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:16px;font:600 28px var(--serif)}
.proofA small{display:block;font:11px var(--mono);color:var(--ink-3);text-align:center}
.proofA .arr{font:22px var(--sans);color:var(--ink-3)}
.proofA .aft{color:#2f8f5b}

.plans{margin-top:56px;display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:18px;align-items:stretch}
.plan{background:#fff;border-radius:18px;padding:28px 28px 26px;box-shadow:0 0 0 1px rgba(0,0,0,.07),0 24px 50px -36px rgba(60,40,20,.4);display:flex;flex-direction:column}
.plan.dark{background:#141413;color:#f7f6f2;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.plan .nm{font:600 24px var(--serif)}
.plan .for{margin-top:4px;font-size:14px;color:var(--ink-3)}
.plan.dark .for{color:#a8a69e}
.plan .pr{margin:22px 0 4px;font:600 42px/1 var(--serif);letter-spacing:-.02em}
.plan .pr small{font:12px var(--mono);letter-spacing:.08em;color:var(--coral-btn);vertical-align:12px;margin-left:6px}
.plan ul{margin:20px 0 26px;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:14.5px}
.plan li{display:flex;gap:10px}
.plan li:before{content:"✓";color:var(--coral);font-weight:600}
.plan li.off{color:var(--ink-3)}
.plan li.off:before{content:"\2212";color:var(--ink-3)}
.ptable a.flink{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.ptable a.flink:hover{text-decoration-color:var(--coral)}
.plan .btn{margin-top:auto;display:block;text-align:center;padding:14px 18px;border-radius:999px;background:#111;color:#fff;text-decoration:none;font-weight:600;font-size:15px}
.plan.dark .btn{background:var(--coral-btn)}
.plan.dark .pr small{color:#ff8a70}
.plan .tag2{display:inline-block;margin-top:10px;font:11px var(--mono);letter-spacing:.06em;color:#a8a69e}
.refund{margin-top:22px;text-align:center;font-size:14px;color:var(--ink-2)}
.refund b{color:var(--ink)}

/* ask box: instant FAQ match first, then an answer from public docs only */
.ask2{margin-top:34px;max-width:860px}
.askf{display:flex;align-items:center;gap:8px;height:60px;padding:6px 6px 6px 20px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 12px 30px -16px rgba(0,0,0,.2)}
.askf:focus-within{box-shadow:0 0 0 2px var(--ink),0 12px 30px -16px rgba(0,0,0,.2)}
.askf svg{flex:none}
.askf input{flex:1;min-width:0;border:0;background:transparent;font:16px var(--sans);color:var(--ink);outline:none}
.askf input::placeholder{color:#8a867c}
.askf button{height:48px;padding:0 22px;border:0;border-radius:999px;background:#111;color:#fff;font:600 15px var(--sans);cursor:pointer}
.askm{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;min-height:0}
.askm button{border:0;cursor:pointer;font:13.5px var(--sans);color:var(--ink);background:#fff;border-radius:999px;padding:7px 13px;box-shadow:0 0 0 1px var(--line)}
.askm button:hover{box-shadow:0 0 0 1px var(--ink)}
.askm .lb{font:11px var(--mono);letter-spacing:.08em;color:var(--ink-3);align-self:center;margin-right:2px}
.asko{margin-top:14px;display:none;background:#fff;border-radius:16px;padding:18px 22px;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 20px 40px -30px rgba(60,40,20,.35);font-size:16px;line-height:1.6;color:#222}
.asko.on{display:block}
.asko .src{display:flex;align-items:center;gap:8px;margin-bottom:8px;font:11px var(--mono);letter-spacing:.08em;color:var(--ink-3);text-transform:uppercase}
.asko .src i{font:600 11px var(--sans);letter-spacing:0;text-transform:none;color:#fff;background:#1b1b1d;border-radius:4px 9px 9px 9px;padding:3px 8px;font-style:normal}
.asko.off .src i{background:var(--coral-btn)}
.askn{margin-top:10px;font-size:13px;color:var(--ink-3)}
.faq{margin-top:46px;max-width:860px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;font:500 19px/1.35 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";font:400 26px var(--sans);color:var(--ink-3);transition:transform .25s var(--ease)}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq p{margin:0 0 22px;font-size:16px;color:var(--ink-2);max-width:700px}

.final{position:relative;margin-top:140px;padding:120px 0 110px;text-align:center;overflow:hidden}
.final .bg{position:absolute;inset:0}
.final .bg .glow{opacity:1;top:50%;height:100%}
.final h2{margin:0 auto;font:600 clamp(44px,calc(5.6*var(--vw,1vw)),78px)/1 var(--serif);letter-spacing:-.025em;max-width:900px;position:relative}
.final h2 em{color:var(--coral)}
.final .check{position:relative}
.final .fine{position:relative}

/* footer (canvas option 3d): coral glow rising behind a giant wordmark cut by the page edge */
footer{position:relative;background:#141413;color:#a8a69e;padding:96px 0 0;overflow:hidden;height:clamp(520px,calc(50*var(--vw,1vw)),720px)}
footer .wrap{position:relative;z-index:2}
.fglow{position:absolute;left:50%;bottom:-52%;width:104%;height:97%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(232,67,42,.55),rgba(255,140,110,.18) 55%,rgba(20,20,19,0) 100%);pointer-events:none}
.fwrap{display:flex;justify-content:space-between;gap:60px}
.fwrap .brand{display:flex;align-items:center;gap:10px;font:600 22px var(--serif);color:#f7f6f2}
.fwrap .say{margin-top:18px;font:500 21px/1.35 var(--serif);color:#f7f6f2;max-width:380px}
.fcols{display:flex;gap:70px}
.fwrap h4{margin:0 0 12px;font:500 11px var(--mono);letter-spacing:.12em;color:#f7f6f2;text-transform:uppercase}
.fwrap a{display:block;color:#a8a69e;text-decoration:none;font-size:14.5px;padding:4px 0}
.fwrap a:hover{color:#f7f6f2}
.legal{margin-top:58px;display:flex;justify-content:space-between;gap:20px;font-size:13px;color:#929089;border-top:1px solid #2e2e2c;padding-top:20px}
.mark{position:absolute;left:0;right:0;bottom:-.29em;text-align:center;font:600 calc(27*var(--vw,1vw))/1 var(--serif);letter-spacing:-.055em;color:#f7f6f2;white-space:nowrap;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 25%,rgba(0,0,0,.15) 85%);mask-image:linear-gradient(180deg,#000 25%,rgba(0,0,0,.15) 85%)}
.after{padding:120px 0;text-align:center;color:var(--ink-3);font-size:14px}

/* static stacked layout: phones, reduced motion, and (via noscript) no JavaScript */
@media (max-width:700px),(prefers-reduced-motion:reduce){
  header{position:relative}
  .stage,.st{height:auto!important}
  .pin{position:relative!important;height:auto!important;overflow:visible!important;padding:28px 0 64px}
  .hero{position:relative!important;top:auto!important;padding:24px 0 30px;opacity:1!important;transform:none!important}
  .cap{position:relative!important;top:auto!important;opacity:1!important;transform:none!important;padding:10px 20px 24px}
  .cap2{display:none}
  .scene{position:relative!important;left:auto!important;top:auto!important;margin:0 auto!important;width:calc(100% - 24px)!important;max-width:1040px;height:auto!important;transform:none!important}
  .screen{height:620px}.ans{min-height:0}.side{display:none}.win{left:10px;right:10px}.thread{padding:6px 16px 0}.composer{margin:10px 16px 14px}
  #empty{display:none}.hide{opacity:1!important}
  .rays,.bg .glow,.bg .lines,.note,.marks{display:none!important}
  .count{position:relative!important;bottom:auto!important;opacity:1!important;padding:14px 20px 0}
  .cursor,.pulse,.ov,.hn,.lines5,.lines6,.bd,#sA{display:none!important}
  .w,.up,.step,.stamp,.acts{opacity:1!important}
  .up{transform:none!important}
  .board{position:relative!important;left:auto!important;top:auto!important;margin:0 auto!important;width:auto!important;height:auto!important;max-width:1200px;transform:none!important;display:flex;flex-direction:column;align-items:center;gap:18px;padding:0 16px}
  .board>*{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;opacity:1!important;transform:none!important}
  .st4 .board{flex-direction:row;align-items:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;max-width:100%;padding-bottom:12px}
  .st4 .eng{flex:none;scroll-snap-align:center}
  .stamp{transform:rotate(-6deg)!important}
  .sc,.shop,.gpt,.store,.alog{width:100%!important;max-width:620px;height:auto!important}
  .chipG{width:auto!important;padding:0 20px}
  .you{width:100%!important;max-width:620px;height:auto!important;padding:22px}
  .shopIn,.pd{flex-wrap:wrap}
  .gpt .bad{background:#fff3ef;color:var(--coral-btn);border-radius:4px;padding:0 2px;margin:0 -2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
  .gpt .g{line-height:1.6;min-height:0;padding:6px 0}
  #sB{position:relative!important;top:0!important;opacity:1!important}
  .fixchip{white-space:normal}
  .score{padding:6px 16px 0}
}
@media(max-width:700px){
  .sec{padding-top:84px;padding-bottom:20px}
  .snav .lk,.snav .sbox{display:none}
  .gets,.plans{grid-template-columns:1fr}
  .fwrap{flex-direction:column;gap:36px}
  .fcols{gap:36px;flex-wrap:wrap}
  footer{height:auto;padding-bottom:calc(42*var(--vw,1vw))}
  .final{margin-top:80px;padding:80px 0}
  .eng{width:250px}
  .legal{flex-direction:column}
}
html.still *{transition:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
h1 em,.cap h2 em,.sec h2 em,.final h2 em,.tag2 em{font-style:normal}

/* Soft micro-interactions (locked 26 Oct, from design/motion): press .94 in 120ms, bounce release 520ms, 2px hover lift, 380ms state changes */
:root{
  --bounce:linear(0,.009,.035 2.1%,.141,.281 6.7%,.723 12.9%,.938 16.7%,1.017,1.077,1.121,1.149 24.3%,1.159,1.163,1.161,1.154 29.9%,1.129 32.8%,1.051 39.6%,1.017 43.1%,.991,.977 51%,.974 53.8%,.975 57.1%,.997 69.8%,1.003 76.9%,1);
  --spring:linear(0,.006,.025 2.8%,.101 6.1%,.539 18.9%,.721 25.3%,.849 31.5%,.937 38.1%,.968 41.8%,.991 45.7%,1.006 50.1%,1.015 55%,1.017 63.9%,1.001);
  --t-press:120ms; --t-release:520ms; --t-ui:380ms;
}
.check button,.plan .btn,.nav .login{position:relative;overflow:hidden;transition:scale var(--t-release) var(--bounce),translate var(--t-release) var(--bounce),box-shadow var(--t-ui) var(--ease),background-color var(--t-ui) var(--ease),filter var(--t-ui)}
.check button:active,.plan .btn:active,.nav .login:active{transform:none;scale:.94;transition-duration:var(--t-press);transition-timing-function:var(--ease)}
.check button::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);background-size:250% 100%;background-position:130% 0;opacity:0;pointer-events:none}
.check button .arrow{display:inline-block;margin-left:6px;transition:translate var(--t-ui) var(--bounce)}
@media (hover:hover) and (pointer:fine){
  .check button:hover,.plan .btn:hover{translate:0 -2px;filter:brightness(1.04);box-shadow:inset 0 1px rgba(255,255,255,.3),inset 0 -2px 2px rgba(0,0,0,.18),0 14px 26px -12px rgba(212,58,34,.8)}
  .plan .btn:hover{filter:none;background:#262626;box-shadow:0 14px 26px -14px rgba(0,0,0,.75)}
  .plan.dark .btn:hover{background:var(--coral-btn)}
  .nav .login:hover{translate:0 -2px;background:#fff;box-shadow:0 10px 20px -14px rgba(0,0,0,.35)}
  .check button:hover::after{opacity:1;background-position:-30% 0;transition:background-position .9s var(--ease),opacity .2s}
  .check button:hover .arrow{translate:4px 0}
  .nav a.lk{transition:color var(--t-ui) var(--ease)}
}
.check{transition:box-shadow var(--t-ui) var(--ease)}
.check:hover{box-shadow:0 0 0 1px rgba(0,0,0,.16),0 12px 30px -14px rgba(0,0,0,.2)}
.check.err{box-shadow:0 0 0 1.5px var(--coral-btn),0 0 0 7px rgba(212,58,34,.12);animation:shake .42s cubic-bezier(.36,.07,.19,.97)}
@keyframes shake{10%,90%{translate:-1px 0}20%,80%{translate:3px 0}30%,50%,70%{translate:-6px 0}40%,60%{translate:6px 0}}
.check button.is-loading{pointer-events:none;filter:saturate(.85)}
.faq summary:after{transition:transform var(--t-ui) var(--bounce)}
@media (prefers-reduced-motion:reduce){.check.err{animation:none}.check button::after{display:none}}
.cf-turnstile:has(iframe){margin-top:12px}
.legal .flegal{display:flex;flex-wrap:wrap;gap:6px 18px}
.legal .flegal a{text-decoration:none}

/* ===== night mode =====
   Same palette and toggle as product.css. The class is-dark is set on <html> before first paint
   (inline script in home.html) from the saved choice or the device setting. The mock app
   windows (laptop, phones, review cards, shop, store, Mac) stay light, like the report's answer panes. */
.theme-t{position:relative;width:40px;height:40px;flex:none;border:0;border-radius:50%;background:var(--white);box-shadow:0 0 0 1px rgba(0,0,0,.12);color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:scale .52s cubic-bezier(.34,1.56,.64,1),background-color .3s}
.theme-t:active{scale:.9}
@media (hover:hover){.theme-t:hover{scale:1.06}}
.theme-t svg{position:absolute;transition:opacity .3s,rotate .6s var(--ease),scale .6s var(--ease)}
.theme-t .moon{opacity:1}.theme-t .sun{opacity:0;rotate:-90deg;scale:.5}
.is-dark .theme-t .moon{opacity:0;rotate:90deg;scale:.5}.is-dark .theme-t .sun{opacity:1;rotate:0deg;scale:1}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
html.is-dark{--ivory:#141413; --white:#1e1e1c; --ink:#f2f1ee; --ink-2:#b4b1a9; --ink-3:#8f8c84; --line:#33322e; --coral:#ff6a4a; --peach:#5a2a1d; --dot:rgba(255,106,74,.4); color-scheme:dark; background:#141413}
.is-dark .theme-t{box-shadow:0 0 0 1px var(--line)}
.is-dark .nav .login{border-color:rgba(255,255,255,.18);background:rgba(30,30,28,.6)}
@media (hover:hover) and (pointer:fine){.is-dark .nav .login:hover{background:#1e1e1c;box-shadow:0 10px 20px -14px rgba(0,0,0,.8)}}
.is-dark .bg .grid{background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.4px)}
.is-dark .bg .glow{background:radial-gradient(closest-side,rgba(232,67,42,.26),rgba(232,67,42,.1) 55%,transparent 100%)}
.is-dark .bg .lines{background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 1px,transparent 1px 22px)}
.is-dark .check,.is-dark .askf{box-shadow:0 0 0 1px rgba(255,255,255,.1),0 12px 30px -14px rgba(0,0,0,.7)}
.is-dark .check:focus-within,.is-dark .askf:focus-within{box-shadow:0 0 0 2px var(--ink),0 12px 30px -14px rgba(0,0,0,.7)}
.is-dark .check input::placeholder{color:#6f6c66}
.is-dark .kick{color:#ff8a70}
.is-dark .rays .band{stroke:#2e2d2a}
.is-dark .rays .outTxt:not([fill="#e8432a"]){fill:#c9c6be}
.is-dark .lines5 path{stroke:rgba(255,255,255,.32)}
.is-dark .get,.is-dark .plan,.is-dark .askf,.is-dark .asko,.is-dark .askm button{background:#1e1e1c;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 20px 40px -30px rgba(0,0,0,.8)}
.is-dark .askm button{box-shadow:0 0 0 1px var(--line)}
.is-dark .asko{color:#e9e7e1}
.is-dark .get .art{background:#2a2926}
.is-dark .agentA{color:#d8d5cd}.is-dark .agentA .ok{color:#5fbf8a}
.is-dark .bars i{background:#4a4843}.is-dark .bars i.me{background:var(--coral)}
.is-dark .chipsA span{background:#1e1e1c;box-shadow:0 0 0 1px var(--line);color:var(--ink-2)}
.is-dark .plan.dark{background:#0b0b0a;box-shadow:0 0 0 1px rgba(255,106,74,.35),0 30px 60px -30px rgba(0,0,0,.8)}
.is-dark .plan .btn,.is-dark .askf button{background:#f2f1ee;color:#111}
.is-dark .plan.dark .btn{background:var(--coral-btn);color:#fff}
@media (hover:hover) and (pointer:fine){.is-dark .plan .btn:hover{background:#fff}.is-dark .plan.dark .btn:hover{background:var(--coral-btn)}}
.is-dark .fadeband,.is-dark .fadeband.up{background:#141413}
.is-dark .scene,.is-dark .eng,.is-dark .sc,.is-dark .shop,.is-dark .gpt,.is-dark .store,.is-dark .fixchip{--ivory:#f7f6f2; --white:#ffffff; --ink:#111111; --ink-2:#55534d; --ink-3:#6b685f; --line:#e4e1d8; --coral:#e8432a; --peach:#ffd9cf; color-scheme:light}
.is-dark .scene,.is-dark .eng,.is-dark .shop,.is-dark .gpt,.is-dark .sc{color:#111}

/* UI review fixes (28 Oct 2026) */
.factA{color:var(--ink-2)}
.is-dark .you{background:rgba(255,255,255,.04);color:var(--ink)}
.menubar span{white-space:nowrap}
.sec h2{text-wrap:balance}
.sec .sub{text-wrap:pretty}
@media(max-width:700px){
  .menubar span:not(:first-child){display:none}
  .get .art{height:auto;min-height:96px}
  .chipsA{position:relative;inset:auto;padding:14px}
  .fixchip{align-self:stretch;margin:0 16px}
}

/* UI review fixes, second pass (28 Oct 2026) */
.cap h2{text-wrap:balance}
.nowr{white-space:nowrap}
.count .mbr{display:none}
.is-dark .cursor .tag{box-shadow:0 0 0 1px rgba(255,255,255,.3)}
.is-dark .hn{color:#ff8a70}
.cursor .tag{transition:opacity .2s}

@media(max-width:700px){
  h1{font-size:clamp(38px,calc(11*var(--vw,1vw)),48px)}
  .cap h2 em{display:block}
  .count{font-size:13px}
  .count .mbr{display:inline}
  .fcols{display:grid;grid-template-columns:1fr 1fr;gap:28px 24px}
}
/* /pricing comparison table and the coach steps */
.ptable{margin-top:40px;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:16px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.07),0 20px 40px -30px rgba(60,40,20,.35)}
.ptable table{width:100%;min-width:620px;border-collapse:collapse;font-size:14.5px}
.ptable th,.ptable td{padding:14px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.ptable thead th{font:600 16px var(--serif)}
.ptable tbody th{font-weight:500;color:var(--ink-2);width:34%}
.ptable tr:last-child th,.ptable tr:last-child td{border-bottom:0}
.ptable .no{color:var(--ink-3)}
.ptable .yes{color:#1f7a4d;font-weight:600}
.pnote{margin-top:14px;font-size:14px;color:var(--ink-2)}
.pnote a{color:var(--ink);text-underline-offset:3px}
.coach{margin-top:46px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.coach .get{min-height:0}
.coach .get h3{margin:14px 0 6px;font:600 20px var(--serif)}
.coach .get p{margin:0;font-size:15px;color:var(--ink-2)}
.coachacc{margin:22px 0 0;font-size:15px;color:var(--ink-2)}.coachacc a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:4px;white-space:nowrap}
@media (max-width:860px){.coach{grid-template-columns:1fr}}
.is-dark .ptable{background:#1e1e1c;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 20px 40px -30px rgba(0,0,0,.8)}
.is-dark .ptable .yes{color:#6fd39d}

/* card spotlight and lift (design/motion, Soft) */
.get,.plan{isolation:isolate}
.plan{position:relative;transition:translate .52s var(--bounce,cubic-bezier(.34,1.56,.64,1)),box-shadow .38s var(--ease)}
.get::before,.plan::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;pointer-events:none;transition:opacity .3s;background-image:radial-gradient(circle,rgba(232,67,42,.5) 1.3px,transparent 1.8px);background-size:10px 10px;-webkit-mask-image:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),#000,transparent 70%);mask-image:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),#000,transparent 70%)}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .get:hover::before,.plan:hover::before{opacity:.55}
  .plan:hover{translate:0 -3px;box-shadow:0 0 0 1px rgba(0,0,0,.09),0 30px 56px -34px rgba(60,40,20,.5)}
}
.is-dark .get::before,.is-dark .plan::before{background-image:radial-gradient(circle,rgba(255,106,74,.45) 1.3px,transparent 1.8px)}

/* Nav: the current page or section gets a coral underline; hover shows a short one */
.nav a.lk{position:relative;transition:color .25s}
.nav a.lk::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;border-radius:2px;background:var(--coral);transform-origin:left;scale:0 1;transition:scale .4s cubic-bezier(.22,1,.36,1)}
.nav a.lk:hover::after{scale:.35 1}
.nav a.lk[aria-current]{color:var(--ink)}
.nav a.lk[aria-current]::after{scale:1 1}
.nav a.lk:active{scale:.96}
@media (prefers-reduced-motion:reduce){.nav a.lk::after{transition:none}}

/* Real brand logos (sprite in _logos.html) */
.lgo{flex:none;display:inline-block;vertical-align:-2px}
.hd .bm{display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:#1a1a1a}
.e-gem .ttl{display:inline-flex;align-items:center;gap:5px}
.sc.rd .dot{background:none}
.sc.tp .brand{display:flex;align-items:center;gap:6px}
.gr .pinI{transform:none;border-radius:0;background:none;display:flex;align-items:center}

/* Engine logos under the hero, logos in the source chips and the pricing table (desktop and phone) */
.engs{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px;font-size:13px;color:var(--ink-3)}
.engs .row{display:flex;gap:10px}
.chipsA span{display:inline-flex;align-items:center;gap:5px}
.ptable .apps{display:flex;gap:6px;margin-bottom:6px}
.ptable th .apps{display:inline-flex;vertical-align:-3px;margin:0 8px 0 0}
.m-only,.mpill,.mmenu,.msheet,.mshade,.mmore{display:none}

/* Phone, 700px and under (design/mobile v2, approved 28 Oct 2026). Light only, no Human / Agent
   switch, the scroll scenes swap for small cards, one short fade, nothing pinned or sliding. */
@media(max-width:700px){
  .m-only{display:block}
  .theme-t,.nav .login,.nav a.lk,.nav a.lk.keep,.hv{display:none!important}
  header{position:sticky!important;top:0;z-index:30;background:rgba(247,246,242,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:box-shadow .3s}
  header.msc{box-shadow:0 1px 0 var(--line)}
  .nav{height:60px;gap:10px}
  .logo{font-size:19px}
  .mpill{display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:99px;background:var(--coral-btn);color:#fff;font:600 14px var(--sans);text-decoration:none;white-space:nowrap;flex:none}
  .mmenu{display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
  .mmenu i{display:block;width:16px;height:2px;border-radius:2px;background:currentColor;position:relative;transition:background .2s}
  .mmenu i::before,.mmenu i::after{content:"";position:absolute;left:0;width:16px;height:2px;border-radius:2px;background:currentColor;transition:translate .3s var(--ease),rotate .3s var(--ease)}
  .mmenu i::before{translate:0 -5px}.mmenu i::after{translate:0 5px}
  header.open .mmenu i{background:transparent}
  header.open .mmenu i::before{translate:0 0;rotate:45deg}header.open .mmenu i::after{translate:0 0;rotate:-45deg}
  .mpill:active,.mmenu:active{scale:.96}
  .msheet{display:block;position:absolute;left:0;right:0;top:60px;padding:0 12px;visibility:hidden;opacity:0;translate:0 -8px;transition:opacity .2s,translate .3s var(--ease),visibility 0s .3s}
  header.open .msheet{visibility:visible;opacity:1;translate:0 0;transition:opacity .2s,translate .3s var(--ease)}
  .msheet nav{background:#fff;border-radius:20px;box-shadow:0 0 0 1px var(--line),0 24px 48px -20px rgba(0,0,0,.25);padding:8px}
  .msheet a{display:flex;align-items:center;justify-content:space-between;height:50px;padding:0 14px;border-radius:12px;text-decoration:none;font-weight:600}
  .msheet a[aria-current]{background:#efede6}
  .msheet a[aria-current]::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--coral)}
  .msheet .msignin{margin:6px;height:46px;justify-content:center;border:1px solid var(--line);border-radius:99px}
  .mshade{display:block;position:fixed;inset:0;z-index:25;background:rgba(17,17,17,.18);opacity:0;pointer-events:none;transition:opacity .2s}
  body.mopen .mshade{opacity:1;pointer-events:auto}

  /* type and spacing: left aligned, one gutter, sections 52px apart */
  h1{font-size:38px;line-height:1.05;letter-spacing:-.025em}
  h1 em{display:block}
  .cap h2,.sec h2{font-size:29px;line-height:1.1}
  .cap,.hero{text-align:left}
  .cap{padding:0 20px!important}
  .cap p,.sec .sub{font-size:16px;margin-top:12px}
  .sec{padding-top:52px;padding-bottom:0}
  .up{transform:translateY(12px);transition-duration:.45s}

  /* hero: copy, a stacked form, the four logos; no laptop scene */
  .stage .bg,#cap1,#cap2,.rays,.count,.scene{display:none!important}
  .stage .pin{padding:0!important}
  .hero{padding:24px 0 0!important}
  .hero .lead{font-size:16px;color:var(--ink-2)}
  .check{display:grid;gap:10px;width:100%;height:auto;margin-top:22px;padding:0;border-radius:0;background:none;box-shadow:none!important}
  .check input{height:54px;border-radius:16px;border:1.5px solid var(--line);background:#fff;padding:0 16px}
  .check input:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(232,67,42,.16)}
  .check.err input{border-color:var(--coral-btn)}
  .check button{width:100%;height:54px;border-radius:16px;font-size:16px}
  .fine{font-size:13px}
  .msg:empty{min-height:0;margin:0}
  .hero .msg{margin-top:8px}
  .engs{justify-content:flex-start;margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}
  .engs .row{margin-left:auto;gap:12px}
  .engs .lgo{width:24px;height:24px}

  /* scenes: only the four engines and the proof stay, as cards; sources, facts and agents fold into What you get */
  .st .pin{padding:52px 0 0!important}
  .st .bg,.st .board{display:none!important}
  #sources,#facts,#coach,.fadeband{display:none!important}
  /* agents lead the page (Naman, 2026-11-01): one example run as a card */
  .st7{height:auto!important}.st7 .pin{background:none}
  .mlog{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px;font-size:14.5px}
  .mlog li{display:flex;gap:8px;align-items:flex-start}
  .mlog li::before{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff;margin-top:1px}
  .mlog .ok::before{content:"✓";background:#2f8f5b}.mlog .no::before{content:"✕";background:var(--coral-btn)}
  .mex{margin:12px 20px 0;font:12.5px/1.5 var(--mono);color:var(--ink-2)}
  .mcard{background:#fff;border-radius:20px;box-shadow:0 0 0 1px var(--line),0 16px 32px -24px rgba(0,0,0,.2);padding:16px;text-align:left}
  .mhd{display:flex;align-items:center;gap:8px;font:600 14.5px var(--sans)}
  .mhd small{margin-left:auto;font:11px var(--mono);color:var(--ink-3);letter-spacing:.08em}
  .mq{margin:12px 0 0 auto;width:fit-content;max-width:88%;background:#efede6;border-radius:16px 16px 4px 16px;padding:8px 12px;font-size:14.5px}
  .ma{margin:10px 0 0;padding:0 0 0 18px;font-size:14.5px}
  .ma li{padding:2px 0}
  .mv{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
  .mv .pen{font:600 20px/1 var(--hand);color:var(--coral);rotate:-3deg}
  .mv small{font:12px var(--mono);color:var(--ink-3)}
  .mswipe{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:22px;padding:2px 20px 8px;scroll-padding:0 20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .mswipe::-webkit-scrollbar{display:none}
  .mswipe .mcard{flex:0 0 82%;scroll-snap-align:start;min-width:0}
  .mdots{display:flex;justify-content:center;gap:6px;margin-top:12px}
  .mdots i{width:6px;height:6px;border-radius:9px;background:var(--line);transition:width .3s var(--ease),background .3s}
  .mdots i.on{width:18px;background:var(--coral)}
  .mprov{display:flex;gap:10px;align-items:flex-start;margin-top:14px;background:#e6f2ea;color:#2f8f5b;border-radius:14px;padding:12px;font-size:13.5px;font-weight:500}
  .mprov i{width:22px;height:22px;border-radius:50%;background:#2f8f5b;color:#fff;display:grid;place-items:center;flex:none;font-size:12px;font-style:normal}
  .st7 .cap h2{color:inherit}.st7 .cap p{color:var(--ink-2)}

  /* What you get: four cards, no numbers */
  .gets{margin-top:22px;gap:12px}
  .gets .get:nth-child(4),.gets .get:nth-child(6),.get .n{display:none}
  .get{min-height:0;padding:16px;border-radius:20px}
  .get .art{margin:0 0 12px;border-radius:14px}
  .get h3{margin:0 0 4px;font-size:18px}

  /* plans: a price switch, one plan at a time */
  .mseg{position:relative;display:grid;grid-template-columns:repeat(var(--n,3),1fr);margin-top:22px;padding:4px;border-radius:99px;background:#efede6}
  .mseg button{position:relative;z-index:1;height:42px;border:0;background:none;border-radius:99px;font:600 min(15px,3.6vw) var(--sans);white-space:nowrap;color:var(--ink-2);cursor:pointer}
  .mseg button[aria-selected="true"]{color:var(--ink)}
  .mseg .pl{position:absolute;top:4px;left:4px;height:42px;width:calc((100% - 8px)/var(--n,3));border-radius:99px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.12);translate:calc(var(--k,0)*100%) 0;transition:translate .35s var(--ease)}
  .plans{margin-top:12px;gap:12px}
  .plans.mpick .plan:not(.on){display:none}
  .plans.mpick .plan{opacity:1;transform:none}
  .plan{padding:20px;border-radius:20px}
  .plan .pr{margin-top:14px;font-size:44px}
  .plan ul{margin:14px 0 18px}
  .plan.mswap{animation:mswap .35s var(--ease)}
  @keyframes mswap{from{opacity:.2;translate:0 6px}}
  .refund{font-size:14px;text-align:left}

  /* pricing page: the compare table shows the picked plan as one list */
  #pricing.sec:first-child{padding-top:24px}
  .ptable{margin-top:12px;border-radius:20px}
  .ptable.mpick table{min-width:0}
  .ptable.mpick thead{display:none}
  .ptable.mpick td.off{display:none}
  .ptable.mpick th,.ptable.mpick td{padding:12px 16px;font-size:14px}
  .ptable.mpick tbody th{width:52%}
  .ptable.mpick td{text-align:right;font-weight:600}
  .ptable .apps{justify-content:flex-end;gap:8px;margin:0}
  .ptable .apps .lgo{width:20px;height:20px}
  .ptable.mpick .appn{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

  /* FAQ: three first, the rest one tap away */
  .faq{margin-top:16px}
  .faq summary{padding:16px 0;font-size:16px}
  .faq p{font-size:15px}
  .faq.mfew details:nth-of-type(n+4){display:none}
  .mmore{display:inline-flex;align-items:center;margin-top:14px;height:44px;padding:0 18px;border-radius:99px;border:1px solid var(--line);background:#fff;font:600 14.5px var(--sans);color:var(--ink);cursor:pointer}

  /* closing band and footer: no glow, no giant wordmark, no grey fade */
  .final{margin:52px 20px 52px;padding:26px 18px;border-radius:24px;text-align:left;background:radial-gradient(120% 90% at 50% 100%,var(--peach),rgba(255,217,207,0) 70%),#fff;box-shadow:0 0 0 1px var(--line)}
  .final .bg{display:none}
  .final .wrap{padding:0}
  .final h2{font-size:29px;line-height:1.1}
  .final h2 br{display:none}
  .final h2 em{display:block}
  footer{height:auto;padding:30px 0 calc(28px + env(safe-area-inset-bottom))}
  footer .mark,footer .fglow{display:none}
  .legal{margin-top:24px}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){.plan.mswap{animation:none}.up{transform:none}}

/* Big screens (zoomed by _zoom.html): the nav keeps its 1440 share of the width on wider screens */
.wrap.nav{max-width:max(1200px,calc(83.4*var(--vw,1vw)))}

/* signed in: Log out is a small form (it posts), styled like the link it sits beside */
.lout{display:contents}
.lout button{all:unset;cursor:pointer}
.nav .lout.lk button{font-size:14.5px;color:var(--ink-2)}
.nav .lout.lk button:hover{color:var(--ink)}
.fwrap .lout button{display:block;color:#a8a69e;font-size:14.5px;padding:4px 0}
.fwrap .lout button:hover{color:#f7f6f2}
.lout button:focus-visible{outline:2px solid var(--coral);outline-offset:3px;border-radius:4px}
@media(max-width:760px){.nav .lout.lk{display:none}}
@media(max-width:700px){
  .msheet .lout button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:calc(100% - 12px);margin:6px;height:46px;border:1px solid var(--line);border-radius:99px;font-weight:600}
  /* footer links: 44px tap targets on a phone */
  .fwrap a,.fwrap .lout button{padding:0;min-height:44px;display:flex;align-items:center}
  .legal .flegal a{display:inline-flex;align-items:center;min-height:44px}
}

/* the kicker above the home H1 */
.hkick{margin:0 0 16px;font:500 12px var(--mono);letter-spacing:.14em;color:#b8331d;text-transform:uppercase}
.is-dark .hkick{color:#ff8a70}
/* the two longest scene headings stay on one line on laptop screens (SEO headings, 2026-10-28) */
@media(min-width:701px){.st4 .cap h2,.st7 .cap h2{font-size:clamp(26px,calc(3.1*var(--vw,1vw)),46px)}}

/* pricing table: the row under the pointer lights up, so a feature is easy to follow across plans */
@media (hover:hover) and (pointer:fine){
  .ptable tbody tr{transition:background-color .25s var(--ease)}
  .ptable tbody tr:hover{background:#faf6f1}
  .ptable tbody tr:hover th{color:var(--ink)}
  .is-dark .ptable tbody tr:hover{background:#262624}
}
/* FAQ answers slide open instead of snapping (browsers without ::details-content just snap) */
@supports (interpolate-size:allow-keywords){
  .faq{interpolate-size:allow-keywords}
  .faq details::details-content{height:0;overflow:clip;opacity:0;transition:height .38s var(--ease),opacity .3s var(--ease),content-visibility .38s allow-discrete}
  .faq details[open]::details-content{height:auto;opacity:1}
  @media (prefers-reduced-motion:reduce){.faq details::details-content{transition:none}}
}

/* "For agents" block: one paste line, the two addresses, the who-pays note */
.fa{margin-top:40px;max-width:860px;background:var(--white);border-radius:16px;padding:24px;box-shadow:0 0 0 1px var(--line)}
.fa code{font:13.5px/1.5 var(--mono);color:var(--ink);overflow-wrap:anywhere;user-select:all}
.fa-ask{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border-radius:12px;background:var(--ivory);box-shadow:inset 3px 0 0 var(--coral)}
.fa-ask code{font-size:15px}
.fa-k,.fa-links dt{font:11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.fa-links{margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fa-links dd{margin:6px 0 0}
.fa-note{margin:18px 0 0;font-size:15px;color:var(--ink-2)}
.fa .coachacc{margin-top:10px}
@media (max-width:860px){.fa{padding:18px}.fa-links{grid-template-columns:1fr}}

/* Plans: the Report's question slider (three radio stops), Most popular, Enterprise.
   Only the checked stop's price, count and Buy link show; .def is the no-:has fallback. */
.plan .rf{font-size:13px;color:var(--ink-3)}
.plan.dark .rf{color:#a8a69e}
.plan .rf a{color:inherit;text-underline-offset:3px}
.plan .pop{position:absolute;top:-12px;left:28px;padding:5px 11px;border-radius:99px;background:var(--coral-btn);color:#fff;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.plan .pr-c{font-size:34px;line-height:42px}
.plan.ent .btn{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.rp .qv{display:none}.rp .qv.def{display:block}
@supports selector(:has(a)){
  .rp .qv.def{display:none}
  .rp:has(.qtrack input:nth-of-type(1):checked) .qv1,.rp:has(.qtrack input:nth-of-type(2):checked) .qv2,
  .rp:has(.qtrack input:nth-of-type(3):checked) .qv3,.rp:has(.qtrack input:nth-of-type(4):checked) .qv4{display:block}
}
.qs{margin:20px 0 0;padding:16px 16px 14px;border:0;border-radius:14px;background:var(--ivory)}
.qs legend{float:left;width:100%;margin:0 0 14px;padding:0;font:600 13.5px/1.35 var(--sans);color:var(--ink)}
.qtrack{--n:3;position:relative;clear:both;display:grid;grid-template-columns:repeat(var(--n),1fr);--f:100%}
.qrail{position:absolute;top:10px;left:calc(50%/var(--n));right:calc(50%/var(--n));height:4px;border-radius:99px;background:var(--line)}
.qrail i{position:absolute;inset:0 auto 0 0;width:var(--f);border-radius:inherit;background:var(--coral);transition:width .3s var(--ease)}
.qtrack:has(input:nth-of-type(1):checked){--f:0%}
.qtrack:has(input:nth-of-type(2):checked){--f:50%}
.qtrack:has(input:nth-of-type(3):checked){--f:100%}
.qtrack label{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding-bottom:2px}
.qtrack .dot{width:24px;height:24px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 2px var(--line);transition:box-shadow .2s var(--ease),scale .2s var(--ease)}
.qtrack b{font:600 15px var(--mono);color:var(--ink-3)}
.qtrack input:checked+label .dot{background:var(--coral);box-shadow:0 0 0 4px rgba(232,67,42,.18);scale:1.08}
.qtrack input:checked+label b{color:var(--ink)}
.qtrack input:focus-visible+label .dot{outline:2px solid var(--ink);outline-offset:3px}
@media (hover:hover){.qtrack label:hover .dot{box-shadow:inset 0 0 0 2px var(--coral)}}
.qs .qn{margin:12px 0 0;text-align:center;font-size:14px;color:var(--ink)}
.qs .qh{margin:4px 0 0;text-align:center;font-size:12.5px;color:var(--ink-3)}
.plan.rp ul{margin-top:18px}
.is-dark .qs{background:#2a2926}
.is-dark .plan.ent .btn{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
@media (hover:hover) and (pointer:fine){.plan.ent .btn:hover,.is-dark .plan.ent .btn:hover{background:var(--ink);color:var(--ivory)}}

/* Nav that comes back on scroll up (js/nav.js). nv-fix: detached over the page on desktop;
   nv-sc: scrolled, so it gets a backing; nv-hid: moved up out of view; nv-snap: no animation for
   the one frame it is detached. Anchors land below the bar, except the pinned scenes, which
   start at the very top (the bar floats over them). */
header{transition:translate .32s var(--ease)}
header.nv-snap{transition:none!important}
header.nv-fix{position:fixed;z-index:40}
header.nv-sc{background:rgba(247,246,242,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.is-dark header.nv-sc{background:rgba(20,20,19,.86)}
header.nv-hid{translate:0 -100%}
section[id]:not(.stage):not(.st){scroll-margin-top:92px}
@media (prefers-reduced-motion:reduce){header{transition:none!important}}
@media (prefers-reduced-motion:reduce) and (min-width:701px){header{position:sticky;top:0;z-index:40}}
@media(max-width:700px){section[id]:not(.stage):not(.st){scroll-margin-top:72px}}

/* subscription plans: Monthly / Annual switch (radios ahead of the cards, no script needed) */
.billw{margin-top:40px}
.bill{display:inline-flex;gap:4px;padding:4px;border-radius:99px;background:#efede6;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}
.bill label{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border-radius:99px;font:600 15px var(--sans);color:var(--ink-2);cursor:pointer;transition:background-color .2s,color .2s,box-shadow .2s}
.bill .save{font:600 11px var(--mono);letter-spacing:.04em;white-space:nowrap;padding:3px 8px;border-radius:99px;background:#e6f3ec;color:#1f7a49;text-transform:uppercase}
.bill-m:checked~.bill label[for$="-bm"],.bill-y:checked~.bill label[for$="-by"]{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.bill-m:focus-visible~.bill label[for$="-bm"],.bill-y:focus-visible~.bill label[for$="-by"]{outline:2px solid var(--coral);outline-offset:2px}
.billw .plans{margin-top:30px}
.bill-m:checked~.plans .by,.bill-y:checked~.plans .bm{display:none}
.plan .rr{margin-top:12px;text-align:center;font-size:12.5px;color:var(--ink-3)}
.plan.dark .rr{color:#a8a69e}
.ent2{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding:18px 24px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.07)}
.ent2 b{font:600 19px var(--serif);margin-right:10px}
.ent2 span{font-size:14px;color:var(--ink-3)}
.ent2>div{min-width:0;flex:1 1 380px}
.ent2 .btn{padding:11px 20px;border-radius:999px;background:#111;color:#fff;text-decoration:none;font-weight:600;font-size:14.5px}
.is-dark .bill{background:#262624}
.is-dark .bill-m:checked~.bill label[for$="-bm"],.is-dark .bill-y:checked~.bill label[for$="-by"]{background:#3a3936;color:#f2f1ee}
.is-dark .bill .save{background:#16261d;color:#4cc285}
.is-dark .ent2{background:#1e1e1c;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.is-dark .ent2 .btn{background:#f2f1ee;color:#111}
@media(max-width:700px){.billw{margin-top:22px}.bill{display:flex}.bill label{flex:1;justify-content:center;padding:0 8px;gap:6px}.bill .save{font-size:10px;padding:3px 6px}.ent2{padding:16px 18px}}
.plan .pr .was{font:500 20px var(--serif);color:var(--ink-3);margin-right:10px;vertical-align:8px;text-decoration-thickness:1.5px}
.plan.dark .pr .was{color:#8f8c84}