@import "https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&display=swap";

:root {
--_size: 1.8rem;
    --_font-default: "Funnel Sans", sans-serif;
    --_font-accent: "Funnel Display", sans-serif;
    --_radius-s: 1rem;
    --_radius-m: 1.6rem;
    --_radius-pt-m: 1.6rem;
    --_radius-l: 3.8rem;
    --_radius-xl: 6rem;
    --_animspeed-fast: .1s;
    --_animspeed-medium: .3s;
    --_animspeed-slow: .6s;
    --_animbezier: cubic-bezier(.23, .65, .74, 1.09);
    --base--light: #faf7f6;
    --base-rgb--light: 250, 247, 246;
    --base-tint--light: #fff;
    --base-shade--light: #e0dddb;
    --base-opp--light: #161616;
    --base-opp-tint--light: #1c1c1c;
    --accent--light: #9f8be7;
    --accent-rgb--light: 159, 139, 231;
    --additional--light: #9F8BE7;
    --additional-rgb--light: 221, 241, 96;
    --neutral-transparent--light: #ffffff4d;
    --st-bright--light: #161616;
    --st-medium--light: #7c7c7c;
    --st-muted--light: #e0dddb;
    --st-opp-bright--light: #fff;
    --fw-regular--light: 400;
    --fw-medium--light: 600;
    --fw-semibold--light: 700;
    --fw-bold--light: 800;
    --fw-regular-opp--light: 300;
    --fw-medium-opp--light: 500;
    --t-bright--light: #161616;
    --t-medium--light: #303030;
    --t-muted--light: #585858;
    --t-muted-extra--light: #b2aead;
    --t-opp-bright--light: #fff;
    --t-opp-medium--light: #acacac;
    --t-opp-muted--light: #838383;
    --bg-demo-screen-01--light: url(../../../img/demo/screens/01.webp);
    --bg-demo-screen-02--light: url(../../../img/demo/screens/02.webp);
    --bg-demo-screen-03--light: url(../../../img/demo/screens/03.webp);
    --bg-demo-screen-04--light: url(../../../img/demo/screens/04.webp);
    --bg-demo-screen-05--light: url(../../../img/demo/screens/05.webp);
    --bg-demo-screen-06--light: url(../../../img/demo/screens/06.webp);
    --bg-demo-screen-07--light: url(../../../img/demo/screens/07.webp);
    --bg-demo-screen-08--light: url(../../../img/demo/screens/08.webp);
    --bg-demo-screen-09--light: url(../../../img/demo/screens/09.webp);
    --base--dark: #161616;
    --base-rgb--dark: 22, 22, 22;
    --base-tint--dark: #1c1c1c;
    --base-shade--dark: #0a0a0a;
    --base-opp--dark: #faf7f6;
    --base-opp-tint--dark: #fff;
    --accent--dark: #9F8BE7;
    --accent-rgb--dark: 221, 241, 96;
    --additional--dark: #9f8be7;
    --additional-rgb--dark: 159, 139, 231;
    --neutral-transparent--dark: #0000004d;
    --st-bright--dark: #fff;
    --st-medium--dark: #646464;
    --st-muted--dark: #252525;
    --st-opp-bright--dark: #0f0f0f;
    --fw-regular--dark: 300;
    --fw-medium--dark: 500;
    --fw-semibold--dark: 600;
    --fw-bold--dark: 700;
    --fw-regular-opp--dark: 400;
    --fw-medium-opp--dark: 600;
    --t-bright--dark: #fff;
    --t-medium--dark: #acacac;
    --t-muted--dark: #838383;
    --t-muted-extra--dark: #535151;
    --t-opp-bright--dark: #161616;
    --t-opp-medium--dark: #303030;
    --t-opp-muted--dark: #969696;
    --bg-demo-screen-01--dark: url(../../../img/demo/screens/01-d.webp);
    --bg-demo-screen-02--dark: url(../../../img/demo/screens/02-d.webp);
    --bg-demo-screen-03--dark: url(../../../img/demo/screens/03-d.webp);
    --bg-demo-screen-04--dark: url(../../../img/demo/screens/04-d.webp);
    --bg-demo-screen-05--dark: url(../../../img/demo/screens/05-d.webp);
    --bg-demo-screen-06--dark: url(../../../img/demo/screens/06-d.webp);
    --bg-demo-screen-07--dark: url(../../../img/demo/screens/07-d.webp);
    --bg-demo-screen-08--dark: url(../../../img/demo/screens/08-d.webp);
    --bg-demo-screen-09--dark: url(../../../img/demo/screens/09-d.webp);
    --pt-base: #fff;
    --pt-base-dark: #161616;
    --pt-t-light-bright: #fff;
    --pt-t-dark-bright: #161616;
    --pt-st-light-bright: #fff;
    --pt-st-dark-bright: #161616;
    --pt-purple-rgb: 159, 139, 231;
    --pt-purple-dark-rgb: 33, 10, 113;
    --nl-white: #fff;
    --nl-black: #000
}

@media only screen and (min-width:768px) {
:root {
--_radius-m: 2.6rem;
        --_radius-l: 5rem;
        --_radius-xl: 8rem
}
}

@media only screen and (min-width:1200px) {
:root {
--_radius-xl: 8rem
}
}

@media (prefers-color-scheme:light) {
:root {
--base: var(--base--light);
        --base-rgb: var(--base-rgb--light);
        --base-tint: var(--base-tint--light);
        --base-shade: var(--base-shade--light);
        --base-opp: var(--base-opp--light);
        --base-opp-tint: var(--base-opp-tint--light);
        --accent: var(--accent--light);
        --accent-rgb: var(--accent-rgb--light);
        --additional: var(--additional--light);
        --additional-rgb: var(--additional-rgb--light);
        --neutral-transparent: var(--neutral-transparent--light);
        --st-bright: var(--st-bright--light);
        --st-medium: var(--st-medium--light);
        --st-muted: var(--st-muted--light);
        --st-opp-bright: var(--st-opp-bright--light);
        --fw-regular: var(--fw-regular--light);
        --fw-medium: var(--fw-medium--light);
        --fw-semibold: var(--fw-semibold--light);
        --fw-bold: var(--fw-bold--light);
        --fw-regular-opp: var(--fw-regular-opp--light);
        --fw-medium-opp: var(--fw-medium-opp--light);
        --t-bright: var(--t-bright--light);
        --t-medium: var(--t-medium--light);
        --t-muted: var(--t-muted--light);
        --t-muted-extra: var(--t-muted-extra--light);
        --t-opp-bright: var(--t-opp-bright--light);
        --t-opp-medium: var(--t-opp-medium--light);
        --t-opp-muted: var(--t-opp-muted--light);
        --bg-demo-screen-01: var(--bg-demo-screen-01--light);
        --bg-demo-screen-02: var(--bg-demo-screen-02--light);
        --bg-demo-screen-03: var(--bg-demo-screen-03--light);
        --bg-demo-screen-04: var(--bg-demo-screen-04--light);
        --bg-demo-screen-05: var(--bg-demo-screen-05--light);
        --bg-demo-screen-06: var(--bg-demo-screen-06--light);
        --bg-demo-screen-07: var(--bg-demo-screen-07--light);
        --bg-demo-screen-08: var(--bg-demo-screen-08--light);
        --bg-demo-screen-09: var(--bg-demo-screen-09--light)
}
}

@media (prefers-color-scheme:dark) {
:root {
--base: var(--base--dark);
        --base-rgb: var(--base-rgb--dark);
        --base-tint: var(--base-tint--dark);
        --base-shade: var(--base-shade--dark);
        --base-opp: var(--base-opp--dark);
        --base-opp-tint: var(--base-opp-tint--dark);
        --accent: var(--accent--dark);
        --accent-rgb: var(--accent-rgb--dark);
        --additional: var(--additional--dark);
        --additional-rgb: var(--additional-rgb--dark);
        --neutral-transparent: var(--neutral-transparent--dark);
        --st-bright: var(--st-bright--dark);
        --st-medium: var(--st-medium--dark);
        --fw-semibold: var(--fw-semibold--dark);
        --st-muted: var(--st-muted--dark);
        --st-opp-bright: var(--st-opp-bright--dark);
        --fw-regular: var(--fw-regular--dark);
        --fw-medium: var(--fw-medium--dark);
        --fw-bold: var(--fw-bold--dark);
        --fw-regular-opp: var(--fw-regular-opp--dark);
        --fw-medium-opp: var(--fw-medium-opp--dark);
        --t-bright: var(--t-bright--dark);
        --t-medium: var(--t-medium--dark);
        --t-muted: var(--t-muted--dark);
        --t-muted-extra: var(--t-muted-extra--dark);
        --t-opp-bright: var(--t-opp-bright--dark);
        --t-opp-medium: var(--t-opp-medium--dark);
        --t-opp-muted: var(--t-opp-muted--dark);
        --bg-demo-screen-01: var(--bg-demo-screen-01--dark);
        --bg-demo-screen-02: var(--bg-demo-screen-02--dark);
        --bg-demo-screen-03: var(--bg-demo-screen-03--dark);
        --bg-demo-screen-04: var(--bg-demo-screen-04--dark);
        --bg-demo-screen-05: var(--bg-demo-screen-05--dark);
        --bg-demo-screen-06: var(--bg-demo-screen-06--dark);
        --bg-demo-screen-07: var(--bg-demo-screen-07--dark);
        --bg-demo-screen-08: var(--bg-demo-screen-08--dark);
        --bg-demo-screen-09: var(--bg-demo-screen-09--dark)
}
}

