.gallery-section{padding:32px 0;background:#fff}
.gallery-intro{padding:64px 0 48px;background:#fff;text-align:center}
.gallery-intro h2{margin-bottom:14px}
.gallery-intro p{max-width:70ch;margin:0 auto}
.project-header{margin-bottom:20px}
.project-title{font-family:var(--serif);font-size:clamp(20px,2vw,28px);font-weight:500;color:rgba(15,23,42,.88);margin:0 0 4px}
.project-date{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:rgba(15,23,42,.5)}
.gallery-grid{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(7,1fr);gap:13px;aspect-ratio:8/7}
.gallery-item{background:#d1d5db;overflow:hidden;position:relative;cursor:pointer}
.gallery-item::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,0);transition:background .3s ease;pointer-events:none}
.gallery-item:hover::after{background:rgba(255,255,255,.12)}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-grid .gallery-item:nth-child(1){grid-column:1/5;grid-row:1/4}
.gallery-grid .gallery-item:nth-child(2){grid-column:5/9;grid-row:1/4}
.gallery-grid .gallery-item:nth-child(3){grid-column:1/3;grid-row:4/6}
.gallery-grid .gallery-item:nth-child(4){grid-column:3/6;grid-row:4/8}
.gallery-grid .gallery-item:nth-child(5){grid-column:6/9;grid-row:4/8}
.gallery-grid .gallery-item:nth-child(6){grid-column:1/3;grid-row:6/8}
.gallery-grid-mirrored .gallery-item:nth-child(1){grid-column:1/5;grid-row:1/4}
.gallery-grid-mirrored .gallery-item:nth-child(2){grid-column:5/9;grid-row:1/4}
.gallery-grid-mirrored .gallery-item:nth-child(3){grid-column:7/9;grid-row:4/6}
.gallery-grid-mirrored .gallery-item:nth-child(4){grid-column:1/4;grid-row:4/8}
.gallery-grid-mirrored .gallery-item:nth-child(5){grid-column:4/7;grid-row:4/8}
.gallery-grid-mirrored .gallery-item:nth-child(6){grid-column:7/9;grid-row:6/8}
.gallery-placeholder{display:grid;place-items:center;text-align:center;padding:22px;color:rgba(15,23,42,.45);font-size:11px;letter-spacing:.08em;text-transform:uppercase;height:100%}
.gallery-cta{text-align:center;padding:72px 0 96px;background:#fff}
.gallery-cta h3{margin-bottom:18px}
.gallery-cta p{max-width:60ch;margin:0 auto 28px}
.gallery-cta .btn{margin:0 6px}
@media(max-width:768px){
  .gallery-grid,.gallery-grid-mirrored{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(10,1fr);aspect-ratio:4/10}
  .gallery-grid .gallery-item:nth-child(1),.gallery-grid-mirrored .gallery-item:nth-child(1){grid-column:1/5;grid-row:1/4}
  .gallery-grid .gallery-item:nth-child(2),.gallery-grid-mirrored .gallery-item:nth-child(2){grid-column:1/5;grid-row:4/7}
  .gallery-grid .gallery-item:nth-child(3),.gallery-grid-mirrored .gallery-item:nth-child(3){grid-column:1/3;grid-row:7/9}
  .gallery-grid .gallery-item:nth-child(4),.gallery-grid-mirrored .gallery-item:nth-child(4){grid-column:3/5;grid-row:7/9}
  .gallery-grid .gallery-item:nth-child(5),.gallery-grid-mirrored .gallery-item:nth-child(5){grid-column:1/3;grid-row:9/11}
  .gallery-grid .gallery-item:nth-child(6),.gallery-grid-mirrored .gallery-item:nth-child(6){grid-column:3/5;grid-row:9/11}
}
@media(max-width:480px){
  .gallery-grid,.gallery-grid-mirrored{display:flex;flex-direction:column;aspect-ratio:auto}
  .gallery-grid .gallery-item,.gallery-grid-mirrored .gallery-item{aspect-ratio:auto}
  .gallery-grid .gallery-item img,.gallery-grid-mirrored .gallery-item img{height:auto;object-fit:initial}
}
.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.95);display:block;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s .3s}
.lightbox.open{opacity:1;visibility:visible;transition:opacity .3s ease,visibility 0s 0s}
.lightbox-backdrop{position:absolute;inset:0;z-index:0}
.lightbox-close{position:absolute;top:24px;right:24px;width:48px;height:48px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:background .2s ease;z-index:20}
.lightbox-close:hover{background:rgba(255,255,255,.2)}
.lightbox-close svg{width:24px;height:24px;stroke:#fff;stroke-width:2;pointer-events:none}
.lightbox-track{position:absolute;top:0;left:0;display:flex;flex-wrap:nowrap;transition:transform .3s ease;height:100%;touch-action:pan-y pinch-zoom;z-index:5}
.lightbox-slide{width:100vw;flex:0 0 100vw;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 24px;box-sizing:border-box}
.lightbox-slide img{max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:background .2s ease;z-index:20}
.lightbox-nav:hover{background:rgba(255,255,255,.2)}
.lightbox-nav svg{width:24px;height:24px;stroke:#fff;stroke-width:2;pointer-events:none}
.lightbox-prev{left:24px}
.lightbox-next{right:24px}
.lightbox-counter{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:14px;letter-spacing:.1em;z-index:20;pointer-events:none}
@media(max-width:768px){.lightbox-nav{display:none}.lightbox-close{top:16px;right:16px;width:40px;height:40px}}