/* Public listing grids collapse unused desktop columns as card counts change.
   Mobile swipe rails and journal rows keep their established layouts. */
@media (min-width: 768px) {
    html body :is(.nf-travel-grid, #groupItineraryGrid.nf-travel-grid,
        #privateItineraryGrid.nf-travel-grid, .nf-journal-grid,
        .slp-card-grid, .slp-related-grid) {
        --nf-listing-min: max(260px, calc((100% - 48px) / 3));
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--nf-listing-min)), 1fr)) !important;
        column-gap: 24px !important;
    }
    html body :is(.nf-travel-grid, #groupItineraryGrid.nf-travel-grid,
        #privateItineraryGrid.nf-travel-grid, .nf-journal-grid,
        .slp-card-grid, .slp-related-grid) > :is(.nf-travel-card, .nf-journal-story, .slp-related-card) {
        width: 100%;
        max-width: 620px;
        justify-self: center;
    }
    html body :is(.nf-travel-grid, .nf-journal-grid, .slp-card-grid, .slp-related-grid)
        > :is(.nf-travel-card, .nf-journal-story, .slp-related-card):first-child:last-child {
        max-width: 560px;
    }
}
@media (min-width: 768px) and (max-width: 1100px) {
    html body :is(.nf-travel-grid, #groupItineraryGrid.nf-travel-grid,
        #privateItineraryGrid.nf-travel-grid, .nf-journal-grid,
        .slp-card-grid, .slp-related-grid) {
        --nf-listing-min: max(260px, calc((100% - 24px) / 2));
    }
}
/* Departure cards retain their content and controls with a shorter portrait crop. */
html body .nf-home-departure-card { aspect-ratio: 4 / 5; }
@media (min-width: 761px) {
    html body .nf-home-departure-grid {
        --nf-departure-gap: clamp(14px, 1.55vw, 26px);
        --nf-departure-min: max(260px, calc((100% - 3 * var(--nf-departure-gap)) / 4));
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--nf-departure-min)), 1fr));
        column-gap: var(--nf-departure-gap);
    }
    html body .nf-home-departure-grid > .nf-home-departure-card {
        width: 100%;
        max-width: 620px;
        justify-self: center;
    }
    html body .nf-home-departure-grid > .nf-home-departure-card:first-child:last-child { max-width: 520px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
    html body .nf-home-departure-grid {
        --nf-departure-min: max(260px, calc((100% - var(--nf-departure-gap)) / 2));
    }
}
/* Small desktop rails use all available slots; longer rails retain scrolling.
   These lists contain direct card children; the optional selectors add no JS. */
@media (min-width: 1101px) {
    html body :is(.nf-travel-rail, #home-journeys-track.nf-home-itineraries__grid):has(> .nf-travel-card:first-child:last-child) {
        grid-auto-columns: min(100%, 620px) !important;
        justify-content: center;
    }
    html body :is(.nf-travel-rail, #home-journeys-track.nf-home-itineraries__grid):has(> .nf-travel-card:nth-child(2):last-child) {
        grid-auto-columns: min(620px, calc((100% - 24px) / 2)) !important;
        column-gap: 24px !important;
        justify-content: center;
    }
}