/* Existing animations... */

/* Section reveal animation */
.section-visible {
    animation: sectionReveal 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

@keyframes sectionReveal {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Card reveal animation */
.card-visible {
    animation: cardReveal 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

@keyframes cardReveal {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Floating animation for icons */
.floating {
    animation: floating 3s ease-in-out infinite;
}

@keyframes floating {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-8px);
    }
    100% {
        transform: translateY(0px);
    }
}

/* Gradient outline animation */
.gradient-outline {
    position: relative;
    overflow: hidden;
}

.gradient-outline::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, #3498db, #2ecc71, #3498db);
    background-size: 200% 200%;
    animation: gradientBorder 3s ease infinite;
    z-index: -1;
    border-radius: 14px;
}

@keyframes gradientBorder {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}