:root {
    --home-motion-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

body.home-page .home-hero-intro .home-hero-line,
body.home-page .home-hero-intro .home-hero-copy {
    opacity: 0;
    filter: blur(10px);
    transform: translate3d(0, 36px, 0);
    animation: none !important;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-line,
body.home-page.home-motion-ready .home-hero-intro .home-hero-copy {
    animation: homeHeroContentIn 920ms var(--home-motion-ease-out) both !important;
    will-change: opacity, filter, transform;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-line:nth-child(1) {
    animation-delay: 120ms !important;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-line:nth-child(2) {
    animation-delay: 260ms !important;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-line:nth-child(3) {
    animation-delay: 400ms !important;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-line:nth-child(4) {
    animation-delay: 540ms !important;
}

body.home-page.home-motion-ready .home-hero-intro .home-hero-copy {
    animation-delay: 700ms !important;
}

body.home-page .home-area-reveal,
body.home-page .home-area-panel-reveal {
    opacity: 0;
    filter: blur(10px);
    animation: none !important;
    transition: none !important;
}

body.home-page .home-area-reveal {
    transform: translate3d(0, 42px, 0);
}

body.home-page .home-area-panel-reveal-left {
    transform: translate3d(-52px, 34px, 0) scale(0.975);
}

body.home-page .home-area-panel-reveal-right {
    transform: translate3d(52px, 34px, 0) scale(0.975);
}

body.home-page .home-area-reveal.is-visible {
    animation: homeAreaHeadingIn 850ms var(--home-motion-ease-out) 80ms both !important;
}

body.home-page .home-area-panel-reveal-left.is-visible {
    animation: homeAreaLeftIn 920ms var(--home-motion-ease-out) 220ms both !important;
}

body.home-page .home-area-panel-reveal-right.is-visible {
    animation: homeAreaRightIn 920ms var(--home-motion-ease-out) 380ms both !important;
}

body.home-page .home-action-visual,
body.home-page .home-action-story::after {
    opacity: 0 !important;
    transition: opacity 360ms var(--home-motion-ease-out) !important;
}

body.home-page.home-action-media-ready .home-action-visual {
    opacity: 0.94 !important;
}

body.home-page.home-action-media-ready .home-action-story::after {
    opacity: 1 !important;
}

/* I due gruppi entrano verso il centro, con lo stesso ritmo dell'area eventi. */
@media (prefers-reduced-motion: no-preference) {
    body.home-page .home-action-row-create {
        --action-entry-offset: -100px;
    }

    body.home-page .home-action-row-explore {
        --action-entry-offset: 100px;
    }

    body.home-page .home-action-row.is-reveal-ready > .home-action-card {
        opacity: 0;
        transform: translate3d(var(--action-entry-offset), 0, 0);
        animation: none !important;
        transition: none !important;
    }

    body.home-page .home-action-row.is-reveal-ready.is-visible > .home-action-card {
        animation: homeActionContentIn 920ms var(--home-motion-ease-out) 220ms both !important;
    }

    body.home-page .home-action-row.is-reveal-ready:focus-within > .home-action-card {
        opacity: 1;
        transform: none;
        animation: none !important;
    }
}

@keyframes homeActionContentIn {
    from {
        opacity: 0;
        transform: translate3d(var(--action-entry-offset), 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes homeHeroContentIn {
    from {
        opacity: 0;
        filter: blur(10px);
        transform: translate3d(0, 36px, 0);
    }
    to {
        opacity: 1;
        filter: blur(0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes homeAreaHeadingIn {
    from {
        opacity: 0;
        filter: blur(10px);
        transform: translate3d(0, 42px, 0);
    }
    to {
        opacity: 1;
        filter: blur(0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes homeAreaLeftIn {
    from {
        opacity: 0;
        filter: blur(10px);
        transform: translate3d(-52px, 34px, 0) scale(0.975);
    }
    to {
        opacity: 1;
        filter: blur(0);
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@keyframes homeAreaRightIn {
    from {
        opacity: 0;
        filter: blur(10px);
        transform: translate3d(52px, 34px, 0) scale(0.975);
    }
    to {
        opacity: 1;
        filter: blur(0);
        transform: translate3d(0, 0, 0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.home-page.home-motion-ready .home-hero-intro .home-hero-line,
    body.home-page.home-motion-ready .home-hero-intro .home-hero-copy,
    body.home-page .home-area-reveal.is-visible,
    body.home-page .home-area-panel-reveal.is-visible {
        filter: none;
        transform: none;
        animation-name: homeMotionFade !important;
        animation-duration: 180ms !important;
        animation-delay: 0ms !important;
    }

    body.home-page .home-action-visual,
    body.home-page .home-action-story::after {
        transition-duration: 180ms !important;
    }
}

@keyframes homeMotionFade {
    from { opacity: 0; }
    to { opacity: 1; }
}
