/* LNTA Hero Video — one film behind every slide.

   The slides carry no background image any more, so the video sits underneath
   the whole slider rather than inside one slide. That way it keeps playing
   straight through as the slider fades from one caption to the next, instead
   of restarting each time a slide becomes active. */

.hero-slider-1 {
	position: relative;
}

.lnta-hero-video {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	background: #021f07;        /* painted before the poster loads */
}

.lnta-hero-video video,
.lnta-hero-video img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	display: block;
}

/* The poster sits under the video and shows until the first frame paints. */
.lnta-hero-video__poster {
	position: absolute;
	inset: 0;
}

.lnta-hero-video video {
	position: relative;
	opacity: 0;
	transition: opacity 0.8s ease;
}

.lnta-hero-video.is-playing video {
	opacity: 1;
}

/* Captions and buttons sit on moving footage, so they get the same scrim the
   still slides used to provide themselves. */
.lnta-hero-video::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(2, 31, 7, 0.68) 0%,
		rgba(2, 31, 7, 0.45) 45%,
		rgba(2, 31, 7, 0.28) 100%
	);
}

/* Slides are now transparent so the film shows through all of them. */
.hero-slider-1 .swiper-wrapper {
	position: relative;
	z-index: 1;
}

.hero-slider-1 .th-hero-bg {
	background-image: none !important;
	background-color: transparent !important;
}

.hero-slider-1 .swiper-slide,
.hero-slider-1 .hero-inner {
	background-color: transparent !important;
}

/* Anyone asking the OS for less motion keeps the still poster instead. */
@media (prefers-reduced-motion: reduce) {
	.lnta-hero-video video {
		display: none;
	}
}
