/* Charlotte Grey VA — design tokens.
   Palette is built around a sage-green family; cream backs off to small accent
   bands so the green/light-green leads the look. Variable names kept as --dust-*
   so existing CSS picks up the new hues. */

:root {
  /* Colour */
  --cream: #f4efe5;
  --cream-soft: #faf6ed;
  --ink: #1f2424;
  --ink-soft: #4a5050;
  --dust: #c5d4c5;        /* sage mid-light */
  --dust-soft: #e3ebe3;   /* sage very-light (section backdrops) */
  --dust-deep: #4f7062;   /* CTA / footer — 5.6:1 with white, AA-friendly */
  --dust-deeper: #3d5a4f; /* hover */
  --dust-accent: #7a9686; /* eyebrows / decorative only */
  --line: #d8d1c2;

  /* Type */
  --font-serif: "Cormorant Garamond", "Georgia", serif;
  --font-sans:  "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Scale */
  --step--1: clamp(13px, 0.78vw, 14px);
  --step-0:  clamp(15px, 0.95vw, 17px);
  --step-1:  clamp(18px, 1.15vw, 20px);
  --step-2:  clamp(22px, 1.5vw, 26px);
  --step-3:  clamp(28px, 2.2vw, 36px);
  --step-4:  clamp(36px, 3.6vw, 54px);
  --step-5:  clamp(44px, 4.8vw, 72px);

  /* Layout */
  --max-w: 1680px;
  --gutter: clamp(20px, 4vw, 48px);
  --radius: 4px;
  --radius-pill: 999px;
}