/* =========================
   SCROLL ANIMATION SYSTEM
   ========================= */

.scroll-anim {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity 0.9s cubic-bezier(.6,.07,.19,.97),
    transform 0.9s cubic-bezier(.6,.07,.19,.97);
  will-change: opacity, transform;
}

.scroll-anim.active {
  opacity: 1;
  transform: none;
}

/* VARIANTES OPCIONALES */
.scroll-anim.fade-left {
  transform: translateX(-40px);
}

.scroll-anim.fade-right {
  transform: translateX(40px);
}

.scroll-anim.scale {
  transform: scale(0.95);
}