/* Homepage-only: gentle right-to-left AC service image backdrop. */
.booking-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 450px;
  background: #0b2030;
}

.booking-hero::after {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: '';
  background: linear-gradient(90deg, rgba(7, 22, 37, .72) 0%, rgba(7, 22, 37, .58) 58%, rgba(7, 22, 37, .64) 100%);
}

.booking-hero-single {
  position: relative;
  z-index: 1;
}

.hero-image-marquee {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  opacity: 1;
  pointer-events: none;
}

.hero-image-track {
  display: flex;
  width: max-content;
  height: 100%;
  animation: hero-images-move 48s linear infinite;
}

.hero-image-set {
  display: flex;
  align-items: center;
  width: auto;
}

.hero-image-set picture,
.hero-image-set img {
  display: block;
  flex: 0 0 100vw;
  width: 100vw;
  height: 100%;
}

.hero-image-set img {
  object-fit: cover;
  box-shadow: none;
  filter: saturate(.88);
}

.booking-hero .booking-copy { padding: 76px 0 58px; }
.booking-hero .booking-copy h1 { color: #fff; }
.booking-hero .booking-lede { color: #e2eef1; }
.booking-hero h1 sup { position: relative; top: -.48em; margin-left: 2px; color: #ffb28d; font-size: .42em; }
.hero-offer { margin: 0 0 20px; color: #ffb28d; font: 600 17px/1.2 'Lexend', sans-serif; }
.booking-hero .booking-tags li { border-color: rgba(255, 255, 255, .46); color: #fff; background: rgba(7, 22, 37, .18); }
.booking-hero .booking-whatsapp { border-color: #fff; color: #fff; background: rgba(255, 255, 255, .08); }
.booking-hero .booking-whatsapp:hover { background: #fff; color: var(--blue); }

@keyframes hero-images-move {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-image-track { animation: none; }
}

@media (max-width: 720px) {
  .booking-hero { min-height: 455px; }

  .booking-hero::after {
    background: rgba(7, 22, 37, .66);
  }

  .hero-image-marquee {
    opacity: 1;
  }

  .hero-image-set {
    width: auto;
  }

  .hero-image-set picture,
  .hero-image-set img {
    width: 100vw;
    height: 455px;
  }

  .booking-hero .booking-copy { padding: 58px 0 42px; }
  .hero-offer { font-size: 15px; }
}