/* Shared Dubai sunrise scene with a restrained, film-like pan. */
.hero.hero-reference,
.footer-reference .footer-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #071a35 !important;
}

/* Keep the Hero image on the element itself, so it remains visible before and after its layout script runs. */
.hero.hero-reference {
  background-image: linear-gradient(90deg, rgba(0, 15, 45, .97) 0%, rgba(0, 18, 54, .80) 36%, rgba(0, 20, 53, .15) 74%), url('assets/dubai-sunrise-partner.png') !important;
  background-position: center center !important;
  background-size: cover !important;
}

.hero.hero-reference::before,
.footer-reference .footer-cta::before {
  display: block !important;
  content: '';
  position: absolute;
  inset: -3%;
  z-index: 0;
  pointer-events: none;
  background-image: linear-gradient(90deg, rgba(0, 15, 45, .97) 0%, rgba(0, 18, 54, .80) 36%, rgba(0, 20, 53, .15) 74%), url('assets/dubai-sunrise-partner.png');
  background-position: center center;
  background-size: cover;
  animation: dubai-sunrise-pan 20s ease-in-out infinite alternate;
  will-change: transform;
}

.hero.hero-reference::before {
  display: none !important;
}

.footer-reference .footer-cta .wrap {
  position: relative;
  z-index: 1;
}

@keyframes dubai-sunrise-pan {
  from { transform: scale(1.01) translate3d(0, 0, 0); }
  to { transform: scale(1.07) translate3d(-1.2%, -.7%, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .hero.hero-reference::before,
  .footer-reference .footer-cta::before { animation: none; }
}
