/* Gallery, design system v2 (board 09): uninterrupted photography, one caption row, silver only. The gallery never uses the
   accent colour and never carries grain or any layer on the photographs. */
.gallery-body { min-height:100dvh; background:var(--bg); }
.gallery-main { position:relative; z-index:1; }
.gallery-viewer { width:min(var(--section-w),calc(100% - var(--section-x)*2)); margin:auto; padding:132px 0 20px; }
.gallery-intro { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:32px; margin-bottom:24px; }
.gallery-intro h1 { grid-column:1 / -1; margin:0; font-size:36px; line-height:1.2; font-weight:500; letter-spacing:-.035em; }
.gallery-lead { grid-column:1; max-width:640px; margin:14px 0 0; font-size:var(--fs-small); line-height:1.85; color:var(--text-2); }
.gallery-hdr-note { grid-column:2; display:inline-flex; align-items:center; gap:10px; max-width:520px; margin:0; padding:7px 16px 7px 12px; border:1px solid var(--line-2); border-radius:var(--radius-button); font-size:var(--fs-note); line-height:1.6; color:var(--text-3); }
.gallery-hdr-note svg { flex:0 0 32px; width:32px; height:16px; color:var(--text-1); }
.visual-stage { margin:0; touch-action:pan-y; }
.product-image { display:block; width:100%; height:clamp(360px,calc(100dvh - 360px),820px); object-fit:contain; object-position:center; background:var(--n-0); user-select:none; pointer-events:none; transition:opacity var(--dur-panel) var(--ease-reveal), transform var(--dur-panel) var(--ease-reveal); }
.visual-stage.is-changing .product-image { opacity:0; transition-duration:var(--dur-hover); transition-timing-function:var(--ease-exit); }
.gallery-details { display:flex; align-items:center; justify-content:space-between; gap:32px; margin-top:24px; }
.caption-copy { min-width:0; }
.caption-copy div { display:grid; gap:6px; }
.caption-copy strong { font-size:var(--fs-compact); line-height:1.5; font-weight:500; color:var(--text-1); }
.caption-copy [data-caption-label] { color:var(--text-2); font-size:var(--fs-note); line-height:1.6; }
.caption-exif { display:flex; flex-wrap:wrap; margin:2px 0 0; font-family:var(--font-mono); font-size:var(--fs-label); line-height:1.6; color:var(--text-3); }
.caption-exif:empty { display:none; }
.caption-exif > span + span { margin-left:12px; padding-left:12px; border-left:1px solid var(--line-2); }
.gallery-navigation { display:flex; align-items:center; gap:28px; flex:none; }
.gallery-count { display:flex; align-items:baseline; gap:8px; color:var(--text-3); font-family:var(--font-mono); font-size:var(--fs-note); font-variant-numeric:tabular-nums; }
.gallery-count strong { color:var(--text-1); font-family:var(--font-pixel); font-size:56px; font-weight:400; font-synthesis:none; letter-spacing:-.02em; line-height:1; }
.gallery-arrows { display:flex; gap:10px; }
.gallery-arrows button { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line-2); border-radius:50%; background:var(--n-3); color:var(--text-1); cursor:pointer; transition:background var(--dur-hover) var(--ease-settle), border-color var(--dur-hover) var(--ease-settle), transform var(--dur-press) var(--ease-settle); }
.gallery-arrows button:hover { background:var(--n-4); border-color:var(--line-3); }
.gallery-arrows button:active { transform:scale(.98); }
.gallery-arrows button:focus-visible { outline:2px solid var(--focus-ring); outline-offset:4px; }
@media(max-width:820px) {
 .gallery-viewer { padding-top:124px; padding-bottom:16px; }
 .gallery-intro { grid-template-columns:1fr; margin-bottom:28px; }
 .gallery-intro h1 { font-size:32px; }
 .gallery-lead { margin-top:16px; max-width:420px; }
 .gallery-hdr-note { grid-column:1; justify-self:start; margin-top:14px; }
 .product-image { height:clamp(300px,calc(100svh - 340px),560px); }
 .gallery-details { align-items:flex-start; gap:24px; }
 .gallery-navigation { gap:16px; }
 .gallery-count strong { font-size:40px; }
}
@media(max-width:520px) {
 .product-image { height:clamp(240px,calc(100svh - 490px),400px); }
 .gallery-details { flex-wrap:wrap; margin-top:24px; }
 .caption-exif { column-gap:14px; }
 .caption-exif > span + span { margin-left:0; padding-left:0; border-left:0; }
 .visual-caption { width:100%; }
 .gallery-navigation { width:100%; justify-content:space-between; }
}
@media(prefers-reduced-motion:reduce) { .product-image, .visual-stage.is-changing .product-image { transition:none; } .gallery-arrows button:active { transform:none; } }

/* Caption and counter settle in after a photograph change (gallery.js replays .is-settling) */
@keyframes caption-settle { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@keyframes count-settle { from { opacity:.2; transform:translateY(-.18em); } to { opacity:1; transform:none; } }
.caption-copy > div.is-settling { animation:caption-settle 560ms var(--ease-reveal) both; }
.gallery-count strong.is-settling { animation:count-settle 560ms var(--ease-reveal) both; }
