.ms-sticky-root {
  position: relative;
}

/* PRIMARY FIX: with Elementor's "Boxed" content width the sections live under
   .ms-sticky-root > .e-con-inner > .ms-sticky-section — the direct-child-only
   selector silently skipped them (sticky worked on Full-Width, died on Boxed:
   the "works sometimes" report). Cover both structures. */
.ms-sticky-root > .ms-sticky-section,
.ms-sticky-root > .e-con-inner > .ms-sticky-section {
  position: var(--ms-sticky-position, sticky);
  /* Offset knob for fixed headers: per-element Custom CSS
     `selector { --ms-sticky-top: 90px; }` (child or root). */
  top: var(--ms-sticky-top, 0px);
}

/* position:sticky dies inside any overflow:hidden/clip ancestor — users set that
   on the root to clip animations and the whole feature silently stops. Guard it. */
.ms-sticky-root,
.ms-sticky-root > .e-con-inner {
  overflow: visible !important;
}

/* "Sticky only" (Demo: none) — pure CSS pinning, works with the JS never
   loaded, so it targets raw Elementor structure instead of JS-added classes. */
.e-con.ms-sticky-sections--yes.ms-sticky-demo--none { position: relative; }
.e-con.ms-sticky-sections--yes.ms-sticky-demo--none,
.e-con.ms-sticky-sections--yes.ms-sticky-demo--none > .e-con-inner {
  overflow: visible !important;
}
.e-con.ms-sticky-sections--yes.ms-sticky-demo--none > .e-con,
.e-con.ms-sticky-sections--yes.ms-sticky-demo--none > .e-con-inner > .e-con {
  /* Both resolve per-element, so users can override without fighting this
     rule's specificity: `--ms-sticky-top: 90px` (fixed header offset) or
     `--ms-sticky-position: static` (opt a child out of pinning). */
  position: var(--ms-sticky-position, sticky);
  top: var(--ms-sticky-top, 0px);
}

/* ---- BG parallax layer engine (transform-based, compositor-only) ---- */
.ms-sticky-has-bglayer,
.ms-sticky-has-bglayer-root {
  position: relative;
  /* Keeps the z-index:-1 layers above THIS element's own backdrop instead of
     escaping behind ancestor backgrounds. */
  isolation: isolate;
}
.ms-sticky-bglayer {
  position: absolute;
  left: 0;
  right: 0;
  z-index: -1;
  background-repeat: no-repeat;
  pointer-events: none;
}
.ms-sticky-bgholder {
  position: absolute;
  inset: 0;
  /* clip, NOT hidden: overflow:hidden makes the holder a scroll container and
     position:sticky inside it resolves against that never-scrolling scrollport
     — the root's bg window would stay glued to the first viewport. clip only
     clips paint. hidden stays first as the legacy-browser fallback. */
  overflow: hidden;
  overflow: clip;
  z-index: -1;
  pointer-events: none;
}
.ms-sticky-bgwindow {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
}

/* Disable Elementor's default transform transition for sticky sections —
   but NOT in "Sticky only" mode, where nothing scrubs transforms and the kill
   would only break hover transitions on nested containers. */
.ms-sticky-sections--yes:not(.ms-sticky-demo--none),
.ms-sticky-sections--yes:not(.ms-sticky-demo--none) .e-con,
.ms-sticky-sections--yes:not(.ms-sticky-demo--none) .e-con-inner,
.ms-sticky-sections--yes:not(.ms-sticky-demo--none) .ms-sticky-section {
  --e-con-transform-transition-duration: 0s !important;
  transition: none !important;
}
.ms-sticky-demo--demo-4 .ms-sticky-section, .ms-sticky-demo--demo-5 .ms-sticky-section {
  top: var(--ms-sticky-top, 20vh);
  margin: auto;
  margin-bottom: auto;
  margin-bottom: 10vh;
}
@media (min-width: 992px) {
.ms-sticky-demo--demo-7 .ms-sticky-section {
		width: 50%;
	}
}
.ms-sticky-demo--demo-7 .ms-sticky-section:nth-child(odd) {
	margin-left: auto;
}