/* 
 * BRUTALIST ANIMATION SYSTEM 
 * Snappy, precise, without slow blurs
 */

.js-reveal {
    opacity: 0;
    transform: translateY(30px);
    visibility: hidden;
}

.js-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Blur Fade Headlines Effect */
.js-blur-fade {
    opacity: 0;
    transform: translateY(15px);
    filter: blur(6px);
    visibility: hidden;
}

.js-blur-fade.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0px);
    visibility: visible;
    transition: transform 0.6s ease-out, opacity 0.6s ease-out, filter 0.6s ease-out;
}

/* Image reveal overlay */
.reveal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-primary); /* Uses primary for reveal sweep */
    z-index: 10;
    transform-origin: top;
}

/* Base keyframes for pure CSS elements */
@keyframes bannerScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}