.pf-animar {
    opacity: 0;
    /* 1.5s hace la animación más larga y elegante */
    transition: opacity 1.5s ease, transform 1.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    will-change: transform, opacity;
}

/* Aumentamos la distancia de 80px a 150px para que el recorrido sea más notorio */
/* Un efecto que además de moverse, crece un poco */
.pf-izquierda { 
    transform: translateX(-100px) scale(0.9) rotate(-2deg) !important; 
}

.pf-derecha { 
    transform: translateX(100px) scale(0.9) rotate(2deg) !important; 
}

.pf-animar.visible {
    opacity: 1 !important;
    transform: translateX(0) !important;
}