/*
 Theme Name: Paybilt
*/

@import url("https://use.typekit.net/rwe1gwj.css");
:root {
    --font-primary: 'neue-haas-grotesk-display', sans-serif;
	--font-secondary: 'benton-modern-display', sans-serif;
    --font-accent: 'scribo-brush-regular', sans-serif;
    --box-shadow: 0 0 1.7rem 0 rgba(0, 0, 0, .05), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
*, *:after, *::before {
    color: rgb(var(--color-black));
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}
*:focus {
	outline: 0;
}
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="button"],
input[type="submit"],
textarea,
select {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    border: none;
}
/* DEFAULTS */
* {
    color: #FFF;
}
html,
body {
	font-family: var(--font-primary);
	font-size: 62.5%;
	margin: 0;
    overflow-x: hidden;
}
body {
    position: relative;
}
.scroll-lock {
    overflow: hidden;
}
#page {
    position: relative;
    overflow: hidden;
    background-color: rgb(var(--color-black));
}
.curtain {
    position: absolute;
    inset: 0;
    background-color: rgba(var(--color-black), .8);
    -webkit-backdrop-filter: blur(1rem);
    backdrop-filter: blur(1rem);
    z-index: 999;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.no-blur .curtain {
    background-color: rgba(var(--color-black), .95);
}
body:not(.menu-open):not(.form-open):not(.nav-floors-open) .curtain.done {
    opacity: 0;
    pointer-events: none;
}
#page-content {
    overflow: hidden;
}
.h-wrap {
    padding-left: 5%;
    padding-right: 5%;
}
.v-wrap {
    padding-top: 8rem;
    padding-bottom: 8rem;
}
.flex {
    display: flex;
    justify-content: space-between;
}
.v-flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
section.light * {
    color: rgb(var(--color-black))
}
.text-center {
    text-align: center;
}
h1 {
    font-size: 7rem;
    line-height: 1em;
    font-weight: 500;
    margin-bottom: .25em;
}
h1:not(.basic) em,
h2:not(.basic) em {
    display: block;
    font-family: var(--font-secondary);
    font-size: 1.1em;
    font-weight: 300;
}
h2 {
    font-size: 4.5rem;
    line-height: 1.15em;
    font-weight: 500;
    margin-bottom: .5em;
}
h3 {
    font-size: 1.8rem;
    line-height: 1.1em;
    font-weight: 600;
    letter-spacing: .05em;
    margin-bottom: .7em;
}
h4 {
    font-size: 1.8rem;
    line-height: 1em;
    font-weight: 600;
    margin-bottom: .3em;
}
h5,
.nf-field-element input[type="submit"] {
    font-size: 1.8rem;
    line-height: 1.1em;
    letter-spacing: .05em;
    margin-bottom: .3em;
}
p,
.policy .intro li,
.block li,
table {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    line-height: 1.15em;
    letter-spacing: .05em;
    margin-bottom: .8em;
}
p a {
    color: inherit;
}
strong {
    font-weight: 600;
}
em {
    font-style: italic;
}
small {
    display: inline-block;
    font-size: .8em;
    line-height: 1.12em;
}
.large {
    font-size: 1.2em;
    line-height: 1.3em;
}
.mb-0 {
    margin-bottom: 0;
}
.pb-0 {
    padding-bottom: 0!important;
}
.policy .intro ul,
.policy .intro ol,
.block ul,
.block ol {
    margin-left: 3.5rem;
}
.btn-row {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 1.5rem 2.4rem;
    margin-top: 2.2rem;
}
.btn {
    position: relative;
    display: inline-flex;
    gap: 1rem;
    margin-top: 3rem;
    padding: .4rem .4rem .4rem 1.6rem;
    font-size: 1.8rem;
    line-height: 1em;
    font-weight: 400;
    text-decoration: none;
    background-color: rgb(var(--color-black));
    border: .1rem solid rgba(var(--color-grey), .25);
    border-radius: 10rem;
    cursor: pointer;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-row .btn {
    margin-top: 0;
}
section.dark .btn {
    background-color: rgba(var(--color-white), .6);
    border: none;
}
section.dark .btn,
.btn-secondary:hover,
.btn-secondary:not(:hover) .plus,
.btn-simple:hover {
    box-shadow: 0 1.7rem 2.3rem 0 rgba(0, 0, 0, .5), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 -.8rem 2.6rem 0 rgba(0, 0, 0, .3) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
}
.btn-secondary {
    flex-direction: row-reverse;
    margin-right: auto;
    padding: .4rem 1.6rem .4rem .4rem;
}
.btn-secondary:not(:hover) {
    background-color: rgba(var(--color-primary), 0);
    border: .1rem solid rgba(var(--color-grey), 0);
}
.btn-row .btn-secondary {
    margin-right: 0;
}
.btn-sm {
    font-size: 1.2rem;
}
.btn:hover,
.btn-opposite,
.btn:not(.btn-plus):hover .plus:before,
.btn:not(.btn-plus):hover .plus:after,
.btn-opposite .plus:before,
.btn-opposite .plus:after {
    background-color: rgba(var(--color-primary), 1)!important;
}
.btn-opposite:hover,
.btn-opposite:hover .plus:before,
.btn-opposite:hover .plus:after {
    background-color: rgb(var(--color-black))!important;
}
.btn[data-vendor="interac"]:hover,
.btn[data-vendor="interac"]:hover .plus:before,
.btn[data-vendor="interac"]:hover .plus:after {
    background-color: rgba(var(--color-secondary), 1)!important;
}
.btn .vendor {
    align-self: center;
}
.btn .vendor-icon {
    transform: scale(1.1);
}
.btn span {
    position: relative;
    align-self: center;
    color: rgb(var(--color-white));
    letter-spacing: .04em;
    -webkit-transition: color .3s ease-in-out, font-size 0s;
    transition: color .3s ease-in-out, font-size 0s;
}
section.dark .btn span,
.light .btn-secondary span {
    color: rgb(var(--color-black));
}
.btn-secondary span:after {
    content: '';
    position: absolute;
    bottom: -.7rem;
    left: 0;
    width: 100%;
    height: .2rem;
    background-color: rgb(var(--color-primary));
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-secondary:hover span:after {
    opacity: 0;
}
.btn .plus {
    position: relative;
    align-self: center;
    width: 3.6rem;
    min-width: 3.6rem;
    height: 3.6rem;
    background-color: rgb(var(--color-white));
    border: .1rem solid rgba(var(--color-grey), .5);
    border-radius: 50%;
    -webkit-transition: transform .5s ease-in-out,
                background-color .5s ease-in-out,
                box-shadow .5s ease-in-out .3s;
    transition: transform .5s ease-in-out,
                background-color .5s ease-in-out,
                box-shadow .5s ease-in-out .3s;
}
.btn:hover .plus {
    -webkit-transition: transform .5s ease-in-out,
                background-color .5s ease-in-out,
                box-shadow .2s ease-in-out;
    transition: transform .5s ease-in-out,
                background-color .5s ease-in-out,
                box-shadow .2s ease-in-out;
}
.btn-secondary:not(:hover) .plus {
    background-color: rgb(var(--color-primary));
}
.light .btn-secondary .plus {
    box-shadow: 0 1.7rem 2.3rem 0 rgba(0, 0, 0, .5), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
}
.light .btn-secondary:hover .plus {
    box-shadow: 0 1.7rem 2.3rem 0 rgba(0, 0, 0, 0), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
}
.btn-sm .plus {
    width: 2.4rem;
    min-width: 2.4rem;
    height: 2.4rem;
}
.btn:hover .plus,
.card:hover .btn-plus .plus {
    transform: rotate(270deg);
}
.btn .plus:before,
.btn .plus:after {
    content: '';
    position: absolute;
    width: .2rem;
    height: 1.5rem;
    background-color: rgb(var(--color-black));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-sm .plus:before,
.btn-sm .plus:after {
    height: 1rem;
}
.btn-secondary:not(:hover) .plus:before,
.btn-secondary:not(:hover) .plus:after {
    background-color: rgb(var(--color-white));
}
.btn .plus:after {
    transform: translate(-50%, -50%) rotate(90deg);
}
.btn-plus {
    padding: 0;
    background: none;
    border: none;
}
.btn-plus .plus {
    width: 2.2rem;
    min-width: 2.2rem;
    height: 2.2rem;
    min-height: 2.2rem;
}
.btn-plus .plus:before,
.btn-plus .plus:after {
    height: 1rem;
    width: .1rem;
}
.btn-simple {
    position: relative;
    top: 0;
    padding: 1.2rem 1.6rem 1.1rem;
    font-size: 1.4rem;
    line-height: 1em;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid rgb(var(--color-white));
    border-radius: 2rem;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-simple:hover {
    top: -.2rem;
    background-color: rgb(var(--color-primary));
    border-color: rgb(var(--color-primary));
}
.svg,
svg, 
.section-button-effect,
.testimonial .effect {
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
svg.injected-svg,
.section-button-effect.show,
.testimonial .effect.show {
    opacity: 1;
}
.section-button-effect img,
.testimonial .effect img {
    width: 100%;
}
.grecaptcha-badge {
    visibility: hidden!important;
    right: 9999px!important;
}
@media (min-width: 1000px) {
    body.menu-open .curtain.done {
        opacity: 0;
        pointer-events: none;
    }
}
@media (max-width: 1200px) {
    h1 {
        font-size: 5.5rem;
    }
}
@media (max-width: 1000px) {
     h2 {
        font-size: 3.5rem;
    }
    br.res {
        display: none;
    }
}
@media (max-width: 800px) {
    .v-wrap {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }
}
@media (max-width: 600px) {
    h1 {
        font-size: 4.5rem;
    }
}
@media (max-width: 500px) {
    h1 {
        font-size: 4rem;
    }
    .btn {
        font-size: 1.6rem;
    }
}
@media (max-width: 350px) {
    h1 {
        font-size: 3.5rem;
    }
    h2 {
        font-size: 3rem;
    }
    h3 {
        font-size: 1.5rem;
    }
}
/* PACE */
.pace {
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.pace-inactive {
    display: none;
}
.pace .pace-progress {
    background: rgb(var(--color-accent));
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 3px;
}
li.dead a {
    pointer-events: none;
}
li.dead li:not(.dead) a {
    pointer-events: all;
}
/* VIEWPORT ANIMATIONS */
.v-anim {
	position: relative;
	opacity: 0;
    -webkit-transition: .7s ease-in-out;
	-webkit-transition-delay: .3s;
	transition: .7s ease-in-out;
	transition-delay: .3s;
}
.v-anim.go {
	opacity: 1;
}
.v-anim.anim-top {
	top: -4rem;
}
.v-anim.anim-top.go {
	top: 0;
}
.v-anim:nth-of-type(2) {
    -webkit-transition-delay: .4s;
	transition-delay: .4s;
}
.v-anim:nth-of-type(3) {
	transition-delay: .5s;
    -webkit-transition-delay: .5s;
}
.v-anim:nth-of-type(4) {
    -webkit-transition-delay: .6s;
	transition-delay: .6s;
}
.v-anim:nth-of-type(5) {
    -webkit-transition-delay: .7s;
	transition-delay: .7s;
}
.v-anim:nth-of-type(6) {
    -webkit-transition-delay: .8s;
	transition-delay: .8s;
}
.v-anim:nth-of-type(7) {
    -webkit-transition-delay: .9s;
	transition-delay: .9s;
}
.v-anim:nth-of-type(8) {
    -webkit-transition-delay: 1s;
	transition-delay: 1s;
}
.v-anim:nth-of-type(9) {
    -webkit-transition-delay: 1.1s;
	transition-delay: 1.1s;
}
@media (min-width: 800px) {
	.v-anim.anim-left {
		left: -6rem;
	}
	.v-anim.anim-left.go {
		left: 0;
	}
	.v-anim.anim-right {
		right: -6rem;
	}
	.v-anim.anim-right.go {
		right: 0;
	}
}
/* FORMS */
.nf-form-fields-required {
    display: none;
}
.nf-field-container {
    margin-bottom: 1rem!important;
}
nf-field .html-container {
    margin-top: .8rem;
}
nf-field p {
    font-size: 1.4rem;
    line-height: 1.2em;
}
.nf-field-element input,
.nf-field-element select,
.nf-field-element textarea {
    padding: .8rem;
    font-family: var(--font-primary);
    letter-spacing: .04em;
    border-radius: .6rem;
    background-color: rgba(var(--color-white), .2);
    border: .1rem solid rgba(var(--color-grey), .3);
}
.light .nf-field-element input,
.light .nf-field-element select,
.light .nf-field-element textarea {
   color: rgb(--var(--color-black));
}
.nf-field-element input:focus,
.nf-field-element select:focus,
.nf-field-element textarea:focus,
.nf-error .ninja-forms-field {
   border: .1rem solid rgb(var(--color-primary))!important;
}
/*.nf-error .ninja-forms-field {
    box-shadow: 0 0 .3rem 0 rgba(232, 0, 0, .8);
}*/
.nf-error-msg {
    color: rgb(var(--color-primary))!important;
    font-size: 1.2rem;
    letter-spacing: .05em;
}
.nf-response-msg p {
    padding: 0 .5rem .5rem;
    color: rgb(var(--color-primary));
}
::-webkit-input-placeholder {
	color: #FFF!important;
    font-weight: 300;
    letter-spacing: .04em;
}
:-moz-placeholder {
	color: #FFF!important;
    font-weight: 300;
    letter-spacing: .04em;
}
::-moz-placeholder {
	color: #FFF!important;
    font-weight: 300;
    letter-spacing: .04em;
}
:-ms-input-placeholder {
 	color: #FFF!important;
    font-weight: 300;
    letter-spacing: .04em;
}
.light ::-webkit-input-placeholder {
	color: rgb(var(--color-black))!important;
}
.light :-moz-placeholder {
	color: rgb(var(--color-black))!important;
}
.light ::-moz-placeholder {
	color: rgb(var(--color-black))!important;
}
.light :-ms-input-placeholder {
 	color: rgb(var(--color-black))!important;
}
nf-field .submit-container {
    text-align: center;
}
.submit-container .nf-field {
    display: inline-block;
    position: relative;
    margin-top: 2.2rem;
}
nf-field .submit-wrap {
    display: inline-flex;
    width: auto!important;
}
nf-field .submit-wrap + .icon {
    width: 3.6rem!important;
}
nf-field .submit-wrap + .icon {
    position: absolute!important;
    top: 1rem;
    left: .4rem;
    right: calc(100% - .8rem);
    width: auto!important;
    min-width: 3.6rem;
    pointer-events: none;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.mac nf-field .submit-wrap + .icon {
    top: 1.2rem;
}
.ios nf-field .submit-wrap + .icon {
    top: 1.3rem;
}
nf-field .submit-wrap:hover + .icon,
.nf-processing nf-field .submit-wrap + .icon
.form-done nf-field .submit-wrap + .icon {
    right: .4rem;
}
nf-field .submit-wrap + .icon svg {
    left: 1.8rem!important;
}
nf-field .submit-wrap + .icon svg:not(:first-child) {
    opacity: 0;
}
nf-field .submit-wrap:hover + .icon svg {
    opacity: 1;
}
nf-field .submit-wrap:hover + .icon svg:nth-child(2),
.nf-processing nf-field .submit-wrap + .icon svg:nth-child(2),
.form-done nf-field .submit-wrap + .icon svg:nth-child(2) {
   left: calc(38%)!important
}
nf-field .submit-wrap:hover + .icon svg:nth-child(3),
.nf-processing nf-field .submit-wrap + .icon svg:nth-child(3),
.form-done nf-field .submit-wrap + .icon svg:nth-child(3) {
   left: calc(61%)!important
}
nf-field .submit-wrap:hover + .icon svg:nth-child(4),
.nf-processing nf-field .submit-wrap + .icon svg:nth-child(4),
.form-done nf-field .submit-wrap + .icon svg:nth-child(4) {
   left: calc(100% - 2rem)!important;
}
nf-field input[type="submit"] {
    padding: 1.2rem 1.6rem 1.2rem 5rem;
    text-align: right;
    letter-spacing: .02em;
    background: none;
    border: .1rem solid rgba(0,0,0,0);
    border-radius: .6rem;
    box-shadow: 0 0 .3rem 0 rgba(var(--color-primary), .8);
    backdrop-filter: blur(.4rem);
    cursor: pointer
}
nf-errors .nf-error-msg {
    padding: 0 .5rem;
}
/* HEADER */
header {
    position: fixed;
    top: 0;
    left: 0; right: 0;
    z-index: 1000;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
body:not(.menu-open) header.fixed {
    background-color: rgba(var(--color-black), .9);
    backdrop-filter: blur(.5rem);
}
header.fixed:not(.up),
.page-template-page-products header.fixed {
    transform: translateY(-100%);
}
header nav {
    position: relative;
    padding: 3rem 3.2rem;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
#page:not(.single-policy) header nav {
    background: linear-gradient(180deg, rgba(var(--color-black), .8) 0%, rgba(var(--color-black), 0) 100%);
}
header.fixed nav {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
header #logo {
    position: relative;
    top: .2rem;
    z-index: 1;
}
#logo svg {
    width: auto;
    height: 2.4rem;
    -webkit-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
}
header.fixed #logo svg {
    height: 2rem;
}
header #logo svg path,
header #logo svg rect {
    fill: #FFF;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
#logo .content,
.qr-btn .content {
    position: absolute;
    bottom: 1.5rem;
    left: -1rem;
    transform: translateY(100%);
    padding: 2.4rem;
    opacity: 0;
    visibility: hidden;
    cursor: default;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
#logo:hover .content,
#logo .content:hover,
.qr-btn:hover .content,
.qr-btn .content:hover {
    bottom: .5rem;
    opacity: 1;
    visibility: visible;
}
#logo .content,
.qr-btn .content,
.ticker-scroll,
.pos .clients,
.btn-elevator .icon,
.floors .floor .content {
    background-color: rgba(var(--color-black), .6);
    border: .1rem solid rgba(var(--color-grey), .25);
    border-radius: 1.2rem;
    backdrop-filter: blur(.4rem);
    box-shadow: 0 1.7rem 2.3rem 0 rgba(var(--color-black), .5);
}
#logo .content,
.no-blur .qr-btn .content,
.no-blur .ticker-scroll,
.no-blur .pos .clients,
.no-blur .btn-elevator .icon,
.no-blur .floors .floor .content {
    background-color: rgba(var(--color-black), .8);
}
#logo .content {
    white-space: nowrap;
}
#logo .content p {
    margin-bottom: .3rem;
}
#logo .content .btn {
    margin-top: 1.6rem;
}

header .menu,
header .nav-right > .flex {
    position: relative;
    display: inline-flex;
}
header .menu {
    gap: 2.5rem 4.4rem;
}
.menu li {
    list-style-type: none;
}
header .menu li {
    position: relative;
	-webkit-transition: .4s ease-in-out;
	transition: .4s ease-in-out;
}
header .menu > li:after {
	content: '';
	position: absolute;
	left: 0;
    bottom: -1.2rem;
	width: 0;
	height: .25rem;
    background: rgb(var(--color-white));
    opacity: 0;
	-webkit-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}
header .menu > li:hover:after,
header .menu > li.current-menu-item:not(.title-home):after {
	width: 100%;
    opacity: 1;
}
header .menu li.hide {
    display: none;
}
header .menu a {
	position: relative;
	top: 0;
    color: #FFF;
	font-size: 1.6rem;
    letter-spacing: .05em;
	text-decoration: none;
	white-space: nowrap;
    z-index: 1;
	-webkit-transition: .2s ease-in-out;
	transition: .2s ease-in-out;
}
header .menu > li a:hover ,
header .menu > a:hover {
	top: .2rem;
}
header .menu > li > .sub-menu {
    display: flex;
    position: absolute;
    top: calc(100% + 3rem);
    left: 0;
    transform: translateY(-1rem);
    border: .1rem solid rgba(var(--color-grey), .5);
    border-radius: 1.2rem;
    box-shadow: 0 0 3.4rem 0 rgb(var(--color-black));
    opacity: 0;
    visibility: hidden;;
    -webkit-transition: .4s ease-in-out;
    -webkit-transition-delay: .3s;
	transition: .4s ease-in-out;
    transition-delay: .3s;
}
header.fixed .menu > li > .sub-menu {
    top: calc(100% + 3.7rem);
}
header .menu > li.left > .sub-menu {
    position: fixed;
    top: 8.2rem;
    left: 3.2rem;
    max-width: calc(100% - 6.4rem);
}
header .menu > li:hover > .sub-menu,
header .menu > li > .sub-menu:hover {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}
header .menu li.title-featured,
header .menu li.title-column {
    display: none;
}
header .menu .sub-menu .sub-menu,
header .menu .sub-menu .slimScrollDiv {
    width: 35rem!important;
    max-width: 100%;
}
header .menu li.title-featured + .sub-menu {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.2rem;
    background-color: rgb(var(--color-black));
    border-top-left-radius: 1.2rem;
    border-bottom-left-radius: 1.2rem;
}
header .menu .sub-menu .sub-menu li {
    border: .1rem solid rgb(var(--color-grey), 0);
    border-radius: 1.2rem;
}
header .menu .sub-menu .sub-menu li,
.nav-mobile > * {
    transform: translateX(-.3rem);
    opacity: 0;
    -webkit-transition: transform .5s, opacity .5s, background-color .3s, border .3s;
    -webkit-transition-delay: .5s, .5s, 0s, 0s;
    transition: transform .5s, opacity .5s, background-color .3s, border .3s;
    transition-delay: .5s, .5s, 0s, 0s;
}
header .menu > .sub-menu:hover .sub-menu li,
.menu-open .nav-mobile > * {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(1),
.menu-open .nav-mobile > *:nth-child(1) {
    -webkit-transition-delay: .5s, .5s, 0s, 0s;
    transition-delay: .5s, .5s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(2),
.menu-open .nav-mobile > *:nth-child(2) {
    -webkit-transition-delay: .6s, .6s, 0s, 0s;
    transition-delay: .6s, .6s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(3),
.menu-open .nav-mobile > *:nth-child(3) {
    -webkit-transition-delay: .7s, .7s, 0s, 0s;
    transition-delay: .7s, .7s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(4),
.menu-open .nav-mobile > *:nth-child(4) {
    -webkit-transition-delay: .8s, .8s, 0s, 0s;
    transition-delay: .8s, .8s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(5),
.menu-open .nav-mobile > *:nth-child(5) {
    -webkit-transition-delay: .9s, .9s, 0s, 0s;
    transition-delay: .9s, .9s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(6) {
    -webkit-transition-delay: 1s, 1s, 0s, 0s;
    transition-delay: 1s, 1s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(7) {
    -webkit-transition-delay: 1.1s, 1.1s, 0s, 0s;
    transition-delay: 1.1s, 1.1s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(8) {
    -webkit-transition-delay: 1.2s, 1.2s, 0s, 0s;
    transition-delay: 1.2s, 1.2s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(9) {
    -webkit-transition-delay: 1.3s, 1.3s, 0s, 0s;
    transition-delay: 1.3s, 1.3s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(10) {
    -webkit-transition-delay: 1.4s, 1.4s, 0s, 0s;
    transition-delay: 1.4s, 1.4s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(11) {
    -webkit-transition-delay: 1.5s, 1.5s, 0s, 0s;
    transition-delay: 1.5s, 1.5s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li:nth-child(12) {
    -webkit-transition-delay: 1.6s, 1.6s, 0s, 0s;
    transition-delay: 1.6s, 1.6s, 0s, 0s;
}
header .menu > li:hover > .sub-menu .sub-menu li,
header .menu > .sub-menu:hover .sub-menu li,
.menu-open .nav-mobile > * {
    transform: translateX(0);
    opacity: 1;
}
header .menu .sub-menu .sub-menu li:hover {
    border: .1rem solid rgb(var(--color-grey), .15);
}
header .menu .sub-menu a {
    display: block;
    padding: 1.2rem;
    font-size: 1.5rem;
    font-weight: bold;
    letter-spacing: .05em;
    text-transform: none;
}
header .menu li.title-featured + .sub-menu li {
    flex: 1;
}
header .menu li.title-featured + .sub-menu li:hover {
    background-color: rgba(145, 145, 145, .2);
}
header .menu li.title-featured + .sub-menu a {
    display: flex;
    flex-direction: column;
    gap: .8rem;
    height: 100%;
}
header .menu li.title-featured + .sub-menu .img {
    flex: 1;
    min-height: 10rem;
    background-position: center;
    background-size: cover;
    box-shadow: 0 0 0 0.1rem rgba(var(--color-grey), 0.25);
    border-radius: .6rem;
}
header .menu li.title-featured + .sub-menu .content {
    padding: 1.2rem;
}
header .menu .sub-menu .content > .flex {
    gap: .5rem;
}
header .menu .sub-menu svg {
    width: auto;
    height: 1rem;
    opacity: 1;
}
header .menu .sub-menu svg path {
    stroke: rgb(var(--color-black));
}
header .menu li.title-featured + .sub-menu svg path {
    stroke: rgb(var(--color-white));
}
header .menu .sub-menu svg {
    position: relative;
    top: .4rem;
    left: 0;
    width: auto;
    height: 1rem;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
header .menu .sub-menu a:hover svg {
    left: .5rem;
}
header .menu .sub-menu p {
    margin-top: .5rem;
    color: rgb(var(--color-grey));
    font-size: 1.4rem;
    font-weight: normal;
    white-space: wrap;
    text-wrap: balance;
}
header .menu .sub-menu p * {
    color: rgb(var(--color-grey));
}
header .menu li.ellipses + .sub-menu p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
header .menu li.title-column + .sub-menu ,
header .menu li.title-column + .slimScrollDiv > .sub-menu {
    position: relative;
    padding: 2.2rem 2rem 1.2rem 3.2rem;
    background-color: rgb(var(--color-white));
}
header .menu li.title-featured + .sub-menu + li.title-column + .sub-menu,
header .menu li.title-featured + .sub-menu + li.title-column + .slimScrollDiv > .sub-menu {
    padding-left: 1.2rem;
}
header .menu li.title-column + .sub-menu:not(:last-child),
header .menu li.title-column + .slimScrollDiv > .sub-menu:not(:last-child) {
    padding-right: 3.2rem;
}
header .menu li.title-column + .sub-menu:last-child,
header .menu li.title-column + .slimScrollDiv > .sub-menu:last-child {
    border-top-right-radius: 1.2rem;
    border-bottom-right-radius: 1.2rem;
}
header .menu li.title-column + .sub-menu:not(:last-child):after {
    content: '';
    position: absolute;
    top: 1rem;
    bottom: 1rem;
    right: 0;
    width: .1rem;
    background-color: rgba(var(--color-grey), .25);
}
.slimScrollRail,
.slimScrollBar {
	right: 0!important;
	border-radius: 0!important;
}
.slimScrollRail {
	background-color: rgba(var(--color-grey), .25);
}
.slimScrollBar {
	background-color: rgb(var(--color-grey))!important;
}
header .menu .slimScrollDiv.mask:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0; right: 0;
    height: 5rem;
    background-color: rgb(var(--color-white));
    z-index: 2;
}
header .menu .sub-menu li.title-receive,
header .menu .sub-menu li.title-send,
header .menu .sub-menu li.title-orchestrate {
    margin-bottom: .8rem;
    background-position: center;
    background-size: cover;
    border: none!important;
}
header .menu .slimScrollDiv li.sticky {
    position: sticky;
    top: 0;
    z-index: 3;
}
header .menu .sub-menu li.title-receive a,
header .menu .sub-menu li.title-send a,
header .menu .sub-menu li.title-orchestrate a {
    background: linear-gradient(90deg, rgba(var(--color-black), 1) 0%, rgba(var(--color-black), 1) 50%, rgba(var(--color-black), 0) 70%, rgba(var(--color-black), 0) 100%);
    background-size: 200% 100%;
    background-position: 100% 0%;
    border-radius: 1.2rem;
    transition: background-position 0.3s ease-in-out;
}
header .menu .sub-menu li.title-receive a:hover,
header .menu .sub-menu li.title-send a:hover,
header .menu .sub-menu li.title-orchestrate a:hover {
    top: 0;
    background-position: 90% 0%;
}
header .menu .sub-menu li.title-receive div {
    color: rgb(var(--color-primary))!important;
}
header .menu .sub-menu li.title-send div {
    color: rgb(var(--color-secondary))!important;
}
header .menu .sub-menu li.title-orchestrate div {
    color: rgb(var(--color-accent))!important;
}
header .menu .sub-menu li.title-receive .flex,
header .menu .sub-menu li.title-send .flex,
header .menu .sub-menu li.title-orchestrate .flex {
    justify-content: flex-start;
    gap: .8rem;
}
header .menu .sub-menu li.title-receive .icon,
header .menu .sub-menu li.title-send .icon,
header .menu .sub-menu li.title-orchestrate .icon {
    position: relative;
    align-self: center;
    top: -.1rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}
header .menu .sub-menu li.title-receive .icon {
    background-color: rgb(var(--color-primary));
}
header .menu .sub-menu li.title-send .icon {
    background-color: rgb(var(--color-secondary));
}
header .menu .sub-menu li.title-orchestrate .icon {
    background-color: rgb(var(--color-accent));
}
header .menu li.title-column + .sub-menu li:hover,
header .menu li.title-column + .slimScrollDiv > .sub-menu li:hover {
    background-color: #FFF;
}
header .menu li.title-column + .sub-menu div,
header .menu li.title-column + .slimScrollDiv > .sub-menu div {
    color: rgb(var(--color-black));
}
header .nav-right > .flex,
header .nav-right .menu {
    gap: 2.5rem;
}
.nav-btn {
    gap: .8rem;
    margin-bottom: -.8em;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.nav-btn svg {
    position: relative;
    top: -.4rem;
    height: 2.4rem!important;
    width: auto!important;
    opacity: 1;
}
.nav-btn svg path {
    stroke: #FFF;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.qr-btn {
    position: relative;
    top: -.3em;
    width: 2.4rem;
    max-width: 2.4rem;
    height: 2.4rem;
    background-color: rgb(var(--color-white));
    border-radius: 50%;
    z-index: 1;
}
.qr-btn svg {
    width: 100%;
    height: auto;
    opacity: 1;
}
.qr-btn > svg {
    width: .9rem;
    margin: 0 auto;
}
.qr-btn > svg path {
    fill: rgb(var(--color-black));
}
.qr-btn .content {
    left: auto;
    right: -.7rem;
    gap: 1.2rem;
    padding: 1.6rem;
}
.qr-btn .content svg {
    width: 7.5rem;
}
/* mobile */
#menu-btn {
    display: none;
    grid-column: 2;
    justify-self: end;
    padding: .8rem 1.2rem;
    gap: 1.2rem;
    border: .1rem solid rgba(var(--color-grey), .8);
    border-radius: 2rem;
    box-shadow: 0 1.7rem 2.3rem 0 rgba(var(--color-black) .5);
    backdrop-filter: blur(.4rem);
    z-index: 1;
    cursor: pointer;
}
.no-blur #menu-btn {
    background-color: rgba(var(--color-black), .8);
}
#menu-btn p {
    position: relative;
    font-size: 1.2rem;
    line-height: 1em;
    /*perspective: 100rem;*/
}
#menu-btn p span {
    display: inline-block;
    transform: scale(.8);
    /*transform: rotateX(-180deg);*/
    /*transform-style: preserve-3d;*/
    opacity: 0;
    cursor: pointer;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
#menu-btn p .close {
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1.2);
}
body:not(.menu-open) #menu-btn p span:not(.close),
.menu-open #menu-btn p .close {
    transform: scale(1);
    /*transform: rotateX(0);*/
    opacity: 1;
}
#menu-btn .icon,
.nav-floors-btn .icon {
    position: relative;
    align-self: center;
    top: 0;
    width: 1rem;
    height: 1rem;
    -webkit-transition: height .3s ease-in-out, top .3s ease-in-out, transform .4s ease-in-out .1s;
    transition: height .3s ease-in-out, top .3s ease-in-out, transform .4s ease-in-out .1s;
}
#menu-btn .icon span,
.nav-floors-btn .icon span {
    position: absolute;
    width: .3rem;
    height: .3rem;
    border-radius: 50%;
    background-color: #FFF;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
#menu-btn .icon span:nth-child(1),
.nav-floors-btn .icon span:nth-child(1) {
    top: 0;
    left: 0;
}
#menu-btn .icon span:nth-child(2),
.nav-floors-btn .icon span:nth-child(2) {
    top: 0;
    right: 0;
}
#menu-btn .icon span:nth-child(3),
.nav-floors-btn .icon span:nth-child(3) {
    bottom: 0;
    left: 0;
}
#menu-btn .icon span:nth-child(4),
.nav-floors-btn .icon span:nth-child(4) {
    bottom: 0;
    right: 0;
}
.menu-open #menu-btn .icon {
    top: -.1rem;
    height: .3rem;
    transform: rotate(-180deg);
}
.menu-open #menu-btn .icon span:nth-child(2) {
    right: calc(100% - .3rem);
}
.menu-open #menu-btn .icon span:nth-child(3) {
    left: calc(100% - .3rem);
}
.nav-mobile {
    display: none;
    grid-auto-rows: auto;
    gap: min(3rem, 4rem);
    position: fixed;
    top: 0; bottom: 0;
    left: 0; right: 0;
    max-width: 40rem;
    padding: 12rem 3.2rem 3rem;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.menu-open .nav-mobile {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}
header .nav-mobile .menu-nav-container .menu {
    display: grid;
    grid-auto-rows: auto;
    gap: clamp(1.5rem, 3vh, 2.5rem);
    margin-bottom: 1.8rem;
}
.nav-mobile li:after {
    display: none;
}
.nav-mobile li.mobile-hidden {
    display: none;
}
header .nav-mobile .menu a {
    top: 0!important;
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: .05em;
    text-transform: none;
}
header .nav-mobile .menu-nav-container a {
    font-size: 2rem;
    font-weight: 600;
}
.nav-mobile .sub-menu {
    display: none;
}
.nav-mobile .nav-btns {
    flex-direction: column;
    justify-content: flex-start;
}
.nav-mobile .nav-btn {
    justify-content: flex-start;
}
#menu-mobile {
    display: grid;
    display: none; /* temp */
    grid-template-columns: 1fr 1fr;
}
.nav-mobile .v-flex {
    justify-content: flex-end;
}
.nav-mobile .btn-form:not(.menu-item) {
    flex-direction: row-reverse;
    width: 100%;
    padding-left: .4rem; 
    padding-right: 1.6rem;
}
.nav-mobile .btn-form:hover svg.chevron {
    transform: translate(-50%, -50%) rotate(-90deg);
}
.pop-form {
    position: fixed;
    top: 1rem;
    width: 100%;
    height: 100vh;
    justify-content: center;
    transform: translateY(1rem);
    pointer-events: none;
    opacity: 0;
    z-index: 1010;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.pop-form .intro {
    margin: 0 .5rem 2rem;
}
.pop-form .intro:not(.active) {
    display: none;
}
.pop-form h3,
.pop-form p {
    text-align: center;
}
.pop-form .intro[data-type="receive"] h3 {
    color: rgb(var(--color-primary));
}
.pop-form .intro[data-type="send"] h3 {
    color: rgb(var(--color-secondary));
}
.pop-form .intro[data-type="orchestrate"] h3 {
    color: rgb(var(--color-accent));
}
.pop-form p {
    margin: 0 auto 1rem;
}
.pop-form p a:hover {
    color: rgb(var(--color-primary));
}
.form-open .pop-form {
    top: 0;
    transform: translateY(0);
    pointer-events: all;
    opacity: 1;
}
.pop-form .v-flex {
    justify-content: center;
}
.pop-form > .v-flex {
    margin: 0 -10rem;
}
.pop-form .buffer {
    padding: 0 10rem;
}
.pop-form .form {
    position: relative;
    max-width: 40rem;
    margin: 0 auto;
    padding: 2.5rem .7rem 2rem;
    background-color: rgba(var(--color-black), .6);
    box-shadow: 0 1.7rem 2.3rem 0 rgba(0, 0, 0, .5);
    backdrop-filter: blur(.4rem);
    border: .1rem solid rgb(var(--color-grey), .25);
    border-radius: .6rem;
}
.no-blur .pop-form .form {
    background-color: rgba(var(--color-black), .95);
}
.pop-form[data-type="send"] .nf-field-element input:focus,
.pop-form[data-type="send"] .nf-field-element select:focus,
.pop-form[data-type="send"] .nf-field-element textarea:focus,
.pop-form[data-type="send"] .nf-error .ninja-forms-field {
    border: .1rem solid rgb(var(--color-secondary))!important;
}
.pop-form[data-type="orchestrate"] .nf-field-element input:focus,
.pop-form[data-type="orchestrate"] .nf-field-element select:focus,
.pop-form[data-type="orchestrate"] .nf-field-element textarea:focus,
.pop-form[data-type="orchestrate"] .nf-error .ninja-forms-field {
    border: .1rem solid rgb(var(--color-accent))!important;
}
.pop-form[data-type="send"] .nf-error-msg {
    color: rgb(var(--color-secondary))!important;
}
.pop-form[data-type="orchestrate"] .nf-error-msg {
    color: rgb(var(--color-accent))!important;
}
.pop-form .listselect-container {
    display: none;
}
/* jquery ui defaults */
.ui-slider {
    position: relative;
    text-align: left;
}
.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    cursor: pointer;
    -ms-touch-action: none;
    touch-action: none;
}
.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    display: block;
    border: 0;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -.3em;
    margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
    top: 0;
    height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
    left: 0;
}
/* end defaults */
.range-slider {
    position: relative;
}
.range-slider .rail {
    position: relative;
    height: .2rem;
    margin: 5.5rem .5rem 0;
    background-color: #FFF;
    border: none;
    border-radius: .3rem;
}
.range-slider .rail .ui-slider-range {
    background: rgb(var(--color-primary));
    border-radius: .3rem;
}
.range-slider .rail .ui-slider-handle {
    position: absolute;
    top: -.2rem;
    width: .5rem;
    height: .6rem;
    border: none;
    border-radius: 50%;
    background: rgb(var(--color-primary));
    cursor: pointer;
    outline: none;
}
.range-slider .tooltip {
    position: absolute;
    top: -3.8rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 1rem;
    font-size: 1.4rem!important;
    font-weight: 700!important;
    line-height: 1em!important;
    border-radius: 10rem;
    background: rgb(var(--color-primary));
    box-shadow: 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    white-space: nowrap;
    opacity: 1!important;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.pop-form[data-type="send"] .range-slider .rail .ui-slider-range,
.pop-form[data-type="send"] .range-slider .rail .ui-slider-handle,
.pop-form[data-type="send"] .range-slider .tooltip {
    background: rgb(var(--color-secondary));
}
.pop-form[data-type="orchestrate"] .range-slider .rail .ui-slider-range,
.pop-form[data-type="orchestrate"] .range-slider .rail .ui-slider-handle,
.pop-form[data-type="orchestrate"] .range-slider .tooltip {
    background: rgb(var(--color-accent));
}
.pop-form[data-type="send"] nf-field input[type="submit"] {
    box-shadow: 0 0 .3rem 0 rgba(var(--color-secondary, .8));
}
.pop-form[data-type="orchestrate"] nf-field input[type="submit"] {
    box-shadow: 0 0 .3rem 0 rgba(var(--color-accent, .8));
}
.pop-form .x {
    position: absolute;
    top: 0;
    right: 0;
    padding: .8rem;
    cursor: pointer;
}
.pop-form .x svg {
    opacity: 1;
    width: 1.2rem;
    height: auto;
}
div.btn-form,
.btn-scroll {
    gap: 1rem;
    padding: .4rem .4rem .4rem 1.6rem;
    font-size: 1.6rem;
    background-color: rgba(var(--color-black), .6);
    border-radius: .6rem;
    box-shadow: 0 0 .3rem 0 rgba(var(--color-primary), .8);
    backdrop-filter: blur(.4rem);
    cursor: pointer;
}
.no-blur div.btn-form,
.no-blur .btn-scroll {
    background-color: rgba(var(--color-black), .8);
}
.form-done div.btn-form {
    pointer-events: none;
}
div.btn-form h5,
.nf-field-element input[type="submit"] {
    align-self: center;
    line-height: 1em;
    white-space: nowrap;
}
div.btn-form .icon,
nf-field .submit-wrap + .icon {
    position: relative;
    height: 3.6rem;
    width: 3.6rem;
    padding-top: 0;
    padding-bottom: 0;
    color: #FFF;
    background: rgb(var(--color-primary));
    border-radius: .6rem;
    box-shadow: 0 0 .4rem 0 rgba(255,255,255,.5) inset;
}
.pop-form[data-type="send"] nf-field .submit-wrap + .icon  {
    background: rgb(var(--color-secondary));
}
.pop-form[data-type="orchestrate"] nf-field .submit-wrap + .icon  {
    background: rgb(var(--color-accent));
}
div.btn-form svg,
nf-field .submit-wrap + .icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.1rem;
    transform: translate(-50%, -50%);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
div.btn-form:hover svg.chevron {
    transform: translate(-50%, -50%) rotate(-180deg);
}
div.btn-form svg.chevron,
div.btn-form.active svg.spin,
nf-field .submit-wrap + .icon svg {
    opacity: 1;
}
div.btn-form.active svg:not(.spin) {
    opacity: 0;
}
div.btn-form svg.spin {
    width: 2rem;
}
div.btn-form svg.check {
    width: 1.8rem;
}
.form-done div.btn-form svg.check {
    opacity: 1!important;
}
.form-done .btn-form svg:not(.check) {
    opacity: 0!important;
}
div.btn-form.active svg.spin {
    animation: iconSpin 1s linear infinite;
}
div.btn-form svg.chevron path,
nf-field .submit-wrap + .icon svg path {
    stroke: #FFF;
    stroke-width: .1rem;
}
div.btn-form svg.check path {
    stroke-width: .2rem;
}
@keyframes iconSpin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}
header + section {
    padding-top: 10rem;
}
@media (max-width: 1200px) {
    header .menu {
        gap: 2.5rem;
    }
}
@media (max-width: 1000px) {
    #logo:hover .content {
        bottom: 1rem;
    }
    header .nav-center,
    header .nav-right {
        display: none;
    }
    header #menu-btn {
        display: flex;
    }
    .nav-mobile {
        display: grid;
    }
    .nav-btn svg {
        top: -.5rem;
    }
}
@media (max-width: 550px) {
    header nav {
        padding: 2rem 2.2rem;
    }
    body:not(.menu-open) header.fixed nav {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }
    .nav-mobile {
        padding-top: 11rem;
    }
}
@media (max-height: 550px) {
    .nav-mobile {
        padding-top: 9.5rem;
    }
}
/* HOME */
.hero-home,
.hero,
.support,
.error-404 {
    position: relative;
    min-height: 100vh;
    padding: 6rem 0;
}
.hero-home,
.hero-home .bg {
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
.ios .hero-home,
.ios .hero-home .bg {
    background-attachment: scroll;
}
.hero-home .bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.hero-home .bg.active,
.form-open .hero-home .bg,
.form-done .hero-home .bg {
    opacity: 1;
}
.hero-home .h-wrap {
    position: relative;
}
.hero-home h1 {
    text-wrap: balance;
}
.hero-home h1 em {
    display: inline;
}
.hero-home .h-wrap > p {
    max-width: 56rem;
    margin: 0 auto .2em;
}
.hero-home .form-cta {
    gap: 1.2rem 2rem;
    max-width: 46rem;
    margin: 3rem auto 0;
}
.hero-home .form-cta p {
    align-self: center;
    margin-bottom: 0;
    text-align: left;
}
.ticker-scroll {
    position: absolute;
    bottom: 3rem;
    left: 3.2rem; right: 3.2rem;
    padding: 1.6rem;
    overflow: hidden;
    white-space: nowrap;
}
.ticker {
    display: inline-flex;
    gap: 3.2rem;
    font-size: 1.2rem;
    letter-spacing: .1em;
    will-change: transform;
}
.ticker-item {
    position: relative;
    flex-shrink: 0;
    gap: .9rem;
    white-space: nowrap;
    z-index: 1;
}
.ticker-item > * {
    cursor: default;
}
.ticker-item .amount {
    font-family: system-ui;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
}
.ticker-item.in .amount {
    color: rgb(var(--color-accent));
}
.ticker-item.out .amount {
    color: rgb(var(--color-primary));
}
.ticker-item svg {
    position: relative;
    top: .2rem;
    width: auto;
    height: .9rem;
    opacity: 1;
}
.ticker-item.out svg {
    transform: rotate(180deg);
}
.ticker-item.in svg path {
    fill: rgb(var(--color-accent));
}
.ticker-item.out svg path {
    fill: rgb(var(--color-primary));
}
.ticker-item .effect,
.btn .effect {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.ticker-effect,
.button-effect {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 998;
}
.button-effect {
    transform: translateX(-100%);
}
.effect-clone {
    position: absolute;
    height: 20rem;
    max-height: 0;
    transform: translateY(-100%);
    opacity: 0;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.ios .effect-clone,
.ios .effect-clone .effect-item {
   display: none;
} 
.effect-clone.show {
    animation: tickerEffect 4s ease-in-out forwards;
}
@keyframes tickerEffect {
    30% {
        max-height: 10rem;
        opacity: 1;
    }
    80% {
        opacity: 1;
    }
    100% {
        max-height: 20rem;
        transform: translateY(-250%);
        opacity: 0;
    }
}
.effect-clone .effect-item {
    position: absolute;
}
.effect-clone .effect-item-1 {
    top: 0;
}
.effect-clone .effect-item-2 {
    top: 50%;
}
.effect-clone .effect-item-3 {
    top: 100%;
    opacity: .4;
}
.effect-clone .emoji {
    font-size: 2rem;
    line-height: 1em;
}
.ticker-effect .emoji {
    position: absolute;
}
.ticker-effect .effect-item-1 .emoji {
    top: 0;
    right: 0;
    transform: translate(50%, -60%);
}
.ticker-effect .effect-item-2 .emoji-1 {
    top: 0;
    left: 0;
    transform: translate(-.6em, -.6em);
}
.ticker-effect .effect-item-2 .emoji-2 {
    bottom: 0;
    right: 0;
    transform: translate(-.4em, -.8em);
    opacity: .7;
}
.ticker-effect .effect-item-3 .emoji {
    top: 0;
    right: 0;
    transform: translate(60%, -60%);
}
@media (max-width: 600px) {
    .ios .hero-home,
    .ios .hero,
    .ios .support,
    .ios .error-404 {
        min-height: 85vh;
    }
    .hero-home .h-wrap p {
        text-wrap: balance;
    }
   .hero-home .form-cta {
       flex-direction: column;
   }
   .hero-home .form-cta div.btn-form {
       min-width: 20rem;
        margin: 0 auto;
   }
   .hero-home .form-cta p {
       text-align: center;
   }
   .ticker-effect .effect-item-2 .emoji-2 {
       display: none;
   }
}
/* TIMER */
.timer {
    background-color: rgb(var(--color-black));
}
.timer .h-wrap {
    position: relative;
}
.timer .intro {
    position: relative;
}
.timer .intro .content{
    gap: 2rem 10rem;
    transform: translateY(8rem);
    /*padding-bottom: 0;*/
}
.timer .sticky {
    position: absolute;
    top: 0; bottom: 0;
    left: 0;
    right: 0
}
.timer .sticky.fixed {
    position: fixed;
}
.timer .intro .content.spacer {
    opacity: 0;
    pointer-events: none;
}
.timer h1 {
    line-height: .85em;
}
.timer .intro .content h1 {
    width: 100%;
    max-width: 75rem;
    line-height: .85em;
    text-transform: uppercase;
}
.timer .intro .content h1 em {
    display: block;
    margin-bottom: .05em;
    text-align: right;
}
.timer .intro .col {
    width: 37rem;
}
.timer .element {
    position: relative;
}
.timer .element .obj {
    width: 100%;
    max-width: 70rem;
    max-height: 90vh;
    aspect-ratio: 1/1;
    margin: 5.5rem auto 0;
}
.timer .element .ring {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
}
.timer .element .segment {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 2;
}
.timer .element .segment g {
    animation: timerSpin 6s linear infinite;
    transform-origin: 200px 200px;
}
.no-spin .timer .element .ring,
.no-spin .timer .element .segment {
    display: none;
}
@keyframes timerSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.timer .cir {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 81%;
    aspect-ratio: 1/1;
    background: conic-gradient(from 0deg at 50% 50%, rgba(var(--color-secondary), .8) 0deg, rgba(var(--color-black), 0.8) 360deg, rgba(var(--color-black), 0.8) 360deg);
    border-radius: 50%;
    box-shadow:
    0 0 0 .1rem rgba(var(--color-grey), .5), /* fake border */
    0 0 1rem rgba(255, 255, 255, .1) inset,  /* matches stdDeviation="4" */
    0 0 .5rem rgba(255, 255, 255, .2) inset;
    backdrop-filter: blur(.5rem);
}
.timer .clock {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.timer .clock p {
    position: relative;
    font-family: var(--font-secondary);
    font-size: 2.5rem;
    font-style: italic;
}
.timer .clock p span {
    opacity: 0;
    -webkit-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
}
.timer .clock p span.active {
    opacity: 1;
}
.timer .clock p .to {
    position: absolute;
    top: 0;
    right: 0;
}
.timer .clock h1 {
    font-size: 6rem;
    white-space: nowrap;
}
.timer num {
    display: inline-block;
    width: 1ch;
    text-align: center;
}
.timer .counter {
    position: absolute;
    left: 50%;
    bottom: 12%;
    transform: translateX(-50%);
    padding-top: 2rem;
}
.timer .counter p {
    display: flex;
    align-items: center;
    gap: 0 1rem;
}
.timer .counter p span:not(.large) {
    font-size: 1.1rem;
}
.timer .counter num {
    font-family: system-ui;
    width: 1.05ch;
}
.timer .scroll-anim-1 {
    height: 100vh;
    margin-bottom: 50rem;
}
.timer .outro {
    position: relative;
    padding-top: 0;
}
.outro .content.spacer,
.outro .panel-2 {
    opacity: 0;
    pointer-events: none;
}
.timer .outro .panels {
    position: relative;
    max-width: 100rem;
    margin: 0 auto;
}
.outro .panel-1,
.outro .content.sticky .panel-2:not(.spacer) {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-transition: .1s ease-in-out;
    transition: .1s ease-in-out;
}
.outro .panel-1 p {
    max-width: 62rem;
    margin: 0 auto;
}
.outro .panel-2 h1 {
    display: inline-flex;
    flex-direction: column;
    text-align: left;
    text-transform: uppercase;
}
.outro .panel-2 h1 span {
    display: block;
    margin-left: auto;
}
.timer .scroll-anim-2 {
    height: 80vh;
    margin: 30vh 0 50vh;
}
@media (max-width: 1100px) {
    .timer .intro .content{
        gap: 2rem 7rem;
    }
}
@media (max-width: 1000px) {
    .timer .intro .content {
        flex-direction: column;
        justify-content: flex-start;
        max-width: 80rem;
        margin: 0 auto;
    }
    .timer .intro .col {
        width: auto;
        text-align: center;
    }
    .timer .intro .col br.res {
        display: none;
    }
}
@media (max-width: 600px) {
    .timer .clock h1 {
        font-size: 4rem;
    }
    .timer .clock p {
        font-size: 2rem;
    }
    .timer .element .obj {
        margin-top: 20rem;
    }
    .timer .scroll-anim-1 {
        height: 70vh;
        margin-bottom: 40rem;
    }
    .outro .panel-2 h1 {
        text-align: center;
    }
    .outro .panel-2 h1 span {
        margin-right: auto;
    }
}
@media (max-width: 500px) {
    .timer .clock h1 {
        font-size: 3rem;
    }
    .timer .counter p {
        flex-direction: column;
    }
    .timer .counter p .large {
        font-size: 1.1em;
        line-height: 1em;
    }
}
@media (max-width: 400px) {
    .timer .clock h1 {
        font-size: 2.5rem;
    }
}
/* FEAT PRODUCTS */
.feat-products {
    position: relative;
    background-color: rgb(var(--color-white));
    background-position: center;
    background-size: cover;
}
.feat-products > .content {
    margin-bottom: 6.4rem;
}
.feat-products h2 {
    position: relative;
}
.feat-products h2 span {
    text-transform: uppercase;
}
.feat-products h2 .section-button-effect {
    position: absolute;
    width: 43%;
    top: 4%;
    right: 2%;
}
.feat-products .button {
    position: relative;
    justify-content: flex-end;
    padding-bottom: 1rem;
}
.feat-products .button .section-button-effect {
    position: absolute;
    top: 4%;
    right: -30%;
    width: 110%;
}
.slider-wrap {
    position: relative;
}
.slick-list {
    overflow: visible;
}
.slick-track {
    display: flex;
    align-items: stretch;
    margin: 0 -1.5rem;
}
.slick-track .slide {
    height: auto;
    padding: 0 1.5rem;
}
.slider-wrap .controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    pointer-events: none;
}
.slider-wrap .arrow {
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.slider-wrap .arrow.active {
    opacity: 1;
    pointer-events: all;
}
.slider-wrap .arrow-left {
    transform: translateX(-4.5rem) rotate(180deg);
}
.slider-wrap .arrow-right {
    transform: translateX(1.5rem);
}
.slider-wrap .arrow svg {
    opacity: 1;
    width: 6rem;
    height: auto;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.slider-wrap .arrow svg path {
    fill: rgb(var(--color-primary));
}
.feat-products .card,
.feat-products .card .img-wrap,
.feat-products .card .content {
    height: 100%;
}
.feat-products .card {
    background-color: rgba(255, 255, 255, .2);
}
.feat-products .card:not(.fancy) {
    background-color: rgba(255, 255, 255, .2);
    box-shadow: var(--box-shadow);
}
.feat-products .card:hover {
    background-color: rgba(255, 255, 255, .8);
}
.feat-products .card .img {
    position: relative;
    min-height: 26rem;
    max-height: 26rem;
}
.feat-products .card .img-overlay {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
    background-position: center;
    background-size: cover;
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.feat-products .card:hover .img-overlay {
    opacity: 1;
}
.feat-products .card .img-overlay .btn {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}
.products .card h4 + p {
    font-size: 1.3rem;
}
.products .card.fancy {
    position: relative;
    background: rgba(var(--color-black), .6);
    border-radius: 1.2rem;
}
.products .card.fancy:hover {
    background: rgba(var(--color-black), .9);
}
.products .card.fancy:before {
    content: '';
    position: absolute;
    inset: -.2rem;
    border-radius: 1.2rem;
    padding: .3rem;
    background: conic-gradient(
        from var(--angle),
        transparent 0deg 90deg,
        rgb(var(--color-primary)) 90deg 120deg,
        transparent 120deg
    );
    -webkit-mask: linear-gradient(#fff 0 0) content-box, 
                    linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: rotateBorder 6s linear infinite;
    z-index: 1;
}
.products .card.fancy:after {
    content: '';
    position: absolute;
    inset: -.5rem;
    border-radius: calc(1.2rem + .5rem);
    padding: .8rem;
    background: conic-gradient(
        from var(--angle),
        transparent 0deg 87deg,
        rgba(var(--color-primary), 0.4) 90deg 120deg,
        transparent 123deg
    );
    -webkit-mask: linear-gradient(#fff 0 0) content-box, 
                    linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    filter: blur(.8rem);
    opacity: 0.5;
    animation: rotateBorder 6s linear infinite;
    z-index: 0;
}
.products .card.fancy > * {
    position: relative;
    z-index: 2;
}
@property --angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}
@keyframes rotateBorder {
    from {
        --angle: 0deg;
    }
    to {
        --angle: 360deg;
    }
}
.products .card.fancy h4,
.products .card.fancy h4 *,
.products .card.fancy p,
.products .card.fancy p * {
    color: #FFF;
}
.products .card.fancy h4 + p,
.products .card.fancy h4 + p * {
    color: rgba(255,255,255, .6);
}
@media (max-width: 1000px) {
    .feat-products > .content {
        flex-direction: column;
    }
    .feat-products .button {
        display: block;
    }
}
@media (min-width: 600px) {
    .slider-wrap .arrow:hover svg {
        transform: rotate(-8deg);
    }
}
@media (max-width: 600px) {
    .feat-products .card .btn-plus {
        display: none;
    }
}
/* VIDEO SCROLL */
.vid-scroll {
    position: relative;
    background-color: rgb(var(--color-black));
    overflow: hidden;
}
.vid-scroll video,
.vid-scroll canvas {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    z-index: 0;
}
.vid-scroll canvas {
    z-index: 0;
}
.vid-scroll .overlay {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
    background: linear-gradient(0deg, rgba(var(--color-black), .2) 0%, rgba(var(--color-black), .2) 100%), linear-gradient(63deg, rgba(var(--color-black), 0) 42%, rgba(var(--color-black), .6) 73%), linear-gradient(180deg, rgba(var(--color-black), 1) 0%, rgba(var(--color-black), 0) 40.87%), linear-gradient(0deg, rgba(var(--color-primary), .4) 0%, rgba(var(--color-primary), .4) 100%), linear-gradient(rgba(var(--color-black), 0) 20%, rgba(var(--color-black), .95) 60%);
    background-blend-mode: normal, normal, normal, color, normal;
    backdrop-filter: blur(.5rem);
    z-index: 1;
}
.vid-scroll .bars {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
    max-width: 100rem;
    margin: 0 auto;
    z-index: 3;
}
.vid-scroll .bar {
    position: absolute;
    width: 18.5%;
}
.vid-scroll .bar-1 {
    top: 50%;
    bottom: -50%;
    left: 1.5%;
    filter: blur(.4rem);
    backdrop-filter: blur(.4rem);
}
.vid-scroll .bar-2 {
    top: 80%;
    bottom: -50%;
    left: 20%;
    border: .2rem solid rgba(var(--color-grey), .3);
    filter: blur(.2em);
}
.vid-scroll .bar-3 {
    top: -50%;
    bottom: 15%;
    right: 10%;
    background: linear-gradient(180deg, rgba(var(--color-grey), .3) 70%, rgba(var(--color-grey), 0) 90%);
    filter: blur(.4em);
    backdrop-filter: blur(.4em);
}
.vid-scroll .content {
    position: relative;
}
.vid-scroll .title {
    position: relative;
    max-width: 100rem;
    margin: 0 auto 4rem;
    z-index: 2;
}
.vid-scroll .title h1 {
    text-transform: uppercase;
}
.vid-scroll .title h1:last-child {
    position: relative;
    margin-bottom: 0;
    text-align: right;
}
.vid-scroll .title.spacer {
    position: absolute;
    top: 0;
    left: 0; right: 0;
    z-index: 4;
}
.vid-scroll .title.spacer span {
    opacity: 0;
    pointer-events: none;
}
.vid-scroll .section-button-effect {
    position: absolute;
    top: 16%;
    left: 36%;
    right: -15%;
    width: auto;
}
.vid-scroll .text-center {
    position: relative;
    z-index: 4;
}
.vid-scroll p {
    margin-bottom: 0;
}
@media (min-width: 600px) {
    .slider-wrap .arrow:hover svg {
        transform: rotate(-8deg);
    }
}
/* STATS */
section.stats {
    position: relative;
    background-color: rgb(--var(color-white));
    background-position: center;
    background-size: cover;
}
.stats .h-wrap {
    max-width: 150rem;
    margin: 0 auto;
}
.stats .title {
    position: relative;
    margin-bottom: 11rem;
}
.stats .title > img {
    width: 100%;
}
.stats .letters {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
    z-index: 1;
}
.stats .letter {
    position: absolute;
    width: 18%;
    transform: translate(-50%, -50%);
}
.stats .letter[data-letter="1"] {
    top: 34%;
    left: 6.5%;
    --tx: 6;
    --ty: 60;
    --r: 45;
}
.stats .letter[data-letter="2"] {
    top: 19%;
    left: 18%;
    --tx: 19;
    --ty: -7;
    --r: -28;
}
.stats .letter[data-letter="3"] {
    top: 36.5%;
    left: 28%;
    --tx: 23;
    --ty: 46;
    --r: 28;
}
.stats .letter[data-letter="4"] {
    top: 19%;
    left: 38%;
    width: 20%;
    --tx: 44;
    --ty: 16;
    --r: 29;
}
.stats .letter[data-letter="5"] {
    top: 26%;
    left: 51%;
    width: 15%;
    --tx: 84;
    --ty: 65;
    --r: 22;
}
.stats .letter[data-letter="6"] {
    top: 37%;
    left: 61%;
    width: 7%;
    --tx: 191;
    --ty: -102;
    --r: 9;
}
.stats .letter[data-letter="7"] {
    top: 68%;
    left: 53%;
    width: 19%;
    --tx: -41;
    --ty: 71;
    --r: 38;
}
.stats .letter[data-letter="8"] {
    top: 65%;
    left: 66%;
    --tx: 92;
    --ty: 21;
    --r: -38;
}
.stats .letter[data-letter="9"] {
    top: 80%;
    left: 76%;
    --tx: -26;
    --ty: 62;
    --r: -17;
}
.stats .letter[data-letter="10"] {
    top: 73%;
    left: 88.5%;
    width: 16%;
    --tx: 40;
    --ty: -123;
    --r: 28;
}
.stats .letter[data-letter="11"] {
    top: 89%;
    left: 96%;
    width: 6.5%;
    --tx: -2;
    --ty: 2;
    --r: 3;
}
.mouse {
    -webkit-transition: .2s ease-out;
    transition: .2s ease-out;
}
.wobble {
    -webkit-transition: 3s ease;
    transition: 3s ease;
}
.letter img {
    width: 100%;
    -webkit-transition: .5s cubic-bezier(0.34, 1.56, 0.64, 1);
    transition: .5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.letters:not(.go) .letter img {
    transform: translate(calc(var(--tx) * 1%), calc(var(--ty) * 1%)) rotate(calc(var(--r) * 1deg));
}
@keyframes elasticBounce {
    0% {
        transform: translate(calc(var(--tx) * 1%), calc(var(--ty) * 1%)) rotate(calc(var(--r) * 1deg));
        animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    }
    18% {
        transform: translate(calc(var(--tx) * -0.35%), calc(var(--ty) * -0.35%)) rotate(calc(var(--r) * -0.23deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    32% {
        transform: translate(calc(var(--tx) * 0.2%), calc(var(--ty) * 0.2%)) rotate(calc(var(--r) * 0.13deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    46% {
        transform: translate(calc(var(--tx) * -0.12%), calc(var(--ty) * -0.12%)) rotate(calc(var(--r) * -0.08deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    60% {
        transform: translate(calc(var(--tx) * 0.07%), calc(var(--ty) * 0.07%)) rotate(calc(var(--r) * 0.045deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    74% {
        transform: translate(calc(var(--tx) * -0.04%), calc(var(--ty) * -0.04%)) rotate(calc(var(--r) * -0.025deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    85% {
        transform: translate(calc(var(--tx) * 0.02%), calc(var(--ty) * 0.02%)) rotate(calc(var(--r) * 0.013deg));
        animation-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
    }
    93% {
        transform: translate(calc(var(--tx) * -0.008%), calc(var(--ty) * -0.008%)) rotate(calc(var(--r) * -0.005deg));
        animation-timing-function: ease-out;
    }
    100% {
        transform: translate(0, 0) rotate(0deg);
    }
}
.letters.go .letter img {
    animation: elasticBounce 1.4s cubic-bezier(0.25, 0, 0.25, 1) forwards;
}
.stats .tabs {
    gap: 0 4rem;
}
.stats .tabs-nav .spacer-wrap {
    position: relative;
}
.stats .tabs-nav .items:not(.spacer) {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
}
.stats .tabs-nav .spacer {
    opacity: 0;
    pointer-events: none;
}
.stats .tabs-nav {
    width: calc(40% - 2rem);
    padding: 2rem 0;
}
.stats .tabs-nav .content {
    margin-bottom: 4rem;
}
.stats .tabs-nav .content .large {
    line-height: 1.2em;

}.tabs-nav .item {
    cursor: pointer;
}
.tabs-nav .item * {
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.tabs-nav .item:not(.active):not(:hover) * {
    color: rgb(var(--color-grey));
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.tabs-nav .item-title {
    position: relative;
}
.stats .tabs-nav .item-title p {
    position: relative;
    z-index: 1;
}
.tabs .item-effect {
    position: absolute;
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.tabs-nav .item.active .item-effect {
    opacity: 1;
}
.tabs-nav .item-effect-1 {
    top: 0;
    left: 0;
    transform: translate(-110%, -10%);
    width: 3rem;
}
.tabs-nav .item-effect-2 {
    width: 16rem;
    left: 0;
    bottom: 0;
    transform: translate(-10%, -10%);
 }
.tabs-nav .item-effect img {
    width: 100%;
}
.stats .tabs-nav .item-title + p {
    height: 100%;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.stats .tabs-nav .item.active .item-title + p,
.stats .tabs-nav .spacer .item:first-child .item-title + p {
    max-height: 10rem;
}
.stats .button-wrap.mobi {
    display: none;
}
.stats .button {
    position: relative;
    display: inline-block;
}
.stats .button .section-button-effect {
    position: absolute;
    top: 72%;
    right: -50%;
    width: 75%;
}
.stats .tabs-nav .btn {
    margin-top: 1.5rem;
}
.tabs-content {
    position: relative;
}
.tabs-content .tab:not(:first-child) {
    position: absolute;
    top: 0; bottom: 0;
    left: 0; right: 0;
}
.tabs-content .tab:not(.active) {
    opacity: 0;
    pointer-events: none;
}
.stats .tabs-content {
    width: calc(60% - 2rem);
    border: .1rem solid rgb(--var(--color-grey));
    border-radius: 1.2rem;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.tabs-content .tab {
    height: 100%;
    border: .1rem solid rgb(--var(--color-grey));
    border-radius: 1.2rem;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.stats .tab {
    min-height: 55rem;
    padding: 4rem;
    background-position: center;
    background-size: cover;
    box-shadow: 0 0 2rem 0 rgba(var(--color-black), .5) inset;
}
.tabs-content .tab:not(.active) {
    transform: scale(1.05);
}
.stats .tab .img {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
/*.stats .tab .frame {
    height: 100%;
    padding: 1.2rem;
    background-color: rgba(255, 255, 255, .6);
    border: .1rem solid rgba(--var(--color-grey), .5);
    box-shadow: var(--box-shadow);
    backdrop-filter: blur(.5rem);
    border-radius: 1.2rem;
}
.stats .tab .img {
    height: 100%;
    background-position: center top;
    background-size: 100%;
    border-radius: 1rem;
}*/
.stats .tabs-content .section-button-effect {
    position: absolute;
    bottom: 9%;
    right: 14%;
    width: 53%;
}
@media (max-width: 1000px) {
    .stats .tab {
        min-height: 0;
    }
}
@media (max-width: 800px) {
    .stats .title {
        margin-bottom: 6rem;
    }
    .stats .tabs {
        flex-direction: column;
    }
    .stats .tabs-nav,
    .stats .tabs-content {
        width: 100%;
        padding-top: 0;
    }
    .stats .button-wrap.desk {
        display: none;
    }
    .stats .button-wrap.mobi {
        display: block;
    }
    .stats .tab .img {
        height: 35rem;
    }
}
@media (max-width: 600px) {
    .stats .tab {
        padding: 2rem;
    }
    .stats .tab .img {
        height: 25rem;
    }
}
@media (max-width: 500px) {
    .stats .tab {
        padding: 1rem;
    }
    .stats .tab .img {
        height: 18rem;
    }
}
/* POS */
.pos {
    position: relative;
    background-position: center;
    background-size: cover;
}
.pos .bg {
    position: absolute;
    top: 0; bottom: 0;
    right: 0; left: 0;
    background-position: center;
    background-size: cover;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.pos > .v-flex {
    justify-content: space-between;
    min-height: 100vh;
}
.pos .clients {
    gap: 1.5rem 8rem;
    padding: 1.2rem 2.4rem;
}
.pos .clients p {
    align-self: center;
}
.pos .clients .imgs {
    flex: 1;
    gap: 2rem;
}
.pos .clients img {
   max-height: 2.5rem;
   align-self: center;
}
.pos .clients img.small {
   max-height: 1.4rem;
}
.pos .clients img.large {
   max-height: 3rem;
}
.pos .content {
    gap: 3rem 10rem;
    margin-top: 40rem;
}
.pos h1 {
    position: relative;
    width: 100%;
    max-width: 40rem;
    font-family: var(--font-secondary);
    line-height: .8em;
    font-weight: 300;
    text-align: right;
}
.pos h1,
.why > .content h1 {
    font-size: 12rem;
}
.pos h1 em {
    text-align: left;
}
.pos h1 .section-button-effect {
    position: absolute;
    top: 20%;
    left: 4%;
    width: 56%;
}
.pos .content .col {
    justify-content: flex-end;
    max-width: 55rem;
    margin: 0 auto;
}
.pos .content .col p {
    position: relative;
    text-shadow: 0 0 5rem rgb(var(--color-black));
}
.pos .content .btn {
    margin-top: 0;
}
@media (max-width: 1200px) {
    .pos .clients {
        gap: 1.5rem 3rem;
    }
    .pos .clients img {
        max-height: 1.8rem;
    }
    .pos .clients img.small {
        max-height: 1.2rem;
    }
    .pos .clients img.large {
        max-height: 2.5rem;
    }
}
@media (max-width: 1000px) {
    .pos .clients {
        flex-direction: column
    }
    .pos .clients p {
        text-align: center;
    }
    .pos h1 {
        font-size: 10rem;
    }
}
@media (max-width: 800px) {
    .pos > .v-flex {
        min-height: auto;
    }
    .pos .clients .imgs {
        justify-content: center;
        flex-wrap: wrap;
        gap: 1.5rem;
    }
    .pos .clients img {
        max-height: 1.5rem;
    }
    .pos .clients img.small {
        max-height: 1.1rem;
    }
    .pos .clients img.large {
        max-height: 2.2rem;
    }
    .pos .content {
        margin-top: 20rem;
    }
}
@media (max-width: 700px) {
    .pos .clients img {
        max-height: 1.3rem;
    }
    .pos .clients img.small {
        max-height: 1rem;
    }
    .pos .clients img.large {
        max-height: 1.8rem;
    }
    .pos .content {
        flex-direction: column;
    }
    .pos h1,
    .why > .content h1 {
        max-width: 100%;
    }
}
@media (max-width: 550px) {
    .pos .clients .imgs {
        gap: 2rem;
    }
    .pos .clients img {
        max-height: 1.8rem;
    }
    .pos .clients img.small {
        max-height: 1.2rem;
    }
    .pos .clients img.large {
        max-height: 2.5rem;
    }
}
@media (max-width: 500px) {
    .pos h1,
    .why > .content h1 {
        font-size: 8rem;
    }
}
/* WHY */
.why {
    position: relative;
    background-position: center;
    background-size: cover;
}
.why .spacer-wrap,
.why .card-wrap {
    position: relative;
}
.why .spacer {
    opacity: 0;
    pointer-events: none;
}
.why .panels:not(.spacer),
.why .panels:not(.spacer) .card-wrap .h-wrap:not(.spacer) {
    position: absolute;
    top: 0;
    left: 0; 
    right: 0;
}
.why .sticky {
    -webkit-transition: transform .2 ease-out;
    transition: transform .2s ease-out;
}
.why .card {
    min-height: 25rem;
    margin-bottom: 2rem;
    padding: 2rem;
    background-color: rgba(var(--color-white), .6);
    overflow: hidden;
}
.no-blur .why .card {
    background-color: rgba(var(--color-white), .9);
}
.why .card .bg {
    position: absolute;
    inset: 0;
    background-position: center center;
    background-size: cover;
}
.why .card .content {
    position: relative;
    justify-content: center;
    margin: 0 auto;
}
.why .card.has-items .col {
    gap: 0!important;
}
.why h1,
.why .panels h2 {
    margin-bottom: 0;
    text-transform: uppercase;
    text-wrap: balance;
}
.why h1 em {
    display: inline;
}
.why .card .flex {
    gap: 1rem 8rem;
}
.why .card.has-items .col {
    max-width: 40rem;
}
.why .card p:last-of-type {
    margin-bottom: 0;
}
.why .card .items {
    position: relative;
}
.why .card .items h2 {
    margin-bottom: .3em;
}
.why .card .items p {
    position: relative;
    text-transform: uppercase;
    cursor: default;
}
/*.why .card .items p:not(.hover) {
    z-index: 2;
}*/
.why .card .items p.hover em {
    font-family: var(--font-secondary);
}
.why .card .items p:not(.hover) em {
    font-style: normal;
}
.why .card .items img {
    position: absolute;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 17rem;
    max-height: 20rem;
    opacity: 0;
    pointer-events: none;
    z-index: 1;
    -webkit-transition: opacity .2 ease-out;
    transition: opacity .2s ease-out;
}
.why .card .items p.hover img {
    opacity: 1;
}
.why .card .overlay-text {
    position: absolute;
    transform: translate(-.1rem, -.1rem);
    overflow: hidden;
    opacity: 0;
    z-index: 3;
    pointer-events: none;
    transition: opacity .2s ease-out;
}
.why .card .overlay-text p {
    position: absolute;
    text-transform: uppercase;
    white-space: nowrap;
}
.why .card .overlay-text span {
    color: rgb(var(--color-white))!important;
}
.why .scroll-anim {
    height: 20rem;
    margin-bottom: 20rem;
}
.why > .content h1 em {
    font-family: var(--font-primary);
}
.why .tabs {
    gap: 11rem;
    padding-top: 0;
}
.why .tabs-nav {
    width: 40%;
    padding: 6rem 0;
}
.why .tabs-nav .item {
    margin-bottom: 1rem;
}
.why .tabs-nav h2 {
    text-transform: uppercase;
}
.why .tabs-nav .item-effect-1 {
    transform: translate(-100%, 13%);
}
.why .tabs-nav .item-effect-2 {
    width: 67%;
    transform: translate(-5%, 10%);
}
.why .button-wrap.mobi {
    display: none;
}
.why .tabs-content {
   flex: 1;
}
.why .tab {
    position: relative;
    width: 100%;
    padding: 5.4rem;
}
.why .tab .border,
.why .tab .bg-clip {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 1.2rem;
    overflow: hidden;
    pointer-events: none;
}
.why .tab .border {
    border: 1px solid var(--Stroke-Grey, #919191);
    background: linear-gradient(8deg, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, 0) 75%);
    background-blend-mode: multiply;
    box-shadow: 0 0 2rem 0 rgba(var(--color-black), .5) inset;
}
.why .tab .bg-clip .bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}
.why .tab p,
.why .tab span {
    position: relative;
    max-width: 45rem;
    margin: 0 auto;
    color: rgb(var(--color-white));
    font-weight: 500;
    text-wrap: balance;
}
.why .tab .bg-clip.spacer .bg {
    opacity: 0;
    pointer-events: none;
}
.why .tab .bg-clip.spacer {
    opacity: 1;
    overflow: visible;
}
.why .tab .section-button-effect {
    position: absolute;
}
.why .tab:hover .section-button-effect {
    opacity: 1;
}
.why .tab .section-button-effect img {
    transform: translate(-50%, -50%);
}
.why .tab[data-tab="1"] .section-button-effect {
    top: 37%;
    left: 45%;
    width: 63%;
}
.why .tab[data-tab="2"] .section-button-effect {
    top: 79%;
    left: 0;
    width: 22%;
}
.why .tab[data-tab="3"] .section-button-effect-1 {
    top: 69%;
    left: 13%;
    width: 21%;
}
.why .tab[data-tab="3"] .section-button-effect-2 {
    top: 39%;
    left: 72%;
    width: 16%;
}
.why .tab[data-tab="4"] .section-button-effect {
    top: 45%;
    left: 70%;
    width: 14%;
}
.why .btn {
    margin-top: 0;
}
@media (max-width: 800px) {
    .why .card .flex {
        flex-direction: column;
        text-align: center;
    }
    .why .tabs {
        flex-direction: column;
        gap: 2rem;
        padding-bottom: 4rem;
    }
    .why .tabs-nav {
        width: 100%;
        padding: 0;
    }
    .why .card.has-items .col {
        max-width: 100%;
    }
    .why .card .col p {
        text-wrap: balance;
    }
    .why .tabs-nav .item {
        display: flex;
        justify-content: center;
    }
    .why .button-wrap.desk {
        display: none;
    }
    .why .tab {
        height: 25rem;
    }
    .why .button-wrap.mobi {
        display: block;
    }
}
@media (max-width: 600px) {
    .why .tabs-nav .item {
        justify-content: flex-start;
    }
}
@media (max-width: 400px) {
    .why > .content h1 {
        font-size: 5rem;
    }
    .why .card .content .items .large {
        font-size: inherit;
    }
}
/* TESTIMONIAL */
.testimonial {
    position: relative;
    padding: 4.2rem 3.3rem;
    overflow: hidden;
}
.testimonial .main-bg,
.testimonial .bg-effect {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}
.testimonial .panel {
    position: relative;
    min-height: 48rem;
    padding: 2rem;
    background-color: rgba(var(--color-black), .6);
    backdrop-filter: blur(.4rem);
    box-shadow: 0 1.7rem 2.3rem rgba(0, 0, 0, .5);
}
.testimonial .panel,
.testimonial .gap {
    border: .1rem solid rgba(var(--color-grey), .5);
    border-radius: 1.2rem;
}
.testimonial .content {
    width: 60%;
    padding: 3em;
}
.testimonial h1 {
    position: relative;
}
.testimonial .gap {
    position: relative;
    width: 40%;
    overflow: hidden;
}
.testimonial .gap::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 2rem rgba(0, 0, 0, .5);
    pointer-events: none;
    z-index: 1;
}
.testimonial .gap .bg {
    position: absolute;
}
.testimonial .effect {
    position: absolute;
    pointer-events: none;
}
.testimonial h1 .effect {
    bottom: 0;
    left: 42%;
    transform: translateY(54%);
    width: 89%;
    z-index: 1;
}
.testimonial > .effect {
    top: 2%;
    right: 2.5%;
    width: 11%;
    z-index: 3;
}
.testimonial .bg-effect {
    pointer-events: none;
}
.testimonial .bg-effect .effect {
    top: 37%;
    right: 10.8%;
    width: 7.5%;
    transform: translate(-50%, -50%);
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
.testimonial .bg-effect .effect img {
    transform-origin: center center;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
.testimonial .bg-effect .effect:not(.show) img {
    transform: scale(0) rotate(90deg);
}
@media (max-width: 800px) {
    .testimonial .panel {
        min-height: 35rem;
        z-index: 2;
    }
    .testimonial .content {
        width: 100%;
    }
    .testimonial h1 .effect {
        left: 10%;
        transform: translateY(70%);
        width: 75%;
    }
    .testimonial > .effect {
        width: 20%;
    }
    .testimonial .gap {
        display: none;
    }
}
@media (max-width: 500px) {
    .testimonial .panel {
        min-height: 30rem;
    }
    .testimonial h1 {
        font-size: 3rem;
    }
}
/* WHY PAGE */
.form-open .page-template-page-why .curtain {
    z-index: 1010;
}
.page-template-page-why .curtain:not(.done) {
    z-index: 2000;
}
.page-template-page-why section,
.floors {
    position: fixed;
    inset: 0;
    height: 100vh;
    background-position: center center;
    background-size: cover;
}
.page-template-page-why section:not(.active) {
    display: none;
}
.hero-why h1 {
    margin-top: 8rem;
    text-shadow: 0 0 5rem rgb(var(--color-black)), 0 0 5rem rgb(var(--color-black));
}
.hero-why p {
    text-wrap: balance;
}
.btn-elevator {
    display: inline-flex;
    margin: 8.5rem auto 0;
    padding: 3.2rem 1.6rem 1.6rem!important;
    gap: 3.2rem;
    box-shadow: 0 0 1.7rem 0 rgba(0, 0, 0, .05), -.3rem -.3rem .9rem 0 rgba(var(--color-black), .25) inset, 0 0 .9rem 0 rgba(var(--color-black), .3) inset;
    cursor: pointer;
}
.no-blur .btn-elevator {
    background-color: rgba(var(--color-black), .5);
}
.btn-elevator .icon {
    width: 5.8rem;
    height: 5.8rem;
    margin: 0 auto;
    border: .1rem solid rgba(var(--color-grey));
    border-radius: 50%;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-elevator .tri {
    position: relative;
    top: -.2rem;
    width: 2.6rem;
    height: 2.25rem;
    margin: 0 auto;
    background-color: rgb(var(--color-white));
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}
.btn-elevator p {
    text-transform: uppercasel
}
.page-template-page-why .scroll-anim {
    height: 100vh;
}
.nav-floors-btn,
.nav-floors-nums,
.nav-floors {
    position: fixed;
    left: 0;
    top: 50%;
    border-radius: 0 1.2rem 1.2rem 0;
    opacity: 0;
}
.nav-floors-btn.show,
.nav-floors-nums.show,
.nav-floors.show  {
    opacity: 1;
}
.nav-floors-btn {
    transform: translate(-.3rem, -50%);
    padding: .8rem 1rem .8rem .9rem;
    background-color: rgba(var(--color-black), .2);
    border: .1rem solid rgba(var(--color-grey), .5);
    box-shadow: 0 1.7rem 2.3rem 0 rgba(var(--color-black), .5);
    backdrop-filter: blur(.4rem);
    z-index: 1003;
    cursor: pointer;
    -webkit-transition: transform .2s ease-in-out, background-color .7s ease-in-out;
    transition: transform .2s ease-in-out, background-color .7s ease-in-out;
}
.menu-open .nav-floors-btn,
.menu-open .nav-floors,
.menu-open .nav-floors-nums,
.menu-open .floors-effects {
    z-index: 1;
}
.no-blur .nav-floors-btn {
    background-color: rgba(var(--color-black), .2);
}
.nav-floors-open .nav-floors-btn {
    background: rgba(var(--color-black), .6);
}
.nav-floors-open .nav-floors-btn .icon {
    transform: rotate(315deg);
}
.nav-floors-open .nav-floors-btn .icon span:nth-child(1),
.nav-floors-open .nav-floors-btn .icon span:nth-child(4) {
    width: .2rem;
    height: 100%;
    border-radius: 0;
}
.nav-floors-open .nav-floors-btn .icon span:nth-child(1) {
    left: 50%;
    transform: translateX(-50%);
}
.nav-floors-open .nav-floors-btn .icon span:nth-child(4) {
    right: 50%;
    transform: translateX(50%) rotate(90deg);
}
.nav-floors-open .nav-floors-btn .icon span:nth-child(2),
.nav-floors-open .nav-floors-btn .icon span:nth-child(3) {
    opacity: 0;
}
.nav-floors-nums,
.nav-floors {
    flex-direction: column-reverse;
    padding: 1.2rem 1.2rem 1.2rem 3.5rem;
}
.nav-floors-nums {
    transform: translateY(-50%);
    z-index: 1002;
    -webkit-transition: .6s ease-in-out;
    transition: .6s ease-in-out;
}
.nav-floors {
    transform: translate(-100%, -50%);
    background-color: rgba(255, 255, 255, .8);
    backdrop-filter: blur(.5rem);
    box-shadow: var(--box-shadow);
    opacity: .5;
    -webkit-transition: .7s ease-in-out;
    transition: .7s ease-in-out;
    z-index: 1001;
}
.nav-floors-open .nav-floors {
    transform: translate(0, -50%);
    opacity: 1;
}
.nav-floor {
    position: relative;
    gap: 1.2rem;
    padding: .4rem 1.2rem .4rem .4rem;
}
.nav-floor .bg {
    position: absolute;
    inset: 0;
    background-position: center top;
    background-size: 100% auto;
    border-radius: 1.2rem;
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    animation: scrollBackground 25s infinite paused;
}
.nav-floors-open .nav-floor.active:not(.unhover) .bg,
.nav-floor:hover .bg,
.nav-floor.hover .bg {
    opacity: 1;
    animation: scrollBackground 25s infinite;
}
@keyframes scrollBackground {
    0% {
        background-position: center 35%;
        animation-timing-function: ease-out;
    }
    50% {
        background-position: center 85%;
        animation-timing-function: ease-in-out;
    }
    100% {
        background-position: center 35%;
    }
}
.nav-floor .bg .overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(var(--color-black), .45);
    border-radius: 1.2rem;
}
.nav-floors-nums num,
.nav-floors num {
    width: 3.8rem;
    height: 3.8rem;
    font-size: 1.4rem;
    background-color: rgba(var(--color-black), .2);
    border: .1rem solid rgb(var(--color-grey));
    border-radius: 50%;
    backdrop-filter: blur(.5rem);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.nav-floors-nums num,
.nav-floors num,
.nav-floors-open .nav-floors-btn {
    box-shadow: 0 0 1.7rem 0 rgba(0, 0, 0, .05), -.3rem -.3rem .9rem 0 rgba(var(--color-black), .25) inset, 0 0 .9rem 0 rgba(var(--color-black), .30) inset;
}
.nav-floors-open .nav-floors-nums num {
    background-color: rgba(var(--color-black), .4);
}
.no-blur .nav-floors-open .nav-floors-nums num {
    background-color: rgba(var(--color-black), .6);
}
.nav-floors-nums .nav-floor.active num {
    background-color: rgba(var(--color-black), .6);
    border-color: rgb(var(--color-primary));
    box-shadow: 0 0 .4rem 0 rgb(var(--color-primary));
}
.no-blur .nav-floors-nums .nav-floor.active num {
    background-color: rgba(var(--color-black), .8);
}
.nav-floors num {
    opacity: 0;
}
.nav-floor {
    cursor: pointer
}
.nav-floor.active {
    cursor: default;
}
.nav-floor .flex {
    position: relative;
    flex: 1;
    gap: 1.2rem;
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.nav-floors-open .nav-floor .flex {
    opacity: 1;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
.nav-floors-open .nav-floor:nth-child(1) .flex {
    -webkit-transition-delay: .5s;
    transition-delay: .5s;
}
.nav-floors-open .nav-floor:nth-child(2) .flex {
    -webkit-transition-delay: .6s;
    transition-delay: .6s;
}
.nav-floors-open .nav-floor:nth-child(3) .flex {
    -webkit-transition-delay: .7s;
    transition-delay: .7s;
}
.nav-floors-open .nav-floor:nth-child(4) .flex {
    -webkit-transition-delay: .8s;
    transition-delay: .8s;
}
.nav-floors-open .nav-floor:nth-child(5) .flex {
    -webkit-transition-delay: .9s;
    transition-delay: .9s;
}
.nav-floors-open .nav-floor:nth-child(6) .flex {
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
}
.nav-floors-open .nav-floor:nth-child(7) .flex {
    -webkit-transition-delay: 1.1s;
    transition-delay: 1.1s;
}
.nav-floors-open .nav-floor:nth-child(8) .flex {
    -webkit-transition-delay: 1.2s;
    transition-delay: 1.2s;
}
.nav-floors-open .nav-floor:nth-child(9) .flex {
    -webkit-transition-delay: 1.3s;
    transition-delay: 1.3s;
}
.nav-floors-open .nav-floor:nth-child(10) .flex {
    -webkit-transition-delay: 1.4s;
    transition-delay: 1.4s;
}
.nav-floor .flex * {
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.nav-floor:not(.active):not(:hover):not(.hover) .flex *,
.nav-floor.unhover .flex * {
    color: rgb(var(--color-black));
}
.nav-floor p {
    align-self: center;
}
.nav-floor .name {
    font-family: var(--font-secondary);
    font-size: 2rem;
    text-transform: uppercase;
}
.nav-floor-names {
    display: none;
    position: absolute;
    bottom: -2rem;
    left: 6.4rem;
    opacity: 1;
    -webkit-transition: .3s ease-in-out .7s;
    transition: .3s ease-in-out .7s;
}
.nav-floor-names.show {
    display: block;
}
.nav-floors-open .nav-floor-names {
    opacity: 0;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.nav-floor-names p {
    display: none;
    transform: rotate(90deg);
    transform-origin: top left;
    text-transform: uppercase;
    text-shadow: 0 0 1rem rgba(var(--color-black), .7);
}
.nav-floor-names p.active {
    display: block;
}
.footer-floors {
    gap: 1rem;
    position: fixed;
    left: 2.4rem; right: 2.4rem;
    bottom: 2rem;
    z-index: 1;
}
.footer-floors:not(.show) {
    display: none;
}
.btn-scroll {
    padding-right: 1.6rem;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.btn-scroll:hover {
    background-color: rgba(var(--color-black), .8);
}
.btn-scroll.disabled {
    opacity: 0;
    cursor: default;
}
.floors-effects {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1000;
}
.floors-effects .floor-effect,
.floors-effects .floor-effects {
    position: absolute;
    inset: 0;
}
.floors-effects .floor-effect {
    opacity: 0;
}
.floors-effects .floor-effect.active {
    opacity: 1;
}
.floors-effects .effect {
    position: absolute;
    -webkit-transition: 15s ease-out;
    transition: 15s ease-out;
}
.floors-effects .effect-1 {
    top: 3%;
    left: 0;
    width: 45%;
}
.floors-effects .effect-2 {
    top: 14%;
    left: 47%;
    width: 42%;
}
.floors-effects .effect-3 {
    top: 48%;
    left: 30%;
    width: 15%;
}
.floor-effects:not(.go) .effect-1 {
    transform: translateX(-10%);
}
.floor-effects:not(.go) .effect-2 {
    transform: translateX(-40%);
}
.floor-effects:not(.go) .effect-3 {
    transform: translateX(-60%);
}
.floors-effects .effect img {
    width: 100%;
    height: auto;
}
.elevator {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1010;
}
.elevator > * {
    position: relative;
    width: 50%;
    height: 100%;
    overflow: hidden;
    transition: transform 1.5s cubic-bezier(0.65, 0, 0.35, 1);
}
.elevator.fast > * {
    transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);
}
.elevator > *:before  {
    content: '';
    position: absolute;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.elevator .left::before {
    right: -50vw;
}
.elevator .right:before {
    left: -50vw;
}
.elevator.open .left {
    transform: translateX(-100%);
}
.elevator.open .right {
    transform: translateX(100%);
}
.elevator .img {
    position: absolute;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-image: inherit;
    background-size: 80vw auto;
    background-position: 5vw center;
    background-repeat: no-repeat;
    pointer-events: none;
}
.elevator .left .img {
    right: -50vw;
}
.elevator .right .img {
    left: -50vw;
}
.floors {
    pointer-events: none;
}
.floors * {
    pointer-events: auto;
}
.floors .floor {
    position: absolute;
}
.floors .floor video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
}
.floors .floor .content {
    position: absolute;
    top: 50%;
    right: 2.4rem;
    transform: translateY(calc(-50% + 5rem));
    width: 100%;
    /*width: calc(100% - 12rem);*/
    max-width: 55rem;
    padding: 3.2rem;
    text-align: right;
    border: none;
    -webkit-transition: 1.5s ease-out;
    transition: 1.5s ease-out;
}
.floors .floor .content.go {
    transform: translateY(-50%);
}
.floors h2 {
    text-wrap: balance;
}
.floors .floor .content a {
    font-weight: 600;
}
.page-template-page-why footer {
    position: absolute;
    bottom: 0;
    width: 100%; 
    z-index: 1010;
}
@media (min-width: 700px) {
    .nav-floors-btn:hover {
        transform: translate(-.1rem, -50%);
        background: rgba(var(--color-black), .4);
    }
    .nav-floors-btn:hover .icon {
        transform: rotate(90deg);
    }
    .nav-floors-nums .nav-floor:hover num,
    .nav-floors-nums .nav-floor.hover num {
        background-color: rgba(var(--color-black), .6);
        border-color: rgb(var(--color-primary));
        box-shadow: 0 0 .4rem 0 rgb(var(--color-primary));
    }
}
@media (max-width: 700px) {
    .nav-floors-btn {
        background: rgba(var(--color-black), .4);
    }
    body:not(.nav-floors-open) .nav-floors-nums.show {
        opacity: 0;
    }
    .nav-floors .title,
    .nav-floor-names.show {
        display: none;
    }
    /*.nav-floors-nums, .nav-floors {
        padding-left: 1.2rem;
    }
    .nav-floor-names {
        left: 4.2rem;
    }*/
    .floors-effects {
        opacity: .8;
    }
    .floors-effects .effect-1 {
        top: 7%;
        width: 55%;
    }
    .floors-effects .effect-2 {
        top: 20%;
        width: 45%;
    }
    .floors-effects .effect-3 {
        top: 30%;
        left: 15%;
        width: 25%;
    }
    .floors .floor .content {
        right: 0;
        width: 75%;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .floors h2 {
        font-size: 3rem;
    }
}
@media (max-width: 400px) {
    .floors-effects .effect-3 {
        top: 27%;
    }
    .floors .floor .content {
        width: calc(100% - 10rem);
        padding-left: 2.5rem;
    }
    .floors h2 {
        font-size: 2.5rem;
    }
    .floors h2 em {
        display: inline;
    }
    .floor p .large {
        font-size: inherit;
        line-height: inherit;
    }
}
/*@media (max-height: 750px) {
    .footer-floors {
        justify-content: flex-end;
    }
    .footer-floors .btn-scroll {
        display: none;
    }
}*/
/* PRODUCTS PAGE */
.hero-products h1 em {
    display: block;
    margin-left: .1em;
}
.hero-products h3 {
    max-width: 50rem;
}
.products-bg-img-1 {
    position: absolute;
    top: -12rem;
    right: 0;
    width: 63%;
    mix-blend-mode: color-dodge;
}
.products-bg-img-2 {
    position: absolute;
    bottom: -8rem;
    right: 0;
    width: 45%;
}
.card {
    padding: .8rem;
    border-radius: 1.2rem;
    border: .1rem solid rgba(var(--color-grey), .8);
    border-radius: 12px;
    
    backdrop-filter: blur(.5rem);
    -webkit-transition: .3s ease-in-out;
    -webkit-transition-delay: 0!important;
    transition: .3s ease-in-out;
	transition-delay: 0s!important;
}
.filters {
    position: relative;
    z-index: 1;
    margin-top: -2rem;
}
.filters > .h-wrap {
    top: 2rem;
}
.filters .sticky {
    position: absolute;
    width: 100%;
    -webkit-transition: .2 ease-out;
    transition: .2s ease-out;
}
.filters .sticky.fixed {
    position: fixed;
    top: 3rem;
}
.filters .spacer {
    position: relative;
    opacity: 0;
    pointer-events: none;
}
.filters .card {
    gap: .8rem
}
.filters > .h-wrap > .card,
.filters .cards {
    justify-content: flex-start;
    gap: 1.6rem;
}
.filters > .h-wrap > .card {
    padding: 2.4rem;
    background: rgba(var(--color-black), .5);
    box-shadow: 0 2rem 4rem 0 rgba(var(--color-black), .8);
}
.no-blur .filters > .h-wrap > .card {
    background: rgba(var(--color-black), .95);
}
.filters .card .card {
    padding: 1.2rem 2.4rem 1.2rem 1.2rem;
    cursor: pointer;
}
.filters .card[data-type="all"] {
    margin-left: auto;
}
.filters .card.active {
    color: rgb(var(--color-black));
    background-color: rgba(255,255,255,.9);
    box-shadow: var(--box-shadow);
}
.filters .card.active[data-type="all"] {
    pointer-events: none;
}
label {
    display: inline-flex;
    gap: .6rem;
    padding: .8rem 2.5rem .8rem .8rem;
    color: #000;
    font-size: 1.5rem;
    font-weight: bold;
    letter-spacing: .05rem;
    background-color: #FFF;
    border-radius: 10rem;
    white-space: nowrap;
    pointer-events: none;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.card.active[data-type="receive"],
.card[data-type="receive"]:not(.active) label,
.card[data-type="receive"] .btn-plus .plus { 
    background-color: rgb(var(--color-primary));
}
.card.active[data-type="send"],
.card[data-type="send"]:not(.active) label,
.card[data-type="send"] .btn-plus .plus {
    background-color: rgb(var(--color-secondary));
}
.card.active[data-type="orchestrate"],
.card[data-type="orchestrate"]:not(.active) label,
.card[data-type="orchestrate"] .btn-plus .plus {
    background-color: rgb(var(--color-accent));
}
.card.active[data-type="all"] label {
    color: #FFF;
    background-color: rgb(var(--color-black));
}
label .icon {
    align-self: center;
    width: 1rem;
    height: 1rem;
    border-radius: 10rem;
    background-color: rgb(var(--color-black));
    overflow: visible;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.card.active label .icon {
    background-color: rgb(var(--color-black));
}
.card.active[data-type="all"] label .icon {
    background-color: #FFF;
}
label .icon svg {
    position: relative;
    left: -.1rem;
    width: 1.3rem;
}
label .icon svg path {
    fill: rgb(var(--color-black));
}
a:hover label .icon {
    background-color: rgba(var(--color-black), 0);
}
a:hover label .icon svg {
    opacity: 1;
}
label + p {
    align-self: center;
    text-align: right;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.card.active label + p,
.filters .card .card:hover label + p {
    color: rgb(var(--color-black));
}
section.products {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4em;
}
.products .card {
    flex-shrink: 0;
    text-decoration: none;
}
.products .card[data-type="receive"]:hover,
.btn-elevator:hover .icon {
    border-color: rgb(var(--color-primary));
    box-shadow: 0 0 1.6rem 0 rgb(var(--color-primary));
}
.products .card[data-type="send"]:hover {
    border-color: rgb(var(--color-secondary));
    box-shadow: 0 0 1.6rem 0 rgb(var(--color-secondary));
}
.products .card[data-type="orchestrate"]:hover {
    border-color: rgb(var(--color-accent));
    box-shadow: 0 0 1.6rem 0 rgb(var(--color-accent));
}
.card.w-2 {
    grid-column: span 2;
}
.card.w-3 {
    grid-column: span 3;
}
.card.h-2 {
    grid-row: span 2;
}
.filter-active + .products .card {
    grid-column: span 1!important;
    grid-row: span 1!important;
}
.card .content {
    justify-content: space-between;
    padding: .8rem;
}
.filters:not(.filter-active) + .products .card.w-2 .content,
.filters:not(.filter-active) + .products .card.w-3 .content {
    justify-content: flex-end;
}
.card .content .v-flex {
    gap: 1.8rem;
}
.card .content .text {
    padding-right: 2.6rem;
}
.card .content h3 {
    margin-bottom: .1em;
}
.card .content h3 span {
    white-space: nowrap;
}
.card .content h3 + p,
.card .content h4 + p,
.card .content h3 + p *,
.card .content h4 + p * {
    color: rgb(var(--color-grey));
}
.card .vendors-wrap {
    display: grid;
    grid-template-columns: auto 1fr auto;
    justify-content: start;
    gap: .4em;
    width: max-content;
    max-width: 100%;
    overflow: hidden;
}
.card:hover .vendors-wrap,
.vendors-wrap.single {
    width: 100%;
}
.card .vendors {
    justify-content: flex-start;
    gap: .4rem;
}
.card .vendors {
    overflow-x: hidden;
}
.card .vendors.more {
    position: relative;
    max-width: 0;
}
.vendors.more::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: .6rem;
  height: 100%;
  background: linear-gradient(to left, rgba(var(--color-white), 1), transparent);
}
.dark .vendors.more::after {
  background: linear-gradient(to left, rgba(var(--color-black), 1), transparent);
}
.card:hover .vendors.more {
    max-width: 100%;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.vendor-icon {
    align-self: center;
    flex-shrink: 0;
    height: 2rem;
    border-radius: .6rem;
    overflow: hidden;
}
.vendor-icon:not(.full) {
    padding: .2rem;
}
.vendor-icon.full {
    max-width: 2rem;
    aspect-ratio: 1 / 1;
}
.vendor-icon:not(.full) img {
    min-width: 1.6rem;
    max-width: 2.2rem;
    max-height: 1.3rem;
}
.card .vendors-wrap p {
    position: relative;
    top: .1rem;
    align-self: center;
    margin-left: .2rem;
    font-size: 1.1rem;
}
.card .vendors-wrap p.more {
    justify-self: start;
    white-space: nowrap;
}
.card:hover .vendors-wrap p.more {
    animation: hideFadeIn .7s ease-in-out forwards;
}
@keyframes hideFadeIn {
  0% {
    opacity: 0;
  }
  1% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.card .img-wrap {
    width: 100%;
    gap: 1.6rem;
    border-radius: 1.2rem;
}
.card .img-wrap.v-flex {
    justify-content: flex-start;
}
.card .img {
    background-position: center;
    background-size: cover;
    border-top-left-radius: 1.2rem;
    overflow: hidden;
}
.filter-active + .products .card .img {
    display: none;
}
.card .img-wrap.v-flex .img {
    flex: 1;
}
.card.w-2 .img {
    width: 125%;
}
.card.w-3 .img {
    width: 175%;
}
.card .img-wrap.v-flex .img {
    border-top-right-radius: 1.2rem;
}
.card .img-wrap:not(.v-flex) .img {
    border-bottom-left-radius: 1.2rem;
}
.card .img > img {
    max-width: 85%;
    max-height: 70%;
    margin: 0 auto;
    background-size: cover;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.card:hover .img > img {
    transform: scale(1.05);
}
.card .img.has-screenshot {
    justify-content: flex-end;
}
.card .screenshot {
    position: relative;
    width: 80%;
    height: 94%;
    margin-left: 7%;
    padding: 1rem;
    padding-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.card .screenshot,
.card .screenshot .effect {
    background-color: rgba(255, 255, 255, .8);
    box-shadow: var(--box-shadow);
    backdrop-filter: blur(.5rem);
}
.card .screenshot,
.card .screenshot .img,
.card .screenshot .effect,
.card .screenshot .effect img {
    border-radius: 1.2rem;
}
.card .screenshot,
.card .screenshot .img {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.card .screenshot .img {
    width: 100%;
    height: 100%;
    background-size: 100% auto;
    background-position: center top;
}
.card .screenshot .effect {
    position: absolute;
    right: -8%;
    bottom: 7%;
    width: auto;
    height: 55%;
    padding: .4rem;
    transform: scale(.5);
    opacity: 0;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
.card:hover .screenshot .effect {
    transform: scale(1);
    opacity: 1;
}
.card .screenshot .effect img {
    width: auto;
    height: 100%;
    border: .1rem solid rgba(var(--color-grey), .5);
}
@media (max-width: 1100px) {
    .filters > .h-wrap > .card {
        flex-wrap: wrap;
        padding: 1.6rem;
    }
    .filters .cards {
        flex-wrap: wrap;
        width: 100%;
    }
    .filters .card .card {
        width: calc(50% - .8rem);
    }
}
@media (max-width: 1000px) {
    section.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .card {
        grid-column: span 1!important;
    }
    .card .img-wrap {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    .card .img {
        flex: 1;
        width: 100%!important;
        border-top-right-radius: 1.2rem;
        border-bottom-left-radius: 0!important;
    }
    .card .screenshot {
        width: 86%;
        height: 93%;
    }
    .card .screenshot .effect {
        display: none;
    }
}
@media (max-width: 1100px) and (min-width: 650px) {
    .filters > .h-wrap > .card {
        position: relative;
    }
    .filters .card[data-type="all"] {
        position: absolute;
        right: 1.6rem;
        bottom: 1.6rem;
        width: calc(50% - 2.4rem);
    }
}
@media (max-width: 800px) {
    section.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 650px) {
    .filters .card .card:hover {
        background-color: rgba(255,255,255,.9);
    }
    .filters .card[data-type="receive"]:hover {
        box-shadow: 0 0 1.6rem 0 rgb(var(--color-primary)), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .card[data-type="send"]:hover {
        box-shadow: 0 0 1.6rem 0 rgb(var(--color-secondary)), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .card[data-type="orchestrate"]:hover {
        box-shadow: 0 0 1.6rem 0 rgb(var(--color-accent)), -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .card[data-type="all"]:hover {
        box-shadow: 0 0 1.6rem 0 #FFF, -.3rem -.3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .card.active label,
    .card:not(.active) label {
        color: rgb(var(--color-black));
        background-color: #FFF;
    }
}
@media (max-width: 650px) {
    .filters .sticky {
        height: 100%;
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    .filters .sticky.fixed {
        -webkit-transition-delay: .4s;
	    transition-delay: .4s;
    }
    .filters > .h-wrap > .card {
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
        margin: 0 -.8rem;
        padding: 1.2rem;
    }
    .filters .sticky.fixed > .card {
        min-height: 0!important;
    }
    .filters .cards {
        justify-content: space-between;
        align-items: flex-start;
    }
    /*.filters .sticky.fixed .cards {
        flex-wrap: nowrap
    }*/
    .filters .card .card {
        width: 100%;
        padding: .6rem 1.2rem .6rem .6rem;
    }
    .filters .sticky .card[data-type="all"] {
        position: absolute;
        bottom: 1.2rem;
        width: calc(100% - 2.4rem);
    }
    .filters .sticky.fixed .cards .card:nth-child(2) {
        -webkit-transition-delay: .1s!important;
	    transition-delay: .1s!important;
    }
    .filters .sticky.fixed .cards .card:nth-child(3) {
        -webkit-transition-delay: .2s!important;
	    transition-delay: .2s!important;
    }
    .filters .sticky:not(.fixed) .card .card,
    .filters .sticky:not(.fixed) .card .card label {
        -webkit-transition-delay: .4s!important;
	    transition-delay: .4s!important;
    }
    .filters .sticky.fixed .card .card:not([data-type="all"]) {
        flex: 1;
        gap: 0;
        width: auto;
        padding: 0;
        border: none;
    }
    .filters .sticky.fixed .card.active:not([data-type="all"]) {
        background-color: rgba(0,0,0,0);
        box-shadow: none;
        backdrop-filter: none;
    }
    .filters .sticky.fixed .card .card:not([data-type="all"]) label {
        padding-right: .8rem;
    }
    .filters .sticky.fixed .card[data-type="receive"] label { 
        background-color: rgb(var(--color-primary));
    }
    .filters .sticky.fixed .card[data-type="receive"].active label {
        box-shadow: 0 0 1.5rem 0 rgb(var(--color-primary)), -.3rem -3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .sticky.fixed .card[data-type="send"] label {
        background-color: rgb(var(--color-secondary));
    }
    .filters .sticky.fixed .card[data-type="send"].active label {
        box-shadow: 0 0 1.5rem 0 rgb(var(--color-secondary)), -.3rem -3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .sticky.fixed .card[data-type="orchestrate"] label {
        background-color: rgb(var(--color-accent));
    }
    .filters .sticky.fixed .card[data-type="orchestrate"].active label {
        box-shadow: 0 0 1.5rem 0 rgb(var(--color-accent)), -.3rem -3rem .9rem 0 rgba(255, 255, 255, .25) inset, 0 .3rem .9rem 0 rgba(255, 255, 255, .3) inset, 0 .1rem .1rem 0 rgba(255, 255, 255, .6) inset, 0 .1rem .5rem 0 rgba(255, 255, 255, .6) inset;
    }
    .filters .sticky.fixed .card .card:not([data-type="all"]) label {
        width: 100%;
    }
    .filters .sticky.fixed .card .card:not([data-type="all"]) p {
        opacity: 0;
        max-width: 0;
        -webkit-transition: 0s;
	    transition: 0s;
    }
    .filters .sticky:not(.fixed) .card .card:not([data-type="all"]) p {
        -webkit-transition-delay: .6s;
	    transition-delay: .6s;
    }
    section.products {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
    section.products .card .img {
        height: 20rem;
        max-height: 20rem;
    }
    .card .vendors-wrap {
        width: 100%;
    }
    .card .vendors.more {
        max-width: 100%;
    }
   
}
@media (max-width: 360px) {
    .filters .sticky.fixed .card .card:not([data-type="all"]) label .icon {
        display: none;
    }
}
/* SUPPORT*/
.support {
    background-position: center center;
    background-size: cover;;
}
.support .card {
    display: inline-flex;
    gap: 0 13.4rem;
    padding: 5.2rem 3.6rem 5.2rem 4.4rem;
    background-color: rgba(var(--color-white), .9);
}
.no-blur .support .card {
    background-color: rgba(var(--color-white), .95);
}
.support .main {
    justify-content: space-between;
    gap: 5.5rem;
    width: 40rem;
    -webkit-transition: .3 ease-in-out;
    transition: .3s ease-in-out;
}
.support .panel {
    position: relative;
    width: 0;
    justify-content: flex-end;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.support .panel.active {
    width: 45rem;
}
.support .panel:not(.active) {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}
.support h5 {
    line-height: 1.2em;
}
.support .btn {
    white-space: nowrap;
}
.support .main .btn:not(.active):not(:hover) {
    background-color: rgba(var(--color-black), 0)!important;
    border-color: rgb(var(--color-black));
}
.support .main .btn:not(.active):not(:hover) span {
    color: rgb(var(--color-black));
}
.support .main .btn:not(.active):not(:hover) .plus {
    background-color: rgb(var(--color-black));
    border-color: rgb(var(--color-black));
}
.support .main .btn:not(.active):not(:hover) .plus:before,
.support .main .btn:not(.active):not(:hover) .plus:after {
    background-color: rgb(var(--color-white));
}
.support .btn-secondary:hover {
    box-shadow: none;
}
.support .content {
    justify-content: flex-end;
    position: absolute;
    left: 0;
    bottom: -1rem;
    width: 45rem;
    height: 100%;
    padding: 0;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.support .content.active {
    bottom: 0;
    opacity: 1;
    pointer-events: auto;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}
.support .block {
    position: absolute;
    left: 0; right: 0;
    bottom: -1rem;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: .5 ease-in-out;
    transition: .5s ease-in-out;
}
.support .block.active {
    bottom: 0;
    opacity: 1;
}
.support .content.active .block.active {
    pointer-events: auto;
}
.support .block[data-type="contact"]{
    bottom: -1.9em;
    padding-top: 3rem;
}
.support .block[data-type="contact"].active {
    bottom: -.9rem;
}
.support .back {
    position: absolute;
    top: -1.5rem;
    right: 0;
    gap: 1.5rem;
    margin-bottom: 2.5rem;
    padding: .8rem 1.6rem;
    border: .1rem solid rgba(var(--color-grey), .7);
    border-radius: 2rem;
    cursor: pointer;
    -webkit-transition: .3 ease-in-out;
    transition: .3s ease-in-out;
}
.support .back:hover {
    background-color: rgba(var(--color-grey), .3);
}
.support .back svg {
    width: .8rem;
    height: auto;
    opacity: 1;
    transform: rotate(-180deg);
}
.support .block p {
    margin-bottom: .3em;
    line-height: 1.3em;
}
.support .back p {
    margin-bottom: 0;
    line-height: 1em;
}
.support .nf-form-cont {
    margin: 2rem -.5rem 0;
}
.nf-field-description a {
    color: rgb(var(--color-primary));
}
.support textarea {
    height: 10rem!important;
}
.support .submit-container,
.support .submit-container input {
    margin-bottom: 0;
    text-align: left;
}
.submit-container .nf-field {
    margin-top: 1rem;
}
.support .submit-container input {
    color: rgb(var(--color-white));
    background: rgba(var(--color-black), .6);
}
@media (max-width: 1200px) {
    .support .card {
        gap: 0 5.5rem;
    }
}
@media (max-width: 1100px) {
    .support .card {
        flex-direction: column;
        width: 100%;
    }
    .support .main {
        gap: 3rem;
        width: 100%;
    }
    .support .panel,
    .support .content {
        width: 100%!important;
    }
    .support .block,
    .support .content[data-type="customer"] h2 {
        padding-top: 5rem;
    }
    .support .back {
        display: inline-flex;
        position: relative;
        top: 0;
        margin-bottom: 1.5rem;
    }
}
@media (max-width: 500px) {
    .support .card {
        padding: 3rem 2rem;
    }
}
/* HERO (basic) */
.hero {
    background-position: center;
    background-size: cover;
}
.hero p {
    line-height: 1.3em;
}
.hero p:last-child {
    margin-bottom: 0;
}
@media (max-width: 1000px) {
    .hero .content p {
        text-wrap: balance;
    }
}
/* POLICIES */
#page.single-policy {
    background-color: #FFF;
}
.policy > .h-wrap {
    position: relative;
    max-width: 170rem;
    margin: 0 auto;
}
.nav-policies {
    width: 25rem;
}
.nav-policies .select {
    display: none;
}
.nav-policies ul {
    list-style-type: none;
}
.nav-policies > ul {
    width: 100%;
    padding: 1.2rem 1.2rem 1.2rem 0;
    border-right: .1rem solid rgb(var(--color-grey));
}
.nav-policies li:not(:last-child) {
    margin-bottom: 1.8rem;
}
.nav-policies ul ul {
    margin-top: 1.8rem;
}
.nav-policies > ul > li > p {
    font-weight: 600;
}
.nav-policies p a {
    margin-left: -1.2rem;
    padding-left: .9rem;
}
.nav-policies p a,
.policy .toc .item {
    border-left: .3rem solid rgba(var(--color-black), 0);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    cursor: pointer;
}
.nav-policies li.active > p a,
.policy .toc .item.active {
    border-color: rgb(var(--color-black));
    cursor: default;
}
.nav-policies li:not(.active) > p a:hover,
.policy .toc .item:not(.active):hover {
    border-color: rgb(var(--color-grey));
}
.nav-policies ul ul p a {
    padding-left: 2.2rem;
}
.nav-policies a {
    text-decoration: none;
}
.nav-policies li.active > p > a,
.nav-policies a.disabled {
    pointer-events: none;
}
.policy .main {
    flex: 1;
    padding: 0 15rem 0 4rem;
}
.policy h3 .large {
    font-size: 1.1em;
}
.policy h1 {
    margin-bottom: 3.4rem;
}
.policy-btn {
    display: inline-block;
    margin-bottom: 4.8rem;
        padding: 1.2rem 1.2rem 1rem;
    border: 1px solid rgb(var(--color-grey));
    border-radius: .8rem;
    text-decoration: none;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.policy-btn:hover {
    background-color: rgba(var(--color-grey), .3);
    border-color: rgb(var(--color-black));
}
.policy .intro {
    margin-bottom: 4rem;
}
.policy .intro p,
.policy .block p,
.policy .intro li,
.policy .block li {
    line-height: 1.3em;
}
.policy .blocks {
    gap: 2rem;
}
.policy .block h3 {
    text-transform: uppercase;
}
.policy .block h5 {
    padding: .3rem 0 .4rem;
    font-weight: normal;
}
.policy .block p {
    margin-bottom: 1.2em;
}
table {
    border-collapse: collapse;
}
table, th, td {
  border: 1px solid rgb(var(--color-black));
}
th, td {
    vertical-align: middle;
    padding: 1rem;
}
th {
    text-align: center;
    font-weight: 600;
    background-color: rgba(var(--color-grey), .5);
}
td:first-child {
    text-align: center;
    background-color: rgba(var(--color-grey), .2);
}
td ul:last-child li:last-child,
td ol:last-child li:last-child {
    margin-bottom: 0;
}
.policy .toc {
    position: relative;
}
.policy .toc .sticky,
.policy .toc .spacer {
    width: 20rem;
    padding-top: 1.2rem;
}
/*.policy .toc .sticky.fixed {
    position: fixed;
    top: 10rem;
}*/
.policy .toc .v-flex {
    gap: 1.8rem;
    padding: 1.1rem 0;
    border-left: .1rem solid rgb(var(--color-grey));
}
.policy .toc .item {
    padding: .1rem 0 .1rem .9rem;
}
@media (min-width: 1200px) {
    .policy h1 {
        font-size: 6rem;
    }
}
@media (min-width: 1000px) {
    body:not(.menu-open) .single-policy header.fixed {
        background-color: rgba(var(--color-black), .2);
    }
    body.no-blur:not(.menu-open) .single-policy header.fixed {
        background-color: rgba(255, 255, 255, .9);
    }
    body:not(.menu-open) .single-policy header #logo svg path,
    body:not(.menu-open) .single-policy header #logo svg rect {
        fill: rgb(var(--color-black));
    }
    .single-policy header .menu > li > a,
    body:not(.menu-open) .single-policy .nav-btn,
    body:not(.menu-open) .single-policy #menu-btn p span {
        color: rgb(var(--color-black))!important;
    }
    .single-policy header .menu > li:after,
    .single-policy .qr-btn,
    body:not(.menu-open) .single-policy #menu-btn .icon span {
        background-color: rgb(var(--color-black));
    }
    body:not(.menu-open) .single-policy .nav-btn svg path {
        stroke: rgb(var(--color-black));
    }
    .single-policy .qr-btn > svg path {
        fill: rgb(var(--color-white));
    }
}
@media (max-width: 1200px) {
    .nav-policies {
        width: 20rem;
    }
    .policy .main {
        padding-right: 6rem;
    }
}
@media (max-width: 1000px) {
    .single-policy header {
        position: relative;
        background-color: rgb(var(--color-black));
    }
    .policy {
        padding-top: 0;
    }
    .policy > .v-wrap {
        padding-top: 8.5rem;
    }
    .nav-policies {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1;
    }
    .nav-policies.fixed {
        position: fixed;
    }
    .nav-policies .sticky {
        position: absolute;
        top: 0;
        left: 0; right: 0;
    }
    .nav-policies .spacer {
        opacity: 0;
        pointer-events: none;
    }
    .nav-policies .select {
        display: flex;
        position: relative;
        height: 5.2rem;
        padding: 0 3.2rem;
        background-color: #FFF;
        border-bottom: .1rem solid rgb(var(--color-grey));
        z-index: 2;
        cursor: pointer;
    }
    .nav-policies .select .flex {
        justify-content: flex-start;
        gap: 1.2rem;
    }
    .nav-policies .select svg {
        position: relative;
        top: .1rem;
        width: .8rem;
        height: auto;
        opacity: 1;
        transform: rotate(90deg);
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
    }
    .nav-policies.show .select svg {
        transform: rotate(270deg);
    }
    .nav-policies .select svg fill {
        fill: rgb(var(--color-black))
    }
    .nav-policies > ul {
        position: absolute;
        top: 4.2rem;
        left: .9rem;
        width: calc(100% - 1.8rem);
        max-height: 37.5rem;
        background-color: #FFF;
        border: .1rem solid rgb(var(--color-grey));
        border-top: none;
        z-index: 1;
        opacity: 0;
        pointer-events: none;
        overflow-y: auto;
        -webkit-transition: .3s ease-in-out;
        transition: .3s ease-in-out;
    }
    .nav-policies.show > ul {
        top: 5.2rem;
        padding: 2rem 1.1rem 2rem 0;
        opacity: 1;
        pointer-events: all;
    }
    .nav-policies p a {
        margin-left: -.1rem;
    }
    .policy .main {
        padding-left: 0;
    }
}
@media (max-width: 800px) {
    .policy .main {
        padding-right: 0;
    }
    .policy .toc {
        display: none;
    }
}
/* 404 */
.error-404 label {
    margin-bottom: 1rem;
    padding: .7rem .8rem .6rem;
}
.error-404 h1 {
    display: inline-block;
    position: relative;
}
.error-404 em {
    position: relative;
    z-index: 1;
}
.error-404 h1 img {
    position: absolute;
    bottom: -9%;
    left: 7%;
    width: 85%;
}
.error-404 .h-wrap > img {
    width: 100%;
    max-width: 85rem;
    margin: -.7rem 0 1rem;
}
.error-404 .btn-row {
    justify-content: center;
}
.error-404 h5 {
    text-wrap: balance;
}
@media (max-width: 800px) {
    .error-404 .h-wrap > img {
        margin-top: 1rem;
    }
}
/* FOOTER */
footer {
    position: relative;
    background-color: rgb(var(--color-black));
}
footer .top {
    gap: 2rem;
    margin-bottom: 7.2rem; /* temp */
}
footer nav {
    padding: 4.4rem 4rem 2.7rem;
}
footer #menu-footer {
    display: grid;
    display: none; /* temp */ 
    grid-template-rows: 1fr;
    grid-auto-flow: column;
    grid-auto-columns: auto;
    justify-content: space-between;
    gap: 2rem;
    margin: 7.2rem 0;
}
footer a,
footer p {
    position: relative;
    font-size: 1.4rem;
    text-decoration: none;
    -webkit-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
}
footer .menu a:hover,
footer p a:hover {
    top: .1rem;
}
footer #menu-footer > li > a,
footer .menu li.bold > a {
    color: rgb(var(--color-white));
    font-weight: bold;
}
footer .menu > li > a:hover,
footer p a:hover {
    color: rgb(var(--color-grey));
}
footer .sub-menu {
    margin-top: 1rem;
}
footer .sub-menu li {
    margin-bottom: 1.6rem;
}
footer .sub-menu li a {
    color: rgb(var(--color-grey));
}
footer .menu a[href$="receive/"]:hover {
    color: rgb(var(--color-primary));
}
footer .menu a[href$="send/"]:hover {
    color: rgb(var(--color-secondary));
}
footer .menu a[href$="orchestrate/"]:hover {
    color: rgb(var(--color-accent));
}
footer .menu .cols > .sub-menu {
    display: flex;
    gap: 5rem;
}
footer .menu .cols > .sub-menu > li > a {
    display: none;
}
footer .menu .cols .sub-menu .sub-menu,
footer .menu .stack > .sub-menu {
    margin-top: 0;
}
footer .menu .stack > a {
    display: none; 
} 
/*footer .menu li.bold {
    margin: .4rem 0 1rem;
}*/
footer #logo {
    position: relative;
    width: 40%;
    min-width: 27rem;
    max-width: 54rem;
}
footer #logo a,
footer #logo svg {
    width: 100%;
    height: auto;
}
footer #logo svg path {
    fill: rgb(var(--color-white));
}
footer #logo p {
    position: absolute;
    left: 0;
    bottom: 0;
}
footer .policies {
    justify-content: flex-end;
    text-align: right;
}
footer #menu-policies {
    display: flex;
    justify-content: space-between;
    gap: 2.5rem;
}
footer p a {
    display: inline-block;
    text-decoration: underline;
}
@media (min-width: 700px) { 
    footer .top p br.res {
        display: block;
    }
}
@media (max-width: 700px) { 
    footer .top {
        flex-direction: column;
        margin-bottom: 6rem; /* temp */
    }
    footer #menu-footer {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
        grid-auto-flow: row;
        grid-auto-columns: unset;
        justify-content: stretch;
        margin: 4rem 0 3rem;
    }
    footer #menu-footer li.cols,
    footer #menu-footer li.stack {
        grid-column: 1 / -1;
    }
    footer #menu-footer li.cols{
        grid-row: 2;
    }
    footer #menu-footer li.cols + li {
        grid-row: 1;
        grid-column: 2;
    }
    footer #menu-footer li.cols > .sub-menu,
    footer #menu-footer li.stack > .sub-menu {
        display: flex;
        gap: 2rem;
    }
    footer #menu-footer li.cols > .sub-menu > li,
    footer #menu-footer li.stack > .sub-menu > li {
        flex: 1;
    }
    footer .sub-menu li:last-of-type {
        margin-bottom: 0;
    }
    footer .bottom {
        flex-direction: column-reverse;
        gap: 5rem;
    }
    footer .policies {
        text-align: left;
    }
    footer #menu-policies {
        justify-content: flex-start;
    }
}
@media (max-width: 500px) {
    footer div.btn-form {
        width: 100%;
    }
    footer #logo {
        width: 100%;
        min-width: auto;
    }
    footer #logo p {
        left: auto;
        right: 0;
    }
}