/* =========================================================
   colors.css
   North Central Hunts - token foundation
   (raw -> semantic -> scales, the house skeleton)

   The raw values were sampled from North Central Hunts' own field
   photographs rather than picked: dry stubble, oak bark, olive drab
   camo, the pale valley sky. --olive is their existing theme colour,
   carried over from the GoDaddy build so the brand tie survives.

   The site is woodsy at the edges and pasture through the middle:
   a dark frame top and bottom, an open light body between them,
   with the hero photograph as the ground the content cards sit on.
   ========================================================= */

:root {
  /* --- raw named values --- */
  --bark:      #241E16;   /* deepest, the frame */
  --drab:      #3F412E;   /* olive drab, off their fields */
  --olive:     #385C28;   /* their own brand green */
  --olive-lit: #4A7735;   /* hover / focus state of the above */
  --oak:       #7A6248;   /* bark, turned earth */
  --grass:     #A89078;   /* dry stubble */
  --wheat:     #C9AE7E;   /* lit grass, the warm accent */
  --pasture:   #EDE6D6;   /* the open middle */
  --bone:      #F7F2E7;   /* raised surfaces, cards */
  --snow:      #FFFFFF;   /* snow goose, the sharp accent */

  /* --- semantic mappings --- */
  --bg-frame:      var(--bark);      /* header and footer */
  --bg-primary:    var(--pasture);   /* body */
  --bg-raised:     var(--bone);      /* cards over the hero */
  --bg-sunk:       #E3DAC6;          /* wells inside a card */

  --brand:         var(--olive);
  --brand-hover:   var(--olive-lit);
  --accent:        var(--wheat);

  --text-primary:   #2A241C;
  --text-secondary: #58483A;
  --text-muted:     #7C6A57;
  --text-on-frame:  var(--pasture);
  --text-on-brand:  var(--bone);

  --border-primary:   rgba(42, 36, 28, 0.16);
  --border-secondary: rgba(42, 36, 28, 0.09);
  --border-frame:     rgba(237, 230, 214, 0.14);

  --shadow-card:  0 2px 4px rgba(36, 30, 22, .05), 0 12px 32px rgba(36, 30, 22, .13);
  --shadow-nav:   0 2px 10px rgba(36, 30, 22, .18);
  --shadow-nav-scrolled: 0 6px 26px rgba(36, 30, 22, .34);

  /* --- type families ---
     Montserrat carries the display, headings and every label. Merriweather
     carries body copy. Two families only: Wildridge runs four and its own
     history records that the token names stopped describing the fonts. */
  --display: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body:    "Merriweather", Georgia, "Times New Roman", serif;

  /* --- type scale --- */
  --step--1: clamp(0.82rem, 0.79rem + 0.14vw, 0.90rem);
  --step-0:  clamp(1.00rem, 0.96rem + 0.20vw, 1.09rem);
  --step-1:  clamp(1.22rem, 1.14rem + 0.38vw, 1.45rem);
  --step-2:  clamp(1.48rem, 1.33rem + 0.74vw, 1.94rem);
  --step-3:  clamp(1.80rem, 1.53rem + 1.34vw, 2.59rem);
  --step-4:  clamp(2.19rem, 1.73rem + 2.28vw, 3.45rem);
  --step-5:  clamp(2.66rem, 1.90rem + 3.79vw, 4.60rem);

  /* --- scales (carried from the house kit) --- */
  --transition-fast:   160ms ease;
  --transition-medium: 320ms ease;
  --transition-slow:   680ms ease;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 32px;
  --space-xl: 64px;
  --space-2xl: 104px;

  --radius-sm:   3px;
  --radius-md:   6px;
  --radius-lg:   12px;
  --radius-pill: 999px;

  --maxw: 1180px;
  --maxw-prose: 66ch;

  --z-bg: -1;
  --z-base: 1;
  --z-ui: 10;
  --z-overlay: 100;
  --z-nav: 1200;

  /* Nav height is read by the hero and by every page's top padding, so it
     lives here rather than being repeated as a magic number. */
  --nav-h: 84px;
}

@media (max-width: 1100px) {
  :root { --nav-h: 72px; }
}
