.lgcf-motion-underlay {
  background: #081f18;
  overflow: hidden;
}

.lgcf-motion-underlay .lgcf-motion-frame {
  position: absolute;
  inset: -4%;
  width: 108%;
  height: 108%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  will-change: transform, opacity;
  animation: lgcf-cinematic-slide 16s ease-in-out infinite;
}

.lgcf-motion-underlay .lgcf-motion-frame:nth-of-type(2) {
  animation-delay: 8s;
}

.lgcf-motion-underlay .lgcf-green-gradient {
  z-index: 2;
  background: linear-gradient(90deg, rgba(5, 48, 34, .94) 0%, rgba(5, 48, 34, .76) 48%, rgba(5, 48, 34, .42) 100%);
}

@keyframes lgcf-cinematic-slide {
  0% { opacity: 0; transform: scale(1.04) translate3d(-1.5%, 0, 0); }
  8% { opacity: 1; }
  48% { opacity: 1; }
  58% { opacity: 0; transform: scale(1.14) translate3d(1.5%, -1%, 0); }
  100% { opacity: 0; transform: scale(1.14) translate3d(1.5%, -1%, 0); }
}

@media (max-width: 640px) {
  .lgcf-motion-underlay .lgcf-motion-frame {
    object-position: center center;
  }
  .lgcf-motion-underlay .lgcf-green-gradient {
    background: linear-gradient(90deg, rgba(5, 48, 34, .94), rgba(5, 48, 34, .67));
  }
}

@media (prefers-reduced-motion: reduce) {
  .lgcf-motion-underlay .lgcf-motion-frame {
    animation: none;
    opacity: 0;
  }
  .lgcf-motion-underlay .lgcf-motion-frame:first-of-type {
    opacity: 1;
  }
}
