/* ==========================================================================
   Dell SLG Strategy Hub — central stylesheet
   One file for the landing page and every state report.
   No frameworks, no CDNs. Theme via the custom properties in :root.
   ========================================================================== */

/* ---- Design tokens ------------------------------------------------------- */
:root {
  /* Brand */
  --c-blue:        #0076CE;   /* Dell Blue */
  --c-blue-600:    #0a63b6;
  --c-blue-700:    #0b4f93;
  --c-blue-900:    #062f57;
  --c-navy:        #081a2e;
  --c-navy-2:      #0c2742;

  /* Surfaces & ink */
  --c-bg:          #eef2f7;
  --c-surface:     #ffffff;
  --c-surface-2:   #f5f8fc;
  --c-ink:         #142433;
  --c-ink-2:       #2b3a4a;
  --c-muted:       #5e6e7e;
  --c-faint:       #8a98a6;
  --c-border:      #e3e9f0;
  --c-border-2:    #cdd8e3;

  /* Semantic */
  --c-good:        #15935f;  --c-good-bg: #e4f5ec;
  --c-warn:        #b4760a;  --c-warn-bg: #fbf0d8;
  --c-risk:        #cf3b2e;  --c-risk-bg: #fbe7e4;
  --c-info:        #0a63b6;  --c-info-bg: #e4f0fb;

  /* Location categories (future city/county/university layers) */
  --c-cat-city:    #10b981;
  --c-cat-county:  #f59e0b;
  --c-cat-univ:    #8b5cf6;

  /* Map */
  --c-state-idle:  #84b8e8;   /* live report — Dell-blue tint */
  --c-state-soon:  #d7dee7;   /* coming soon — neutral */
  --c-state-line:  #ffffff;

  /* Scale */
  --radius:        14px;
  --radius-sm:     9px;
  --radius-pill:   999px;
  --shadow-sm:     0 1px 2px rgba(13,32,51,.06), 0 1px 3px rgba(13,32,51,.05);
  --shadow:        0 2px 6px rgba(13,32,51,.06), 0 10px 24px rgba(13,32,51,.07);
  --shadow-lg:     0 18px 48px rgba(8,26,46,.18);
  --ring:          0 0 0 3px rgba(0,118,206,.28);
  --maxw:          1200px;
  --font:          "Segoe UI", Tahoma, Geneva, Verdana, system-ui, -apple-system, sans-serif;
}

/* ---- Base ---------------------------------------------------------------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; font-family: var(--font); color: var(--c-ink);
  background: var(--c-bg); line-height: 1.6; font-size: 16px;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { margin: 0 0 .4em; line-height: 1.18; font-weight: 700; letter-spacing: -.015em; }
p { margin: 0 0 1em; }
a { color: var(--c-blue-600); text-decoration: none; }
a:hover { text-decoration: underline; }
img, svg { max-width: 100%; }
ul, ol { margin: 0 0 1em; }
small { font-size: .8125rem; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }
.muted { color: var(--c-muted); }
.eyebrow {
  text-transform: uppercase; letter-spacing: .12em;
  font-size: .72rem; font-weight: 800; color: var(--c-blue-600);
}

/* Inline icons */
.icon { width: 1.1em; height: 1.1em; flex: 0 0 auto; vertical-align: -.15em; }

