:root {
  /* ── Surfaces ── */
  --color-cream: #f5f0e8;
  --color-linen: #ede6d8;
  --color-white: #ffffff;

  /* ── Text ── */
  --color-ink: #2d2f3a;
  --color-ink-soft: #6b6d7a;

  /* ── Accents ── */
  --color-sage: #6b9e7e;
  --color-sage-light: #dce8de;
  --color-sage-dark: #4a7a5c;
  --color-terracotta: #c4725a;
  --color-terracotta-light: #f0e0d8;
  --color-terracotta-dark: #a85d47;

  /* ── Typography ── */
  --font-heading: 'Source Serif 4', Georgia, serif;
  --font-body: 'Inter', system-ui, sans-serif;

  --text-hero: clamp(2.5rem, 1.5rem + 4vw, 4.5rem);
  --text-h2: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  --text-h3: clamp(1.25rem, 1rem + 0.8vw, 1.5rem);
  --text-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-small: clamp(0.875rem, 0.85rem + 0.15vw, 0.9375rem);
  --text-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);

  --leading-tight: 1.2;
  --leading-body: 1.65;
  --leading-relaxed: 1.8;

  /* ── Spacing ── */
  --space-xs: clamp(0.5rem, 0.4rem + 0.3vw, 0.75rem);
  --space-sm: clamp(0.75rem, 0.6rem + 0.5vw, 1rem);
  --space-md: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
  --space-lg: clamp(2.5rem, 1.5rem + 3vw, 4rem);
  --space-xl: clamp(3.5rem, 2.5rem + 4vw, 6rem);
  --space-section: clamp(4rem, 3rem + 5vw, 8rem);

  /* ── Borders & Radius ── */
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-pill: 100vmax;

  /* ── Shadows ── */
  --shadow-sm: 0 1px 3px rgba(45, 47, 58, 0.08);
  --shadow-md: 0 4px 12px rgba(45, 47, 58, 0.1);
  --shadow-lg: 0 8px 24px rgba(45, 47, 58, 0.12);
  --shadow-hover: 0 8px 24px rgba(45, 47, 58, 0.16);

  /* ── Motion ── */
  --duration-fast: 150ms;
  --duration-normal: 300ms;
  --duration-slow: 500ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
}