/* ========================================
   SECTION « GALERIE »
   ======================================== */
.gallery-section {
    background-color: var(--color-background-cream);
    padding: var(--space-5xl) 0 0;
}

/* Largeur naturelle = somme des largeurs (1423px) + 3 gouttières de 14px = 1465px.
   À cette largeur, chaque image fait exactement les dimensions demandées ;
   en dessous, tout se réduit proportionnellement. */
.gallery-wrap {
    width: min(1465px, 92%);
    margin: 0 auto;
}

.gallery-row {
    display: flex;
    gap: 14px;
}

/* Rangée du haut : alignée par le bas des images */
.gallery-row--top {
    align-items: flex-end;
    margin-bottom: 14px;
}

/* Rangée du bas : recouverte d'un dégradé crème (les images disparaissent dans le fond) */
.gallery-row--bottom {
    position: relative;
    align-items: flex-start;
}

.gallery-row--bottom::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(247, 232, 220, 0.00) 0%, rgba(244, 239, 233, 0.78) 37.98%, #F4EFE9 64.42%);
    pointer-events: none;
}

.gallery-img {
    display: block;
    min-width: 0;
    min-height: 0;
    flex-basis: 0;
    flex-shrink: 1;
    object-fit: cover;
}

/* flex-grow proportionnel à la largeur + aspect-ratio pour la hauteur exacte */
.g1 { flex-grow: 335; aspect-ratio: 335 / 410; }
.g2 { flex-grow: 494; aspect-ratio: 494 / 410; }
.g3 { flex-grow: 297; aspect-ratio: 297 / 455; }
.g4 { flex-grow: 297; aspect-ratio: 297 / 314; }
.g5 { flex-grow: 297; aspect-ratio: 297 / 455; }
.g6 { flex-grow: 297; aspect-ratio: 297 / 314; }
.g7 { flex-grow: 494; aspect-ratio: 494 / 410; }
.g8 { flex-grow: 335; aspect-ratio: 335 / 410; }

/* ── Responsive : sous 900px, 2 colonnes uniformes ── */
@media (max-width: 900px) {
    .gallery-row {
        flex-wrap: wrap;
    }

    .gallery-row--top {
        align-items: stretch;
    }

    .gallery-img {
        flex: 1 1 calc(50% - 7px);
        aspect-ratio: 4 / 3;
    }

    .gallery-row--bottom::after {
        background: linear-gradient(to bottom, rgba(244, 239, 233, 0) 30%, var(--color-background-cream));
    }
}