:root{--bg:#05070a;--bg2:#0a0e12;--card:rgba(255,255,255,.03);--card2:rgba(255,255,255,.055);--bd:rgba(255,255,255,.08);--bd2:rgba(255,255,255,.16);--ink:#f2f6f4;--mute:#8e9d97;--mute2:#7f8d88;--acc:#19d3a2;--acc2:#b6f23a;--acc3:#8b5cf6;--r:20px;--fd:"Bricolage Grotesque",system-ui,sans-serif;--fb:"Instrument Sans",system-ui,sans-serif;--fm:"JetBrains Mono",ui-monospace,monospace;
/* Premium layer tokens: the two neon brand accents used for glows and halos.
   --glass stays a light translucent wash, not a dark one, so tiles and cards
   still read as raised surfaces against the near-black page. The frosting
   comes from the backdrop-filter blur, which lets the background blobs glow
   through without darkening them. */
--neon1:#b5ff1f;--neon2:#00e5ff;--glass:rgba(255,255,255,.045);--glass-bd:rgba(255,255,255,.10);--halo:0 0 0 1px rgba(255,255,255,.06),0 24px 70px -30px rgba(0,0,0,.9);
color-scheme:dark}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:80px;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}body{background:var(--bg);color:var(--ink);font:400 16.5px/1.65 var(--fb);overflow-x:hidden;min-height:100vh;position:relative}body::before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.04;pointer-events:none;z-index:1;mix-blend-mode:overlay}.blobs{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}.blob{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(closest-side,currentColor,transparent 72%);opacity:.24}.b1{color:#19d3a2;top:-180px;left:-120px;animation:d1 24s ease-in-out infinite}.b2{color:#8b5cf6;top:30%;right:-200px;animation:d2 30s ease-in-out infinite}.b3{color:#b6f23a;bottom:-200px;left:35%;animation:d1 27s ease-in-out infinite reverse}@keyframes d1{50%{transform:translate(120px,80px) scale(1.15)}}@keyframes d2{50%{transform:translate(-140px,60px) scale(1.2)}}.wrap{max-width:1180px;margin:0 auto;padding:0 24px;position:relative;z-index:3}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}header{position:fixed;top:0;left:0;right:0;z-index:100;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid transparent;transition:background .3s,border-color .3s}header.sc{background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom-color:var(--bd)}header .wrap{display:flex;justify-content:space-between;align-items:center;height:72px}.logo{display:flex;align-items:center;gap:11px;font:700 21px var(--fd);letter-spacing:-.025em}.logo-mark{width:36px;height:36px;flex-shrink:0;filter:drop-shadow(0 6px 18px rgba(25,211,162,.35));transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.logo:hover .logo-mark{transform:rotate(-12deg) scale(1.06)}nav{display:flex;align-items:center;gap:6px}nav a{color:var(--mute);font-size:14.5px;font-weight:500;padding:8px 14px;border-radius:999px;transition:.2s}nav a:hover{color:var(--ink);background:var(--card2)}.nc{background:var(--acc)!important;color:#041008!important;font-weight:700;margin-left:8px}
.nav-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;padding:0;flex-shrink:0;border:1px solid var(--bd);border-radius:12px;background:var(--card);color:var(--ink);cursor:pointer;transition:.2s}
.nav-toggle:hover{border-color:var(--bd2);background:var(--card2)}
.nav-toggle svg{width:20px;height:20px}
.nav-toggle .x{display:none}
.nav-toggle[aria-expanded="true"] .x{display:block}
.nav-toggle[aria-expanded="true"] .b{display:none}
@media(max-width:760px){
.nav-toggle{display:inline-flex}
#mnav{position:absolute;top:calc(100% + 8px);left:24px;right:24px;flex-direction:column;align-items:stretch;gap:2px;padding:10px;display:none;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid var(--bd);border-radius:16px;box-shadow:0 30px 60px -18px rgba(0,0,0,.75)}
#mnav.open{display:flex}
#mnav a{padding:11px 14px;font-size:15px;border-radius:12px}
#mnav a.nc{margin-left:0;margin-top:6px;text-align:center}
}.btn,.buy{display:inline-flex;align-items:center;gap:9px;border-radius:999px;font-weight:700;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s,filter .2s;white-space:nowrap}.btn{padding:15px 26px;font-size:15.5px}.bp{background:var(--acc);color:#041008;box-shadow:0 14px 40px -12px var(--acc)}.bp:hover{transform:translateY(-2px);box-shadow:0 20px 50px -12px var(--acc)}.bg{background:var(--card2);border:1px solid var(--bd)}.bg:hover{border-color:var(--bd2)}.btn svg{width:17px;height:17px}.eb{display:inline-flex;align-items:center;gap:9px;padding:7px 14px 7px 11px;background:#14181c;border:1px solid var(--bd);border-radius:999px;font:500 13px var(--fm);color:var(--mute);margin-bottom:24px}.eb i{width:7px;height:7px;border-radius:50%;background:var(--acc);animation:rg 2s ease-out infinite}@keyframes rg{0%{box-shadow:0 0 0 0 rgba(25,211,162,.6)}100%{box-shadow:0 0 0 12px rgba(25,211,162,0)}}.eb b{color:var(--ink);font-weight:600}.hero{min-height:100vh;padding:150px 0 60px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;position:relative;z-index:3}.hi{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}@media(max-width:960px){.hi{grid-template-columns:1fr;gap:50px;text-align:center}.hero .eb{margin-inline:auto}.hero p{margin-inline:auto}.ha,.ht{justify-content:center}}h1,h2,h3{font-family:var(--fd)}.hero h1{font:800 clamp(46px,7.4vw,104px)/.94 var(--fd);letter-spacing:-.045em;margin-bottom:26px}.gr{background:linear-gradient(120deg,var(--acc),var(--acc2) 45%,var(--acc3));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:200% 100%;animation:gs 6s ease-in-out infinite}@keyframes gs{50%{background-position:100% 50%}}.hero p{font-size:18.5px;color:var(--mute);max-width:34em;margin-bottom:32px;line-height:1.55}.ha{display:flex;gap:14px;flex-wrap:wrap}.ht{display:flex;gap:20px;flex-wrap:wrap;margin-top:34px;font:400 13px var(--fm);color:var(--mute2)}.ht span,.ht a{display:inline-flex;align-items:center;gap:7px}.ht svg{width:14px;height:14px;color:var(--acc)}
.ht a{color:inherit;text-decoration:none;border-bottom:1px solid var(--bd2)}
.dw{position:relative;height:520px;perspective:1400px;perspective-origin:50% 45%;display:grid;place-items:center}@media(max-width:960px){.dw{height:380px}}.deck{position:relative;width:220px;height:330px;transform-style:preserve-3d}@media(max-width:960px){.deck{width:150px;height:225px}}.dc{position:absolute;inset:0;border-radius:16px;overflow:hidden;background:var(--bg2);box-shadow:0 30px 80px -20px rgba(0,0,0,.7),0 0 60px -10px var(--c)}.dc img{width:100%;height:100%;object-fit:cover}.chip{position:absolute;padding:8px 14px;background:rgba(10,14,18,.85);border:1px solid var(--bd2);border-radius:999px;font:500 12.5px var(--fm);backdrop-filter:blur(12px);animation:fl 5s ease-in-out infinite;z-index:4}@keyframes fl{50%{transform:translateY(-10px)}}.c1{top:8%;left:-4%}.c2{top:40%;right:-8%;animation-delay:1.4s}.c3{bottom:14%;left:-2%;animation-delay:2.8s}@media(max-width:960px){.chip{display:none}}section{padding:100px 0;position:relative;z-index:3}@media(max-width:720px){section{padding:70px 0}}.sh{margin-bottom:48px;max-width:720px}.sh h2{font:800 clamp(36px,5.6vw,66px)/1 var(--fd);letter-spacing:-.042em;margin-bottom:16px}.sh h2 em{font-style:normal;background:linear-gradient(120deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.sh p{color:var(--mute);font-size:17.5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent)}@media(max-width:720px){.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(-n+2){border-bottom:1px solid var(--bd)}.stat:nth-child(2){border-right:0}}.stat{padding:30px 26px;border-right:1px solid var(--bd)}.stat:last-child{border-right:0}.sv{font:800 clamp(34px,4.4vw,52px)/1 var(--fd);letter-spacing:-.03em;margin-bottom:8px}.sv small{font:500 .38em var(--fm);color:var(--acc);margin-left:4px}.sl{font:500 12.5px var(--fm);color:var(--mute2);text-transform:uppercase;letter-spacing:.08em}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;perspective:1800px}@media(max-width:980px){.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.grid{grid-template-columns:1fr}}.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:border-color .4s,box-shadow .4s,transform .5s cubic-bezier(.2,.8,.2,1),opacity .6s;opacity:0;transform:translateY(50px) rotateX(8deg)}.card.rv{opacity:1;transform:none}.card:hover{border-color:var(--c);box-shadow:0 40px 80px -30px var(--c),0 0 0 1px var(--c)}.ci{padding:20px;display:flex;flex-direction:column;height:100%}.cv{position:relative;border-radius:14px;overflow:hidden;margin-bottom:20px;aspect-ratio:440/560;background:var(--bg2);box-shadow:0 20px 50px -20px var(--c)}.cv img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.card:hover .cv img{transform:scale(1.06)}.tag{position:absolute;top:12px;left:12px;padding:5px 11px;background:rgba(5,7,10,.78);backdrop-filter:blur(10px);border:1px solid var(--c);color:var(--c);border-radius:999px;font:600 11px var(--fm);text-transform:uppercase;z-index:2}.card h3{font:700 19px/1.28 var(--fd);letter-spacing:-.02em;margin-bottom:10px}.card h3 a:hover{color:var(--c)}.card p{color:var(--mute);font-size:14.5px;line-height:1.55;margin-bottom:20px;flex:1}.cf{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:18px;border-top:1px solid var(--bd)}.price{font:800 26px/1 var(--fd);letter-spacing:-.02em;display:flex;align-items:baseline;gap:4px}.price small{font:500 11.5px var(--fm);color:var(--mute2)}.buy{padding:11px 18px;background:var(--c);color:#041008;font:700 14px var(--fb);box-shadow:0 10px 26px -10px var(--c)}.buy:hover{transform:translateY(-2px) scale(1.03);filter:brightness(1.08)}.samples{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}@media(max-width:900px){.samples{grid-template-columns:1fr}}.sm{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:14px}.sm h3{font:700 18px var(--fd)}.sm pre{white-space:pre-wrap;font:400 13.5px/1.6 var(--fm);color:var(--ink);background:rgba(0,0,0,.35);border:1px solid var(--bd);border-radius:12px;padding:16px;flex:1}.cp{align-self:flex-start;padding:9px 16px;border-radius:999px;background:var(--card2);border:1px solid var(--bd);font:600 13px var(--fb)}.cp:hover{border-color:var(--acc);color:var(--acc)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}@media(max-width:820px){.steps{grid-template-columns:1fr}}.step{padding:30px 28px;background:var(--card);border:1px solid var(--bd);border-radius:var(--r);transition:.3s}.step:hover{border-color:var(--bd2);transform:translateY(-4px)}.sn{font:500 12px var(--fm);color:var(--acc);letter-spacing:.15em;margin-bottom:14px}.step h3{font:700 20px var(--fd);margin-bottom:8px}.step p{color:var(--mute);font-size:15px}.faq{max-width:820px}.faq details{border-bottom:1px solid var(--bd)}.faq details:first-of-type{border-top:1px solid var(--bd)}.faq summary{list-style:none;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:22px;cursor:pointer;font:600 17.5px/1.4 var(--fd)}.faq summary:hover{color:var(--acc)}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font:400 24px var(--fm);color:var(--acc);transition:transform .3s}.faq details[open] summary::after{transform:rotate(45deg)}.faq p{color:var(--mute);font-size:15.5px;padding:0 40px 24px 0;max-width:52em}.final{text-align:center;padding:90px 0 40px}.final h2{font:800 clamp(42px,7.2vw,86px)/.98 var(--fd);letter-spacing:-.048em;margin:0 auto 20px;max-width:15em}.final p{color:var(--mute);font-size:18px;max-width:34em;margin:0 auto 32px}.final .ha{justify-content:center}footer{padding:56px 0 44px;border-top:1px solid var(--bd);position:relative;z-index:3;margin-top:50px}.ft{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:40px}.fb p{color:var(--mute2);font-size:14px;max-width:340px;margin-top:14px}.fc .fh{font:600 12px var(--fm);color:var(--mute2);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}.fc a{display:block;color:var(--mute);font-size:14px;padding:5px 0}.fc a:hover{color:var(--acc)}.fl{display:flex;gap:60px;flex-wrap:wrap}.fd{padding-top:26px;border-top:1px solid var(--bd);font:400 12.5px/1.65 var(--fm);color:var(--mute2)}.fd p+p{margin-top:8px}.crumbs{font-size:14px;color:var(--mute);padding-top:110px}.crumbs a:hover{color:var(--acc)}.pp{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;padding:26px 0 50px;align-items:start}@media(max-width:780px){.pp{grid-template-columns:1fr}}.pp img{width:100%;border-radius:18px;box-shadow:0 30px 70px -25px var(--c)}.pp h1{font:800 clamp(34px,5.2vw,58px)/1.02 var(--fd);letter-spacing:-.038em;margin-bottom:16px}.pp .lead{color:var(--mute);font-size:18px;margin-bottom:22px}.pp h2{font:700 22px var(--fd);margin-bottom:8px}.pp ul{padding-left:20px;margin:0 0 22px}.pp li{margin:6px 0}.row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.pp .buy{padding:14px 26px;font-size:16px}.rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:16px}.rel a{border:1px solid var(--bd);border-radius:14px;padding:16px;font-weight:600;background:var(--card)}.rel a:hover{border-color:var(--acc)}.pw h2{font:800 clamp(30px,4vw,46px)/1.1 var(--fd);letter-spacing:-.035em}@media(max-width:780px),(hover:none){.blob{animation:none}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.card{opacity:1;transform:none}}html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-stopped{overflow:hidden}.ci{transform-style:preserve-3d}.legal{max-width:760px;padding:10px 0 70px}.legal h1{font:800 clamp(32px,5vw,52px)/1.05 var(--fd);letter-spacing:-.035em;margin-bottom:12px}.legal .upd{color:var(--mute2);font:400 13px var(--fm);margin-bottom:28px}.legal h2{font:700 22px var(--fd);margin:30px 0 6px}.legal p,.legal li{color:var(--mute);margin:8px 0}.legal ul{padding-left:22px}.legal a{color:var(--acc);text-decoration:underline}.fbn-w{margin:30px auto}.fbn{background:#0a0a0a;border:1px solid #d4af37;border-radius:20px;padding:26px 34px;display:flex;align-items:center;justify-content:center;gap:36px;box-shadow:0 0 70px -28px #d4af37}.fbn img{width:150px;height:auto;border-radius:12px;flex-shrink:0}.fbn-t{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.fbn-h{font:800 clamp(26px,4vw,42px)/1.1 var(--fd);color:#d4af37;letter-spacing:-.03em}.fbn-p{color:#fff;font-size:18px}.fbn-b{display:inline-block;background:#d4af37;color:#0a0a0a;font-weight:700;padding:14px 30px;border-radius:999px;margin-top:6px;transition:transform .25s cubic-bezier(.34,1.56,.64,1),filter .2s}.fbn-b:hover{transform:translateY(-2px);filter:brightness(1.1)}@media(max-width:640px){.fbn{flex-direction:column;padding:24px 20px;gap:18px}.fbn img{width:130px}}.logo-mark{object-fit:contain}.lk{max-width:520px;margin:0 auto;padding:60px 20px 50px;text-align:center;position:relative;z-index:3;min-height:100vh;display:flex;flex-direction:column;align-items:center}.lk .lg{display:flex;align-items:center;gap:12px;font:800 28px var(--fd);letter-spacing:-.03em;margin-bottom:12px}.lk .lg img{width:56px;height:56px;filter:drop-shadow(0 8px 24px rgba(25,227,214,.4))}.lk .in{color:#c9c9d1;margin-bottom:28px}.lk .bt{display:block;width:100%;text-align:left;padding:16px 20px;margin-bottom:12px;border-radius:16px;border:1px solid transparent;background:linear-gradient(#141418,#141418) padding-box,linear-gradient(90deg,#9dff2f,#19e3d6,#ff2fd0) border-box;font-weight:600;font-size:16.5px;color:#fff;transition:transform .25s,box-shadow .25s}.lk .bt:hover{transform:translateY(-2px);box-shadow:0 14px 34px -14px #19e3d6}.lk .ft{margin-top:auto;padding-top:34px;color:#8b8b96;font-size:14px}.lk .ft a{color:#9dff2f;display:block;margin-top:6px}.skip{position:absolute;left:-9999px;top:0;background:var(--acc);color:#041008;padding:10px 16px;font-weight:700;z-index:1000;border-radius:0 0 10px 0}.skip:focus{left:0}.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}.bc{display:block;background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:24px;transition:.3s}.bc:hover{border-color:var(--acc);transform:translateY(-3px)}.bc h2,.bc h3{font:700 21px/1.25 var(--fd);letter-spacing:-.02em;margin:10px 0 8px}.bc p{color:var(--mute);font-size:15px}.tg{font:500 12px var(--fm);color:var(--acc);text-transform:uppercase;letter-spacing:.08em}.pr{margin:14px 0 22px}.pr pre{white-space:pre-wrap;font:400 14px/1.6 var(--fm);color:var(--ink);background:rgba(0,0,0,.35);border:1px solid var(--bd);border-radius:12px;padding:16px}.pr .cp{margin-top:10px}.legal h3{font:700 18px var(--fd);margin:22px 0 4px}.legal strong{color:var(--ink)}.cta-box{margin-top:44px;padding:26px;border:1px solid var(--bd);border-radius:var(--r);background:var(--card)}.cta-box h2{margin-top:0}.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}.ctas .buy{text-decoration:none;color:#041008}.chk{list-style:none;padding:0;margin:14px 0}.chk li{position:relative;padding:7px 0 7px 30px;color:var(--mute)}.chk li::before{content:"";position:absolute;left:2px;top:13px;width:14px;height:8px;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg)}.th{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:20px 0 30px}@media(max-width:820px){.th{grid-template-columns:1fr}}.th h1{font:800 clamp(38px,6.2vw,74px)/1 var(--fd);letter-spacing:-.042em;margin-bottom:18px}.th .lead{color:var(--mute);font-size:18.5px;margin-bottom:24px}.mini{font-size:14px;color:var(--mute2);margin-top:14px}.mini a{color:var(--acc);text-decoration:underline}.tf{margin:0}.tf img{width:100%;height:auto;border-radius:20px;box-shadow:0 30px 80px -30px #d92027}.tf figcaption{font:400 12px var(--fm);color:var(--mute2);margin-top:8px;text-align:center}.tb{list-style:none;padding:0;margin:10px 0 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.tb li{padding:14px 16px;border:1px solid var(--bd);border-radius:14px;background:var(--card);font-weight:600;font-size:15px}.ts{padding:36px 0}.ts h2{font:800 clamp(28px,4.2vw,44px)/1.08 var(--fd);letter-spacing:-.035em;margin-bottom:10px}.pbox{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap;padding:30px;border:1px solid #d92027;border-radius:var(--r);background:linear-gradient(160deg,rgba(217,32,39,.14),rgba(255,255,255,.02));box-shadow:0 30px 70px -40px #d92027}.ftc{display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr);opacity:0;transform:translateY(50px) rotateX(8deg)}.ftc-i{position:relative;display:block}.ftc-i img{width:100%;height:100%;object-fit:cover}.ftc-t{padding:30px;display:flex;flex-direction:column;gap:12px;justify-content:center}.ftc-t h3{font:700 28px/1.15 var(--fd);letter-spacing:-.025em}.ftc-t p{color:var(--mute)}@media(max-width:760px){.ftc{grid-template-columns:1fr}.ftc-i img{height:auto;max-height:340px}}.bt.feat{border-width:2px;font-weight:700;box-shadow:0 14px 40px -20px #ff2fd0}@media(prefers-reduced-motion:reduce){.ftc{opacity:1;transform:none}}.hero{min-height:auto;padding:150px 0 30px}.hi{grid-template-columns:1fr!important;text-align:center;justify-items:center}.hero .eb{margin-inline:auto}.hero p{margin-inline:auto}.ha,.ht{justify-content:center}.hero h1{max-width:14em}.shw{height:380vh;padding:0;position:relative;z-index:3}.shw-s{position:sticky;top:0;height:100vh;padding:84px 0 18px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;overflow:hidden}.shw-t{font:800 clamp(26px,4.4vw,46px)/1.05 var(--fd);letter-spacing:-.035em;text-align:center}.shw-t em{font-style:normal;background:linear-gradient(120deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.shw-stage{perspective:1200px;flex:1;display:grid;place-items:center;width:100%;min-height:0}.shw-ring{position:relative;transform-style:preserve-3d}.shw-ring img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px;backface-visibility:hidden;box-shadow:0 0 50px -10px var(--c)}.shw-cap{text-align:center;padding:0 20px}.shw-n{font:700 clamp(18px,3vw,24px)/1.2 var(--fd);letter-spacing:-.02em}.shw-p{color:var(--mute);margin:4px 0 12px;font:500 14px var(--fm)}.shw-dots{display:flex;gap:10px;padding-top:14px}.shw-dots button{width:24px;height:24px;padding:0;border-radius:50%;background:none;display:grid;place-items:center;transition:.25s}.shw-dots button::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--bd2);transition:.25s}.shw-dots button.on::before{background:var(--acc);transform:scale(1.5)}@media(prefers-reduced-motion:reduce){.shw{height:auto}.shw-s{position:static;height:auto;padding:64px 0 40px}.shw-stage{perspective:none;min-height:0}.shw-ring{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px;width:100%!important;height:auto!important;transform:none!important}.shw-ring img{position:static;inset:auto;width:100%;height:auto;box-shadow:0 18px 44px -22px var(--c)}.shw-cap,.shw-dots{display:none}}.ftc-i{align-self:start}.ftc-i img{width:100%;height:auto!important;max-height:none!important;object-fit:contain!important}.cv{aspect-ratio:440/656!important}.cv img{object-fit:contain!important}.shw-ring img{object-fit:contain;background:#0a0a0c}.toc{margin:22px 0 28px;padding:18px 22px;border:1px solid var(--bd);border-radius:16px;background:var(--card)}.toc ol{margin:10px 0 0;padding-left:22px;columns:2;column-gap:30px}@media(max-width:640px){.toc ol{columns:1}}.toc li{margin:5px 0;break-inside:avoid}.toc a{color:var(--ink);text-decoration:none}.toc a:hover{color:var(--acc)}.legal table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15px}.legal th,.legal td{border:1px solid var(--bd);padding:10px 12px;text-align:left;color:var(--mute)}.legal th{color:var(--ink);background:var(--card)}.legal ol{padding-left:22px}.legal .warn{margin:10px 0 18px}.ftc.ls{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ftc+.ftc{margin-top:26px}@media(max-width:760px){.ftc.ls{grid-template-columns:1fr}}.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.shots figure{margin:0}.shots img{width:100%;height:auto;border-radius:14px;border:1px solid var(--bd)}.shots figcaption{font:400 13px var(--fm);color:var(--mute2);margin-top:8px}.flow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.flow span{padding:8px 14px;border:1px solid var(--bd);border-radius:999px;background:var(--card);font:500 14px var(--fm)}.flow i{color:var(--acc);font-style:normal}.trust-badges{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 14px}.trust-badge{display:inline-flex;align-items:center;padding:8px 12px;border:1px solid var(--bd);border-radius:999px;background:var(--card2);color:var(--mute);font:500 12.5px/1.35 var(--fb)}.trust-badge::before{content:"✓";color:var(--acc);font-weight:700;margin-right:7px}.purchase-row{gap:16px;margin-top:18px}.price-stack{display:flex;align-items:baseline;gap:10px}.compare-price{color:var(--mute2);font:500 13px var(--fm)}.compare-price del{opacity:.8}.pp .buy{white-space:normal;text-align:center;justify-content:center;max-width:100%}.preview-intro{max-width:760px;margin-bottom:20px}.preview-intro h2{margin:0 0 10px}.preview-intro>p:last-child{color:var(--mute);font-size:16px}.preview-eyebrow{font:500 12px var(--fm);letter-spacing:.12em;color:var(--acc);margin-bottom:9px}.preview-card{max-width:820px}.preview-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.preview-tag{font:500 12px var(--fm);letter-spacing:.06em;color:var(--acc)}.preview-label{font:500 12px var(--fm);color:var(--mute2)}.preview-card pre{overflow-wrap:anywhere}.preview-disclaimer{color:var(--mute2);font-size:13px;line-height:1.5}.preview-cta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:20px}.preview-cta p{color:var(--mute);font-size:15px}@media(max-width:560px){.trust-badges{gap:7px}.trust-badge{font-size:11.5px;padding:7px 9px}.purchase-row{align-items:flex-start}.purchase-row .buy{width:100%}.preview-cta .buy{white-space:normal;text-align:center;justify-content:center}}

/* ==========================================================================
   PREMIUM LAYER
   Bento grids, glassmorphism, neon depth, kinetic type, scroll reveal,
   magnetic CTAs, the trust stack and the opt-in email gate.

   Everything here is additive: it introduces new classes or refines existing
   ones at equal-or-later specificity. Deleting this block restores the
   previous design, so it stays safe to revert in one piece.
   ========================================================================== */

/* --- Bento grids --------------------------------------------------------- */
.bento{display:grid;gap:18px}
@media(min-width:781px){
  .bento{grid-template-columns:repeat(6,1fr)}
  .bt-xl{grid-column:span 4}
  .bt-lg{grid-column:span 3}
  .bt-md{grid-column:span 2}
}
@media(max-width:780px){
  .bento{grid-template-columns:1fr}
}
.tile{
  position:relative;overflow:hidden;display:flex;flex-direction:column;gap:10px;
  padding:28px;border:1px solid var(--glass-bd);border-radius:24px;background:var(--glass);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:var(--halo);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .45s;
}
/* Cursor-tracked spotlight. Defaults keep it centred when JS is absent. */
.tile::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(181,255,31,.14),transparent 62%);
  opacity:0;transition:opacity .35s;
}
.tile:hover{
  transform:translateY(-4px);border-color:rgba(181,255,31,.32);
  box-shadow:0 0 0 1px rgba(181,255,31,.18),0 30px 80px -34px rgba(181,255,31,.5),var(--halo);
}
.tile:hover::before{opacity:1}
.tile>*{position:relative;z-index:1}
.bt-ico{
  display:inline-grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid var(--bd2);color:var(--neon1);
}
.bt-ico svg{width:22px;height:22px}
.tile h3{font:700 clamp(19px,2vw,24px)/1.22 var(--fd);letter-spacing:-.025em}
.tile p{color:var(--mute);font-size:15px;line-height:1.6}
.bt-stat{
  font:800 clamp(38px,5vw,60px)/1 var(--fd);letter-spacing:-.045em;
  background:linear-gradient(120deg,var(--neon1),var(--neon2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.bt-hl{
  border-color:rgba(181,255,31,.26);
  background:
    radial-gradient(600px circle at 12% 0%,rgba(181,255,31,.12),transparent 55%),
    radial-gradient(500px circle at 100% 100%,rgba(0,229,255,.10),transparent 55%),
    var(--glass);
}
.bt-hl .bt-ico{color:var(--neon1);border-color:rgba(181,255,31,.4);box-shadow:0 0 24px -6px rgba(181,255,31,.6)}
.bt-link{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:6px;font:600 14px var(--fb);color:var(--neon1)}
.bt-link svg{width:15px;height:15px;transition:transform .3s}
.tile:hover .bt-link svg{transform:translateX(4px)}
.bt-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:8px}
.bt-chips span{
  padding:6px 12px;border:1px solid var(--bd);border-radius:999px;
  background:rgba(255,255,255,.03);font:500 12.5px var(--fm);color:var(--mute);
}

/* The tool cards keep their stacked two-column layout, glassed up. */
#tools .ftc{background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
#tools .ftc:hover{box-shadow:0 0 0 1px var(--c),0 40px 90px -40px var(--c)}

/* --- Glassmorphism on product cards and the sticky navbar --------------- */
.card{background:var(--glass);backdrop-filter:blur(14px) saturate(130%);-webkit-backdrop-filter:blur(14px) saturate(130%)}
.card:hover{border-color:var(--c);box-shadow:0 40px 80px -30px var(--c),0 0 0 1px var(--c),0 0 34px -14px var(--neon2)}
header.sc{
  background:color-mix(in srgb,var(--bg) 62%,transparent);border-bottom-color:var(--bd2);
  backdrop-filter:blur(26px) saturate(150%);-webkit-backdrop-filter:blur(26px) saturate(150%);
  box-shadow:0 10px 40px -22px rgba(0,0,0,.9);
}

/* --- Animated logo: a slow neon pulse on load and on loop ---------------- */
.logo-mark{animation:logoPulse 5.5s ease-in-out infinite}
@keyframes logoPulse{
  0%,100%{filter:drop-shadow(0 6px 18px rgba(25,211,162,.35))}
  45%{filter:drop-shadow(0 6px 22px rgba(25,211,162,.5)) drop-shadow(0 0 16px rgba(181,255,31,.65))}
}

/* --- Hero orb parallax --------------------------------------------------
   Transform and opacity only, so the animation stays on the compositor and
   holds 60fps on mobile without a scroll listener. */
.blob{will-change:transform}
.b1{animation:pd1 26s ease-in-out infinite}
.b2{animation:pd2 32s ease-in-out infinite}
.b3{animation:pd1 29s ease-in-out infinite reverse}
@keyframes pd1{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(120px,-90px,0) scale(1.18)}
}
@keyframes pd2{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-140px,-110px,0) scale(1.22)}
}

