/* ===== CTA Scroll Animations ===== */

/* Use opacity + visibility only — never override transform (JS owns it) */
.cta-arc-img.scroll-hidden {
    opacity: 0;
    visibility: hidden;
}

.cta-arc-img.scroll-visible {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
                visibility 0.55s;
}

.cta-heading.scroll-hidden,
.cta-subtitle.scroll-hidden,
.cta-btn.scroll-hidden {
    opacity: 0;
    transform: translateY(24px);
}

.cta-heading.scroll-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

.cta-subtitle.scroll-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

.cta-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);
}