/* Landing C (owner-approved mockup, 2026-10-18). Hand-authored, not Tailwind; landing.css stays for the other pages. */
:root{color-scheme:dark;--bg:#0A0A0A;--band:#0D0D0F;--ctl:#17181B;--ctlb:#2A2B30;--s1:#0E0F12;--s2:#13151A;--s3:#191B21;--t1:rgba(255,255,255,.94);--t2:rgba(255,255,255,.72);--t3:rgba(255,255,255,.52);--t4:rgba(255,255,255,.36);--hair:rgba(255,255,255,.08);--edge2:rgba(255,255,255,.12);--ice:#90BFF9;--king:#FDE725;--pos:#3ddc84;--neg:#ff5c5c;--purple:#A26BFF;--lav:#C9B8FF;--up:#26a69a;--down:#ef5350;--ease:cubic-bezier(.16,1,.3,1);--mono:"Roboto Mono",ui-monospace,monospace;--sans:"DM Sans",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--ctlb) var(--bg)}
body{margin:0;background:var(--bg);color:var(--t1);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
::selection{background:rgba(144,191,249,.32);color:#fff}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--ctlb);border-radius:8px}::-webkit-scrollbar-track{background:var(--bg)}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:6px}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{text-wrap:balance;font-weight:500;margin:0;letter-spacing:-.025em}
p{margin:0}
.num,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.page{overflow-x:clip}
.sent{position:absolute;top:0;height:8px;width:1px}
.wrap{max-width:1240px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap>*,.grid>*{min-width:0}
section{padding-block:120px}
h2{font-size:clamp(30px,4vw,40px);line-height:1.1}
.lede{color:var(--t2);font-size:17px;max-width:62ch;margin-top:14px}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:8px;font:500 14px/1 var(--sans);padding:10px 16px;border:1px solid var(--ice);background:rgba(144,191,249,.14);color:var(--t1);transition:background .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease)}
@media(hover:hover){.btn:hover{background:rgba(144,191,249,.22);transform:translateY(-1px)}}
.btn.lg{padding:14px 22px;font-size:15px;box-shadow:0 0 0 1px rgba(253,231,37,.45),0 12px 32px -12px rgba(144,191,249,.45)}
@media(hover:hover){.btn.lg:hover{box-shadow:0 0 0 1px rgba(253,231,37,.6),0 16px 40px -12px rgba(144,191,249,.6)}}
.btn.ghost{background:transparent;border-color:var(--edge2);color:var(--t2)}
.btn.ghost:hover{border-color:rgba(255,255,255,.24);color:var(--t1);background:rgba(255,255,255,.03)}
.frame{background:var(--s1);border:1px solid var(--edge2);border-radius:12px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.04) inset}
.cap{color:var(--t3);font-size:14px;margin-top:14px;max-width:60ch}
.settle{animation:settle .7s var(--ease) both}
@keyframes settle{from{transform:translateY(12px);filter:blur(4px);opacity:.92}to{transform:none;filter:none;opacity:1}}

/* nav */
.nav{position:sticky;top:0;z-index:50;height:64px;transition:background .3s,backdrop-filter .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(10,10,10,.72);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-color:var(--hair)}
.nav .wrap{height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:500;letter-spacing:.08em;font-size:15px}
.nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-size:14px;color:var(--t2)}
.nav ul a{position:relative;padding-block:6px;transition:color .2s}.nav ul a:hover{color:var(--t1)}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ice);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav ul a[aria-current="true"]{color:var(--t1)}.nav ul a[aria-current="true"]::after{transform:none}
.nav .right{display:flex;align-items:center;gap:18px;font-size:14px}
.nav .right .login{color:var(--t2)}
@media(max-width:860px){.nav ul{gap:0}.nav ul li:not(:nth-child(4)){display:none}}   /* J7-37: Pricing stays reachable from the phone nav */
@media(max-width:480px){.nav .wrap{gap:8px}.brand{font-size:14px;letter-spacing:.03em;gap:6px}.brand-caret{width:24px;height:24px}.nav .right{gap:10px}}
@media(max-width:400px){.nav .right .login{padding-left:.5rem;padding-right:.5rem}}   /* P-16: Log in stays visible at every width */

