/* THE RUNTIME AUTHORITY for this theme's design tokens: theme.json only mirrors what is declared here, no var() in this theme carries a fallback (a fallback is a second copy a rebrand cannot see), and every value below is a PLACEHOLDER whose NAME is the contract. */
:root {
  /* brand / brand-dark / brand-light are the three the client can pick in the editor; theme.json projects them under exactly those slugs. */
  --brand:             #4b4a4b;
  --brand-rgb:         75, 74, 75;
  --brand-dark:        #000000;
  --brand-dark-rgb:    0, 0, 0;
  --brand-light:       #f0eee5;
  --brand-light-rgb:   240, 238, 229;

  /* Brand the site paints with but the client never picks: kept out of the palette, because a picker that can overwrite a seeded axis is a defect. */
  --brand-accent:      #4b4a4b;
  --brand-accent-rgb:  75, 74, 75;
  --brand-support:     #000000;
  --brand-support-rgb: 0, 0, 0;

  --ink:               #4b4a4b;
  --ink-rgb:           75, 74, 75;
  --neutral-dark:      #4b4a4b;
  --neutral-dark-rgb:  75, 74, 75;
  --neutral-light:     #f0eee5;
  --neutral-light-rgb: 240, 238, 229;
  --surface:           #f0eee5;
  --surface-rgb:       240, 238, 229;
  --border:            #f0eee5;
  --bg:                #ffffff;
  --bg-rgb:            255, 255, 255;
  --white:             #ffffff;
  --white-rgb:         255, 255, 255;
  --black:             #000000;
  --black-rgb:         0, 0, 0;

  /* Remap by role: Figma has one text/fill/stroke grey #4B4A4B (251 uses) -> --ink, --brand, --neutral-dark; cream #F0EEE5 -> --surface, --brand-light, --neutral-light; no second brand hue exists in the file. */
  /* --sans and --heading are projected into theme.json for the client to pick from; --display and --serif are the theme's own. */
  /* @webfont: https://fonts.googleapis.com/css2?family=IM+Fell+DW+Pica+SC&display=swap */
  /* The only place that URL is written down: functions.php reads this line rather than holding a copy, exactly one such directive is allowed, and deleting the line ships no webfont at all. */
  --sans:    'IM Fell DW Pica SC', Georgia, serif;
  --heading: 'IM Fell DW Pica SC', Georgia, serif;
  --display: 'IM Fell DW Pica SC', Georgia, serif;
  --serif:   Georgia, 'Times New Roman', serif;

  /* Declared here rather than left as var() fallbacks inside forms.css — a fallback is a colour a rebrand cannot find. */
  --form-border:                var(--neutral-dark);
  --form-bg:                    var(--white);
  --form-inline-bg:             var(--surface);
  --form-text:                  var(--ink);
  --form-focus:                 rgba(var(--brand-rgb), 0.2);
  --form-focus-border:          var(--brand);
  --form-error:                 #b91c1c;

  --eyebrow-color:              var(--brand);

  --button-bg:                  var(--brand);
  --button-bg-hover:            var(--brand-dark);
  --button-text:                var(--white);
  --button-outline-color:       var(--ink);
  --button-outline-hover-bg:    var(--ink);
  --button-outline-hover-color: var(--white);
  --button-radius:              0.375rem;

  /* --container-content is the RUNTIME AUTHORITY for the page width. It must not live in base.css, which loads after this file and would shadow it; base.css delegates. --container-wide is the .container-lg measure theme.json's wideSize mirrors. */
  --container-content: 113.75rem;
  --container-wide:    120rem;

  /* The resting height of the fixed header, reserved as body padding by header.css. Three breakpoints, all required. These are the pre-JS fallbacks: header-compact.js measures the real bar and overrides --header-h after load. */
  --header-h: 100px;
}

@media (max-width: 1199px) {
  :root {
    --header-h: 88px;
  }
}

/* The 991 breakpoint literal lives in header.css; it is echoed here only as a height. */
@media (max-width: 991px) {
  :root {
    --header-h: 80px;
  }
}