/* Animations */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes float {
    0% {
        transform: translateY(0px) translateZ(0);
    }
    50% {
        transform: translateY(-10px) translateZ(20px);
    }
    100% {
        transform: translateY(0px) translateZ(0);
    }
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-1280px * 2));
    }
}

/* Animation Classes */
.fade-in {
    animation: fadeIn 0.5s ease-in;
}

.animate-float {
    animation: float 3s ease-in-out infinite;
}

.animate-scroll {
    animation: scroll 15s linear infinite;
}

.continuous-slider:hover {
    animation-play-state: paused;
}

/* Loading Animation */
.loading::after {
    content: '';
    width: 40px;
    height: 40px;
    border: 4px solid var(--primary-color);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

/* Hover Effects */
.service-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Form Input Animations */
input, textarea {
    transition: all 0.3s ease;
}

input:focus, textarea:focus {
    transform: scale(1.01);
}

/* Mobile Menu Animation */
#mobile-menu {
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

#mobile-menu.active {
    opacity: 1;
    visibility: visible;
}