/* hero */
.hero{position:relative;padding-block:56px 96px;min-height:min(836px,calc(100vh - 64px));display:flex;align-items:center}
.hero::before{content:"";position:absolute;inset:-64px 0 0 0;background:radial-gradient(ellipse 70% 80% at 85% 0%,rgba(144,191,249,.11),transparent 60%),radial-gradient(ellipse 60% 70% at 0% 100%,rgba(162,107,255,.05),transparent 50%);pointer-events:none}
.hero .wrap{width:100%}
.hgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:center}
@media(min-width:1100px){.hgrid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px}}
.hero h1{font-size:44px;line-height:1.06;letter-spacing:-.03em}@media(min-width:1100px){.hero h1{font-size:50px}}@media(max-width:599px){.hero h1{font-size:36px}}
.hero .sub{color:var(--t2);font-size:18px;margin-top:22px;max-width:36ch}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.stage{position:relative;perspective:1600px}
.stage::before{content:"";position:absolute;left:15%;width:70%;bottom:-114px;height:90px;background:rgba(144,191,249,.22);filter:blur(70px);border-radius:50%;pointer-events:none}
.stage::after{content:"";position:absolute;inset:-60px -40% -80px 0;background:radial-gradient(ellipse at 50% 60%,transparent 45%,rgba(10,10,10,.5) 68%,transparent 100%);pointer-events:none;z-index:0}
.hgrid>.settle{position:relative;z-index:3}.stage{z-index:1}.stage::before{z-index:0}.hero h1{max-width:11ch}
.live{position:relative;z-index:1;transition:transform .6s var(--ease)}
@media(min-width:1100px){.live{width:115%;transform:rotateY(-5deg) rotateX(2deg);transform-origin:left center}.live:hover{transform:none}}
.chrome{height:36px;display:flex;align-items:center;gap:14px;padding:0 14px;border-bottom:1px solid var(--hair);background:var(--s2)}
.dots{display:flex;gap:6px}.dots i{width:8px;height:8px;border-radius:50%;background:var(--ctlb)}
.chrome .t{font:400 11px var(--mono);letter-spacing:.12em;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.pill{font:500 11px var(--mono);letter-spacing:.14em;color:var(--ice);border:1px solid rgba(144,191,249,.35);border-radius:6px;padding:3px 7px;display:flex;align-items:center;gap:6px}
.pill b{width:6px;height:6px;border-radius:50%;background:var(--ice);}
.clk{font:500 11px var(--mono);color:var(--t2);font-variant-numeric:tabular-nums}
.stl{height:22px;display:flex;justify-content:space-between;align-items:center;padding:0 14px;border-top:1px solid var(--hair);font:400 10px var(--mono);letter-spacing:.12em;color:var(--t3)}.stl b{font-weight:500;color:var(--t2)}
.frame.live:focus-visible{outline:2px solid var(--ice);outline-offset:2px}
.cap .on{display:block;font:400 12px var(--mono);color:var(--t3);margin-top:8px}
.c-fuel{color:#C9B8FF}.dm .msg2{font-size:12px;opacity:.6;margin-top:10px}.dm .msg2 span{color:var(--t3);margin-right:8px}
@keyframes pulse{50%{opacity:.25;transform:scale(.7)}}
.prog{height:1px;background:var(--hair)}.prog i{display:block;height:1px;width:0;background:var(--ice)}
canvas#cv{display:block;width:100%;height:clamp(300px,42vw,520px)}

/* argus */
.shot{position:relative;margin-top:44px}
.shot .frame{aspect-ratio:2480/2205}
.shot .frame img{width:100%;height:100%;object-fit:cover;object-position:center center}
.co{position:absolute;z-index:2;font-size:clamp(10px,.85vw,12px);color:var(--t2);background:rgba(25,27,33,.92);border:1px solid var(--edge2);border-radius:6px;padding:6px 9px;max-width:clamp(150px,15vw,220px);line-height:1.4}
.co b{color:var(--t1);font-weight:500}
.ring{position:absolute;z-index:2;width:8px;height:8px;border:1px solid var(--ice);border-radius:50%;transform:translate(-50%,-50%)}
.lead{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.lead line{stroke:rgba(255,255,255,.4);stroke-width:1;vector-effect:non-scaling-stroke}
.colist{display:none}
@media(max-width:599px){.co,.ring,.lead{display:none}.colist{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin:20px 0 0;padding:0;list-style:none;font-size:14px;color:var(--t2)}.colist b{display:block;color:var(--t1);font-weight:500}}
@media(max-width:520px){.colist{grid-template-columns:1fr}}
.layers{display:grid;gap:56px;margin-top:88px;align-items:start}
@media(min-width:960px){.layers{grid-template-columns:3fr 2fr}}
.layers h3{font-size:22px;margin-bottom:18px}
.lg{display:grid;gap:22px}
.gn{font:400 11px var(--mono);letter-spacing:.12em;color:var(--t3);text-transform:uppercase;margin-bottom:10px}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{font:400 13px/1.3 var(--sans);color:var(--t2);background:var(--s2);border:1px solid var(--ctlb);border-radius:6px;padding:5px 10px;transition:border-color .2s,color .2s}
.chips li:hover{border-color:var(--ice);color:var(--t1)}

/* beats */
.beats{display:grid;gap:56px}
@media(min-width:960px){.beats{grid-template-columns:1fr 1fr;gap:72px}.beats .stick{position:sticky;top:96px;align-self:start}}
.stick p{color:var(--t2);margin-top:18px;max-width:52ch}
.stick p strong{color:var(--t1);font-weight:500}
.phonecol{display:flex;justify-content:center;align-items:center;gap:40px}
.phone{width:calc(390px*.78 + 16px);border-radius:40px;padding:8px;background:var(--s3);border:1px solid var(--edge2);box-shadow:24px 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.03) inset;flex:none}
.phone img{border-radius:32px;width:100%}
@media(max-width:600px){.phone{width:calc(390px*.7 + 16px)}}
.beatlist{display:none;list-style:none;margin:0;padding:0;font:400 12px var(--mono);letter-spacing:.06em}
.beatlist li{padding:14px 0;border-top:1px solid var(--hair)}
.beatlist li span{display:block;color:var(--t4);margin-top:4px;font-size:11px}
@media(min-width:1100px){.beatlist{display:block}}

/* helix */
.hhead{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.arrows{display:flex;gap:8px}
.arrows button{width:40px;height:40px;border-radius:8px;border:1px solid var(--edge2);background:var(--ctl);color:var(--t2);cursor:pointer;display:grid;place-items:center;transition:transform .25s var(--ease),color .2s}
@media(hover:hover){.arrows button:hover{color:var(--t1);transform:translateY(-1px)}}
.rail{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;align-items:flex-start;margin-top:40px;padding-bottom:6px;scrollbar-width:none;padding-left:max(16px,calc((100vw - 1240px)/2 + 16px));padding-right:16px;scroll-padding-left:max(16px,calc((100vw - 1240px)/2 + 16px))}
.rail::-webkit-scrollbar{display:none}
.card{flex:none;width:clamp(320px,54vw,600px);scroll-snap-align:start}
@media(max-width:600px){.card{width:84vw}}
.rprog{position:relative;height:2px;background:var(--hair);margin-top:28px;border-radius:2px;overflow:hidden}.rprog i{position:absolute;top:0;left:0;height:100%;width:25%;background:var(--ice);border-radius:2px}
.card{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}@media(hover:hover){.card:hover{transform:translateY(-2px);box-shadow:0 34px 80px -34px rgba(144,191,249,.5)}}
.card{background:var(--s2);border:1px solid var(--edge2);border-radius:12px;padding:22px;box-shadow:0 30px 80px -40px rgba(144,191,249,.35)}
.card .hn{font:500 44px/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--t1)}
.card .hl{font-size:13px;color:var(--t2);margin:8px 0 18px}
@media(max-width:600px){.card .hn{font-size:34px}}
.crop{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:8px;background:var(--s1)}
.crop::after{content:"";position:absolute;inset:0;border:1px solid var(--edge2);border-radius:8px;background:linear-gradient(rgba(255,255,255,.05),transparent 40px);pointer-events:none;z-index:1}
.crop picture,.crop img{width:100%;height:100%}
.crop img{object-fit:cover;object-position:center;transform:scale(1.9)}
.crop.o-dp img{transform-origin:86% 30%}.crop.o-sg img{transform-origin:10% 30%}.crop.o-sg .co{left:auto;right:14px}.crop.o-st img{transform-origin:30% 55%}
.crop .co{left:14px;bottom:14px;max-width:none;display:block}
.card .cap{margin-top:16px}
.tape{display:flex;flex-direction:column;padding:12px;gap:4px;background:var(--s3);font:400 12px var(--mono);font-variant-numeric:tabular-nums;color:var(--t2)}
.tape .r{display:grid;grid-template-columns:92px 1fr 34px 52px 40px 30px;gap:8px;align-items:center;padding:5px 8px;border:1px solid transparent;border-radius:6px;white-space:nowrap}
.tape .r>span:nth-child(2){color:var(--t1)}.tape .r>span:nth-child(n+3){text-align:right}
.tape .r.hot{background:rgba(144,191,249,.12);border-color:var(--ice)}
.tk{display:flex;gap:3px;justify-content:flex-end}.tk i{width:4px;height:12px;border-radius:1px;background:var(--ice);opacity:.25;animation:tick 2.4s infinite}
.tk i:nth-child(2){animation-delay:.3s}.tk i:nth-child(3){animation-delay:.6s}
@keyframes tick{0%,10%{opacity:.25}15%,70%{opacity:1}85%,100%{opacity:.25}}
.tape .co{position:static;align-self:flex-start;margin:6px 0 2px;max-width:none}
.lf{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 12px 8px;background:var(--s3);border-top:1px solid var(--hair)}
.lf .k{font:500 11px var(--mono);letter-spacing:.14em;color:var(--t3);margin-right:4px}
.lf .p{font:400 11px var(--mono);color:var(--t2);border:1px solid var(--edge2);border-radius:6px;padding:3px 7px}
.cp{display:flex;gap:4px;width:100%;margin-top:6px;height:8px}.cp i{display:block;height:100%;border-radius:2px}
.cp .c{width:58%;background:var(--ice)}.cp .pu{width:42%;background:var(--lav)}
.cpl{display:flex;justify-content:space-between;width:100%;font:400 11px var(--mono);color:var(--t2)}
.ill{position:absolute;right:12px;top:8px;font:400 10px var(--mono);color:var(--t3);z-index:2}
.crop.g{aspect-ratio:auto;display:flex;flex-direction:column;background:var(--s3)}
.crop.g::after{background:linear-gradient(rgba(255,255,255,.05),transparent 40px)}
@media(max-width:600px){.tape .r{grid-template-columns:78px 1fr 28px 44px 0 0;font-size:11px}.tape .r>span:nth-child(n+5){display:none}}
@media(prefers-reduced-motion:reduce){.tk i{opacity:1}}

/* alerts */
.band{background:var(--band);border-block:1px solid var(--hair)}
.al{display:grid;gap:56px;margin-top:48px}
@media(min-width:900px){.al{grid-template-columns:5fr 7fr;gap:64px;align-items:center}}
.alists{display:grid;gap:40px}
.agfx{position:relative;display:grid;gap:18px;padding:32px 28px 40px;border:1px solid var(--hair);border-radius:18px;background:radial-gradient(ellipse 80% 70% at 70% 20%,rgba(144,191,249,.08),transparent 70%),var(--s1);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
@media(hover:hover){.agfx:hover{transform:translateY(-2px);box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}}
.agfx .ill{top:auto;bottom:12px;right:16px}
.dm{display:flex;gap:14px;background:var(--s2);border:1px solid var(--edge2);border-radius:12px;padding:16px 18px;box-shadow:0 20px 50px -24px rgba(0,0,0,.9);max-width:520px}
.dm .av{flex:none;width:40px;height:40px;border-radius:50%;background:var(--s3);border:1px solid var(--edge2);display:grid;place-items:center}
.dm .bd{min-width:0}
.dm .who{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}.dm .who b{font-weight:600;letter-spacing:.04em}.dm .who span{color:var(--t3);font-size:12px}.dm .who svg{color:var(--t3)}
.dm .msg{color:var(--t2);font-size:14px;margin-top:6px;line-height:1.5}.dm .msg b{font-weight:500}.c-king{color:var(--king)}.dm .lnk{color:var(--ice)}
.push{justify-self:end;width:min(100%,380px);background:var(--s3);border:1px solid var(--edge2);border-radius:18px;padding:14px 18px;box-shadow:0 24px 60px -24px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.03) inset}
.push .pt{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--t3)}.push .pt svg{color:var(--ice)}.push .pt b{color:var(--t1);font-weight:600;letter-spacing:.06em;flex:1}
.push p{font-size:14px;color:var(--t1);margin-top:6px}
@media(max-width:600px){.agfx{padding:20px 16px 36px}.push{justify-self:stretch}}
.atypes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.atypes li{padding:14px 0;border-top:1px solid var(--hair);color:var(--t2);font-size:15px}
@media(max-width:520px){.atypes{grid-template-columns:1fr}}
.deliv{list-style:none;margin:0;padding:0}
.deliv li{display:flex;gap:16px;align-items:flex-start;padding:16px 0;border-top:1px solid var(--hair)}
.deliv svg{flex:none;color:var(--ice);margin-top:2px}
.deliv b{font-weight:500;display:block}.deliv span{color:var(--t3);font-size:14px}

/* pricing */
.vs{margin-top:44px;display:grid;grid-template-columns:1fr 1.3fr;font-size:15px}
.vs div{padding:14px 0;border-top:1px solid var(--hair)}
.vs .h{font:500 11px var(--mono);letter-spacing:.14em;color:var(--t4);border-top:0;padding-bottom:10px}
.vs .old{color:var(--t4);text-decoration:line-through;text-decoration-color:rgba(255,92,92,.5);padding-right:24px}
.vs .new{color:var(--t1)}
@media(max-width:600px){.vs{grid-template-columns:1fr}.vs .old{border-top:1px solid var(--hair);padding-bottom:2px}.vs .new{border-top:0;padding-top:2px}.vs .h{display:none}}
.plans{margin-top:88px}
.free{display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;padding:20px 24px;border:1px solid var(--hair);border-radius:12px;background:var(--s1)}
.free .nm{font-weight:600;letter-spacing:.08em;font-size:13px}
.free .pr{font:500 20px var(--mono)}
.free .d{color:var(--t2);font-size:14px;flex:1;min-width:220px}
.free a{color:var(--ice);font-size:14px;font-weight:500}
.paid{display:grid;gap:20px;margin-top:20px;align-items:stretch}
@media(min-width:860px){.paid{grid-template-columns:1fr 1.1fr}}
.plan .btn{align-self:end;justify-self:start}
.for{display:block;font-size:13px;color:var(--t2);margin-top:8px}.free .for{margin-top:0}
.evc{font:500 11px var(--mono);letter-spacing:.08em;color:var(--king);background:rgba(253,231,37,.12);border-radius:6px;padding:3px 7px;margin-left:8px;vertical-align:1px}
.plan{display:grid;grid-template-rows:auto 1fr auto;align-content:start;transition:transform .25s var(--ease),box-shadow .25s var(--ease);border:1px solid var(--edge2);border-radius:12px;padding:32px;background:var(--s1)}
.plan.whale{background:var(--s2);border-color:var(--ice);box-shadow:0 24px 60px -30px rgba(144,191,249,.35)}
.plan .nm{font-weight:600;letter-spacing:.08em;font-size:13px;color:var(--t2)}
.plan .pr{font:500 44px/1 var(--mono);margin-top:16px;letter-spacing:-.02em}
.plan .pr small{font-size:15px;color:var(--t3);letter-spacing:0}
.plan.whale .pr{color:var(--king)}
.plan .yr{color:var(--t3);font-size:14px;margin-top:8px}
.plan ul{list-style:none;padding:0;margin:24px 0 28px;align-self:start}
@media(hover:hover){.plan:hover{transform:translateY(-2px);box-shadow:0 28px 60px -30px rgba(0,0,0,.9)}.plan.whale:hover{box-shadow:0 30px 70px -28px rgba(144,191,249,.5)}}
.plan li{padding:9px 0;border-top:1px solid var(--hair);font-size:15px;color:var(--t2)}
.plan li:first-child{color:var(--t1)}
.foot{color:var(--t4);font-size:13px;margin-top:20px}

/* faq */
.faq{display:grid;gap:40px}
@media(min-width:900px){.faq{grid-template-columns:1fr 2fr;gap:80px}}
details{border-top:1px solid var(--hair)}
details:last-child{border-bottom:1px solid var(--hair)}
summary{list-style:none;cursor:pointer;padding:20px 12px;margin-inline:-12px;border-radius:8px;transition:background .2s;display:flex;justify-content:space-between;gap:16px;font-size:17px;font-weight:500}
summary:hover{background:var(--s1)}
summary::-webkit-details-marker{display:none}
summary svg{flex:none;color:var(--t3);transition:transform .3s var(--ease)}
details[open] summary svg{transform:rotate(180deg)}
details p{color:var(--t2);padding:0 0 22px;max-width:62ch}

/* cta + footer */
.cta{position:relative;text-align:center;padding-block:140px;border-top:1px solid var(--hair);overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 90% at 50% 0%,rgba(144,191,249,.09),transparent 60%);pointer-events:none}
.cta h2{font-size:clamp(34px,5vw,56px);position:relative}
.cta-b{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:36px;position:relative}
.cta .btn.ghost{box-shadow:none}
.cta-n{position:relative;color:var(--t3);font-size:13px;margin-top:18px}
footer{border-top:1px solid var(--hair);padding-block:64px 40px;font-size:14px}
.fg{display:grid;gap:40px;grid-template-columns:1fr}
@media(min-width:760px){.fg{grid-template-columns:1.4fr repeat(5,1fr)}}
.cols{display:contents}
@media(max-width:759px){.cols{display:grid;grid-template-columns:1fr 1fr;gap:32px}}
footer h4{margin:0 0 12px;font-weight:500;font-size:14px}
footer ul{list-style:none;margin:0;padding:0}
footer li{padding:4px 0;color:var(--t3)}footer li a:hover{color:var(--t1)}
.legal{margin-top:56px;padding-top:24px;border-top:1px solid var(--hair);color:var(--t4);font-size:13px;display:grid;gap:6px}


