/* =========================================================
   ANIMATIONS: hero fade slideshow + trapezium reveal
   ========================================================= */

/* =======================
   Hero fade slideshow
   JS toggles .isActive
   ======================= */
.heroSlide{
  position:absolute;
  inset:0;
  background-size: cover;
  background-position: center;
  opacity:0;
  transition: opacity 1200ms ease;
  transform: scale(1.02);
}

.heroSlide.isActive{
  opacity:1;
}

/* =======================
   Reveal on scroll
   We add .inView with JS
   ======================= */
.revealOnScroll{
  opacity:0;
  transform: translateY(16px);
  transition: opacity 700ms ease, transform 700ms ease;
}

.revealOnScroll.inView{
  opacity:1;
  transform: translateY(0);
}

/* =======================
   Bounce CTA button
   ======================= */
@keyframes bounceY {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-8px);
  }
  60% {
    transform: translateY(-4px);
  }
}

.bounceBtn {
  animation: bounceY 2.2s infinite;
}