/* Snipzo — cyberpunk / neon interface.
   Palette: void #05060d, cyan #00f0ff, magenta #ff2bd6, acid #c6ff00, violet #8b5cf6.
   Fonts: Russo One (display), Manrope (body), JetBrains Mono (HUD labels). All Cyrillic-capable. */
:root{
  --void:#05060d;--deep:#0a0c1a;--panel:rgba(14,17,36,.72);--line:rgba(0,240,255,.18);
  --text:#e6e9ff;--muted:#8b90b8;
  --cyan:#00f0ff;--magenta:#ff2bd6;--acid:#c6ff00;--violet:#8b5cf6;--orange:#ff7a1a;--mint:#2bffb1;
  --r:16px;
  --display:"Russo One",system-ui,sans-serif;--body:"Manrope",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace;
  --clip:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--text);font:16px/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
svg{display:block}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:.01em;margin:0}
h1{font-size:clamp(2.4rem,6vw,4.6rem)}
h2{font-size:clamp(1.6rem,3.2vw,2.5rem)}
h3{font-size:1.05rem}
.wrap{width:min(1200px,100% - 40px);margin-inline:auto;position:relative}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--acid);color:var(--void);padding:8px 12px}
.lead{font-size:1.1rem;color:var(--muted);max-width:48ch}
::selection{background:var(--magenta);color:#fff}

/* ---------- animated background ---------- */
.fx-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.fx-grid{position:absolute;left:-50%;right:-50%;bottom:-10%;height:70%;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:60px 60px;transform:perspective(500px) rotateX(62deg);transform-origin:bottom;
  mask-image:linear-gradient(to top,#000 10%,transparent 85%);animation:gridmove 4s linear infinite}
@keyframes gridmove{to{background-position:0 60px,0 0}}
.fx-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.45;animation:orb 18s ease-in-out infinite alternate}
.o1{width:520px;height:520px;background:var(--magenta);top:-160px;left:-120px}
.o2{width:560px;height:560px;background:var(--cyan);top:20%;right:-200px;animation-delay:-9s;opacity:.3}
@keyframes orb{to{transform:translate(80px,120px) scale(1.15)}}
.fx-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border:0;
  font:700 .95rem var(--mono);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;cursor:pointer;clip-path:var(--clip);
  transition:transform .2s,filter .2s,box-shadow .2s}
.btn-lime{background:linear-gradient(100deg,var(--cyan),var(--acid));color:var(--void)}
.btn-lime:hover{transform:translateY(-2px);filter:drop-shadow(0 0 18px rgba(0,240,255,.7))}
.btn-lime::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s}
.btn-lime:hover::after{transform:translateX(120%)}
.btn-ghost{background:transparent;color:var(--cyan);box-shadow:inset 0 0 0 1.5px var(--cyan)}
.btn-ghost:hover{background:rgba(0,240,255,.1);box-shadow:inset 0 0 0 1.5px var(--cyan),0 0 24px rgba(0,240,255,.35)}
.btn-dark{background:var(--void);color:var(--acid);box-shadow:inset 0 0 0 1.5px var(--acid)}
.btn-dark:hover{box-shadow:inset 0 0 0 1.5px var(--acid),0 0 26px rgba(198,255,0,.45)}
.btn-sm{padding:10px 18px;font-size:.8rem}
.btn-block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed;filter:none;transform:none}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:30;background:rgba(5,6,13,.72);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),var(--magenta),transparent);opacity:.8}
.top-row{display:flex;align-items:center;gap:30px;height:72px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo-mark{display:grid;place-items:center;width:40px;height:40px;clip-path:var(--clip);background:linear-gradient(135deg,var(--cyan),var(--magenta));animation:hue 8s linear infinite}
@keyframes hue{to{filter:hue-rotate(360deg)}}
.logo-mark svg{width:24px;height:24px;fill:none;stroke:var(--void);stroke-width:2.8;stroke-linecap:round}
.logo-word{font:400 1.5rem var(--display);letter-spacing:.02em;color:#fff}
.logo-word b{font-weight:400;color:var(--cyan);text-shadow:0 0 14px rgba(0,240,255,.7)}
.nav{display:flex;gap:26px;margin-left:10px}
.nav a{position:relative;text-decoration:none;font:500 .82rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:6px 0;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .3s;box-shadow:0 0 8px var(--cyan)}
.nav a:hover,.nav a[aria-current]{color:#fff}
.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.top-cta{margin-left:auto}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--line);width:44px;height:44px;cursor:pointer}
.burger span{display:block;height:2px;margin:7px 9px;background:var(--cyan);box-shadow:0 0 6px var(--cyan)}
.mobile-nav{display:grid;padding:10px 20px 20px;border-top:1px solid var(--line)}
.mobile-nav[hidden]{display:none}
.mobile-nav a{padding:12px 0;font:500 .9rem var(--mono);text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--line)}

