/* This is the core CSS for the animation widget */
.animation-wrapper {
    opacity: 1; /* Default to visible, let animations hide it */
    transition-property: opacity, transform;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition-duration: 0.8s;
}

/* --- BLOCK ANIMATIONS --- */
.animation-wrapper.fade-in-up,
.animation-wrapper.fade-in-left,
.animation-wrapper.scale-up {
    opacity: 0;
}
.animation-wrapper.fade-in-up { transform: translateY(50px); }
.animation-wrapper.fade-in-left { transform: translateX(-50px); }
.animation-wrapper.scale-up { transform: scale(0.9); }

.animation-wrapper.is-visible.fade-in-up,
.animation-wrapper.is-visible.fade-in-left,
.animation-wrapper.is-visible.scale-up {
    opacity: 1;
    transform: none;
}

/* --- SEQUENTIAL LINE MASK ANIMATION --- */
.line-mask {
    overflow: hidden;
    display: block;
}

.line {
    transform: translateY(110%);
    transition: transform 0.8s ease;
}

.animation-wrapper.is-visible .line {
    transform: translateY(0);
}