[color-scheme=light] {
--base: var(--base--light);
    --base-rgb: var(--base-rgb--light);
    --base-tint: var(--base-tint--light);
    --base-shade: var(--base-shade--light);
    --base-opp: var(--base-opp--light);
    --base-opp-tint: var(--base-opp-tint--light);
    --accent: var(--accent--light);
    --accent-rgb: var(--accent-rgb--light);
    --additional: var(--additional--light);
    --additional-rgb: var(--additional-rgb--light);
    --neutral-transparent: var(--neutral-transparent--light);
    --st-bright: var(--st-bright--light);
    --st-medium: var(--st-medium--light);
    --st-muted: var(--st-muted--light);
    --st-opp-bright: var(--st-opp-bright--light);
    --fw-regular: var(--fw-regular--light);
    --fw-medium: var(--fw-medium--light);
    --fw-semibold: var(--fw-semibold--light);
    --fw-bold: var(--fw-bold--light);
    --fw-regular-opp: var(--fw-regular-opp--light);
    --fw-medium-opp: var(--fw-medium-opp--light);
    --t-bright: var(--t-bright--light);
    --t-medium: var(--t-medium--light);
    --t-muted: var(--t-muted--light);
    --t-muted-extra: var(--t-muted-extra--light);
    --t-opp-bright: var(--t-opp-bright--light);
    --t-opp-medium: var(--t-opp-medium--light);
    --t-opp-muted: var(--t-opp-muted--light);
    --bg-demo-screen-01: var(--bg-demo-screen-01--light);
    --bg-demo-screen-02: var(--bg-demo-screen-02--light);
    --bg-demo-screen-03: var(--bg-demo-screen-03--light);
    --bg-demo-screen-04: var(--bg-demo-screen-04--light);
    --bg-demo-screen-05: var(--bg-demo-screen-05--light);
    --bg-demo-screen-06: var(--bg-demo-screen-06--light);
    --bg-demo-screen-07: var(--bg-demo-screen-07--light);
    --bg-demo-screen-08: var(--bg-demo-screen-08--light);
    --bg-demo-screen-09: var(--bg-demo-screen-09--light)
}

[color-scheme=dark] {
--base: var(--base--dark);
    --base-rgb: var(--base-rgb--dark);
    --base-tint: var(--base-tint--dark);
    --base-shade: var(--base-shade--dark);
    --base-opp: var(--base-opp--dark);
    --base-opp-tint: var(--base-opp-tint--dark);
    --accent: var(--accent--dark);
    --accent-rgb: var(--accent-rgb--dark);
    --additional: var(--additional--dark);
    --additional-rgb: var(--additional-rgb--dark);
    --neutral-transparent: var(--neutral-transparent--dark);
    --st-bright: var(--st-bright--dark);
    --st-medium: var(--st-medium--dark);
    --st-muted: var(--st-muted--dark);
    --st-opp-bright: var(--st-opp-bright--dark);
    --fw-regular: var(--fw-regular--dark);
    --fw-medium: var(--fw-medium--dark);
    --fw-semibold: var(--fw-semibold--dark);
    --fw-bold: var(--fw-bold--dark);
    --fw-regular-opp: var(--fw-regular-opp--dark);
    --fw-medium-opp: var(--fw-medium-opp--dark);
    --t-bright: var(--t-bright--dark);
    --t-medium: var(--t-medium--dark);
    --t-muted: var(--t-muted--dark);
    --t-muted-extra: var(--t-muted-extra--dark);
    --t-opp-bright: var(--t-opp-bright--dark);
    --t-opp-medium: var(--t-opp-medium--dark);
    --t-opp-muted: var(--t-opp-muted--dark);
    --bg-demo-screen-01: var(--bg-demo-screen-01--dark);
    --bg-demo-screen-02: var(--bg-demo-screen-02--dark);
    --bg-demo-screen-03: var(--bg-demo-screen-03--dark);
    --bg-demo-screen-04: var(--bg-demo-screen-04--dark);
    --bg-demo-screen-05: var(--bg-demo-screen-05--dark);
    --bg-demo-screen-06: var(--bg-demo-screen-06--dark);
    --bg-demo-screen-07: var(--bg-demo-screen-07--dark);
    --bg-demo-screen-08: var(--bg-demo-screen-08--dark);
    --bg-demo-screen-09: var(--bg-demo-screen-09--dark)
}

.headline-img-01:before {
background-image: url(../../../img/illustrations/400x200_hdl-01.webp)
}

.headline-img-06:before {
background-image: url(../../../img/illustrations/400x200_hdl-06.webp)
}

*,
:after,
:before {
box-sizing: border-box
}

button:active,
button:focus {
outline: 0 !important
}

button::-moz-focus-inner {
border: 0 !important
}

input::-moz-focus-inner {
border: 0 !important
}

[type=search]::-webkit-search-cancel-button {
appearance: none
}

[type=search]::-webkit-search-decoration {
appearance: none
}

a:focus,
button:focus,
input:focus,
textarea:focus,
a,
button,
input,
select,
textarea {
-webkit-tap-highlight-color: transparent
}

::selection {
background-color: var(--accent);
    color: var(--t-opp-bright);
    text-shadow: none
}

::-webkit-scrollbar {
background: var(--base-shade);
    width: 6px;
    display: none
}

@media only screen and (min-width:768px) {
::-webkit-scrollbar {
display: block
}
}

::-webkit-scrollbar-track {
background-color: var(--base-shade)
}

::-webkit-scrollbar-thumb {
background-color: var(--accent);
    border-radius: var(--_radius-s)
}

html {
-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 100%;
    height: 100%;
    font-family: sans-serif;
    font-size: 62.5%
}

body {
width: 100%;
    min-width: 360px;
    font: normal 400 var(--_size) / 1.6 var(--_font-default);
    text-rendering: optimizelegibility;
    background-color: var(--base);
    color: var(--t-medium);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    overflow-x: unset !important
}

section {
width: 100%;
    min-width: 360px;
    position: relative
}

a {
-webkit-tap-highlight-color: transparent;
    -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
    transition: all var(--_animspeed-medium) var(--_animbezier);
    outline: 0;
    text-decoration: none
}

img {
width: 100%;
    height: auto;
    display: block
}

.overflow-hidden {
overflow: hidden !important
}

html.lenis,
html.lenis body {
height: auto
}

.lenis.lenis-smooth {
scroll-behavior: auto !important
}

.lenis.lenis-smooth [data-lenis-prevent] {
-ms-scroll-chaining: none;
    overscroll-behavior: contain
}

.lenis.lenis-stopped {
overflow: hidden
}

.lenis.lenis-scrolling iframe {
pointer-events: none
}

.mxd-page-content {
position: relative
}

.mxd-section {
width: 100%;
    min-width: 360px;
    position: relative
}

.mxd-section.padding-default {
padding-bottom: 14rem
}

.mxd-section.padding-pre-grid {
padding-bottom: 11rem
}

.mxd-section.padding-pre-manifest,
.mxd-section.padding-pre-manifest.mobile-point-subtitle {
padding-bottom: 13.7rem
}

.mxd-section.padding-stacked-section {
padding-bottom: 10.1rem
}

.mxd-section.padding-grid-pre-pinned {
padding-bottom: 13rem
}

.mxd-section.padding-grid-pre-mtext {
padding-bottom: 11.3rem
}

.mxd-section.padding-mtext-pre-grid {
padding-bottom: 9.8rem
}

.mxd-section.padding-mtext-pre-pinned {
padding-bottom: 10.8rem
}

