:root {
  --color-bg: #ffffff;
  --color-surface: #f3eee8;
  --color-surface-strong: #e9e1d8;
  --color-text: #221d19;
  --color-text-soft: rgba(34, 29, 25, 0.86);
  --color-border: rgba(34, 29, 25, 0.12);
  --color-accent: #cf5d5d;
  --color-accent-soft: rgba(207, 93, 93, 0.12);

  --font-sans: "IBM Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "IBM Plex Serif", Georgia, serif;

  --step--1: clamp(0.875rem, 0.84rem + 0.16vw, 0.96rem);
  --step-0: clamp(1rem, 0.95rem + 0.24vw, 1.13rem);
  --step-1: clamp(1.25rem, 1.11rem + 0.72vw, 1.7rem);
  --step-2: clamp(1.7rem, 1.35rem + 1.3vw, 2.5rem);
  --step-3: clamp(2.4rem, 1.85rem + 2vw, 3.8rem);
  --step-4: clamp(3.1rem, 2.2rem + 3vw, 5.2rem);

  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2rem;
  --space-xl: 3rem;
  --space-2xl: 5rem;
  --space-3xl: 8rem;

  --shell-wide: 88rem;
  --shell-narrow: 46rem;

  --border-radius: 1.25rem;
  --shadow-soft: 0 10px 30px rgba(23, 20, 17, 0.08);

  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 180ms;
  --duration-medium: 500ms;
  --duration-slow: 900ms;

  --header-height: 4.5rem;
}