/* =========================================
   HOVER ANIMATIONS
========================================= */
[class*="sba-hover-"] {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sba-hover-zoom:hover {
    transform: scale(1.15);
}

.sba-hover-lift:hover {
    transform: translateY(-10px);
}

.sba-hover-rotate:hover {
    transform: rotate(10deg);
}

/* =========================================
   SCROLL ANIMATIONS (Initial States)
========================================= */
.sba-scroll-target {
    /* Prevents flashes of unstyled content if JS fails */
    will-change: opacity, transform; 
}

.sba-scroll-fade {
    opacity: 0;
    transition: opacity 0.8s ease;
}

.sba-scroll-slide-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

/* =========================================
   SCROLL ANIMATIONS (Active States via JS)
========================================= */
.sba-scroll-fade.is-visible {
    opacity: 1;
}

.sba-scroll-slide-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}