.gallery-header { background:rgba(3,25,32,.2); }
.site-nav .current { color:var(--aqua); opacity:1; }
.gallery-hero { position:relative; min-height:650px; display:flex; align-items:end; overflow:hidden; padding:170px 7vw 90px; color:white; background:var(--navy); }
.gallery-hero > img, .gallery-hero-overlay { position:absolute; inset:0; width:100%; height:100%; }
.gallery-hero > img { object-fit:cover; object-position:center 52%; }
.gallery-hero-overlay { background:linear-gradient(90deg, rgba(2,24,31,.95), rgba(2,24,31,.68) 45%, rgba(2,24,31,.14)), linear-gradient(0deg, rgba(2,24,31,.34), transparent 45%); }
.gallery-hero-copy { position:relative; z-index:1; max-width:800px; }
.gallery-hero-copy .eyebrow { color:white; }
.gallery-hero-copy p:last-child { max-width:620px; margin:23px 0 0; color:rgba(255,255,255,.78); font-size:18px; }
.gallery-intro { display:grid; grid-template-columns:1fr 1fr; gap:70px; border-bottom:1px solid var(--line); }
.gallery-intro div:last-child { max-width:620px; color:var(--muted); font-size:17px; }
.gallery-intro p:first-child { margin-top:0; }
.gallery-section { padding-top:80px; }
.gallery-toolbar { display:flex; align-items:end; justify-content:space-between; gap:35px; margin-bottom:32px; }
.gallery-toolbar h2 { font-size:clamp(38px, 4vw, 56px); }
.gallery-filters { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.gallery-filter { padding:11px 14px; border:1px solid var(--line); color:var(--muted); background:transparent; cursor:pointer; font:700 11px var(--display); letter-spacing:1px; text-transform:uppercase; }
.gallery-filter.active { color:white; background:var(--deep); border-color:var(--deep); }
.installation-grid { display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-flow:dense; gap:14px; }
.gallery-card { position:relative; min-height:300px; overflow:hidden; color:white; background:#17343c; cursor:zoom-in; }
.gallery-card.featured { grid-column:span 2; }
.gallery-card.tall { grid-row:span 2; min-height:614px; }
.gallery-card img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.gallery-card:hover img, .gallery-card:focus-within img { transform:scale(1.045); }
.gallery-card div { position:absolute; inset:auto 0 0; padding:50px 16px 15px; background:linear-gradient(transparent, rgba(2,23,29,.9)); }
.gallery-card p { margin:0 0 4px; color:var(--aqua); font:700 10px/1 var(--display); letter-spacing:1.4px; text-transform:uppercase; }
.gallery-card h3 { color:white; font-size:18px; letter-spacing:-.02em; }
.gallery-card.hidden { display:none; }
.gallery-quote { display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:end; padding:78px 7vw; color:white; background:var(--navy); }
.gallery-quote p:not(.eyebrow) { margin:0 0 20px; color:rgba(255,255,255,.7); }
.gallery-lightbox { position:fixed; z-index:20; inset:0; display:none; align-items:center; justify-content:center; padding:30px 74px; color:white; background:rgba(2,18,24,.95); }
.gallery-lightbox.open { display:flex; }
.gallery-lightbox figure { width:min(1040px, 80vw); margin:0; }
.gallery-lightbox-image { display:block; width:100%; max-height:76vh; object-fit:contain; border-radius:4px; background:#102b33; box-shadow:0 25px 65px rgba(0,0,0,.38); }
.gallery-lightbox figcaption { display:grid; grid-template-columns:1fr auto; gap:3px 22px; align-items:end; padding:16px 2px 0; }
.gallery-lightbox figcaption p { grid-column:1; margin:0; color:var(--aqua); font:700 11px/1 var(--display); letter-spacing:1.4px; text-transform:uppercase; }
.gallery-lightbox figcaption h2 { grid-column:1; font-size:27px; }
.gallery-lightbox-count { grid-column:2; grid-row:1 / span 2; align-self:end; color:rgba(255,255,255,.62); font:700 12px var(--display); letter-spacing:1px; }
.gallery-lightbox-close, .gallery-lightbox-arrow { position:absolute; border:1px solid rgba(255,255,255,.35); color:white; background:rgba(255,255,255,.05); cursor:pointer; transition:background .2s ease; }
.gallery-lightbox-close:hover, .gallery-lightbox-arrow:hover { background:rgba(255,255,255,.15); }
.gallery-lightbox-close { top:22px; right:22px; width:48px; height:48px; font:300 36px/38px Arial,sans-serif; }
.gallery-lightbox-arrow { top:50%; width:54px; height:72px; margin-top:-36px; font:300 50px/58px Georgia,serif; }
.gallery-lightbox-prev { left:20px; }
.gallery-lightbox-next { right:20px; }
body.gallery-lightbox-active { overflow:hidden; }
@media (max-width:900px) {
  .gallery-hero { min-height:560px; padding:150px 6vw 70px; }
  .gallery-intro, .gallery-quote { grid-template-columns:1fr; gap:28px; }
  .gallery-toolbar { align-items:flex-start; flex-direction:column; }
  .gallery-filters { justify-content:flex-start; }
  .installation-grid { grid-template-columns:repeat(3, 1fr); }
  .gallery-card { min-height:250px; }
  .gallery-card.tall { min-height:514px; }
  .gallery-quote { padding:65px 6vw; }
  .gallery-lightbox { padding:68px 18px 24px; }
  .gallery-lightbox figure { width:min(100%, 760px); }
  .gallery-lightbox-image { max-height:69vh; }
  .gallery-lightbox-arrow { top:auto; bottom:22px; width:49px; height:49px; margin:0; font-size:40px; line-height:38px; }
  .gallery-lightbox-prev { left:18px; }
  .gallery-lightbox-next { right:18px; }
  .gallery-lightbox figcaption { padding:14px 56px 0; text-align:center; }
  .gallery-lightbox figcaption p, .gallery-lightbox figcaption h2 { grid-column:1 / span 2; }
  .gallery-lightbox-count { grid-column:1 / span 2; grid-row:auto; justify-self:center; margin-top:5px; }
}
@media (max-width:620px) {
  .gallery-hero { min-height:530px; }
  .gallery-hero h1 { font-size:58px; }
  .gallery-filters { flex-wrap:nowrap; max-width:100%; overflow:auto; padding-bottom:3px; }
  .gallery-filter { flex:0 0 auto; }
  .installation-grid { grid-template-columns:repeat(2, 1fr); gap:9px; }
  .gallery-card, .gallery-card.tall { min-height:200px; grid-row:span 1; }
  .gallery-card.featured { grid-column:span 2; min-height:245px; }
  .gallery-card h3 { font-size:15px; }
}