/* =============================================
   BPS Scroll FX — Animaciones al hacer scroll
   Compatible: Astra + Elementor Pro
   ============================================= */

/* Estado inicial: invisible y desplazado */
.bps-fx-ready {
    opacity: 0 !important;
    transition: none !important;
}

/* Animaciones de entrada */
@keyframes bpsFadeInUp {
    from { opacity: 0; transform: translateY(50px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes bpsFadeInLeft {
    from { opacity: 0; transform: translateX(-60px); }
    to   { opacity: 1; transform: translateX(0); }
}
@keyframes bpsFadeInRight {
    from { opacity: 0; transform: translateX(60px); }
    to   { opacity: 1; transform: translateX(0); }
}
@keyframes bpsFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@keyframes bpsFadeInDown {
    from { opacity: 0; transform: translateY(-50px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes bpsZoomIn {
    from { opacity: 0; transform: scale(0.8); }
    to   { opacity: 1; transform: scale(1); }
}

/* Clases activas (JS las agrega al entrar en viewport) */
.bps-fx-fadeInUp    { animation: bpsFadeInUp    0.8s ease forwards; }
.bps-fx-fadeInLeft  { animation: bpsFadeInLeft  0.8s ease forwards; }
.bps-fx-fadeInRight { animation: bpsFadeInRight 0.8s ease forwards; }
.bps-fx-fadeIn      { animation: bpsFadeIn      0.8s ease forwards; }
.bps-fx-fadeInDown  { animation: bpsFadeInDown  0.8s ease forwards; }
.bps-fx-zoomIn      { animation: bpsZoomIn      0.8s ease forwards; }