/* The Meitheal: brand tokens (v1). Source of truth: brand/tokens.json.
   Load the fonts in each page's <head>:
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@600;700&family=Figtree:wght@400;500;600&display=swap">
*/

:root {
  /* Light-only: stop browsers applying dark-mode defaults to forms, scrollbars and pages */
  color-scheme: light only;

  /* Colour */
  --limewash: #f5f2ec;   /* page background */
  --surface: #ffffff;    /* cards, fields; text on moss */
  --granite: #2e3233;    /* main text, headings, wordmark */
  --stone: #5f6462;      /* tagline, captions, labels */
  --moss: #4f6b4a;       /* the one action colour */
  --moss-deep: #3d5539;  /* hover / pressed */
  --lichen: #b8a77a;     /* decorative accent only, never text */
  --line: #ddd7cc;       /* borders, dividers */
  --sand: #e8e3d9;       /* photo placeholders, quiet fills */
  --error: #9b3b2f;      /* form error messages and error field borders only */

  /* Type */
  --font-heading: Manrope, "Helvetica Neue", Arial, sans-serif;
  --font-body: Figtree, "Helvetica Neue", Arial, sans-serif;

  --text-wordmark: 54px;
  --text-h1: 38px;
  --text-h2: 24px;
  --text-tagline: 20px;
  --text-body: 17px;
  --text-small: 15px;
  --text-label: 13px;

  /* Spacing */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;

  /* Corners */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-pill: 999px;
}
