/* georgiaeconomics.com — EIG brand layer (site-wide)
 * ============================================================================
 * Loaded on EVERY page via partials/head.html. Companion to the token remap in
 * styles.css `:root`, which does the heavy lifting — ~600 `var(--navy)` /
 * `var(--peach-deep)` / … references across the site pick up EIG values from
 * there automatically. This file carries the pieces a token swap cannot
 * express: chrome that changes *structure* (a white header becoming a charcoal
 * one with an amber rule), and a handful of shared component tweaks.
 *
 * Landing-page-only styling (the full-bleed hero, KPI strip, section kickers)
 * lives in assets/eig-home.css, scoped to `body.home`, so it cannot leak into
 * the 190 inner pages.
 *
 * See EIG_REBRAND.md for the palette, the rollout history and the rationale.
 * ============================================================================ */

:root {
  /* EIG names, for new code. The legacy `--navy`/`--peach-*` names in
     styles.css resolve to these same values; prefer these going forward. */
  --eig-charcoal:   #231f20;
  --eig-charcoal-2: #2e292a;
  --eig-charcoal-3: #39322f;
  --eig-amber:      #f7941e;
  --eig-amber-deep: #c9740f;
  --eig-amber-pale: #fde8cc;
  --eig-cream:      #f7f6f4;
  --eig-panel:      #f1efec;
  --eig-panel-2:    #eae7e3;
  --eig-hair:       #e4e2df;
  --eig-slate:      #5f646c;
  --eig-muted:      #6d6e71;
  --eig-faint:      #a7a9ac;
  --eig-body:       #1f2226;
  --eig-green:      #3f7d52;
  --eig-brick:      #a8432f;
  --eig-green-on-dark: #7fbf95;
  --eig-brick-on-dark: #e08a76;
  --eig-sans:  "Geist", "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --eig-mono:  "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --eig-shadow-card: 0 1px 3px rgba(35,31,32,.06), 0 8px 24px rgba(60,42,16,.08);
  --eig-shadow-lift: 0 10px 30px rgba(60,42,16,.13);
}

/* Geist is a tighter face than Source Sans; headings need negative tracking to
   sit right, which the old serif display did not. */
h1, h2, h3, h4 { letter-spacing: -.018em; }

::selection { background: var(--eig-amber-pale); color: var(--eig-charcoal); }

/* ══════════════════════════════════════════════════════════════════════════
   Header — the EIG app-shell pattern: charcoal ground, 4px amber rule.
   The markup in partials/header.html is untouched; this is styling only.
   ══════════════════════════════════════════════════════════════════════════ */
.site-header {
  background: var(--eig-charcoal);
  border-bottom: 4px solid var(--eig-amber);
  box-shadow: none;
}
.site-header .brand a { color: #fff; font-family: var(--eig-sans); letter-spacing: -.02em; }
.site-header .brand .tag { color: var(--eig-amber); }
.site-header .nav-top,
.site-header .nav-link { color: #d8d3cd; font-family: var(--eig-sans); }
.site-header .nav-top:hover,
.site-header .nav-top.active,
.site-header .nav-link:hover,
.site-header .nav-link.active { color: var(--eig-amber); background: transparent; }
.site-header .nav-menu {
  background: var(--eig-charcoal-2);
  border: 1px solid #433c3a;
  box-shadow: 0 14px 34px rgba(0,0,0,.34);
}
.site-header .nav-menu a { color: #ded8d1; }
.site-header .nav-menu a:hover { background: var(--eig-charcoal-3); color: var(--eig-amber); }
.site-header .nav-menu a.active { background: var(--eig-amber); color: #231603; }
.nav-search input {
  background: var(--eig-charcoal-2); border: 1px solid #433c3a; color: #ede8e2;
}
.nav-search input::placeholder { color: #8d857f; }
.nav-search input:focus { background: var(--eig-charcoal-2); border-color: var(--eig-amber); }
.search-results { background: var(--eig-charcoal-2); border: 1px solid #433c3a; }
.search-results a, .search-results .sr-item { color: #ded8d1; }
.search-results a:hover, .search-results .sr-item:hover,
.search-results .is-active { background: var(--eig-charcoal-3); color: var(--eig-amber); }
.nav-toggle-bars,
.nav-toggle-bars::before,
.nav-toggle-bars::after { background: #ded8d1; }

/* Breadcrumbs sit directly under the charcoal header on inner pages. */
.breadcrumbs a { color: var(--eig-muted); }
.breadcrumbs a:hover { color: var(--eig-amber-deep); }

/* ══════════════════════════════════════════════════════════════════════════
   Footer
   ══════════════════════════════════════════════════════════════════════════ */
.site-footer {
  background: var(--eig-charcoal);
  border-top: 0;
  color: #a9a29b;
}
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--eig-amber); }
.site-footer .footer-disclaimer {
  color: #a9a29b;
  background: rgba(247,148,30,.07);
  border-left: 4px solid var(--eig-amber);
}
.site-footer .footer-disclaimer strong { color: #fff; }
.site-footer .eig { background: var(--eig-charcoal-2); border-radius: 8px; }
.site-footer .eig .product-of { color: #a9a29b; }
.site-footer .eig a:hover { color: var(--eig-amber); }

/* ══════════════════════════════════════════════════════════════════════════
   Shared components
   ══════════════════════════════════════════════════════════════════════════ */

/* The hero EIG ribbon (used on inner pages that carry it) was navy-on-navy. */
.eig-ribbon { background: var(--eig-charcoal); border-color: var(--eig-charcoal); }
.eig-ribbon:hover { border-color: var(--eig-amber); }
.eig-ribbon:hover .org { color: var(--eig-amber); }

/* Shown only if a Plotly hero map fails to render (see GE.autoWireMaps). */
.geo-nav-map.map-failed {
  height: auto; display: flex; align-items: center; justify-content: center;
  border: 1px dashed #4b433f; border-radius: 12px; padding: 40px 20px;
}
.map-fallback { color: var(--eig-amber); font-weight: 700; font-size: 17px; }