/* Keep every future-scene image proportional while allowing its frame to fill. */
#future .future-stage::before {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  background-position: center !important;
  background-size: cover !important;
  transform: none !important;
}

#future .world-scene-image {
  max-width: none;
  object-position: center;
}

#future .future-world.is-active .world-trigger {
  overflow: hidden;
}

#future .future-world.is-active .world-scene-image {
  inset: 0;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
  transform: none;
  animation: future-image-breathe-fixed 6s ease-in-out infinite;
}

#future .future-world.is-active .world-trigger:hover .world-scene-image,
#future .future-world.is-active .world-trigger:focus-visible .world-scene-image {
  transform: scale(1.018);
}

@keyframes future-image-breathe-fixed {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.018);
  }
}

@media (max-width: 760px) {
  #future .future-stage::before {
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    transform: none !important;
  }

  #future .future-world.is-active .world-scene-image {
    width: 100% !important;
    height: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #future .future-world.is-active .world-scene-image {
    animation: none;
  }
}