@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Syne:wght@400;500;600;700;800&family=DM+Mono:ital,wght@0,300;0,400;0,500;1,400&display=swap');

:root {
  --black:  #0a0a0a;
  --white:  #f4f0e8;
  --acid:   #c8ff00;
  --red:    #ff2d2d;
  --gray:   #141414;
  --mid:    #242424;
  --muted:  #333;
  --font-display: 'Bebas Neue', sans-serif;
  --font-body:    'Syne', sans-serif;
  --font-mono:    'DM Mono', monospace;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  overflow-x: hidden;
  cursor: crosshair;
}
::selection { background: var(--acid); color: var(--black); }

/* ─ NOISE ─ */
body::after {
  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='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:9999;
}

/* ─ CURSOR ─ */
.cur-dot  { width:7px;height:7px;background:var(--acid);border-radius:50%;position:fixed;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:transform .1s; }
.cur-ring { width:28px;height:28px;border:1px solid rgba(200,255,0,.35);border-radius:50%;position:fixed;pointer-events:none;z-index:99998;transform:translate(-50%,-50%);transition:width .3s,height .3s,border-color .3s; }

/* ─ NAV ─ */
nav {
  position:fixed;top:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 2.5rem;height:64px;
  border-bottom:1px solid rgba(244,240,232,.08);
  background:rgba(10,10,10,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:height .3s;
}
.nav-logo { display:flex;align-items:center;text-decoration:none; }
.nav-links { display:flex;gap:2.5rem;list-style:none; }
.nav-links a { font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,240,232,.5);text-decoration:none;transition:color .2s; }
.nav-links a:hover,.nav-links a.active { color:var(--acid); }
.nav-cta { background:var(--acid);color:var(--black);font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;padding:.5rem 1.2rem;text-decoration:none;transition:background .2s,transform .15s; }
.nav-cta:hover { background:var(--white);transform:translateY(-1px); }
.nav-toggle { display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:crosshair;padding:4px; }
.nav-toggle span { display:block;width:22px;height:2px;background:var(--white);transition:all .3s; }

/* mobile menu */
.mob-menu { display:none;position:fixed;inset:0;background:var(--black);z-index:190;flex-direction:column;align-items:center;justify-content:center;gap:2rem; }
.mob-menu.open { display:flex; }
.mob-menu a { font-family:var(--font-display);font-size:3.5rem;color:var(--white);text-decoration:none;transition:color .2s; }
.mob-menu a:hover { color:var(--acid); }

/* ─ PAGE HERO ─ */
.page-hero {
  min-height:55vh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:7rem 2.5rem 4rem;
  border-bottom:1px solid var(--mid);
  position:relative;overflow:hidden;
}
.page-hero-bg {
  position:absolute;inset:0;
  font-family:var(--font-display);
  font-size:clamp(18vw,24vw,320px);
  line-height:.85;
  color:transparent;
  -webkit-text-stroke:1px rgba(244,240,232,.03);
  display:flex;align-items:center;justify-content:flex-end;
  padding-right:2rem;
  user-select:none;pointer-events:none;
  white-space:nowrap;
}
.page-hero-label { font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--acid);margin-bottom:1.25rem;display:flex;align-items:center;gap:.75rem; }
.page-hero-label::before { content:'';display:block;width:28px;height:1px;background:var(--acid); }
.page-hero h1 { font-family:var(--font-display);font-size:clamp(4rem,10vw,130px);line-height:.88;letter-spacing:-.01em; }
.page-hero h1 .outline { color:transparent;-webkit-text-stroke:1.5px var(--white); }
.page-hero h1 .acid { color:var(--acid); }

/* ─ SECTION BASICS ─ */
section { padding:6rem 2.5rem;border-bottom:1px solid var(--mid); }
.sec-label { font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--acid);margin-bottom:1.75rem;display:flex;align-items:center;gap:.75rem; }
.sec-label::before { content:'';display:block;width:22px;height:1px;background:var(--acid); }
.sec-title { font-family:var(--font-display);font-size:clamp(2.8rem,6vw,88px);line-height:.9;margin-bottom:3rem; }
.sec-title .outline { color:transparent;-webkit-text-stroke:1.5px var(--white); }

/* ─ BUTTONS ─ */
.btn { display:inline-block;text-decoration:none;font-family:var(--font-mono);font-size:.75rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s,transform .15s; }
.btn:hover { transform:translateY(-2px); }
.btn-solid { background:var(--acid);color:var(--black);padding:.9rem 2.5rem; }
.btn-solid:hover { background:var(--white); }
.btn-outline { border:1px solid rgba(244,240,232,.3);color:var(--white);padding:.9rem 2rem; }
.btn-outline:hover { border-color:var(--acid);color:var(--acid); }

/* ─ MARQUEE ─ */
.marquee-strip { background:var(--acid);padding:.7rem 0;overflow:hidden; }
.marquee-inner { display:flex;gap:0;white-space:nowrap;animation:marquee 20s linear infinite;will-change:transform; }
.marquee-inner span { font-family:var(--font-display);font-size:1.15rem;letter-spacing:.08em;color:var(--black);padding:0 2rem; }
.marquee-inner .dot { color:var(--black);opacity:.35; }

/* ─ FOOTER ─ */
footer { background:var(--black);border-top:1px solid var(--mid);padding:4rem 2.5rem 2rem; }
.footer-grid { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3.5rem; }
.footer-logo-wrap { display:flex;align-items:center;margin-bottom:1rem; }
.footer-tagline { font-family:var(--font-mono);font-size:.7rem;color:rgba(244,240,232,.28);letter-spacing:.1em; }
.footer-col-title { font-family:var(--font-mono);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(244,240,232,.28);margin-bottom:1.25rem; }
.footer-col ul { list-style:none;display:flex;flex-direction:column;gap:.6rem; }
.footer-col a { font-size:.95rem;color:rgba(244,240,232,.5);text-decoration:none;font-family:var(--font-body);transition:color .2s; }
.footer-col a:hover { color:var(--acid); }
.footer-bottom { display:flex;align-items:center;justify-content:space-between;padding-top:2rem;border-top:1px solid var(--mid); }
.footer-copy { font-family:var(--font-mono);font-size:.68rem;letter-spacing:.08em;color:rgba(244,240,232,.22); }
.footer-copy strong { color:var(--acid); }

/* ─ REVEAL ─ */
.reveal { opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }

/* ─ ANIMATIONS ─ */
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
@keyframes spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
@keyframes dash { to{stroke-dashoffset:0} }

/* ─ RESPONSIVE ─ */
@media(max-width:900px){
  .nav-links,.nav-cta { display:none; }
  .nav-toggle { display:flex; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  section { padding:4rem 1.5rem; }
  .page-hero { padding:6rem 1.5rem 3rem; }
}
@media(max-width:600px){
  .footer-grid { grid-template-columns:1fr; }
  .cur-dot,.cur-ring { display:none; }
}