/* Design tokens — the single source of truth for colour, type and space.
 *
 * Nothing outside this file defines a colour or a raw size. If a value is
 * needed twice it belongs here; if it is needed once it probably still does,
 * because the second use always arrives later.
 *
 * The site commits to one warm, light palette. That is a design decision, not
 * an oversight: the register is a printed invitation, not an application
 * chrome, and a dark variant of that reads as a different product. color-scheme
 * is declared so form controls and scrollbars match rather than inverting.
 */

:root {
  color-scheme: light;

  /* --- Colour ------------------------------------------------------------
   * Warm neutrals with a muted sage accent and terracotta for small emphasis.
   * Every pairing used for text is checked against WCAG AA in
   * scripts/check-contrast.mjs — change a value there and re-run it.
   */
  --ground: #fbf8f4;        /* page background, warm ivory */
  --surface: #ffffff;       /* cards lifted off the ground */
  --surface-sunk: #f4efe7;  /* quiet bands and quote blocks */

  --ink: #2a2521;           /* body text */
  --ink-strong: #1b1815;    /* headings */
  --ink-muted: #5c5249;     /* secondary text, captions */

  --rule: #e5ddd2;          /* decorative hairlines and card borders */
  --rule-strong: #cabfb0;   /* decorative only — fails 3:1, never use it to
                               bound an interactive control */
  --border-control: #8a7c68; /* form-control boundary; meets the 3:1 that
                                WCAG 1.4.11 requires of UI components */

  --accent: #55654b;        /* sage — links and text on the ground */
  --accent-hover: #3f4c37;
  --accent-surface: #66765b; /* sage as a background, with --on-accent.
                                Darker than it looks like it needs to be:
                                #6e7f63 gives white only 4.30:1 */
  --on-accent: #ffffff;

  --highlight: #9c5334;     /* terracotta, sparingly */

  --focus: #1a4f9c;         /* deliberately not the accent: focus must read as
                               a system affordance, not decoration */

  /* --- Type --------------------------------------------------------------
   * Fluid scale. clamp() means no breakpoint-specific font sizes anywhere
   * else, and no jump at a magic viewport width.
   */
  --font-display: 'EB Garamond', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-md: clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --text-lg: clamp(1.35rem, 1.2rem + 0.7vw, 1.75rem);
  --text-xl: clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem);
  --text-2xl: clamp(2.15rem, 1.6rem + 2.4vw, 3.5rem);

  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.65;

  --tracking-wide: 0.08em;

  /* --- Space -------------------------------------------------------------
   * One ratio-based scale. Ad-hoc margins are how vertical rhythm dies.
   */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2.25rem;
  --space-xl: 3.5rem;
  --space-2xl: 5rem;
  --space-3xl: 7rem;

  /* --- Measure and containers -------------------------------------------- */
  --measure: 64ch;          /* readable line length for body copy */
  --measure-narrow: 46ch;
  --container: 72rem;
  --container-narrow: 44rem;
  --gutter: clamp(1.25rem, 0.9rem + 1.6vw, 2.5rem);

  /* --- Surface treatment ------------------------------------------------- */
  --radius: 3px;            /* nearly square: print, not app chrome */
  --radius-lg: 6px;
  --shadow: 0 1px 2px rgb(42 37 33 / 0.05), 0 8px 24px -12px rgb(42 37 33 / 0.18);

  --transition: 160ms ease;
}