:root {
  /* ── Colours ── */
  --clr-bg:          #070714;
  --clr-surface:     #0D0D24;
  --clr-surface-2:   #14143A;
  --clr-border:      rgba(123, 47, 255, 0.22);
  --clr-primary:     #7B2FFF;
  --clr-secondary:   #00D4FF;
  --clr-accent:      #FF3EA5;
  --clr-text:        #E8EAFF;
  --clr-text-muted:  #8891B8;
  --clr-text-dim:    #505880;

  /* ── Gradients ── */
  --grad-main:   linear-gradient(135deg, #7B2FFF 0%, #00D4FF 100%);
  --grad-accent: linear-gradient(135deg, #FF3EA5 0%, #7B2FFF 100%);
  --grad-glow:   linear-gradient(135deg, rgba(123,47,255,0.15) 0%, rgba(0,212,255,0.15) 100%);

  /* ── Typography ── */
  --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Courier New', monospace;
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-lg:   1.125rem;
  --fs-xl:   1.25rem;
  --fs-2xl:  1.5rem;
  --fs-3xl:  2rem;
  --fs-4xl:  2.75rem;
  --fs-5xl:  3.5rem;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;

  --lh-tight:  1.2;
  --lh-snug:   1.4;
  --lh-normal: 1.6;
  --lh-relaxed:1.75;

  /* ── Spacing ── */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.25rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  /* ── Radii ── */
  --r-sm:   4px;
  --r-md:   8px;
  --r-lg:   12px;
  --r-xl:   20px;
  --r-full: 9999px;

  /* ── Shadows ── */
  --shadow-glow:  0 0 40px rgba(123, 47, 255, 0.25);
  --shadow-card:  0 4px 32px rgba(0, 0, 0, 0.45);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.05);

  /* ── Motion ── */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:   cubic-bezier(0.4, 0, 1, 1);
  --dur-fast:  150ms;
  --dur-base:  250ms;
  --dur-slow:  400ms;

  /* ── Layout ── */
  --container-max: 1200px;
  --nav-h:         70px;
  --section-py:    var(--sp-24);
}