/* Design tokens — single source of truth */
:root {
  /* Color (HSL components) */
  --background: 220 18% 5%;
  --foreground: 210 12% 94%;
  --card: 220 14% 8%;
  --muted: 220 12% 12%;
  --muted-foreground: 210 8% 68%;
  --primary: 42 92% 52%;
  --primary-foreground: 0 0% 5%;
  --secondary: 0 80% 52%;
  --accent: 0 0% 100%;
  --cyber-cyan: 192 75% 42%;
  --code-green: 120 60% 50%;
  --border: 42 22% 18%;
  --surface-1: 220 14% 8%;
  --surface-2: 220 12% 11%;

  /* Shape */
  --radius: 0px;
  --chamfer-btn: 11px;
  --chamfer-card: 16px;
  --chamfer-pill: 7px;

  /* Typography scale (fluid) */
  --text-hero: clamp(3rem, 8vw, 6.5rem);
  --text-display: clamp(2.1rem, 7vw, 4.6rem);
  --text-heading: clamp(1.6rem, 4.5vw, 2.6rem);
  --text-body: 1rem;
  --text-caption: 0.72rem;

  /* Spacing */
  --section-pad: 4.5rem;
  --section-pad-md: 6rem;
  --container-max: 1200px;
  --gap-card: 1.25rem;

  /* Motion */
  --duration-fast: 0.25s;
  --duration-reveal: 0.7s;
  --duration-stagger: 0.12s;
  --ease-settle: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-trace: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-signal: cubic-bezier(0.16, 1, 0.3, 1);
  --header-offset: 100px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}