/* Hero background (front end): a video or Ken Burns slideshow layer between the hero's own
   background photo and its overlay. The hero becomes a stacking context (isolation) so the
   layer can sit at z-index -1: above the photo, below the overlay (::before), the load-in
   glass (::after) and the content. */
.rogiq-page-banner.has-rogiq-hero-media {
	isolation: isolate;
}
.rogiq-page-banner > .rogiq-hero-media {
	position: absolute;
	inset: 0;
	z-index: -1;
	max-width: none; /* Not the hero's content width (constrained layout). */
	overflow: hidden;
	pointer-events: none;
	animation: none;
}
.rogiq-hero-media.is-static {
	display: none; /* Reduced motion: the still background photo shows. */
}
.rogiq-hero-media video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Ken Burns: each slide zooms and drifts over its time on screen plus the 1.5s fade, then
   the next fades in over it. Odd slides push in toward the top-left, even slides pull back
   from the bottom-right, so consecutive slides move differently. */
.rogiq-kb-slide {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	opacity: 0;
	transition: opacity 1.5s ease;
	--rogiq-kb-from: scale(1) translate(0, 0);
	--rogiq-kb-to: scale(1.12) translate(-2%, -1.5%);
}
.rogiq-kb-slide:nth-child(even) {
	--rogiq-kb-from: scale(1.12) translate(2%, 1.5%);
	--rogiq-kb-to: scale(1) translate(0, 0);
}
.rogiq-kb-slide.is-active,
.rogiq-kb-slide.was-active {
	animation: rogiq-kb var(--rogiq-kb-time, 8.5s) linear both;
}
.rogiq-kb-slide.is-active {
	opacity: 1;
	z-index: 1;
}
/* The outgoing slide stays fully visible underneath while the new one fades in on top
   (no dip to the background photo); the script drops it once the fade is done. */
.rogiq-kb-slide.was-active {
	opacity: 1;
	transition: none;
}
@keyframes rogiq-kb {
	from { transform: var(--rogiq-kb-from); }
	to { transform: var(--rogiq-kb-to); }
}
@media (prefers-reduced-motion: reduce) {
	.rogiq-kb-slide { transition: none; }
	.rogiq-kb-slide.is-active,
	.rogiq-kb-slide.was-active { animation: none; transform: none; }
}