/* ---------- hero ---------- */
.hero{padding:90px 0 110px;position:relative}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 24px;padding:7px 14px;border:1px solid var(--line);background:rgba(0,240,255,.06);
  font:500 .78rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cyan)}
.kicker-dark{color:var(--void);border-color:rgba(5,6,13,.35);background:rgba(5,6,13,.08)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 10px var(--acid);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.glitch{position:relative;color:#fff}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;inset:0;overflow:hidden}
.glitch::before{color:var(--magenta);transform:translate(-2px,0);clip-path:inset(0 0 60% 0);animation:g1 3.2s infinite steps(1)}
.glitch::after{color:var(--cyan);transform:translate(2px,0);clip-path:inset(55% 0 0 0);animation:g2 2.7s infinite steps(1)}
@keyframes g1{0%,86%,100%{transform:none;clip-path:inset(0 0 100% 0)}88%{transform:translate(-4px,1px);clip-path:inset(10% 0 55% 0)}91%{transform:translate(3px,-1px);clip-path:inset(40% 0 30% 0)}94%{transform:translate(-2px,0);clip-path:inset(70% 0 5% 0)}}
@keyframes g2{0%,80%,100%{transform:none;clip-path:inset(100% 0 0 0)}83%{transform:translate(4px,0);clip-path:inset(60% 0 10% 0)}87%{transform:translate(-3px,1px);clip-path:inset(20% 0 60% 0)}}
.h1-sub{margin:6px 0 0;font:400 clamp(2.4rem,6vw,4.6rem)/1.08 var(--display)}
.hl{background:linear-gradient(90deg,var(--cyan),var(--magenta),var(--acid),var(--cyan));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flow 6s linear infinite;filter:drop-shadow(0 0 22px rgba(255,43,214,.35))}
@keyframes flow{to{background-position:300% 0}}
.hero .lead{margin:26px 0 34px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px}
.hero-facts{display:flex;flex-wrap:wrap;gap:34px;list-style:none;padding:0;margin:44px 0 0;font:500 .78rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hero-facts li{padding-left:14px;border-left:2px solid var(--magenta)}
.hero-facts b{display:block;font:400 1.7rem var(--display);color:#fff;letter-spacing:0;text-transform:none}

/* HUD panel */
.hero-art{position:relative;height:460px;perspective:1200px}
.hud{position:absolute;inset:20px 10px 20px 30px;background:var(--panel);border:1px solid var(--line);clip-path:var(--clip);backdrop-filter:blur(10px);
  box-shadow:0 0 0 1px rgba(255,43,214,.15),0 30px 80px -20px rgba(0,240,255,.35);transform:rotateY(-10deg) rotateX(4deg);animation:float 7s ease-in-out infinite;display:flex;flex-direction:column}
@keyframes float{50%{transform:rotateY(-6deg) rotateX(2deg) translateY(-10px)}}
.hud-bar{display:flex;justify-content:space-between;padding:12px 18px;border-bottom:1px solid var(--line);font:500 .72rem var(--mono);letter-spacing:.08em;color:var(--muted)}
.blink{color:var(--magenta);animation:pulse 1.2s steps(2) infinite}
.hud-view{position:relative;flex:1;margin:16px;overflow:hidden;background:#090b18}
.hud-img{position:absolute;inset:0}
.hud-before{background:radial-gradient(circle at 50% 42%,#ffb48a 0 15%,transparent 16%),radial-gradient(ellipse at 50% 100%,#b34cff 0 36%,transparent 37%),linear-gradient(160deg,#3c2f4f,#16121f 70%)}
.hud-after{background:radial-gradient(circle at 50% 42%,#ffb48a 0 15%,transparent 16%),radial-gradient(ellipse at 50% 100%,#b34cff 0 36%,transparent 37%),
  repeating-conic-gradient(rgba(0,240,255,.12) 0 25%,transparent 0 50%) 0 0/22px 22px;clip-path:inset(0 0 0 50%);animation:reveal 5s ease-in-out infinite}
@keyframes reveal{0%,100%{clip-path:inset(0 0 0 85%)}50%{clip-path:inset(0 0 0 15%)}}
.hud-beam{position:absolute;top:0;bottom:0;width:2px;background:var(--cyan);box-shadow:0 0 18px 4px var(--cyan);animation:beam 5s ease-in-out infinite}
@keyframes beam{0%,100%{left:85%}50%{left:15%}}
.hud-tag{position:absolute;bottom:12px;font:700 .68rem var(--mono);letter-spacing:.1em;padding:4px 8px;background:rgba(5,6,13,.8);border:1px solid var(--line)}
.t-l{left:12px;color:var(--magenta)}.t-r{right:12px;color:var(--cyan)}
.corner{position:absolute;width:16px;height:16px;border:2px solid var(--cyan)}
.c1{top:6px;left:6px;border-right:0;border-bottom:0}.c2{top:6px;right:6px;border-left:0;border-bottom:0}
.c3{bottom:6px;left:6px;border-right:0;border-top:0}.c4{bottom:6px;right:6px;border-left:0;border-top:0}
.hud-rows{display:grid;gap:8px;padding:0 18px 18px;font:500 .72rem var(--mono);color:var(--muted)}
.hud-rows div{display:grid;grid-template-columns:90px 1fr 38px;align-items:center;gap:10px}
.hud-rows em{font-style:normal;color:var(--acid);text-align:right}
.bar{height:4px;background:rgba(255,255,255,.08);overflow:hidden}
.bar i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--magenta),var(--cyan));box-shadow:0 0 10px var(--cyan);animation:load 2.4s ease-out both}
@keyframes load{from{width:0}}
.float{position:absolute;padding:9px 14px;font:700 .72rem var(--mono);letter-spacing:.08em;background:rgba(5,6,13,.85);border:1px solid currentColor;clip-path:var(--clip);animation:bob 5s ease-in-out infinite}
.f1{top:0;left:0;color:var(--acid);box-shadow:0 0 20px rgba(198,255,0,.25)}
.f2{bottom:0;left:70px;color:var(--magenta);animation-delay:-1.5s}
.f3{top:70px;right:-6px;color:var(--cyan);animation-delay:-3s}
@keyframes bob{50%{transform:translateY(-12px)}}

/* ---------- sections ---------- */
.section{padding:90px 0 0}
.section-tight{padding:30px 0 0}
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:30px}
.sec-head h2::before,.faq>h2::before{content:"// ";color:var(--magenta);font-family:var(--mono);font-size:.6em;vertical-align:middle}
.more{font:500 .8rem var(--mono);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--cyan)}
.more:hover{text-shadow:0 0 12px var(--cyan)}

/* category palette */
.c-lime{--accent:var(--acid)}.c-violet{--accent:var(--violet)}.c-pink{--accent:var(--magenta)}
.c-orange{--accent:var(--orange)}.c-sky{--accent:var(--cyan)}.c-mint{--accent:var(--mint)}

/* glass panel base with cursor spotlight */
.cat,.card,.steps li,details,.ticket{position:relative;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px)}
.cat::after,.card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--accent) 22%,transparent),transparent 60%)}
.cat:hover::after,.card:hover::after{opacity:1}