/* --- Scroll reveal ------------------------------------------------------- */
.rv-up{opacity:0;transform:translateY(30px)}
.rv-up.rv{opacity:1;transform:none;transition:opacity .75s cubic-bezier(.2,.8,.2,1),transform .75s cubic-bezier(.2,.8,.2,1)}

/* --- Magnetic CTAs and neon glow ----------------------------------------
   --mx/--my are set by js/site.js on pointer move. The px defaults mean a
   no-JS hover still gets the lift and the glow, just without the follow. */
.bp,.buy{--mx:0px;--my:-2px;position:relative}
.bp:hover,.buy:hover{transform:translate3d(var(--mx),var(--my),0) scale(1.045);filter:brightness(1.06)}
.bp{box-shadow:0 14px 40px -12px var(--acc),0 0 30px -12px rgba(181,255,31,.7)}
.bp:hover{box-shadow:0 22px 55px -14px var(--acc),0 0 46px -10px rgba(181,255,31,.85)}
.buy:hover{box-shadow:0 16px 40px -12px var(--c),0 0 34px -10px rgba(0,229,255,.6)}

/* --- Trust stack, placed directly under the Buy button ------------------ */
.trust{margin-top:22px;display:flex;flex-direction:column;gap:14px}
.trust-row{display:flex;flex-wrap:wrap;gap:9px}
.tb2{
  display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;
  border:1px solid rgba(181,255,31,.3);background:rgba(181,255,31,.07);
  color:var(--ink);font:600 13px var(--fb);
}
.tb2 svg{width:15px;height:15px;color:var(--neon1);flex-shrink:0}
.quote{
  margin:0;padding:18px 20px;border-left:3px solid var(--neon2);border-radius:0 16px 16px 0;
  background:linear-gradient(120deg,rgba(0,229,255,.09),rgba(255,255,255,.02));
}
.quote p{margin:0;color:var(--ink);font-size:15.5px;line-height:1.6;font-style:italic}
.quote footer{margin-top:10px;font:500 12.5px var(--fm);color:var(--mute2);border:0;padding:0}
.trust-note{color:var(--mute2);font-size:13.5px;display:flex;align-items:center;gap:8px}
.trust-note svg{width:15px;height:15px;color:var(--acc);flex-shrink:0}

