/* Scroll Service Effects CSS */

/* Service Items Animation */
.service-item {
    opacity: 0;
    transform: translate3d(0px, 50px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: opacity, transform;
}

.service-item.animate-in {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
}

/* Staggered animation delays */
.service-item:nth-child(1) { transition-delay: 0s; }
.service-item:nth-child(2) { transition-delay: 0.2s; }
.service-item:nth-child(3) { transition-delay: 0.4s; }
.service-item:nth-child(4) { transition-delay: 0.6s; }

/* Button Advance Effects */
.button-advance-border {
    will-change: transform !important;
    transform-style: preserve-3d !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg) !important;
}

/* Button hover state */
.button-advance:hover .button-advance-border {
    transform: translate3d(-8px, -8px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg) !important;
}

/* Override Webflow animations for service items */
.step-section .service-item {
    animation: none !important;
}

.step-section .service-item[data-w-id] {
    animation: none !important;
}

/* Ensure smooth transitions */
.step-section {
    overflow: visible;
}

/* Hardware acceleration */
.service-item,
.button-advance-border {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

/* Force our styles to take precedence */
.step-section .service-item {
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.step-section .button-advance-border {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
} 