@keyframes slide-horizontal-new {
    0% {
        transform: translateX(100%)
    }
}

@keyframes slide-horizontal-old {
    80% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translateX(-100%)
    }
}

@keyframes slide-vertical-new {
    0% {
        transform: translateY(-100%)
    }
}

@keyframes slide-vertical-old {
    80% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translateY(100%)
    }
}

@keyframes out-in-new {
    0% {
        opacity: 0
    }
}

@keyframes out-in-old {
    to {
        opacity: 0
    }
}

html[data-page-transition=SlideHorizontal]::view-transition-old(page-group) {
    animation: slide-horizontal-old .6s cubic-bezier(.83, 0, .17, 1) forwards;
    mix-blend-mode: normal
}

html[data-page-transition=SlideHorizontal]::view-transition-new(page-group) {
    animation: slide-horizontal-new .6s cubic-bezier(.83, 0, .17, 1) backwards;
    mix-blend-mode: normal
}

html[data-page-transition=SlideVertical]::view-transition-old(page-group) {
    animation: slide-vertical-old .6s cubic-bezier(.83, 0, .17, 1) forwards;
    mix-blend-mode: normal
}

html[data-page-transition=SlideVertical]::view-transition-new(page-group) {
    animation: slide-vertical-new .6s cubic-bezier(.83, 0, .17, 1) backwards;
    mix-blend-mode: normal
}

html[data-page-transition=OutIn]::view-transition-old(page-group) {
    animation: out-in-old .35s cubic-bezier(.64, 0, .78, 0) forwards
}

html[data-page-transition=OutIn]::view-transition-new(page-group) {
    animation: out-in-new .35s cubic-bezier(.22, 1, .36, 1) .35s backwards
}

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

    ::view-transition-group(*),
    ::view-transition-new(*),
    ::view-transition-old(*) {
        animation: none !important
    }
}

body,
html {
    background: transparent;
    border: 0;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline
}

body {
    --scrollbar-width: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px
}

body,
html {
    height: 100%
}

body {
    overflow-x: auto;
    overflow-y: scroll
}

body:not(.responsive) #site-root {
    min-width: var(--site-width);
    width: 100%
}

body:not([data-js-loaded]) [data-hide-prejs] {
    visibility: hidden
}

#SITE_CONTAINER {
    position: relative
}

:root {
    --one-unit: 1vw;
    --section-max-width: 9999px;
    --spx-stopper-max: 9999px;
    --spx-stopper-min: 0px
}

@supports(-webkit-appearance:none) and (stroke-color:transparent) {
    :root {
        --safari-sticky-fix: opacity
    }
}

@supports(container-type:inline-size) {
    :root {
        --one-unit: 1cqw
    }
}

[id^=oldHoverBox-] {
    mix-blend-mode: plus-lighter;
    transition: opacity .5s ease, visibility .5s ease
}

[data-mesh-id$=inlineContent-gridContainer]:has(>[id^=oldHoverBox-]) {
    isolation: isolate
}