.fade {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade.entered {
    color: #0af;
}

.fade-in    { transition: opacity 0.4s ease-out; }
.fade-out   { transition: opacity 0.4s ease-in; }
.zoom-in    { transition: transform 0.5s ease-out; }

/* Beispielanimation */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25%      { transform: translateX(-5px); }
    75%      { transform: translateX(5px); }
}
.shake {
    animation: shake 0.8s ease-in-out;
}



.fade-in-on-scroll,
.zoom-in {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    will-change: opacity, transform;
}

.visible {
    opacity: 1;
    transform: none;
}