/* Stage = viewport; mask anything outside */
.snap-slider-holder{ position:relative; height:100vh; overflow:hidden; isolation:isolate; }

/* Sizing wrapper */
.snap-slider-container{ position:relative; height:100%; }

/* Track (theme-like: relative is fine; JS will handle transforms) */
.snap-slider-images{ position:relative; display:flex; flex-direction:column; }

/* Each slide fills the viewport */
.snap-slide{ position:relative; flex:0 0 100vh; height:100vh; overflow:hidden; z-index:1; }

/* Image layer (theme semantics) */
.img-mask{ position:absolute; inset:0; display:block; overflow:hidden; }
.section-image{ position:relative; width:100%; height:100%;
  background-repeat:no-repeat; background-position:center center; background-size:cover; z-index:1; will-change:transform;
}

/* Clickable overlay */
.slide-link {
  position: absolute;
  inset: 0;
  z-index: 3;
}

/* Captions overlay */
.snap-slider-captions {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  background: transparent !important;
}

/* Center captions vertically */
.snap-slide-caption {
  position: absolute;
  left: 6vw;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.55) !important;
}

/* Active state: fade peaks mid-scroll */
.snap-slide-caption.is-active {
  transform: translateY(-50%) scale(1.02);
  opacity: 1; /* starting default, JS will animate mid-fade */
}

/* Optional: if you want a smoother feel globally */
.snap-slide-caption {
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}


/* Title + subtitle styling */
.slide-title {
  margin: 0;
  font-weight: 800;
  font-size: clamp(40px, 8vw, 110px);
  color: #fff;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.slide-subtitle {
  display: inline-block;
  margin-top: 12px;
  font-weight: 600;
  color: #fff;
  text-decoration: underline;
  pointer-events: auto;
}

/* Elementor wrapper often paints white / adds min-heights */
.parallax-track,
.elementor-element.parallax-track,
.elementor-element.parallax-track > .e-con-inner{ background:transparent !important; min-height:0 !important; }

/* --- FIX 1: let the page actually scroll --- */
.snap-slider-holder{
  height: auto !important;     /* was 100vh */
  min-height: 100vh;
  overflow: visible !important; /* was hidden */
}

/* keep the vertical stack in normal flow */
.snap-slider-images{
  position: relative !important;   /* ensure it's not absolute */
}

/* each slide still fills the viewport height */
.snap-slide{
  height: 100vh !important;
  overflow: hidden;
}

.snap-slide-caption{
  opacity:0; transform:translateY(20px);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
}

.snap-slide-caption.in-view,
.snap-slide-caption.is-active {
  transform: translateY(-50%) scale(1.02);
  /* no opacity here */
}

.snap-slider-captions{ position:absolute; inset:0; z-index:5; pointer-events:none; }


/* keep the caption layer on top */
.snap-slider-captions{
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: transparent !important;
}

/* Elementor wrappers sometimes paint white / add min-heights */
.parallax-track,
.elementor-element.parallax-track,
.elementor-element.parallax-track > .e-con-inner{
  background: transparent !important;
  min-height: 0 !important;
}

/* Ensure predictable stacking contexts */
.snap-slider-holder { position: relative; isolation: isolate; }
.snap-slide        { position: relative; }
.img-mask,
.section-image     { position: absolute; inset: 0; z-index: 1; }

/* Captions must be in a higher context than images */
.snap-slider-captions{
  position: absolute;
  inset: 0;
  z-index: 9999;           /* higher than anything inside slide */
  pointer-events: none;
  background: transparent !important;
}
.snap-slide-caption{
  position: absolute;
  left: 6vw;
  bottom: 12vh;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .35s ease, transform .35s ease;
  /* make sure text is visible on photos */
  color: #fff;
  text-shadow: 0 10px 30px rgba(0,0,0,.45);
}
.snap-slide-caption.in-view,
.snap-slide-caption.is-active{
  opacity: 1;
  transform: translateY(0);
}

/* Elementor sometimes adds transforms that create stacking contexts.
   Neutralize them on the container so z-index works as expected. */
.elementor-element.parallax-track,
.elementor-element.parallax-track > .e-con-inner{
  transform: none !important;
  z-index: auto !important;
  background: transparent !important;
}


/* ===== Z-index / stacking context fixes ===== */
.snap-slider-holder{ position:relative; isolation:isolate; transform:none !important; }
.snap-slider-container{ position:relative; z-index:0; }

.img-mask,
.section-image{ position:absolute; inset:0; z-index:1; }

/* captions MUST sit above images */
.snap-slider-captions{
  position:absolute; inset:0;
  z-index: 99999;                     /* higher than any image layer */
  pointer-events:none;
  background:transparent !important;
  transform:none !important;          /* prevent new stacking contexts */
}

.snap-slide-caption{
  position:absolute; left:6vw; bottom:12vh;
  opacity:0; transform:translateY(20px);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
  /* force visibility */
  display:block !important;
  visibility:visible !important;
  z-index: 100000;                    /* within captions context */
  mix-blend-mode: normal !important;
  filter:none !important;
}

/* active caption */
.snap-slide-caption.in-view,
.snap-slide-caption.is-active{
  opacity:1;
  transform:translateY(0);
}

/* readable text, override any theme rules */
.slide-title{
  color:#fff !important;
  text-shadow:0 10px 30px rgba(0,0,0,.45) !important;
  -webkit-text-fill-color:#fff !important;
}
.slide-subtitle{ color:#fff !important; }

/* Elementor wrappers sometimes create stacking contexts */
.elementor-element.parallax-track,
.elementor-element.parallax-track > .e-con-inner{
  transform:none !important;
  filter:none !important;
  z-index:auto !important;
  background:transparent !important;
}


/* Make captions a viewport overlay so they always sit on top */
.snap-slider-captions{
  position: fixed !important;   /* <-- was absolute */
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 2147483647 !important; /* wins every stack */
  pointer-events: none;
  background: transparent !important;
  transform: none !important;
  filter: none !important;
}

/* Individual caption block positioning & visibility */
.snap-slide-caption{
  position: absolute;           /* position inside the fixed overlay */
  left: 6vw;
  bottom: 12vh;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.55) !important;
}

.snap-slide-caption.in-view,
.snap-slide-caption.is-active{
  opacity: 1;
  transform: translateY(0);
}

/* Keep images and the full-bleed link under captions */
.img-mask, .section-image{ position:absolute; inset:0; z-index:1; }
.snap-slide .slide-link{ z-index:2 !important; }