/* Custom CSS for AOS Scroll Animation */

/* Ensure elements are hidden before animation */
[data-aos] {
    visibility: hidden;
}

[data-aos].aos-animate {
    visibility: visible;
}

/* Custom animation styles */
.aos-custom-fade {
    opacity: 0;
    transition: opacity 0.6s ease;
}

.aos-custom-fade.aos-animate {
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    [data-aos] {
        /* Disable animations on mobile for better performance */
        transition: none !important;
        transform: none !important;
    }
}

/* Performance optimizations */
[data-aos] {
    will-change: transform, opacity;
}

/* Custom easing effects */
.aos-ease-custom {
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Stagger animation support */
[data-aos-stagger] .aos-item {
    transition-delay: calc(var(--aos-stagger-delay, 100ms) * var(--aos-index, 0));
}

/* Parallax effect support */
[data-aos-parallax] {
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
}

/* Loading state */
.aos-loading [data-aos] {
    opacity: 0;
}

.aos-loaded [data-aos] {
    transition: all 0.6s ease;
}

/* Custom reveal effects */
.aos-reveal-left {
    transform: translateX(-100px);
    opacity: 0;
}

.aos-reveal-left.aos-animate {
    transform: translateX(0);
    opacity: 1;
}

.aos-reveal-right {
    transform: translateX(100px);
    opacity: 0;
}

.aos-reveal-right.aos-animate {
    transform: translateX(0);
    opacity: 1;
}

.aos-reveal-up {
    transform: translateY(100px);
    opacity: 0;
}

.aos-reveal-up.aos-animate {
    transform: translateY(0);
    opacity: 1;
}

.aos-reveal-down {
    transform: translateY(-100px);
    opacity: 0;
}

.aos-reveal-down.aos-animate {
    transform: translateY(0);
    opacity: 1;
}

/* Scale effects */
.aos-scale-up {
    transform: scale(0.8);
    opacity: 0;
}

.aos-scale-up.aos-animate {
    transform: scale(1);
    opacity: 1;
}

.aos-scale-down {
    transform: scale(1.2);
    opacity: 0;
}

.aos-scale-down.aos-animate {
    transform: scale(1);
    opacity: 1;
}

/* Rotate effects */
.aos-rotate-left {
    transform: rotate(-45deg);
    opacity: 0;
}

.aos-rotate-left.aos-animate {
    transform: rotate(0);
    opacity: 1;
}

.aos-rotate-right {
    transform: rotate(45deg);
    opacity: 0;
}

.aos-rotate-right.aos-animate {
    transform: rotate(0);
    opacity: 1;
}

/* Blur effect */
.aos-blur {
    filter: blur(5px);
    opacity: 0;
}

.aos-blur.aos-animate {
    filter: blur(0);
    opacity: 1;
}

/* Slide and fade combined */
.aos-slide-fade-up {
    transform: translateY(50px);
    opacity: 0;
}

.aos-slide-fade-up.aos-animate {
    transform: translateY(0);
    opacity: 1;
}

.aos-slide-fade-down {
    transform: translateY(-50px);
    opacity: 0;
}

.aos-slide-fade-down.aos-animate {
    transform: translateY(0);
    opacity: 1;
}

.aos-slide-fade-left {
    transform: translateX(50px);
    opacity: 0;
}

.aos-slide-fade-left.aos-animate {
    transform: translateX(0);
    opacity: 1;
}

.aos-slide-fade-right {
    transform: translateX(-50px);
    opacity: 0;
}

.aos-slide-fade-right.aos-animate {
    transform: translateX(0);
    opacity: 1;
}

/* Flip effects */
.aos-flip-up {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
}

.aos-flip-up.aos-animate {
    transform: perspective(400px) rotateX(0);
    opacity: 1;
}

.aos-flip-down {
    transform: perspective(400px) rotateX(-90deg);
    opacity: 0;
}

.aos-flip-down.aos-animate {
    transform: perspective(400px) rotateX(0);
    opacity: 1;
}

.aos-flip-left {
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
}

.aos-flip-left.aos-animate {
    transform: perspective(400px) rotateY(0);
    opacity: 1;
}

.aos-flip-right {
    transform: perspective(400px) rotateY(-90deg);
    opacity: 0;
}

.aos-flip-right.aos-animate {
    transform: perspective(400px) rotateY(0);
    opacity: 1;
}
