@view-transition {
    navigation: auto;
}

:root {
    --page-transition-duration: 1000ms;
    --page-transition-ease: cubic-bezier(0.496, 0.004, 0, 1);
}

[data-hero-fixed-nav] {
    view-transition-name: entergroup-navigation;
}

[data-floating-contact] {
    view-transition-name: entergroup-floating-contact;
}

#wpadminbar {
    view-transition-name: entergroup-admin-bar;
}

::view-transition {
    background: #020202;
}

::view-transition-group(root) {
    z-index: 1;
    animation-duration: var(--page-transition-duration);
}

::view-transition-image-pair(root) {
    isolation: isolate;
}

::view-transition-old(root),
::view-transition-new(root) {
    width: 100%;
    height: 100%;
    mix-blend-mode: normal;
    backface-visibility: hidden;
}

::view-transition-old(root) {
    z-index: 1;
    animation: entergroup-page-dim var(--page-transition-duration) linear both;
}

::view-transition-new(root) {
    z-index: 2;
    animation: entergroup-page-reveal var(--page-transition-duration) var(--page-transition-ease) both;
}

::view-transition-group(entergroup-navigation),
::view-transition-group(entergroup-floating-contact),
::view-transition-group(entergroup-admin-bar) {
    z-index: 40;
    animation: none;
}

::view-transition-old(entergroup-navigation),
::view-transition-old(entergroup-floating-contact),
::view-transition-old(entergroup-admin-bar) {
    display: none;
}

::view-transition-new(entergroup-navigation),
::view-transition-new(entergroup-floating-contact),
::view-transition-new(entergroup-admin-bar) {
    animation: none;
    opacity: 1;
}

::view-transition-group(entergroup-admin-bar) {
    z-index: 100;
}

@keyframes entergroup-page-dim {
    from {
        filter: brightness(1);
    }

    to {
        filter: brightness(0.38);
    }
}

@keyframes entergroup-page-reveal {
    0% {
        clip-path: polygon(0 0, 100% 0, 100% 0, 0 -50%);
        filter: blur(14px);
        transform: translateZ(0) scale(1.012);
    }

    46% {
        filter: blur(5px);
    }

    72% {
        filter: blur(0);
    }

    100% {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        filter: blur(0);
        transform: translateZ(0) scale(1);
    }
}

[data-page-transition-layer] {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    visibility: hidden;
    pointer-events: none;
    background: #020202;
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 -50%);
    transform: translateZ(0);
    will-change: clip-path;
}

html.is-page-transition-leaving,
html.is-page-transition-entering {
    cursor: progress;
    overflow: clip;
}

html.is-page-transition-leaving [data-page-transition-layer] {
    visibility: visible;
    pointer-events: auto;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transition: clip-path 720ms var(--page-transition-ease);
}

html.is-page-transition-entering [data-page-transition-layer] {
    visibility: visible;
    pointer-events: auto;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

html.is-page-transition-entering.is-page-transition-entering-active [data-page-transition-layer] {
    clip-path: polygon(0 100%, 100% 150%, 100% 150%, 0 100%);
    transition: clip-path 820ms var(--page-transition-ease);
}

@media (prefers-reduced-motion: reduce) {
    @view-transition {
        navigation: none;
    }

    [data-page-transition-layer] {
        display: none !important;
    }

    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation-duration: 1ms !important;
    }
}
