#myplatz-page-transition {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    pointer-events: none;
    visibility: hidden;
}

#myplatz-page-transition .myplatz-page-transition__tint,
#myplatz-page-transition .myplatz-page-transition__surface {
    position: absolute;
    inset: 0;
    background: #fff;
    transform: translate3d(0, -100%, 0);
}

#myplatz-page-transition .myplatz-page-transition__tint {
    background: var(--myplatz-transition-color);
    opacity: .7;
}

#myplatz-page-transition .myplatz-page-transition__surface {
    display: grid;
    place-items: center;
    box-shadow: 0 -12px 40px rgb(0 0 0 / 8%), 0 12px 40px rgb(0 0 0 / 6%);
}

#myplatz-page-transition .myplatz-page-transition__icon {
    display: block;
    width: 64px;
    height: 64px;
    opacity: 0;
    transition: opacity 300ms ease-in-out;
}

#myplatz-page-transition .myplatz-page-transition__glyph {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--myplatz-transition-color);
    -webkit-mask: var(--myplatz-transition-icon) center / contain no-repeat;
    mask: var(--myplatz-transition-icon) center / contain no-repeat;
}

html.myplatz-transition-loading #myplatz-page-transition,
html.myplatz-transition-covering #myplatz-page-transition,
html.myplatz-transition-covered #myplatz-page-transition,
html.myplatz-transition-revealing #myplatz-page-transition {
    visibility: visible;
    pointer-events: auto;
}

html.myplatz-transition-loading #myplatz-page-transition > div,
html.myplatz-transition-covering #myplatz-page-transition > div,
html.myplatz-transition-covered #myplatz-page-transition > div {
    transform: translate3d(0, 0, 0);
}

html.myplatz-transition-covering #myplatz-page-transition .myplatz-page-transition__tint {
    transition: transform 900ms cubic-bezier(.45, 0, .2, 1);
}

html.myplatz-transition-covering #myplatz-page-transition .myplatz-page-transition__surface {
    transition: transform 900ms cubic-bezier(.45, 0, .2, 1) 100ms;
}

html.myplatz-transition-revealing #myplatz-page-transition > div {
    transform: translate3d(0, 100%, 0);
    transition: transform 1100ms cubic-bezier(.45, 0, .2, 1);
}

html.myplatz-transition-revealing #myplatz-page-transition .myplatz-page-transition__tint {
    transition-delay: 100ms;
}

/* Elementor may trigger entrances while the new document is still covered. */
html.myplatz-transition-loading .elementor-element.animated,
html.myplatz-transition-revealing .elementor-element.animated {
    animation-play-state: paused !important;
    animation-fill-mode: both;
}

html.myplatz-transition-icon-visible #myplatz-page-transition .myplatz-page-transition__icon {
    opacity: 1;
}

html.myplatz-transition-icon-waiting #myplatz-page-transition .myplatz-page-transition__glyph {
    animation: myplatz-transition-pulse 1800ms ease-in-out infinite;
}

@keyframes myplatz-transition-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .55; }
}

@media (prefers-reduced-motion: reduce) {
    #myplatz-page-transition {
        display: none;
    }
}
