/* ─────────────────────────────────────────────
   Slytherin · Design Tokens
   Atelier palette · Savile Row, not Silicon Valley
   ───────────────────────────────────────────── */

:root {
  /* Surfaces */
  --cream: #FAF7F1;
  --cream-2: #F2EDE3;
  --cream-3: #EAE2D0;
  --paper: #FFFFFF;
  --ink: #0F1F1A;
  --ink-2: #3A4A43;
  --ink-3: #6B7A73;

  /* Atelier */
  --emerald: #1A3D2E;
  --emerald-2: #2A5A45;
  --emerald-3: #0D2B20;
  --emerald-deep: #06140E;

  --gold: #C8965A;
  --gold-2: #B5814A;
  --gold-3: #A37039;
  --gold-soft: #E5BC85;
  --gold-bright: #EFD3A3;

  --line: #E5DDCD;
  --line-2: #D4C8B0;
  --line-on-dark: rgba(229, 188, 133, 0.18);

  /* Type scale (modular, 1.25 ratio) */
  --t-xs: 0.75rem;
  --t-sm: 0.875rem;
  --t-md: 1rem;
  --t-lg: 1.25rem;
  --t-xl: 1.5rem;
  --t-2xl: clamp(1.8rem, 3.4vw, 2.6rem);
  --t-3xl: clamp(2.4rem, 5.6vw, 3.8rem);
  --t-display: clamp(3.2rem, 9vw, 7.5rem);
  --t-mega: clamp(4rem, 13vw, 11rem);

  /* Spacing */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --s-10: 128px;
  --s-11: 160px;

  /* Containers */
  --w-narrow: 720px;
  --w-content: 980px;
  --w-wide: 1180px;
  --w-bleed: 1480px;

  /* Radii */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* Shadows */
  --sh-1: 0 1px 2px rgba(15,31,26,.04), 0 4px 12px rgba(15,31,26,.04);
  --sh-2: 0 1px 2px rgba(15,31,26,.04), 0 8px 24px rgba(15,31,26,.06);
  --sh-3: 0 4px 12px rgba(15,31,26,.06), 0 24px 48px rgba(15,31,26,.10);
  --sh-4: 0 10px 30px rgba(15,31,26,.10), 0 40px 80px rgba(15,31,26,.14);
  --sh-gold: 0 0 0 1px rgba(200,150,90,.35), 0 8px 28px rgba(200,150,90,.18);

  /* Motion */
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ease-soft: cubic-bezier(.43, .195, .02, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --d-fast: 180ms;
  --d-mid: 360ms;
  --d-slow: 720ms;
  --d-slower: 1200ms;

  /* Z */
  --z-bg: -1;
  --z-base: 1;
  --z-raised: 10;
  --z-nav: 50;
  --z-topbar: 51;
  --z-cursor: 90;
  --z-modal: 100;
}

/* Reduced motion respect */
@media (prefers-reduced-motion: reduce) {
  :root {
    --d-fast: 0ms;
    --d-mid: 0ms;
    --d-slow: 0ms;
    --d-slower: 0ms;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}