/* =========================================================
   Advanced Hero Widgets v5 — Immersive Viewport Experience
   Optional master viewport. OFF = existing behavior unchanged.
   ========================================================= */

.ishx-immersive-runtime {
	--ishx-stage-height: 100dvh;
	--ishx-header-offset: 0px;
	--ishx-stage-bg: #000;
	position: relative !important;
	display: block !important;
	box-sizing: border-box !important;
	padding: 0 !important;
	gap: 0 !important;
	isolation: isolate;
}

.ishx-immersive-runtime > :not(.ishx-stage) {
	display: none !important;
}

.ishx-stage {
	position: sticky;
	top: var(--ishx-header-offset, 0px);
	width: 100%;
	height: calc(var(--ishx-stage-height, 100dvh) - var(--ishx-header-offset, 0px));
	min-height: 1px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background: var(--ishx-stage-bg, #000);
	isolation: isolate;
	box-sizing: border-box;
}

.ishx-layers {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: inherit;
}

.ishx-module {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transform: none;
	filter: none;
	clip-path: none;
	will-change: transform, opacity, filter, clip-path;
	box-sizing: border-box;
}

.ishx-module > .elementor-widget-container {
	width: 100%;
	height: 100%;
	min-height: 0;
}

.ishx-module.ishx-module-active {
	visibility: visible;
}

/* Video Hero becomes a pure visual module controlled by the master timeline. */
.ishx-stage .ishv-widget,
.ishx-stage .ishv-stage {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: none !important;
	margin: 0 !important;
}

.ishx-stage .ishv-stage,
.ishx-stage .ishv-mode-sticky .ishv-stage {
	position: relative !important;
	top: auto !important;
}

/* Scroll Story keeps its own scene engine, but no longer owns page geometry. */
.ishx-stage .ish-native-story-enabled,
.ishx-stage .ish-native-story-enabled.ishns-full-bleed {
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
}

.ishx-stage .ish-native-story-enabled .e-n-tabs.ishns-stage {
	position: relative !important;
	top: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
}

.ishx-stage .ish-native-story-enabled .e-n-tabs-content {
	height: 100% !important;
}

/* Optional master progress. */
.ishx-progress {
	position: absolute;
	z-index: 100;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: rgba(255,255,255,.18);
	pointer-events: none;
	overflow: hidden;
}

.ishx-progress-bar {
	width: 100%;
	height: 100%;
	background: #fff;
	transform: scaleX(0);
	transform-origin: left center;
	will-change: transform;
}

html.ishx-scrollbar-preload,
html.ishx-scrollbar-hidden {
	scrollbar-width: none;
}

html.ishx-scrollbar-preload::-webkit-scrollbar,
html.ishx-scrollbar-hidden::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

/* The Elementor editor always remains normal and fully editable. */
.elementor-editor-active .ishx-immersive-enabled,
.elementor-editor-active .ishx-immersive-runtime {
	display: var(--display, flex) !important;
	height: auto !important;
	padding: initial;
	gap: initial;
}

@media (prefers-reduced-motion: reduce) {
	.ishx-module {
		filter: none !important;
	}
}


/* =========================================================
   v5.1 — Master/child synchronization hardening
   ========================================================= */
.ishx-stage .ishx-module,
.ishx-stage .ishx-module > .elementor-widget-container,
.ishx-stage .ishx-module .ishv-widget,
.ishx-stage .ishx-module.ish-native-story-enabled {
	min-width: 0 !important;
	min-height: 0 !important;
}

.ishx-stage .ishx-module.ish-native-story-enabled,
.ishx-stage .ishx-module .ish-native-story-enabled {
	overflow: hidden !important;
}

.ishx-stage .ish-native-story-enabled .e-n-tabs.ishns-stage,
.ishx-stage .ish-native-story-enabled .e-n-tabs-content {
	inset: auto !important;
	min-width: 100% !important;
	min-height: 100% !important;
}


/* =========================================================
   v5.2 — FRAME LOCK + TRUE FULL BLEED
   ========================================================= */

/*
 * The master Container may live inside a boxed Elementor parent or inherit
 * small theme paddings. This lets only the visual stage escape to viewport
 * edges while the virtual scroll geometry stays on the original Container.
 */
.ishx-immersive-runtime {
	overflow-x: clip !important;
}

.ishx-immersive-runtime.ishx-full-bleed > .ishx-stage {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

/* Remove accidental Elementor wrapper spacing inside the master stage. */
.ishx-stage,
.ishx-stage > .ishx-layers,
.ishx-stage .ishx-module,
.ishx-stage .ishx-module > .elementor-widget-container {
	border: 0 !important;
	outline-offset: 0;
}

/*
 * The stage top and height are driven by the SAME frozen header offset from
 * the very first runtime frame, so sticky activation cannot reframe the video.
 */
.ishx-stage {
	top: var(--ishx-header-offset, 0px) !important;
	height: calc(var(--ishx-stage-height, 100dvh) - var(--ishx-header-offset, 0px)) !important;
}

/* Prevent 1px baseline/inline-media gaps from looking like a white frame. */
.ishx-stage video,
.ishx-stage img,
.ishx-stage canvas {
	display: block;
}

/* Avoid horizontal scrollbar caused by a full-bleed 100vw stage. */
html:has(.ishx-immersive-runtime.ishx-full-bleed),
body:has(.ishx-immersive-runtime.ishx-full-bleed) {
	overflow-x: clip;
}


/* v5.4 — Generic Elementor Containers as Immersive modules. */
.elementor-editor-active .ishx-generic-module-enabled { outline:1px dashed rgba(123,97,255,.45); outline-offset:-1px; }