.gallery-section{
    background:#111;
    color:#fff;
    padding:170px 0;
}

.gallery-title{
    width:min(88%,1180px);
    margin:0 auto 110px;
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
    gap:clamp(55px,8vw,120px);
    align-items:center;
}

.gallery-title h2{
    max-width:850px;
    font-size:clamp(58px,7vw,116px);
    line-height:.95;
    letter-spacing:-.055em;
}

.gallery-title p{
    max-width:660px;
    margin-top:30px;
    color:rgba(255,255,255,.62);
    font-size:18px;
    line-height:1.8;
}

.gallery-title__visual{
    position:relative;
    margin:0;
}

.gallery-title__visual::before{
    content:"";
    position:absolute;
    inset:-14px 14px 14px -14px;
    border:1px solid rgba(203,168,103,.48);
    pointer-events:none;
}

.gallery-title__visual picture,
.gallery-title__visual img{
    display:block;
    width:100%;
}

.gallery-title__visual img{
    height:auto;
    aspect-ratio:3 / 4;
    object-fit:cover;
}

.gallery-title__visual figcaption{
    position:absolute;
    right:-32px;
    bottom:-34px;
    width:min(82%,280px);
    padding:16px 18px;
    background:#f5f1e8;
    color:#111;
    font-family:var(--font-title);
    font-size:18px;
    line-height:1.15;
}

.gallery-masonry{
    width:min(92%,1320px);
    margin:auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    grid-auto-rows:260px;
    gap:18px;
}

.gallery-card{
    position:relative;
    min-width:0;
    overflow:hidden;
    background:#202020;
}

.gallery-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.92;
    transition:transform 1s ease, opacity .4s ease;
}

.gallery-card picture{
    display:block;
    width:100%;
    height:100%;
}

.gallery-card::after{
    content:"";
    position:absolute;
    inset:35% 0 0;
    background:linear-gradient(180deg,transparent,rgba(0,0,0,.82));
    pointer-events:none;
}

.gallery-card:hover img{
    transform:scale(1.03);
    opacity:1;
}

.gallery-card-tall{
    grid-row:span 2;
}

.gallery-card-wide{
    grid-column:span 2;
}

.gallery-card-featured{
    grid-column:span 2;
    grid-row:span 2;
}

.gallery-card figcaption{
    position:absolute;
    z-index:2;
    left:24px;
    right:24px;
    bottom:22px;
}

.gallery-card figcaption span,
.gallery-card figcaption strong{display:block;}

.gallery-card figcaption span{
    margin-bottom:7px;
    color:var(--color-gold-light);
    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.gallery-card figcaption strong{
    max-width:420px;
    font-family:var(--font-title);
    font-size:clamp(20px,2vw,30px);
    font-weight:400;
    line-height:1.08;
}

.gallery-credits{
    width:min(92%,1320px);
    margin:24px auto 0;
    color:rgba(255,255,255,.4);
    font-size:11px;
    line-height:1.7;
}

.gallery-credits a{text-decoration:underline;text-underline-offset:3px;}
.gallery-credits a:hover{color:var(--color-gold-light);}

@media(max-width:900px){
    .gallery-title{
        grid-template-columns:minmax(0,1fr) minmax(230px,.55fr);
        gap:42px;
    }

    .gallery-masonry{grid-template-columns:repeat(2,1fr);grid-auto-rows:240px;}
    .gallery-card-featured{grid-row:span 2;}
}

@media(max-width:640px){
    .gallery-section{padding:110px 0;}
    .gallery-title{
        width:84%;
        margin-bottom:70px;
        grid-template-columns:1fr;
        gap:50px;
    }
    .gallery-title__visual{width:88%;margin-left:auto;}
    .gallery-title__visual::before{inset:-10px 10px 10px -10px;}
    .gallery-title__visual figcaption{right:-16px;bottom:-28px;font-size:16px;}
    .gallery-masonry{width:88%;grid-template-columns:1fr;grid-auto-rows:320px;gap:12px;}
    .gallery-card-featured,.gallery-card-tall,.gallery-card-wide{grid-column:auto;grid-row:auto;}
    .gallery-card:nth-child(1),.gallery-card:nth-child(3){min-height:430px;}
}