/* Finished-work gallery, scoped to the existing Gallery page. */
body.gallery-page .gallery-project[hidden],
body.gallery-page [data-gallery-controls][hidden],
body.gallery-page [data-gallery-view-all][hidden] { display: none; }

body.gallery-page .gallery-project + .gallery-project { border-top: 1px solid #24374b; }
body.gallery-page .gallery-project-photo-count {
  flex-shrink: 0;
  color: #aabacc;
  font: 600 .8rem/1.4 'Inter', sans-serif;
  padding-top: 8px;
  white-space: nowrap;
}
body.gallery-page .gallery-project-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 20px clamp(16px, 3vw, 32px) 24px;
}
body.gallery-page .gallery-project-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.gallery-page .gallery-work-photo {
  position: relative;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  background: #03070c;
  border: 1px solid rgba(156, 193, 226, .18);
}
body.gallery-page .gallery-work-photo a { display: block; cursor: zoom-in; }
body.gallery-page .gallery-work-photo a:focus-visible { outline: 3px solid #60b8ff; outline-offset: -3px; }
body.gallery-page .gallery-work-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: contain;
}
body.gallery-page .gallery-work-photo figcaption {
  position: absolute;
  inset: auto 0 0;
  padding: 48px 16px 17px;
  color: #fff;
  background: linear-gradient(transparent, rgba(0, 0, 0, .88));
  pointer-events: none;
}
body.gallery-page .gallery-work-photo figcaption span,
body.gallery-page .gallery-work-photo figcaption strong { display: block; }
body.gallery-page .gallery-work-photo figcaption span {
  color: #d3e3f3;
  font-size: .7rem;
  letter-spacing: .06em;
  margin-bottom: 4px;
}
body.gallery-page .gallery-work-photo figcaption strong {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(1.05rem, 1.5vw, 1.4rem);
  font-weight: 700;
  line-height: 1.1;
}
body.gallery-page .gallery-carousel-bottom { align-items: center; }
body.gallery-page .gallery-project + .gallery-project:not([hidden]) { border-top: 0; }
body.gallery-page .gallery-viewer {
  box-sizing: border-box;
  width: min(1120px, calc(100vw - 32px));
  max-width: none;
  max-height: 88vh;
  overflow: auto;
  padding: 0 24px 24px;
  border: 1px solid #244a70;
  border-bottom: 4px solid #1687ff;
  background: #070d15;
  color: #fff;
  overscroll-behavior: contain;
}
body.gallery-page .gallery-viewer::backdrop { background: rgba(0, 0, 0, .88); }
body.gallery-page .gallery-viewer-heading {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 24px 0 18px;
  background: #070d15;
}
body.gallery-page .gallery-viewer-heading h2 { margin: 6px 0; font-size: clamp(1.8rem, 4vw, 3rem); }
body.gallery-page .gallery-viewer-heading p { margin: 0; max-width: 720px; }
body.gallery-page .gallery-viewer-heading p:not(.eyebrow) { color: #b8c6d7; font-size: .85rem; }
body.gallery-page .gallery-viewer-heading .gallery-photo-modal-close { position: static; flex: 0 0 44px; }
body.gallery-page .gallery-viewer-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.gallery-page .gallery-viewer-photos .gallery-work-photo img { aspect-ratio: auto; height: 65vh; object-fit: contain; }
@media (max-width: 1100px) and (min-width: 701px) {
  body.gallery-page .gallery-project-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  body.gallery-page .gallery-carousel-top { gap: 12px; }
  body.gallery-page .gallery-carousel-top h3 { font-size: clamp(2.2rem, 10vw, 3.4rem); }
  body.gallery-page .gallery-project-grid,
  body.gallery-page .gallery-project-grid--four {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 88%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 16px;
    padding-inline: 16px;
    scrollbar-color: #1687ff #122133;
    scrollbar-width: thin;
  }
  body.gallery-page .gallery-project-grid .gallery-work-photo { scroll-snap-align: start; }
  body.gallery-page .gallery-work-photo figcaption strong { font-size: 1.3rem; }
  body.gallery-page .gallery-carousel-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  body.gallery-page .gallery-project-photo-count { font-size: .7rem; }
  body.gallery-page .gallery-viewer { width: calc(100vw - 16px); max-height: 92dvh; padding: 0 14px 14px; }
  body.gallery-page .gallery-viewer-heading { padding-top: 16px; }
  body.gallery-page .gallery-viewer-photos { grid-template-columns: 1fr; gap: 12px; }
  body.gallery-page .gallery-viewer-photos .gallery-work-photo img { height: auto; max-height: 78dvh; }
}