/**
 * VVV Reveal Animations
 * Effekte sind strikt getrennt:
 * - blur: nur blur
 * - blur_fade: blur + opacity + move
 * - fade: opacity + move
 * - type: wortweise opacity
 */

:root {
    --vvv-reveal-offset-x: 0px;
    --vvv-reveal-offset-y: 20px;
    --vvv-reveal-blur: 12px;
}

/* Verhindert FOUC: Inhalte sind bereits vor JS-Init versteckt */
.vvv-reveal-enabled.vvv-reveal-preload .entry-title,
.vvv-reveal-enabled.vvv-reveal-preload .entry-meta,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h1,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h2,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h3,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h4,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h5,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content h6,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h1,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h2,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h3,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h4,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h5,
.vvv-reveal-enabled.vvv-reveal-preload .single-content h6,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h1,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h2,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h3,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h4,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h5,
.vvv-reveal-enabled.vvv-reveal-preload .entry-header h6,
.vvv-reveal-enabled.vvv-reveal-preload .hero h1,
.vvv-reveal-enabled.vvv-reveal-preload .hero h2,
.vvv-reveal-enabled.vvv-reveal-preload .hero h3,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content p,
.vvv-reveal-enabled.vvv-reveal-preload .single-content p,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content ul,
.vvv-reveal-enabled.vvv-reveal-preload .single-content ul,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content ol,
.vvv-reveal-enabled.vvv-reveal-preload .single-content ol,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content blockquote,
.vvv-reveal-enabled.vvv-reveal-preload .single-content blockquote,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content figure,
.vvv-reveal-enabled.vvv-reveal-preload .single-content figure,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content img,
.vvv-reveal-enabled.vvv-reveal-preload .single-content img,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content .wp-block-kadence-advancedheading,
.vvv-reveal-enabled.vvv-reveal-preload .single-content .wp-block-kadence-advancedheading,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content .wp-block-button__link,
.vvv-reveal-enabled.vvv-reveal-preload .single-content .wp-block-button__link,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content a.wp-element-button,
.vvv-reveal-enabled.vvv-reveal-preload .single-content a.wp-element-button,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content .kt-button,
.vvv-reveal-enabled.vvv-reveal-preload .single-content .kt-button,
.vvv-reveal-enabled.vvv-reveal-preload .entry-content .wp-block-kadence-advancedbtn a,
.vvv-reveal-enabled.vvv-reveal-preload .single-content .wp-block-kadence-advancedbtn a {
    opacity: 0;
    visibility: hidden;
}

.vvv-reveal-enabled .vvv-reveal-hidden {
    visibility: hidden;
}

.vvv-reveal-enabled .vvv-reveal-visible {
    visibility: visible;
}

.vvv-reveal-enabled .vvv-reveal-word {
    display: inline-block;
}

/* ---- BLUR (nur blur) ---- */
.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-hidden .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-block.vvv-reveal-hidden {
    opacity: 1;
    filter: blur(var(--vvv-reveal-blur));
    transform: none;
}

.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-visible .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-block.vvv-reveal-visible {
    opacity: 1;
    filter: blur(0);
    transform: none;
}

.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur .vvv-reveal-block {
    transition: filter 0.5s ease;
}

/* ---- BLUR + FADE + MOVE ---- */
.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-hidden .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-block.vvv-reveal-hidden {
    opacity: 0;
    filter: blur(var(--vvv-reveal-blur));
    transform: translate(var(--vvv-reveal-offset-x), var(--vvv-reveal-offset-y));
}

.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-visible .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-block.vvv-reveal-visible {
    opacity: 1;
    filter: blur(0);
    transform: translate(0, 0);
}

.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-blur_fade .vvv-reveal-block {
    transition: opacity 0.5s ease, filter 0.5s ease, transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ---- FADE + MOVE ---- */
.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-hidden .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-block.vvv-reveal-hidden {
    opacity: 0;
    transform: translate(var(--vvv-reveal-offset-x), var(--vvv-reveal-offset-y));
}

.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-visible .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-block.vvv-reveal-visible {
    opacity: 1;
    transform: translate(0, 0);
}

.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-fade .vvv-reveal-block {
    transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ---- TYPE (wortweise) ---- */
.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-hidden .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-block.vvv-reveal-hidden {
    opacity: 0;
    transform: none;
    filter: none;
}

.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-visible .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-block.vvv-reveal-visible {
    opacity: 1;
    transform: none;
    filter: none;
}

.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-word,
.vvv-reveal-enabled.vvv-reveal-effect-type .vvv-reveal-block {
    transition: opacity 0.35s ease;
}

@media (prefers-reduced-motion: reduce) {
    .vvv-reveal-enabled .vvv-reveal-hidden,
    .vvv-reveal-enabled .vvv-reveal-visible .vvv-reveal-word,
    .vvv-reveal-enabled .vvv-reveal-block {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }
}
