/* Generated by scripts/brand-build.mjs from brand/tokens.json. Edit the JSON, then run `npm run brand:build`. */
:root {
  /* Colour */
  --paper: #F7F6F2;
  --surface: #FFFFFF;
  --moss: #E9EFEA;
  --ink: #202622;
  --ink-2: #5E6861;
  --forest: #205544;
  --forest-hover: #174335;
  --forest-deep: #10281F;
  --footer-muted: #B9C6BE;
  --bronze: #7A5F31;
  --rule: #D4DDD5;
  --control: #7B8B80;
  --error: #9B2C20;
  --warning: #7A4B12;
  --success: #205544;

  /* Type */
  --font-serif: 'Source Serif 4', 'Source Serif 4 Fallback', 'Source Serif 4 Fallback Times', Georgia, serif;
  --font-sans: 'IBM Plex Sans', 'IBM Plex Sans Fallback', Arial, system-ui, sans-serif;
  --h1-size: 56px;
  --h1-line: 60px;
  --h1-weight: 500;
  --h1-tracking: -0.015em;
  --h1-font: var(--font-serif);
  --h2-size: 36px;
  --h2-line: 42px;
  --h2-weight: 500;
  --h2-tracking: -0.01em;
  --h2-font: var(--font-serif);
  --h3-size: 24px;
  --h3-line: 30px;
  --h3-weight: 600;
  --h3-tracking: -0.005em;
  --h3-font: var(--font-sans);
  --h4-size: 20px;
  --h4-line: 28px;
  --h4-weight: 600;
  --h4-tracking: 0;
  --h4-font: var(--font-sans);
  --lead-size: 20px;
  --lead-line: 30px;
  --lead-weight: 400;
  --lead-tracking: 0;
  --lead-font: var(--font-sans);
  --body-size: 17px;
  --body-line: 28px;
  --body-weight: 400;
  --body-tracking: 0;
  --body-font: var(--font-sans);
  --small-size: 15px;
  --small-line: 24px;
  --small-weight: 400;
  --small-tracking: 0;
  --small-font: var(--font-sans);
  --label-size: 14px;
  --label-line: 20px;
  --label-weight: 500;
  --label-tracking: 0;
  --label-font: var(--font-sans);
  --numeral-size: 15px;
  --numeral-line: 20px;
  --numeral-weight: 500;
  --numeral-tracking: 0.02em;
  --numeral-font: var(--font-serif);
  --control-size: 16px;
  --control-line: 24px;
  --control-weight: 500;
  --control-tracking: 0;
  --control-font: var(--font-sans);

  /* Space (8px baseline) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* Shape, motion, elevation */
  --radius-control: 6px;
  --radius-container: 8px;
  --motion-fast: 150ms;
  --motion-menu: 200ms;
  --shadow-menu: 0 1px 2px rgba(32, 38, 34, 0.08);

  /* Layout */
  --container: 1200px;
  --gutter: 24px;
  --measure: 68ch;
  --prose: 760px;
  --header-height: 72px;
  --section-padding: 96px;
}

@media (max-width: 959px) {
  :root {
    --gutter: 16px;
    --section-padding: 64px;
    --h1-size: 36px;
    --h1-line: 40px;
    --h2-size: 28px;
    --h2-line: 34px;
    --h3-size: 22px;
    --h3-line: 28px;
    --h4-size: 19px;
    --h4-line: 26px;
    --lead-size: 18px;
    --lead-line: 28px;
  }
}