@import url("https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,400;1,500&display=swap");
.thumbnails-gallery {
  --hero-height: 500px;
}
.thumbnails-gallery__hero {
  height: var(--hero-height);
}
.thumbnails-gallery__gallery {
  margin-top: var(--spacing);
}
.thumbnails-gallery .hero-2 {
  max-height: var(--hero-height);
}
.thumbnails-gallery .hero-2__image,
.thumbnails-gallery .hero-2__image img {
  max-height: calc(var(--hero-height) - 200px);
}
@media (min-width: 768px) {
  .thumbnails-gallery {
    --hero-height: 675px;
  }
  .thumbnails-gallery--image .thumbnails-gallery__images {
    -webkit-order: -1;
    order: -1;
  }
  .thumbnails-gallery--flipped .hero-2__image {
    -webkit-order: -1;
    order: -1;
    padding-left: 0;
    padding-right: var(--spacing);
  }
  .thumbnails-gallery--flipped .hero-2__content {
    padding-left: var(--spacing);
    padding-right: 0;
  }
}
@media (min-width: 992px) {
  .thumbnails-gallery {
    --hero-height: 375px;
  }
  .thumbnails-gallery .hero-2 {
    height: var(--hero-height);
  }
  .thumbnails-gallery .hero-2__image, .thumbnails-gallery .hero-2__image img {
    max-height: var(--hero-height);
  }
}
@media (min-width: 1200px) {
  .thumbnails-gallery {
    --hero-height: 525px;
  }
}