/* ============================================================
   EXAT Sticky Horizontal Scroll Parallax
   Applied to any Elementor Section/Container with
   data-exat-parallax-horizontal="yes"
   ============================================================ */

/* The outer spacer (created dynamically by JS) defines total
   scroll distance. Keep transforms GPU-friendly.              */
.exat-parallax-spacer {
	position: relative;
	width: 100%;
}

/* The pinned viewport. Host element becomes sticky while
   scroll-distance worth of space above keeps the page moving. */
[data-exat-parallax-horizontal="yes"].exat-parallax-pinned {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	/* Prevent min-height from Elementor messing with sticky. */
	min-height: 0 !important;
}

/* The inner track — Elementor's children are moved into this
   wrapper by JS. Flex row so each child sits beside the next.  */
.exat-parallax-track {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	height: 100%;
	width: max-content; /* shrink-wrap children */
	will-change: transform;
	transform: translate3d(0, 0, 0);
}

/* Children should not shrink and keep their designed width.    */
.exat-parallax-track > * {
	flex: 0 0 auto;
}

/* Mobile fallback — disable sticky + transform, stack as normal.*/
@media (max-width: 1024px) {
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile_tablet"].exat-parallax-pinned,
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-mobile="yes"].exat-parallax-pinned {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile_tablet"] .exat-parallax-track,
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-mobile="yes"] .exat-parallax-track {
		flex-wrap: wrap;
		width: 100%;
		transform: none !important;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile_tablet"] .exat-parallax-track > *,
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-mobile="yes"] .exat-parallax-track > * {
		width: 100%;
	}

	.exat-parallax-spacer.exat-parallax-spacer--mobile-disabled,
	.exat-parallax-spacer.exat-parallax-spacer--tablet-disabled,
	.exat-parallax-spacer.exat-parallax-spacer--mobile-tablet-disabled {
		height: auto !important;
	}
}

@media (max-width: 767px) {
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile"].exat-parallax-pinned {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile"] .exat-parallax-track {
		flex-wrap: wrap;
		width: 100%;
		transform: none !important;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="mobile"] .exat-parallax-track > * {
		width: 100%;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="tablet"].exat-parallax-pinned {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="tablet"] .exat-parallax-track {
		flex-wrap: wrap;
		width: 100%;
		transform: none !important;
	}

	[data-exat-parallax-horizontal="yes"][data-exat-parallax-h-disable-on="tablet"] .exat-parallax-track > * {
		width: 100%;
	}
}

/* ============================================================
   EXAT Sticky Vertical Scroll Parallax
   Applied to any Elementor Section/Container with
   data-exat-parallax-vertical="yes"
   ============================================================ */

/* The outer spacer for vertical mode. */
.exat-parallax-spacer-vertical {
	position: relative;
	width: 100%;
}

/* The pinned viewport for vertical mode. */
[data-exat-parallax-vertical="yes"].exat-parallax-pinned-vertical {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	/* Prevent min-height from Elementor messing with sticky. */
	min-height: 0 !important;
}

/* The inner track for vertical mode — content scrolls vertically. */
.exat-parallax-track-vertical {
	position: relative;
	height: 100%;
	width: 100%;
	will-change: transform;
	transform: translate3d(0, 0, 0);
}

/* Mobile fallback for vertical mode. */
@media (max-width: 1024px) {
	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="mobile_tablet"].exat-parallax-pinned-vertical,
	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-mobile="yes"].exat-parallax-pinned-vertical {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="mobile_tablet"] .exat-parallax-track-vertical,
	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-mobile="yes"] .exat-parallax-track-vertical {
		transform: none !important;
	}

	.exat-parallax-spacer-vertical.exat-parallax-spacer-vertical--mobile-disabled,
	.exat-parallax-spacer-vertical.exat-parallax-spacer-vertical--tablet-disabled,
	.exat-parallax-spacer-vertical.exat-parallax-spacer-vertical--mobile-tablet-disabled {
		height: auto !important;
	}
}

