/* ===== ANIMACIONES ===== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    opacity: 0;
    animation: fadeInUp 0.8s ease forwards;
}

.delay-1 {
    animation-delay: 0.2s;
}

.delay-2 {
    animation-delay: 0.4s;
}

.delay-3 {
    animation-delay: 0.6s;
}

/* Efectos de hover para tarjetas */
.benefit-card, .product-card, .service-item, .package-card {
    transition: all 0.3s ease;
}

.benefit-card:hover, .product-card:hover, .service-item:hover, .package-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

/* Animación para botones */
.btn {
    transition: all 0.3s ease;
}

.btn:hover {
    transform: translateY(-3px);
}

/* Animación para el menú móvil */
nav {
    transition: right 0.3s ease;
}

/* Animación para el header al hacer scroll */
header {
    transition: all 0.3s ease;
}