/* Preserve every frame and the real ink colours across the entire portfolio. */
.gallery .work .photo img,
.motion-active .gallery .work .photo img,
.gallery .work .photo:hover img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;filter:brightness(var(--media-light,1));transform:none;transition:filter .55s ease}
.gallery .work .photo{transition:transform .55s cubic-bezier(.2,.6,.2,1);transform-origin:center}
@media(hover:hover) and (pointer:fine){
 .gallery .work .photo img,.motion-active .gallery .work .photo img{filter:grayscale(1) brightness(var(--media-light,1))}
 .gallery .work .photo:hover img,.motion-active .gallery .work .photo:hover img,
 .gallery .work .photo:focus-visible img,.motion-active .gallery .work .photo:focus-visible img{filter:grayscale(0) brightness(var(--media-light,1))}
 .gallery .work .photo:hover,.gallery .work .photo:focus-visible{transform:translateY(-5px) scale(1.025)}
}
@media(prefers-reduced-motion:reduce){.gallery .work .photo,.gallery .work .photo img{transition:none!important}.gallery .work .photo:hover,.gallery .work .photo:focus-visible{transform:none}}
.gallery{align-items:start}
.about-art img{aspect-ratio:auto!important;height:auto;object-fit:contain;transform:none!important}
/* Match the brighter studio light of this clip to the surrounding portfolio. */
.gallery .work .photo img[src*="20260418_203554"],
.motion-active .gallery .work .photo img[src*="20260418_203554"],
#large-image[src*="20260418_203554"],#large-video[poster*="20260418_203554"]{--media-light:.88}
.clip-badge{position:absolute;left:10px;bottom:12px;background:#111d;border:1px solid #ffffff50;color:#fff;padding:5px 9px;font-size:11px;letter-spacing:.02em;line-height:1.4}
.photo .zoom{opacity:1}
#lightbox{width:min(860px,95vw);max-height:94svh;padding:0;overflow:auto}
#lightbox .close{z-index:3}
#large-image,#large-video{display:block;width:100%;height:auto;max-height:72svh;object-fit:contain;background:#101010;filter:brightness(var(--media-light,1))}
.media-switch{display:flex;justify-content:center;gap:10px;padding:15px 62px 15px 15px}
.media-switch button{background:transparent;border:1px solid #777;color:#eee;padding:7px 16px;border-radius:24px}
.media-switch button[aria-pressed=true]{background:#eceee6;color:#101010;border-color:#eceee6}
.lightbox-caption{align-items:center}
@media(max-width:600px){#large-image,#large-video{max-height:69svh}.lightbox-caption{padding:14px 18px}.clip-badge{font-size:10px;left:6px;bottom:8px;padding:4px 6px}.photo .zoom{right:6px;bottom:8px;width:25px;height:25px}}
/* Interaction layer: transform the complete frame, never crop the artwork. */
.gallery .work .photo,.motion-active .gallery .work .photo{overflow:visible;clip-path:none!important;transition:transform .65s cubic-bezier(.2,.7,.2,1),opacity .65s ease!important;transform:translateY(var(--entry-y,0px)) scale(var(--entry-scale,1));opacity:var(--entry-opacity,1)!important}
.gallery .work .photo img,.motion-active .gallery .work .photo img{height:auto;aspect-ratio:auto;object-fit:contain;transform:none;transition:filter .65s ease!important}
@media(any-hover:hover) and (any-pointer:fine){
 .gallery .work .photo img,.motion-active .gallery .work .photo img{filter:grayscale(1) brightness(var(--media-light,1))}
 .gallery .work .photo:hover img,.motion-active .gallery .work .photo:hover img{filter:grayscale(0) brightness(var(--media-light,1))}
 .gallery .work .photo:hover,.motion-active .gallery .work .photo:hover{transform:translateY(-8px) scale(1.025);opacity:1!important}
}
.mouse-input .gallery .work .photo img{filter:grayscale(1) brightness(var(--media-light,1))}
.mouse-input .gallery .work .photo.is-hovered img,.gallery .work .photo:focus-visible img,.motion-active .gallery .work .photo:focus-visible img{filter:grayscale(0) brightness(var(--media-light,1))}
.mouse-input .gallery .work .photo.is-hovered,.gallery .work .photo:focus-visible{transform:translateY(-8px) scale(1.025);opacity:1!important}
.gallery .work:has(.photo:hover),.gallery .work:focus-within{z-index:20!important}
.scroll-reveal{opacity:0;translate:0 36px;transition:opacity .8s ease,translate .9s cubic-bezier(.2,.7,.2,1)}
.scroll-reveal.is-visible{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){
 .gallery .work .photo,.motion-active .gallery .work .photo{transform:none!important;opacity:1!important;transition:none!important}
 .gallery .work .photo img{transition:none!important}
 .scroll-reveal{opacity:1;translate:none;transition:none}
}