@media (max-width: 767px) {
	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="mobile"].exat-parallax-pinned-vertical {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="mobile"] .exat-parallax-track-vertical {
		transform: none !important;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="tablet"].exat-parallax-pinned-vertical {
		position: static;
		height: auto;
		overflow: visible;
	}

	[data-exat-parallax-vertical="yes"][data-exat-parallax-v-disable-on="tablet"] .exat-parallax-track-vertical {
		transform: none !important;
	}
}

/* ============================================================
   Combo Mode - Both Horizontal and Vertical
   ============================================================ */

/* When both modes are active, use vertical track as base */
[data-exat-parallax-horizontal="yes"][data-exat-parallax-vertical="yes"].exat-parallax-pinned.exat-parallax-pinned-vertical {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	min-height: 0 !important;
}

/* Combo mode track - supports both scroll directions */
[data-exat-parallax-horizontal="yes"][data-exat-parallax-vertical="yes"] .exat-parallax-track-vertical {
	display: block;
	position: relative;
	height: 100%;
	width: 100%;
	overflow: hidden;
	will-change: transform;
	transform: translate3d(0, 0, 0);
}

/* Keep the horizontal layer responsible for the row layout in combo mode. */
[data-exat-parallax-horizontal="yes"][data-exat-parallax-vertical="yes"] .exat-parallax-track {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	height: 100%;
	width: max-content;
	will-change: transform;
	transform: translate3d(0, 0, 0);
}

/* Combo mode children */
[data-exat-parallax-horizontal="yes"][data-exat-parallax-vertical="yes"] .exat-parallax-track-vertical > * {
	display: block;
	width: 100%;
}

/* Reduce motion accessibility preference. */
@media (prefers-reduced-motion: reduce) {
	.exat-parallax-track,
	.exat-parallax-track-vertical {
		transform: none !important;
	}
}

/* ============================================================
   Pin — section becomes sticky while scrolling.
   Combine with Reveal Up Style on the NEXT section to create
   a "slide over" effect.
   ============================================================ */
.exat-parallax-pin {
	position: sticky;
	top: 0;
	z-index: 0;
	/* display: block; */
	width: 100%;
	box-sizing: border-box;
}

/* ============================================================
   Reveal Up Style — rounded top + z-index + shadow.
   Purely visual; does NOT touch other sections.
   ============================================================ */
.exat-parallax-reveal-up {
	position: relative;
	z-index: 10;
}

.exat-parallax-reveal-up[data-exat-parallax-shadow="yes"] {
	box-shadow: 0 -24px 48px -12px rgba(0, 0, 0, 0.18);
}

/* Vertical parallax + reveal-up combo:
   override the overflow:hidden + height:100vh from .exat-parallax-pinned-vertical
   so the track is not clipped and sticky positioning works correctly. */
[data-exat-parallax-vertical="yes"].exat-parallax-pinned-vertical.exat-parallax-reveal-up {
	overflow: visible;
	height: auto;
	min-height: 0 !important;
	position: sticky;
	z-index: 10;
}

/* Clip content inside the track instead of on the outer wrapper */
[data-exat-parallax-vertical="yes"].exat-parallax-pinned-vertical.exat-parallax-reveal-up .exat-parallax-track-vertical {
	overflow: hidden;
	height: 100vh;
}

/* On mobile, release the pin so content stacks naturally. */
@media (max-width: 1024px) {
	.exat-parallax-pin {
		position: relative;
		top: auto !important;
		width: 100%;
	}

	[data-exat-parallax-vertical="yes"].exat-parallax-pinned-vertical.exat-parallax-reveal-up {
		position: relative;
		height: auto;
		overflow: visible;
		transform: none !important;
	}

	[data-exat-parallax-vertical="yes"].exat-parallax-pinned-vertical.exat-parallax-reveal-up .exat-parallax-track-vertical {
		height: auto;
		overflow: visible;
		transform: none !important;
	}
}