@media only screen and (min-width:768px) {
.mxd-section.padding-default {
padding-bottom: 16rem
}

.mxd-section.padding-pre-grid {
padding-bottom: 13rem
}

.mxd-section.padding-pre-manifest {
padding-bottom: 13.9rem
}

.mxd-section.padding-pre-manifest.mobile-point-subtitle {
padding-bottom: 15.7rem
}

.mxd-section.padding-stacked-section {
padding-bottom: 11.3rem
}

.mxd-section.padding-grid-pre-pinned {
padding-bottom: 14.3rem
}

.mxd-section.padding-grid-pre-mtext {
padding-bottom: 10.4rem
}

.mxd-section.padding-mtext-pre-grid {
padding-bottom: 10.6rem
}

.mxd-section.padding-mtext-pre-pinned {
padding-bottom: 10.8rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section.padding-default {
padding-bottom: 16rem
}

.mxd-section.padding-pre-grid {
padding-bottom: 13rem
}

.mxd-section.padding-pre-manifest,
.mxd-section.padding-pre-manifest.mobile-point-subtitle {
padding-bottom: 13.9rem
}

.mxd-section.padding-grid-pre-pinned {
padding-bottom: 10rem
}

.mxd-section.padding-grid-pre-mtext {
padding-bottom: 10.4rem
}

.mxd-section.padding-mtext-pre-pinned {
padding-bottom: 7.6rem
}
}

@media only screen and (min-width:1600px) {
.mxd-section.padding-default {
padding-bottom: 20rem
}

.mxd-section.padding-pre-grid {
padding-bottom: 17rem
}

.mxd-section.padding-pre-manifest,
.mxd-section.padding-pre-manifest.mobile-point-subtitle {
padding-bottom: 17.9rem
}

.mxd-section.padding-stacked-section {
padding-bottom: 12.3rem
}

.mxd-section.padding-grid-pre-pinned {
padding-bottom: 11rem
}

.mxd-section.padding-grid-pre-mtext {
padding-bottom: 14.4rem
}

.mxd-section.padding-mtext-pre-grid {
padding-bottom: 14.6rem
}

.mxd-section.padding-mtext-pre-pinned {
padding-bottom: 5.6rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section.padding-hero-01 {
padding-top: 12rem
}
}

@media only screen and (min-width:1600px) {
.mxd-section.padding-hero-01 {
padding-top: 16rem
}
}

.mxd-section-inner-headline {
padding-top: 13rem
}

@media only screen and (min-width:768px) {
.mxd-section-inner-headline {
padding-top: 15rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section-inner-headline {
padding-top: 13.6rem
}
}

@media only screen and (min-width:1600px) {
.mxd-section-inner-headline {
padding-top: 17rem
}
}

.mxd-section-inner-headline.padding-default {
padding-bottom: 14rem
}

.mxd-section-inner-headline.padding-headline-pre-block {
padding-bottom: 13rem
}

.mxd-section-inner-headline.padding-headline-pre-grid {
padding-bottom: 10rem
}

@media only screen and (min-width:768px) {
.mxd-section-inner-headline.padding-default {
padding-bottom: 16rem
}

.mxd-section-inner-headline.padding-headline-pre-block {
padding-bottom: 14.6rem
}

.mxd-section-inner-headline.padding-headline-pre-grid {
padding-bottom: 11.6rem
}

.mxd-section-inner-headline.padding-s-text-pre-form {
padding-bottom: 0
}
}

@media only screen and (min-width:1200px) {
.mxd-section-inner-headline.padding-headline-pre-block {
padding-bottom: 14.2rem
}

.mxd-section-inner-headline.padding-headline-pre-grid {
padding-bottom: 11.2rem
}

.mxd-section-inner-headline.padding-s-text-pre-form {
padding-bottom: 3.2rem
}
}

@media only screen and (min-width:1600px) {
.mxd-section-inner-headline.padding-default {
padding-bottom: 20rem
}

.mxd-section-inner-headline.padding-headline-pre-block {
padding-bottom: 18rem
}

.mxd-section-inner-headline.padding-headline-pre-grid {
padding-bottom: 15rem
}

.mxd-section-inner-headline.padding-s-text-pre-form {
padding-bottom: 3rem
}
}

.mxd-container {
width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 3rem;
    position: relative
}

.mxd-container.fullwidth-container {
max-width: none;
    padding: 0
}

.mxd-container.grid-container {
padding: 0 1.5rem
}

@media only screen and (min-width:768px) {
.mxd-container {
padding: 0 6rem
}

.mxd-container.grid-container {
padding: 0 4.5rem
}
}

@media only screen and (min-width:1600px) {
.mxd-container {
padding: 0 9rem
}

.mxd-container.grid-container {
padding: 0 7.5rem
}
}

.mxd-grid-item {
margin-top: 3rem;
    padding: 0 1.5rem
}

.mxd-grid-item.no-margin {
margin: 0
}

.mxd-grid-item.no-margin-desktop {
margin-top: 3rem
}

@media only screen and (min-width:1200px) {
.mxd-grid-item.no-margin-desktop {
margin: 0
}
}

.mxd-block {
position: relative
}

.mxd-block__name {
position: relative
}

.mxd-block__name.name-manifest {
margin-bottom: 2.8rem;
    padding-top: 0
}

.mxd-block__name.name-inner-headline {
margin-bottom: .2rem
}

@media only screen and (min-width:768px) {
.mxd-block__name.name-manifest {
margin-bottom: 3.2rem
}

.mxd-block__name.name-inner-headline {
margin-bottom: .4rem
}
}

@media only screen and (min-width:1200px) {
.mxd-block__name.name-manifest {
margin-bottom: 0;
        padding-top: 1.5rem
}

.mxd-block__name.name-inner-headline {
margin-top: 2rem;
        margin-bottom: 0
}
}

@media only screen and (min-width:1600px) {
.mxd-block__name.name-inner-headline {
margin-top: 2.6rem
}
}

.inner-headline__title {
position: relative
}

.inner-headline__title.headline-img-before:before {
content: "";
    -moz-background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 4.2rem;
    width: 8rem;
    height: 4.3rem;
    margin-right: 1.6rem;
    display: inline-block
}

@media only screen and (min-width:768px) {
.inner-headline__title.headline-img-before:before {
width: 11rem;
        height: 5.8rem;
        margin-right: 2.2rem
}
}

@media only screen and (min-width:1200px) {
.inner-headline__title.headline-img-before:before {
width: 14rem;
        height: 7rem;
        margin-right: 2.6rem
}
}

@media only screen and (min-width:1600px) {
.inner-headline__title.headline-img-before:before {
width: 16rem;
        height: 8.4rem;
        margin-right: 3.3rem
}
}

.inner-headline__text {
margin-top: 3.3rem
}

@media only screen and (min-width:768px) {
.inner-headline__text {
margin-top: 4.9rem
}
}

@media only screen and (min-width:1200px) {
.inner-headline__text {
margin-top: 4.6rem
}
}

@media only screen and (min-width:1600px) {
.inner-headline__text {
margin-top: 5.9rem
}
}

.mxd-block__manifest.centered {
text-align: center
}

.mxd-manifest__controls {
margin-top: 4.4rem
}

@media only screen and (min-width:768px) {
.mxd-manifest__controls {
margin-top: 5rem
}
}

h1 {
font: normal var(--fw-medium) 6rem/1.1 var(--_font-accent);
    letter-spacing: -.06rem;
    color: var(--t-bright)
}

@media only screen and (min-width:768px) {
h1 {
font-size: 8rem
}
}

@media only screen and (min-width:1200px) {
h1 {
font-size: 10rem
}
}

@media only screen and (min-width:1600px) {
h1 {
font-size: 12rem
}
}

h2 {
font: normal var(--fw-medium) 4.4rem/1.1 var(--_font-accent);
    letter-spacing: -.06rem;
    color: var(--t-bright)
}

h2.opposite {
color: var(--t-opp-bright)
}

@media only screen and (min-width:768px) {
h2 {
font-size: 7rem
}
}

@media only screen and (min-width:1600px) {
h2 {
font-size: 7rem
}
}

h3 {
font: normal var(--fw-medium) 3.6rem/1.2 var(--_font-accent);
    color: var(--t-bright)
}

h3.opposite {
color: var(--t-opp-bright)
}

@media only screen and (min-width:768px) {
h3 {
font-size: 5rem
}
}

h4 {
font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
    color: var(--t-bright)
}

@media only screen and (min-width:1200px) {
h4 {
font-size: 4.4rem
}
}

h5 {
font: normal var(--fw-medium) 2.6rem/1.2 var(--_font-accent);
    color: var(--t-bright)
}

h5 small {
font: normal var(--fw-regular) 1.6rem/1.2 var(--_font-accent);
    color: var(--t-medium);
    margin-top: .2rem;
    display: block
}

h5 a {
color: var(--t-bright)
}

h5.opposite,
h5.opposite a {
color: var(--t-opp-bright)
}

@media only screen and (min-width:768px) {
h5 {
font-size: 3.4rem
}
}

@media only screen and (min-width:1600px) {
h5 small {
font-size: 1.8rem
}
}

h6 {
font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
    color: var(--t-bright)
}

h6 a {
color: var(--t-bright)
}

h6.opposite,
h6.opposite a {
color: var(--t-opp-bright)
}

@media only screen and (min-width:1200px) {
h6 {
font-size: 3rem
}
}

p {
font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
    color: var(--t-medium)
}

p a,
p span {
color: var(--t-bright)
}

p span {
font-weight: var(--fw-semibold)
}

p a {
background: -webkit-gradient(linear, left top, right top, from(var(--t-medium)), to(var(--t-medium))), -webkit-gradient(linear, left top, right top, from(#0000), to(#0000));
    background: -moz-linear-gradient(left, var(--t-medium), var(--t-medium)), -moz-linear-gradient(left, #0000, #0000);
    background: linear-gradient(to right, var(--t-medium), var(--t-medium)), linear-gradient(to right, #0000, #0000);
    -moz-background-size: 100% 1px, 0 1px;
    -webkit-transition: background-size .4s, color .3s;
    -moz-transition: background-size .4s, color .3s, -moz-background-size .4s;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 1px, 0 1px;
    text-decoration: none;
    transition: background-size .4s, color .3s, -moz-background-size .4s
}

p a.opposite {
background: -webkit-gradient(linear, left top, right top, from(var(--t-opp-medium)), to(var(--t-opp-medium))), -webkit-gradient(linear, left top, right top, from(#0000), to(#0000));
    background: -moz-linear-gradient(left, var(--t-opp-medium), var(--t-opp-medium)), -moz-linear-gradient(left, #0000, #0000);
    background: linear-gradient(to right, var(--t-opp-medium), var(--t-opp-medium)), linear-gradient(to right, #0000, #0000)
}

.no-touch p a:hover {
color: var(--t-bright);
    -moz-background-size: 0 1px, 100% 1px;
    background-size: 0 1px, 100% 1px
}

.no-touch p a:hover.opposite {
color: var(--t-opp-bright)
}

p.t-xsmall {
font-size: 1.4rem;
    line-height: 1.2
}

p.t-small-mobile {
font-size: 1.6rem
}

p.t-large {
font-family: var(--_font-accent);
    color: var(--t-bright);
    font-size: 2.5rem
}

p.t-muted {
color: var(--t-muted)
}

p.t-muted span {
color: var(--t-medium)
}

p.t-muted a {
font-weight: var(--fw-regular);
    color: var(--t-muted);
    background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted))), -webkit-gradient(linear, left top, right top, from(#0000), to(#0000));
    background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted)), -moz-linear-gradient(left, #0000, #0000);
    background: linear-gradient(to right, var(--t-muted), var(--t-muted)), linear-gradient(to right, #0000, #0000);
    -moz-background-size: 100% 1px, 0 1px;
    -webkit-transition: background-size .4s, color .3s;
    -moz-transition: background-size .4s, color .3s, -moz-background-size .4s;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 1px, 0 1px;
    text-decoration: none;
    transition: background-size .4s, color .3s, -moz-background-size .4s
}

.no-touch p.t-muted a:hover {
color: var(--t-medium);
    -moz-background-size: 0 1px, 100% 1px;
    background-size: 0 1px, 100% 1px
}

p.t-muted a.no-effect {
background: 0 0
}

p.t-opposite {
color: var(--t-opp-bright)
}

p.t-bright {
color: var(--t-bright)
}

p.t-bright.opposite {
color: var(--t-opp-bright)
}

@media only screen and (min-width:768px) {
p.t-small-mobile {
font-size: 1.8rem
}
}

@media only screen and (min-width:1600px) {
p {
font-size: 2.2rem
}

p.t-large {
font-size: 3rem
}

p.t-small-mobile {
font-size: 2.2rem
}
}

.mxd-point-subtitle {
align-items: center;
    -webkit-box-pack: left;
    -moz-box-pack: left;
    -ms-flex-pack: left;
    font: normal var(--fw-regular) 2.2rem/1.2 var(--_font-accent);
    color: var(--t-bright);
    justify-content: left;
    gap: 1rem;
    display: inline-flex
}

.mxd-point-subtitle svg {
width: 1.9rem;
    height: 1.9rem;
    fill: var(--t-bright)
}

.mxd-point-subtitle span {
font-weight: var(--fw-regular)
}

.mxd-point-subtitle a {
color: var(--t-bright);
    background: 0 0
}

.no-touch .mxd-point-subtitle:hover a {
color: var(--t-medium)
}

.mxd-manifest {
font: normal var(--fw-regular) 2.8rem/1.6 var(--_font-accent);
    color: var(--t-bright)
}

@media only screen and (min-width:768px) {
.mxd-manifest {
font-size: 4.4rem
}
}

@media only screen and (min-width:1600px) {
.mxd-manifest {
max-width: 855px
}
}



.no-touch .mxd-color-switcher:hover:before {
background-color: var(--base-tint);
    transform: translate(-50%)translateY(-50%)scale(1.04)
}

.no-touch .mxd-color-switcher:hover i {
transform: scale(.92)
}

@media only screen and (min-width:768px) {
.mxd-color-switcher {
width: 5.6rem;
        height: 5.6rem
}

.mxd-color-switcher i {
font-size: 3rem
}
}

.btn {
font: inherit;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    background-color: #0000;
    border: none;
    outline: 0;
    justify-content: center;
    align-items: center;
    gap: 1.4rem;
    padding: 0;
    text-decoration: none;
    display: inline-flex;
    position: relative
}

.btn-to-top {
-webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    width: 4.6rem;
    height: 4.6rem;
    color: var(--nl-white);
    mix-blend-mode: difference;
    font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    z-index: 9;
    background-color: #ffffff08;
    border-width: 2px;
    border-radius: 50%;
    position: fixed;
    bottom: 3rem;
    right: 3rem;
    overflow: hidden;
    transform: scale(1)
}

.btn-to-top i {
font-size: 2.2rem;
    display: inline-flex;
    position: relative;
    overflow: hidden
}

.no-touch .btn-to-top:hover {
transform: scale(1.04)
}

@media only screen and (min-width:768px) {
.btn-to-top {
width: 5.6rem;
        height: 5.6rem;
        bottom: 4rem;
        right: 6rem
}

.btn-to-top i {
font-size: 2.5rem
}
}

@media only screen and (min-width:1600px) {
.btn-to-top {
right: 9rem
}
}

.btn-line-xsmall {
font: normal var(--fw-regular) 1.4rem/1.2 var(--_font-accent);
    justify-content: flex-start;
    gap: .6rem;
    width: auto
}

.btn-line-xsmall .btn-caption,
.btn-line-xsmall i {
display: inline-flex;
    position: relative
}

.btn-line-xsmall i {
font-size: 1.6rem;
    overflow: hidden
}

.btn-default {
height: 5.6rem;
    line-height: 5.6rem;
    font: normal var(--fw-medium) 2.2rem/1.5 var(--_font-accent);
    border-width: 2px;
    border-radius: 2.8rem;
    gap: 1.2rem;
    padding: 0 2.2rem
}

.btn-default .btn-caption,
.btn-default i {
display: inline-flex;
    position: relative
}

.btn-default i {
font-size: 2.6rem;
    overflow: hidden
}

.btn-large {
height: 5.6rem;
    line-height: 5.6rem;
    font: normal var(--fw-medium) 2.2rem/1.5 var(--_font-accent);
    border-width: 2px;
    border-radius: 2.8rem;
    gap: 1.2rem;
    padding: 0 2.2rem
}

.btn-large i {
font-size: 2.6rem
}

@media only screen and (min-width:768px) {
.btn-large {
height: 8.4rem;
        line-height: 8.4rem;
        font: normal var(--fw-medium) 3rem/1.5 var(--_font-accent);
        border-width: 2px;
        border-radius: 4.2rem;
        gap: 1.6rem;
        padding: 0 3.2rem
}

.btn-large i {
font-size: 3.6rem
}
}

.btn-round {
width: 5.6rem;
    height: 5.6rem;
    font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    border-width: 2px;
    border-radius: 50%;
    transform: scale(1)
}

.btn-round i {
font-size: 2.5rem;
    display: inline-flex;
    position: relative;
    overflow: hidden
}

.no-touch .btn-round:hover {
transform: scale(1.04)
}

.btn-round-large {
border-width: 2px;
    width: 5.6rem;
    height: 5.6rem
}

.btn-round-large i {
font-size: 2.6rem
}

@media only screen and (min-width:768px) {
.btn-round-large {
width: 8.2rem;
        height: 8.2rem
}

.btn-round-large i {
font-size: 3rem
}
}

.btn-form {
width: 6rem;
    height: 6rem;
    font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
    -webkit-transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
    transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
    -moz-transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
    transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
    border-width: 2px;
    justify-content: end;
    transform: scale(1)
}

.btn-form i {
font-size: 2.6rem;
    display: inline-flex;
    position: relative;
    overflow: hidden
}

.no-touch .btn-form:hover {
transform: scale(1.04)
}

.btn-absolute-right {
position: absolute;
    top: 0;
    right: 0
}

.btn-fullwidth {
justify-content: space-between;
    width: 100%
}

.btn-outline {
border-style: solid;
    border-color: var(--st-bright);
    color: var(--t-bright);
    background-color: #0000
}

.btn-outline.opposite {
border-color: var(--st-opp-bright);
    color: var(--t-opp-bright)
}

.btn-additional {
background-color: var(--additional);
    border-style: solid;
    border-color: var(--additional);
    color: var(--t-bright)
}

.btn-opposite {
background-color: var(--base-opp);
    border-style: solid;
    border-color: var(--base-opp);
    color: var(--t-opp-bright)
}

.btn-base {
background-color: var(--base);
    border-style: solid;
    border-color: var(--base);
    color: var(--t-bright)
}

.btn-muted {
color: var(--t-muted);
    background-color: #0000
}

.no-touch .btn-muted:hover {
color: var(--t-bright)
}

.btn-anim:hover .btn-anim__letter {
transform: translateY(-100%)
}

.btn-anim .btn-caption {
height: 3.3rem;
    line-height: 3.3rem;
    overflow: hidden;
    display: block !important
}

.btn-anim__letter {
transition: -webkit-transform .5s cubic-bezier(.76, 0, .024, 1);
    -moz-transition: transform .5s cubic-bezier(.76, 0, .024, 1);
    transition: transform .5s cubic-bezier(.76, 0, .024, 1);
    display: inline-block
}

.btn-anim .btn-anim__block:last-child {
color: var(--primary)
}

.btn-anim__letter:first-child {
transition-delay: 0s
}

.btn-anim__letter:nth-child(2) {
transition-delay: 30ms
}

.btn-anim__letter:nth-child(3) {
transition-delay: 60ms
}

.btn-anim__letter:nth-child(4) {
transition-delay: 90ms
}

.btn-anim__letter:nth-child(5) {
transition-delay: .12s
}

.btn-anim__letter:nth-child(6) {
transition-delay: .15s
}

.btn-anim__letter:nth-child(7) {
transition-delay: .18s
}

.btn-anim__letter:nth-child(8) {
transition-delay: .21s
}

.btn-anim__letter:nth-child(9) {
transition-delay: .24s
}

.btn-anim__letter:nth-child(10) {
transition-delay: .27s
}

.btn-anim__letter:nth-child(11) {
transition-delay: .3s
}

.btn-anim__letter:nth-child(12) {
transition-delay: .33s
}

.btn-anim__letter:nth-child(13) {
transition-delay: .36s
}

.btn-anim__letter:nth-child(14) {
transition-delay: .39s
}

.btn-anim__letter:nth-child(15) {
transition-delay: .42s
}

.btn-anim__letter:nth-child(16) {
transition-delay: .45s
}

.btn-anim__letter:nth-child(17) {
transition-delay: .48s
}

.btn-anim__letter:nth-child(18) {
transition-delay: .51s
}

.btn-anim__letter:nth-child(19) {
transition-delay: .54s
}

.btn-anim__letter:nth-child(20) {
transition-delay: .57s
}

.btn-anim__letter:nth-child(21) {
transition-delay: .6s
}

.btn-anim__letter:nth-child(22) {
transition-delay: .63s
}

.btn-anim__letter:nth-child(23) {
transition-delay: .66s
}

.btn-anim__letter:nth-child(24) {
transition-delay: .69s
}

.btn-anim__letter:nth-child(25) {
transition-delay: .72s
}

.btn-anim__letter:nth-child(26) {
transition-delay: .75s
}

.btn-anim__letter:nth-child(27) {
transition-delay: .78s
}

.btn-anim__letter:nth-child(28) {
transition-delay: .81s
}

.btn-anim__letter:nth-child(29) {
transition-delay: .84s
}

.btn-anim__letter:nth-child(30) {
transition-delay: .87s
}

.btn-mobile-icon {
-webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: 50%;
    width: 4.6rem;
    height: 4.6rem;
    padding: 0
}

.btn-mobile-icon i {
font-size: 2rem
}

.btn-mobile-icon .btn-caption {
display: none !important
}

@media only screen and (min-width:768px) {
.btn-mobile-icon {
border-radius: 2.8rem;
        width: auto;
        height: 5.6rem;
        padding: 0 2.2rem
}

.btn-mobile-icon i {
font-size: 2.6rem
}

.btn-mobile-icon .btn-caption {
display: block !important
}
}

.tag {
font: inherit;
    -webkit-user-select: none;
    user-select: none;
    background-color: #0000;
    border: none;
    outline: 0;
    justify-content: center;
    align-items: center;
    gap: .8rem;
    padding: 0;
    text-decoration: none;
    display: inline-flex;
    position: relative
}

.tag-default {
height: 3.2rem;
    line-height: 3.2rem;
    font: normal var(--fw-regular) 1.4rem/1.5 var(--_font-accent);
    border-width: 1px;
    border-radius: 1.6rem;
    padding: 0 1.2rem
}

@media only screen and (min-width:1600px) {
.tag-default {
border-radius: 1.8rem;
        height: 3.6rem;
        padding: 0 1.4rem;
        font-size: 1.6rem;
        line-height: 3.6rem
}
}

.tag-outline {
border-style: solid;
    border-color: var(--st-bright);
    color: var(--t-bright);
    background-color: #0000
}

.tag-outline-opposite {
border-style: solid;
    border-color: var(--st-opp-bright);
    color: var(--t-opp-bright);
    background-color: #0000
}

.slide-right:hover i:before {
-webkit-animation: .6s var(--_animbezier) .3s 1 both slideRight;
    -moz-animation: .6s var(--_animbezier) .3s 1 both slideRight;
    animation: .6s var(--_animbezier) .3s 1 both slideRight
}

.slide-right-up:hover i:before {
-webkit-animation: .6s var(--_animbezier) .3s 1 both slideRightUp;
    -moz-animation: .6s var(--_animbezier) .3s 1 both slideRightUp;
    animation: .6s var(--_animbezier) .3s 1 both slideRightUp
}

.slide-up:hover i:before {
-webkit-animation: .6s var(--_animbezier) 0s 1 both slideUp;
    -moz-animation: .6s var(--_animbezier) 0s 1 both slideUp;
    animation: .6s var(--_animbezier) 0s 1 both slideUp
}

.anim-no-delay:hover i:before {
animation-delay: 0s
}

@keyframes slideRight {
0% {
        transform: translate(0)
    }

    50% {
        transform: translate(100%)
    }

    51% {
        opacity: 0
    }

    52% {
        opacity: 0;
        transform: translate(-100%)
    }

    53% {
        opacity: 1
    }

    to {
        transform: translate(0)
    }
}

@keyframes slideRightUp {
0% {
        transform: translate(0)translateY(0)
    }

    50% {
        transform: translate(100%)translateY(-100%)
    }

    51% {
        opacity: 0
    }

    52% {
        opacity: 0;
        transform: translate(-100%)translateY(100%)
    }

    53% {
        opacity: 1
    }

    to {
        transform: translate(0)translateY(0)
    }
}

@keyframes slideUp {
0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-100%)
    }

    51% {
        opacity: 0
    }

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

    53% {
        opacity: 1
    }

    to {
        transform: translateY(0)
    }
}

.form-container {
position: relative
}

.form {
opacity: 1;
    -webkit-transition: opacity var(--_animspeed-slow) ease-in-out;
    -moz-transition: opacity var(--_animspeed-slow) ease-in-out;
    transition: opacity var(--_animspeed-slow) ease-in-out
}

form {
width: 100%;
    position: relative
}

form input,
form textarea {
border: none;
    border-bottom: 2px solid var(--st-medium);
    width: 100%;
    font: normal var(--fw-regular) 2.2rem var(--_font-accent);
    height: 6rem;
    color: var(--t-bright);
    background-color: #0000;
    outline: 0;
    margin: 0;
    padding: 1.2rem .2rem;
    line-height: 6rem;
    display: block;
    position: relative
}

form input:focus,
form textarea:focus {
border-bottom: 2px solid var(--st-bright)
}

form textarea {
resize: none;
    height: 16rem;
    line-height: 1.6
}

form ::-webkit-input-placeholder {
color: var(--t-muted)
}

form :-moz-placeholder-shown {
color: var(--t-muted)
}

form ::-moz-placeholder {
color: var(--t-muted)
}

form :-ms-placeholder-shown {
color: var(--t-muted)
}

form input:focus:required:invalid,
form textarea:focus:required:invalid,
form input:required:valid,
form textarea:required:valid {
color: var(--t-bright)
}

@media only screen and (min-width:768px) {
form textarea {
height: 23rem
}
}

@media only screen and (min-width:1600px) {
form input,
form textarea {
font-size: 2.2rem
}
}

.form__reply {
opacity: 0;
    -webkit-transition: opacity var(--_animspeed-slow) ease-in-out;
    -moz-transition: opacity var(--_animspeed-slow) ease-in-out;
    transition: opacity var(--_animspeed-slow) ease-in-out;
    position: absolute;
    inset: auto auto 0 0
}

.form__reply.centered {
max-width: 400px;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%)translateY(-50%)
}

.form__reply.is-visible {
opacity: 1
}

.reply__icon {
color: var(--t-bright);
    margin-bottom: 1.2rem;
    font-size: 6rem;
    display: block
}

.reply__title {
font: normal var(--fw-medium) 3.6rem/1.2 var(--_font-accent);
    color: var(--t-bright);
    margin-bottom: 1.4rem
}

.reply__text {
font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
    color: var(--t-medium);
    display: block
}

.mxd-logo {
align-items: center;
    -webkit-box-pack: left;
    -moz-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    gap: 1rem;
    display: inline-flex
}

@media only screen and (min-width:768px) {
.mxd-logo {
gap: 1.4rem
}
}

.mxd-logo__image {
width: 4.6rem;
    height: auto;
    display: block
}

@media only screen and (min-width:768px) {
.mxd-logo__image {
width: 5.6rem
}
}

.mxd-section-title {
text-align: left;
    flex-direction: column;
    gap: 3.4rem;
    margin-bottom: 7rem;
    display: flex
}

.mxd-section-title.h2-only {
margin-bottom: 6.2rem
}

.mxd-section-title.no-margin {
margin: 0
}

@media only screen and (min-width:768px) {
.mxd-section-title {
margin-bottom: 8rem
}

.mxd-section-title.h2-only {
margin-bottom: 6.6rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section-title {
margin-bottom: 6.7rem
}

.mxd-section-title.no-margin-desktop {
margin-bottom: 0
}
}

@media only screen and (min-width:1600px) {
.mxd-section-title {
gap: 4.2rem;
        margin-bottom: 6.7rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section-title__title.card-split-title {
margin-top: -1.6rem
}
}

@media only screen and (min-width:1200px) {
.mxd-section-title__hrtitle {
margin-bottom: 0;
        padding-right: 6rem
}
}

.mxd-divider {
-moz-border-radius: var(--_radius-l);
    border-radius: var(--_radius-l);
    height: 460px;
    position: relative;
    overflow: hidden
}

@media only screen and (min-width:768px) {
.mxd-divider {
height: 600px
}
}

@media only screen and (min-width:1200px) {
.mxd-divider {
height: 760px
}
}

@media only screen and (min-width:1600px) {
.mxd-divider {
height: 930px
}
}

.mxd-divider__image {
-moz-background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 460px;
    position: relative;
    overflow: hidden
}

.mxd-divider__image img {
-o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%
}

@media only screen and (min-width:768px) {
.mxd-divider__image {
height: 600px
}
}

@media only screen and (min-width:1200px) {
.mxd-divider__image {
height: 760px
}
}

@media only screen and (min-width:1600px) {
.mxd-divider__image {
height: 930px
}
}

.bg-accent {
background-color: var(--accent)
}

.bg-base-tint {
background-color: var(--base-tint)
}

.bg-base-opp {
background-color: var(--base-opp)
}

.t-additional {
color: var(--additional)
}

.mxd-header {
width: 100%;
    width: -moz-calc(100% - 11.6rem);
    z-index: 101;
    opacity: 1;
    width: calc(100% - 11.6rem);
    -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
    transition: all var(--_animspeed-medium) var(--_animbezier);
    justify-content: space-between;
    padding-top: 3rem;
    display: flex;
    position: absolute;
    top: 0;
    left: 3rem;
    transform: scaleY(1)
}

@media only screen and (min-width:768px) {
.mxd-header {
width: -moz-calc(100% - 19.6rem);
        width: calc(100% - 19.6rem);
        padding-top: 4rem;
        left: 6rem
}
}

@media only screen and (min-width:1600px) {
.mxd-header {
width: -moz-calc(100% - 25.6rem);
        width: calc(100% - 25.6rem);
        left: 9rem
}
}

.mxd-header__logo {
display: flex;
    position: relative
}

.mxd-header__controls {
gap: 1rem;
    display: flex;
    position: relative
}

@media only screen and (min-width:768px) {
.mxd-header__controls {
gap: 0.5rem;
}
}

.mxd-nav__wrap {
z-index: 102;
    position: fixed;
    inset: auto 0
}

.mxd-nav__contain {
z-index: 2;
    pointer-events: none;
    justify-content: flex-end;
    align-items: center;
    min-height: 4.6rem;
    margin-top: 3rem;
    padding: 0 3rem;
    display: flex;
    position: relative
}

.mxd-nav__contain>* {
pointer-events: auto
}

@media only screen and (min-width:768px) {
.mxd-nav__contain {
min-height: 5.6rem;
        margin-top: 4rem;
        padding: 0 6rem
}
}

@media only screen and (min-width:1600px) {
.mxd-nav__contain {
padding: 0 9rem
}
}

.mxd-nav__hamburger {
flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    width: 4.6rem;
    height: 4.6rem;
    display: flex;
    position: relative
}

@media only screen and (min-width:768px) {
.mxd-nav__hamburger {
width: 5.6rem;
        height: 5.6rem
}
}

.hamburger__base {
-moz-border-radius: var(--_radius-l);
    border-radius: var(--_radius-l);
    background-color: var(--base-opp-tint);
    z-index: 1;
    position: absolute;
    inset: 0
}

.hamburger__line {
background-color: var(--t-opp-bright);
    z-index: 2;
    border-radius: .3rem;
    flex: none;
    width: 50%;
    height: .2rem;
    position: relative
}

.mxd-menu__wrapper {
z-index: 1;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    height: 100vh;
    padding: 1.5rem;
    display: none;
    position: absolute;
    inset: 0 0 auto
}

@media only screen and (min-width:768px) {
.mxd-menu__wrapper {
padding: 2rem 4rem
}
}

@media only screen and (min-width:1600px) {
.mxd-menu__wrapper {
padding: 2rem 7rem
}
}

.mxd-menu__base {
z-index: 1;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0
}

.mxd-menu__contain {
flex-direction: column;
    width: 100%;
    max-width: 100%;
    height: 100%;
    display: flex;
    position: relative
}

.mxd-menu__inner {
overscroll-behavior-y: contain;
    scrollbar-width: none;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding-top: 7.6rem;
    display: flex;
    position: relative;
    overflow-y: scroll
}

.mxd-menu__inner::-webkit-scrollbar {
height: 0;
    display: none;
    -webkit-appearance: none !important;
    width: 0 !important
}

@media only screen and (min-width:768px) {
.mxd-menu__inner::-webkit-scrollbar {
display: none;
        width: 0 !important
}
}

@media only screen and (min-width:1200px) {
.mxd-menu__inner {
flex-direction: row;
        padding-top: 0;
        padding-bottom: 9.7rem;
        overflow: hidden
}
}

@media only screen and (min-width:1600px) {
.mxd-menu__inner {
padding-bottom: 13.7rem
}
}

.mxd-menu__left {
z-index: 2;
    width: 100%;
    height: auto;
    padding: 0 3rem
}

@media only screen and (min-width:1200px) {
.mxd-menu__left {
overscroll-behavior-y: contain;
        scrollbar-width: none;
        width: 50%;
        height: 100%;
        padding: 4rem 4rem 0;
        overflow-y: scroll
}

.mxd-menu__left::-webkit-scrollbar {
height: 0;
        display: none;
        -webkit-appearance: none !important;
        width: 0 !important
}
}

@media only screen and (min-width:1600px) {
.mxd-menu__left {
padding: 6rem 7rem 0
}
}

.mxd-menu__right {
z-index: 2;
    padding-top: 5.2rem;
    position: relative
}

@media only screen and (min-width:1200px) {
.mxd-menu__right {
width: 50%;
        height: 100%;
        padding-top: 0
}
}

.mxd-menu__data {
justify-content: flex-start;
    -webkit-box-align: left;
    -moz-box-align: left;
    -ms-flex-align: left;
    align-items: left;
    text-align: center;
    z-index: 2;
    flex-direction: column;
    gap: .6rem;
    width: 100%;
    margin-top: 2.4rem;
    padding: 0 3rem 2.6rem;
    display: flex;
    position: relative
}

.mxd-menu__data p {
color: var(--t-opp-medium)
}

.mxd-menu__data p a {
color: var(--t-opp-medium);
    background: -webkit-gradient(linear, left top, right top, from(var(--t-opp-muted)), to(var(--t-opp-muted))), -webkit-gradient(linear, left top, right top, from(#0000), to(#0000));
    background: -moz-linear-gradient(left, var(--t-opp-muted), var(--t-opp-muted)), -moz-linear-gradient(left, #0000, #0000);
    background: linear-gradient(to right, var(--t-opp-muted), var(--t-opp-muted)), linear-gradient(to right, #0000, #0000);
    -moz-background-size: 100% 1px, 0 1px;
    -webkit-transition: background-size .4s, color .3s;
    -moz-transition: background-size .4s, color .3s, -moz-background-size .4s;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 1px, 0 1px;
    text-decoration: none;
    transition: background-size .4s, color .3s, -moz-background-size .4s
}

.no-touch .mxd-menu__data p a:hover {
color: var(--t-opp-bright);
    -moz-background-size: 0 1px, 100% 1px;
    background-size: 0 1px, 100% 1px
}

@media only screen and (min-width:1200px) {
.mxd-menu__data {
flex-direction: row;
        justify-content: space-between;
        width: 100%;
        margin-top: 0;
        padding: 0 4rem;
        position: absolute;
        bottom: 4rem;
        left: 0
}
}

@media only screen and (min-width:1600px) {
.mxd-menu__data {
padding: 0 7rem;
        bottom: 6rem
}
}

.mxd-menu__caption {
font-weight: var(--fw-regular-opp);
    color: var(--t-opp-medium);
    margin-bottom: 4.4rem
}

@media only screen and (min-width:1200px) {
.mxd-menu__caption {
max-width: 380px
}
}

@media only screen and (min-width:1600px) {
.mxd-menu__caption {
max-width: 460px
}
}

.main-menu {
position: relative
}

.main-menu__accordion {
flex-direction: column;
    gap: 1.6rem;
    display: flex
}

@media only screen and (min-width:1200px) {
.main-menu__accordion {
gap: 2rem
}
}

.main-menu__item {
width: 100%;
    color: var(--t-opp-bright);
    flex-direction: column;
    align-items: flex-start;
    display: flex;
    position: relative
}

.main-menu__item a {
display: inline-block
}

.main-menu__link {
height: 4.2rem;
    line-height: 4.2rem;
    font: normal var(--fw-medium-opp) 3.6rem var(--_font-accent);
    color: var(--t-opp-bright)
}

.main-menu__link .btn-caption {
height: 4.2rem;
    line-height: 4.2rem
}

@media only screen and (min-width:1200px) {
.main-menu__link {
height: 6.5rem;
        font-size: 5.6rem;
        line-height: 6.5rem
}

.main-menu__link .btn-caption {
height: 6.5rem;
        line-height: 6.5rem
}
}

.menu-promo {
padding: 0 3rem;
    position: relative
}

@media only screen and (min-width:768px) {
.menu-promo {
padding: 0 4rem
}
}

@media only screen and (min-width:1200px) {
.menu-promo {
text-align: right;
        height: 100%
}
}

@media only screen and (min-width:1600px) {
.menu-promo {
padding: 0 7rem
}
}

.menu-promo__content {
flex-direction: column;
    gap: 2.1rem;
    display: flex
}

@media only screen and (min-width:1200px) {
.menu-promo__content {
align-items: flex-end;
        gap: 3rem;
        width: 80%;
        padding: 0 4rem;
        position: absolute;
        bottom: 0;
        right: 0
}
}

@media only screen and (min-width:1600px) {
.menu-promo__content {
padding: 0 7rem
}
}

.menu-promo__caption {
font-weight: var(--fw-regular-opp);
    color: var(--t-opp-medium)
}

@media only screen and (min-width:1200px) {
.menu-promo__caption {
max-width: 380px
}
}

@media only screen and (min-width:1600px) {
.menu-promo__caption {
max-width: 460px
}
}

.menu-promo__video {
position: relative;
    overflow: hidden
}

@media only screen and (min-width:1200px) {
.menu-promo__video {
-moz-border-radius: var(--_radius-m);
        border-radius: var(--_radius-m);
        background-color: var(--base-opp);
        width: 100%;
        height: auto;
        padding: 1rem
}
}

.menu-video {
-o-object-fit: cover;
    object-fit: cover;
    -moz-border-radius: var(--_radius-m);
    border-radius: var(--_radius-m);
    width: 100%;
    height: 100%;
    display: block
}

@media only screen and (min-width:1200px) {
.menu-video {
border-radius: 1.8rem
}
}

.mxd-footer {
width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding-bottom: 3rem;
    position: relative
}

@media only screen and (min-width:768px) {
.mxd-footer {
padding-bottom: 6rem
}
}

.mxd-footer__footer-blocks {
flex-direction: column;
    gap: 3rem;
    width: 100%;
    max-width: 1920px;
    padding: 0 3rem;
    display: flex;
    position: relative
}

@media only screen and (min-width:768px) {
.mxd-footer__footer-blocks {
padding: 0 6rem
}
}

@media only screen and (min-width:1200px) {
.mxd-footer__footer-blocks {
flex-direction: row
}
}

@media only screen and (min-width:1600px) {
.mxd-footer__footer-blocks {
padding: 0 9rem
}
}

.footer-blocks__column {
flex-direction: column;
    flex: 1;
    gap: 3rem;
    display: flex
}

@media only screen and (min-width:1200px) {
.footer-blocks__column {
height: 650px
}
}

@media only screen and (min-width:1600px) {
.footer-blocks__column {
height: 650px
}
}

.footer-blocks__card {
background-color: #ffffff;
    -moz-border-radius: var(--_radius-m);
    border-radius: var(--_radius-m);
    flex-direction: column;
    gap: 3rem;
    width: 100%;
    padding: 3rem;
    display: flex
}

.footer-blocks__card.fullheight-card {
justify-content: space-between;
    height: 100%
}

@media only screen and (min-width:768px) {
.footer-blocks__card {
padding: 5rem
}
}

.footer-blocks__block {
flex-direction: column;
    gap: 3rem;
    display: flex
}

.footer-blocks__nav {
position: relative
}

.footer-nav {
flex-direction: column;
    gap: 1.6rem;
    display: flex
}

.footer-nav__item {
align-items: center;
    gap: 1.2rem;
    display: inline-flex
}

.footer-nav__link {
font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
    color: var(--t-bright);
    display: inline-flex
}

.footer-nav__link .btn-caption {
height: 3.6rem;
    line-height: 1.2
}

@media only screen and (min-width:768px) {
.footer-nav__link {
font-size: 4.4rem
}

.footer-nav__link .btn-caption {
height: 5.3rem
}
}

.footer-blocks__links {
text-align: left;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem;
    display: flex
}

.footer-blocks__links p {
text-align: left;
    justify-content: flex-start;
    align-items: center;
    gap: .2rem;
    display: flex
}

.no-touch .footer-blocks__links p a:hover {
color: var(--t-bright)
}

@media only screen and (min-width:768px) {
.footer-blocks__links {
flex-direction: row;
        justify-content: space-between
}
}

.footer-blocks__title {
position: relative
}

.footer-blocks__title-m {
font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
    color: var(--t-bright)
}

@media only screen and (min-width:768px) {
.footer-blocks__title-m {
font-size: 3.6rem
}
}

.footer-blocks__socials {
position: relative
}

.footer-socials {
flex-direction: column;
    display: flex
}

.footer-socials__item {
margin-bottom: .3rem;
    display: block
}

.footer-socials__item:last-of-type {
margin-bottom: 0
}

.footer-socials__link {
font: normal var(--fw-regular) 2.2rem/1.6 var(--_font-accent);
    color: var(--t-bright)
}

.no-touch .footer-socials__link:hover {
color: var(--t-medium)
}

.mxd-pinned-universal {
position: relative
}

.mxd-pinned-universal__static-inner {
text-align: center
}

@media only screen and (min-width:1200px) {
.mxd-pinned-universal__static-inner {
text-align: left;
        padding-top: 6rem;
        position: sticky;
        top: 0
}
}

@media only screen and (min-width:1600px) {
.mxd-pinned-universal__static-inner {
padding-top: 9rem
}
}

@media only screen and (min-width:1200px) {
.mxd-pinned-universal__scroll {
grid-column-gap: 1.2rem;
        grid-row-gap: 1.2rem;
        flex-flow: column;
        justify-content: flex-start;
        align-items: stretch;
        padding-top: 6rem;
        display: flex
}
}

@media only screen and (min-width:1600px) {
.mxd-pinned-universal__scroll {
padding-top: 9rem
}
}

.mxd-pinned-universal__scroll-inner {
flex-direction: column;
    gap: 6.5rem;
    display: flex
}

@media only screen and (min-width:768px) {
.mxd-pinned-universal__scroll-inner {
gap: 7.5rem
}
}

@media only screen and (min-width:1600px) {
.mxd-pinned-universal__scroll-inner {
gap: 9.3rem
}
}

.mxd-services-cards__tags {
flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 3.2rem;
    display: flex
}

@media only screen and (min-width:1600px) {
.mxd-services-cards__tags {
gap: 1.4rem;
        margin-bottom: 3.8rem
}
}

.mxd-res-list {
position: relative
}

@media only screen and (min-width:1200px) and (hover) and (prefers-reduced-motion:no-preference) {
.mxd-res-list>.mxd-res-list__item {
transition: opacity .3s
}

.mxd-res-list:hover>.mxd-res-list__item:not(:hover) {
opacity: .2
}
}

.mxd-res-list__item {
margin-top: -2px;
    display: block;
    position: relative
}

.mxd-res-list__item:first-of-type {
margin-top: 0
}

.mxd-res-list__divider {
background-color: var(--st-bright);
    width: 100%;
    height: 2px;
    position: relative
}

.mxd-res-list__content {
flex-direction: column-reverse;
    justify-content: space-between;
    padding: 3.6rem 0 3.5rem;
    display: flex;
    position: relative;
    overflow: hidden
}

@media only screen and (min-width:1200px) {
.mxd-res-list__content {
flex-direction: row;
        justify-content: space-between;
        padding: 6rem 0 7rem
}
}

.mxd-res-list__data {
flex-direction: column;
    gap: 1.6rem;
    display: flex
}

@media only screen and (min-width:1200px) {
.mxd-res-list__data {
gap: 2.8rem
}
}

.mxd-res-list__source {
margin-top: .2rem;
    font-size: 1.6rem
}

@media only screen and (min-width:1600px) {
.mxd-res-list__source {
font-size: 1.8rem
}
}

.mxd-res-list__descr {
max-width: 560px
}

.marquee {
max-width: 100%;
    overflow: hidden
}

.marquee.muted-extra .marquee__image,
.marquee.muted-extra .marquee__text {
color: var(--t-muted-extra)
}

.marquee__item {
margin-top: 1.5rem;
    margin-right: 1.5rem
}

.marquee__item.one-line {
margin-top: 0
}

@media only screen and (min-width:768px) {
.marquee__item {
margin-top: 3rem;
        margin-right: 3rem
}

.marquee__item.one-line {
margin-top: 0
}
}

.marquee__item {
-moz-border-radius: var(--_radius-m);
    border-radius: var(--_radius-m);
    align-items: center;
    gap: 20px;
    width: 430px;
    height: 320px;
    animation: 1s infinite animateZ;
    display: flex;
    position: relative;
    overflow: hidden
}

.marquee__item img {
-o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block
}

.marquee__item.item-regular {
background-color: #0000;
    border-radius: 0;
    gap: 0;
    width: auto;
    height: auto;
    animation: 1s infinite animateZ
}

@media only screen and (min-width:768px) {
.marquee__item {
width: 490px;
        height: 360px
}
}

@media only screen and (min-width:1200px) {
.marquee__item {
width: 540px;
        height: 400px
}
}

@media only screen and (min-width:1600px) {
.marquee__item {
width: 730px;
        height: 540px
}
}

.marquee__text {
margin-right: 1.6rem
}

@media only screen and (min-width:1200px) {
.marquee__text {
margin-right: 3.6rem
}
}

.marquee__image {
flex-shrink: 0;
    width: 4.1rem;
    height: 4.1rem
}

@media only screen and (min-width:768px) {
.marquee__image {
width: 8.1rem;
        height: 8.1rem
}
}

.marquee__image img,
.marquee__image video {
-o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%
}

.marquee__text {
font: normal var(--fw-regular) 6rem/1.2 var(--_font-accent);
    letter-spacing: -.06rem
}

@media only screen and (min-width:768px) {
.marquee__text {
font-size: 12rem
}
}

@media only screen and (min-width:1200px) {
.marquee__text {
font-size: 12rem
}
}

@keyframes animateZ {
to {
        transform: translateZ(1px)
    }
}

.stack-wrapper {
width: 100%;
    position: relative
}

.stack-wrapper.in-content-stack {
margin-top: -7.6rem
}

@media only screen and (min-width:1600px) {
.stack-wrapper.in-content-stack {
margin-top: -4.6rem
}
}

.stack-offset {
background-color: #0000;
    width: 100%;
    height: 10.6rem;
    display: flex
}

@media only screen and (min-width:768px) {
.stack-offset {
height: 13.6rem
}
}

.services-stack {
width: 100%;
    height: 75vh;
    min-height: 600px;
    position: relative
}

@media only screen and (min-width:992px) {
.services-stack {
height: 600px;
        min-height: 0
}
}

@media only screen and (min-width:1600px) {
.services-stack {
height: 760px
}
}

.stack-item {
width: 100%;
    height: 100%;
    padding-bottom: 3rem;
    display: flex;
    position: absolute
}

@media only screen and (min-width:1600px) {
.stack-item {
padding-bottom: 6rem
}
}

.mxd-services-stack__inner {
z-index: 0;
    -moz-border-radius: var(--_radius-l);
    border-radius: var(--_radius-l);
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 2.6rem 3rem 0;
    display: flex;
    position: relative;
    overflow: hidden
}

.mxd-services-stack__inner.radius-dark {
border-radius: 3.6rem
}

@media only screen and (min-width:768px) {
.mxd-services-stack__inner {
padding: 4.2rem 5rem 0
}

.mxd-services-stack__inner.radius-dark {
border-radius: 4.6rem
}
}

@media only screen and (min-width:992px) {
.mxd-services-stack__inner {
padding: 4.2rem 5rem 4.6rem
}

.mxd-services-stack__inner.justify-between {
justify-content: space-between
}
}

.mxd-services-stack__controls {
z-index: 1;
    position: absolute;
    top: 1rem;
    right: 1rem
}

.mxd-services-stack__title {
margin-bottom: 3.4rem;
    padding-right: 2.6rem
}

@media only screen and (min-width:992px) {
.mxd-services-stack__title {
z-index: 1
}

.mxd-services-stack__title.width-60 {
width: 60%;
        max-width: 580px
}
}

@media only screen and (min-width:1200px) {
.mxd-services-stack__title h3 {
font-size: 7rem
}
}

@media only screen and (min-width:1600px) {
.mxd-services-stack__title {
margin-bottom: 4rem
}

.mxd-services-stack__title.width-60 {
max-width: 800px
}
}

.mxd-services-stack__info {
z-index: 1;
    margin-bottom: 3.3rem
}

@media only screen and (min-width:768px) {
.mxd-services-stack__info {
width: 80%;
        margin-bottom: 3.3rem
}
}

@media only screen and (min-width:992px) {
.mxd-services-stack__info.width-60 {
width: 60%;
        max-width: 470px;
        margin-bottom: 0
}
}

@media only screen and (min-width:1600px) {
.mxd-services-stack__info.width-60 {
max-width: 610px
}
}

.services-stack__image {
position: relative;
    overflow: hidden
}

.services-stack__image .service-img-m {
display: none
}

@media only screen and (min-width:992px) {
.services-stack__image {
z-index: 0;
        width: 100%;
        height: 100%;
        padding-left: 0;
        position: absolute;
        top: 0;
        right: 0
}

.services-stack__image .service-img {
width: auto;
        height: 100%;
        position: absolute;
        bottom: 0;
        right: -15%
}

.services-stack__image .service-img-s {
display: none
}

.services-stack__image .service-img-m {
display: block
}
}

@media only screen and (min-width:1200px) {
.services-stack__image .service-img {
width: auto;
        height: 110%;
        max-height: none;
        position: absolute;
        bottom: -5%;
        right: 0
}
}

.mxd-pricing-table,
.mxd-pricing-table__item {
position: relative
}

/* =========================================================
   SIDEBAR / MENU SIZE UPDATE
   Desktop target around 1400x1000 screen:
   sidebar = 700px x 500px (50% width / 50% height)
   Existing HTML and animation classes stay unchanged.
   ========================================================= */
@media only screen and (min-width:1200px) {
  .mxd-menu__wrapper {
    width: 700px;
    height: 500px;
    left: auto;
    right: 0;
    top: 0;
    bottom: auto;
    padding: 1.5rem 2rem;
  }

  .mxd-menu__contain {
    width: 100%;
    height: 100%;
    max-width: 100%;
  }

  .mxd-menu__inner {
    width: 100%;
    height: 100%;
    flex-direction: row;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
  }

  .mxd-menu__left,
  .mxd-menu__right {
    width: 50%;
    height: 100%;
  }

  .mxd-menu__left {
    padding: 3rem 2rem 2rem 3rem;
    overflow: hidden;
  }

  .mxd-menu__caption {
    max-width: 100%;
    margin-bottom: 2rem;
  }

  .main-menu__accordion {
    gap: 1rem;
  }

  .main-menu__link {
    height: 3.5rem;
    line-height: 5rem;
    font-size: 2.4rem;
  }

  .main-menu__link .btn-caption {
    height: 5rem;
    line-height: 5rem;
  }

  .mxd-menu__right {
    padding-top: 0;
    overflow: hidden;
  }

  .menu-promo {
    width: 100%;
    height: 100%;
    padding: 2.5rem 3rem 2rem 2rem;
  }

  .menu-promo__content {
    width: 100%;
    height: 100%;
    padding: 0;
    position: static;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 1.5rem;
  }

  .menu-promo__caption {
    max-width: 100%;
    margin: 0;
  }

  .menu-promo__video {
    width: 100%;
    height: 18rem;
    padding: .8rem;
  }

  .menu-video {
    width: 100%;
    height: 100%; 
    object-fit: cover;
  }
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
  .mxd-menu__wrapper {
    width: 60vw;
    height: 70vh;
  }
}