/*
|--------------------------------------------------------------------------
| PrimeScape Motion System
|--------------------------------------------------------------------------
*/


.ps-code-panel {
    animation:
        psFloatSlow
        6.5s
        ease-in-out
        infinite;
}


.ps-web-panel {
    animation:
        psFloatMedium
        5.3s
        ease-in-out
        infinite;
}


.ps-mobile-device {
    animation:
        psFloatPhone
        5.8s
        ease-in-out
        infinite;
}


.ps-ai-object {
    animation:
        psFloatSmall
        4.8s
        ease-in-out
        infinite;
}


.ps-cloud-object {
    animation:
        psFloatSmall
        5.5s
        ease-in-out
        infinite
        -2s;
}


.ps-security-object {
    animation:
        psFloatSmall
        6.1s
        ease-in-out
        infinite
        -3.2s;
}


.ps-stage-connections path {
    animation:
        psConnectionFlow
        15s
        linear
        infinite;
}


.ps-product-wave path {
    stroke-dasharray:
        1000;

    stroke-dashoffset:
        1000;

    animation:
        psDrawWave
        4.5s
        ease
        infinite;
}


.idea-ring.ring-a {
    animation:
        psIdeaRing
        6s
        linear
        infinite;
}


.idea-ring.ring-b {
    animation:
        psIdeaRingReverse
        8s
        linear
        infinite;
}


.ps-idea-orb {
    animation:
        psIdeaMorph
        7s
        ease-in-out
        infinite;
}


.ps-scroll-mouse i {
    animation:
        psScrollDot
        1.6s
        ease-in-out
        infinite;
}


@keyframes psFloatSlow {

    0%,
    100% {
        translate:
            0 0;
    }

    50% {
        translate:
            0 -12px;
    }

}


@keyframes psFloatMedium {

    0%,
    100% {
        translate:
            0 0;
    }

    50% {
        translate:
            0 -17px;
    }

}


@keyframes psFloatPhone {

    0%,
    100% {
        translate:
            0 0;
    }

    50% {
        translate:
            0 -13px;
    }

}


@keyframes psFloatSmall {

    0%,
    100% {
        translate:
            0 0;
    }

    50% {
        translate:
            0 -9px;
    }

}


@keyframes psConnectionFlow {

    from {
        stroke-dashoffset:
            0;
    }

    to {
        stroke-dashoffset:
            -180;
    }

}


@keyframes psDrawWave {

    0% {
        stroke-dashoffset:
            1000;

        opacity:
            .35;
    }

    45% {
        stroke-dashoffset:
            0;

        opacity:
            1;
    }

    100% {
        stroke-dashoffset:
            0;

        opacity:
            .8;
    }

}


@keyframes psIdeaRing {

    from {
        transform:
            rotate(0deg)
            scale(1);
    }

    50% {
        transform:
            rotate(180deg)
            scale(1.06);
    }

    to {
        transform:
            rotate(360deg)
            scale(1);
    }

}


@keyframes psIdeaRingReverse {

    from {
        transform:
            rotate(360deg);
    }

    to {
        transform:
            rotate(0deg);
    }

}


@keyframes psIdeaMorph {

    0%,
    100% {

        border-radius:
            43% 57% 50% 50% /
            48% 45% 55% 52%;

        transform:
            translateY(0);

    }

    50% {

        border-radius:
            57% 43% 58% 42% /
            42% 60% 40% 58%;

        transform:
            translateY(-12px);

    }

}


@keyframes psScrollDot {

    0% {
        transform:
            translateY(0);

        opacity:
            1;
    }

    70% {
        transform:
            translateY(11px);

        opacity:
            .2;
    }

    100% {
        transform:
            translateY(0);

        opacity:
            1;
    }

}


/*
|--------------------------------------------------------------------------
| Reduced Motion
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    *,
    *::before,
    *::after {
        scroll-behavior:
            auto !important;

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;
    }

}