.gallery-page { max-width: 1440px; margin: auto; padding: 150px 40px 100px; }
.gallery-section + .gallery-section { margin-top: 90px; }
.gallery-section h2 { margin: 0 0 30px; padding: 0; border: 0; font-size: clamp(2.4rem, 4.5vw, 4rem); font-weight: 500; letter-spacing: -.05em; line-height: 1.1; }
.gallery-grid { columns: 3; column-gap: 18px; }
.gallery-photo { display: block; break-inside: avoid; margin-bottom: 18px; background: var(--light); cursor: zoom-in; }
.gallery-photo img { display: block; width: 100%; height: auto; }
.gallery-photo:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.gallery-preview { position: fixed; inset: 0; z-index: 1050; display: flex; align-items: center; justify-content: center; padding: 36px; background: rgba(255,255,255,.88); pointer-events: none; }
.gallery-preview[hidden], .gallery-dialog:not([open]) { display: none; }
.gallery-preview img, .gallery-dialog img { display: block; max-width: 100%; max-height: 88vh; max-height: 88dvh; width: auto; height: auto; object-fit: contain; box-shadow: 0 18px 70px #0003; }
.gallery-dialog { border: 0; padding: 44px 16px 16px; background: transparent; max-width: 96vw; max-height: 98dvh; overflow: visible; }
.gallery-dialog::backdrop { background: rgba(255,255,255,.94); }
.gallery-dialog img { max-width: 90vw; max-height: 80dvh; }
.gallery-close { position: absolute; top: 0; right: 8px; border: 0; background: transparent; color: #111; font-size: 32px; width: 44px; height: 44px; line-height: 1; cursor: pointer; }
body:has(.gallery-dialog[open]) { overflow: hidden; }
@media (max-width: 850px) {
  .gallery-page { padding: 125px 22px 70px; }
  .gallery-grid { columns: 2; column-gap: 14px; }
  .gallery-photo { margin-bottom: 14px; }
  .gallery-section + .gallery-section { margin-top: 65px; }
}
@media (max-width: 480px) {
  .gallery-page { padding: 112px 18px 55px; }
  .gallery-grid { column-gap: 10px; }
  .gallery-photo { margin-bottom: 10px; }
  .gallery-section h2 { margin-bottom: 22px; }
}