/* Animation Overflow Fixes */
html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    position: relative;
    scroll-behavior: smooth;
}

/* Base animation styles */
[data-aos] {
    overflow: hidden;
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

/* Animation container */
.aos-container {
    position: relative;
    overflow: hidden;
}

/* Animation states */
[data-aos^='fade'] {
    opacity: 0;
    transition: opacity 0.6s ease, transform 0.6s ease;
}

[data-aos^='fade-up'] {
    transform: translateY(30px);
}

[data-aos^='fade-down'] {
    transform: translateY(-30px);
}

[data-aos^='fade-left'] {
    transform: translateX(30px);
}

[data-aos^='fade-right'] {
    transform: translateX(-30px);
}

[data-aos^='zoom'] {
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Animated state */
[data-aos].aos-animate {
    opacity: 1;
    transform: translate(0) scale(1);
    /* Force hardware acceleration */
    transform: translate3d(0, 0, 0) scale(1);
    backface-visibility: hidden;
}

/* Prevent layout shifts and scrollbar flickering */
body.aos-loading [data-aos],
body.aos-resizing [data-aos] {
    visibility: hidden;
}

/* Fix for Safari */
@supports (-webkit-touch-callout: none) {
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
    }
    
    [data-aos].aos-animate {
        transition: none;
    }
}