/* Animaciones para Landing Page */

/* Animación de entrada desde abajo con fade */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(50px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Animación de pulso para botones */
@keyframes pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.08);
    }
}

/* Animación flotante para iconos */
@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-15px);
    }
}

/* Entrada desde la derecha */
@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(100px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Entrada desde la izquierda */
@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-100px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Aplicar animaciones */
.animate-hero {
    animation: slideInRight 1s ease-out;
}

.feature-card {
    animation: fadeInUp 0.8s ease-out;
    animation-fill-mode: both;
}

.feature-card:nth-child(1) { animation-delay: 0.1s; }
.feature-card:nth-child(2) { animation-delay: 0.3s; }
.feature-card:nth-child(3) { animation-delay: 0.5s; }

.feature-icon {
    animation: float 3s ease-in-out infinite;
    display: inline-block;
}

.pricing-card {
    animation: fadeInUp 1s ease-out;
    animation-fill-mode: both;
}

.pricing-card:nth-child(1) { animation-delay: 0.2s; }
.pricing-card:nth-child(2) { animation-delay: 0.4s; }

.btn-primary-custom:hover {
    animation: pulse 0.6s ease-in-out;
}

/* Scroll suave */
html {
    scroll-behavior: smooth;
}