/* ========================================================================
   Component: Base / Tokens
========================================================================== */

:root {
  --accent-primary: #4e8c3a;
  --accent-secondary: #775c38;
  --accent-rose: #b7645e;
  --border-subtle: #ded2be;
  --foreground-inverse: #fffdf7;
  --foreground-muted: #7c8778;
  --foreground-primary: #173326;
  --foreground-secondary: #5e6b5d;
  --surface-inverse: #173326;
  --surface-mist: #eff8ea;
  --surface-page-frame: #2a4636;
  --surface-primary: #f7f1e6;
  --surface-rose: #f2dcda;
  --surface-soft: #fffdf7;
  --surface-apricot: #f3c89a;
  --surface-dark-card: #1f3f2d;
  --surface-green: #e5f0d8;
  --surface-yellow: #e7d8c1;
  --surface-dotnav-inactive: rgba(0, 0, 0, 0.5);
  --surface-overlay: rgba(23, 51, 38, 0.8);
  --border-dark: #254d38;
  --border-accent-secondary: #9b815d;
  --foreground-accent-soft: #9cd685;
  --foreground-inverse-muted: #dce8d6;

  --font-body: 'Montserrat', system-ui, sans-serif;
  --font-heading: 'Newsreader', Georgia, serif;
  --font-data: 'Geist Mono', ui-monospace, monospace;
  --font-size-xsmall: 10px;
  --font-size-body: 15px;
  --font-size-small: 13px;
  --font-size-medium: 16px;
  --font-size-large: 18px;
  --font-size-h6: 16px;
  --font-size-h5: 16px;
  --font-size-h4: 18px;
  --font-size-h3: 25px;
  --font-size-h2: 35px;
  --font-size-display: 70px;
  --font-size-display-mobile: 42px;
  --font-size-h2-mobile: 25px;
  --font-size-h3-mobile: 18px;
  --font-size-h4-mobile: 16px;
  --font-size-h5-mobile: 16px;
  --font-size-h6-mobile: 16px;
  --font-weight-normal: 400;
  --font-weight-book: 500;
  --font-weight-medium: 600;
  --font-weight-bold: 700;
  --font-weight-black: 800;

  --radius-small: 10px;
  --radius-medium: 18px;
  --radius-large: 24px;
  --radius-pill: 999px;
  --shadow-card: 0 8px 24px rgba(23, 51, 38, 0.13);
  --shadow-soft: 0 1px 2px rgba(29, 29, 31, 0.06);
  --shadow-modal: 0 20px 50px rgba(29, 29, 31, 0.18);
  --shadow-control: 0 6px 18px rgba(23, 51, 38, 0.2);
  --layout-max: 1440px;
}