/* ===== base.css — tokeny, reset, typografia, tło ===== */
:root{
  --bg:#070a14;
  --bg2:#0d1224;
  --neon:#00f0c8;
  --hot:#ff3d6e;
  --gold:#ffd23f;
  --ice:#4fc3ff;
  --ink:#e8edf7;
  --mut:#7c87a8;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Roboto',sans-serif;
  overflow-x:hidden;
  line-height:1.5;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* tło */
.bgfx{position:fixed;inset:0;z-index:-2;background:
  radial-gradient(ellipse at 20% 0%,rgba(0,240,200,.10),transparent 55%),
  radial-gradient(ellipse at 90% 30%,rgba(255,61,110,.10),transparent 55%),
  linear-gradient(180deg,var(--bg2),var(--bg) 60%);}
.grain{position:fixed;inset:0;z-index:-1;opacity:.04;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.plats{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.plat{position:absolute;height:8px;border-radius:6px;opacity:.28;animation:rise linear infinite}
@keyframes rise{from{transform:translateY(110vh)}to{transform:translateY(-20vh)}}

/* typografia nagłówków */
h1{font-family:'Roboto',sans-serif;font-weight:600;font-size:clamp(1.5rem,7vw,4rem);line-height:1.05;
  letter-spacing:-.5px;text-transform:uppercase;overflow-wrap:break-word;word-break:break-word;hyphens:auto;
  position:relative;z-index:2;padding:10px 0;
  text-shadow:0 2px 28px rgba(7,10,20,.98),0 0 14px rgba(7,10,20,.95),0 0 6px rgba(7,10,20,.9)}
h1 .l1{display:block;color:var(--ink)}
h1 .l2{display:block;background:linear-gradient(90deg,var(--neon),var(--ice) 50%,var(--hot));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 18px rgba(7,10,20,.95)) drop-shadow(0 0 30px rgba(0,240,200,.3))}
h2{font-family:'Roboto',sans-serif;font-weight:900;font-size:clamp(1.8rem,4.5vw,3rem);
  line-height:1;text-transform:uppercase;margin-bottom:18px}
h2 .grad{background:linear-gradient(90deg,var(--neon),var(--hot));-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:'Roboto',sans-serif;font-weight:700;font-size:.75rem;letter-spacing:3px;
  text-transform:uppercase;color:var(--hot);margin-bottom:14px;display:inline-block}
.lead{color:var(--mut);max-width:620px;font-size:1.05rem}