:root {
  /* Color — transcribed from docs/specs/brand/005-color-palette.md */
  --color-background: #FFF4D8;
  --color-background-soft: #FEFAF0;
  --color-surface: #FFFCF7;

  --color-primary: #DDA61C;
  --color-primary-light: #F4CB5D;
  /* Darkened slightly from #B18F22 during Change 13's Lighthouse audit — the
     logo (28px bold) only reached 2.95:1 against the light backgrounds,
     just under WCAG AA's 3:1 for large text. */
  --color-primary-dark: #A3841F;

  --color-secondary: #A8B96E;
  --color-secondary-light: #C9D890;
  --color-secondary-dark: #6F8B45;

  --color-accent: #D2720C;
  --color-accent-light: #F29A3D;
  --color-accent-soft: #F6B88C;
  /* Darker than --color-accent specifically for small/regular-weight text on
     light backgrounds — the base accent only reaches ~3.3:1 there, below
     WCAG AA's 4.5:1 for normal text (found during Change 13's contrast
     audit). Use --color-accent for large text, borders, and fills; use this
     for links/labels/error text at body copy size. */
  --color-accent-dark: #A85B0A;

  --color-info-soft: #C7D9D6;
  --color-info: #A9C7C7;
  --color-info-dark: #7FA6A6;

  --color-text: #4E3424;
  /* Darkened from #AA9569 during Change 13's contrast audit — the original
     only reached ~2.7:1 against the site's light backgrounds, below WCAG
     AA's 4.5:1 for normal text. */
  --color-text-muted: #776849;
  --color-border: #EFD89F;

  /* Typography — transcribed from docs/specs/brand/006-typography.md */
  --font-heading: "Fraunces", serif;
  --font-body: "Nunito Sans", sans-serif;

  --text-xl: 48px;
  --text-lg: 36px;
  --text-md: 28px;
  --text-base: 18px;
  --text-sm: 16px;

  --weight-heading: 700;
  --weight-subheading: 600;
  --weight-body: 400;
  --weight-emphasis: 600;

  --leading-heading: 1.15;
  --leading-subheading: 1.2;
  --leading-body: 1.7;
  --leading-list: 1.6;

  /* Spacing — generous whitespace per brand/004-design-system.md */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  --radius-card: 24px;
  --radius-pill: 999px;
}

*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
}

body {
  display: flex;
  flex-direction: column;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-text);
  background: var(--color-background);
}

main {
  flex: 1;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  line-height: var(--leading-heading);
  color: var(--color-text);
}