:root {
  --color-dark: #272727;
  --color-purple: #5501fe;
  --color-white: #fff;
  --color-off-white: #f3f3f3;
  --color-gray-light: #ececec;
  --color-gray-border: #ededed;
  --color-gray-text: #585858;
  --color-gray-muted: #6b7280;

  --font-header: 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'Geist Mono', monospace;
  --font-body: 'Plus Jakarta Sans', sans-serif;

  --radius-card: 24px;
  --radius-pill: 32px;
  --space-section-x: 52px;

  /* Spacing scale — the 4px-step rhythm already used throughout the site's
     card padding, grid gaps and section spacing, made explicit so new
     components pick a step instead of a one-off value. Not a hard rule for
     every margin (bespoke offsets like the hero's floating photos or the
     fanned service polaroids are deliberately off-grid), but the default
     for anything reading as "component spacing". */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;

  --color-scrim: rgba(18, 40, 53, 0.25);
  --color-error: #c0392b;
  --color-error-bg: #fbeaea;
  --color-success: #1e7b34;
  --color-success-bg: #e6f4ea;
}