:root {
  --color-orange:      #EF7103;
  --color-orange-dark: #C85D02;
  --color-orange-soft: #FDE8D3;
  --color-teal:        #68CCD1;
  --color-teal-dark:   #3FA7AD;
  --color-teal-soft:   #E4F6F7;
  --color-ink:         #2C1F1F;
  --color-text:        #463939;
  --color-muted:       #6B5858;
  --color-line:        #E8DFD8;
  --color-bg:          #FFFFFF;
  --color-bg-soft:     #FAF5F0;
  --color-bg-warm:     #F5ECE2;

  --font-sans:         'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-accent:       'Shadows Into Light', 'Marker Felt', cursive;

  --fs-xs:    0.875rem;
  --fs-sm:    1rem;
  --fs-base:  1.0625rem;
  --fs-md:    1.25rem;
  --fs-lg:    1.5rem;
  --fs-xl:    2rem;
  --fs-2xl:   2.75rem;
  --fs-3xl:   3.5rem;
  --fs-hero:  clamp(2.25rem, 5vw, 4rem);

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-base:  1.6;
  --lh-loose: 1.75;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 5.5rem;
  --space-8: 7rem;

  --container:    72rem;
  --container-sm: 48rem;
  --container-xs: 36rem;

  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --shadow-sm: 0 2px 6px rgba(44, 31, 31, 0.06);
  --shadow:    0 8px 24px rgba(44, 31, 31, 0.08);
  --shadow-lg: 0 16px 48px rgba(44, 31, 31, 0.14);

  --transition: 180ms cubic-bezier(0.4, 0.2, 0.2, 1);
}