:root{
  --bg:#06060a;
  --bg-2:#0b0b14;
  --fg:#eaf0ff;
  --muted:#7b809a;
  --neon:#b16bff;     /* purple */
  --blue:#3df0ff;     /* electric */
  --acid:#c8ff3d;     /* green */
  --hot:#ff2e7e;      /* magenta */
  --line:rgba(255,255,255,.08);
  --grad:linear-gradient(90deg,var(--blue),var(--neon) 55%,var(--hot));
  --mono:'JetBrains Mono', ui-monospace, monospace;
  --display:'Orbitron', system-ui, sans-serif;
  --body:'Space Grotesk', system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--fg);font-family:var(--body);-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:none;color:inherit}

.container{max-width:1280px;margin:0 auto;padding:0 24px}

/* GLOBAL FX */
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:90;
  background:repeating-linear-gradient(to bottom,transparent 0 2px,rgba(255,255,255,.025) 2px 3px);
  mix-blend-mode:overlay}
.noise{position:fixed;inset:0;pointer-events:none;z-index:91;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* NAV */
.nav{position:sticky;top:0;z-index:80;backdrop-filter:blur(14px);background:rgba(6,6,10,.6);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 24px}
.logo{font-family:var(--display);font-weight:900;letter-spacing:.08em;font-size:18px}
.logo .dot{color:var(--acid)}
.glitch-x{color:var(--blue);text-shadow:0 0 12px var(--blue)}
.nav nav{display:flex;gap:28px;font-family:var(--mono);font-size:13px;color:var(--muted)}
.nav nav a:hover{color:var(--fg)}
.nav-cta{padding:10px 18px}
@media(max-width:780px){.nav nav{display:none}}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 22px;font-family:var(--mono);font-weight:600;font-size:13px;letter-spacing:.12em;border:1px solid transparent;border-radius:2px;transition:transform .15s ease,box-shadow .15s}
.btn-primary{background:var(--fg);color:#000;box-shadow:0 0 0 1px var(--fg),6px 6px 0 0 var(--neon)}
.btn-primary:hover{transform:translate(-2px,-2px);box-shadow:0 0 0 1px var(--fg),10px 10px 0 0 var(--neon)}
.btn-ghost{border-color:var(--line);color:var(--fg)}
.btn-ghost:hover{border-color:var(--blue);box-shadow:0 0 24px rgba(61,240,255,.25)}
.btn.big{padding:20px 36px;font-size:15px}

/* HERO */
.hero{position:relative;padding:72px 0 0;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-20% -10% 0 -10%;background:
  radial-gradient(circle at 20% 30%,rgba(177,107,255,.25),transparent 50%),
  radial-gradient(circle at 80% 20%,rgba(61,240,255,.18),transparent 55%);
  filter:blur(20px);z-index:-1}
.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
@media(max-width:880px){.hero-grid{grid-template-columns:1fr}}
.tag{font-family:var(--mono);font-size:12px;color:var(--acid);letter-spacing:.18em;margin-bottom:20px}
.display{font-family:var(--display);font-weight:900;font-size:clamp(48px,8vw,120px);line-height:.92;letter-spacing:-.02em;text-transform:uppercase}
.display.sm{font-size:clamp(34px,5vw,68px)}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;animation:hue 8s linear infinite}
@keyframes hue{to{filter:hue-rotate(360deg)}}
.lead{font-size:18px;color:#cdd2e4;max-width:520px;margin-top:24px;line-height:1.5}
.lead.muted{color:var(--muted)}
.hero-ctas{display:flex;gap:16px;margin-top:32px;flex-wrap:wrap}
.hero-stats{display:flex;gap:32px;margin-top:48px;border-top:1px solid var(--line);padding-top:24px;flex-wrap:wrap}
.hero-stats div{display:flex;flex-direction:column}
.hero-stats b{font-family:var(--display);font-size:24px}
.hero-stats span{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.12em;margin-top:4px}

/* HERO VISUAL */
.hero-frame{position:relative;aspect-ratio:1/1;border:1px solid var(--line);background:#000;overflow:hidden;box-shadow:0 0 80px rgba(177,107,255,.18)}
.hero-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(1.15) contrast(1.05);animation:flicker 6s infinite}
@keyframes flicker{0%,98%,100%{filter:saturate(1.15) contrast(1.05)}99%{filter:hue-rotate(20deg) saturate(1.4)}}
.frame-corner{position:absolute;width:24px;height:24px;border:2px solid var(--blue)}
.frame-corner.tl{top:8px;left:8px;border-right:none;border-bottom:none}
.frame-corner.tr{top:8px;right:8px;border-left:none;border-bottom:none}
.frame-corner.bl{bottom:8px;left:8px;border-right:none;border-top:none}
.frame-corner.br{bottom:8px;right:8px;border-left:none;border-top:none}
.hud{position:absolute;left:16px;bottom:16px;display:flex;flex-direction:column;gap:4px;font-family:var(--mono);font-size:11px;color:var(--acid);text-shadow:0 0 8px rgba(200,255,61,.5)}

/* TICKER */
.ticker{margin-top:64px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:#000}
.ticker-track{display:flex;gap:32px;padding:14px 0;white-space:nowrap;font-family:var(--mono);font-size:12px;color:var(--blue);letter-spacing:.16em;animation:marquee 40s linear infinite}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker-track span:nth-child(even){color:var(--neon)}

/* SECTIONS */
.section{padding:120px 0}
.section.dim{background:var(--bg-2)}
.section-head{margin-bottom:56px;max-width:720px}

/* MENU GRID */
.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:980px){.menu-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.menu-grid{grid-template-columns:1fr}}
.card{position:relative;border:1px solid var(--line);background:linear-gradient(180deg,#0d0d18,#070710);overflow:hidden;transition:transform .25s,border-color .25s}
.card:hover{transform:translateY(-4px);border-color:var(--neon);box-shadow:0 30px 60px -20px rgba(177,107,255,.4)}
.card-img{aspect-ratio:4/3;overflow:hidden;position:relative}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover .card-img img{transform:scale(1.06)}
.card-badge{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:10px;background:var(--acid);color:#000;padding:4px 8px;letter-spacing:.12em;font-weight:700}
.card-body{padding:20px}
.card-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card-name{font-family:var(--display);font-size:18px;font-weight:700;letter-spacing:.04em}
.card-price{font-family:var(--mono);color:var(--blue);font-weight:600}
.card-desc{margin-top:8px;color:var(--muted);font-size:14px;line-height:1.5}
.card-meta{margin-top:16px;display:flex;gap:8px;flex-wrap:wrap}
.chip{font-family:var(--mono);font-size:10px;color:var(--muted);border:1px solid var(--line);padding:4px 8px;letter-spacing:.12em}

/* STRIP */
.strip{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
@media(max-width:900px){.strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.strip{grid-template-columns:repeat(2,1fr)}}
.tile{border:1px solid var(--line);background:#0a0a14;overflow:hidden}
.tile img{aspect-ratio:1/1;object-fit:cover;width:100%;transition:transform .5s}
.tile:hover img{transform:scale(1.08)}
.tile-body{padding:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.tile-name{font-family:var(--mono);font-size:12px;letter-spacing:.1em}
.tile-price{font-family:var(--mono);font-size:12px;color:var(--acid)}

/* LAB */
.lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
@media(max-width:880px){.lab-grid{grid-template-columns:1fr}}
.lab-controls{margin-top:32px;display:grid;gap:16px}
.control{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);padding:14px 16px;background:#0a0a14}
.control label{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--muted)}
.stepper{display:flex;align-items:center;gap:14px;font-family:var(--mono)}
.stepper button{width:28px;height:28px;border:1px solid var(--line);color:var(--blue)}
.stepper button:hover{border-color:var(--blue)}
.stepper span{min-width:18px;text-align:center;color:var(--fg)}
select{background:#000;color:var(--fg);border:1px solid var(--line);padding:6px 10px;font-family:var(--mono);font-size:12px}
.lab-out{margin:24px 0;display:flex;justify-content:space-between;align-items:center;padding:18px;border:1px dashed var(--neon);background:rgba(177,107,255,.06)}
.lab-out > div:first-child{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.16em}
.price{font-family:var(--display);font-size:36px;color:var(--acid)}

/* ZONES */
.zones{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.zones{grid-template-columns:1fr}}
.zone{position:relative;border:1px solid var(--line);padding:32px;background:#0a0a14;transition:border-color .25s}
.zone:hover{border-color:var(--blue)}
.zone-id{font-family:var(--mono);color:var(--neon);font-size:12px;letter-spacing:.2em}
.zone h3{font-family:var(--display);font-size:28px;margin-top:8px}
.zone p{color:var(--muted);margin-top:12px;line-height:1.6;font-size:14px}
.zone .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--acid);margin:18px 8px 0 0;box-shadow:0 0 12px var(--acid);animation:pulse 1.6s infinite}
.zone .dot.live + span{font-family:var(--mono);font-size:11px;color:var(--acid);letter-spacing:.16em}
@keyframes pulse{50%{opacity:.4}}

/* CTA */
.cta{text-align:center;background:radial-gradient(ellipse at center,rgba(177,107,255,.2),transparent 60%)}
.cta-inner{display:flex;flex-direction:column;align-items:center;gap:24px}

/* FOOTER */
.footer{border-top:1px solid var(--line);padding:64px 0;background:#04040a}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:32px}
@media(max-width:780px){.footer-grid{grid-template-columns:1fr}}
.footer h4{font-family:var(--mono);font-size:12px;letter-spacing:.18em;color:var(--blue);margin-bottom:12px}
.footer p{color:var(--muted);font-size:14px;margin:6px 0}
.footer .logo{margin-bottom:8px;display:inline-block}
.status{color:var(--acid);font-family:var(--mono);font-size:12px}

/* STICKY CTA (mobile-first) */
.sticky-cta{position:fixed;right:20px;bottom:20px;z-index:70;background:var(--fg);color:#000;font-family:var(--mono);font-weight:700;letter-spacing:.14em;padding:16px 22px;box-shadow:0 0 0 1px var(--fg),8px 8px 0 0 var(--hot);transition:transform .15s}
.sticky-cta:hover{transform:translate(-2px,-2px);box-shadow:0 0 0 1px var(--fg),12px 12px 0 0 var(--hot)}

/* selection */
::selection{background:var(--neon);color:#000}