/**
 * Layout for the Question Cards block/shortcode wrapper.
 * The card's own look (image/text/icon) comes from <dome-question-card>'s
 * Shadow DOM styles — this file only controls how multiple cards are arranged
 * next to each other.
 */

.dome-question-cards-wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.dome-question-cards-wrapper--cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.dome-question-cards-wrapper--cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.dome-question-cards-wrapper--cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* Collapse to a single column on narrow screens regardless of the configured count */
@media (max-width: 600px) {
    .dome-question-cards-wrapper--cols-2,
    .dome-question-cards-wrapper--cols-3,
    .dome-question-cards-wrapper--cols-4 {
        grid-template-columns: 1fr;
    }
}