.gallery-section { max-width:1600px; margin:0 auto }
.gallery-section .s-title { font:400 36px/1.3 var(--F-display); letter-spacing:inherit; margin-left:12px }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px 56px; padding-right:36px }
.gallery-photo { min-width:0; margin:0 }
.gallery-images { position:relative; display:block; width:100%; aspect-ratio:4/3; padding:0; border:0; border-radius:6px; overflow:hidden; background:var(--bg-alt); cursor:zoom-in }
.gallery-images:focus-visible { outline:2px solid currentColor; outline-offset:4px }
.gallery-photo img { display:block; width:100%; height:100%; object-fit:cover }
.gallery-images.has-stack { isolation:isolate; overflow:visible; background:transparent }
.gallery-images.has-stack > img:not([hidden]) { position:relative; z-index:2; border-radius:inherit; box-shadow:2px 3px 10px rgba(15,23,42,.24) }
.gallery-stack-layer { position:absolute; inset:0; z-index:1; border-radius:inherit; background-position:center; background-size:cover; box-shadow:2px 3px 7px rgba(15,23,42,.28); transform:translate(18px,4px) scaleY(.94); filter:brightness(.82); pointer-events:none }
.gallery-stack-layer.is-back { z-index:0; transform:translate(36px,8px) scaleY(.88); filter:brightness(.65) }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .gallery-images.has-stack > img:not([hidden]), .gallery-stack-layer { transition:transform .28s ease, box-shadow .28s ease, filter .28s ease }
  .gallery-images.has-stack:hover > img:not([hidden]) { transform:translate(-3px,-4px) rotate(-1deg); box-shadow:3px 8px 18px rgba(15,23,42,.25) }
  .gallery-images.has-stack:hover .gallery-stack-layer { transform:translate(22px,2px) rotate(1.2deg) scaleY(.94); filter:brightness(.9) }
  .gallery-images.has-stack:hover .gallery-stack-layer.is-back { transform:translate(40px,6px) rotate(2deg) scaleY(.88); filter:brightness(.76) }
}
.gallery-date { display:flex; align-items:baseline; gap:5px; margin-bottom:6px; color:#6b7280; font-family:Arial,Helvetica,sans-serif; font-size:13px; font-variant-numeric:tabular-nums; letter-spacing:0; line-height:1.4; white-space:nowrap }
.gallery-date-main { color:#0056a6; font-size:23px; font-weight:400 }
.gallery-date-year { color:#9199a3; font-size:15px; font-weight:400 }
.gallery-date-year::before { content:"/"; margin-right:6px; color:#a6adb6; font-size:17px }
.gallery-photo figcaption { padding:14px 2px 0; color:var(--text); font-family:Arial,Helvetica,sans-serif; font-size:20px; font-weight:400; line-height:1.4 }
.gallery-title { display:block }
@media(max-width:1000px) {
  .gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:600px) {
  .gallery-grid { grid-template-columns:1fr; gap:28px }
}
@media(max-width:480px) {
  .gallery-date-main { font-size:21px }
  .gallery-date-year { font-size:14px }
}

.gallery-images img[hidden] { display:none }
.image-preview-nav { position:fixed; top:50%; z-index:1; width:44px; height:44px; border:0; border-radius:0; background:transparent; color:#fff; font:48px/1 Arial,sans-serif; cursor:pointer; transform:translateY(-50%) }
.image-preview-prev { left:16px }
.image-preview-next { right:16px }
.image-preview-nav:focus-visible { outline:2px solid #fff; outline-offset:3px }
.image-preview-counter { position:fixed; bottom:16px; left:50%; transform:translateX(-50%); padding:5px 12px; border-radius:20px; background:rgba(15,23,42,.6); color:#fff; font-size:14px }
