/* Scroll Animation Styles */

/* Base state for animated elements */
.animate-on-scroll {
    opacity: 0;
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* Fade in from bottom */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
}

.fade-in-up.aos-animate {
    opacity: 1;
    transform: translateY(0);
}

/* Fade in from left */
.fade-in-left {
    opacity: 0;
    transform: translateX(-30px);
}

.fade-in-left.aos-animate {
    opacity: 1;
    transform: translateX(0);
}

/* Fade in from right */
.fade-in-right {
    opacity: 0;
    transform: translateX(30px);
}

.fade-in-right.aos-animate {
    opacity: 1;
    transform: translateX(0);
}

/* Fade in (simple) */
.fade-in {
    opacity: 0;
}

.fade-in.aos-animate {
    opacity: 1;
}

/* Scale in */
.scale-in {
    opacity: 0;
    transform: scale(0.9);
}

.scale-in.aos-animate {
    opacity: 1;
    transform: scale(1);
}

/* Stagger children animation */
.stagger-children > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.stagger-children.aos-animate > *:nth-child(1) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.1s;
}

.stagger-children.aos-animate > *:nth-child(2) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.2s;
}

.stagger-children.aos-animate > *:nth-child(3) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.3s;
}

.stagger-children.aos-animate > *:nth-child(4) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.4s;
}

.stagger-children.aos-animate > *:nth-child(5) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.5s;
}

.stagger-children.aos-animate > *:nth-child(6) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.6s;
}

/* Card animations */
.card-animate {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
    transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}

.card-animate.aos-animate {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Heading animations */
.heading-animate {
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.heading-animate.aos-animate {
    opacity: 1;
    transform: translateY(0);
}

/* Divider animation */
.divider-animate {
    opacity: 0;
    transform: scaleX(0);
    transform-origin: center;
    transition: opacity 0.5s ease-out, transform 0.8s ease-out;
}

.divider-animate.aos-animate {
    opacity: 1;
    transform: scaleX(1);
}

/* List item animations */
.list-animate li {
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.list-animate.aos-animate li:nth-child(1) {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.1s;
}

.list-animate.aos-animate li:nth-child(2) {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.2s;
}

.list-animate.aos-animate li:nth-child(3) {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.3s;
}

.list-animate.aos-animate li:nth-child(4) {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.4s;
}

.list-animate.aos-animate li:nth-child(5) {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 0.5s;
}

/* Image animations */
.image-animate {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.image-animate.aos-animate {
    opacity: 1;
    transform: scale(1);
}

/* Delay variations */
.delay-100 { transition-delay: 0.1s !important; }
.delay-200 { transition-delay: 0.2s !important; }
.delay-300 { transition-delay: 0.3s !important; }
.delay-400 { transition-delay: 0.4s !important; }
.delay-500 { transition-delay: 0.5s !important; }

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .animate-on-scroll,
    .fade-in-up,
    .fade-in-left,
    .fade-in-right,
    .fade-in,
    .scale-in,
    .card-animate,
    .heading-animate,
    .divider-animate,
    .list-animate li,
    .image-animate,
    .stagger-children > * {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}
