/* Field gallery: one full-bleed strip at a common height; each photo keeps its own ratio. */
.gallery{--pad:6vw;--strip-h:clamp(300px,50vh,500px);--gap:14px;--gallery-text:#45596a;margin:0 calc(var(--pad) * -1)}
.projects .section-heading{margin-bottom:38px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.gallery-bar{display:flex;align-items:center;justify-content:space-between;gap:18px 32px;padding:0 var(--pad) 26px}
.gallery-filters{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.gallery-chip{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:9px 13px;border:1px solid #9fb2c1;background:#e2e9ee8c;color:var(--ink);font:600 11px/1 var(--body);white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.gallery-chip small{font-size:10px;font-weight:500;color:var(--gallery-text);font-variant-numeric:tabular-nums}
.gallery-chip:hover{border-color:var(--ink)}
.gallery-chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.gallery-chip[aria-pressed=true] small{color:#b7c7d3}
.gallery-controls{display:flex;align-items:center;gap:6px;flex:none}
.gallery-controls[hidden]{display:none}
.gallery-hint{font-size:10px;color:var(--gallery-text);margin-right:12px}
.gallery-button,.gallery-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid #9fb2c1;color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.gallery-button{font-size:17px}
.gallery-toggle{gap:12px;padding:0 14px;font:600 11px var(--body)}
.gallery-toggle span:last-child{font-size:12px}
.gallery-button:hover,.gallery-toggle:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}

/* Without JavaScript the strip is a native horizontal scroller. */
.gallery-viewport{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#9fb2c1 transparent;padding-bottom:10px}
.gallery-track{display:flex;gap:var(--gap);width:max-content;margin:0;padding:0 var(--pad);list-style:none}
.shot{flex:none;width:calc(var(--strip-h) * var(--ratio));margin:0}
.shot-link{display:block;height:var(--strip-h);overflow:hidden;background:#c3d2dd}
/* Photos are shown in their true colours: no filters on the images. */
.shot-link img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.shot-link:hover img{transform:scale(1.02)}
.shot-link:focus-visible{outline-offset:3px}
.shot-caption{margin:12px 0 0;padding-right:6px;line-height:1.2}
.shot-people{font:600 17px/1.1 var(--heading);letter-spacing:-.01em}

/* Enhanced: transform-driven loop; vertical gestures stay with the page. */
.is-enhanced .gallery-viewport{overflow:hidden;overflow-x:clip;overflow-y:visible;padding:4px 0 0;touch-action:pan-y;cursor:grab}
.is-enhanced .gallery-track{padding:0;will-change:transform;-webkit-user-select:none;user-select:none}
.is-enhanced .shot-link{cursor:zoom-in;-webkit-user-drag:none}
.is-enhanced.is-static .gallery-viewport{cursor:auto}
.is-enhanced.is-static .gallery-track{margin:0 auto;padding:0 var(--pad);will-change:auto}
.is-enhanced.is-static [data-gallery-prev],.is-enhanced.is-static [data-gallery-next],.is-enhanced.is-static .gallery-toggle,.is-enhanced.is-static .gallery-hint{visibility:hidden}
.is-dragging .gallery-viewport,.is-dragging .shot-link{cursor:grabbing}
.is-dragging .shot-link img{transform:none}

/* Photo viewer */
#lightbox.gallery-lightbox{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;overflow:hidden;background:#141c23;color:#e6edf2;line-height:1.5}
#lightbox.gallery-lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
#lightbox.gallery-lightbox::backdrop{background:#141c23}
.lightbox-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(12px,3vw,32px)}
.lightbox-count{margin:0;font:500 12px var(--body);letter-spacing:.04em;color:#a9bac7;font-variant-numeric:tabular-nums}
#lightbox .dialog-close{position:static;min-height:44px;padding:10px 16px;border:1px solid #ffffff38;background:transparent;color:#e6edf2;font-size:11px}
#lightbox .dialog-close:hover{background:#e6edf2;color:#141c23}
.lightbox-stage{position:relative;display:grid;place-items:center;min-height:0;padding:0 clamp(12px,7vw,110px);touch-action:pan-y}
.lightbox-stage img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;max-height:calc(100svh - 190px);object-fit:contain;-webkit-user-select:none;user-select:none}
.lightbox-nav{position:absolute;top:50%;translate:0 -50%;display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff38;background:#141c23b8;color:#e6edf2;font-size:18px}
.lightbox-nav:hover{background:#e6edf2;color:#141c23}
.lightbox-prev{left:clamp(8px,2vw,28px)}
.lightbox-next{right:clamp(8px,2vw,28px)}
.lightbox-caption{display:grid;gap:4px;padding:14px clamp(12px,7vw,110px) 22px}
.lightbox-caption p{margin:0}
.lightbox-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px}
.lightbox-heading strong{font:600 24px/1.15 var(--heading);letter-spacing:-.015em}
#lightbox-people{font-size:13px;color:#a9bac7}

@media(max-width:900px){.gallery{--pad:5vw;--strip-h:clamp(280px,46vh,420px)}.gallery-hint{display:none}}
@media(max-width:600px){
 .gallery{--strip-h:clamp(240px,78vw,330px);--gap:10px}
 .projects .section-heading{margin-bottom:24px}
 .gallery-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:0 var(--pad) 18px 0}
 .gallery-filters{flex-wrap:nowrap;overflow-x:auto;padding:2px 4px 2px var(--pad);scrollbar-width:none;mask-image:linear-gradient(90deg,#000 88%,transparent)}
 .gallery-filters::-webkit-scrollbar{display:none}
 .gallery-button,.gallery-toggle span:first-child{display:none}
 .gallery-toggle{padding:0;width:44px}
 .shot-people{font-size:15px}
 .lightbox-stage{padding:0}
 .lightbox-stage img{max-height:calc(100svh - 210px)}
 .lightbox-nav{top:auto;bottom:10px;translate:none;width:44px;height:44px}
 .lightbox-heading strong{font-size:22px}
}
@media(prefers-reduced-motion:reduce){.shot-link:hover img{transform:none}}
