:root{--bg:#07070a;--bg2:#0c0c11;--ink:#f5f5f7;--mut:#8a8a95;--dim:#55555f;--line:#ffffff14;--line2:#ffffff22;--sig:linear-gradient(120deg,#a78bfa 0%,#7c6cff 40%,#4f8bff 100%);--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:400 16px/1.6 "Inter Tight",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
em{font-family:"Instrument Serif",serif;font-style:italic;font-weight:400;letter-spacing:-.01em;background:var(--sig);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
h1,h2{font-weight:500;letter-spacing:-.045em;line-height:.98}
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(4) infinite}
@keyframes grain{25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
.cursor{position:fixed;left:0;top:0;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;pointer-events:none;z-index:99;mix-blend-mode:difference;transition:width .5s var(--ease),height .5s var(--ease),margin .5s var(--ease)}
.cursor.big{width:44px;height:44px;margin:-22px 0 0 -22px}
.nav{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:18px 4vw;z-index:50;backdrop-filter:blur(14px) saturate(140%);background:#07070a99;border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:10px;font-weight:600;font-size:17px;letter-spacing:-.02em}.mark{width:16px;height:16px;border-radius:5px;background:var(--sig);box-shadow:0 0 18px #7c6cff88}
.nav nav{display:flex;gap:32px}.nav nav a{color:var(--mut);font-size:14px;transition:color .3s}.nav nav a:hover{color:var(--ink)}
.btn{display:inline-flex;gap:10px;align-items:center;background:var(--ink);color:#07070a;padding:14px 24px;border-radius:999px;font-weight:500;font-size:15px;transition:background .4s var(--ease),box-shadow .4s}
.btn:hover{box-shadow:0 0 0 1px #fff3,0 10px 40px #7c6cff44}.btn .arr{transition:transform .5s var(--ease)}.btn:hover .arr{transform:translateX(4px)}
.btn.small{padding:9px 18px;font-size:13px}.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2)}.btn.ghost:hover{box-shadow:inset 0 0 0 1px #fff5}
.hero{height:100vh;min-height:720px;position:relative;overflow:hidden;display:flex;align-items:center;padding:0 4vw;border-bottom:1px solid var(--line)}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 45% at 72% 45%,#4a3aff14,transparent 70%);pointer-events:none}
#gl{position:absolute;inset:0;width:100%;height:100%}
.hero-in{position:relative;z-index:2;max-width:760px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:500 12px "JetBrains Mono";text-transform:uppercase;letter-spacing:.14em;color:var(--mut);margin-bottom:28px}
.dot{width:6px;height:6px;border-radius:50%;background:#7c6cff;box-shadow:0 0 12px #7c6cff}
.kinetic{font-size:clamp(52px,7.6vw,128px)}.kinetic em{font-size:1.06em}
.lede{max-width:480px;color:var(--mut);font-size:18px;line-height:1.55;margin:32px 0 40px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.hero-meta{position:absolute;left:4vw;bottom:36px;display:flex;gap:28px;font:12px "JetBrains Mono";color:var(--dim);text-transform:uppercase;letter-spacing:.1em;z-index:2}
.scroll-cue{position:absolute;right:4vw;bottom:36px;width:1px;height:56px;background:var(--line2);overflow:hidden;z-index:2}.scroll-cue i{display:block;width:1px;height:40%;background:#fff;animation:cue 2.4s var(--ease) infinite}
@keyframes cue{from{transform:translateY(-100%)}to{transform:translateY(250%)}}
.section{padding:160px 4vw;border-bottom:1px solid var(--line);position:relative}
.head{margin-bottom:80px}.section h2,.how h2{font-size:clamp(44px,5.8vw,96px)}.sub{color:var(--mut);font-size:18px;margin-top:24px;max-width:460px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.card{background:var(--bg);padding:14px;position:relative;transition:background .6s var(--ease)}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),#7c6cff14,transparent 50%);opacity:0;transition:opacity .5s;pointer-events:none}.card:hover::before{opacity:1}
.stage{height:260px;border-radius:12px;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--bg2);box-shadow:inset 0 0 0 1px var(--line);perspective:800px}
.meta{padding:18px 6px 6px}.meta h3{font-size:15px;font-weight:500;letter-spacing:-.01em}.meta p{font:11.5px "JetBrains Mono";color:var(--dim);margin-top:4px}
.mesh{position:absolute;inset:-40%;background:radial-gradient(circle at 30% 30%,#7c6cff 0,transparent 35%),radial-gradient(circle at 70% 60%,#3b6bff 0,transparent 38%),radial-gradient(circle at 45% 80%,#b59cff 0,transparent 30%),#0b0b14;will-change:transform;animation:meshr 12s ease-in-out infinite alternate}
@keyframes meshr{to{transform:rotate(60deg) scale(1.15) translate(4%,-6%)}}
.particles{position:absolute;inset:0;width:100%;height:100%}
.glassst .lines{position:absolute;inset:-50%;background:repeating-linear-gradient(115deg,#7c6cff 0 2px,transparent 2px 22px),repeating-linear-gradient(115deg,#4f8bff55 0 1px,transparent 1px 11px);opacity:.28;animation:lines 8s linear infinite}
@keyframes lines{to{transform:translateX(22%)}}
.glass{width:58%;height:58%;border-radius:22px;backdrop-filter:blur(18px) saturate(160%);background:linear-gradient(135deg,#ffffff1a,#ffffff05);box-shadow:inset 0 1px 0 #ffffff40,inset 0 0 0 1px #ffffff1a,0 30px 60px #0008;animation:gfloat 8s ease-in-out infinite alternate}
@keyframes gfloat{to{transform:rotateX(14deg) rotateY(-18deg) translateY(-6px)}}
.treveal{font-size:34px;font-weight:500;letter-spacing:-.035em;line-height:1.05;text-align:left}.treveal span{display:block;overflow:hidden}.treveal span>i{display:block;font-style:normal}
.chrome{font:600 120px/1 "Inter Tight";letter-spacing:-.06em;background:linear-gradient(100deg,#3a3a44 0%,#fff 22%,#8b8b96 38%,#2a2a33 52%,#d9d9e3 68%,#5a5a66 85%,#fff 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:chrome 8s linear infinite;filter:drop-shadow(0 10px 30px #7c6cff33)}
@keyframes chrome{0%{transform:rotateY(0);background-position:0 0}50%{transform:rotateY(180deg);background-position:100% 0}100%{transform:rotateY(360deg);background-position:0 0}}
.orbits{position:relative;width:130px;height:130px;transform-style:preserve-3d;transform:rotateX(64deg)}.orbits i{position:absolute;inset:0;border-radius:50%;border:1px solid var(--line2);border-top-color:#a78bfa;animation:orb 2.4s cubic-bezier(.76,0,.24,1) infinite}
.orbits i:nth-child(2){inset:18px;border-top-color:#7c6cff;animation-delay:-.8s}.orbits i:nth-child(3){inset:36px;border-top-color:#4f8bff;animation-delay:-1.6s}.orbits b{position:absolute;inset:58px;border-radius:50%;background:#fff;box-shadow:0 0 20px #7c6cff,0 0 40px #4f8bff}
@keyframes orb{to{transform:rotateZ(360deg)}}
.mq{width:100%;overflow:hidden;white-space:nowrap;font-size:44px;font-weight:500;letter-spacing:-.04em;color:#ffffff22;-webkit-mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent)}.mq span{display:inline-block;animation:mqa 14s linear infinite}
@keyframes mqa{to{transform:translateX(-50%)}}
.spotgrid{position:absolute;inset:0;background-image:radial-gradient(circle,#ffffff 1px,transparent 1.2px);background-size:18px 18px;-webkit-mask:radial-gradient(120px circle at var(--sx,50%) var(--sy,50%),#000,transparent);mask:radial-gradient(120px circle at var(--sx,50%) var(--sy,50%),#000,transparent)}
.how{border-bottom:1px solid var(--line)}.pin{display:grid;grid-template-columns:1fr 1fr;gap:6vw;padding:0 4vw;height:100vh;align-items:center}
.progress{height:1px;background:var(--line2);margin-top:56px;width:70%}.progress i{display:block;height:100%;width:0;background:var(--sig)}.count{font:12px "JetBrains Mono";color:var(--dim);margin-top:16px}.count .cur{color:var(--ink)}
.steps{position:relative;height:360px}.step{position:absolute;inset:0;padding:48px;border-radius:20px;background:linear-gradient(180deg,#121219,#0b0b10);box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 #ffffff14,0 40px 80px #000a}
.step b{font:500 12px "JetBrains Mono";color:#a78bfa}.step h3{font-size:52px;font-weight:500;letter-spacing:-.04em;margin:auto 0 12px;position:absolute;bottom:90px}.step p{color:var(--mut);font-size:17px;position:absolute;bottom:48px;max-width:80%}
.panel{border-radius:16px;overflow:hidden;background:#0b0b10;box-shadow:inset 0 0 0 1px var(--line),0 60px 120px #000c,0 0 120px #5b4bff12;max-width:1000px}
.bar{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line)}.bar span{width:10px;height:10px;border-radius:50%;background:#ffffff1a}
.bar b{font:500 12px "JetBrains Mono";color:var(--mut);margin-left:12px;flex:1}.bar button{background:transparent;color:var(--ink);border:0;box-shadow:inset 0 0 0 1px var(--line2);border-radius:999px;padding:7px 16px;font:500 12px "Inter Tight";cursor:pointer;transition:box-shadow .3s}.bar button:hover{box-shadow:inset 0 0 0 1px #a78bfa}
pre{padding:32px;font:13.5px/1.8 "JetBrains Mono";color:#c9c9d4;overflow:auto}pre i{font-style:normal;color:#8b7cff}
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.price{padding:44px 40px;background:var(--bg);display:flex;flex-direction:column}
.price.hot{background:radial-gradient(120% 80% at 50% 0%,#2a2160 0%,#0c0c14 60%)}
.price h3{font-size:15px;font-weight:500;display:flex;gap:10px;align-items:center}.tag{font:500 10px "JetBrains Mono";text-transform:uppercase;letter-spacing:.1em;padding:3px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px #a78bfa66;color:#c4b5fd}
.amt{font-size:64px;font-weight:500;letter-spacing:-.05em;margin:24px 0 4px}.amt small{font-size:15px;color:var(--mut);letter-spacing:0;font-weight:400}.pd{color:var(--mut);font-size:15px}
.price ul{list-style:none;margin:32px 0 40px;flex:1}.price li{padding:11px 0;border-top:1px solid var(--line);font-size:15px;color:#d4d4dc}.price li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#7c6cff;margin:0 12px 2px 0}
.price .btn{justify-content:center}
footer{padding:120px 4vw 40px;overflow:hidden}footer .big{font-size:clamp(90px,19vw,320px);font-weight:500;letter-spacing:-.07em;line-height:.8;background:linear-gradient(180deg,#f5f5f7 0%,#f5f5f733 70%,transparent);-webkit-background-clip:text;background-clip:text;color:transparent}
.frow{display:flex;justify-content:space-between;margin-top:48px;padding-top:24px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}.frow a{margin-left:24px;transition:color .3s}.frow a:hover{color:var(--ink)}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.prices{grid-template-columns:1fr}.pin{grid-template-columns:1fr;height:auto;padding:120px 4vw;gap:48px}.nav nav{display:none}.cursor{display:none}#gl{opacity:.55}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.hero-meta{display:none}.step h3{font-size:38px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}}
/* ===== LIGHT PREMIUM THEME (overrides) ===== */
:root{--bg:#f3f3f5;--bg2:#e9e9ee;--ink:#0d0d12;--mut:#5f5f6b;--dim:#8d8d98;--line:#0d0d1214;--line2:#0d0d1222;--sig:linear-gradient(110deg,#d4143f 0%,#8a2bff 50%,#2563ff 100%)}
body{background:var(--bg);color:var(--ink)}
.grain{opacity:.035;mix-blend-mode:multiply}
.cursor{background:#0d0d12;mix-blend-mode:normal;opacity:.85}.cursor.big{background:transparent;box-shadow:inset 0 0 0 1px #0d0d1255}
.nav{background:#f3f3f5cc;border-bottom:1px solid var(--line)}.mark{box-shadow:0 4px 14px #8a2bff55}
.btn{background:#0d0d12;color:#fff}.btn:hover{box-shadow:0 12px 40px #5a2cff33}.btn.ghost{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2),0 1px 2px #0000000a}
.hero{background:radial-gradient(ellipse 55% 60% at 72% 50%,#ffffff 0%,#f3f3f5 70%)}
.hero::after{background:radial-gradient(ellipse 30% 22% at 72% 14%,#5ad8ff38,transparent 70%),radial-gradient(ellipse 30% 22% at 72% 88%,#5ad8ff30,transparent 70%)}
.dot{background:#2563ff;box-shadow:0 0 10px #2563ff}
.scroll-cue i{background:#0d0d12}
.card{background:#fff;border-radius:0}.grid{background:var(--line)}
.card::before{background:radial-gradient(400px circle at var(--mx,50%) var(--my,50%),#5a2cff0c,transparent 50%)}
.stage{background:#efeff2;box-shadow:inset 0 0 0 1px #0d0d120d;border-radius:14px}
.mesh{background:radial-gradient(circle at 30% 30%,#d4143f 0,transparent 34%),radial-gradient(circle at 70% 55%,#2563ff 0,transparent 38%),radial-gradient(circle at 45% 80%,#8a2bff 0,transparent 32%),radial-gradient(circle at 80% 20%,#5ad8ff 0,transparent 22%),#efeff2}
.glassst .lines{background:linear-gradient(120deg,#d4143f,#8a2bff 45%,#2563ff 80%,#5ad8ff);opacity:1;inset:-20%;animation:hueflow 8s ease-in-out infinite alternate}
@keyframes hueflow{to{transform:translateX(10%) rotate(8deg) scale(1.1)}}
.glass{background:linear-gradient(135deg,#ffffff55,#ffffff14);box-shadow:inset 0 1px 0 #ffffffaa,inset 0 0 0 1px #ffffff55,0 30px 60px #2a0a5a40}
.treveal{color:var(--ink)}
.chrome{background:linear-gradient(100deg,#2a0010 0%,#d4143f 20%,#ff9ab0 30%,#8a2bff 48%,#2563ff 68%,#bff3ff 78%,#1a0640 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 14px 24px #5a2cff44)}
.orbits i{border-color:#0d0d1218}.orbits i:nth-child(1){border-top-color:#d4143f}.orbits i:nth-child(2){border-top-color:#8a2bff}.orbits i:nth-child(3){border-top-color:#2563ff}.orbits b{background:radial-gradient(circle at 35% 30%,#fff,#5ad8ff 40%,#2563ff);box-shadow:0 0 24px #5ad8ff}
.mq{color:#0d0d12;font-weight:500}.mq span{background:var(--sig);-webkit-background-clip:text;background-clip:text;color:transparent}
.spotgrid{background-image:radial-gradient(circle,#5a2cff 1.1px,transparent 1.4px)}
.step{background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 40px 80px #1a0a4014}
.step::after{content:"";position:absolute;right:28px;top:28px;width:120px;height:160px;border-radius:16px;background:var(--sig);transform:perspective(500px) rotateY(-24deg);box-shadow:0 20px 50px #5a2cff40}
.step b{color:#8a2bff}
.spec{background:transparent}
.panel{background:#0d0d12;box-shadow:0 60px 120px #1a0a4026}
.bar b{color:#8d8d98}.bar button{color:#fff;box-shadow:inset 0 0 0 1px #ffffff2a}
.price{background:#fff}.price li{color:#2a2a33}
.price.hot{background:linear-gradient(#fff,#fff) padding-box;position:relative;overflow:hidden}
.price.hot::before{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:40px;background:var(--sig);filter:blur(50px);opacity:.28;pointer-events:none}
.tag{color:#5a2cff;box-shadow:inset 0 0 0 1px #5a2cff55}
footer .big{background:linear-gradient(180deg,#0d0d12 0%,#0d0d1233 75%,transparent)}
/* blend: reference #2 — warm off-white, bold tight headline, violet→coral CTA, pill badge, tier tags */
:root{--bg:#f6f5f1;--bg2:#ecebe5;--ink:#14130f;--mut:#6a6860;--sig:linear-gradient(100deg,#5b3df5 0%,#8a2bff 35%,#d4143f 75%,#f2562a 100%)}
.nav{background:#f6f5f1cc}
.hero{background:radial-gradient(ellipse 45% 55% at 0% 0%,#e7e1ff 0%,transparent 60%),radial-gradient(ellipse 40% 50% at 100% 100%,#ffe3d6 0%,transparent 60%),radial-gradient(ellipse 55% 60% at 72% 50%,#fff 0%,#f6f5f1 70%)}
.kinetic{font-weight:700;letter-spacing:-.055em}.kinetic em{font-weight:400}
.section h2,.how h2{font-weight:650}
.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line2),0 2px 8px #0000000a;font-size:13px;font-weight:500;margin-bottom:28px}
.pill .dot{background:#2fe0c0;box-shadow:0 0 10px #2fe0c0}
.btn.grad{background:linear-gradient(100deg,#5b3df5,#8a2bff 45%,#f2562a);color:#fff;box-shadow:0 10px 30px #5b3df540}.btn.grad:hover{box-shadow:0 14px 44px #8a2bff55}
.hero-meta{text-transform:none;letter-spacing:0;font:500 13px "Inter Tight";color:var(--mut);gap:20px;align-items:center}.hero-meta span{color:var(--ink);opacity:.7}
.meta{position:relative}.ctag{position:absolute;right:6px;top:18px;font:500 11px "Inter Tight";padding:2px 9px;border-radius:999px}
.ctag.free{color:#0f9e86;box-shadow:inset 0 0 0 1px #2fe0c088;background:#2fe0c014}.ctag.pro{color:#e0461c;box-shadow:inset 0 0 0 1px #f2562a77;background:#f2562a10}
.dot{background:#2fe0c0}
@media(max-width:1000px){#gl{opacity:.55}}
/* ===== v4: bold hero, richer gloss, 8px grid ===== */
:root{--sig:linear-gradient(100deg,#4b1fff 0%,#8a2bff 32%,#e0144a 70%,#ff6a3d 100%);--sh-v:0 32px 64px -24px rgba(75,31,255,.28);--sh-c:0 32px 64px -24px rgba(224,20,74,.22);--pad:clamp(96px,12vw,160px);--gut:clamp(24px,5vw,80px)}
.nav{padding:16px var(--gut)}
.hero{padding:0 var(--gut);min-height:760px}
.hero-in{max-width:min(46vw,640px)}
.kinetic{font-size:clamp(56px,5.4vw,104px);line-height:.96}
.lede{margin:32px 0 40px;max-width:440px}
.hero-meta{left:var(--gut);bottom:40px}.scroll-cue{right:var(--gut);bottom:40px}
@media(max-width:1000px){.hero{align-items:flex-start;padding-top:136px;min-height:900px;height:auto}.hero-in{max-width:none}.kinetic{font-size:clamp(48px,12.5vw,72px)}#gl{opacity:1}.hero-meta{display:none}}
/* sheen sweep on primary buttons + pro card */
.btn.grad{position:relative;overflow:hidden;background:var(--sig);background-size:200% 100%;box-shadow:0 16px 40px -12px rgba(75,31,255,.55),0 8px 24px -12px rgba(224,20,74,.45),inset 0 1px 0 #ffffff55}
.btn.grad::after,.price.hot::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#ffffff70 50%,transparent 65%);transform:translateX(-120%);animation:sheen 4.8s cubic-bezier(.7,0,.2,1) infinite;pointer-events:none}
@keyframes sheen{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
/* marquee band */
.band{overflow:hidden;padding:32px 0;border-block:1px solid var(--line);background:#fff}
.mq-track{display:flex;gap:48px;align-items:center;width:max-content;animation:mqx 40s linear infinite;will-change:transform}
.mq-track span{font:600 clamp(32px,4vw,56px)/1 "Inter Tight";letter-spacing:-.04em;background:var(--sig);-webkit-background-clip:text;background-clip:text;color:transparent}
.mq-track i{width:16px;height:16px;border-radius:50%;background:var(--sig);box-shadow:var(--sh-v);flex:none}
@keyframes mqx{to{transform:translateX(-50%)}}
/* stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:96px var(--gut);border-bottom:1px solid var(--line);max-width:1440px;margin:0 auto}
.stat b{display:block;font:600 clamp(48px,6vw,88px)/1 "Inter Tight";letter-spacing:-.05em;background:linear-gradient(180deg,#14130f 30%,#5b3df5);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{display:block;margin-top:16px;color:var(--mut);font-size:15px}
@media(max-width:700px){.stats{grid-template-columns:1fr 1fr;row-gap:48px;padding:72px var(--gut)}}
/* sections: 8px rhythm, aligned container */
.section{padding:var(--pad) var(--gut)}
.section>*{max-width:1280px;margin-left:auto;margin-right:auto}
.head{margin-bottom:64px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);align-items:end;gap:32px}.head .eyebrow{grid-column:1/-1;margin-bottom:0}.sub{margin-top:0}
@media(max-width:800px){.head{grid-template-columns:1fr}}
/* cards: separate glossy tiles with coloured shadows */
.grid{gap:24px;background:none;border:0;border-radius:0;overflow:visible}
.card{background:#fff;border-radius:24px;padding:8px;box-shadow:0 1px 0 #fff inset,0 0 0 1px #14130f0f,0 8px 24px -16px #14130f33;transition:transform .8s var(--ease),box-shadow .8s var(--ease);transform-style:preserve-3d;will-change:transform}
.card:hover{box-shadow:0 0 0 1px #5b3df522,var(--sh-v),var(--sh-c)}
.stage{border-radius:16px;height:248px}
.stage::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 40%,#ffffff55 50%,transparent 60%);transform:translateX(-100%);transition:transform 1.2s var(--ease);pointer-events:none;z-index:3}
.card:hover .stage::after{transform:translateX(100%)}
.meta{padding:16px 8px 8px}
.mesh{background:radial-gradient(circle at 30% 30%,#e0144a 0,transparent 38%),radial-gradient(circle at 72% 58%,#0a5bff 0,transparent 40%),radial-gradient(circle at 45% 82%,#6a1fff 0,transparent 42%),#2a0a6a!important}
/* process + pricing polish */
.how{padding:0 var(--gut)}
.step{box-shadow:var(--sh-v)}
.prices{gap:24px}
.price{border-radius:24px;padding:40px 32px;background:#fff;box-shadow:0 0 0 1px #14130f0f,0 16px 40px -24px #14130f40;transition:transform .8s var(--ease),box-shadow .8s var(--ease);position:relative;overflow:hidden}
.price:hover{transform:translateY(-8px);box-shadow:0 0 0 1px #5b3df522,var(--sh-v)}
.price.hot{background:linear-gradient(160deg,#1a0b3d,#0d0d12 60%);color:#fff;box-shadow:var(--sh-v),var(--sh-c)}.price.hot .pd,.price.hot li{color:#ffffffb3}
.panel{box-shadow:0 40px 80px -32px rgba(75,31,255,.45)}
footer{padding:var(--pad) var(--gut) 40px}
footer .big{background:var(--sig);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(prefers-reduced-motion:reduce){.mq-track,.btn.grad::after,.price.hot::after{animation:none}}
footer .big{font-weight:700;perspective:800px}footer .big .fc{background:var(--sig);background-size:500% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-in{max-width:min(46vw,760px)}
.prices{background:none!important;border:0!important;overflow:visible!important}
@media(max-width:1000px){.hero-in{max-width:none}.hero{min-height:1040px}#gl{top:auto;bottom:0;height:420px}}
@media(max-width:1000px){.hero{min-height:960px}#gl{height:440px}}

.cursor{opacity:0!important}.cursor.on{opacity:.85!important}
footer .big{background:none!important;-webkit-text-fill-color:initial}footer .big .fc{display:inline-block;-webkit-text-fill-color:transparent}
.lxmark{width:28px;height:28px;border-radius:8px;display:block;box-shadow:0 4px 14px rgba(75,31,255,.25)}
.lxfoot{width:18px;height:18px;border-radius:5px;vertical-align:-4px;margin-right:7px;display:inline-block}

.cglow{position:fixed;left:0;top:0;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(138,43,255,.14),rgba(224,20,74,.06) 40%,transparent 70%);will-change:transform}
/* glossy card treatment */
.price{position:relative;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 24px 50px -28px rgba(138,43,255,.35),0 10px 24px -18px rgba(224,20,74,.25);transform:perspective(1200px) rotateX(1.2deg);transition:transform .6s cubic-bezier(.16,1,.3,1)}
.price:hover{transform:perspective(1200px) rotateX(0) translateY(-6px)}
.price::after{content:"";position:absolute;top:0;bottom:0;left:0;width:60%;pointer-events:none;background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.35) 50%,transparent 80%);transform:translateX(-120%);animation:gsheen 8s ease-in-out infinite}
.price:nth-child(2)::after{animation-delay:-2.6s}.price:nth-child(3)::after{animation-delay:-5.2s}
@keyframes gsheen{0%,60%{transform:translateX(-120%)}100%{transform:translateX(260%)}}
@media (prefers-reduced-motion:reduce){.price::after{animation:none}.cglow{display:none}}
/* darker bg pass */
:root{--bg:#dcd9d2;--bg2:#cfccc4;--ink:#0e0d0a;--mut:#4e4c45;--dim:#6b6962;--line:#0d0d121c;--line2:#0d0d122e}
body{background:var(--bg)}
.nav{background:#dcd9d2cc}
.hero{background:radial-gradient(ellipse 45% 55% at 0% 0%,#cfc3ff 0%,transparent 60%),radial-gradient(ellipse 40% 50% at 100% 100%,#ffc9b3 0%,transparent 60%),radial-gradient(ellipse 55% 60% at 72% 50%,#efede8 0%,#dcd9d2 70%)}