/* =========================================================
   LT Sticky Stack 1.27.7 · widget + Atomic
   Frontend: exact-release sticky model.
   Editor opt-in preview: absolute-position simulation that does not depend on
   CSS sticky inside Elementor's transformed editor canvas.
   ========================================================= */

.lt-sticky-stack-widget-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
  overflow: visible;
}

.lt-sticky-stack-card {
  position: relative;
  width: 100%;
  min-width: 0;
}

.lt-sticky-stack-card > .e-con,
.lt-sticky-stack-card > .elementor-element {
  min-height: inherit;
}

/* Runtime box shared by frontend and the opt-in editor preview. */
.lt-stack__stage.lt-stack--ready {
  --lt-stack-top: 80px;
  --lt-stack-card-height: auto;
  position: relative !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  min-block-size: 0 !important;
  padding-block: 0 !important;
  align-content: start !important;
  gap: 0 !important;
  isolation: isolate;
  overflow: visible !important;
}

.lt-stack__stage.lt-stack--ready > .lt-stack__item {
  align-self: start !important;
  min-width: 0 !important;
  margin-block: 0 !important;
  margin-inline: auto !important;
  overflow: hidden !important;
  transform-origin: center top !important;
  transition: none !important;
  animation: none !important;
  will-change: transform, filter, opacity, clip-path;
}

/* Frontend/normal preview: native sticky is the validated v10 model. */
.lt-stack__stage.lt-stack--ready:not(.lt-stack--editor-preview) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: var(--lt-stack-card-height) !important;
}

.lt-stack__stage.lt-stack--ready:not(.lt-stack--editor-preview) > .lt-stack__item {
  grid-area: 1 / 1 !important;
  position: sticky !important;
  top: var(--lt-stack-top) !important;
  left: auto !important;
}

/*
 * Elementor editor canvases can place the document under transformed/contained
 * wrappers. CSS sticky may then disappear or use the wrong containing block.
 * The opt-in preview therefore uses absolute cards and JS adds the current
 * scroll progress to their Y position. The visual result matches the frontend
 * model without relying on sticky inside the editor.
 */
.lt-stack__stage.lt-stack--editor-preview.lt-stack--ready {
  display: block !important;
  grid-template: none !important;
}

.lt-stack__stage.lt-stack--editor-preview.lt-stack--ready > .lt-stack__item {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  grid-area: auto !important;
}

.lt-stack--disabled.lt-sticky-stack-widget-stage,
.lt-stack--editor.lt-sticky-stack-widget-stage {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
}

.lt-stack--disabled .lt-sticky-stack-card,
.lt-stack--editor .lt-sticky-stack-card {
  width: 100% !important;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  clip-path: none !important;
}

/* Static editor state. It applies only while preview is OFF. */
.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]),
body.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]) {
  height: auto !important;
}

.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]).lt-sticky-stack-widget-stage,
body.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]).lt-sticky-stack-widget-stage {
  display: flex !important;
  flex-direction: column !important;
}

.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]) > *,
body.elementor-editor-active [data-lt-stack="1"]:not([data-editor-preview="1"]) > * {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  clip-path: none !important;
}

/* Editor iframe variants used by different Elementor 4 builds. */
body.elementor-edit-mode [data-lt-stack="1"]:not([data-editor-preview="1"]),
body.elementor-editor-preview [data-lt-stack="1"]:not([data-editor-preview="1"]),
body.e-editor-preview [data-lt-stack="1"]:not([data-editor-preview="1"]) {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  grid-template: none !important;
  gap: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

body.elementor-edit-mode [data-lt-stack="1"]:not([data-editor-preview="1"]) > *,
body.elementor-editor-preview [data-lt-stack="1"]:not([data-editor-preview="1"]) > *,
body.e-editor-preview [data-lt-stack="1"]:not([data-editor-preview="1"]) > * {
  position: relative !important;
  inset: auto !important;
  grid-area: auto !important;
  width: 100% !important;
  margin: 0 !important;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  clip-path: none !important;
  overflow: visible !important;
}

@media (prefers-reduced-motion: reduce) {
  .lt-stack__stage.lt-stack--ready > .lt-stack__item {
    filter: none !important;
    opacity: 1 !important;
    transition: none !important;
  }
}
