/* ===== Gallery page ===== */
body{
                font-family: var(--serif, "Poppins", system-ui, Arial, sans-serif);

}

.gal{padding:clamp(40px,5vw,72px) 0 clamp(56px,7vw,96px)}
.gal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap;margin-bottom:34px}
.gal-head>p{max-width:520px;color:#3c4a54;font-size:.95rem}
.gal-filters{display:flex;flex-wrap:wrap;gap:10px}
.gchip{font-weight:500;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;padding:11px 18px;border:1px solid #d5dce1;background:#fff;color:#1d2a33;cursor:pointer;border-radius:4px;transition:.25s;display:inline-flex;gap:8px;align-items:center}
.gchip span{font-size:.68rem;opacity:.6;letter-spacing:0}
.gchip:hover{border-color:#1d2a33}
.gchip.on{background:#d5020d;border-color:#d5020d;color:#fff}
.gchip.on span{opacity:.85}
.gchip:focus-visible,.g-btn:focus-visible,.lb button:focus-visible{outline:2px solid #d5020d;outline-offset:3px}

/* masonry */
.gal-grid{columns:3 300px;column-gap:16px}
.g-item{break-inside:avoid;margin:0 0 16px;display:block;position:relative}
.g-item[hidden]{display:none}
.g-item.in{animation:gIn .5s ease both}
@keyframes gIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.g-btn{position:relative;display:block;width:100%;padding:0;border:0;background:#1d2a33;cursor:zoom-in;overflow:hidden;border-radius:4px;line-height:0}
.g-btn img{display:block;width:100%;height:auto;transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s}
.g-btn:hover img,.g-btn:focus-visible img{transform:scale(1.06)}
.g-btn::before{content:"";position:absolute;inset:0;z-index:1;background: linear-gradient(0deg, rgb(15 23 29) 0%, rgb(15 23 29 / 39%) 48%, transparent 70%);opacity:0;transition:opacity .4s}
.g-btn::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:#d5020d;z-index:3;transition:width .5s cubic-bezier(.2,.7,.2,1)}
.g-btn:hover::before,.g-btn:focus-visible::before{opacity:1}
.g-btn:hover::after,.g-btn:focus-visible::after{width:100%}
.g-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px 18px 18px;text-align:left;line-height:1.35;color:#fff;transform:translateY(12px);opacity:0;transition:.4s}
.g-cap small{display:block;font-size:.69rem;letter-spacing:.2em;text-transform:uppercase;color:#e4e4e4;margin-bottom: 8px;font-weight:600}
.g-cap b{display:block;font-size:.98rem;font-weight:500}
.g-btn:hover .g-cap,.g-btn:focus-visible .g-cap{opacity:1;transform:none}
.g-zoom{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;transform:scale(.6);opacity:0;transition:.35s}
.g-zoom svg{width:18px;height:18px;fill:none;stroke:#d5020d;stroke-width:2.2;stroke-linecap:round}
.g-btn:hover .g-zoom,.g-btn:focus-visible .g-zoom{opacity:1;transform:none}
@media(hover:none){.g-btn::before{opacity:1;background:linear-gradient(0deg,rgba(15,23,29,.78) 0%,transparent 45%)}.g-cap{opacity:1;transform:none;padding:12px 14px 13px}.g-cap b{font-size:.88rem}.g-zoom{display:none}}
.gal-empty{padding:40px 0;text-align:center;color:#3c4a54}
@media(max-width:640px){.gal-grid{columns:1}.gal-head{margin-bottom:24px}.gchip{padding:10px 14px;font-size:.7rem}}
@media(min-width:641px) and (max-width:900px){.gal-grid{columns:2}}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;display:grid;grid-template-columns:64px 1fr 64px;align-items:center;background:rgba(10,16,21,.94);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s}
.lb[hidden]{display:none}
.lb.open{opacity:1}
.lb-fig{margin:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 0 24px;height:100%}
.lb-fig img{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;border-radius:4px;box-shadow:0 30px 70px -20px rgba(0,0,0,.7);transition:opacity .25s}
.lb-fig img.ld{opacity:.25}
.lb-fig figcaption{margin-top:16px;color:#fff;text-align:center;display:flex;flex-direction:column;gap:2px;align-items:center;}
.lb-fig figcaption span{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:#ff7b83}
.lb-fig figcaption b{font-size:1rem;font-weight:500}
.lb-fig figcaption em{font-style:normal;font-size:.76rem;color:#aebbc4}
.lb-x{position:absolute;top:14px;right:18px;z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;transition:.25s}
.lb-x:hover{background:#d5020d;border-color:#d5020d}
.lb-n{justify-self:center;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.06);cursor:pointer;display:grid;place-items:center;transition:.25s}
.lb-n svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lb-n:hover{background:#d5020d;border-color:#d5020d}
body.lb-open{overflow:hidden}
@media(max-width:640px){.lb{grid-template-columns:1fr}.lb-n{position:absolute;bottom:20px;z-index:2}.lb-prev{left:22px}.lb-next{right:22px}.lb-fig{padding:64px 12px 84px}.lb-fig img{max-height:calc(100vh - 220px)}}
@media(prefers-reduced-motion:reduce){.g-item.in{animation:none}.g-btn img,.g-cap,.lb{transition:none}}

/* hover title + pop-up controls must use the site font (buttons do not inherit it by default) */
/* .g-btn,.g-cap,.g-cap small,.g-cap b,.lb button,.gchip{} */