/* Overzicht Voor groepen: brede kaarten zonder dubbele zijnavigatie. */
.page-layout:has(.groepen-overzicht) { grid-template-columns: minmax(0, 1fr); }
.page-layout:has(.groepen-overzicht) > .page-zijnav { display: none; }
.page-content:has(.groepen-overzicht) { max-width: none; min-width: 0; }
.groepen-overzicht__intro { max-width: 800px; margin: 0 auto 48px; text-align: center; }
.groepen-overzicht__intro h2 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); }
.groepen-overzicht__intro > p:not(.kicker) { color: var(--kleur-grijs); line-height: 1.8; }
.groepen-overzicht__intro .groepen-overzicht__feiten { display: inline-block; margin: 10px 0 0; padding-top: 18px; border-top: 1px solid var(--kleur-lijn); font-size: .9rem; color: var(--kleur-tekst); }
.groepen-kaarten { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.groepen-kaarten .groepen-kaart { margin: 0; min-width: 0; }
.groepen-kaart__link { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--kleur-lijn); border-radius: 14px; color: var(--kleur-tekst); text-decoration: none; background: var(--kleur-wit); transition: border-color var(--overgang), box-shadow var(--overgang); }
.groepen-kaart__link:hover { color: var(--kleur-tekst); border-color: var(--kleur-accent); box-shadow: 0 8px 24px rgba(27, 25, 23, .06); }
.groepen-kaart__link:focus-visible { outline: 2px solid var(--kleur-accent-donker); outline-offset: 5px; }
.groepen-kaart__foto { aspect-ratio: 3 / 2; overflow: hidden; background: var(--kleur-creme); }
.groepen-kaart__foto picture { display: block; height: 100%; }
.groepen-kaart__foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.groepen-kaart__tekst { display: flex; flex-direction: column; align-items: flex-start; padding: 26px; flex: 1; }
.groepen-kaart__tekst h3 { font-size: 1.45rem; line-height: 1.3; margin: 0 0 12px; }
.groepen-kaart__tekst p { color: var(--kleur-grijs); font-size: .94rem; line-height: 1.75; margin: 0 0 24px; }
.groepen-kaart__pijl { display: inline-flex; color: var(--kleur-accent); margin-top: auto; }
.groepen-overzicht__contact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; margin-top: 56px; padding: clamp(24px, 4vw, 44px); background: var(--kleur-creme); border-radius: 14px; }
.groepen-overzicht__contact > div:first-child { max-width: 600px; }
.groepen-overzicht__contact h2 { font-size: clamp(1.4rem, 2.6vw, 1.8rem); }
.groepen-overzicht__contact p { color: var(--kleur-grijs); margin: 0; }
.groepen-overzicht__contact .knoppen { margin: 0; }
@media (min-width: 650px) { .groepen-kaarten { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .groepen-kaarten { grid-template-columns: repeat(3, minmax(0, 1fr)); } }