/* port additions */
picture{display:block}
.hero .ctas .btn.ghost{box-shadow:none}
.cap.sm{font-size:12px;margin-top:12px}
.fig0{margin:0}
.sec-tight{padding-top:40px}
.beatlist .c-ice{color:var(--ice)}.beatlist .c-king{color:var(--king)}.beatlist .c-lav{color:var(--lav)}.beatlist .c-neg{color:var(--neg)}
.co.p-rb{left:42%;top:19%}.co.p-ro{left:10%;top:63%}.co.p-rk{left:56%;top:35%}.co.p-re{left:63%;top:77%;max-width:210px}
.ring#rb{left:28.2%;top:15.4%}.ring#ro{left:58%;top:66%}.ring#rk{left:89.1%;top:59%}.ring#re{left:59.9%;top:88.5%}
/* real-data strip under the hero */
.lp-stats-band{border-block:1px solid var(--hair);background:var(--band)}
.lp-stats{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:minmax(0,1.25fr);gap:0;margin:0;padding:0}
.lp-head,.lp-stat{padding:22px 24px;min-width:0}
.lp-head{display:flex;flex-direction:column;justify-content:center}
.lp-head .h{font:500 14px/1.3 var(--sans);color:var(--t1)}.lp-head .s{font-size:12px;color:var(--t3);margin-top:4px}
.lp-stat{border-left:1px solid var(--hair);display:flex;flex-direction:column}
.lp-stat .k{order:2;font:400 10px/1.4 var(--mono);letter-spacing:.12em;color:var(--t3);text-transform:uppercase;margin-top:8px}
.lp-stat .v{order:0;font:500 30px/1.1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap}
.lp-stat .t{order:1;font-size:12px;color:var(--t3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1000px){.lp-stats{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}.lp-head{grid-column:1/-1;padding-bottom:10px}.lp-stat{border-top:1px solid var(--hair)}.lp-stat:nth-of-type(3n+1){border-left:0}}
@media(max-width:600px){.lp-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.lp-head{padding:18px 16px 10px}.lp-stat{padding:16px}.lp-stat:nth-of-type(3n+1){border-left:1px solid var(--hair)}.lp-stat:nth-of-type(odd){border-left:0}}
.score{font:400 12px var(--mono);color:var(--t3);margin-top:6px;letter-spacing:.04em}
/* plan include lists */
.free .d .fl{display:inline;list-style:none;margin:0;padding:0}
.free .d .fl li{display:inline}
.free .d .fl li+li::before{content:" \00B7 ";color:var(--t4)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.tl{margin-bottom:40px}.tl-t{font:400 12px var(--mono);color:var(--t3);margin-bottom:22px}
.tl-s{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:20px;position:relative;padding:0;margin:0}
.tl-s::before{content:"";position:absolute;left:0;right:0;top:26px;height:1px;background:var(--hair)}
.tl-s li{position:relative;display:flex;flex-direction:column;gap:6px;--c:var(--t3)}
.tl-s time{font:400 11px var(--mono);color:var(--t3);height:16px}
.tl-s i{width:8px;height:8px;border-radius:50%;background:var(--c);margin:3px 0 8px;position:relative}
.tl-s b{font:500 11px var(--mono);letter-spacing:.12em;color:var(--c)}
.tl-s p{font-size:13px;color:var(--t2);margin:0}
.tl-s .oc{align-self:flex-start;font:500 11px var(--mono);letter-spacing:.08em;color:var(--pos);border:1px solid var(--hair);border-radius:6px;padding:2px 6px}
.c-ice{--c:var(--ice)}.c-neg{--c:var(--neg)}.c-lav{--c:var(--lav)}.c-king{--c:var(--king)}.c-t3{--c:var(--t3)}
@media(max-width:899px){.tl-s{grid-template-columns:1fr;gap:18px;padding-left:22px}.tl-s::before{left:3px;right:auto;top:0;bottom:0;width:1px;height:auto}.tl-s i{position:absolute;left:-22px;top:4px;margin:0}}
.ladder{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:14px}
.ladder li{display:grid;grid-template-columns:3px 1fr;column-gap:14px;row-gap:2px}
.ladder i{grid-row:1/3;background:var(--c);border-radius:2px}
.ladder b{font:500 15px var(--sans);color:var(--t1)}.ladder p{font-size:14px;color:var(--t2);margin:0}
.ladder-n{font-size:14px;color:var(--t2);margin-top:18px}
.term{display:flex;flex-direction:column;align-items:flex-end;gap:6px;margin:24px 0 12px}
@media(max-width:600px){.term{align-items:flex-start}}
.seg{display:inline-flex;border:1px solid var(--ctlb);border-radius:8px;padding:2px;background:var(--ctl)}
.seg button{font:500 13px var(--sans);color:var(--t3);background:none;border:0;border-radius:6px;padding:6px 14px;cursor:pointer}
.seg button[aria-checked="true"]{color:var(--t1);background:var(--s3)}
.term-n{font-size:12px;color:var(--t3);margin:0}
.ffm-c{list-style:none;padding:0;margin:24px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.ffm-c li{border-top:1px solid var(--hair);padding-top:16px;display:flex;flex-direction:column;gap:6px}
.ffm-c span{font:500 12px var(--mono);color:var(--ice)}.ffm-c b{font:500 16px var(--sans);color:var(--t1)}.ffm-c p{font-size:14px;color:var(--t2);margin:0}
@media(max-width:899px){.ffm-c{grid-template-columns:1fr;gap:18px}}
/* B-05/B-06 phone: no text under 11px, and 40px tap height on Log in, the CTAs, the billing toggle and footer links */
@media(max-width:480px){
.pill,.stl,.lf .k,.ill,.lp-stat .k,.tl-s .oc{font-size:12px}.co{font-size:12px}
.nav .right .login,.free a,footer li a{display:inline-flex;align-items:center;min-height:40px}
footer li{padding:0}
.seg button{min-height:40px}
.nav .right .btn,.hero .ctas .btn,.plan .btn{min-height:40px}   /* nav Start free + Try Retail free were 36px on 390 */
}