/* ==========================================================================
   CIS Controls landing — supplements style.css and nis2.css (the shared
   catalogue-component sheet: tier-label, manifest, checker, opt-row,
   tier-table, compliance-band, buy-btn.soon). This file adds only the
   IG1-readiness *score* result styling. No new colours or fonts.
   ========================================================================== */

/* --- Readiness score result (4 bands) ------------------------------------ */
.cis-result {
  margin-top: 1.6rem;
  padding: 1.5rem;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: rgba(0, 0, 0, 0.28);
}
.cis-result:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Big score readout */
.cis-score {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0 0 0.9rem;
}
.cis-score b {
  font-family: var(--font-mono);
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--accent-bright);
}
.cis-score span { font-size: 0.9rem; color: var(--text-dim); }

.cis-result h3 {
  margin: 0 0 0.5rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.cis-result-lead { margin: 0 0 0.6rem; color: var(--text-soft); font-size: 0.9rem; }
.cis-result-note { margin: 0; color: var(--text-dim); font-size: 0.82rem; line-height: 1.6; }

/* Band accents reuse the existing token palette. */
.cis-result.band-strong  { border-color: var(--line-accent); background: rgba(61, 220, 132, 0.07); }
.cis-result.band-strong  h3, .cis-result.band-strong  .cis-score b { color: var(--accent-bright); }
.cis-result.band-partial { border-color: var(--line-accent); background: rgba(61, 220, 132, 0.04); }
.cis-result.band-partial h3 { color: var(--accent); }
.cis-result.band-early   { border-color: var(--warn); background: rgba(230, 180, 85, 0.07); }
.cis-result.band-early   h3, .cis-result.band-early .cis-score b { color: var(--warn); }
.cis-result.band-exposed { border-color: var(--warn); background: rgba(230, 180, 85, 0.10); }
.cis-result.band-exposed h3, .cis-result.band-exposed .cis-score b { color: var(--warn); }

/* The "four that save you" callout inside the result. */
.cis-flags {
  margin: 1rem 0 0;
  padding: 0.85rem 1rem;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: rgba(0, 0, 0, 0.25);
  font-size: 0.82rem;
  color: var(--text-soft);
}
.cis-flags b { color: var(--text); }
.cis-flags ul { margin: 0.5rem 0 0; padding-left: 1.1rem; }
.cis-flags li { margin: 0.2rem 0; color: var(--text-dim); }

.cis-result-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
}
.cis-result-cta .buy-btn { flex: none; }

@media (max-width: 720px) {
  .cis-result-cta .buy-btn { width: 100%; }
}