/* ============================================================
   Results page — stat grid, outputs grid, lessons grid.
   Loaded alongside community.css, which provides the shared
   primitives (.chero, .section, .cards/.card, .cta-band, icons).
   ============================================================ */

/* ---------- Stats + lessons grids ----------
   3 across (two roomy rows for the six cards), 2 on small, 1 on phones. */
.cards--6 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 720px) {
    .cards--6 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .cards--6 { grid-template-columns: 1fr; }
}

/* ---------- 4-up outputs grid: 2 on tablet, 1 on mobile ---------- */
.cards--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) {
    .cards--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .cards--4 { grid-template-columns: 1fr; }
}

/* The outputs cards wrap an <a> in an <li>; stretch both so every card in a
   row is the same height and the "more" links sit on a single baseline. */
.cards--4 > li { display: flex; }
.cards--4 > li > .card { flex: 1; }

/* ---------- CTA with three buttons ---------- */
.cta-band__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    justify-content: center;
}