/*
 * Brand design tokens, layered on top of Open Props (open-props.css).
 * Change a value here and it propagates through every page/component —
 * nothing below this file should hard-code a color, spacing, or radius.
 */
:root {
  /* Raw brand palette */
  --brand-forest-9: #16261e;
  --brand-forest-8: #22392d;
  --brand-forest-7: #2f4a3c;
  --brand-forest-6: #3f5c4c;
  --brand-oak-6: #a87c53;
  --brand-oak-5: #c19a6b;
  --brand-oak-4: #d9bd93;
  --brand-cream-1: #faf7f2;
  --brand-cream-2: #f1e9dc;

  /* Semantic tokens — pages and components reference these, never the raw
     palette above, so a re-theme only touches this block. */
  --color-primary: var(--brand-forest-7);
  --color-primary-hover: var(--brand-forest-8);
  --color-accent: var(--brand-oak-6);
  --color-accent-hover: var(--brand-oak-5);

  --color-bg: white;
  --color-surface: white;
  --color-text: var(--gray-9);
  --color-text-muted: var(--gray-7);
  --color-border: var(--gray-4);
  --color-danger: var(--red-7);
  --color-success: var(--green-8);

  --font-body: var(--font-sans);
  --font-heading: var(--font-sans);

  --radius-card: var(--radius-3);
  --shadow-card: var(--shadow-2);
  --shadow-card-hover: var(--shadow-4);
  --container-max: 72rem;
}

/* This site intentionally stays light-themed regardless of the visitor's
   system color scheme — no dark mode override. */