/* Project galleries: a deliberate horizontal viewing room on desktop. */
body:not(:has(.exhibition-home)) {
  overflow-x: hidden;
  overflow-y: auto;
}

.project-page {
  width: 100%;
  margin: 0;
}

.project-page__title:empty {
  display: none;
}

.project-page:has(.gallery-container) {
  padding: clamp(1rem, 3vw, 3rem) 0;
}

.project-page .gallery-container {
  width: 100%;
  max-width: none;
  overflow: hidden;
}

.project-page .image-gallery-wrapper {
  display: flex;
  overflow-x: auto;
  padding: 10px 0;
  scrollbar-width: none;
  cursor: grab;
  touch-action: auto;
}

.project-page .image-gallery-wrapper.is-dragging {
  cursor: grabbing;
  user-select: none;
}

.project-page .image-gallery {
  display: flex;
  gap: clamp(0.65rem, 1.4vw, 1.5rem);
  width: max-content;
  min-width: 100%;
  padding: 0 clamp(1rem, 4vw, 4rem);
  align-items: center;
}

.project-page .gallery-media-container {
  flex: 0 0 auto;
  min-width: 0;
  scroll-snap-align: center;
}

.project-page .gallery-media {
  display: block;
  width: auto;
  height: min(78svh, 56rem);
  max-width: min(80vw, 76rem);
  margin: 0;
  object-fit: contain;
}

.project-page .gallery-media-container iframe {
  width: min(calc(min(78svh, 56rem) * 1.7778), 80vw) !important;
  height: min(78svh, 56rem) !important;
}

.project-page .gallery-media-container iframe[src*="IUzIxXGcnZ0"] {
  width: min(78svh, 56rem) !important;
}

@media (hover: hover) and (pointer: fine) {
  .project-page .gallery-media:hover {
    transform: scale(1.01);
  }
}

@media (max-width: 47.99rem) {
  .project-page:has(.gallery-container) {
    padding: 5rem 1rem 2rem;
  }

  .project-page .gallery-container,
  .project-page .image-gallery-wrapper {
    overflow: visible;
  }

  .project-page .image-gallery-wrapper {
    padding: 0;
    cursor: auto;
    touch-action: auto;
  }

  .project-page .image-gallery {
    display: grid;
    width: 100%;
    padding: 0;
    gap: 1rem;
  }

  .project-page .gallery-media-container {
    width: 100%;
  }

  .project-page .gallery-mobile-spacer {
    display: none;
  }

  .project-page .gallery-media {
    width: 100%;
    height: auto;
    max-width: none;
    max-height: none;
    object-fit: contain;
    touch-action: pan-y;
    transition: none !important;
    transform: none !important;
  }

  .project-page .gallery-media:hover,
  .project-page .gallery-media:active {
    transform: none !important;
  }

  .project-page .gallery-media-container iframe,
  .project-page .gallery-media-container iframe[src*="IUzIxXGcnZ0"] {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
  }

  .project-page .gallery-media-container iframe[src*="IUzIxXGcnZ0"] {
    aspect-ratio: 1;
  }
}