/* --- Soft email gate: opt-in, never blocks the tool --------------------- */
.egate{
  margin:26px 0 0;padding:22px 24px;border:1px dashed rgba(0,229,255,.35);border-radius:20px;
  background:linear-gradient(140deg,rgba(0,229,255,.07),rgba(255,255,255,.02));
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:space-between;
}
.egate-t{flex:1 1 320px}
.egate-t h3{margin:0 0 4px;font:700 17px/1.3 var(--fd);letter-spacing:-.02em}
.egate-t p{margin:0;color:var(--mute);font-size:14px}
.egate form{display:flex;flex-wrap:wrap;gap:10px;align-items:center;flex:1 1 300px}
.egate input[type=email]{
  flex:1 1 200px;min-width:0;padding:13px 16px;border-radius:999px;border:1px solid var(--bd2);
  background:rgba(0,0,0,.35);color:var(--ink);font:500 15px var(--fb);
}
.egate input[type=email]::placeholder{color:var(--mute2)}
.egate .btn{padding:13px 22px;font-size:14.5px}
.egate-note{flex:1 1 100%;margin:0;color:var(--mute2);font-size:12.5px}
.egate-ok{
  flex:1 1 100%;margin:0;padding:12px 16px;border-radius:14px;
  background:rgba(181,255,31,.1);border:1px solid rgba(181,255,31,.35);
  color:var(--ink);font-weight:600;font-size:14.5px;
}
.egate-ok[hidden]{display:none}
/* After a successful opt-in only the confirmation remains, so the gate keeps
   its shape instead of collapsing the surrounding layout. */
