/* ==========================================
   SENTIQUE STUDIO — EDITORIAL REVEAL
========================================== */

@media (prefers-reduced-motion: no-preference) {

    html.st-motion-ready .st-reveal {
        opacity: 0;
        transform: translateY(26px);

        transition:
            opacity .8s ease,
            transform .8s cubic-bezier(.22, 1, .36, 1);

        transition-delay: var(--reveal-delay, 0ms);
    }

    html.st-motion-ready .st-reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ======================================================
   SENTIQUE STUDIO — HERO CINEMATIC REVEAL
   FLORIDA RETRO 1950s
====================================================== */

@media (prefers-reduced-motion: no-preference) {

    /* INITIAL STATE */

    .st-hero .st-eyebrow,
    .st-hero h1 .st-line,
    .st-hero .st-hero-description,
    .st-hero .st-hero-divider,
    .st-hero .st-hero-services,
    .st-hero .st-buttons {

        opacity: 0;

        transform: translateY(25px);

        animation: st-hero-entrance 1s
            cubic-bezier(.22, 1, .36, 1)
            forwards;

    }

    /* MAIN TITLE */

    .st-hero h1 .st-line {
        display: block;
    }

    /* ANIMATION DELAYS */

    .st-hero .st-eyebrow {
        animation-delay: .15s;
    }

    .st-hero h1 .st-line:nth-child(1) {
        animation-delay: .30s;
    }

    .st-hero h1 .st-line:nth-child(2) {
        animation-delay: .48s;
    }

    .st-hero .st-hero-description {
        animation-delay: .68s;
    }

    .st-hero .st-hero-divider {
        animation-delay: .82s;
    }

    .st-hero .st-hero-services {
        animation-delay: .92s;
    }

    .st-hero .st-buttons {
        animation-delay: 1.1s;
    }

}

/* ======================================================
   KEYFRAMES
====================================================== */

@keyframes st-hero-entrance {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}