/* Animations CSS */

/* Fade In Animation */
.fade-in {
    opacity: 0;
    animation: fadeIn 1s ease forwards;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* Slide In Animation - Left */
.slide-in-left {
    opacity: 0;
    transform: translateX(-50px);
    animation: slideInLeft 1s ease forwards;
}

@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(-50px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Slide In Animation - Right */
.slide-in-right {
    opacity: 0;
    transform: translateX(50px);
    animation: slideInRight 1s ease forwards;
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(50px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Count Up Animation */
.count-up .stat-number {
    display: inline-block;
    animation: countUp 2s ease-in-out forwards;
}

@keyframes countUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Testimonial Slider Animation */
.testimonial-slider {
    position: relative;
    animation: testimonialSlide 15s infinite;
}

@keyframes testimonialSlide {
    0%, 100% {
        transform: translateX(0);
    }
    33% {
        transform: translateX(-5%);
    }
    66% {
        transform: translateX(5%);
    }
}

/* Staggered Animation Delays */
.services-grid .service-card:nth-child(1),
.benefits-grid .benefit-card:nth-child(1),
.team-grid .team-member:nth-child(1) {
    animation-delay: 0.1s;
}

.services-grid .service-card:nth-child(2),
.benefits-grid .benefit-card:nth-child(2),
.team-grid .team-member:nth-child(2) {
    animation-delay: 0.3s;
}

.services-grid .service-card:nth-child(3),
.benefits-grid .benefit-card:nth-child(3),
.team-grid .team-member:nth-child(3) {
    animation-delay: 0.5s;
}

.services-grid .service-card:nth-child(4),
.benefits-grid .benefit-card:nth-child(4) {
    animation-delay: 0.7s;
}

.services-grid .service-card:nth-child(5),
.benefits-grid .benefit-card:nth-child(5) {
    animation-delay: 0.9s;
}

.services-grid .service-card:nth-child(6),
.benefits-grid .benefit-card:nth-child(6) {
    animation-delay: 1.1s;
}

/* Stats count animation */
.stats-grid .stat-card:nth-child(1) {
    animation-delay: 0.2s;
}

.stats-grid .stat-card:nth-child(2) {
    animation-delay: 0.4s;
}

.stats-grid .stat-card:nth-child(3) {
    animation-delay: 0.6s;
}

.stats-grid .stat-card:nth-child(4) {
    animation-delay: 0.8s;
}

/* Add scroll-based animations using CSS variables */
@media (prefers-reduced-motion: no-preference) {
    :root {
        --scroll: 0;
        --scroll-snap: 0;
    }

    @supports (animation-timeline: scroll()) {
        .hero-content,
        .intro-content,
        .services-grid,
        .benefits-grid,
        .testimonial-slider,
        .stats-grid,
        .team-grid,
        .contact-form {
            animation-timeline: view();
            animation-range: entry 10% cover 30%;
        }
        
        .fade-in {
            animation: fadeInScroll both;
        }
        
        .slide-in-left {
            animation: slideInLeftScroll both;
        }
        
        .slide-in-right {
            animation: slideInRightScroll both;
        }
        
        @keyframes fadeInScroll {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }
        
        @keyframes slideInLeftScroll {
            from {
                opacity: 0;
                transform: translateX(-50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }
        
        @keyframes slideInRightScroll {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }
    }
}