/* =========================================================
   GALLERY — editorial photography experience
   ========================================================= */

.gallery_hero {
    padding: calc(var(--header-h) + clamp(3rem, 7vw, 6rem)) 0 clamp(3rem, 5vw, 4.5rem);
}

.gallery_hero_grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    align-items: end;
    gap: 2rem clamp(2rem, 6vw, 6rem);
    padding-bottom: clamp(2rem, 4vw, 3rem);
    border-bottom: 1px solid var(--line);
}

.gallery_hero h1 {
    margin-top: 1.5rem;
    font-size: var(--fs-display);
    font-weight: 300;
    line-height: .98;
    letter-spacing: -.02em;
}

.gallery_hero .lead {
    margin-bottom: 1.25rem;
}

.gallery_hint {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--sage-ink);
}

.gallery_grid_section {
    padding-bottom: var(--section);
}

.masonry {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: clamp(150px, 19vw, 290px);
    grid-auto-flow: dense;
    gap: clamp(.75rem, 1.4vw, 1.25rem);
}

.gallery_item {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: var(--radius);
    background: var(--sand-soft);
    cursor: zoom-in;
    grid-column: span 4;
}

.gallery_item img {
    position: absolute;
    inset: 0;
    height: 100%;
    object-fit: cover;
    transition: transform 1.8s var(--ease-out), filter 1.2s var(--ease) !important;
}

.gallery_item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(28, 46, 37, .45));
    opacity: 0;
    transition: opacity 1s var(--ease);
}

.gallery_item:hover img,
.gallery_item:focus-visible img {
    transform: scale(1.06) !important;
    filter: saturate(1.06);
}

.gallery_item:hover::after,
.gallery_item:focus-visible::after {
    opacity: 1;
}

.gallery_index {
    position: absolute;
    left: 1.1rem;
    bottom: .9rem;
    z-index: 2;
    font-family: var(--font-serif);
    font-size: 1.15rem;
    font-style: italic;
    color: var(--ivory);
    opacity: 0;
    transform: translateY(8px);
    transition: opacity var(--t) var(--ease), transform var(--t) var(--ease);
}

.gallery_item:hover .gallery_index,
.gallery_item:focus-visible .gallery_index {
    opacity: 1;
    transform: none;
}

/* Editorial rhythm — mirrored every six images */
.gallery_item:nth-child(12n+1) { grid-column: 1 / span 7; grid-row: span 2; border-radius: var(--radius-arch); }
.gallery_item:nth-child(12n+2),
.gallery_item:nth-child(12n+3) { grid-column: 8 / span 5; }
.gallery_item:nth-child(12n+7) { grid-column: 6 / span 7; grid-row: span 2; }
.gallery_item:nth-child(12n+8),
.gallery_item:nth-child(12n+9) { grid-column: 1 / span 5; }
.gallery_item:last-child:nth-child(6n+4) { grid-column: 1 / -1; }

/* Closing invitation */
.gallery_cta {
    padding: var(--section-sm) var(--gutter) var(--section);
    text-align: center;
}

.gallery_cta h2 {
    margin: 1.25rem 0 1rem;
}

.gallery_cta p {
    color: var(--text-muted);
}

.gallery_cta .buttons_box {
    justify-content: center;
    margin-top: 2.25rem;
}

@media (max-width: 900px) {
    .gallery_hero_grid {
        grid-template-columns: 1fr;
    }

    .masonry {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 44vw;
    }

    .gallery_item,
    .gallery_item:nth-child(n) {
        grid-column: span 1;
        grid-row: span 1;
        border-radius: var(--radius);
    }

    .gallery_item:nth-child(5n+1) {
        grid-column: 1 / -1;
        grid-row: span 1;
    }

    .gallery_item:nth-child(10n+1) {
        border-radius: var(--radius-arch);
        grid-row: span 2;
    }
}