/* ── H-SCROLL: Outer container ── */
.h-scroll {
  position: relative !important;
  /* Height is set dynamically by JS */
}

/* Remove Elementor min-height on the outer container */
.h-scroll.e-con,
.h-scroll.elementor-section {
  min-height: unset !important;
}

/* ── Sticky viewport ── */
.h-scroll-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

/* ── Progress bar ── */
.h-scroll-progress {
  position: absolute;
  top: 0;
  left: 0;
  height: 2px;
  width: 0%;
  background: var(--e-global-color-accent, #C2AB00);
  z-index: 9999;
  pointer-events: none;
  transition: none;
}

/* ── Navigation dots ── */
.h-scroll-dots {
  position: absolute;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 9999;
  pointer-events: none;
}

.h-scroll-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.18);
  transition: background 0.3s, transform 0.3s;
}

.h-scroll-dot.active {
  background: var(--e-global-color-accent, #C2AB00);
  transform: scale(1.5);
}

/* ── Horizontal track ── */
.h-scroll-track {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  height: 100vh !important;
  width: max-content !important;
  will-change: transform;
}

/* ── Slides: direct children of track ── */
.h-scroll-track > * {
  flex: 0 0 100vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  min-height: unset !important;
}

/* Remove Elementor's default flex/grid layout on inner wrapper
   so the track can control layout */
.h-scroll > .e-con-inner,
.h-scroll > .elementor-widget-wrap {
  display: block !important;
  padding: 0 !important;
}

/* ── Reveal animation (optional helper class) ── */
.h-scroll-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}

.h-scroll-reveal.in {
  opacity: 1;
  transform: translateY(0);
}

.h-scroll-reveal[data-delay="1"] { transition-delay: 0.1s; }
.h-scroll-reveal[data-delay="2"] { transition-delay: 0.22s; }
.h-scroll-reveal[data-delay="3"] { transition-delay: 0.36s; }
.h-scroll-reveal[data-delay="4"] { transition-delay: 0.52s; }

/* ── MOBILE: kein horizontaler Scroll ── */
@media (max-width: 768px) {
  .h-scroll {
    height: auto !important;
  }

  .h-scroll-sticky {
    position: relative !important;
    height: auto !important;
    overflow: visible !important;
  }

  .h-scroll-track {
    display: block !important;
    flex-direction: unset !important;
    flex-wrap: unset !important;
    height: auto !important;
    width: auto !important;
    transform: none !important;
    will-change: auto !important;
  }

  .h-scroll-track > * {
    flex: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  .h-scroll-dots,
  .h-scroll-progress {
    display: none !important;
  }

  .h-scroll-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
