.gallery {
  background-color: black;
  background-image: linear-gradient(black, rgb(166, 166, 166), rgb(35, 35, 35), rgb(35, 35, 35));
}

/* Titles formatting */
.gallery-container #photos_title { padding-top: 100px; padding-bottom: 50px; }
.gallery-container #films_title { padding-top: 80px; margin-bottom: 48px; }
.gallery-container #films_title a,
.gallery-container #photos_title a {
  font-family: 'Courier New', Courier, monospace;
  font-size: x-large;
  font-weight: 400;
  color: white;
  text-decoration: none;
}

.gallery-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.gallery-container .box {
  width: min(1100px, 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(100px, 10vw, 220px);
  padding-inline: 16px;
}

.gallery-container .box .fig img {
  display: block;
  height: auto;
  max-width: 100%;
}

/* Desktop: hover-to-reveal caption behavior */
.gallery-container .box .fig figcaption {
  text-align: center;
  color: transparent;
  transition: color 0.4s ease;
  font-size: larger;
  margin-top: 8px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.gallery-container .box .fig img:hover + figcaption {
  color: white;
}

.gallery-container .videos {
  width: 100%;
  display: grid;
  place-items: center;
  gap: 64px;
  padding-inline: 16px;
}
.gallery-container .videos video {
  width: 100%;
  max-width: 1100px;
  height: auto;
  aspect-ratio: 16 / 9;
}

/* Compact image sizing */
.gallery-container .box .fig img.compact-image {
  max-width: 85% !important;
  margin: auto !important;
  display: block !important;
}

/* Mobile overrides */
@media (max-width: 900px) {
  .gallery-container .box .fig img {
    width: 100% !important;
  }

  @media (hover: none) {
    .gallery-container .box .fig figcaption {
      color: rgba(255,255,255,0.9);
    }
  }

  .gallery-container .box {
    gap: clamp(100px, 6vw, 200px);
  }
}