:root {
  /* Color */
  --color-green-600: #1B7A4D;
  --color-green-700: #145C3A;
  --color-green-100: #E3F3EA;
  --color-blue-600: #1E5BB8;
  --color-blue-700: #164A94;
  --color-blue-100: #E5EEFB;
  --color-ink: #10241C;
  --color-muted: #4B5A55;
  --color-border: #DDE5E1;
  --color-bg: #F7FAF8;
  --color-white: #FFFFFF;
  --color-error: #C0392B;
  --color-warning: #B8860B;

  /* Type */
  --font-heading: 'Sora', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --text-xs: 0.8rem;
  --text-sm: 0.9rem;
  --text-base: 1rem;
  --text-lg: 1.15rem;
  --text-xl: 1.4rem;
  --text-2xl: 1.85rem;
  --text-3xl: 2.4rem;
  --text-4xl: clamp(2.2rem, 5vw, 3.2rem);

  /* Spacing (8px base) */
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 6rem;

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;

  /* Shadow (tinted with ink, not pure black) */
  --shadow-sm: 0 1px 2px rgba(16, 36, 28, 0.06);
  --shadow-md: 0 4px 12px rgba(16, 36, 28, 0.08);
  --shadow-lg: 0 12px 32px rgba(16, 36, 28, 0.12);

  /* Motion */
  --transition-fast: 150ms ease;
  --transition-base: 220ms ease;
  --transition-reveal: 550ms ease-out;

  /* Layout */
  --container-max: 1180px;
  --nav-height: 76px;
}