/* Homepage v5 (desktop) — scroll reveal. Markup: [data-v5r] on blocks in components/home/v5.
 *   (default) rise  — fade + rise + blur (text blocks, cards)
 *   "pop"           — fade + small scale-up (chips, tabs, buttons)
 *   "stage"         — fade + rise + scale, no blur (canvas stages and big panels, where a blur is costly)
 *   "words"         — headings; reveal.js wraps each word in .v5r-w and they rise one after another
 * Hidden states exist only while <html> has .v5r (set inline in index.php: ≥768px, motion allowed).
 * Uses the individual translate/scale properties so inline transforms and hover transforms are untouched.
 * Script: assets/js/home-v5/reveal.js (its timing must cover the longest transition + delay here). */
.v5r-w { display: inline-block; }

@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
    html.v5r [data-v5r]:not(.v5r-in) {
        opacity: 0 !important;
        translate: 0 34px;
        filter: blur(8px);
    }
    html.v5r [data-v5r="pop"]:not(.v5r-in) {
        translate: 0 12px;
        scale: .9;
        filter: blur(4px);
    }
    html.v5r [data-v5r="stage"]:not(.v5r-in) {
        translate: 0 40px;
        scale: .95;
        filter: none;
    }
    /* Until reveal.js has split it the heading hides whole; afterwards its words carry the hidden state. */
    html.v5r [data-v5r="words"].v5r-split:not(.v5r-in) {
        opacity: 1 !important;
        translate: none;
        filter: none;
    }
    html.v5r [data-v5r="words"]:not(.v5r-in) .v5r-w {
        opacity: 0;
        translate: 0 .55em;
        filter: blur(6px);
    }

    html.v5r [data-v5r].v5r-run {
        transition:
            opacity .9s cubic-bezier(.33, 0, .2, 1) var(--v5r-d, 0ms),
            translate 1.2s cubic-bezier(.16, 1, .3, 1) var(--v5r-d, 0ms),
            scale 1.3s cubic-bezier(.16, 1, .3, 1) var(--v5r-d, 0ms),
            filter .9s cubic-bezier(.33, 0, .2, 1) var(--v5r-d, 0ms) !important;
    }
    html.v5r [data-v5r="words"].v5r-run .v5r-w {
        transition:
            opacity .8s cubic-bezier(.33, 0, .2, 1) calc(var(--v5r-d, 0ms) + var(--w, 0) * 60ms),
            translate 1.1s cubic-bezier(.16, 1, .3, 1) calc(var(--v5r-d, 0ms) + var(--w, 0) * 60ms),
            filter .8s cubic-bezier(.33, 0, .2, 1) calc(var(--v5r-d, 0ms) + var(--w, 0) * 60ms);
    }

    /* The hero has its own entrance (v5Rise in hero.php); hold it while the intro splash covers the page. */
    body.site-intro-pending .v5-hero,
    body.site-intro-pending .v5-hero * {
        animation-play-state: paused !important;
    }
}