/* PrettyWellFit Elements — Horizontal Scroll Slides
   Structure:
   .pwf-hslides           tall scroll track (height set inline from slide count x distance)
   .pwf-hslides__sticky   pinned viewport
   .pwf-hslides__rail     flex row of slides, translated horizontally by scroll
   .pwf-hslides__slide    one full-viewport slide holding a nested container
*/

.pwf-hslides {
	position: relative;
	width: 100%;
}

.pwf-hslides__sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
}

.pwf-hslides__rail {
	display: flex;
	flex-wrap: nowrap;
	height: 100%;
	will-change: translate;
}

.pwf-hslides__slide {
	flex: 0 0 100vw;
	width: 100vw;
	height: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

/* A slide holding a finale is always full bleed. */
.pwf-hslides .pwf-hslides__slide--finale {
	padding: 0 !important;
}

/* The nested container fills its slide, whatever Elementor generation
   produced it. */
.pwf-hslides__slide > * {
	height: 100%;
	max-width: none;
}

/* ---------- Elementor editor: stacked, freely editable ----------
   In the editor, slide containers are mounted directly into the rail (no
   .pwf-hslides__slide wrappers), so the stacked layout targets them. */

.elementor-editor-active .pwf-hslides {
	height: auto !important;
}

.elementor-editor-active .pwf-hslides__sticky {
	position: static;
	height: auto;
	overflow: visible;
}

.elementor-editor-active .pwf-hslides__rail {
	display: block;
	translate: none !important;
}

.elementor-editor-active .pwf-hslides__rail > .e-con,
.elementor-editor-active .pwf-hslides__rail > .elementor-element,
.elementor-editor-active .pwf-hslides__slide {
	width: 100%;
	flex: none;
	height: auto;
	min-height: 30vh;
	overflow: visible;
	outline: 1px dashed rgba(255, 255, 255, 0.25);
	outline-offset: -1px;
	margin-bottom: 12px;
}


/* Mobile stack mode: below the breakpoint the section is normal vertical
   flow — no pin, no rail travel. The reveal finale inside a slide rests
   on its composed frame; the takeover is desktop behavior. */
@media ( max-width: 1024px ) {
	.pwf-hslides--mb-stack.pwf-hslides--sbp-tablet {
		height: auto !important;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-tablet .pwf-hslides__sticky {
		position: static;
		height: auto;
		overflow: visible;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-tablet .pwf-hslides__rail {
		display: block;
		width: auto;
		transform: none !important;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-tablet .pwf-hslides__slide {
		flex: none;
		width: 100%;
		height: auto;
		overflow: visible;
	}
}


/* Mobile stack mode: below the breakpoint the section is normal vertical
   flow — no pin, no rail travel. The reveal finale inside a slide rests
   on its composed frame; the takeover is desktop behavior. */
@media ( max-width: 767px ) {
	.pwf-hslides--mb-stack.pwf-hslides--sbp-mobile {
		height: auto !important;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-mobile .pwf-hslides__sticky {
		position: static;
		height: auto;
		overflow: visible;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-mobile .pwf-hslides__rail {
		display: block;
		width: auto;
		transform: none !important;
	}
	.pwf-hslides--mb-stack.pwf-hslides--sbp-mobile .pwf-hslides__slide {
		flex: none;
		width: 100%;
		height: auto;
		overflow: visible;
	}
}