.egate.done .egate-t,.egate.done form,.egate.done .egate-note{display:none}
.sr{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* --- Section polish ------------------------------------------------------ */
.sh h2 em,.shw-t em{background:linear-gradient(120deg,var(--neon1),var(--neon2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stats{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:linear-gradient(180deg,rgba(255,255,255,.045),transparent)}

/* --- Focus visibility on every interactive element ---------------------- */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--neon2);outline-offset:3px;border-radius:8px;
}
/* Skip link: parked above the viewport, slides into the centre on focus. */
.skip{
  position:fixed;left:50%;top:0;transform:translate(-50%,-140%);background:var(--neon1);
  color:#04120a;padding:12px 22px;font-weight:700;z-index:2000;border-radius:0 0 14px 14px;
  transition:transform .25s;box-shadow:0 10px 30px -10px rgba(181,255,31,.7);
}
.skip:focus{left:50%;transform:translate(-50%,0)}

/* --- Reduced motion: drop the new animation, keep the layout ------------ */
@media(prefers-reduced-motion:reduce){
  .blob{animation:none!important}
  .logo-mark{animation:none!important}
  .rv-up{opacity:1!important;transform:none!important}
  .bp:hover,.buy:hover{transform:none}
  .tile:hover{transform:none}
}
@media(hover:none){
  .bp:hover,.buy:hover{transform:none}
  .tile:hover{transform:none}
}


/* --- Whole product card is clickable ----------------------------------
   Only the cover and the title were links, so the description, the feature
   list and the price area looked clickable but did nothing. Stretch the
   title link across the card (the standard "stretched link" pattern) so a
   click anywhere opens the product, and lift the Buy button above it so it
   keeps its own destination.

   Scoped with :has() to cards that actually contain a title link, so the
   .card elements on the tool app pages, which do not load this stylesheet
   and are not products, are untouched. Browsers without :has() simply drop
   these rules and fall back to the previous behaviour. */
.card:has(h3 a){position:relative}
.card:has(h3 a) h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.card:has(h3 a) .buy{position:relative;z-index:2}


/* --- Reduced transparency (tier 2) ------------------------------------
   The glass surfaces rely on backdrop-filter. When the OS asks for less
   transparency the blur is dropped and the surfaces become opaque, so text
   keeps its contrast against whatever is behind it. */
@media (prefers-reduced-transparency: reduce){
  .ftc,.tile,.stat,.sm,.card{backdrop-filter:none;-webkit-backdrop-filter:none}
  .ftc,.tile,.sm,.card{background:#101418}
  header.sc{background:#0a0e12;backdrop-filter:none;-webkit-backdrop-filter:none}
}


/* ==========================================================================
   SURGICAL HERO UPGRADE
   Kinetic background typography in the hero's empty band, a word-by-word
   headline reveal, the cursor spotlight extended to product cards, and
   metric-matched font fallbacks that stop the webfont swap from reflowing
   the page (the 0.057 CLS).

   Additive only: new classes, or refinements at equal-or-later specificity.
   Deleting this block restores the previous design in one piece.
   ========================================================================== */

/* --- Metric-matched fallbacks -------------------------------------------
   Measured, not guessed: Bricolage Grotesque sets 12% narrower than Arial at
   the same size, and Instrument Sans 10% narrower. Without this the headline
   is laid out against the fallback's wider metrics and then reflows when the
   webfont lands, which is the layout shift Lighthouse was reporting.

   Sizing a fallback by advance width (not by height) is what keeps the wrap
   points stable; the ascent/descent overrides that some guides suggest are
   deliberately absent, because they change the line box and reintroduce the
   very shift this prevents. */
@font-face{
  font-family:"Bricolage Fallback";
  src:local("Arial"),local("Helvetica Neue"),local("Roboto"),local("DejaVu Sans");
  size-adjust:89%;
}
@font-face{
  font-family:"Instrument Fallback";
  src:local("Arial"),local("Helvetica Neue"),local("Roboto"),local("DejaVu Sans");
  size-adjust:90%;
}
:root{
  --fd:"Bricolage Grotesque","Bricolage Fallback",system-ui,sans-serif;
  --fb:"Instrument Sans","Instrument Fallback",system-ui,sans-serif;
}

/* --- Kinetic background typography --------------------------------------
   Sits in the hero's empty top band, between the header and the eyebrow.
   The hero already has overflow:hidden, so the oversized glyphs are clipped
   cleanly at the band edges.

   z-index 0 against .wrap's z-index 3 keeps it behind every word of copy,
   and the band height is set from the measured gap so it cannot reach the
   h1 or the subtitle. pointer-events:none means it can never intercept a
   click or a text selection. */
.hero .bgtype{
  position:absolute;left:0;right:0;top:72px;height:78px;z-index:0;
  pointer-events:none;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.bgtype-row{display:block;height:78px;overflow:hidden;white-space:nowrap}
.bgtype-track{display:inline-flex;will-change:transform;animation:bgtypeA 52s linear infinite}
.bgtype-row.rev .bgtype-track{animation-name:bgtypeB;animation-duration:64s}
.bgtype-track span{
  display:inline-block;padding-right:.34em;
  font:800 clamp(58px,8.6vw,132px)/.78 var(--fd);
  letter-spacing:-.05em;text-transform:uppercase;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.10);
}
/* The words are decoration, so they are generated here rather than marked up
   in the document. The outline is 10% white, which is far below any contrast
   floor; as real text nodes that is an automatic contrast failure, and the
   layer is already aria-hidden so the words carry no meaning for assistive
   tech either way. Generating them keeps the document free of text that is
   not content. */
.bgtype-row .m::before{content:"Chameleon AI ✦ Prompt Packs ✦ "}
.bgtype-row.rev .m::before{content:"Shift ✦ Adapt ✦ Deepen ✦ "}
@keyframes bgtypeA{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes bgtypeB{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
@media(max-width:960px){
  .hero .bgtype{top:64px;height:74px}
  .bgtype-row{height:74px}
  .bgtype-track span{font:800 clamp(52px,15vw,96px)/.78 var(--fd);-webkit-text-stroke-color:rgba(255,255,255,.12)}
}

/* --- Word-by-word headline reveal ---------------------------------------
   .w spans are injected by js/site.js, which also adds .rv when the reveal
   should run. Without JS, or under reduced motion, the spans never exist and
   the headline is simply already visible.

   Transform and opacity only, so the whole reveal stays on the compositor. */
.hero h1 .w{display:inline-block;will-change:transform,opacity}
.hero h1.rvw .w{opacity:0;transform:translate3d(0,.42em,0)}
.hero h1.rv .w{
  opacity:1;transform:none;
  transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);
  transition-delay:var(--wd,0ms);
}

/* --- Spotlight on product cards -----------------------------------------
   The bento tiles already had this; the product cards did not. Same
   --mx/--my contract, same centred default when JS is absent. */
.card{position:relative}
.card::before{
  content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.10),transparent 62%);
  opacity:0;transition:opacity .35s;
}
.card:hover::before{opacity:1}
.card>.ci{position:relative;z-index:1}

/* --- Reduced motion and touch: drop the new animation, keep the layout --- */
@media(prefers-reduced-motion:reduce){
  .bgtype-track{animation:none}
  .hero h1.rvw .w,.hero h1.rv .w{opacity:1;transform:none;transition:none}
}


/* ==========================================================================
   CONTRAST: muted text over the animated backdrop
   --------------------------------------------------------------------------
   The two muted tokens are used for secondary copy all over the page: hero
   trust bullets, body paragraphs, the blog summary, every footer link and
   footer heading. All of that sits on the page background, and the page
   background is not a flat colour: three blurred blobs drift behind it and
   pass underneath the text.

   Measured rather than assumed. The blobs are position:fixed, so the backdrop
   is the same at every scroll offset; hiding all content and sampling the
   backdrop over a full animation cycle, at ten viewport widths with every
   blob frozen at its maximum scale, gives a worst-case backdrop of #454d3c
   (relative luminance 0.069, the lime blob at its peak). Against that:

     --mute   #8e9d97  3.12:1   fails
     --mute2  #7f8d88  2.55:1   fails

   Both fail 4.5:1 for small text, which is why axe flagged the hero bullets,
   the footer links, the footer headings and the blog summary once the blob
   drifted behind them. It was never just the hero bullets.

   A scrim behind the text was the other option and it is the wrong one: to
   lift --mute2 to 4.5:1 the backdrop would have to lose 75% of its luminance,
   which guts the glow that is the whole point of the effect. Lightening the
   text is the smaller change, and it costs nothing visually because muted
   copy only ever sits on dark surfaces here (the cards, the footer and the
   page), never on the neon buttons, which use their own dark ink.

   New values, chosen so every muted element clears 4.5:1 against the measured
   worst case with margin, while keeping the three-step hierarchy intact
   (mute2 < mute < ink):

     --mute2 #b8c1bd  worst 4.79:1   (was 2.55:1)
     --mute  #c0c8c5  worst 5.17:1   (was 3.12:1)
     --ink   unchanged, worst 8.09:1

   --acc is left alone: at 4.57:1 against the same backdrop it passes, and it
   is a brand colour used for button fills and glows as well as labels.
   ========================================================================== */
:root{
  --mute:#c0c8c5;
  --mute2:#b8c1bd;
}
