/* MOUND design tokens — source: DESIGN.md §10
   Direction: Nordic institutional editorialism (mound-site-foundation.md) */
:root {
  /* Color */
  --bone: #F4F0E7;
  --limestone: #D8D0C2;
  --evergreen: #18372F;
  --forest: #0D251F;          /* "Deep Forest" — architectural canvas, header, footer */
  --evergreen-deep: var(--forest);  /* legacy alias */
  --ink: #1B1C19;
  --clay: #A55F45;
  --clay-deep: #8F4E37;
  --brass: #AD9365;
  --brass-light: #DFC18E;     /* hero kicker over photography only */
  --stone-gray: #5E5A52;

  --color-bg: var(--bone);
  --color-surface: var(--limestone);
  --color-text: var(--ink);
  --color-text-muted: var(--stone-gray);
  --color-primary: var(--evergreen);
  --color-accent: var(--clay);
  --color-link: var(--evergreen);
  --color-focus: var(--clay);

  --rule: rgba(27, 28, 25, 0.22);
  --rule-on-dark: rgba(244, 240, 231, 0.25);

  /* Type: Newsreader for the wordmark, headlines and editorial emphasis;
     Instrument Sans for navigation, labels, body copy and functional text. */
  --font-serif: "Newsreader", Georgia, serif;
  --font-sans: "Instrument Sans", Arial, sans-serif;
  --font-wordmark: var(--font-serif);

  --fs-hero: clamp(2.75rem, 7.5vw, 7.5rem);          /* 44px → 120px, homepage hero */
  --fs-display-xl: clamp(2.875rem, 5.4vw, 5.125rem); /* 46px → 82px, section statements */
  --fs-display: clamp(2.5rem, 1.2rem + 4vw, 4.75rem);
  --fs-h1: clamp(2rem, 1.1rem + 3vw, 3.5625rem);
  --fs-h3: clamp(1.75rem, 1.2rem + 1.8vw, 2.6875rem);
  --fs-h5: clamp(1.5rem, 1.2rem + 0.9vw, 2rem);
  --fs-lead: clamp(1.3125rem, 1.1rem + 0.9vw, 1.875rem); /* serif lead, 21px → 30px */
  --fs-body: 1rem;                                    /* 16px sans */
  --fs-small: 0.875rem;                               /* 14px sans */
  --fs-eyebrow: 0.6875rem;                            /* 11px sans, uppercase */
  --fs-ui: 0.875rem;                                  /* 14px sans, navigation */
  --fs-stat: clamp(3rem, 1.6rem + 4.4vw, 5.5rem);

  /* Layout */
  --container: 1272px;
  --container-narrow: 948px;
  --gutter: 24px;
  --site-margin: 20px;
  --section-sm: 48px;
  --section-md: 64px;
  --section-lg: 80px;
  --section-xl: 96px;
  --header-h: 78px;   /* below 1200px: lockup + hamburger */
  --announce-h: 40px; /* announcement banner above the header; 0 once dismissed */
  --site-top: calc(var(--header-h) + var(--announce-h)); /* total fixed chrome */
  --radius: 0;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.6, 0.2, 1);
  --dur-fast: 200ms;
  --dur: 400ms;
}

@media (min-width: 768px) {
  :root { --site-margin: 32px; }
}

@media (min-width: 1080px) {
  :root {
    --site-margin: 48px;
    --section-sm: 64px;
    --section-md: 96px;
    --section-lg: 120px;
    --section-xl: 160px;
  }
}

@media (min-width: 1200px) {
  :root { --header-h: 94px; /* one row: lockup + menu */ }
}

html.announce-off { --announce-h: 0px; }