/* ===== About Section Scroll Animations ===== */

/* Hidden states */
.about-heading.scroll-hidden {
    opacity: 0;
    transform: translateY(30px);
}

.about-text.scroll-hidden {
    opacity: 0;
    transform: translateY(40px);
}

.about-img-left.scroll-hidden {
    opacity: 0;
    transform: rotate(-8deg) translateX(-50px);
}

.about-img-right-1.scroll-hidden {
    opacity: 0;
    transform: rotate(6deg) translateX(50px);
}

.about-img-right-2.scroll-hidden {
    opacity: 0;
    transform: rotate(-4deg) translateX(50px) translateY(20px);
}

.about-btn.scroll-hidden {
    opacity: 0;
    transform: translateY(20px);
}

/* Visible states */
.about-heading.scroll-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-text.scroll-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-img-left.scroll-visible {
    opacity: 1;
    transform: rotate(-8deg) translateX(0);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-img-right-1.scroll-visible {
    opacity: 1;
    transform: rotate(6deg) translateX(0);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-img-right-2.scroll-visible {
    opacity: 1;
    transform: rotate(-4deg) translateX(15px) translateY(0);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-btn.scroll-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}