/* Design tokens — exact staging type/color scale */

:root {
  --color-black: #000000;
  --color-ink: #121212;
  --color-body: #666666;
  --color-white: #ffffff;
  --color-gray: #f3f3f3;
  --color-gray-border: #e7e7e7;
  --color-muted: #585858;
  --color-gold: #e0bb7f;
  --color-gold-soft: #e0bb7f1a;
  --color-footer-panel: #3c4142;
  --color-field-bg: #484c4d;
  --color-field-border: #636768;
  --color-cream: #efe8dd;

  /* Staging Typekit names only (self-hosted + live kit fallback) */
  --font-display: "the-seasons", Georgia, "Times New Roman", serif;
  --font-body: "proxima-nova", Helvetica, Arial, sans-serif;

  --fs-h1: 91px;
  --lh-h1: 120%;
  --fs-h2: 56px;
  --lh-h2: 68px;
  --fs-h3: 38px;
  --lh-h3: 46px;
  --fs-xl: 24px;
  --lh-xl: 135%;
  --fs-lead: 20px;
  --lh-lead: 25px;
  --fs-lg: 18px;
  --lh-lg: 24px;
  --fs-md: 16px;
  --lh-md: 24px;
  --fs-sm: 14px;
  --fs-xs: 12px;
  --lh-xs: 16px;

  /* Brief: nav ~30% smaller than staging 16px */
  --fs-nav: 11.2px;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  --header-h: 80px;
  --max-width: 1440px;
  --space-section: 100px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

@media screen and (max-width: 991px) {
  :root {
    --fs-h1: 64px;
    --fs-h2: 40px;
    --lh-h2: 1.15;
    --fs-h3: 28px;
    --lh-h3: 1.2;
    --space-section: 72px;
  }
}

@media screen and (max-width: 767px) {
  :root {
    --fs-h1: 42px;
    --fs-h2: 32px;
    --lh-h2: 1.2em;
    --fs-h3: 24px;
    --lh-h3: 1.2em;
    --fs-lg: 16px;
    --lh-lg: 1.4em;
    --fs-md: 14px;
    --lh-md: 1.4em;
    --fs-lead: 16px;
    --space-section: 56px;
  }
}

@media screen and (max-width: 479px) {
  :root {
    --fs-h1: 36px;
    --fs-h2: 28px;
  }
}