/* category tiles */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cat{display:flex;flex-direction:column;gap:8px;padding:26px;text-decoration:none;clip-path:var(--clip);transition:transform .3s,border-color .3s,box-shadow .3s;overflow:hidden}
.cat:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 18px 50px -18px var(--accent)}
.cat::before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--accent);box-shadow:0 0 14px var(--accent)}
.cat-tag{align-self:flex-start;font:700 .7rem var(--mono);letter-spacing:.14em;padding:4px 10px;color:var(--accent);border:1px solid var(--accent)}
.cat-name{font:400 1.45rem var(--display);margin-top:18px;color:#fff}
.cat-text{color:var(--muted);font-size:.95rem}
.cat-count{margin-top:auto;padding-top:14px;font:500 .74rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);border-top:1px dashed var(--line)}

/* product cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:18px}
.card{display:flex;flex-direction:column;gap:12px;padding:24px;text-decoration:none;clip-path:var(--clip);overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--accent),transparent);box-shadow:0 0 12px var(--accent)}
.card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 20px 50px -20px var(--accent)}
.card-top{display:flex;justify-content:space-between;align-items:center}
.chip{display:inline-block;font:700 .68rem var(--mono);letter-spacing:.14em;padding:4px 10px;color:var(--accent);border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.hit{font:700 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;color:var(--void);background:var(--magenta);box-shadow:0 0 14px rgba(255,43,214,.6)}
.card-name{font:400 1.15rem/1.25 var(--display);color:#fff}
.card-text{color:var(--muted);font-size:.92rem;flex:1}
.card-foot{display:flex;justify-content:space-between;align-items:end;padding-top:16px;border-top:1px dashed var(--line)}
.card-price{font:400 1.55rem var(--display);color:#fff}
.card-price small{display:block;font:500 .7rem var(--mono);letter-spacing:.05em;color:var(--muted);text-transform:uppercase}
.card-go{display:grid;place-items:center;width:40px;height:40px;color:var(--accent);border:1px solid var(--accent);font-weight:700;transition:all .3s}
.card:hover .card-go{background:var(--accent);color:var(--void);box-shadow:0 0 18px var(--accent)}
.card-pro{background:linear-gradient(145deg,rgba(255,43,214,.16),rgba(0,240,255,.12));border-color:rgba(255,43,214,.5)}
.card-pro .card-name{background:linear-gradient(90deg,#fff,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}

/* how */
.how{margin-top:100px;padding:90px 0;position:relative;border-block:1px solid var(--line);background:linear-gradient(180deg,rgba(139,92,246,.1),rgba(0,240,255,.04))}
.how h2::before{content:"// ";color:var(--magenta);font-family:var(--mono);font-size:.6em;vertical-align:middle}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;padding:0;margin:40px 0 0;counter-reset:s}
.steps li{padding:30px;clip-path:var(--clip)}
.steps span{display:block;font:400 3rem var(--display);margin-bottom:14px;color:transparent;-webkit-text-stroke:1.5px var(--cyan);text-shadow:0 0 24px rgba(0,240,255,.4)}
.steps h3{color:#fff}
.steps p{color:var(--muted);margin:8px 0 0}

/* pro band */
.pro-band{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:44px;clip-path:var(--clip);overflow:hidden;
  background:linear-gradient(110deg,var(--magenta),var(--violet) 45%,var(--cyan));color:var(--void)}
.pro-band::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.08) 0 2px,transparent 2px 14px);animation:slide 6s linear infinite}
@keyframes slide{to{background-position:200px 0}}
.pro-band>*{position:relative}
.pro-band h2{color:var(--void)}
.pro-band p{margin:10px 0 0;max-width:52ch;font-weight:600}