/* ---- Header -------------------------------------------------------------- */
.site-header {
  background: var(--c-navy);
  border-bottom: 1px solid rgba(255,255,255,.06);
  position: sticky; top: 0; z-index: 60;
}
.site-header a { color: #fff; }
.site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 12px 28px; max-width: var(--maxw); margin: 0 auto;
}
.brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.brand__logo { height: 46px; width: auto; display: block; margin: -2px 0 -2px -6px; }
.brand__mark {
  width: 38px; height: 38px; border-radius: 10px; flex: 0 0 auto;
  display: grid; place-items: center; color: #fff;
  background: linear-gradient(140deg, var(--c-blue) 0%, var(--c-blue-700) 100%);
  font-weight: 800; font-size: .82rem; letter-spacing: .02em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
}
.brand__title { font-size: 1.12rem; font-weight: 700; line-height: 1.05; letter-spacing: -.01em; }
.brand__sub { font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; color: #8fb4d8; }
.header-actions { display: flex; align-items: center; gap: 10px; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: 8px; font: inherit;
  font-weight: 600; font-size: .88rem; cursor: pointer; white-space: nowrap;
  padding: 9px 16px; border-radius: var(--radius-sm); border: 1px solid transparent;
  text-decoration: none; transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
}
.btn:hover { text-decoration: none; }
.btn--light { background: #fff; color: var(--c-blue-700); }
.btn--light:hover { background: #eef4fb; }
.btn--ghost { background: rgba(255,255,255,.07); color: #fff; border-color: rgba(255,255,255,.22); }
.btn--ghost:hover { background: rgba(255,255,255,.15); }
.btn--primary { background: var(--c-blue); color: #fff; box-shadow: var(--shadow-sm); }
.btn--primary:hover { background: var(--c-blue-600); transform: translateY(-1px); }

/* ==========================================================================
   LANDING PAGE
   ========================================================================== */
.landing-hero {
  background:
    radial-gradient(1100px 460px at 78% -8%, rgba(0,118,206,.40), transparent 60%),
    radial-gradient(800px 420px at 8% 120%, rgba(11,79,147,.45), transparent 55%),
    linear-gradient(160deg, var(--c-navy) 0%, var(--c-navy-2) 100%);
  color: #fff; position: relative; overflow: hidden;
}
.landing-hero__inner { max-width: var(--maxw); margin: 0 auto; padding: 52px 28px 40px; }
.landing-hero h1 { font-size: clamp(1.9rem, 4vw, 3rem); }
.landing-hero p.lede { font-size: clamp(1rem, 1.6vw, 1.18rem); color: #cfe0f1; max-width: 66ch; margin-bottom: 0; }
.landing-hero .eyebrow { color: #7fd1ff; margin-bottom: 14px; }

/* Map + index */
.map-section { padding: 30px 0; }
.panel {
  background: var(--c-surface); border: 1px solid var(--c-border);
  border-radius: var(--radius); box-shadow: var(--shadow);
}
.map-panel { padding: 18px 24px 14px; margin: 0 0 22px; }
.map-panel__title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.map-panel__title h2 { font-size: 1.05rem; margin: 0; }
.map-panel__title .hint { font-size: .82rem; color: var(--c-muted); }
#us-map { width: 100%; height: auto; display: block; }

.state {
  fill: var(--c-state-soon); stroke: var(--c-state-line); stroke-width: 1;
  stroke-linejoin: round; transition: fill .15s ease;
}
.state.is-available { fill: var(--c-state-idle); cursor: pointer; }
.state.is-available:hover, .state.is-available:focus { fill: var(--c-blue); outline: none; }
.state.is-active { fill: var(--c-blue-700); }
a.state-link { outline: none; }
a.state-link:focus .state { fill: var(--c-blue); }
.map-decor { display: none; }   /* non-state decorative shapes (inset frames, DC dot) */

/* Browse bar — compact "find a state" picker below the map */
.browse-bar { padding: 18px 24px; }
.browse-bar__inner { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.browse-bar__label { font-weight: 700; font-size: 1rem; white-space: nowrap; display: flex; align-items: center; gap: 9px; }
.browse-bar__label .live-count { font-size: .72rem; font-weight: 700; color: var(--c-blue-600); background: var(--c-info-bg); padding: 2px 9px; border-radius: var(--radius-pill); }
.picker-wrap { position: relative; flex: 1 1 280px; min-width: 200px; }
.picker-wrap .icon { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--c-faint); width: 18px; height: 18px; pointer-events: none; }
.state-picker {
  width: 100%; font: inherit; font-size: .95rem; padding: 11px 14px 11px 40px;
  border: 1px solid var(--c-border-2); border-radius: var(--radius-sm); background: #fff; color: var(--c-ink);
}
.state-picker:focus { outline: none; border-color: var(--c-blue); box-shadow: var(--ring); }

/* Custom dropdown — opens directly below the input, full width */
.picker-menu {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 50;
  margin: 0; padding: 6px; list-style: none;
  background: #fff; border: 1px solid var(--c-border-2); border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg); max-height: 320px; overflow-y: auto;
}
.picker-menu[hidden] { display: none; }
.picker-option {
  padding: 9px 12px; border-radius: var(--radius-sm); font-size: .92rem; font-weight: 600;
  color: var(--c-ink); cursor: pointer;
}
.picker-option[hidden] { display: none; }
.picker-option:hover, .picker-option.is-active { background: var(--c-info-bg); color: var(--c-blue-700); }
.picker-empty { padding: 10px 12px; font-size: .9rem; color: var(--c-muted); }

.browse-bar .btn { flex: 0 0 auto; }
.browse-bar__hint { margin: 11px 0 0; font-size: .82rem; color: var(--c-muted); }

/* "What's inside" feature cards */
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; padding: 40px 0 64px; }
.feature {
  background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius);
  padding: 22px; box-shadow: var(--shadow-sm);
}
.feature__icon {
  width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; margin-bottom: 14px;
  background: var(--c-info-bg); color: var(--c-blue-600);
}
.feature__icon .icon { width: 22px; height: 22px; }
.feature h3 { font-size: 1.02rem; margin-bottom: 6px; }
.feature p { font-size: .9rem; color: var(--c-muted); margin: 0; }

/* ==========================================================================
   REPORT PAGE
   ========================================================================== */
.report-hero {
  background:
    radial-gradient(900px 380px at 88% -20%, rgba(0,118,206,.40), transparent 60%),
    linear-gradient(155deg, var(--c-navy) 0%, var(--c-navy-2) 60%, var(--c-blue-900) 100%);
  color: #fff;
}
.report-hero__inner { max-width: var(--maxw); margin: 0 auto; padding: 26px 28px 34px; }
.crumbs { font-size: .84rem; color: #9fc2e4; margin-bottom: 16px; display: flex; align-items: center; gap: 7px; }
.crumbs a { color: #9fc2e4; }
.crumbs a:hover { color: #fff; }
.report-hero .eyebrow { color: #7fd1ff; }
.report-hero h1 { font-size: clamp(2rem, 4.2vw, 3.1rem); margin: 6px 0 8px; }
.report-hero .tagline { color: #d7e6f4; font-size: clamp(1rem,1.5vw,1.12rem); margin-bottom: 0; }
.report-hero__meta { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-top: 18px; }
.updated-pill {
  display: inline-flex; align-items: center; gap: 8px; font-size: .82rem; font-weight: 600;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
  padding: 6px 13px; border-radius: var(--radius-pill);
}
.updated-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: #4fdca0; box-shadow: 0 0 0 3px rgba(79,220,160,.25); }

.snapshot { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 22px; }
.snapshot .chip {
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px; padding: 12px 15px;
}
.snapshot .chip b { display: block; font-size: 1.18rem; font-weight: 800; letter-spacing: -.01em; }
.snapshot .chip span { font-size: .76rem; color: #b9cfe4; }

/* Two-column shell: sticky TOC rail + content */
.report-shell {
  display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 44px;
  max-width: var(--maxw); margin: 0 auto; padding: 0 28px 30px; align-items: start;
}
.toc { position: sticky; top: 76px; padding-top: 30px; }
.toc__label { font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; color: var(--c-faint); font-weight: 800; padding: 0 12px 10px; }
.toc a {
  display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: var(--radius-sm);
  color: var(--c-muted); font-weight: 600; font-size: .9rem; border-left: 3px solid transparent;
}
.toc a:hover { background: var(--c-surface-2); color: var(--c-ink); text-decoration: none; }
.toc a.active { color: var(--c-blue-700); background: var(--c-info-bg); border-left-color: var(--c-blue); }
.toc a .icon { width: 18px; height: 18px; color: inherit; }

.report-main { padding-top: 14px; min-width: 0; }
.section { padding: 30px 0; scroll-margin-top: 72px; }
.section + .section { border-top: 1px solid var(--c-border); }
.section__head { display: flex; align-items: center; gap: 13px; margin-bottom: 20px; }
.section__head h2 { font-size: 1.5rem; margin: 0; }
.section__icon {
  width: 38px; height: 38px; border-radius: 11px; flex: 0 0 auto; display: grid; place-items: center;
  background: linear-gradient(140deg, var(--c-blue) 0%, var(--c-blue-700) 100%); color: #fff;
  box-shadow: var(--shadow-sm);
}
.section__icon .icon { width: 20px; height: 20px; }
.lead { font-size: 1.02rem; color: var(--c-ink-2); }

/* Top Accounts directory (state breakout pages) */
.accounts { background: var(--c-surface-2); border-bottom: 1px solid var(--c-border); }
.accounts__inner { max-width: var(--maxw); margin: 0 auto; padding: 26px 28px; }
.accounts__head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.accounts__head h2 { font-size: 1.25rem; margin: 0; display: flex; align-items: center; gap: 9px; }
.accounts__head h2 .icon { color: var(--c-blue-600); width: 20px; height: 20px; }
.acct-group { margin-bottom: 20px; }
.acct-group:last-child { margin-bottom: 0; }
.acct-group h3 { font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--c-muted); font-weight: 800; margin: 0 0 10px; display: flex; align-items: center; gap: 8px; }
.acct-count { background: #e7edf3; color: var(--c-muted); border-radius: 999px; font-size: .7rem; padding: 1px 8px; font-weight: 700; }
.acct-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(266px, 1fr)); gap: 12px; }
.acct-card { display: flex; flex-direction: column; gap: 7px; padding: 15px 16px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: var(--shadow-sm); text-decoration: none; color: var(--c-ink); transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
a.acct-card:hover { border-color: var(--c-blue); box-shadow: var(--shadow); transform: translateY(-2px); text-decoration: none; }
.acct-card.is-soon { background: var(--c-surface-2); }
.acct-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.acct-badge { font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.acct-badge--agency { background: var(--c-info-bg); color: var(--c-blue-700); }
.acct-badge--highered { background: #efe9fb; color: #6b46c1; }
.acct-badge--county { background: var(--c-warn-bg); color: var(--c-warn); }
.acct-badge--city { background: var(--c-good-bg); color: var(--c-good); }
.acct-badge--district { background: #e3f1f4; color: #0e7490; }
.acct-badge--court { background: #f1ede4; color: #8a6d1f; }
.acct-badge--k12 { background: #fbe9f1; color: #b03a78; }
.acct-badge--other { background: #eef2f7; color: var(--c-muted); }
.acct-card__name { font-weight: 700; font-size: 1rem; line-height: 1.22; }
.acct-card__hq { font-size: .8rem; color: var(--c-muted); display: flex; align-items: center; gap: 5px; }
.acct-card__hq .icon { width: 14px; height: 14px; }
.acct-card__blurb { font-size: .87rem; color: var(--c-ink-2); line-height: 1.45; }
.acct-go { color: var(--c-faint); width: 16px; height: 16px; }
a.acct-card:hover .acct-go { color: var(--c-blue); }
.acct-card .soon-tag { font-size: .62rem; text-transform: uppercase; letter-spacing: .07em; color: var(--c-faint); font-weight: 700; }
@media (max-width: 640px) { .acct-grid { grid-template-columns: 1fr; } }

/* Account brief page (single-column, no TOC) */
.brief { max-width: 980px; margin: 0 auto; padding: 6px 28px 50px; }
.brief .section:first-child { border-top: 0; }
.brief .report-hero__meta .updated-pill { background: rgba(255,255,255,.1); }

/* Grid */
.grid { display: grid; gap: 18px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

/* Cards */
.card {
  background: var(--c-surface); border: 1px solid var(--c-border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 22px;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.card--hover:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--c-border-2); }
.card__title { font-size: 1.02rem; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 9px; }
.card__title .icon { color: var(--c-blue-600); width: 19px; height: 19px; }
.card p:last-child { margin-bottom: 0; }

/* Stat tiles (KPI) */
.stat {
  background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: 20px;
}
.stat__icon { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center;
  background: var(--c-info-bg); color: var(--c-blue-600); margin-bottom: 14px; }
.stat__icon .icon { width: 19px; height: 19px; }
.stat__value { font-size: 1.75rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.05; color: var(--c-blue-900); }
.stat__label { font-size: .78rem; color: var(--c-muted); margin-top: 6px; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.stat__note { font-size: .8rem; color: var(--c-muted); margin-top: 8px; line-height: 1.45; }

/* Unboxed summary prose */
.summary-prose { font-size: 1.05rem; color: var(--c-ink-2); margin: 22px 0; }
.summary-prose p:last-child { margin-bottom: 0; }

/* Soft highlight panel — replaces left-accent cards for callout-style text */
.highlight-panel {
  background: linear-gradient(180deg, #f5f9fe 0%, #ecf4fc 100%);
  border: 1px solid #dceaf8; border-radius: var(--radius); padding: 22px 24px;
}
.highlight-panel__head { display: flex; align-items: center; gap: 9px; font-weight: 700; font-size: 1.05rem; margin-bottom: 16px; }
.highlight-panel__head .icon { color: var(--c-blue-600); width: 20px; height: 20px; }
.highlight-panel p:last-child { margin-bottom: 0; }
.opp-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 13px 30px; }
.opp-list li { display: flex; gap: 11px; align-items: flex-start; font-size: .94rem; color: var(--c-ink-2); line-height: 1.5; }
.opp-list .icon { color: var(--c-blue); width: 18px; height: 18px; margin-top: 2px; flex: 0 0 auto; }

/* Badges */
.badge {
  display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 700;
  padding: 4px 11px; border-radius: var(--radius-pill); text-transform: uppercase; letter-spacing: .03em;
  background: #eef2f7; color: var(--c-muted); white-space: nowrap;
}
.badge--blue { background: var(--c-info-bg); color: var(--c-blue-600); }
.badge--good { background: var(--c-good-bg); color: var(--c-good); }
.badge--warn { background: var(--c-warn-bg); color: var(--c-warn); }
.badge--risk { background: var(--c-risk-bg); color: var(--c-risk); }
.badge .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }

/* Initiative cards */
.init-card { display: flex; flex-direction: column; }
.init-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.init-card__head h3 { font-size: 1.05rem; margin: 0; }
.init-card p { font-size: .92rem; color: var(--c-ink-2); }
.init-card__meters { margin-top: auto; padding-top: 6px; }
.init-card__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }

/* Meters */
.meter { margin: 11px 0; }
.meter__top { display: flex; justify-content: space-between; font-size: .82rem; margin-bottom: 5px; color: var(--c-muted); }
.meter__top b { font-weight: 800; color: var(--c-ink); }
.meter__track { height: 8px; border-radius: var(--radius-pill); background: #e7edf3; overflow: hidden; }
.meter__fill { height: 100%; border-radius: var(--radius-pill); background: linear-gradient(90deg, var(--c-blue), var(--c-blue-600)); }
.meter__fill--good { background: linear-gradient(90deg, #1fb574, var(--c-good)); }
.meter__fill--warn { background: linear-gradient(90deg, #e0a52a, var(--c-warn)); }
.meter__fill--risk { background: linear-gradient(90deg, #e2574a, var(--c-risk)); }

/* Bar list */
.barlist { display: grid; gap: 14px; }
.barlist__row { display: grid; grid-template-columns: 190px 1fr auto; gap: 14px; align-items: center; font-size: .9rem; }
.barlist__track { background: #eef2f7; border-radius: 6px; height: 26px; overflow: hidden; }
.barlist__bar { height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--c-blue), var(--c-blue-700)); min-width: 3px; }
.barlist__val { font-weight: 800; color: var(--c-blue-900); white-space: nowrap; }

/* Tables */
.table-card { overflow: hidden; padding: 0; }
.data-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.data-table th, .data-table td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--c-border); vertical-align: top; }
.data-table th { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--c-muted); background: var(--c-surface-2); font-weight: 700; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: var(--c-surface-2); }

/* News timeline */
.timeline { position: relative; margin-left: 8px; padding-left: 30px; }
.timeline::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 6px; width: 2px; background: var(--c-border-2); }
.tl-item { position: relative; padding: 0 0 24px; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
  content: ""; position: absolute; left: -30px; top: 4px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--c-blue); border: 3px solid #fff; box-shadow: 0 0 0 2px var(--c-blue);
}
.tl-date { font-size: .76rem; font-weight: 800; color: var(--c-blue-600); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 3px; }
.tl-title { font-weight: 700; font-size: 1rem; margin-bottom: 5px; }
.tl-impact { font-size: .9rem; color: var(--c-muted); }
.tl-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 7px; }
.tag { display: inline-flex; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--c-blue-700); background: var(--c-info-bg); padding: 2px 9px; border-radius: var(--radius-pill); }

/* Callout — Dell action plan */
.callout {
  background:
    radial-gradient(600px 200px at 100% 0%, rgba(0,118,206,.5), transparent 60%),
    linear-gradient(150deg, #06243d, #0b3a63);
  color: #eaf3fb; border-radius: var(--radius); padding: 28px 30px; box-shadow: var(--shadow-lg);
}
.callout__head { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; }
.callout__head h3 { color: #fff; margin: 0; font-size: 1.25rem; }
.callout__head .section__icon { background: rgba(255,255,255,.14); box-shadow: none; }
.action-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 13px; }
.action-list li { display: flex; gap: 12px; align-items: flex-start; font-size: .95rem; line-height: 1.5; }
.action-list .icon { color: #4fdca0; width: 21px; height: 21px; margin-top: 1px; }

/* Sources */
.sources { margin-top: 30px; padding: 22px; background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: var(--radius); }
.sources h3 { font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--c-muted); margin-bottom: 12px; }
.sources ol { margin: 0; padding-left: 22px; font-size: .85rem; color: var(--c-muted); }
.sources li { margin-bottom: 7px; word-break: break-word; }
.ref { font-size: .68em; vertical-align: super; color: var(--c-blue-600); font-weight: 800; margin-left: 1px; }
.ref a { color: inherit; }

/* Footer */
.site-footer { background: var(--c-navy); color: #9fb3c6; font-size: .85rem; margin-top: 20px; }
.site-footer__inner { max-width: var(--maxw); margin: 0 auto; padding: 26px 28px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 28px; }
.site-footer a { color: #cfe0f0; }
.site-footer__brand { display: flex; align-items: center; }
.footer-logo { height: 52px; width: auto; display: block; margin-left: -6px; }
.footer-govspend { display: inline-flex; align-items: center; gap: 11px; font-size: .82rem; color: #9fb3c6; justify-content: flex-end; }
.footer-govspend .gs-logo { height: 34px; width: auto; background: #fff; padding: 8px 13px; border-radius: 9px; }
.site-footer__meta { display: flex; flex-direction: column; gap: 4px; text-align: right; }
@media (max-width: 640px) { .site-footer__meta { text-align: left; } }

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width: 980px) {
  .features { grid-template-columns: 1fr; }
  .snapshot { grid-template-columns: repeat(2, 1fr); }

  /* TOC becomes a sticky horizontal bar */
  .report-shell { grid-template-columns: 1fr; gap: 0; }
  .toc { position: sticky; top: 62px; z-index: 40; padding: 0; margin: 0 -28px;
    background: rgba(255,255,255,.95); backdrop-filter: blur(8px); border-bottom: 1px solid var(--c-border);
    display: flex; gap: 2px; overflow-x: auto; }
  .toc__label { display: none; }
  .toc a { border-left: none; border-bottom: 3px solid transparent; border-radius: 0; padding: 13px 14px; white-space: nowrap; }
  .toc a.active { background: transparent; border-bottom-color: var(--c-blue); }
  .toc a span.toc-label { display: inline; }
}
@media (max-width: 640px) {
  body { font-size: 15px; }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }   /* keep KPIs 2-up on tablet/phone */
  .opp-list { grid-template-columns: 1fr; }
  .barlist__row { grid-template-columns: 120px 1fr auto; }
  .snapshot { grid-template-columns: 1fr 1fr; }
  .hero-stat { flex: 1 1 40%; }
  .toc a span.toc-label { display: none; }   /* icon-only nav on phones */
  .toc a { padding: 13px 16px; }
}
@media (max-width: 430px) { .grid-4 { grid-template-columns: 1fr; } }

/* ---- Print --------------------------------------------------------------- */
@media print {
  .site-header, .toc, .header-actions, .index-panel { display: none !important; }
  .report-shell { grid-template-columns: 1fr; }
  body { background: #fff; }
  .card, .stat { box-shadow: none; }
  .section { page-break-inside: avoid; }
}

/* ---- Procurement & Spend Signals (INTERNAL build only) ------------------- */
.ss-section .section__head { flex-wrap: wrap; gap: 8px 12px; }
.ss-flag {
  margin-left: auto; align-self: center;
  font-size: .68rem; font-weight: 800; letter-spacing: .02em; text-transform: uppercase;
  color: var(--c-warn); background: var(--c-warn-bg);
  border: 1px solid #eBD9a8; padding: 3px 10px; border-radius: var(--radius-pill);
}
.ss-meta { font-size: .85rem; margin: -4px 0 16px; }
.ss-footprint { display: flex; align-items: center; gap: 20px; margin: 4px 0 20px; padding: 18px 24px; border-radius: var(--radius); color: #fff; background: linear-gradient(135deg, var(--c-blue-900), var(--c-blue-600)); box-shadow: var(--shadow-sm); }
.ss-footprint__val { font-size: 2.25rem; font-weight: 800; letter-spacing: -.02em; line-height: 1; flex: 0 0 auto; }
.ss-footprint__lbl { font-size: .74rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: #bcd6f2; }
.ss-footprint__break { font-size: .95rem; margin-top: 5px; color: #e6effb; }
.ss-footprint__break b { color: #fff; font-weight: 800; }
@media (max-width: 520px) { .ss-footprint { flex-direction: column; align-items: flex-start; gap: 8px; } .ss-footprint__val { font-size: 1.9rem; } }
.ss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-bottom: 18px; align-items: start; }
@media (max-width: 760px) { .ss-grid { grid-template-columns: 1fr; } }
.ss-col__title, .ss-cats .ss-col__title {
  font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  color: var(--c-muted); margin: 0 0 10px;
}
.ss-col--full { margin: 0 0 18px; }
.ss-cat-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.ss-cat { flex: 1 1 200px; background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: var(--radius-sm); padding: 13px 15px; }
.ss-cat b { display: block; font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; color: var(--c-blue-900); }
.ss-cat span { font-size: .82rem; color: var(--c-muted); }
.ss-notes { font-size: .8rem; margin: 14px 0 0; padding-left: 18px; }
.ss-notes li { margin: 3px 0; }
.ss-hint { font-size: .72rem; color: var(--c-muted); margin: 10px 0 0; line-height: 1.4; }

/* Vendor spend bars */
.ss-bars { display: flex; flex-direction: column; gap: 9px; }
.ss-bar { display: grid; grid-template-columns: 165px 1fr auto; align-items: center; gap: 12px; }
.ss-bar__label { font-size: .86rem; font-weight: 600; color: var(--c-ink-2); }
.ss-bar__track { height: 12px; background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: var(--radius-pill); overflow: hidden; }
.ss-bar__fill { height: 100%; background: var(--c-border-2); border-radius: var(--radius-pill); }
.ss-bar__val { font-size: .84rem; font-weight: 700; color: var(--c-ink); font-variant-numeric: tabular-nums; }
.ss-bar.is-dell { background: var(--c-info-bg); border-radius: var(--radius-sm); padding: 6px 10px; margin: 0 -10px; box-shadow: inset 3px 0 0 var(--c-blue); }
.ss-bar.is-dell .ss-bar__fill { background: var(--c-blue); }
.ss-bar.is-dell .ss-bar__label { color: var(--c-blue-700); font-weight: 800; }
.ss-bar.is-reseller .ss-bar__fill { background: var(--c-warn); opacity: .85; }
.ss-bar__dell { display: block; font-size: .7rem; font-weight: 700; color: var(--c-blue-700); margin-top: 2px; }
@media (max-width: 520px) { .ss-bar { grid-template-columns: 130px 1fr auto; } }

/* Pills */
.ss-pill { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; padding: 1px 6px; border-radius: var(--radius-pill); vertical-align: middle; }
.ss-pill--dell { color: #fff; background: var(--c-blue); }
.ss-pill--reseller { color: var(--c-warn); background: var(--c-warn-bg); }

.ss-section .data-table tr.is-dell-row td { color: var(--c-blue-700); font-weight: 800; background: var(--c-info-bg); }

/* Freshness: expired/closed rows in Spend Signals tables (set at build and by fresh.js) */
.data-table tr.is-expired td { color: var(--c-faint); }
.data-table tr.is-expired td a, .data-table tr.is-expired td b { color: var(--c-faint); font-weight: 600; }
.data-table tr.is-expired td[data-date]::after {
  content: attr(data-past-label);
  display: inline-block; margin-left: 7px; padding: 1px 7px; border-radius: var(--radius-pill);
  font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  color: var(--c-risk); background: var(--c-risk-bg);
}

/* Freshness: report older than 45 days — green dot turns amber (fresh.js) */
.updated-pill.is-stale .dot { background: #f2b632; box-shadow: 0 0 0 3px rgba(242,182,50,.28); }
/* Right-aligned numeric cells */
.ss-section .data-table td.num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.ss-section .data-table td.nowrap { white-space: nowrap; color: var(--c-muted); font-size: .85rem; }


/* ==========================================================================
   50-State Budget Shifts report (reports/budget-shifts.html)
   ========================================================================== */
.delta-pos { color: var(--c-good); font-weight: 700; white-space: nowrap; }
.delta-neg { color: var(--c-risk); font-weight: 700; white-space: nowrap; }
.delta-flat { color: var(--c-muted); font-weight: 700; white-space: nowrap; }

.bsr-table { overflow-x: auto; }
.bsr-table .data-table { font-size: .85rem; }
.bsr-table .data-table th, .bsr-table .data-table td { padding: 10px 12px; }
.bsr-table .data-table th.num, .bsr-table .data-table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bsr-table .data-table td a { color: var(--c-blue-700); text-decoration: none; }
.bsr-table .data-table td a:hover { text-decoration: underline; }

/* Stack table rows single-file when the full grid can't fit */
@media (max-width: 1100px) {
  .bsr-stack .data-table thead { display: none; }
  .bsr-stack .data-table, .bsr-stack .data-table tbody,
  .bsr-stack .data-table tr, .bsr-stack .data-table td { display: block; width: 100%; }
  .bsr-stack .data-table tr { padding: 10px 16px; border-bottom: 1px solid var(--c-border); }
  .bsr-stack .data-table tr:last-child { border-bottom: 0; }
  .bsr-stack .data-table td { padding: 3px 0; border-bottom: none; }
  .bsr-stack .data-table td.rowhead { font-size: .95rem; padding-bottom: 6px; }
  .bsr-stack .data-table td[data-label] { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
  .bsr-stack .data-table td[data-label]::before {
    content: attr(data-label); flex: 0 0 auto;
    font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--c-muted);
  }
  .bsr-stack .data-table td[data-label] > * { text-align: right; }
  .bsr-stack .data-table td[data-label] .chip-wrap { justify-content: flex-end; }
  .bsr-stack .data-table tbody tr:hover { background: none; }
}

.strat-chip { display: inline-block; font-size: .66rem; font-weight: 700; color: var(--c-risk); background: var(--c-risk-bg); border-radius: var(--radius-pill); padding: 1px 8px; margin: 1px 2px 1px 0; white-space: nowrap; }

.code-chip { display: inline-block; font-size: .7rem; font-weight: 700; color: var(--c-blue-700); background: var(--c-info-bg); border-radius: var(--radius-sm); padding: 1px 5px; margin: 1px; text-decoration: none; }
.code-chip:hover { background: var(--c-blue); color: #fff; }

/* chip clusters wrap inside table cells (incl. stacked flex cells) */
.chip-wrap { display: inline-flex; flex-wrap: wrap; gap: 3px; min-width: 0; }

.func-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin-top: 16px; }
.func-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.func-card__head h3 { margin: 0; font-size: 1rem; }
.func-card__med { font-size: .78rem; color: var(--c-muted); white-space: nowrap; }
/* Adding / Cutting mini-tables: shared grid so numbers align in columns */
.func-table { display: grid; grid-template-columns: 1fr max-content max-content max-content; column-gap: 14px; font-size: .82rem; align-items: baseline; }
.func-table--3 { grid-template-columns: 1fr max-content max-content; }
.ft-h { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--c-faint); text-align: right; padding-bottom: 2px; }
.func-table .ft-h:first-of-type { text-align: left; }
.ft-group { grid-column: 1 / -1; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 10px 0 3px; }
.ft-group.delta-pos-h { color: var(--c-good); }
.ft-group.delta-neg-h { color: var(--c-risk); }
.ft-name { color: var(--c-ink-2); text-decoration: none; padding: 4px 0; border-bottom: 1px dashed var(--c-border); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ft-name:hover { color: var(--c-blue-700); text-decoration: underline; }
.ft-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; padding: 4px 0; border-bottom: 1px dashed var(--c-border); }
.ft-sub { color: var(--c-muted); font-size: .78rem; }
h4.delta-pos-h { color: var(--c-good); }
h4.delta-neg-h { color: var(--c-risk); }

.func-card__note { font-size: .8rem; color: var(--c-muted); margin: 0 0 12px; line-height: 1.5; }

/* Where the Money Goes — per-state 100% stacked spending mix */
.mix-card { padding: 16px 20px; }
.mix-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 14px; }
.mix-key { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--c-ink-2); font-weight: 600; }
.mix-key--debt { color: var(--c-muted); font-weight: 400; margin-left: auto; }
.mix-swatch { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.mix-row { display: grid; grid-template-columns: 130px 1fr 74px; align-items: center; gap: 12px; padding: 4px 0; }
.mix-row__name { font-size: .8rem; font-weight: 600; color: var(--c-ink-2); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mix-row__name:hover { color: var(--c-blue-700); text-decoration: underline; }
.mix-bar { display: flex; height: 16px; border-radius: 5px; overflow: hidden; background: var(--c-surface-2); }
.mix-seg { display: block; height: 100%; min-width: 0; }
.mix-seg--k12 { background: #0076CE; }
.mix-seg--higherEd { background: #8b5cf6; }
.mix-seg--medicaid { background: #10b981; }
.mix-seg--corrections { background: #cf3b2e; }
.mix-seg--transportation { background: #f59e0b; }
.mix-seg--allOther { background: #a9b6c2; }
.mix-row__debt { font-size: .78rem; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 640px) {
  .mix-row { grid-template-columns: 1fr 64px; grid-template-areas: "name debt" "bar bar"; gap: 2px 10px; padding: 7px 0; border-bottom: 1px dashed var(--c-border); }
  .mix-row:last-child { border-bottom: none; }
  .mix-row__name { grid-area: name; }
  .mix-bar { grid-area: bar; }
  .mix-row__debt { grid-area: debt; }
  .mix-key--debt { margin-left: 0; }
}

.national-reports { margin-top: 18px; padding: 20px 24px; }
.national-reports__inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.national-reports__text h3 { margin: 6px 0 4px; }
.national-reports__text p { margin: 0; font-size: .9rem; max-width: 640px; }
