/* ============================================================
   BASE · document root, ambient overlays, shared tokens
   ============================================================ */

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font);
  font-weight:300;
}

/* grain overlay */
.grain{
  position:fixed;
  inset:0;
  z-index:90;
  pointer-events:none;
  opacity:.045;
  mix-blend-mode:overlay;
  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 type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* cursor glow */
.cursor-glow{
  position:fixed;
  top:var(--my);
  left:var(--mx);
  width:46rem;
  height:46rem;
  margin:-23rem 0 0 -23rem;
  border-radius:50%;
  pointer-events:none;
  z-index:1;
  background:radial-gradient(circle,
    rgba(255,43,214,.10) 0%,
    rgba(0,229,255,.055) 38%,
    transparent 68%);
  mix-blend-mode:screen;
  will-change:transform;
}

/* shared typography */
.eyebrow{
  font-size:clamp(.62rem,1.05vw,.76rem);
  font-weight:400;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--muted);
}
.eyebrow--cyan{
  color:var(--neon-2);
  text-shadow:0 0 14px rgba(0,229,255,.55);
}

/* focus ring */
:focus-visible{
  outline:1px solid var(--neon);
  outline-offset:4px;
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .scroller--snap{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}