/*
 * Elemente nur ausblenden, nachdem JavaScript initialisiert wurde.
 * Dadurch bleiben Inhalte bei JavaScript-Fehlern immer sichtbar.
 */
html.umk-fade-ready .umk-fade {
    opacity: 0;
    transform: translate3d(0, 35px, 0);
    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}

/*
 * Sichtbarer Endzustand.
 */
html.umk-fade-ready .umk-fade.umk-fade-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/*
 * WordPress-Editor und Elementor-Editor nicht beeinträchtigen.
 */
.block-editor-page .umk-fade,
.elementor-editor-active .umk-fade {
    opacity: 1;
    transform: none;
}

/*
 * Betriebssystemeinstellung für reduzierte Bewegung respektieren.
 */
@media (prefers-reduced-motion: reduce) {
    html.umk-fade-ready .umk-fade,
    html.umk-fade-ready .umk-fade.umk-fade-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/*
 * In der Druckansicht alle Inhalte sichtbar darstellen.
 */
@media print {
    html.umk-fade-ready .umk-fade,
    html.umk-fade-ready .umk-fade.umk-fade-visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}