/* Cruise-typeoverzicht, /cruise-types/. Een HTML-boom voor alle breedtes. */

.st-titel { font-size: 68px; margin-bottom: 22px; }
.st-kaart { height: 260px; }
.st-kaart-titel { font-size: 26px; }

@media (max-width: 1024px) {
    .st-titel { font-size: 50px; }
}

@media (max-width: 720px) {
    .st-titel { font-size: 32px; }

    /* Op mobiel stond dit als een dicht 2-koloms raster met kleinere
       kaarten in plaats van een enkele kolom; dat nemen we hier over. */
    .st-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
    .st-kaart { height: 150px; }
    .st-kaart-titel { font-size: 16px; }
}