/* Only the photographs move; the hero copy, navigation and search stay still. */
body.home .hero {
  background: #e8edf0;
}

.hero-slideshow,
.hero-slideshow-viewport {
  position: absolute;
  inset: 0;
}

.hero-slideshow {
  z-index: 0;
  pointer-events: none;
}

.hero-slideshow-viewport {
  overflow: hidden;
}

.hero-slide {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center 7%;
  visibility: hidden;
  transform: translate3d(100%, 0, 0);
}

.hero-slide.is-active,
.hero-slide.is-entering,
.hero-slide.is-leaving {
  visibility: visible;
}

.hero-slide.is-active {
  transform: translate3d(0, 0, 0);
}

.hero-slide.is-leaving {
  transform: translate3d(-100%, 0, 0);
}

.hero-slideshow.is-animating .hero-slide:is(.is-active, .is-leaving) {
  transition: transform 900ms cubic-bezier(.22, .61, .36, 1);
  will-change: transform;
}

.hero-slideshow-viewport::after {
  position: absolute;
  inset: 0;
  content: '';
  /* A soft, stationary bottom fade into the booking strip. */
  background: linear-gradient(180deg, transparent 68%, rgb(250 249 246 / 12%) 77%, rgb(250 249 246 / 72%) 91%, #faf9f6);
}

@media (min-width: 1600px) {
  .hero-slideshow-viewport::after {
    background-image:
      linear-gradient(180deg, transparent 68%, rgb(250 249 246 / 12%) 77%, rgb(250 249 246 / 72%) 91%, #faf9f6),
      linear-gradient(90deg, #faf9f6, transparent 6%, transparent 94%, #faf9f6);
  }
}

@media (max-width: 768px) {
  .hero-slide {
    object-position: 57% top;
  }

  .hero-slideshow-viewport::after {
    background-image:
      linear-gradient(180deg, transparent 68%, rgb(250 249 246 / 12%) 77%, rgb(250 249 246 / 72%) 91%, #faf9f6),
      linear-gradient(90deg, rgb(250 249 246 / 94%), rgb(250 249 246 / 78%) 48%, rgb(250 249 246 / 25%) 80%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-slideshow.is-animating .hero-slide {
    transition: none;
  }
}