/* faq */
.faq{padding-bottom:20px}
.faq>h2{margin-bottom:26px}
details{margin-bottom:12px;transition:border-color .3s}
details[open]{border-color:var(--cyan);box-shadow:0 0 30px -12px var(--cyan)}
summary{cursor:pointer;padding:20px 24px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px;color:#fff}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:700 1.2rem var(--mono);color:var(--cyan);transition:transform .3s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:0;padding:0 24px 22px;color:var(--muted)}

/* page head + filters */
.page-head{padding:56px 0 0}
.crumbs{font:500 .76rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 16px}
.crumbs a{text-decoration:none;color:var(--cyan)}
.page-head h1{color:#fff}
.page-head .lead{margin:16px 0 0}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.filters a{padding:9px 16px;font:500 .78rem var(--mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--muted);border:1px solid var(--line);transition:all .2s}
.filters a:hover{color:#fff;border-color:var(--cyan)}
.filters a[aria-current]{color:var(--void);background:var(--cyan);border-color:var(--cyan);box-shadow:0 0 20px rgba(0,240,255,.5)}

/* tool page */
.tool{display:grid;grid-template-columns:1fr 380px;gap:44px;align-items:start;padding-top:20px}
.tool h1{font-size:clamp(2rem,4.4vw,3.2rem);margin:18px 0 0;color:#fff}
.tool .lead{margin:18px 0 24px}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.ticks li{position:relative;padding-left:36px;font-weight:600}
.ticks li::before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border:1.5px solid var(--accent);box-shadow:0 0 10px var(--accent),inset 0 0 6px var(--accent);transform:rotate(45deg) scale(.75)}
.dropzone{display:flex;align-items:center;gap:16px;margin-top:34px;padding:32px;border:1px dashed var(--accent);color:var(--muted);font-weight:600;
  background:repeating-linear-gradient(45deg,transparent 0 10px,rgba(255,255,255,.02) 10px 20px);animation:dash 1.5s ease-in-out infinite alternate}
@keyframes dash{to{box-shadow:inset 0 0 40px -14px var(--accent)}}
.dropzone svg{width:36px;height:36px;flex:none;fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ticket{position:sticky;top:100px;padding:28px;clip-path:var(--clip);border-color:var(--accent);box-shadow:0 0 50px -20px var(--accent)}
.ticket-top{display:flex;justify-content:space-between;font:500 .72rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.ticket-price{font:400 3.2rem var(--display);margin:16px 0 4px;color:#fff;text-shadow:0 0 30px var(--accent)}
.ticket-sub{margin:0;color:var(--muted);font-size:.88rem}
.ticket-cut{margin:24px 0;border-top:1px dashed var(--line)}
.ticket-note{font-size:.84rem;color:var(--muted);margin:14px 0 0;text-align:center}
.ticket-list{list-style:none;padding:18px 0 0;margin:18px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;font-size:.88rem;font-weight:600}
.ticket-list li::before{content:"› ";color:var(--accent);font-family:var(--mono)}

/* prose */
.prose{max-width:780px;padding:26px 0 20px}
.prose h2{font-size:1.2rem;margin:34px 0 10px;color:var(--cyan)}
.prose p{color:#c4c8e8}

/* 404 */
.notfound{text-align:center;padding:100px 0 40px}
.notfound .big{font:400 clamp(6rem,18vw,11rem)/1 var(--display);margin:0;color:transparent;-webkit-text-stroke:2px var(--magenta);text-shadow:0 0 40px rgba(255,43,214,.5);animation:flick 3s infinite}
@keyframes flick{0%,19%,21%,60%,62%,100%{opacity:1}20%,61%{opacity:.4}}
.notfound h1{color:#fff;margin-top:12px}
.notfound .lead{margin:18px auto 30px}

/* footer */
.foot{margin-top:110px;position:relative;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(10,12,26,.6),var(--void))}
.cutline{height:1px;background:linear-gradient(90deg,transparent,var(--magenta),var(--cyan),transparent);box-shadow:0 0 14px var(--cyan)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px;padding:60px 0 40px}
.foot h3{font:500 .74rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:16px}
.foot-grid a:not(.logo){display:block;text-decoration:none;padding:4px 0;font-size:.92rem;color:var(--muted);transition:color .2s,transform .2s}
.foot-grid a:not(.logo):hover{color:#fff;transform:translateX(4px)}
.foot-note{margin:18px 0 0;font-size:.92rem;max-width:34ch;color:var(--muted)}
.foot-bottom{display:flex;justify-content:space-between;gap:12px;padding:22px 0 34px;border-top:1px solid var(--line);font:500 .74rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.logo-light .logo-word{color:#fff}

/* ---------- bundle builder ---------- */
.builder-promo{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:40px;text-decoration:none;clip-path:var(--clip);
  background:var(--panel);border:1px solid rgba(0,240,255,.45);box-shadow:0 0 60px -25px var(--cyan);overflow:hidden;transition:transform .3s,box-shadow .3s}
.builder-promo::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(0,240,255,.12) 50%,transparent 60%);background-size:250% 100%;animation:flow 5s linear infinite}
.builder-promo>*{position:relative}
.builder-promo:hover{transform:translateY(-4px);box-shadow:0 0 80px -20px var(--cyan)}
.builder-promo h2{color:#fff}
.builder-promo p:not(.kicker){margin:10px 0 0;color:var(--muted);max-width:56ch}
.tiers{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:26px 0 0}
.tiers li{padding:8px 14px;font:500 .78rem var(--mono);letter-spacing:.04em;color:var(--muted);border:1px solid var(--line);transition:all .3s}
.tiers b{color:#fff;margin-right:4px}
.tiers li.on,.tiers li[data-tier].on{color:var(--void);background:var(--acid);border-color:var(--acid);box-shadow:0 0 18px rgba(198,255,0,.5)}
.tiers li.on b{color:var(--void)}
.builder{display:grid;grid-template-columns:1fr 390px;gap:40px;align-items:start;padding-top:34px}
.builder-list .tiers{margin:0 0 22px}
.builder-tools{display:flex;gap:10px;margin-bottom:18px}
.bgroup{margin:0 0 22px;padding:0;border:0;min-width:0}
.bgroup legend{display:flex;align-items:center;gap:10px;padding:0;margin-bottom:12px;font:400 1.15rem var(--display);color:#fff}
.bitem{position:relative;display:block;padding:14px 18px;margin-bottom:8px;
  background:var(--panel);border:1px solid var(--line);transition:border-color .2s,background .2s,box-shadow .2s}
.bitem:hover{border-color:var(--accent)}
.bitem input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}
.bbox{width:22px;height:22px;border:1.5px solid var(--accent);transform:rotate(45deg) scale(.8);transition:all .2s}
.bitem input:checked ~ .bbox{background:var(--accent);box-shadow:0 0 14px var(--accent)}
.bitem input:focus-visible ~ .bbox{outline:2px solid #fff;outline-offset:4px}
.bitem.is-on,.bitem:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--deep));box-shadow:inset 3px 0 0 var(--accent)}
.bname{font-weight:700;color:#fff}
.bname small{display:block;font:500 .7rem var(--mono);color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.bprice{font:400 1.05rem var(--display);color:#fff;white-space:nowrap}
.builder-sum{position:sticky;top:100px}
.bchosen{list-style:none;padding:0;margin:16px 0 0;max-height:220px;overflow:auto;display:grid;gap:6px;font-size:.88rem}
.bchosen li{display:flex;justify-content:space-between;gap:10px;color:#c4c8e8}
.bchosen li span:last-child{font-family:var(--mono);color:var(--muted);white-space:nowrap}
.bchosen .bempty{color:var(--muted);font-style:italic}
.bcalc{margin:0;display:grid;gap:6px;font-size:.9rem}
.bcalc div{display:flex;justify-content:space-between}
.bcalc dt{color:var(--muted)}.bcalc dd{margin:0;font-family:var(--mono);color:#fff}
.bcalc [data-pct]{color:var(--acid);font-family:var(--mono)}
.builder-sum .ticket-price{margin-top:14px}
.bump{animation:bump .35s ease}
@keyframes bump{40%{transform:scale(1.06);color:var(--cyan)}}
.bpro{margin:14px 0;padding:12px 14px;font-size:.88rem;border:1px solid var(--magenta);color:#ffd1f3;background:rgba(255,43,214,.08)}
.bpro a{color:#fff;font-weight:700}
.builder-sum .btn{margin-top:18px}
@media (max-width:980px){.builder{grid-template-columns:1fr}.builder-sum{position:static}.builder-promo{flex-direction:column;align-items:flex-start}}

/* ---------- home: featured builder ---------- */
.feature{padding-top:20px}
.feature-box{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:44px;padding:48px;clip-path:var(--clip);
  background:linear-gradient(135deg,rgba(0,240,255,.10),rgba(255,43,214,.10) 55%,rgba(198,255,0,.06));border:1px solid rgba(0,240,255,.4);
  box-shadow:0 0 90px -30px var(--cyan),inset 0 0 0 1px rgba(255,43,214,.12);overflow:hidden}
.feature-box::before{content:"";position:absolute;inset:-2px;background:conic-gradient(from var(--a,0deg),transparent 0 70%,var(--cyan) 80%,var(--magenta) 90%,transparent 100%);
  animation:spin 6s linear infinite;opacity:.35;mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);-webkit-mask-composite:xor;mask-composite:exclude;padding:2px;pointer-events:none}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spin{to{--a:360deg}}
.feature-box>*{position:relative}
.feature-copy h2{font-size:clamp(2.2rem,4.6vw,3.6rem);color:#fff;text-shadow:0 0 40px rgba(0,240,255,.35)}
.feature-lead{color:#c4c8e8;font-size:1.08rem;margin:18px 0 26px;max-width:46ch}
.feature-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;list-style:none;padding:0;margin:0}
.feature-tiers li{display:flex;flex-direction:column;align-items:center;padding:12px 6px;border:1px solid var(--line);background:rgba(5,6,13,.5);transition:all .35s}
.feature-tiers b{font:400 1.35rem var(--display);color:#fff}
.feature-tiers span{font:500 .68rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.feature-tiers li.on{background:var(--acid);border-color:var(--acid);box-shadow:0 0 24px rgba(198,255,0,.55);transform:translateY(-3px)}
.feature-tiers li.on b,.feature-tiers li.on span{color:var(--void)}
.feature-meter{height:6px;margin:14px 0 30px;background:rgba(255,255,255,.07);overflow:hidden}
.feature-meter i{display:block;height:100%;width:var(--fill,0%);background:linear-gradient(90deg,var(--magenta),var(--cyan),var(--acid));box-shadow:0 0 14px var(--cyan);transition:width .5s cubic-bezier(.2,.7,.2,1)}
.feature-note{display:block;margin-top:14px;font:500 .74rem var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.feature-demo{display:flex;flex-direction:column;background:rgba(5,6,13,.72);border:1px solid var(--line);clip-path:var(--clip)}
.feature-demo .hud-bar span:last-child{color:var(--acid)}
.feature-picks{padding:14px 14px 4px;max-height:340px;overflow:auto}
.feature-picks .bitem{padding:11px 14px;margin-bottom:7px}
.feature-picks .bname{font-size:.95rem}
.feature-sum{margin-top:auto;padding:16px 20px 20px;border-top:1px dashed var(--line);display:grid;gap:6px}
.feature-sum div{display:flex;justify-content:space-between;align-items:baseline;font-size:.9rem;color:var(--muted)}
.feature-sum b{font-family:var(--mono);font-weight:700;color:#fff}
.feature-sum em{font-style:normal;color:var(--acid);font-family:var(--mono)}
.feature-total{margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
.feature-total span{font:500 .8rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cyan)}
.feature-total b{font:400 2.2rem var(--display)!important;text-shadow:0 0 26px rgba(0,240,255,.6)}
.feature-sum p{margin:4px 0 0;font-size:.84rem;color:var(--acid)}
@media (max-width:980px){.feature-box{grid-template-columns:1fr;padding:30px}}
@media (max-width:600px){.feature-box{padding:22px}.feature-tiers{grid-template-columns:repeat(2,1fr)}}

/* ---------- quantity sliders ---------- */
.bhead{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:14px;cursor:pointer}
.bqty{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;margin:12px 0 2px 40px}
.bitem:not(.is-on) .bqty{opacity:.45}
.bitem:not(.is-on) .bqty:hover{opacity:.8}
.bqty-read{font:500 .74rem var(--mono);color:var(--muted);text-align:right;white-space:nowrap}
.bqty-read b{color:#fff;font-weight:700}
.bqty-read em{display:block;font-style:normal;color:var(--acid)}
input[type=range][data-qty]{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer;--p:0%}
input[type=range][data-qty]::-webkit-slider-runnable-track{height:4px;background:linear-gradient(90deg,var(--accent,var(--cyan)) var(--p),rgba(255,255,255,.12) var(--p))}
input[type=range][data-qty]::-moz-range-track{height:4px;background:rgba(255,255,255,.12)}
input[type=range][data-qty]::-moz-range-progress{height:4px;background:var(--accent,var(--cyan))}
input[type=range][data-qty]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;background:var(--void);border:2px solid var(--accent,var(--cyan));transform:rotate(45deg);box-shadow:0 0 12px var(--accent,var(--cyan))}
input[type=range][data-qty]::-moz-range-thumb{width:14px;height:14px;background:var(--void);border:2px solid var(--accent,var(--cyan));border-radius:0;transform:rotate(45deg);box-shadow:0 0 12px var(--accent,var(--cyan))}
input[type=range][data-qty]:focus-visible{outline:1px dashed var(--accent,var(--cyan));outline-offset:4px}
.bchosen li span:first-child small{display:block;font:500 .7rem var(--mono);color:var(--muted)}
.tqty{margin:20px 0 4px;padding:16px;border:1px solid var(--line);background:rgba(5,6,13,.5)}
.tqty label{display:block;font:500 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tqty>b{display:block;margin:4px 0 8px;font:400 1.25rem var(--display);color:#fff}
.tqty-scale{display:flex;justify-content:space-between;margin-top:6px;font:500 .66rem var(--mono);color:var(--muted)}
.tqty-scale span{display:flex;flex-direction:column;align-items:center;transition:color .2s}
.tqty-scale i{font-style:normal;opacity:.7}
.tqty-scale span.on{color:var(--acid)}
.tqty-off{min-height:1.2em;margin:8px 0 0;font:700 .8rem var(--mono);color:var(--acid)}
@media (max-width:600px){.bqty{margin-left:0}}

/* reveal on scroll (enabled by JS) */
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .reveal.in{opacity:1;transform:none}

/* responsive */
@media (max-width:980px){
  .nav,.top-cta{display:none}.burger{display:block}
  .hero-grid,.tool{grid-template-columns:1fr}
  .hero{padding:60px 0 80px}
  .hero-art{height:380px}
  .hud{transform:none;animation:none;inset:20px 0}
  .cats{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .ticket{position:static}
  .pro-band{flex-direction:column;align-items:flex-start}
}
@media (max-width:600px){
  .cats{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column}
  .pro-band{padding:30px}
  .float{display:none}
  .hero-facts{gap:22px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
}
