body { background:#f5f7f8; }
.gallery-hero { background:linear-gradient(120deg,#071525,#0e2b47); color:#fff; padding:clamp(3.5rem,8vw,6rem) 1.5rem 3.5rem; }
.gallery-hero-inner,.gallery-main,.gallery-footer-inner { max-width:1180px; margin:auto; }
.gallery-hero h1 { margin:.7rem 0 1rem; font-size:clamp(2.5rem,6vw,4.8rem); letter-spacing:-.05em; line-height:1; }
.gallery-hero p { margin:0; max-width:650px; color:rgba(255,255,255,.75); font-size:1.08rem; }
.gallery-main { padding:2rem 1.5rem 5rem; }
.filters { display:flex; flex-wrap:wrap; gap:.55rem; margin-bottom:1.8rem; }
.filter { border:1px solid #cbd5dd; border-radius:999px; background:#fff; color:#193048; padding:.55rem .9rem; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; }
.filter.active,.filter:hover,.filter:focus-visible { background:#e8783b; border-color:#e8783b; color:#fff; }
.gallery-masonry { columns:4 240px; column-gap:1rem; }
.gallery-card { break-inside:avoid; display:block; width:100%; margin:0 0 1rem; background:#fff; border:1px solid #dbe2e8; padding:0; cursor:zoom-in; text-align:left; transition:transform .2s,box-shadow .2s; }
.gallery-card:hover,.gallery-card:focus-visible { transform:translateY(-3px); box-shadow:0 12px 28px rgba(7,21,37,.14); }
.gallery-card img { width:100%; height:auto; display:block; aspect-ratio:auto; }
.gallery-card figcaption { padding:.75rem .85rem .9rem; color:#193048; font-size:.75rem; font-weight:700; }
.gallery-card[hidden] { display:none; }
.gallery-count { margin:0 0 1.4rem; color:#637386; font-size:.8rem; }
.lightbox { position:fixed; inset:0; z-index:20; display:none; place-items:center; padding:4rem 1.2rem 1.2rem; background:rgba(2,11,20,.94); }
.lightbox.open { display:grid; }
.lightbox img { max-width:min(1200px,94vw); max-height:80vh; object-fit:contain; }
.lightbox-caption { color:#fff; text-align:center; margin-top:.8rem; font-weight:700; }
.lightbox-close,.lightbox-nav { position:absolute; border:1px solid rgba(255,255,255,.35); background:rgba(7,21,37,.75); color:#fff; cursor:pointer; }
.lightbox-close { top:1rem; right:1rem; border-radius:50%; width:42px; height:42px; font-size:1.6rem; }
.lightbox-nav { top:50%; transform:translateY(-50%); width:44px; height:56px; font-size:1.6rem; }
.lightbox-prev { left:1rem; } .lightbox-next { right:1rem; }
.gallery-footer { background:#04101d; color:rgba(255,255,255,.68); padding:1.5rem; font-size:.78rem; }
.gallery-footer-inner { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.gallery-footer a { color:#fff; text-decoration:none; }
@media(max-width:700px) { .gallery-masonry { columns:2 150px; column-gap:.65rem; } .gallery-card { margin-bottom:.65rem; } .gallery-card figcaption { font-size:.68rem; padding:.6rem; } .lightbox-nav { width:38px; } .lightbox-prev { left:.4rem; } .lightbox-next { right:.4rem; } }