/* ─── Deck Slide Preview — micro-styles for the hero demo component ─────────
   Applied by index.html only. Classes replace inline styles on the slide
   mockup so the markup stays semantic and styles stay maintainable here.
   ──────────────────────────────────────────────────────────────────────── */

/* ── Stat card row ─────────────────────────────────────────────────────── */
.stat-cards        { display: flex; gap: 10px; }
.stat-cards--mt    { margin-top: 6px; }
.stat-cards--mb    { margin-bottom: 10px; }

/* ── Individual stat card ──────────────────────────────────────────────── */
.stat-card {
  flex: 1;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 5px;
  padding: 6px 8px;
}

/* ── Stat card label (badge text above the number) ─────────────────────── */
.stat-card__label {
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.stat-card__label--green { color: rgba(52,199,89,.8); }
.stat-card__label--gold  { color: var(--gold); }
.stat-card__label--red   { color: rgba(255,69,58,.8); }

/* ── Stat card value (large number) ────────────────────────────────────── */
.stat-card__value {
  font-size: 16px;
  font-weight: 800;
  color: var(--gold);
  line-height: 1.1;
}

/* ── Stat card sub-text ────────────────────────────────────────────────── */
.stat-card__sub {
  font-size: 8px;
  color: rgba(255,255,255,.4);
  margin-top: 1px;
}

/* ── Slide section label (uppercase heading above chart/list) ──────────── */
.slide-section-label {
  font-size: 9px;
  color: rgba(255,255,255,.35);
  margin-bottom: 6px;
  font-weight: 600;
  letter-spacing: .06em;
}

/* ── Negative progress bar value ────────────────────────────────────────── */
.deck-prog-val--negative { color: #FF453A; }

/* ── Priority action map 2-col grid ─────────────────────────────────────── */
.action-map {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

/* ── Action item card ───────────────────────────────────────────────────── */
.action-item {
  border-radius: 5px;
  padding: 6px 8px;
}
.action-item--red   { background: rgba(255,69,58,.08);  border: 1px solid rgba(255,69,58,.25); }
.action-item--gold  { background: rgba(255,184,0,.07);  border: 1px solid rgba(255,184,0,.22); }
.action-item--green { background: rgba(52,199,89,.07);  border: 1px solid rgba(52,199,89,.22); }

/* ── Action item label ──────────────────────────────────────────────────── */
.action-item__label {
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.action-item__label--red   { color: rgba(255,69,58,.9); }
.action-item__label--gold  { color: rgba(255,184,0,.9); }
.action-item__label--green { color: rgba(52,199,89,.9); }

/* ── Action item body text ──────────────────────────────────────────────── */
.action-item__text {
  font-size: 9px;
  color: rgba(255,255,255,.8);
  line-height: 1.35;
}