@charset "UTF-8";@font-face {
    font-family: "PP Right";
    src: url("../font/PPRightGothic-CompactDark.otf");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    border-style: solid;
    font: inherit;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block
}

body {
    line-height: 1;
    overflow-x: hidden
}

ol,ul {
    list-style: none
}

blockquote,q {
    quotes: none
}

blockquote:after,blockquote:before,q:after,q:before {
    content: "";
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

h1,h2,h3,h4,h5,h6 {
    font-size: 1em
}

input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-size: .6613756614vw
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    html {
        font-size:2.6666666667vw
    }
}

body {
    font-family: Archivo,sans-serif;
    color: #fff;
    font-weight: 400;
    font-size: 1.5rem
}

body,html {
    background: #d3d3d3;
    height: 100vh;
    max-width: 100vw
}

a {
    text-decoration: none;
    color: inherit
}

img,picture {
    pointer-events: none
}

*,::after,::before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

button,input,select,textarea {
    font-family: Archivo,sans-serif;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 400;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none;
    border-radius: 0;
    outline: 0;
    background: 0 0
}

label {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

::-moz-selection {
    background-color: #ff622b;
    color: #fff
}

::selection {
    background-color: #ff622b;
    color: #fff
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .u-hideMobile {
        display:none!important
    }
}

@media screen and (min-width: 800px) {
    .u-showMobile {
        display:none!important
    }
}

:root {
    --app-height: 100%
}

html {
    scroll-behavior: initial;
    background-color: #000
}

body,html {
    min-height: 100%;
    height: auto
}

html::-webkit-scrollbar {
    display: none
}

html {
    -ms-overflow-style: none;
    scrollbar-width: none
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    section {
        width:100vw;
        max-width: 100vw;
        overflow: hidden
    }
}

.h1,.h2,.h3,.h4,.heading {
    font-family: "PP Right",sans-serif;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: .94
}

.h1 {
    font-size: 14rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .h1 {
        font-size:5.5rem
    }
}

.h-anim {
    opacity: 0
}

.h-anim .h-line {
    position: relative;
    display: block;
    overflow: hidden;
    -webkit-perspective: 200vw;
    perspective: 200vw;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    padding: 0 5rem;
    margin: 0 -5rem
}

.h-anim .h-word {
    display: inline-block;
    -webkit-transform: translateY(75%) rotateX(-88deg);
    transform: translateY(75%) rotateX(-88deg);
    -webkit-transform-origin: 50% 75%;
    -ms-transform-origin: 50% 75%;
    transform-origin: 50% 75%;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.h-anim.in {
    opacity: 1
}

.h-anim.in .h-word {
    -webkit-transform: translateY(0) rotateX(0);
    transform: translateY(0) rotateX(0);
    -webkit-transition: -webkit-transform .7s cubic-bezier(0,0,0,1);
    transition: -webkit-transform .7s cubic-bezier(0,0,0,1);
    -o-transition: transform .7s cubic-bezier(0,0,0,1);
    transition: transform .7s cubic-bezier(0,0,0,1);
    transition: transform .7s cubic-bezier(0,0,0,1),-webkit-transform .7s cubic-bezier(0,0,0,1)
}

.h-anim.in .h-line:nth-child(1) [data-i="1"] {
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s
}

.h-anim.in .h-line:nth-child(1) [data-i="2"] {
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s
}

.h-anim.in .h-line:nth-child(1) [data-i="3"] {
    -webkit-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s
}

.h-anim.in .h-line:nth-child(1) [data-i="4"] {
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s
}

.h-anim.in .h-line:nth-child(1) [data-i="5"] {
    -webkit-transition-delay: .4s;
    -o-transition-delay: .4s;
    transition-delay: .4s
}

.h-anim.in .h-line:nth-child(1) [data-i="6"] {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

.h-anim.in .h-line:nth-child(1) [data-i="7"] {
    -webkit-transition-delay: .6s;
    -o-transition-delay: .6s;
    transition-delay: .6s
}

.h-anim.in .h-line:nth-child(1) [data-i="8"] {
    -webkit-transition-delay: .7s;
    -o-transition-delay: .7s;
    transition-delay: .7s
}

.h-anim.in .h-line:nth-child(1) [data-i="9"] {
    -webkit-transition-delay: .8s;
    -o-transition-delay: .8s;
    transition-delay: .8s
}

.h-anim.in .h-line:nth-child(1) [data-i="10"] {
    -webkit-transition-delay: .9s;
    -o-transition-delay: .9s;
    transition-delay: .9s
}

.h-anim.in .h-line:nth-child(2) [data-i="1"] {
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s
}

.h-anim.in .h-line:nth-child(2) [data-i="2"] {
    -webkit-transition-delay: .4s;
    -o-transition-delay: .4s;
    transition-delay: .4s
}

.h-anim.in .h-line:nth-child(2) [data-i="3"] {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

.h-anim.in .h-line:nth-child(2) [data-i="4"] {
    -webkit-transition-delay: .6s;
    -o-transition-delay: .6s;
    transition-delay: .6s
}

.h-anim.in .h-line:nth-child(2) [data-i="5"] {
    -webkit-transition-delay: .7s;
    -o-transition-delay: .7s;
    transition-delay: .7s
}

.h-anim.in .h-line:nth-child(2) [data-i="6"] {
    -webkit-transition-delay: .8s;
    -o-transition-delay: .8s;
    transition-delay: .8s
}

.h-anim.in .h-line:nth-child(2) [data-i="7"] {
    -webkit-transition-delay: .9s;
    -o-transition-delay: .9s;
    transition-delay: .9s
}

.h-anim.in .h-line:nth-child(2) [data-i="8"] {
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s
}

.h-anim.in .h-line:nth-child(2) [data-i="9"] {
    -webkit-transition-delay: 1.1s;
    -o-transition-delay: 1.1s;
    transition-delay: 1.1s
}

.h-anim.in .h-line:nth-child(2) [data-i="10"] {
    -webkit-transition-delay: 1.2s;
    -o-transition-delay: 1.2s;
    transition-delay: 1.2s
}

.h-anim.in .h-line:nth-child(3) [data-i="1"] {
    -webkit-transition-delay: .6s;
    -o-transition-delay: .6s;
    transition-delay: .6s
}

.h-anim.in .h-line:nth-child(3) [data-i="2"] {
    -webkit-transition-delay: .7s;
    -o-transition-delay: .7s;
    transition-delay: .7s
}

.h-anim.in .h-line:nth-child(3) [data-i="3"] {
    -webkit-transition-delay: .8s;
    -o-transition-delay: .8s;
    transition-delay: .8s
}

.h-anim.in .h-line:nth-child(3) [data-i="4"] {
    -webkit-transition-delay: .9s;
    -o-transition-delay: .9s;
    transition-delay: .9s
}

.h-anim.in .h-line:nth-child(3) [data-i="5"] {
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s
}

.h-anim.in .h-line:nth-child(3) [data-i="6"] {
    -webkit-transition-delay: 1.1s;
    -o-transition-delay: 1.1s;
    transition-delay: 1.1s
}

.h-anim.in .h-line:nth-child(3) [data-i="7"] {
    -webkit-transition-delay: 1.2s;
    -o-transition-delay: 1.2s;
    transition-delay: 1.2s
}

.h-anim.in .h-line:nth-child(3) [data-i="8"] {
    -webkit-transition-delay: 1.3s;
    -o-transition-delay: 1.3s;
    transition-delay: 1.3s
}

.h-anim.in .h-line:nth-child(3) [data-i="9"] {
    -webkit-transition-delay: 1.4s;
    -o-transition-delay: 1.4s;
    transition-delay: 1.4s
}

.h-anim.in .h-line:nth-child(3) [data-i="10"] {
    -webkit-transition-delay: 1.5s;
    -o-transition-delay: 1.5s;
    transition-delay: 1.5s
}

.subheading {
    font-size: 2.5rem;
    font-family: "PP Right",sans-serif;
    text-transform: uppercase;
    letter-spacing: .03em;
    line-height: .94
}

.subheading--small {
    font-size: 2rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .subheading {
        font-size:2.2rem
    }

    .subheading--small {
        font-size: 1.8rem
    }
}

.body {
    font-size: 2rem;
    line-height: 1.5
}

.body a {
    text-decoration: underline;
    -webkit-transition: color .1s linear;
    -o-transition: color .1s linear;
    transition: color .1s linear
}

@media (hover: hover) {
    .body a:hover {
        color:#ff622b
    }
}

.body strong {
    font-weight: 600
}

.body em {
    font-style: italic
}

.body p+p {
    margin-top: 1.5em
}

.body--large {
    font-size: 2.5rem;
    line-height: 1.3
}

.body ol,.body ul {
    margin-top: 1em;
    padding-left: 1em
}

.body ol li,.body ul li {
    position: relative;
    list-style: none
}

.body ol li+li,.body ul li+li {
    margin-top: .5em
}

.body ul li::before {
    content: "";
    display: inline-block;
    background-image: url(/images/bullet.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: .5em;
    width: .5em;
    position: absolute;
    left: -1em;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.body ol li {
    list-style: auto
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .body {
        font-size:1.5rem;
        line-height: 2.2rem
    }

    .body--large {
        font-size: 1.8rem
    }
}

.HB .hs-submit,.button {
    background-color: #ff622b;
    height: 5rem;
    display: inline-block;
    border-radius: .5rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    white-space: nowrap;
    padding: 0 3.5rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    cursor: pointer
}

.HB .hs-submit input,.HB .hs-submit__inner,.button input,.button__inner {
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    letter-spacing: .03em;
    font-size: 2rem;
    color: #fff;
    -webkit-transition: -webkit-filter .2s;
    transition: -webkit-filter .2s;
    -o-transition: filter .2s;
    transition: filter .2s;
    transition: filter .2s,-webkit-filter .2s;
    position: relative;
    z-index: 1;
    cursor: pointer
}

.HB .hs-submit input:nth-child(1),.HB .hs-submit__inner:nth-child(1),.button input:nth-child(1),.button__inner:nth-child(1) {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.HB .hs-submit input:nth-child(2),.HB .hs-submit__inner:nth-child(2),.button input:nth-child(2),.button__inner:nth-child(2) {
    position: absolute;
    top: 50%;
    left: 50%;
    white-space: nowrap;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    -webkit-transform: translate3d(-50%,-50%,0) translateY(200%);
    transform: translate3d(-50%,-50%,0) translateY(200%)
}

.HB .hs-submit::after,.button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    height: 105%;
    width: 105%;
    left: -2.5%;
    top: -2.5%;
    background: #212121;
    -webkit-transform: translateY(-50%) rotateX(90deg);
    transform: translateY(-50%) rotateX(90deg);
    opacity: 0;
    -webkit-transition: opacity .2s ease-in-out,-webkit-transform 1ms .2s;
    transition: opacity .2s ease-in-out,-webkit-transform 1ms .2s;
    -o-transition: opacity .2s ease-in-out,transform 1ms .2s;
    transition: opacity .2s ease-in-out,transform 1ms .2s;
    transition: opacity .2s ease-in-out,transform 1ms .2s,-webkit-transform 1ms .2s
}

.HB .hs-submit--black .button__inner,.button--black .button__inner {
    color: #212121
}

.HB .hs-submit--black::after,.button--black::after {
    background-color: #fff
}

.HB .hs-submit--small,.button--small {
    height: 3.3rem
}

.HB .hs-submit--small .button__inner,.button--small .button__inner {
    font-size: 1.3rem
}

.HB .hs-submit--cta,.button--cta {
    height: 11rem;
    padding: 0 8rem
}

.HB .hs-submit--cta .button__inner,.button--cta .button__inner {
    font-size: 3.5rem
}

@media (hover: hover) {
    .HB .hs-submit:hover .button__inner,.button:hover .button__inner {
        -webkit-transition:-webkit-transform .4s cubic-bezier(.5,0,.25,1),-webkit-filter 1ms 250ms;
        transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1),-webkit-filter 1ms 250ms;
        -o-transition: transform .4s cubic-bezier(.5,0,.25,1),filter 1ms 250ms;
        transition: transform .4s cubic-bezier(.5,0,.25,1),filter 1ms 250ms;
        transition: transform .4s cubic-bezier(.5,0,.25,1),filter 1ms 250ms,-webkit-transform .4s cubic-bezier(.5,0,.25,1),-webkit-filter 1ms 250ms
    }

    .HB .hs-submit:hover .button__inner:nth-child(1),.button:hover .button__inner:nth-child(1) {
        -webkit-transform: translateY(-200%);
        -ms-transform: translateY(-200%);
        transform: translateY(-200%)
    }

    .HB .hs-submit:hover .button__inner:nth-child(2),.button:hover .button__inner:nth-child(2) {
        -webkit-transform: translate3d(-50%,-50%,0) translateY(0);
        transform: translate3d(-50%,-50%,0) translateY(0)
    }

    .HB .hs-submit:hover::after,.button:hover::after {
        opacity: 1;
        -webkit-transform: translateY(0) rotateX(0);
        transform: translateY(0) rotateX(0);
        -webkit-transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .4s cubic-bezier(.5,0,.25,1);
        transition: transform .4s cubic-bezier(.5,0,.25,1);
        transition: transform .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1)
    }
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .HB .hs-submit,.button {
        height:5rem;
        padding: 0 3rem
    }

    .HB .hs-submit .button__inner,.button .button__inner {
        font-size: 1.6rem
    }

    .HB .hs-submit--small,.button--small {
        height: 3.3rem
    }

    .HB .hs-submit--small .button__inner,.button--small .button__inner {
        font-size: 1.3rem
    }

    .HB .hs-submit--cta,.button--cta {
        height: 6rem;
        padding: 0 4rem
    }

    .HB .hs-submit--cta .button__inner,.button--cta .button__inner {
        font-size: 2.2rem
    }
}

body {
    counter-reset: sec
}

.sectionCounter {
    width: 9.5rem;
    height: 9.5rem;
    border: 1px solid #1f00ff;
    position: absolute;
    overflow: hidden;
    counter-increment: sec
}

.sectionCounter::after {
    content: "0" counter(sec);
    font-family: "PP Right",sans-serif;
    font-size: 2rem;
    color: #1f00ff;
    font-size: 3.4rem;
    position: absolute;
    bottom: .5rem;
    left: .5rem;
    -webkit-transform: translateY(5rem);
    -ms-transform: translateY(5rem);
    transform: translateY(5rem)
}

.sectionCounter::before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -2px;
    height: 1px;
    width: 200%;
    left: -50%;
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
    border-bottom: 1px solid #1f00ff
}

.sectionCounter.in::before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: -webkit-transform 1s cubic-bezier(.5,0,0,1);
    transition: -webkit-transform 1s cubic-bezier(.5,0,0,1);
    -o-transition: transform 1s cubic-bezier(.5,0,0,1);
    transition: transform 1s cubic-bezier(.5,0,0,1);
    transition: transform 1s cubic-bezier(.5,0,0,1),-webkit-transform 1s cubic-bezier(.5,0,0,1)
}

.sectionCounter.in::after {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .6s .2s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s .2s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s .2s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .2s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .2s cubic-bezier(.5,0,.25,1),-webkit-transform .6s .2s cubic-bezier(.5,0,.25,1)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .sectionCounter {
        width:7.05rem;
        height: 7.05rem
    }

    .sectionCounter::after {
        font-size: 2.5rem
    }

    .sectionCounter--smallMob {
        position: absolute;
        bottom: auto;
        right: auto;
        left: 0;
        top: -1px;
        height: 4.8rem;
        width: 4.8rem
    }

    .sectionCounter--smallMob::after {
        font-size: 1.5rem;
        letter-spacing: .02em;
        left: .3rem;
        bottom: .25rem
    }
}

.underlink {
    display: inline-block;
    position: relative
}

.underlink:after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 100%;
    left: 0;
    bottom: .1em;
    height: 1px;
    background: #fff;
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

@media (hover: hover) {
    .underlink:hover:after {
        -webkit-transform-origin:left;
        -ms-transform-origin: left;
        transform-origin: left;
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: -webkit-transform .3s cubic-bezier(0,0,0,1);
        transition: -webkit-transform .3s cubic-bezier(0,0,0,1);
        -o-transition: transform .3s cubic-bezier(0,0,0,1);
        transition: transform .3s cubic-bezier(0,0,0,1);
        transition: transform .3s cubic-bezier(0,0,0,1),-webkit-transform .3s cubic-bezier(0,0,0,1)
    }
}

.bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: .5rem
}

.bg--blueGrid {
    background-color: #1f00ff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -6.22rem 3.22rem;
    background-size: 9.44rem 9.44rem
}

.bg-grid body {
    background-image: url(/images/grid_dark.svg);
    background-position: -4.72rem 4.72rem;
    background-size: 9.44rem 9.44rem
}

.bg-light body {
    background-color: #fff;
    background-image: url(https://thepatchsystem.com/images/grid.svg)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .bg {
        border-radius:0
    }

    .bg--blueGrid {
        background-position: -2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem
    }

    .bg-grid body {
        background-position: -2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem
    }
}

.grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.5rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .grid {
        -ms-flex-wrap:wrap;
        flex-wrap: wrap;
        gap: 1.2rem
    }
}

.col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1.5rem
}

.block {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 5rem;
    background-color: #fff;
    border: 1px solid #1f00ff;
    border-radius: .5rem;
    color: #1f00ff
}

.block+.block {
    margin-top: 1.5rem
}

.rollingBanner {
    height: 10.3rem;
    border-bottom: 1px solid #ececec;
    background-color: #212121;
    position: relative;
    width: 100%;
    font-size: 4rem;
    font-family: "PP Right",sans-serif;
    text-transform: uppercase
}

.rollingBanner__rail {
    position: absolute;
    top: 3rem;
    left: 0;
    display: inline-block;
    white-space: nowrap
}

.rollingBanner:nth-child(even) {
    background-color: #1f00ff
}

.rollingBanner span {
    padding: 0 4rem;
    display: inline-block;
    color: #d3d3d3
}

.rollingBanner img {
    height: 1.5rem;
    margin-bottom: .5rem
}

.marketingCta {
    position: relative;
    width: 37.3rem
}

.marketingCta__image {
    position: absolute;
    width: 13.4rem;
    left: .7rem;
    top: .7rem;
    height: calc(100% - 1.4rem)
}

.marketingCta__image video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    border-radius: .5rem
}

.marketingCta__content {
    padding: 1.5rem 2rem 1rem 16rem
}

.marketingCta__content .subheading {
    font-size: 2rem;
    margin-bottom: 1rem;
    display: block
}

.marketingCta__content .body {
    font-size: 1.5rem;
    margin-bottom: 2rem
}

.marketingCta__content .button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0 1rem
}

.marketingCta__content .button img {
    height: 1rem;
    margin-left: .6rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .marketingCta {
        position:relative;
        width: 100%
    }

    .marketingCta__image {
        width: 13rem
    }

    .marketingCta__content {
        padding: 1.5rem 2rem 1rem 15rem
    }

    .marketingCta__content .subheading {
        font-size: 2rem;
        margin-bottom: 1rem;
        display: block
    }

    .marketingCta__content .body {
        font-size: 1.5rem;
        margin-bottom: 2rem
    }

    .marketingCta__content .button {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        padding: 0 1rem
    }

    .marketingCta__content .button img {
        height: 1rem;
        margin-left: .6rem
    }
}

.accordion {
    position: relative
}

.accordion__heading {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.accordion__content {
    overflow: hidden;
    position: relative;
    -webkit-transition: height .3s cubic-bezier(.5,0,.25,1);
    -o-transition: height .3s cubic-bezier(.5,0,.25,1);
    transition: height .3s cubic-bezier(.5,0,.25,1)
}

.accordion--expanded .accordion__icon::after {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.accordion:not(.accordion--expanded) .accordion__content {
    height: 0!important
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .accordion__icon {
        width:1rem;
        height: 1rem
    }

    .accordion__icon {
        -webkit-transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .4s cubic-bezier(.5,0,.25,1);
        transition: transform .4s cubic-bezier(.5,0,.25,1);
        transition: transform .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1)
    }

    .accordion__content {
        -webkit-transition: height .4s cubic-bezier(.5,0,.25,1);
        -o-transition: height .4s cubic-bezier(.5,0,.25,1);
        transition: height .4s cubic-bezier(.5,0,.25,1)
    }
}

html:not(.no-anima) .fadeUp.anima {
    opacity: 0;
    -webkit-transform: translateY(3rem);
    -ms-transform: translateY(3rem);
    transform: translateY(3rem)
}

html:not(.no-anima) .fadeUp.anima.in {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    -o-transition: opacity .3s ease-in-out,transform .5s cubic-bezier(0,0,0,1);
    transition: opacity .3s ease-in-out,transform .5s cubic-bezier(0,0,0,1);
    transition: opacity .3s ease-in-out,transform .5s cubic-bezier(0,0,0,1),-webkit-transform .5s cubic-bezier(0,0,0,1)
}

html:not(.no-anima) .stagger.anima:nth-child(1) {
    -webkit-transition-delay: 66ms;
    -o-transition-delay: 66ms;
    transition-delay: 66ms
}

html:not(.no-anima) .stagger.anima:nth-child(2) {
    -webkit-transition-delay: 132ms;
    -o-transition-delay: 132ms;
    transition-delay: 132ms
}

html:not(.no-anima) .stagger.anima:nth-child(3) {
    -webkit-transition-delay: 198ms;
    -o-transition-delay: 198ms;
    transition-delay: 198ms
}

html:not(.no-anima) .stagger.anima:nth-child(4) {
    -webkit-transition-delay: 264ms;
    -o-transition-delay: 264ms;
    transition-delay: 264ms
}

html:not(.no-anima) .stagger.anima:nth-child(5) {
    -webkit-transition-delay: 330ms;
    -o-transition-delay: 330ms;
    transition-delay: 330ms
}

html:not(.no-anima) .stagger.anima:nth-child(6) {
    -webkit-transition-delay: 396ms;
    -o-transition-delay: 396ms;
    transition-delay: 396ms
}

html:not(.no-anima) .stagger.anima:nth-child(7) {
    -webkit-transition-delay: 462ms;
    -o-transition-delay: 462ms;
    transition-delay: 462ms
}

html:not(.no-anima) .stagger.anima:nth-child(8) {
    -webkit-transition-delay: 528ms;
    -o-transition-delay: 528ms;
    transition-delay: 528ms
}

html:not(.no-anima) .stagger.anima:nth-child(9) {
    -webkit-transition-delay: 594ms;
    -o-transition-delay: 594ms;
    transition-delay: 594ms
}

html:not(.no-anima) .stagger.anima:nth-child(10) {
    -webkit-transition-delay: 660ms;
    -o-transition-delay: 660ms;
    transition-delay: 660ms
}

html:not(.no-anima) .stagger.anima:nth-child(11) {
    -webkit-transition-delay: 726ms;
    -o-transition-delay: 726ms;
    transition-delay: 726ms
}

html:not(.no-anima) .stagger.anima:nth-child(12) {
    -webkit-transition-delay: 792ms;
    -o-transition-delay: 792ms;
    transition-delay: 792ms
}

html:not(.no-anima) .stagger.anima:nth-child(13) {
    -webkit-transition-delay: 858ms;
    -o-transition-delay: 858ms;
    transition-delay: 858ms
}

html:not(.no-anima) .stagger.anima:nth-child(14) {
    -webkit-transition-delay: 924ms;
    -o-transition-delay: 924ms;
    transition-delay: 924ms
}

html:not(.no-anima) .stagger.anima:nth-child(15) {
    -webkit-transition-delay: 990ms;
    -o-transition-delay: 990ms;
    transition-delay: 990ms
}

html:not(.no-anima) .stagger.anima:nth-child(16) {
    -webkit-transition-delay: 1056ms;
    -o-transition-delay: 1056ms;
    transition-delay: 1056ms
}

html:not(.no-anima) .stagger.anima:nth-child(17) {
    -webkit-transition-delay: 1122ms;
    -o-transition-delay: 1122ms;
    transition-delay: 1122ms
}

html:not(.no-anima) .stagger.anima:nth-child(18) {
    -webkit-transition-delay: 1188ms;
    -o-transition-delay: 1188ms;
    transition-delay: 1188ms
}

html:not(.no-anima) .stagger.anima:nth-child(19) {
    -webkit-transition-delay: 1254ms;
    -o-transition-delay: 1254ms;
    transition-delay: 1254ms
}

html:not(.no-anima) .fade.anima {
    opacity: 0
}

html:not(.no-anima) .fade.anima.in {
    opacity: 1;
    -webkit-transition: opacity .9s linear;
    -o-transition: opacity .9s linear;
    transition: opacity .9s linear
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    html:not(.no-anima) .mobFadeUp.anima {
        opacity:0;
        -webkit-transform: translateY(8rem);
        -ms-transform: translateY(8rem);
        transform: translateY(8rem)
    }

    html:not(.no-anima) .mobFadeUp.anima.in {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: opacity .9s ease-out,-webkit-transform 1s cubic-bezier(0,0,0,1);
        transition: opacity .9s ease-out,-webkit-transform 1s cubic-bezier(0,0,0,1);
        -o-transition: opacity .9s ease-out,transform 1s cubic-bezier(0,0,0,1);
        transition: opacity .9s ease-out,transform 1s cubic-bezier(0,0,0,1);
        transition: opacity .9s ease-out,transform 1s cubic-bezier(0,0,0,1),-webkit-transform 1s cubic-bezier(0,0,0,1)
    }
}

.subscribe {
    height: 8.5rem;
    width: 100%;
    position: relative
}

.subscribe>div {
    width: 100%;
    height: 100%
}

.subscribe form {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.subscribe fieldset {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    max-width: calc(100% - 7rem)!important
}

.subscribe .hs-submit {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: 7rem;
    min-width: 7rem
}

.subscribe__field {
    height: 100%;
    width: 100%
}

.subscribe .hs-error-msgs {
    position: absolute;
    bottom: -.75rem;
    left: 0;
    background-color: #212121;
    color: #ff622b;
    font-size: 1.8rem;
    padding-right: 2rem;
    z-index: 3
}

.subscribe .field {
    height: 100%;
    position: relative
}

.subscribe .field>label,.subscribe .submitted-message {
    position: absolute;
    line-height: 8.5rem;
    font-size: 2.5rem;
    opacity: .3;
    color: #ececec
}

.subscribe .submitted-message {
    opacity: .5;
    font-size: 2.5rem
}

.subscribe .input {
    height: 100%
}

.subscribe input:not([type=submit]) {
    height: 100%;
    width: 100%;
    background: 0 0!important;
    position: relative;
    z-index: 2;
    font-size: 2.5rem;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.5);
    -webkit-transition: border .3s linear,background .2s linear;
    -o-transition: border .3s linear,background .2s linear;
    transition: border .3s linear,background .2s linear
}

.subscribe input:not([type=submit]):not([value=""]):not([type=submit]) {
    background: #212121!important
}

.subscribe input:not([type=submit]):focus {
    border-bottom: 1px solid #ff622b
}

.subscribe .hs-submit {
    display: block;
    position: absolute;
    top: .5rem;
    right: 0;
    height: 7rem;
    width: 7rem;
    background: 0 0;
    cursor: pointer;
    overflow: hidden;
    border-radius: .5rem;
    overflow: hidden
}

.subscribe .hs-submit input {
    font-size: 0;
    color: #212121;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: 0 0!important;
    cursor: pointer
}

.subscribe .hs-submit::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ff622b;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    pointer-events: none;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.subscribe .hs-submit:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(/images/arrow-subscribe.svg) center no-repeat;
    background-size: 2.1rem 2.1rem;
    pointer-events: none
}

@media (hover: hover) {
    .subscribe .hs-submit:hover::before {
        -webkit-transform:scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: left;
        -ms-transform-origin: left;
        transform-origin: left
    }
}

.subscribe__button {
    height: 100%;
    width: 100%;
    cursor: pointer
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .subscribe {
        height:12rem
    }

    .subscribe fieldset {
        max-width: calc(100% - 5rem)!important
    }

    .subscribe .hs-submit {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        max-width: 5rem;
        min-width: 5rem
    }

    .subscribe .hs-error-msgs {
        font-size: 1.2rem;
        bottom: -.5rem;
        padding-right: 1rem
    }

    .subscribe .field>label,.subscribe .submitted-message {
        line-height: 6rem;
        font-size: 1.8rem
    }

    .subscribe .submitted-message {
        opacity: .5;
        font-size: 1.8rem
    }

    .subscribe .field {
        height: 6rem;
        position: relative
    }

    .subscribe input:not([type=submit]) {
        font-size: 1.8rem
    }

    .subscribe .hs-submit {
        top: auto;
        bottom: 0;
        height: 5rem;
        width: 5rem
    }

    .subscribe .hs-submit:after {
        background-size: 2rem 2rem
    }
}

.sectionBlock {
    color: #1f00ff;
    overflow: hidden
}

.sectionBlock__top {
    height: 5.8rem;
    border-bottom: 1px solid #1f00ff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 2.2rem;
    overflow: hidden;
    -webkit-transform: translateY(10rem);
    -ms-transform: translateY(10rem);
    transform: translateY(10rem)
}

.sectionBlock__top span {
    display: inline-block;
    position: relative;
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%)
}

.sectionBlock__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 8.8rem;
    max-width: 8.8rem;
    height: 100%;
    border-left: 1px solid #1f00ff;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.2rem;
    -webkit-transform: translateX(-29rem);
    -ms-transform: translateX(-29rem);
    transform: translateX(-29rem)
}

.sectionBlock__icon img {
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%;
    height: 100%;
    -webkit-transform: translateY(-6rem);
    -ms-transform: translateY(-6rem);
    transform: translateY(-6rem)
}

.sectionBlock__bottom {
    padding: 1.8rem 2.2rem 2.3rem 2.2rem;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%)
}

.sectionBlock.in .sectionBlock__top {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(0,0,0,1);
    transition: -webkit-transform .5s cubic-bezier(0,0,0,1);
    -o-transition: transform .5s cubic-bezier(0,0,0,1);
    transition: transform .5s cubic-bezier(0,0,0,1);
    transition: transform .5s cubic-bezier(0,0,0,1),-webkit-transform .5s cubic-bezier(0,0,0,1)
}

.sectionBlock.in .sectionBlock__top span {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .6s .4s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s .4s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s .4s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .4s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .4s cubic-bezier(.5,0,.25,1),-webkit-transform .6s .4s cubic-bezier(.5,0,.25,1)
}

.sectionBlock.in .sectionBlock__icon {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .5s .3s cubic-bezier(0,0,0,1);
    transition: -webkit-transform .5s .3s cubic-bezier(0,0,0,1);
    -o-transition: transform .5s .3s cubic-bezier(0,0,0,1);
    transition: transform .5s .3s cubic-bezier(0,0,0,1);
    transition: transform .5s .3s cubic-bezier(0,0,0,1),-webkit-transform .5s .3s cubic-bezier(0,0,0,1)
}

.sectionBlock.in .sectionBlock__icon img {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .6s .5s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s .5s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .6s .5s cubic-bezier(.5,0,.25,1)
}

.sectionBlock.in .sectionBlock__bottom {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .6s .6s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .6s cubic-bezier(.5,0,.25,1),-webkit-transform .6s .6s cubic-bezier(.5,0,.25,1)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .sectionBlock__top {
        padding-left:1.2rem;
        height: 5.3rem
    }

    .sectionBlock__top .subheading {
        font-size: 2rem
    }

    .sectionBlock__bottom {
        padding: 1.2rem;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%)
    }

    .sectionBlock__icon {
        min-width: 8rem;
        max-width: 8rem;
        padding: 1.2rem 1rem
    }
}

@-webkit-keyframes form_in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(3rem);
        transform: translateY(3rem)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes form_in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(3rem);
        transform: translateY(3rem)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

.HB .hbspt-form form {
    opacity: 0;
    -webkit-animation: form_in .6s cubic-bezier(0,0,0,1) forwards;
    animation: form_in .6s cubic-bezier(0,0,0,1) forwards
}

.HB .hbspt-form .form-columns-1,.HB .hbspt-form .form-columns-2,.HB .hbspt-form .form-columns-3,.HB .hbspt-form .form-columns-4 {
    width: 100%;
    max-width: 100%;
    margin-bottom: 3.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 2rem
}

.HB .hbspt-form form>.field {
    margin-bottom: 3.5rem
}

.HB .hbspt-form .field {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative
}

.HB .hbspt-form .field>label {
    font-size: 1.5rem;
    display: block;
    font-family: Archivo,sans-serif;
    padding-left: 2rem
}

.HB .hbspt-form .field>legend {
    font-size: 1.5rem;
    color: rgba(33,33,33,.5);
    margin: 1rem 0 .5rem;
    display: block;
    font-family: Archivo,sans-serif;
    padding-left: 2rem
}

.HB .hbspt-form .field .input {
    display: block;
    margin: 1rem 0 0!important;
    width: 100%
}

.HB .hbspt-form .field .input input,.HB .hbspt-form .field .input select,.HB .hbspt-form .field .input textarea {
    width: 100%!important;
    border: 1px solid rgba(31,0,255,.25);
    height: 7rem;
    border-radius: .5rem;
    color: #1f00ff;
    font-family: Archivo,sans-serif;
    padding: 0 2.2rem;
    -webkit-transition: border .1s linear;
    -o-transition: border .1s linear;
    transition: border .1s linear
}

.HB .hbspt-form .field .input input:focus,.HB .hbspt-form .field .input select:focus,.HB .hbspt-form .field .input textarea:focus {
    border: 1px solid rgba(31,0,255,.5)
}

.HB .hbspt-form .field .input input.error,.HB .hbspt-form .field .input select.error,.HB .hbspt-form .field .input textarea.error {
    border: 1px solid rgba(255,98,43,.5)
}

.HB .hbspt-form .field .input input::-webkit-input-placeholder,.HB .hbspt-form .field .input select::-webkit-input-placeholder,.HB .hbspt-form .field .input textarea::-webkit-input-placeholder {
    color: #1f00ff;
    opacity: .25
}

.HB .hbspt-form .field .input input::-moz-placeholder,.HB .hbspt-form .field .input select::-moz-placeholder,.HB .hbspt-form .field .input textarea::-moz-placeholder {
    color: #1f00ff;
    opacity: .25
}

.HB .hbspt-form .field .input input:-ms-input-placeholder,.HB .hbspt-form .field .input select:-ms-input-placeholder,.HB .hbspt-form .field .input textarea:-ms-input-placeholder {
    color: #1f00ff;
    opacity: .25
}

.HB .hbspt-form .field .input input::-ms-input-placeholder,.HB .hbspt-form .field .input select::-ms-input-placeholder,.HB .hbspt-form .field .input textarea::-ms-input-placeholder {
    color: #1f00ff;
    opacity: .25
}

.HB .hbspt-form .field .input input::placeholder,.HB .hbspt-form .field .input select::placeholder,.HB .hbspt-form .field .input textarea::placeholder {
    color: #1f00ff;
    opacity: .25
}

.HB .hbspt-form .field .input textarea {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 2.2rem 2.2rem;
    min-height: 16rem
}

.HB .hbspt-form .field .input select.is-placeholder {
    color: rgba(31,0,255,.25)
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li {
    line-height: 2
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li label,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li label,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input {
    display: inline-block;
    max-width: 2rem!important;
    min-width: 2rem!important;
    height: 2rem;
    margin-right: 1rem;
    padding: 0;
    background-color: rgba(255,98,43,0);
    -webkit-transition: background 50ms linear;
    -o-transition: background 50ms linear;
    transition: background 50ms linear
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input:checked,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input:checked,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input:checked {
    background-color: #ff622b;
    border-color: #ff622b;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input:checked+span,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input:checked+span,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input:checked+span {
    color: #ff622b
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input[type=radio],.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input[type=radio],.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input[type=radio] {
    border-radius: 100%
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input[type=radio]:checked,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input[type=radio]:checked,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input[type=radio]:checked {
    background-image: url(/images/radio_tick.svg)
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li input[type=checkbox]:checked,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li input[type=checkbox]:checked,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li input[type=checkbox]:checked {
    background-image: url(/images/checkbox_tick.svg)
}

.HB .hbspt-form .hs-fieldtype-booleancheckbox .input {
    margin-top: 0!important
}

.HB .hbspt-form .hs-fieldtype-file .input {
    padding: 1rem 0
}

.HB .hbspt-form .hs-fieldtype-file .input input {
    border: none!important;
    padding: 0;
    height: auto;
    font-size: 1.5rem;
    color: rgba(33,33,33,.5)
}

.HB .hbspt-form .hs-fieldtype-file .input input::file-selector-button {
    border: 1px solid rgba(31,0,255,.5);
    background-color: rgba(31,0,255,.1);
    border-radius: .5rem;
    font-family: Archivo,sans-serif;
    padding: 1rem 2rem;
    margin-right: 2rem;
    color: #1f00ff
}

.HB .hbspt-form .hs-fieldtype-date input {
    background: url(/images/date_icon.svg) no-repeat;
    background-size: 2.5rem;
    background-position: calc(100% - 1.5rem) 55%
}

.HB .hbspt-form .hs-fieldtype-select select {
    background: url(/images/dropdown_icon.svg) no-repeat;
    background-size: 2rem auto;
    background-position: calc(100% - 2rem) 55%
}

.HB .hbspt-form .hs-datepicker {
    font-family: Archivo,sans-serif
}

.HB .hbspt-form .legal-consent-container {
    color: rgba(33,33,33,.5);
    line-height: 1.5
}

.HB .hbspt-form .legal-consent-container .hs-richtext {
    margin-bottom: 1em
}

.HB .hbspt-form .legal-consent-container input+span {
    color: #1f00ff
}

.HB .hbspt-form .hs-error-msgs {
    display: block;
    position: absolute;
    bottom: -.5rem;
    left: 1.8rem;
    color: #ff622b
}

.HB .hbspt-form .hs-error-msgs .hs-error-msg {
    font-size: 1.5rem;
    color: #ff622b;
    background-color: #fff;
    padding: .5rem!important
}

.HB .hbspt-form .hs_error_rollup {
    position: relative;
    margin-bottom: 2rem
}

.HB .hbspt-form .hs_error_rollup .hs-error-msgs {
    position: static
}

.HB .hbspt-form .hs-submit {
    padding: 0;
    height: 6rem
}

.HB .hbspt-form .hs-submit input {
    width: 100%;
    height: 100%;
    font-size: 2.2rem;
    padding: 0 5rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .HB .hbspt-form .form-columns-1,.HB .hbspt-form .form-columns-2,.HB .hbspt-form .form-columns-3,.HB .hbspt-form .form-columns-4 {
        gap:2rem;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-bottom: 2rem
    }

    .HB .hbspt-form form>.field {
        margin-bottom: 2rem
    }

    .HB .hbspt-form .field {
        min-width: 100%
    }

    .HB .hbspt-form .field>label {
        padding-left: 1rem
    }

    .HB .hbspt-form .field>legend {
        padding-left: 1rem
    }

    .HB .hbspt-form .field .input input,.HB .hbspt-form .field .input select,.HB .hbspt-form .field .input textarea {
        font-size: 16px;
        height: 5rem;
        padding: 0 1.2rem
    }

    .HB .hbspt-form .field .input textarea {
        padding: 1.2rem 1.2rem;
        min-height: 12rem
    }

    .HB .hbspt-form .hs-fieldtype-booleancheckbox .inputs-list li,.HB .hbspt-form .hs-fieldtype-checkbox .inputs-list li,.HB .hbspt-form .hs-fieldtype-radio .inputs-list li {
        line-height: 1.5
    }

    .HB .hbspt-form .hs-fieldtype-booleancheckbox .input {
        margin-top: 0!important
    }

    .HB .hbspt-form .hs-fieldtype-date input[type=date]::-webkit-calendar-picker-indicator,.HB .hbspt-form .hs-fieldtype-date input[type=date]::-webkit-inner-spin-button {
        display: none;
        -webkit-appearance: none
    }

    .HB .hbspt-form .legal-consent-container {
        font-size: 1.4rem;
        line-height: 1.35
    }

    .HB .hbspt-form .legal-consent-container input+span {
        margin-left: 1rem
    }

    .HB .hbspt-form .hs-error-msgs {
        bottom: -.5rem;
        left: 1rem
    }

    .HB .hbspt-form .hs-error-msgs .hs-error-msg {
        font-size: 1.25rem
    }

    .HB .hbspt-form .hs-submit {
        height: 5rem
    }

    .HB .hbspt-form .hs-submit input {
        font-size: 2rem;
        padding: 0 4rem
    }
}

.nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 1000;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    pointer-events: none
}

.nav__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    background: #212121;
    opacity: 0
}

.nav__bar {
    position: absolute;
    top: 3.4rem;
    left: 5.2rem;
    width: calc(100% - 9.2rem);
    height: 4.3rem;
    z-index: 100
}

.nav__logo {
    position: absolute;
    top: .3rem;
    left: 0;
    height: 3.6rem;
    pointer-events: auto
}

.nav__logo svg {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.nav__logo svg .fill {
    fill: #fff;
    -webkit-transition: fill .2s linear;
    -o-transition: fill .2s linear;
    transition: fill .2s linear
}

.nav__ctaButton {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 5.8rem;
    width: 11.5rem;
    height: 3.7rem;
    pointer-events: auto
}

.nav__ctaButton .button__inner {
    font-size: 1.5rem
}

.nav__toggle {
    width: 3.5rem;
    height: 3rem;
    position: absolute;
    right: 1.15rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    pointer-events: auto;
    cursor: pointer
}

.nav__toggle span {
    width: 100%;
    height: 1px;
    background-color: #1f00ff;
    position: absolute;
    top: calc(50% - .5px);
    -webkit-transition: -webkit-transform .2s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .2s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .2s cubic-bezier(.5,0,.25,1);
    transition: transform .2s cubic-bezier(.5,0,.25,1);
    transition: transform .2s cubic-bezier(.5,0,.25,1),-webkit-transform .2s cubic-bezier(.5,0,.25,1)
}

.nav__toggle span:first-child {
    -webkit-transform: translateY(-.5rem);
    -ms-transform: translateY(-.5rem);
    transform: translateY(-.5rem)
}

.nav__toggle span:nth-child(2) {
    -webkit-transform-origin: left;
    -ms-transform-origin: left;
    transform-origin: left
}

.nav__toggle span:last-child {
    -webkit-transform: translateY(.5rem);
    -ms-transform: translateY(.5rem);
    transform: translateY(.5rem)
}

@media (hover: hover) {
    .nav__toggle:hover span:first-child {
        -webkit-transform:translateY(-.75rem);
        -ms-transform: translateY(-.75rem);
        transform: translateY(-.75rem)
    }

    .nav__toggle:hover span:last-child {
        -webkit-transform: translateY(.75rem);
        -ms-transform: translateY(.75rem);
        transform: translateY(.75rem)
    }
}

.nav__menuBg {
    will-change: width,height;
    width: 17.7rem;
    height: 4.3rem;
    position: absolute;
    top: 3.4rem;
    right: 4rem;
    background-color: #fff;
    border-radius: .5rem;
    -webkit-transition: width .4s cubic-bezier(.5,0,.25,1),height .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1);
    transition: width .4s cubic-bezier(.5,0,.25,1),height .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .4s cubic-bezier(.5,0,.25,1),width .4s cubic-bezier(.5,0,.25,1),height .4s cubic-bezier(.5,0,.25,1);
    transition: transform .4s cubic-bezier(.5,0,.25,1),width .4s cubic-bezier(.5,0,.25,1),height .4s cubic-bezier(.5,0,.25,1);
    transition: transform .4s cubic-bezier(.5,0,.25,1),width .4s cubic-bezier(.5,0,.25,1),height .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1);
    border: 1px solid #1f00ff
}

.nav__menu {
    position: absolute;
    pointer-events: none;
    top: 1.3rem;
    right: 3.3rem;
    width: 58.6rem;
    height: calc(100vh - 4.8rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 12rem 0 2rem 3rem;
    color: #1f00ff;
    counter-reset: nav-link;
    overflow: hidden
}

.nav__linksHeader {
    display: block;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    font-size: 1.5rem;
    color: #d3d3d3;
    font-weight: 800;
    margin-bottom: 1rem;
    opacity: 0;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    -webkit-transition: opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__linksHeader:not(:first-child) {
    margin-top: 5rem
}

.nav__menuLink {
    display: block;
    height: 5.5rem;
    padding: 0 5.7rem;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    font-size: 3.5rem;
    line-height: 5.5rem;
    border-top: 1px solid #1f00ff;
    position: relative;
    counter-increment: nav-link;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
    -webkit-transition: opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__menuLink:last-child {
    border-bottom: 1px solid #1f00ff
}

.nav__menuLink::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1f00ff;
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__menuLink::after {
    content: "0" counter(nav-link);
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: .2rem;
    border: 1px solid #1f00ff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: "PP Right",sans-serif;
    font-size: 1.4rem;
    background-color: #fff;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__menuLink span {
    display: inline-block;
    position: relative;
    -webkit-transition: color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

@media (hover: hover) {
    .nav__menuLink:hover span {
        color:#fff;
        -webkit-transform: translateX(1rem);
        -ms-transform: translateX(1rem);
        transform: translateX(1rem)
    }

    .nav__menuLink:hover::before {
        -webkit-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        -ms-transform-origin: top;
        transform-origin: top
    }

    .nav__menuLink:hover::after {
        -webkit-transform: translateY(-50%) translateX(1rem);
        -ms-transform: translateY(-50%) translateX(1rem);
        transform: translateY(-50%) translateX(1rem);
        color: #1f00ff
    }
}

.nav__extraLinks {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
    -webkit-transition: opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),opacity .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__extraLink {
    font-size: 2.5rem;
    height: 5rem;
    line-height: 5rem;
    text-transform: uppercase;
    border-bottom: 1px solid #1f00ff;
    font-family: "PP Right",sans-serif;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative
}

.nav__extraLink:nth-child(-n+2) {
    border-top: 1px solid #1f00ff
}

.nav__extraLink:nth-child(odd) {
    min-width: 45%
}

.nav__extraLink:nth-child(even) {
    min-width: 55%;
    border-left: 1px solid #1f00ff;
    padding-left: 2.4rem
}

.nav__extraLink::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1f00ff;
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

.nav__extraLink span {
    display: inline-block;
    position: relative;
    -webkit-transition: color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out;
    transition: transform .3s cubic-bezier(.5,0,.25,1),color .3s ease-in-out,-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

@media (hover: hover) {
    .nav__extraLink:hover span {
        color:#fff;
        -webkit-transform: translateX(1rem);
        -ms-transform: translateX(1rem);
        transform: translateX(1rem)
    }

    .nav__extraLink:hover::before {
        -webkit-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top;
        -ms-transform-origin: top;
        transform-origin: top
    }
}

.nav__menuInfo {
    opacity: 0;
    -webkit-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out
}

@media screen and (min-aspect-ratio: 1220/670) {
    .nav__menuInfo>:nth-child(n+3) {
        display:none
    }
}

.nav__menuHeader {
    font-family: "PP Right",sans-serif;
    font-size: 1.5rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    display: block;
    margin-bottom: 1rem;
    margin-top: 4.5rem
}

.nav__smallLink {
    line-height: 1.4;
    margin-bottom: .1rem
}

.nav__smallLink::after {
    background: #1f00ff
}

.nav__bottom {
    position: absolute;
    bottom: 0;
    left: 2rem;
    width: calc(100% - 4rem);
    -webkit-transform: translateY(102%);
    -ms-transform: translateY(102%);
    transform: translateY(102%);
    -webkit-transition: opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(0,0,0,1);
    transition: opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(0,0,0,1);
    -o-transition: transform .3s cubic-bezier(0,0,0,1),opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(0,0,0,1),opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(0,0,0,1),opacity .2s ease-in-out,-webkit-transform .3s cubic-bezier(0,0,0,1);
    opacity: 0
}

.scrolled:not(.menu-open):not(.upscroll) .nav {
    -webkit-transform: translateY(-10rem);
    -ms-transform: translateY(-10rem);
    transform: translateY(-10rem)
}

.blue-nav .nav .nav__logo svg .fill {
    fill: #1f00ff
}

.menu-open .nav__overlay {
    opacity: .2;
    pointer-events: auto
}

.menu-open .nav__toggle span:first-child {
    -webkit-transform: translateY(0) rotate(15deg);
    -ms-transform: translateY(0) rotate(15deg);
    transform: translateY(0) rotate(15deg)
}

.menu-open .nav__toggle span:nth-child(2) {
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0)
}

.menu-open .nav__toggle span:last-child {
    -webkit-transform: translateY(0) rotate(-15deg);
    -ms-transform: translateY(0) rotate(-15deg);
    transform: translateY(0) rotate(-15deg)
}

.menu-open .nav__menuBg {
    width: 62.6rem;
    -webkit-transform: translate3d(2.7rem,-2.1rem,0);
    transform: translate3d(2.7rem,-2.1rem,0);
    height: calc(100vh - 2.6rem)
}

.menu-open .nav__menu {
    pointer-events: auto
}

.menu-open .nav__extraLinks,.menu-open .nav__menuLink {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
    -webkit-transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    -o-transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out;
    transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out;
    transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1)
}

.menu-open .nav__menuLink:nth-child(1) {
    -webkit-transition-delay: 50ms;
    -o-transition-delay: 50ms;
    transition-delay: 50ms
}

.menu-open .nav__menuLink:nth-child(2) {
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s
}

.menu-open .nav__menuLink:nth-child(3) {
    -webkit-transition-delay: 150ms;
    -o-transition-delay: 150ms;
    transition-delay: 150ms
}

.menu-open .nav__menuLink:nth-child(4) {
    -webkit-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s
}

.menu-open .nav__menuLink:nth-child(5) {
    -webkit-transition-delay: 250ms;
    -o-transition-delay: 250ms;
    transition-delay: 250ms
}

.menu-open .nav__menuLink:nth-child(6) {
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s
}

.menu-open .nav__menuLink:nth-child(7) {
    -webkit-transition-delay: 350ms;
    -o-transition-delay: 350ms;
    transition-delay: 350ms
}

.menu-open .nav__menuLink:nth-child(8) {
    -webkit-transition-delay: .4s;
    -o-transition-delay: .4s;
    transition-delay: .4s
}

.menu-open .nav__menuLink:nth-child(9) {
    -webkit-transition-delay: 450ms;
    -o-transition-delay: 450ms;
    transition-delay: 450ms
}

.menu-open .nav__menuLink:nth-child(10) {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

.menu-open .nav__linksHeader,.menu-open .nav__menuInfo {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    transition: opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1);
    -o-transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out;
    transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out;
    transition: transform .5s cubic-bezier(0,0,0,1),opacity .3s ease-in-out,-webkit-transform .5s cubic-bezier(0,0,0,1)
}

.menu-open .nav__extraLinks .menu-open .nav__linksHeader:not(:first-child) {
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s
}

.menu-open .nav__bottom {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .5s 150ms cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .5s 150ms cubic-bezier(.5,0,.25,1);
    -o-transition: transform .5s 150ms cubic-bezier(.5,0,.25,1);
    transition: transform .5s 150ms cubic-bezier(.5,0,.25,1);
    transition: transform .5s 150ms cubic-bezier(.5,0,.25,1),-webkit-transform .5s 150ms cubic-bezier(.5,0,.25,1);
    opacity: 1
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .nav__bar {
        position:absolute;
        top: 4.3rem;
        left: 2rem;
        width: calc(100% - 4rem)
    }

    .nav__logo {
        top: .5rem;
        height: 2.6rem
    }

    .nav__ctaButton {
        right: 6.4rem;
        width: 10rem;
        height: 3.5rem
    }

    .nav__toggle {
        right: 1.2rem
    }

    .nav__menuBg {
        width: 16.9rem;
        height: 4.3rem;
        top: 4.3rem;
        right: 2rem
    }

    .nav__menu {
        top: 1rem;
        right: 1rem;
        width: calc(100vw - 2rem);
        height: calc(100vh - 2rem);
        padding: 11rem 2rem 2rem 2rem
    }

    .nav__menuLink {
        height: 4.5rem;
        padding: 0 5rem;
        font-size: 3rem;
        line-height: 4.5rem
    }

    .nav__menuInfo {
        margin-top: 2rem
    }
}

@media screen and (orientation: portrait) and (max-width:800px) and (min-aspect-ratio:375/720),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) and (min-aspect-ratio:375/720) {
    .nav__menuInfo>:nth-child(n+3) {
        display:none
    }
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .nav__menuHeader {
        margin-top:2.5rem
    }
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .nav__bottom {
        display:none
    }
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .menu-open .nav__menuBg {
        width:calc(100vw - 2rem);
        -webkit-transform: translate3d(1rem,-3.2rem,0);
        transform: translate3d(1rem,-3.2rem,0);
        height: calc(100vh - 2rem)
    }
}

.footer {
    padding: .5rem .5rem .5rem;
    color: #fff
}

.footer__top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .5rem;
    height: 34rem
}

.footer__bottom,.footer__row,.footer__topLeft {
    background: #212121;
    color: #fff;
    border-radius: .5rem
}

.footer__topLeft {
    height: 100%;
    width: 34rem;
    padding: 4rem
}

.footer__logo {
    height: 8.9rem;
    margin-left: 2rem;
    margin-bottom: 7rem
}

.footer__logo img {
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.footer__subscribe {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.footer__subscribe p {
    margin-bottom: .5rem
}

.footer__topRight {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .5rem
}

.footer__row {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 12rem;
    padding: 3rem 5rem 2rem
}

.footer__row:nth-child(1) {
    padding-top: 3.5rem
}

.footer__row:nth-child(2) {
    min-height: 17.1rem
}

.footer__col {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.footer__header {
    font-family: "PP Right",sans-serif;
    font-size: 1.5rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    display: block;
    margin-bottom: 1.5rem
}

.footer__link {
    padding: .5rem 0
}

.footer__bottom {
    height: 5rem;
    width: 100%;
    margin-top: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1rem 4rem;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: .1em;
    line-height: 1.5
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .footer {
        padding-top:.5rem
    }

    .footer__top {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: .5rem;
        height: auto
    }

    .footer__bottom,.footer__row,.footer__topLeft {
        background: #212121;
        color: #fff;
        border-radius: .5rem
    }

    .footer__topLeft {
        height: auto;
        width: 100%;
        padding: 3rem 2rem
    }

    .footer__logo {
        height: 8.9rem;
        margin-top: 3rem;
        margin-left: 0;
        text-align: center;
        margin-bottom: 3rem
    }

    .footer__logo+.footer__col {
        display: none
    }

    .footer__subscribe {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

    .footer__subscribe p {
        margin-bottom: .5rem
    }

    .footer__topRight {
        width: 100%;
        display: block
    }

    .footer__topRight .footer__row:first-child {
        margin-top: -3rem
    }

    .footer__topRight .footer__row:last-child {
        margin-top: .5rem
    }

    .footer__topRight .footer__row:last-child .footer__col {
        -webkit-box-flex: 10;
        -ms-flex: 10;
        flex: 10
    }

    .footer__topRight .footer__row:last-child .footer__col:nth-child(2) {
        -webkit-box-flex: 15;
        -ms-flex: 15;
        flex: 15
    }

    .footer__topRight .footer__row:last-child .footer__col:nth-child(3) {
        min-width: 100%
    }

    .footer__topRight .footer__row:last-child .footer__col:nth-child(4) {
        -webkit-box-flex: 15;
        -ms-flex: 15;
        flex: 15
    }

    .footer__topRight .footer__row:last-child .footer__col:nth-child(6) {
        min-width: 100%;
        text-align: center;
        text-transform: uppercase;
        line-height: 2;
        font-size: 1rem
    }

    .footer__row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 4rem 2rem;
        padding: 3rem 2rem 2rem!important;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .footer__bottom {
        padding: 1rem 2rem
    }
}

.homeHeader {
    padding: 1.5rem;
    color: #fff
}

.homeHeader__inner {
    position: relative;
    height: 100%;
    padding-top: 13rem;
    padding-bottom: 5.5rem;
    overflow: hidden
}

.homeHeader__heading {
    font-size: 16rem;
    position: relative;
    text-align: center;
    line-height: .85
}

.homeHeader__bottom,.homeHeader__mid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative
}

.homeHeader__mid {
    width: 124.4rem;
    margin: 2.2rem auto 4rem
}

.homeHeader__midLine {
    width: 38.8rem;
    border-top: 1px solid rgba(255,255,255,.5);
    position: relative;
    margin-top: 3.2rem;
    overflow: hidden;
    will-change: height;
    height: 9.5rem;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0)
}

.homeHeader__midLine::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    border-top: 1px solid rgba(255,255,255,.5)
}

.homeHeader__midLine img,.homeHeader__midLine span {
    -webkit-transform: translateY(8rem);
    -ms-transform: translateY(8rem);
    transform: translateY(8rem)
}

.homeHeader__midLine:nth-child(1) img {
    height: 3rem
}

.homeHeader__midLine:nth-child(3) img {
    height: 3.5rem
}

.homeHeader__midLineInner {
    position: absolute;
    width: 100%;
    height: 9.5rem;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.homeHeader__image {
    width: 39.4rem;
    height: 39.4rem;
    background: #fff;
    border-radius: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transform: translateY(60rem);
    -ms-transform: translateY(60rem);
    transform: translateY(60rem)
}

.homeHeader__image img {
    height: 33.8rem;
    width: auto
}

.homeHeader__bottom {
    width: 138.9rem;
    margin: auto;
    height: 4.5rem
}

.homeHeader__bottom div:nth-child(1) {
    width: 8.2rem;
    background: #fff;
    border-radius: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transform: translateX(-15rem);
    -ms-transform: translateX(-15rem);
    transform: translateX(-15rem)
}

.homeHeader__bottom div:nth-child(1) img {
    height: 3.2rem
}

.homeHeader__bottom div:nth-child(2) {
    width: 45rem;
    text-align: center;
    -webkit-transform: translateY(10rem);
    -ms-transform: translateY(10rem);
    transform: translateY(10rem);
    margin-top: -.5rem
}

.homeHeader__bottom div:nth-child(3) {
    width: 4.5rem;
    background: #fff;
    border-radius: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transform: translateX(15rem);
    -ms-transform: translateX(15rem);
    transform: translateX(15rem)
}

.homeHeader__bottom div:nth-child(3) img {
    height: 2.9rem
}

.homeHeader.in .homeHeader__midLine {
    height: 9.5rem;
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition: height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .1s cubic-bezier(0,0,0,1);
    transition: height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .1s cubic-bezier(0,0,0,1);
    -o-transition: transform .3s .1s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .3s .1s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .3s .1s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .1s cubic-bezier(0,0,0,1)
}

.homeHeader.in .homeHeader__midLine img,.homeHeader.in .homeHeader__midLine span {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .8s .2s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .8s .2s cubic-bezier(.5,0,.25,1);
    transition: transform .8s .2s cubic-bezier(.5,0,.25,1);
    transition: transform .8s .2s cubic-bezier(.5,0,.25,1),-webkit-transform .8s .2s cubic-bezier(.5,0,.25,1)
}

.homeHeader.in .homeHeader__image {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform 1s .1s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform 1s .1s cubic-bezier(.5,0,.25,1);
    -o-transition: transform 1s .1s cubic-bezier(.5,0,.25,1);
    transition: transform 1s .1s cubic-bezier(.5,0,.25,1);
    transition: transform 1s .1s cubic-bezier(.5,0,.25,1),-webkit-transform 1s .1s cubic-bezier(.5,0,.25,1)
}

.homeHeader.in .homeHeader__bottom div {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .5s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .8s .5s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .8s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .8s .5s cubic-bezier(.5,0,.25,1);
    transition: transform .8s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .8s .5s cubic-bezier(.5,0,.25,1)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .homeHeader {
        padding:0
    }

    .homeHeader__inner {
        padding-top: 15rem;
        padding-bottom: 5.5rem
    }

    .homeHeader__heading {
        font-size: 6.5rem
    }

    .homeHeader__bottom,.homeHeader__mid {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .homeHeader__mid {
        width: 100%;
        margin: 3.5rem auto 4rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding: 0 1.2rem
    }

    .homeHeader__midLine {
        width: 100%;
        margin-top: 5rem;
        height: 7rem
    }

    .homeHeader__midLine:last-child {
        display: none
    }

    .homeHeader__midLine .subheading {
        font-size: 2rem
    }

    .homeHeader__midLine img {
        height: 2.8rem
    }

    .homeHeader__midLineInner {
        position: absolute;
        width: 100%;
        height: 7rem;
        top: 0;
        left: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .homeHeader__image {
        width: 30rem;
        height: 30rem;
        margin: auto;
        -webkit-transform: translateY(60rem);
        -ms-transform: translateY(60rem);
        transform: translateY(60rem)
    }

    .homeHeader__image img {
        height: 30rem;
        border-radius: .5rem
    }

    .homeHeader__bottom {
        width: 100%;
        margin: auto;
        height: auto
    }

    .homeHeader__bottom div:nth-child(1) {
        display: none
    }

    .homeHeader__bottom div:nth-child(2) {
        width: 100%;
        padding: 0 2rem
    }

    .homeHeader__bottom div:nth-child(3) {
        display: none
    }

    .homeHeader.in .homeHeader__midLine {
        height: 7rem;
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .6s cubic-bezier(0,0,0,1);
        transition: height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .6s cubic-bezier(0,0,0,1);
        -o-transition: transform .3s .6s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1);
        transition: transform .3s .6s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1);
        transition: transform .3s .6s cubic-bezier(0,0,0,1),height .6s .5s cubic-bezier(.5,0,.25,1),-webkit-transform .3s .6s cubic-bezier(0,0,0,1)
    }

    .homeHeader.in .homeHeader__midLine img,.homeHeader.in .homeHeader__midLine span {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: -webkit-transform .8s .7s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .8s .7s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .8s .7s cubic-bezier(.5,0,.25,1);
        transition: transform .8s .7s cubic-bezier(.5,0,.25,1);
        transition: transform .8s .7s cubic-bezier(.5,0,.25,1),-webkit-transform .8s .7s cubic-bezier(.5,0,.25,1)
    }

    .homeHeader.in .homeHeader__image {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        -webkit-transition: -webkit-transform 1s .1s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform 1s .1s cubic-bezier(.5,0,.25,1);
        -o-transition: transform 1s .1s cubic-bezier(.5,0,.25,1);
        transition: transform 1s .1s cubic-bezier(.5,0,.25,1);
        transition: transform 1s .1s cubic-bezier(.5,0,.25,1),-webkit-transform 1s .1s cubic-bezier(.5,0,.25,1)
    }

    .homeHeader.in .homeHeader__bottom div {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: -webkit-transform .8s .8s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .8s .8s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .8s .8s cubic-bezier(.5,0,.25,1);
        transition: transform .8s .8s cubic-bezier(.5,0,.25,1);
        transition: transform .8s .8s cubic-bezier(.5,0,.25,1),-webkit-transform .8s .8s cubic-bezier(.5,0,.25,1)
    }
}

.promise {
    padding: 0 1.5rem
}

.promise__image {
    position: absolute;
    width: 35rem;
    height: 42rem;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    -webkit-transform: translate3d(-150%,-50%,0);
    transform: translate3d(-150%,-50%,0);
    -webkit-transition: opacity .5s ease-in-out,-webkit-transform .5s cubic-bezier(.5,0,.25,1);
    transition: opacity .5s ease-in-out,-webkit-transform .5s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .5s cubic-bezier(.5,0,.25,1),opacity .5s ease-in-out;
    transition: transform .5s cubic-bezier(.5,0,.25,1),opacity .5s ease-in-out;
    transition: transform .5s cubic-bezier(.5,0,.25,1),opacity .5s ease-in-out,-webkit-transform .5s cubic-bezier(.5,0,.25,1);
    opacity: 0
}

.promise__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.promise__image.active {
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    opacity: 1
}

.promise__image.active~.promise__image {
    -webkit-transform: translate3d(50%,-50%,0);
    transform: translate3d(50%,-50%,0)
}

.promise .grid>.col:nth-child(1) {
    max-width: 35.6rem
}

.promise .grid>.col:nth-child(1) .block:nth-child(2) {
    height: 43.5rem;
    position: -webkit-sticky;
    position: sticky;
    top: calc(50vh - 29rem);
    overflow: hidden
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) {
    padding: 14.5rem 13.1rem 15rem 17.6rem
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .sectionCounter {
    top: 1.5rem;
    right: 1.5rem
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock {
    color: #d3d3d3;
    display: block;
    padding: 3.5rem 0;
    min-height: 18rem;
    counter-increment: promise;
    position: relative
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock:last-child {
    margin-bottom: 0
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock::before {
    content: "0" counter(promise);
    position: absolute;
    top: 2.5rem;
    left: -10rem;
    width: 3.6rem;
    height: 3.6rem;
    border-radius: .2rem;
    border: 1px solid #d3d3d3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: "PP Right",sans-serif;
    font-size: 2rem;
    -webkit-transition: border .3s cubic-bezier(.5,0,.25,1),color .3s cubic-bezier(.5,0,.25,1);
    -o-transition: border .3s cubic-bezier(.5,0,.25,1),color .3s cubic-bezier(.5,0,.25,1);
    transition: border .3s cubic-bezier(.5,0,.25,1),color .3s cubic-bezier(.5,0,.25,1)
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock>span {
    font-size: 9.5rem;
    line-height: 7.5rem;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    position: relative;
    display: inline-block;
    width: 80rem
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock>span>span {
    position: absolute;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
    width: 0;
    overflow: hidden;
    will-change: width;
    -webkit-transition: width .5s cubic-bezier(.5,0,.25,1);
    -o-transition: width .5s cubic-bezier(.5,0,.25,1);
    transition: width .5s cubic-bezier(.5,0,.25,1)
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock>span>span:after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #1f00ff;
    width: 80rem
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active:before {
    color: #1f00ff;
    border-color: #1f00ff
}

.promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active>span>span {
    width: 80rem
}

.promise__mobImage {
    display: none
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .promise {
        padding:7.05rem 1.2rem
    }

    .promise .grid>.col:nth-child(1) {
        max-width: 25rem;
        position: relative
    }

    .promise .grid>.col:nth-child(1) .block:nth-child(2) {
        display: none
    }

    .promise .grid>.col:nth-child(1) .sectionCounter {
        top: 0;
        right: -10.2rem
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) {
        padding: 3rem 1.2rem 9rem 1.2rem
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock {
        padding: 3rem 0;
        min-height: 12rem
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock::before {
        top: 3.5rem;
        left: 0;
        width: 2rem;
        height: 2rem;
        font-size: 1.2rem
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock>span {
        font-size: 4rem;
        line-height: 3.5rem;
        width: 20rem;
        text-indent: 3rem;
        z-index: 2;
        -webkit-transition: color .3s ease-in-out;
        -o-transition: color .3s ease-in-out;
        transition: color .3s ease-in-out
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock>span>span:after {
        width: 20rem;
        display: none
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active:before {
        color: #1f00ff;
        border-color: #1f00ff
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active>span>span {
        color: #1f00ff
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active>span>span {
        width: 80rem;
        display: none
    }

    .promise .grid>.col:nth-child(2) .block:nth-child(1) .contentBlock.active .promise__mobImage {
        opacity: 1
    }

    .promise__mobImage {
        display: block;
        position: absolute;
        width: 14rem;
        height: 16rem;
        top: 50%;
        right: -1rem;
        opacity: 0;
        -webkit-transition: opacity .3s ease-in-out,-webkit-transform .4s cubic-bezier(.5,0,.25,1);
        transition: opacity .3s ease-in-out,-webkit-transform .4s cubic-bezier(.5,0,.25,1);
        -o-transition: opacity .3s ease-in-out,transform .4s cubic-bezier(.5,0,.25,1);
        transition: opacity .3s ease-in-out,transform .4s cubic-bezier(.5,0,.25,1);
        transition: opacity .3s ease-in-out,transform .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .promise__mobImage img {
        width: 100%;
        height: 100%;
        -o-object-fit: contain;
        object-fit: contain
    }
}

.process {
    padding: 20rem 1.5rem 1.5rem
}

.process .grid>.col:nth-child(1) .block:nth-child(1) {
    max-width: 35.6rem;
    -webkit-transform: translateX(-38rem);
    -ms-transform: translateX(-38rem);
    transform: translateX(-38rem)
}

.process .grid>.col:nth-child(1) .block:nth-child(1).in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.process .grid>.col:nth-child(1) .block:nth-child(2) {
    height: 31.5rem;
    padding: 0 1.8rem 0 0
}

.process .grid>.col:nth-child(1) .block:nth-child(2) h2 {
    line-height: 1.1
}

.process .grid>.col:nth-child(1) .block:nth-child(2) h2 span {
    display: block;
    position: relative
}

.process .grid>.col:nth-child(1) .block:nth-child(2) h2 span:nth-child(1) {
    padding-left: 3.1rem
}

.process .grid>.col:nth-child(1) .block:nth-child(2) h2 span:nth-child(2) {
    text-align: right;
    border-top: 1px solid #1f00ff
}

.process .grid>.col:nth-child(1) .block:nth-child(2) h2 .sectionCounter {
    position: absolute;
    bottom: -1px;
    right: 0
}

.process .grid>.col:nth-child(2) {
    max-width: 45.1rem
}

.process .grid>.col:nth-child(2) .block:nth-child(1) {
    height: 100%;
    padding: 5rem
}

.process .grid>.col:nth-child(2) .block:nth-child(1) img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .process {
        padding:0 1.2rem 1.2rem;
        position: relative
    }

    .process .grid>.col {
        position: relative
    }

    .process .grid>.col:nth-child(1) .block:nth-child(1) {
        max-width: 14.6rem;
        height: auto;
        -webkit-transform: translateX(-20rem);
        -ms-transform: translateX(-20rem);
        transform: translateX(-20rem);
        position: absolute;
        top: 13rem
    }

    .process .grid>.col:nth-child(1) .block:nth-child(1) .sectionBlock__icon {
        display: none
    }

    .process .grid>.col:nth-child(1) .block:nth-child(2) {
        padding: 0 1.6rem 0 1.6rem;
        margin-bottom: 1.2rem;
        margin-top: 0;
        height: 12rem;
        margin-bottom: 21rem
    }

    .process .grid>.col:nth-child(1) .block:nth-child(2) h2 span:nth-child(1) {
        padding-left: 0
    }

    .process .grid>.col:nth-child(1) .block:nth-child(2) h2 span:nth-child(2) {
        text-align: right;
        border-top: 1px solid #1f00ff
    }

    .process .grid>.col:nth-child(2) {
        position: absolute;
        top: 13.1rem;
        right: 1.2rem;
        max-width: 19.5rem
    }

    .process .grid>.col:nth-child(2) .block:nth-child(1) {
        height: 20rem;
        padding: 2rem
    }

    .process .grid>.col:nth-child(2) .block:nth-child(1) img {
        width: 100%;
        height: 100%;
        -o-object-fit: contain;
        object-fit: contain
    }
}

.steps {
    height: 300vh;
    min-height: 273rem;
    background-color: #1f00ff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-size: 9.44rem 9.44rem;
    position: relative
}

.steps__top {
    height: 5.8rem;
    border-bottom: 1px solid #1f00ff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 2.2rem;
    overflow: hidden
}

.steps__top span {
    display: inline-block;
    position: relative
}

.steps__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 8.8rem;
    max-width: 8.8rem;
    height: 100%;
    border-left: 1px solid #1f00ff;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.steps__icon img {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 3rem;
    -webkit-transform: translate3d(-50%,-50%,0) translateY(-5rem);
    transform: translate3d(-50%,-50%,0) translateY(-5rem);
    -webkit-transition: -webkit-transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s 0s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: transform .6s 0s cubic-bezier(.5,0,.25,1),-webkit-transform .6s 0s cubic-bezier(.5,0,.25,1)
}

.steps__icon img.active {
    -webkit-transform: translate3d(-50%,-50%,0) translateY(0);
    transform: translate3d(-50%,-50%,0) translateY(0)
}

.steps__icon img.active~img {
    -webkit-transform: translate3d(-50%,-50%,0) translateY(5rem);
    transform: translate3d(-50%,-50%,0) translateY(5rem)
}

.steps__sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 91rem
}

.steps canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%!important;
    height: 100%!important
}

.steps__bucket {
    position: absolute;
    z-index: 15;
    max-width: 30%;
    height: auto;
    transition: opacity 0.5s ease;
}

.steps__bucket:first-of-type {
    /* Back part of bucket */
    z-index: 5;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -40%);
}

.steps__bucket:last-of-type {
    /* Front part of bucket */
    z-index: 20;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -40%);
}

/* Make sure the bucket is hidden in step 1 */
.steps[data-car-active="0"] .steps__bucket {
    opacity: 0 !important;
}

/* Show bucket in steps 2 and 3 */
.steps[data-car-active="1"] .steps__bucket,
.steps[data-car-active="2"] .steps__bucket {
    opacity: 1 !important;
}

.steps .block {
    position: absolute;
    top: 3rem;
    left: 1.5rem;
    width: 73rem;
    height: 50.5rem
}

.steps .block .top {
    padding-left: 0
}

.steps .block .top .subheading {
    padding-left: 2.2rem;
    min-width: 21.5rem;
    max-width: 21.5rem;
    border-right: 1px solid #1f00ff;
    height: 100%;
    line-height: 5.8rem
}

.steps__slides {
    position: relative;
    height: 100%
}

.steps__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1
}

.steps__slide .mid {
    height: 19.5rem;
    border-bottom: 1px solid #1f00ff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden
}

.steps__slide .mid span {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

.steps__slide .mid span:first-child {
    font-size: 16rem;
    min-width: 21.5rem;
    max-width: 21.5rem;
    border-right: 1px solid #1f00ff;
    height: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: "PP Right",sans-serif;
    -webkit-transition: -webkit-transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s 0s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: transform .6s 0s cubic-bezier(.5,0,.25,1);
    transition: transform .6s 0s cubic-bezier(.5,0,.25,1),-webkit-transform .6s 0s cubic-bezier(.5,0,.25,1)
}

.steps__slide .mid span:last-child {
    font-size: 7rem;
    line-height: 6rem;
    display: inline-block;
    width: 100%;
    height: 100%;
    font-family: "PP Right",sans-serif;
    text-transform: uppercase;
    padding: 3.6rem 3.3rem;
    -webkit-transition: -webkit-transform .6s 50ms cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s 50ms cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s 50ms cubic-bezier(.5,0,.25,1);
    transition: transform .6s 50ms cubic-bezier(.5,0,.25,1);
    transition: transform .6s 50ms cubic-bezier(.5,0,.25,1),-webkit-transform .6s 50ms cubic-bezier(.5,0,.25,1)
}

.steps__slide .bottom {
    padding: 3.2rem 2.7rem;
    overflow: hidden;
    height: 100%
}

.steps__slide .bottom .subheading {
    font-size: 3rem;
    margin-bottom: 2rem;
    display: block;
    -webkit-transform: translateY(-26rem);
    -ms-transform: translateY(-26rem);
    transform: translateY(-26rem);
    -webkit-transition: -webkit-transform .6s .1s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s .1s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s .1s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .1s cubic-bezier(.5,0,.25,1);
    transition: transform .6s .1s cubic-bezier(.5,0,.25,1),-webkit-transform .6s .1s cubic-bezier(.5,0,.25,1)
}

.steps__slide .bottom .body {
    line-height: 3.5rem;
    -webkit-transform: translateY(-26rem);
    -ms-transform: translateY(-26rem);
    transform: translateY(-26rem);
    -webkit-transition: -webkit-transform .6s 120ms cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s 120ms cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s 120ms cubic-bezier(.5,0,.25,1);
    transition: transform .6s 120ms cubic-bezier(.5,0,.25,1);
    transition: transform .6s 120ms cubic-bezier(.5,0,.25,1),-webkit-transform .6s 120ms cubic-bezier(.5,0,.25,1)
}

.steps__slide.active .mid span {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.steps__slide.active .bottom .body,.steps__slide.active .bottom .subheading {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.steps__slide.active~.steps__slide .mid span {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%)
}

.steps__slide.active~.steps__slide .bottom .body,.steps__slide.active~.steps__slide .bottom .subheading {
    -webkit-transform: translateY(26rem);
    -ms-transform: translateY(26rem);
    transform: translateY(26rem)
}

@media (max-width: 567px){
    .steps canvas{
        height: calc(100% - 4rem) !important;
    }
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .steps {
        overflow:visible;
        height: 300vh;
        min-height: 105rem;
        background-position: -2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem
    }

    .steps__sticky {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        height: 100vh;
        min-height: 35rem
    }

    .steps canvas {
        top: 34rem;
        /* height: calc(100% - 34rem)!important */
    }

    .steps__bucket {
        position: absolute;
        width: 18rem;
        height: auto;
        top: calc(34rem + 50vh - 25rem);
        left: calc(50vw - 9rem);
        -webkit-transition: -webkit-transform cubic-bezier(0,0,0,1) 680ms;
        transition: -webkit-transform cubic-bezier(0,0,0,1) 680ms;
        -o-transition: transform cubic-bezier(0,0,0,1) 680ms;
        transition: transform cubic-bezier(0,0,0,1) 680ms;
        transition: transform cubic-bezier(0,0,0,1) 680ms,-webkit-transform cubic-bezier(0,0,0,1) 680ms
    }

    .steps .block {
        top: 1.2rem;
        left: 1.2rem;
        width: calc(100% - 2.4rem);
        height: 34rem;
        overflow: hidden
    }

    .steps .block .top .subheading {
        padding-left: 1.5rem;
        border-right: none;
        height: 100%
    }

    .steps__slides {
        position: relative;
        height: 100%;
        overflow: hidden
    }

    .steps__slide {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1
    }

    .steps__slide .mid {
        height: 10rem
    }

    .steps__slide .mid span:first-child {
        font-size: 5rem;
        min-width: 8rem;
        max-width: 8rem
    }

    .steps__slide .mid span:last-child {
        font-size: 4rem;
        line-height: 3.5rem;
        padding: 1.6rem 1rem 1.6rem 1.5rem
    }

    .steps__slide .bottom {
        padding: 1.5rem 1.5rem
    }

    .steps__slide .bottom .subheading {
        font-size: 2rem;
        margin-bottom: 1rem
    }

    .steps__slide .bottom .body {
        line-height: 1.25
    }

    .steps__slide.active .mid span {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }

    .steps__slide.active .bottom .body,.steps__slide.active .bottom .subheading {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }

    .steps__slide.active~.steps__slide .mid span {
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%)
    }

    .steps__slide.active~.steps__slide .bottom .body,.steps__slide.active~.steps__slide .bottom .subheading {
        -webkit-transform: translateY(26rem);
        -ms-transform: translateY(26rem);
        transform: translateY(26rem)
    }
}

.love {
    background-color: #ececec;
    overflow: hidden;
    position: relative
}

.love .sectionCounter {
    top: 15rem;
    right: 9.6rem
}

.love__canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.love__main {
    position: relative;
    min-height: 140rem;
    height: 100%;
    padding-bottom: 30rem
}

.love__content {
    color: #1f00ff;
    padding-top: 18.7rem;
    padding-left: 9rem;
    position: relative
}

.love__content h2 {
    line-height: .85;
    margin-bottom: 7.4rem
}

.love__content h2 .h-line:last-child .h-word:last-child {
    position: relative;
    z-index: 1
}

.love__content h2 .h-line:last-child .h-word:last-child::before {
    content: "";
    position: absolute;
    top: 0;
    left: -.05em;
    width: calc(100% + .1em);
    height: calc(100% + 0em);
    background-color: #fff;
    z-index: -1;
    border-radius: 1rem
}

.love__content .subheading {
    font-size: 5rem;
    line-height: 5.5rem;
    display: block
}

.love__blockWrap {
    position: absolute;
    bottom: 49.2rem;
    right: 9.4rem;
    width: 37.9rem
}

.love__banners {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30.9rem
}

.love .block {
    -webkit-transform: translateX(46rem);
    -ms-transform: translateX(46rem);
    transform: translateX(46rem)
}

.love .block.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.love .block:not(.in) .sectionBlock__top {
    -webkit-transform: translateY(21rem);
    -ms-transform: translateY(21rem);
    transform: translateY(21rem)
}

.heart {
    position: absolute;
    width: 10rem;
    margin-top: -5rem;
    margin-left: -5rem
}

.heart img {
    width: 100%
}

.heart.init {
    opacity: 0
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .love .sectionCounter {
        top:7.05rem;
        right: 1.2rem
    }

    .love__main {
        height: auto;
        min-height: 0;
        padding: 0 1.2rem 7rem
    }

    .love__content {
        padding: 17rem .5rem 5rem;
        position: relative
    }

    .love__content .h1 {
        margin-bottom: 3rem
    }

    .love__content .subheading {
        font-size: 2.5rem;
        line-height: 1
    }

    .love__blockWrap {
        position: static;
        width: 100%
    }

    .love .block {
        -webkit-transform: translateX(46rem);
        -ms-transform: translateX(46rem);
        transform: translateX(46rem)
    }

    .love .block.in {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
    }

    .love .block:not(.in) .sectionBlock__top {
        -webkit-transform: translateY(21rem);
        -ms-transform: translateY(21rem);
        transform: translateY(21rem)
    }

    .love__banners {
        display: none
    }

    .heart {
        width: 8rem;
        margin-top: -4rem;
        margin-left: -4rem
    }
}

.stats {
    background-color: #1f00ff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-size: 9.44rem 9.44rem;
    padding: 15rem 1.5rem 15rem;
    position: relative;
    overflow: hidden
}

.stats__top {
    height: 63rem;
    margin: 0 7.94rem 15rem
}

.stats__top ul {
    padding-left: 1em;
    font-size: 2.2rem
}

.stats__top ul li {
    position: relative;
    list-style: none;
    margin-bottom: 1.5rem
}

.stats__top ul li::before {
    content: "";
    display: inline-block;
    background-image: url(/images/star-circle.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: .5em;
    width: .5em;
    position: absolute;
    left: -1em;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.stats .sectionBlock {
    width: 35.8rem;
    margin: 6rem 0 4rem
}

.stats__number {
    position: absolute;
    left: 65.1rem;
    top: 30rem;
    font-size: 55rem;
    line-height: 1;
    font-family: "PP Right",sans-serif;
    letter-spacing: .02em
}

.stats__number .plus {
    font-weight: 300;
    font-family: Archivo,sans-serif;
    font-size: 35rem;
    line-height: .5;
    vertical-align: middle;
    padding-bottom: 15rem;
    display: inline-block
}

.stats__bottom .block {
    padding: 3rem 0 2.7rem 6.7rem
}

.stats__bottom .block .top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 6.3rem;
    font-size: 4rem;
    letter-spacing: .02em;
    margin-bottom: 3rem
}

.stats__bottom .block .top img {
    margin-left: 2rem;
    height: 6.3rem
}

.stats__bottom .block .subheading {
    margin-bottom: 1.2rem;
    display: block
}

.stats__bottom .dollars {
    margin-top: 3.5rem;
    line-height: 1;
    display: block
}

.stats__bottom .dollars span:nth-child(1) {
    font-size: 10rem;
    font-family: "PP Right",sans-serif;
    vertical-align: top;
    margin-top: 1rem;
    margin-right: 1rem;
    display: inline-block
}

.stats__bottom .dollars span:nth-child(2) {
    font-size: 21rem;
    letter-spacing: .02em;
    font-family: "PP Right",sans-serif
}

.stats__bottom .dollars span:nth-child(3) {
    font-size: 10rem;
    font-family: "PP Right",sans-serif;
    vertical-align: top;
    margin-top: 1rem;
    margin-right: 1rem;
    display: inline-block
}

.stats__graph {
    position: absolute;
    bottom: 6.3rem;
    left: 6rem;
    height: 28rem;
    width: calc(100% - 12rem)
}

.stats__graphLine {
    width: 100%;
    position: absolute;
    border-top: 1px dashed rgba(33,33,33,.1)
}

.stats__graphLine:nth-child(1) {
    bottom: 0
}

.stats__graphLine:nth-child(2) {
    bottom: 9.8rem
}

.stats__graphLine:nth-child(3) {
    bottom: 19.6rem
}

.stats__graph>img {
    position: absolute;
    height: 17rem;
    bottom: -5.4rem;
    right: 13rem
}

.stats__graphInner {
    position: absolute;
    right: 0;
    bottom: -1px;
    height: 100%;
    overflow: hidden;
    mix-blend-mode: multiply
}

.stats__graphInner::after {
    content: "";
    background: #fff;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right
}

.stats__graphInner img {
    height: 100%
}

.stats__graphBubble {
    position: absolute;
    top: -1rem;
    right: 2rem;
    height: 3.3rem;
    width: 9rem;
    background: url(/images/graph-bubble.svg) no-repeat right;
    background-size: contain;
    opacity: 0;
    -webkit-transform: translateX(1.5rem);
    -ms-transform: translateX(1.5rem);
    transform: translateX(1.5rem)
}

.stats__graphBubble span:first-child {
    font-size: 2.4rem;
    text-align: right;
    line-height: 3.2rem;
    padding-left: .85rem
}

.stats__graphBubble span:first-child:after {
    content: "%";
    font-size: .5em;
    line-height: 1
}

.stats__graphBubble span:last-child {
    position: absolute;
    text-transform: uppercase;
    top: 110%;
    left: 1.7rem;
    font-size: 1rem;
    letter-spacing: .01em
}

.stats__graph.in .stats__graphInner:after {
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform 2s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform 2s cubic-bezier(.5,0,.25,1);
    -o-transition: transform 2s cubic-bezier(.5,0,.25,1);
    transition: transform 2s cubic-bezier(.5,0,.25,1);
    transition: transform 2s cubic-bezier(.5,0,.25,1),-webkit-transform 2s cubic-bezier(.5,0,.25,1)
}

.stats__graph.in .stats__graphBubble {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity .3s 1.8s ease-in-out,-webkit-transform .5s 1.8s cubic-bezier(.5,0,.25,1);
    transition: opacity .3s 1.8s ease-in-out,-webkit-transform .5s 1.8s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .5s 1.8s cubic-bezier(.5,0,.25,1),opacity .3s 1.8s ease-in-out;
    transition: transform .5s 1.8s cubic-bezier(.5,0,.25,1),opacity .3s 1.8s ease-in-out;
    transition: transform .5s 1.8s cubic-bezier(.5,0,.25,1),opacity .3s 1.8s ease-in-out,-webkit-transform .5s 1.8s cubic-bezier(.5,0,.25,1)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .stats {
        background-position:-2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem;
        padding: 6.345rem 1.2rem 6.345rem
    }

    .stats__top {
        height: auto;
        margin: 0 0 5rem
    }

    .stats .sectionBlock {
        width: 100%;
        margin: 0 0 4rem
    }

    .stats__number {
        position: static;
        font-size: 24rem;
        letter-spacing: -.02em
    }

    .stats__number .plus {
        font-size: 16rem;
        padding-bottom: 8rem
    }

    .stats__bottom .block {
        padding: 2.5rem 1.8rem
    }

    .stats__bottom .block .top {
        line-height: 1;
        font-size: 3rem;
        margin-bottom: 3rem
    }

    .stats__bottom .block .top img {
        height: 5.3rem
    }

    .stats__bottom .dollars {
        margin-top: 2.5rem;
        margin-bottom: 3rem
    }

    .stats__bottom .dollars span:nth-child(1) {
        font-size: 4rem;
        margin-right: .5rem
    }

    .stats__bottom .dollars span:nth-child(2) {
        font-size: 8rem;
        letter-spacing: 0
    }

    .stats__bottom .dollars span:nth-child(3) {
        font-size: 4rem;
        margin-right: 0;
        margin-left: .5rem
    }

    .stats__graph {
        position: relative;
        left: 0;
        bottom: 0;
        height: 20rem;
        width: 100%;
        margin-bottom: 3rem
    }

    .stats__graphLine:nth-child(2) {
        bottom: 5.8rem
    }

    .stats__graphLine:nth-child(3) {
        bottom: 11.6rem
    }

    .stats__graph>img {
        position: absolute;
        height: 16rem;
        bottom: -5rem;
        right: 1rem
    }

    .stats__graphBubble {
        top: -1rem;
        right: 1.5rem;
        height: 2.8rem;
        width: 7rem;
        -webkit-transform: translateX(1rem);
        -ms-transform: translateX(1rem);
        transform: translateX(1rem)
    }

    .stats__graphBubble span:first-child {
        font-size: 1.8rem;
        text-align: right;
        line-height: 2.7rem;
        padding-left: .5rem
    }

    .stats__graphBubble span:last-child {
        top: 105%;
        left: .5rem
    }
}

.people {
    padding: 20rem 1.5rem 15rem;
    overflow: hidden
}

.people__top {
    margin-bottom: 6rem
}

.people__top>.col:nth-child(1) {
    max-width: 35.6rem
}

.people__top>.col:nth-child(1) .block {
    -webkit-transform: translateX(-38rem);
    -ms-transform: translateX(-38rem);
    transform: translateX(-38rem)
}

.people__top>.col:nth-child(1) .block.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.people__top>.col:nth-child(2) .block:nth-child(1) {
    height: 31.5rem;
    padding-left: 3.5rem
}

.people__top>.col:nth-child(2) .block:nth-child(1) h2 {
    line-height: 1.1
}

.people__top>.col:nth-child(2) .block:nth-child(1) h2 span {
    display: block;
    position: relative
}

.people__top>.col:nth-child(2) .block:nth-child(1) h2 span:nth-child(1) {
    padding-left: 3.1rem
}

.people__top>.col:nth-child(2) .block:nth-child(1) h2 span:nth-child(2) {
    text-align: right;
    border-top: 1px solid #1f00ff;
    padding-right: 2rem
}

.people__top>.col:nth-child(2) .block:nth-child(1) h2 .sectionCounter {
    position: absolute;
    top: -1px;
    left: 0
}

.people__slider {
    height: 77.1rem;
    margin-bottom: 20rem;
    position: relative
}

.people__slides {
    width: 111.1rem;
    height: 81.1rem;
    counter-reset: testimonial
}

.people__slide {
    width: 111.1rem;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0!important;
    -webkit-transform: translate3d(-130rem,0,0);
    transform: translate3d(-130rem,0,0);
    -webkit-transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .4s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .4s cubic-bezier(.5,0,.25,1);
    transition: transform .4s cubic-bezier(.5,0,.25,1);
    transition: transform .4s cubic-bezier(.5,0,.25,1),-webkit-transform .4s cubic-bezier(.5,0,.25,1)
}

.people__slide.active {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.people__slide.active+.people__slide {
    -webkit-transform: translate3d(2rem,6.3rem,0);
    transform: translate3d(2rem,6.3rem,0)
}

.people__slide.active+.people__slide+.people__slide {
    -webkit-transform: translate3d(4rem,12.6rem,0);
    transform: translate3d(4rem,12.6rem,0)
}

.people__slide:nth-child(1) {
    z-index: 9
}

.people__slide:nth-child(2) {
    z-index: 8
}

.people__slide:nth-child(3) {
    z-index: 7
}

.people__slide:nth-child(4) {
    z-index: 6
}

.people__slide:nth-child(5) {
    z-index: 5
}

.people__slide:nth-child(6) {
    z-index: 4
}

.people__slide:nth-child(7) {
    z-index: 3
}

.people__slide:nth-child(8) {
    z-index: 2
}

.people__slide:nth-child(9) {
    z-index: 1
}

.people__slide:nth-child(10) {
    z-index: 0
}

.people__nav {
    position: absolute;
    top: 0;
    right: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.people__navButton {
    margin-left: 1.2rem;
    width: 8rem;
    height: 8rem;
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
    border-radius: .5rem;
    background-color: #1f00ff;
    overflow: hidden
}

.people__navButton img {
    width: 3.2rem;
    position: relative;
    z-index: 1
}

.people__navButton:first-child {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1)
}

.people__navButton::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #212121;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    -ms-transform-origin: left;
    transform-origin: left;
    opacity: 0;
    -webkit-transition: opacity .2s ease-in-out,-webkit-transform 1ms .2s;
    transition: opacity .2s ease-in-out,-webkit-transform 1ms .2s;
    -o-transition: opacity .2s ease-in-out,transform 1ms .2s;
    transition: opacity .2s ease-in-out,transform 1ms .2s;
    transition: opacity .2s ease-in-out,transform 1ms .2s,-webkit-transform 1ms .2s
}

.people__navButton:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0) translateX(-6rem);
    transform: translate3d(-50%,-50%,0) translateX(-6rem);
    width: 3.2rem;
    height: 3.2rem;
    background: url(/images/arrow-right.svg) center no-repeat;
    background-size: contain
}

@media (hover: hover) {
    .people__navButton:hover::before {
        opacity:1;
        -webkit-transform-origin: right;
        -ms-transform-origin: right;
        transform-origin: right;
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
    }

    .people__navButton:hover img {
        -webkit-transform: translateX(6rem);
        -ms-transform: translateX(6rem);
        transform: translateX(6rem);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
    }

    .people__navButton:hover:after {
        -webkit-transform: translate3d(-50%,-50%,0) translateX(0);
        transform: translate3d(-50%,-50%,0) translateX(0);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
    }
}

.people__slider.first-slide .people__navButton:first-child,.people__slider.last-slide .people__navButton:last-child {
    pointer-events: none;
    background-color: #afa9dc
}

.people__bottom {
    height: 24.4rem;
    margin: -1.5rem
}

.people__clients {
    position: relative;
    height: 11.6rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.people__clients:first-child {
    margin-bottom: 1.2rem
}

.people__clientRail {
    white-space: nowrap;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 0
}

.people__client {
    display: inline-block;
    width: 29.4rem;
    height: 11.6rem;
    margin: 0 1.2rem!important;
    position: relative
}

.people__client img {
    position: absolute;
    height: 12rem;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0)
}

.testimonial {
    padding: 3rem 3rem 2.5rem;
    counter-increment: testimonial
}

.testimonial__top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 41rem;
    border-bottom: 1px solid #1f00ff
}

.testimonial__image {
    min-width: 28.6rem;
    max-width: 28.6rem;
    border-right: 1px solid #1f00ff
}

.testimonial__image img {
    width: 25.5rem;
    height: 38rem
}

.testimonial__main {
    height: 38.2rem;
    width: 73.1rem;
    background-color: #1f00ff;
    border-radius: .5rem;
    color: #fff;
    padding: 4rem 6rem 2.7rem;
    position: relative
}

.testimonial__quote {
    font-size: 4rem;
    line-height: 4.5rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif
}

.testimonial__quote::before {
    display: inline-block;
    margin-left: -.5em;
    margin-right: .1em;
    content: open-quote
}

.testimonial__quote::after {
    content: close-quote;
    display: inline-block;
    margin-left: .1em
}

.testimonial__author {
    position: absolute;
    bottom: 0;
    padding-bottom: 2.7rem;
    height: 9.4rem;
    left: 6rem;
    width: calc(100% - 8rem);
    border-top: 1px solid rgba(211,211,211,.3);
    padding-top: 1.5rem
}

.testimonial__author>span {
    color: #d3d3d3;
    display: block
}

.testimonial__author>span:nth-child(1) {
    font-family: "PP Right",sans-serif;
    font-size: 2rem;
    line-height: 2.4rem
}

.testimonial__author>span:nth-child(1) span {
    font-size: 1.3rem;
    letter-spacing: .05em
}

.testimonial__author>span:nth-child(2) {
    font-size: 1.2rem;
    text-transform: uppercase;
    line-height: 2.4rem;
    letter-spacing: .05em
}

.testimonial__author img {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 1rem;
    height: 4.7rem
}

.testimonial__mid {
    padding: 1.2rem 0 2.4rem 31.8rem;
    border-bottom: 1px solid #1f00ff;
    position: relative;
    height: 17.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 5rem
}

.testimonial__mid .subheading {
    position: absolute;
    top: 2rem;
    left: 0;
    font-size: 2rem
}

.testimonial__result {
    min-width: 20rem;
    max-width: 20rem
}

.testimonial__result p:first-child {
    font-size: 9.5rem;
    font-family: "PP Right",sans-serif;
    letter-spacing: .02em
}

.testimonial__result p:first-child span {
    font-size: 6.5rem
}

.testimonial__result p:last-child {
    font-size: 1.8rem;
    line-height: 2.2rem
}

.testimonial__bottom {
    padding-top: 2rem
}

.testimonial__bottom .subheading {
    font-size: 2rem
}

.testimonial__bottom .subheading::after {
    content: ": 00" counter(testimonial)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .people {
        padding:21.15rem 1.2rem 16rem;
        position: relative
    }

    .people .sectionCounter {
        left: auto;
        right: 1.2rem;
        top: 7.05rem
    }

    .people__top {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 3rem
    }

    .people__top>.col:nth-child(1) {
        max-width: 24rem;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    .people__top>.col:nth-child(2) .block:nth-child(1) {
        height: 12.5rem;
        padding-left: 1.3rem
    }

    .people__top>.col:nth-child(2) .block:nth-child(1) h2 {
        line-height: 1.1
    }

    .people__top>.col:nth-child(2) .block:nth-child(1) h2 span:nth-child(1) {
        padding-left: 0
    }

    .people__top>.col:nth-child(2) .block:nth-child(1) h2 span:nth-child(2) {
        padding-right: 0;
        text-align: left
    }

    .people__slider {
        height: 56rem;
        margin-bottom: 8rem
    }

    .people__slides {
        width: calc(100% - 2.4rem);
        height: 53rem;
        counter-reset: testimonial
    }

    .people__slide {
        width: 100%;
        height: 53rem;
        -webkit-transform: translate3d(-100vw,0,0);
        transform: translate3d(-100vw,0,0)
    }

    .people__slide.active {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    .people__slide.active+.people__slide {
        -webkit-transform: translate3d(0,1rem,0);
        transform: translate3d(0,1rem,0)
    }

    .people__slide.active+.people__slide+.people__slide {
        -webkit-transform: translate3d(0,2rem,0);
        transform: translate3d(0,2rem,0)
    }

    .people__nav {
        position: absolute;
        top: -7.5rem;
        right: 0;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        z-index: 100
    }

    .people__navButton {
        margin-left: .5rem;
        width: 4.5rem;
        height: 4.5rem
    }

    .people__navButton img {
        width: 1.5rem
    }

    .people__bottom {
        height: 15rem;
        margin: 0
    }

    .people__clients {
        height: 7rem
    }

    .people__clients:first-child {
        margin-bottom: 1rem
    }

    .people__client {
        width: 18rem;
        height: 7rem;
        margin: 0 1rem!important
    }

    .people__client img {
        height: 7rem
    }

    .testimonial {
        padding: 1.5rem
    }

    .testimonial__top {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        height: 32rem;
        border-bottom: none
    }

    .testimonial__image {
        min-width: 9rem;
        max-width: 9rem;
        border: none;
        position: absolute;
        top: 3rem;
        left: 3rem;
        z-index: 2
    }

    .testimonial__image img {
        width: 9rem;
        height: 13rem;
        border-radius: .5rem
    }

    .testimonial__main {
        height: 32rem;
        width: 100%;
        padding: 16rem 1rem 1.5rem 2rem
    }

    .testimonial__quote {
        font-size: 2rem;
        line-height: 2.4rem;
        border-top: 1px solid rgba(255,255,255,.5);
        padding-top: 1rem
    }

    .testimonial__quote::after,.testimonial__quote::before {
        display: none
    }

    .testimonial__author {
        position: absolute;
        bottom: auto;
        top: 1.5rem;
        left: 12rem;
        padding-bottom: 0;
        height: 13rem;
        width: calc(100% - 13rem);
        border-top: none;
        padding-top: .5rem;
        border-left: 1px solid rgba(255,255,255,.5);
        padding-left: 1.5rem
    }

    .testimonial__author>span:nth-child(2) {
        font-size: 1rem;
        text-transform: uppercase;
        line-height: 1.2
    }

    .testimonial__author img {
        position: absolute;
        top: 100%;
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transform: translateY(-100%);
        right: auto;
        left: 1rem;
        height: 4rem
    }

    .testimonial__mid {
        padding: 2rem 2rem 1rem;
        border-bottom: 1px solid #1f00ff;
        position: relative;
        height: 15rem
    }

    .testimonial__mid .subheading {
        display: none
    }

    .testimonial__result {
        min-width: 12rem;
        max-width: 12rem
    }

    .testimonial__result:nth-child(4) {
        display: none
    }

    .testimonial__result p:first-child {
        font-size: 5rem
    }

    .testimonial__result p:first-child span {
        font-size: 3rem
    }

    .testimonial__result p:last-child {
        font-size: 1.5rem;
        line-height: 1.15
    }

    .testimonial__bottom {
        padding-top: 1rem
    }

    .testimonial__bottom .subheading {
        font-size: 2rem
    }

    .testimonial__bottom .subheading::after {
        content: ": 00" counter(testimonial)
    }
}

.team {
    color: #1f00ff;
    padding-bottom: 35rem
}

.team__top {
    position: relative;
    padding: 0 9.5rem;
    margin-bottom: 1.25rem;
    padding-top: 7.8rem
}

.team__top .sectionCounter {
    position: absolute;
    top: 9.44rem;
    right: 9.5rem
}

.team__top .body {
    margin-top: 7rem;
    width: 56rem
}

.team__bottom {
    padding: 0 3.5rem;
    position: relative
}

.team__bottom .sectionBlock {
    position: absolute;
    top: 19rem;
    left: 3.5rem;
    width: 35.8rem;
    margin-top: 0!important;
    -webkit-transform: translateX(-40rem);
    -ms-transform: translateX(-40rem);
    transform: translateX(-40rem)
}

.team__bottom .sectionBlock.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.team__cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 1.7rem 1.5rem
}

.teamCard {
    min-width: 47rem;
    max-width: 47rem;
    height: 66.5rem;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    padding: 2.7rem
}

.teamCard:nth-child(3n-1) {
    -webkit-transform: translateY(17.8rem);
    -ms-transform: translateY(17.8rem);
    transform: translateY(17.8rem)
}

.teamCard:nth-child(3n-1):last-child {
    margin-bottom: 17.8rem!important
}

.teamCard:nth-child(3n-3) {
    -webkit-transform: translateY(36rem);
    -ms-transform: translateY(36rem);
    transform: translateY(36rem)
}

.teamCard:nth-child(3n-3):last-child {
    margin-bottom: 36rem!important
}

.teamCard__image {
    width: 31.8rem;
    height: 41.6rem;
    -webkit-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
    -webkit-transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1),-webkit-transform .6s cubic-bezier(.5,0,.25,1)
}

.teamCard__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 1rem;
    -webkit-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
    -webkit-transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1),-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    position: relative
}

.teamCard__frontContent {
    -webkit-transition: opacity .3s .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    transition: opacity .3s .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s .3s linear;
    transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s .3s linear;
    transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    margin-top: 2.3rem
}

.teamCard__frontContent .subheading {
    font-size: 3.2rem;
    display: block;
    margin-bottom: 1.2rem
}

.teamCard__backContent {
    -webkit-transition: opacity .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    transition: opacity .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s linear;
    transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s linear;
    transition: transform .6s cubic-bezier(.5,0,.25,1),opacity .3s linear,-webkit-transform .6s cubic-bezier(.5,0,.25,1);
    width: 35.8rem;
    position: absolute;
    top: 19.8rem;
    left: 8rem;
    opacity: 0;
    -webkit-transform: translateY(30rem);
    -ms-transform: translateY(30rem);
    transform: translateY(30rem)
}

.teamCard__backContent .body {
    line-height: 3.5rem
}

.teamCard__side {
    position: absolute;
    width: 4.5rem;
    height: calc(100% + 11rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    top: 2.7rem;
    -webkit-transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .6s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1);
    transition: transform .6s cubic-bezier(.5,0,.25,1),-webkit-transform .6s cubic-bezier(.5,0,.25,1)
}

.teamCard__side img:first-child {
    width: 3rem
}

.teamCard__side img:last-child {
    width: 4.5rem
}

.teamCard__side:first-child {
    left: 2.7rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transform: translateY(-16rem);
    -ms-transform: translateY(-16rem);
    transform: translateY(-16rem)
}

.teamCard__side:last-child {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    right: 2.7rem
}

.teamCard__side:last-child img:last-child {
    -webkit-transform: scaleX(-1) scaleY(-1);
    -ms-transform: scaleX(-1) scaleY(-1);
    transform: scaleX(-1) scaleY(-1)
}

.teamCard.flip .teamCard__image {
    -webkit-transform: translateX(9.5rem);
    -ms-transform: translateX(9.5rem);
    transform: translateX(9.5rem)
}

.teamCard.flip .teamCard__image img {
    -webkit-transform: scale(.25);
    -ms-transform: scale(.25);
    transform: scale(.25)
}

.teamCard.flip .teamCard__frontContent {
    -webkit-transform: translateY(-20rem);
    -ms-transform: translateY(-20rem);
    transform: translateY(-20rem);
    opacity: 0;
    -webkit-transition: opacity .3s linear,-webkit-transform .3s ease-in;
    transition: opacity .3s linear,-webkit-transform .3s ease-in;
    -o-transition: transform .3s ease-in,opacity .3s linear;
    transition: transform .3s ease-in,opacity .3s linear;
    transition: transform .3s ease-in,opacity .3s linear,-webkit-transform .3s ease-in
}

.teamCard.flip .teamCard__backContent {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    -webkit-transition: opacity .3s 120ms linear,-webkit-transform .6s 120ms cubic-bezier(0,0,0,1);
    transition: opacity .3s 120ms linear,-webkit-transform .6s 120ms cubic-bezier(0,0,0,1);
    -o-transition: transform .6s 120ms cubic-bezier(0,0,0,1),opacity .3s 120ms linear;
    transition: transform .6s 120ms cubic-bezier(0,0,0,1),opacity .3s 120ms linear;
    transition: transform .6s 120ms cubic-bezier(0,0,0,1),opacity .3s 120ms linear,-webkit-transform .6s 120ms cubic-bezier(0,0,0,1)
}

.teamCard.flip .teamCard__side:first-child {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.teamCard.flip .teamCard__side:last-child {
    -webkit-transform: translateY(-16rem);
    -ms-transform: translateY(-16rem);
    transform: translateY(-16rem)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .team {
        padding-bottom:8rem
    }

    .team__top {
        padding: 0 2.5rem;
        margin-bottom: 6rem
    }

    .team__top .sectionCounter {
        display: none
    }

    .team__top .body {
        margin-top: 2rem;
        width: 100%
    }

    .team__bottom {
        padding: 0 1.2rem
    }

    .team__bottom .sectionBlock {
        position: static;
        width: 100%;
        margin-top: 1.2rem;
        display: none
    }

    .team__cards {
        gap: 1.2rem
    }

    .teamCard {
        min-width: 100%;
        max-width: 100%;
        height: 48rem;
        -webkit-transform: none!important;
        -ms-transform: none!important;
        transform: none!important;
        margin: 0!important;
        padding: 2rem
    }

    .teamCard__image {
        width: 23rem;
        height: 31rem
    }

    .teamCard__frontContent {
        margin-top: 2rem
    }

    .teamCard__frontContent .subheading {
        font-size: 3rem;
        margin-bottom: 1rem
    }

    .teamCard__backContent {
        width: calc(100% - 4rem);
        top: 14rem;
        left: 2rem
    }

    .teamCard__backContent .body {
        line-height: 1.5;
        font-size: 1.8rem
    }

    .teamCard__side {
        position: absolute;
        width: 3rem;
        height: calc(100% + 10rem);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        top: 2rem
    }

    .teamCard__side img:first-child {
        width: 2.5rem
    }

    .teamCard__side img:last-child {
        width: 3rem
    }

    .teamCard__side:first-child {
        left: 2rem;
        -webkit-transform: translateY(-14rem);
        -ms-transform: translateY(-14rem);
        transform: translateY(-14rem)
    }

    .teamCard__side:last-child {
        right: 2rem
    }

    .teamCard.flip .teamCard__image {
        -webkit-transform: translateX(8rem);
        -ms-transform: translateX(8rem);
        transform: translateX(8rem)
    }

    .teamCard.flip .teamCard__image img {
        -webkit-transform: scale(.3);
        -ms-transform: scale(.3);
        transform: scale(.3)
    }

    .teamCard.flip .teamCard__side:last-child {
        -webkit-transform: translateY(-14rem);
        -ms-transform: translateY(-14rem);
        transform: translateY(-14rem)
    }
}

.products {
    color: #1f00ff;
    background-color: #fff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-blend-mode: difference;
    background-size: 9.44rem 9.44rem;
    position: relative;
    padding: 22.8rem 0 10rem
}

.products h2 {
    margin-left: 4.8rem
}

.products .sectionCounter {
    top: 18.8rem;
    right: 9.5rem
}

.products__plans {
    position: relative;
    margin-top: 8rem;
    padding-bottom: 20rem
}

.products__plans .sectionBlock {
    position: absolute;
    left: 4.7rem;
    top: 0;
    width: 26.4rem;
    -webkit-transform: translateX(-35rem);
    -ms-transform: translateX(-35rem);
    transform: translateX(-35rem)
}

.products__plans .sectionBlock__icon {
    min-width: 5.5rem
}

.products__plans .sectionBlock.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.products__sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 2rem;
    width: 111.5rem;
    margin-left: 37.7rem;
    z-index: 2
}

.products__stickyInner {
    will-change: height;
    -webkit-transition: height .4s cubic-bezier(.5,0,.25,1);
    -o-transition: height .4s cubic-bezier(.5,0,.25,1);
    transition: height .4s cubic-bezier(.5,0,.25,1);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.products__productHeader {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: -1px 0;
    padding: 3rem 3.2rem 3rem;
    height: calc(100% + 2px)
}

.products__productHeader:nth-child(2) {
    border: 1px solid #1f00ff;
    border-radius: .5rem;
    background-color: #f2f2f2
}

.products__productHeader h3 {
    font-size: 5rem;
    line-height: 4.5rem;
    letter-spacing: .02em;
    width: 1rem;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    margin-bottom: 2.5rem;
    -webkit-transition: -webkit-transform .5s cubic-bezier(0,0,0,1);
    transition: -webkit-transform .5s cubic-bezier(0,0,0,1);
    -o-transition: transform .5s cubic-bezier(0,0,0,1);
    transition: transform .5s cubic-bezier(0,0,0,1);
    transition: transform .5s cubic-bezier(0,0,0,1),-webkit-transform .5s cubic-bezier(0,0,0,1)
}

.products__productHeader p {
    position: relative;
    padding: 1.3rem 0;
    font-size: 1.4rem;
    line-height: 1.5rem;
    -webkit-transition: -webkit-transform .6s cubic-bezier(0,0,0,1);
    transition: -webkit-transform .6s cubic-bezier(0,0,0,1);
    -o-transition: transform .6s cubic-bezier(0,0,0,1);
    transition: transform .6s cubic-bezier(0,0,0,1);
    transition: transform .6s cubic-bezier(0,0,0,1),-webkit-transform .6s cubic-bezier(0,0,0,1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.products__productHeader p:nth-child(2) {
    border-top: 1px solid #d3d3d3
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .products__productHeader p {
        border-bottom:1px solid #d3d3d3
    }
}

.products__productHeader .button {
    margin-top: 1rem
}

.products__features {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 5rem;
    padding: 3rem 0;
    margin-bottom: 0
}

.products__featureCols {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1.7rem;
    padding: 0 1.8rem
}

.products__featureCols div {
    background-color: #f2f2f2;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 1rem
}

.products__featureCols div:first-child {
    background-color: #f8f8f8;
    max-width: 34.3rem
}

.products__feature {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 0 3rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 8rem;
    position: relative
}

.products__feature div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 33rem;
    max-width: 33rem;
    height: 100%;
    padding: 0 4rem;
    text-align: center;
    border-bottom: 1px solid #fff
}

.products__feature div .body {
    font-size: 1.4rem;
    line-height: 1.4rem
}

.products__feature div img {
    width: 2.5rem
}

.products__feature div img+.body {
    margin-top: .8rem
}

.products__feature div:first-child {
    text-align: left;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    min-width: 28rem;
    max-width: 28rem;
    padding: 0 4rem;
    margin-right: 3.7rem;
    border-bottom: 1px solid rgba(211,211,211,.3)
}

.products__feature div:first-child .body {
    font-size: 1.8rem;
    line-height: 2rem
}

.products__feature:last-child div {
    border-bottom: none
}

.products__mobile {
    display: none
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .products {
        height:auto!important;
        background-position: -2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem;
        padding: 21.15rem 1.2rem .65rem
    }

    .products h2 {
        margin-left: 0
    }

    .products .sectionCounter {
        top: 7.05rem;
        right: 1.2rem
    }

    .products__plans {
        margin-top: 2.5rem
    }

    .products__plans .sectionBlock {
        position: relative;
        left: 0;
        top: 0;
        width: 29rem
    }

    .products__features,.products__sticky {
        display: none
    }

    .products__mobile {
        display: block
    }

    .products__productAccordion {
        border: 1px solid #1f00ff;
        border-radius: .5rem;
        background-color: #fff;
        margin-top: 1.2rem;
        position: relative
    }

    .products__productAccordion h3 {
        font-size: 4rem;
        line-height: 3.5rem
    }

    .products__productAccordion .accordion__heading {
        padding: 5rem 2.5rem 1rem
    }

    .products__productAccordion .button {
        width: calc(100% - 5rem);
        margin: 1.2rem 2.5rem
    }

    .products__productAccordion .accordion__inner {
        padding: 0 2.5rem
    }

    .products__productAccordion .accordion__inner .products__feature {
        padding: 1.5rem 0;
        border-bottom: 1px solid #d3d3d3;
        height: auto;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .products__productAccordion .accordion__inner .products__feature>div {
        border: none
    }

    .products__productAccordion .accordion__inner .products__feature>div .body {
        font-size: 1.5rem;
        line-height: 1.15
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(1) {
        min-width: 24rem;
        max-width: 24rem;
        margin: 0;
        padding: 0
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(1) .body {
        font-size: 1.8rem
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(2) {
        padding: 0;
        margin: 0;
        min-width: 4rem;
        max-width: 4rem;
        text-align: left
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(2).desc {
        min-width: 100%;
        max-width: 100%;
        padding-top: 1.5rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(2).desc img {
        width: 1.6rem;
        height: 1.6rem;
        margin-right: .8rem;
        margin-bottom: -.8rem
    }

    .products__productAccordion .accordion__inner .products__feature>div:nth-child(2).desc .body {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        width: 100%;
        padding-right: 4rem
    }

    .products__productAccordionIcon {
        position: absolute;
        top: 0;
        right: 0;
        width: 5rem;
        height: 5rem;
        border-bottom: 1px solid #1f00ff;
        border-left: 1px solid #1f00ff;
        border-bottom-left-radius: .75rem
    }

    .products__productAccordionIcon::after,.products__productAccordionIcon::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 2.5rem;
        height: 1px;
        background-color: #1f00ff;
        -webkit-transform: translate3d(-50%,-50%,0);
        transform: translate3d(-50%,-50%,0);
        -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
        -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1);
        transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
    }

    .products__productAccordionIcon::before {
        -webkit-transform: translate3d(-50%,-50%,0) rotate(90deg);
        transform: translate3d(-50%,-50%,0) rotate(90deg)
    }

    .accordion--expanded .products__productAccordionIcon::before {
        -webkit-transform: translate3d(-50%,-50%,0) rotate(-45deg);
        transform: translate3d(-50%,-50%,0) rotate(-45deg)
    }

    .accordion--expanded .products__productAccordionIcon::after {
        -webkit-transform: translate3d(-50%,-50%,0) rotate(45deg);
        transform: translate3d(-50%,-50%,0) rotate(45deg)
    }
}

.faqs {
    color: #1f00ff;
    padding: 23rem 0 9rem;
    position: relative;
    overflow: hidden;
    height: auto!important
}

.faqs h2 {
    margin-left: 9rem;
    margin-bottom: 16.9rem
}

.faqs--block {
    background-color: #f2f2f2;
    padding: 15rem 0
}

.faqs--block h2 {
    text-align: center;
    margin: 0 auto 10rem;
    width: 130rem
}

.faqs .sectionCounter {
    top: 19rem;
    right: 9.5rem
}

.faqs__inner {
    width: 113.4rem;
    margin-left: 18.9rem;
    margin-bottom: 1.7rem;
    counter-reset: faq
}

.faqs .marketingCta {
    margin-left: 94.8rem
}

.faqs__marketing {
    -webkit-transform: translateX(60rem);
    -ms-transform: translateX(60rem);
    transform: translateX(60rem)
}

.faqs__marketing.in {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
    transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
}

.faq {
    background-color: #fff;
    border: 1px solid #1f00ff;
    border-radius: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    counter-increment: faq;
    margin-top: -1px
}

.faq__inner {
    width: 100%
}

.faq__header {
    height: calc(9.44rem - 1px);
    font-size: 3rem;
    padding: 3.5rem 9.44rem;
    line-height: 1;
    position: relative
}

.faq__header::before {
    content: "0" counter(faq);
    position: absolute;
    top: 0;
    left: 0;
    width: 4.5rem;
    height: 4.1rem;
    border-bottom-right-radius: 1rem;
    border-bottom: 1px solid #1f00ff;
    border-right: 1px solid #1f00ff;
    font-size: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.faq__content {
    padding: .5rem 9.5rem 3.5rem
}

.faq__content .body {
    font-size: 1.8rem;
    line-height: 3rem;
    width: 67rem
}

.faq__arrow {
    min-width: 9.5rem;
    max-width: 9.5rem;
    position: relative;
    border-left: 1px solid #1f00ff;
    cursor: pointer
}

.faq__arrow img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out
}

.faq.accordion--expanded .faq__arrow img {
    -webkit-transform: translate3d(-50%,-50%,0) rotate(180deg);
    transform: translate3d(-50%,-50%,0) rotate(180deg)
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .faqs {
        padding:20rem 0 1rem
    }

    .faqs h2 {
        margin-left: 1.7rem;
        margin-bottom: 6rem
    }

    .faqs--block {
        padding: 6rem 1rem
    }

    .faqs--block h2 {
        margin: 0 auto 6rem;
        width: 100%
    }

    .faqs .sectionCounter {
        top: 7.05rem;
        right: 1.1985rem
    }

    .faqs__inner {
        width: 100%;
        margin-left: 0;
        margin-bottom: 1rem;
        padding: 0 1rem
    }

    .faqs .marketingCta {
        margin-left: 0;
        -webkit-transform: translateX(100vw);
        -ms-transform: translateX(100vw);
        transform: translateX(100vw)
    }

    .faqs__marketing {
        padding: 0 .5rem;
        margin-top: 5rem;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none
    }

    .faqs__marketing.in .marketingCta {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: -webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        -o-transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24);
        transition: transform .8s .2s cubic-bezier(.275,.6,.16,1.24),-webkit-transform .8s .2s cubic-bezier(.275,.6,.16,1.24)
    }

    .faq {
        border-radius: .5rem;
        display: block;
        position: relative
    }

    .faq__header {
        font-size: 1.8rem;
        padding: 3rem 7rem 3rem 4.5rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .faq__header::before {
        width: 3rem;
        height: 3rem;
        border-bottom-right-radius: 1rem;
        font-size: 1rem
    }

    .faq__content {
        padding: 0 4.5rem 3rem
    }

    .faq__content .body {
        font-size: 1.5rem;
        line-height: 2.2rem;
        width: 100%
    }

    .faq__arrow {
        position: absolute;
        z-index: 2;
        top: 0;
        right: 0;
        min-width: 5rem;
        max-width: 5rem;
        height: 9.5rem;
        border-left: none
    }

    .faq__arrow img {
        width: 1.7rem
    }

    .faq.accordion--expanded .faq__arrow img {
        -webkit-transform: translate3d(-50%,-50%,0) rotate(180deg);
        transform: translate3d(-50%,-50%,0) rotate(180deg)
    }
}

.letter {
    padding: 1.5rem;
    color: #fff
}

.letter__inner {
    position: relative;
    height: 100%;
    padding: 20rem 0 20rem 48rem
}

.letter__side {
    position: absolute;
    top: 0;
    right: calc(100% + 9rem);
    height: 100%;
    min-width: 34.3rem;
    max-width: 34.3rem
}

.letter__side .sectionBlock {
    position: -webkit-sticky;
    position: sticky;
    top: 55rem;
    margin-bottom: -2rem
}

.letter__sideImage {
    width: 100%;
    height: 43.6rem;
    background-color: #fff;
    border-radius: 1rem;
    padding: 1rem;
    margin-bottom: 12.4rem;
    position: -webkit-sticky;
    position: sticky;
    top: 10rem
}

.letter__sideImage img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 1rem
}

.letter__main {
    position: relative;
    min-width: 100rem;
    max-width: 100rem
}

.letter__heading {
    font-size: 16rem;
    line-height: .9;
    margin-bottom: 12rem
}

.letter__body {
    width: 82rem;
    font-size: 2.8rem;
    line-height: 4rem;
    font-weight: 300;
    margin-bottom: 8rem
}

.letter__body p+p {
    margin-top: 1.5em
}

.letter__body p:first-child::first-letter {
    font-size: 10rem;
    float: left;
    line-height: 10rem;
    margin-top: 1rem;
    padding: 0 3.5rem;
    margin-right: 3rem;
    border-radius: .5rem;
    font-weight: 700;
    background-color: #fff;
    color: #1f00ff
}

.letter__signature {
    height: 7rem;
    margin-left: -2rem
}

.letter__signature img {
    height: 100%;
    width: auto
}

.letter__main>span {
    display: block;
    padding-left: 6.6rem;
    color: #ececec
}

.letter__main>span:nth-last-child(2) {
    font-family: "PP Right",sans-serif;
    font-size: 2rem;
    line-height: 2.4rem
}

.letter__main>span:nth-last-child(1) {
    text-transform: uppercase;
    font-size: 1.2rem;
    letter-spacing: .05em;
    line-height: 2.4rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .letter {
        padding:0
    }

    .letter__inner {
        padding: 15rem 1.5rem 10rem
    }

    .letter__side {
        position: relative;
        height: auto;
        min-width: 100%;
        max-width: 100%;
        top: 0;
        left: 0;
        margin-bottom: 9rem
    }

    .letter__side .sectionBlock {
        position: absolute;
        bottom: 1rem;
        left: 1rem;
        top: auto;
        margin: 0;
        width: 25rem
    }

    .letter__sideImage {
        width: 100%;
        height: 45rem;
        background-color: transparent;
        border-radius: 0;
        padding: 0;
        margin-bottom: 0;
        position: static
    }

    .letter__main {
        min-width: 100%;
        max-width: 100%
    }

    .letter__heading {
        font-size: 5rem;
        line-height: .9;
        letter-spacing: .02em;
        margin-bottom: 2rem
    }

    .letter__body {
        width: 100%;
        font-size: 2rem;
        line-height: 2.8rem;
        margin-bottom: 5rem
    }

    .letter__body p:first-child::first-letter {
        font-size: 7rem;
        line-height: 7.1rem;
        margin-top: .7rem;
        padding: 0 2.5rem;
        margin-right: 1.5rem
    }

    .letter__signature {
        height: 5rem;
        margin-left: 0
    }
}

.linkBlocks {
    background-color: #1f00ff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-size: 9.44rem 9.44rem;
    color: #fff;
    padding: 15.5rem 8.8rem 50rem 77.1rem
}

.linkBlocks__side {
    width: 47rem;
    position: absolute;
    left: 9.5rem;
    height: calc(100% - 4rem);
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.linkBlocks__sideInner {
    position: -webkit-sticky;
    position: sticky;
    top: 15.5rem
}

.linkBlocks__main {
    width: 65rem;
    padding-top: 12rem
}

.linkBlocks__heading {
    line-height: .9;
    margin-bottom: 3rem
}

.linkBlocks__subheading .body {
    font-size: 1.8rem;
    width: 34rem;
    margin-bottom: 5rem
}

.linkBlocks__count {
    position: absolute;
    top: 12rem;
    right: 3rem;
    font-size: 2.5rem;
    font-family: "PP Right",sans-serif
}

.linkBlocks__subscribe {
    color: #1f00ff;
    position: relative
}

.linkBlocks__subscribe form {
    display: block;
    padding-right: 1.5rem
}

.linkBlocks__subscribe form fieldset {
    background: #fff;
    border-radius: .5rem;
    height: 8rem;
    padding: 3rem 2rem 1rem
}

.linkBlocks__subscribe form fieldset .field>label {
    color: #1f00ff;
    font-size: 1.6rem;
    line-height: 4rem
}

.linkBlocks__subscribe form fieldset .field .input input {
    color: #1f00ff;
    font-size: 1.6rem;
    background: 0 0!important;
    border-bottom: 1px solid rgba(31,0,255,.2);
    -webkit-transition: none;
    -o-transition: none;
    transition: none
}

.linkBlocks__subscribe form fieldset .field input:not([type=submit]):not([value=""]):not([type=submit]) {
    background: #fff!important
}

.linkBlocks__subscribe .hs_submit {
    position: absolute;
    top: 0;
    right: 0;
    width: 8rem;
    height: 8rem;
    max-width: 8rem;
    background: #fff;
    border-radius: .5rem
}

.linkBlocks__subscribe .hs_submit:after {
    background-image: url(/images/arrow-blue.svg)
}

.linkBlocks__subscribe .hs-error-msgs.inputs-list {
    display: none!important
}

.linkBlocks__subscribeMessage {
    position: absolute;
    top: .8rem;
    left: 2rem;
    z-index: 2;
    font-size: 1.3rem
}

.linkBlock {
    background: #fff;
    color: #1f00ff;
    border-radius: .5rem;
    margin-bottom: 2rem;
    color: #1f00ff;
    padding: .7rem .7rem .7rem 17.3rem;
    height: 14.2rem;
    position: relative;
    cursor: pointer
}

.linkBlock__image {
    width: 13.4rem;
    height: 12.8rem;
    background: #1f00ff;
    border-radius: .5rem;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: .7rem
}

.linkBlock__image img,.linkBlock__image video {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    pointer-events: none
}

.linkBlock__content {
    padding-top: 2rem
}

.linkBlock__heading {
    font-size: 2.5rem;
    line-height: 2.8rem;
    width: 27rem;
    margin-bottom: 1rem
}

.linkBlock__subheading {
    width: 35rem;
    font-size: 1.5rem;
    line-height: 1.8rem
}

.linkBlock:after {
    content: "";
    position: absolute;
    top: 5.5rem;
    right: 2rem;
    width: 3.5rem;
    height: 3.5rem;
    background-image: url(/images/arrow-blue.svg);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    transition: -webkit-transform .3s cubic-bezier(.5,0,.25,1);
    -o-transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1);
    transition: transform .3s cubic-bezier(.5,0,.25,1),-webkit-transform .3s cubic-bezier(.5,0,.25,1)
}

@media (hover: hover) {
    .linkBlock:hover:after {
        -webkit-transform:rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
}

.linkBlock a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .linkBlocks {
        background-position:-2.4675rem 3.525rem;
        background-size: 7.05rem 7.05rem;
        background-color: #1f00ff;
        padding: 15.5rem 2rem 10rem 2rem
    }

    .linkBlocks__side {
        width: 100%;
        position: static;
        left: 0;
        height: auto
    }

    .linkBlocks__sideInner {
        position: -webkit-sticky;
        position: sticky;
        top: 15.5rem
    }

    .linkBlocks__main {
        width: calc(100% + 2rem);
        padding-top: 0;
        margin: 0 -1rem
    }

    .linkBlocks__heading {
        font-size: 6.5rem
    }

    .linkBlocks__subheading .body {
        font-size: 1.8rem;
        width: 30rem
    }

    .linkBlocks__count {
        top: 6rem;
        right: 10rem
    }

    .linkBlocks__subscribe {
        display: none
    }

    .linkBlock {
        padding: .7rem 1.5rem .7rem 16rem
    }

    .linkBlock__content {
        padding-top: .5rem
    }

    .linkBlock__heading {
        font-size: 2rem;
        line-height: 2.2rem;
        width: 100%;
        margin-bottom: .5rem
    }

    .linkBlock__subheading {
        width: 100%;
        font-size: 1.5rem;
        line-height: 1.8rem
    }

    .linkBlock:after {
        top: auto;
        bottom: 1rem;
        right: auto;
        left: 15.5rem;
        width: 1.5rem;
        height: 1.5rem;
        background-size: contain
    }
}

.heroHeader {
    padding: 1.5rem;
    color: #fff;
    text-align: center
}

.heroHeader--light {
    background-color: #fff;
    color: #1f00ff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-blend-mode: difference;
    background-size: 9.44rem 9.44rem
}

.heroHeader--light .bg {
    display: none
}

.heroHeader__inner {
    position: relative;
    height: 100%;
    padding-top: 13rem;
    padding-bottom: 6rem;
    overflow: hidden
}

.heroHeader__bottom,.heroHeader__media,.heroHeader__top {
    position: relative
}

.heroHeader__top {
    width: 113.2rem;
    margin: 0 auto 7rem
}

.heroHeader__top .subheading {
    margin-bottom: 3.5rem;
    display: block
}

.heroHeader__top h1 {
    margin-bottom: 5.5rem
}

.heroHeader__top .h1 {
    font-size: 9.5rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .heroHeader__top .h1 {
        font-size:5rem
    }
}

.heroHeader__top .h2 {
    font-size: 7rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .heroHeader__top .h2 {
        font-size:4rem
    }
}

.heroHeader__top .h3 {
    font-size: 5rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .heroHeader__top .h3 {
        font-size:3rem
    }
}

.heroHeader__top .body {
    width: 62.7rem;
    margin: 0 auto
}

.heroHeader__headerImage {
    height: 48rem;
    width: 100%;
    margin-top: 5rem;
    margin-bottom: 5rem
}

.heroHeader__headerImage img,.heroHeader__headerImage video {
    -o-object-fit: contain;
    object-fit: contain;
    height: 100%
}

.heroHeader__media {
    width: 113.3rem;
    margin: 0 auto;
    background: #fff;
    padding: 1.5rem;
    border-radius: .5rem
}

.heroHeader__media iframe,.heroHeader__media>* {
    width: 100%!important;
    border-radius: .5rem
}

.heroHeader__bottom {
    margin: 6rem 0 0
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .heroHeader {
        padding:0;
        text-align: left
    }

    .heroHeader__inner {
        padding: 16rem 1.2rem 2rem
    }

    .heroHeader__top {
        width: 100%;
        margin: 0 auto 4rem
    }

    .heroHeader__top .subheading {
        margin-bottom: 2.5rem
    }

    .heroHeader__top h1 {
        margin-bottom: 3rem
    }

    .heroHeader__top .body {
        width: 100%
    }

    .heroHeader__headerImage {
        height: auto;
        width: 100%
    }

    .heroHeader__headerImage img,.heroHeader__headerImage video {
        width: 100%;
        height: auto
    }

    .heroHeader__media {
        width: 100%;
        padding: .75rem
    }

    .heroHeader__bottom {
        margin: 0;
        text-align: center
    }

    .heroHeader__bottom .button {
        margin: 6rem 0 4rem
    }

    .heroHeader--light .heroHeader__media {
        padding: 0;
        background-color: transparent
    }
}

.formHeader {
    padding: 1.5rem;
    color: #fff;
    text-align: center
}

.formHeader--light {
    background-color: #fff;
    background-image: url(https://thepatchsystem.com/images/grid.svg);
    background-position: -4.72rem 4.72rem;
    background-blend-mode: difference;
    background-size: 9.44rem 9.44rem;
    color: #1f00ff
}

.formHeader--light .bg {
    display: none
}

.formHeader__inner {
    position: relative;
    height: 100%;
    padding-top: 13rem;
    padding-bottom: 13rem;
    overflow: hidden
}

.formHeader__form,.formHeader__mid,.formHeader__top {
    position: relative
}

.formHeader__mid .subheading {
    margin-bottom: 3.5rem;
    display: block
}

.formHeader__mid .h1 {
    font-size: 9.5rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .formHeader__mid .h1 {
        font-size:5rem
    }
}

.formHeader__mid .h2 {
    font-size: 7rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .formHeader__mid .h2 {
        font-size:4rem
    }
}

.formHeader__mid .h3 {
    font-size: 5rem;
    letter-spacing: .02em
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .formHeader__mid .h3 {
        font-size:3rem
    }
}

.formHeader__mid .body {
    margin-top: 4rem
}

.formHeader__headerImage {
    height: 48rem;
    width: 100%;
    margin-top: 5rem
}

.formHeader__headerImage img,.formHeader__headerImage video {
    -o-object-fit: contain;
    object-fit: contain;
    height: 100%
}

.formHeader__mid {
    width: 75rem;
    margin: 0 auto;
    margin-bottom: 7rem
}

.formHeader__form {
    background: #fff;
    border-radius: .5rem;
    border: 1px solid #1f00ff;
    padding: 8rem 5rem;
    width: 76rem;
    margin: auto;
    color: #1f00ff;
    min-height: 50rem
}

.formHeader__form form {
    text-align: left
}

.formHeader__formHeading {
    font-size: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid #1f00ff;
    margin-bottom: 6rem;
    margin-top: -3rem;
    line-height: 1.15
}

.formHeader__icon {
    display: none
}

.formHeader__contact {
    display: none
}

.formHeader--left {
    text-align: left
}

.formHeader--left .formHeader__wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-left: 9rem;
    margin-right: 9rem
}

.formHeader--left .formHeader__headerImage img,.formHeader--left .formHeader__headerImage video {
    -o-object-position: left;
    object-position: left
}

.formHeader--left .formHeader__mid {
    width: 53rem;
    margin: 0;
    padding-top: 2rem
}

.formHeader--left .formHeader__mid .h1 {
    font-size: 8.5rem
}

.formHeader--left .formHeader__mid .h2 {
    font-size: 6rem
}

.formHeader--left .formHeader__mid .h3 {
    font-size: 4rem
}

.formHeader--left .formHeader__form {
    margin: 0;
    width: 70rem
}

.formHeader--left .formHeader__icon {
    display: block;
    margin-top: 10rem
}

.formHeader--left .formHeader__icon img {
    height: 3.6rem
}

.formHeader--left .formHeader__contact {
    margin-top: 6rem;
    display: block;
    line-height: 2
}

.formHeader--left .formHeader__contact .subheading:not(:first-child) {
    margin-top: 5rem;
    display: block
}

.formHeader--light .formHeader__icon {
    display: none
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .formHeader {
        padding:0;
        text-align: left
    }

    .formHeader__inner {
        padding: 16rem 2rem 2rem
    }

    .formHeader__top {
        width: 100%;
        margin: 0 auto 4rem
    }

    .formHeader__top .subheading {
        margin-bottom: 2.5rem
    }

    .formHeader__top .h1 {
        font-size: 5rem;
        margin-bottom: 3rem
    }

    .formHeader__headerImage {
        height: auto;
        width: 100%
    }

    .formHeader__headerImage img,.formHeader__headerImage video {
        width: 100%;
        height: auto
    }

    .formHeader__mid {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 4rem
    }

    .formHeader__form {
        padding: 2rem 1rem;
        width: 100%
    }

    .formHeader__formHeading {
        font-size: 2rem;
        margin-bottom: 3rem;
        margin-top: 0;
        padding: 0 1rem 2rem
    }

    .formHeader__icon {
        display: none!important
    }

    .formHeader--left {
        text-align: left
    }

    .formHeader--left .formHeader__wrap {
        display: block;
        margin-left: 0;
        margin-right: 0
    }

    .formHeader--left .formHeader__top {
        width: 100%;
        margin-left: 0
    }

    .formHeader--left .formHeader__mid {
        width: 100%;
        padding: 0;
        margin-bottom: 4rem
    }

    .formHeader--left .formHeader__form {
        margin: 0;
        width: 100%
    }

    .formHeader--left .formHeader__contact {
        margin-top: 6rem;
        margin-bottom: 6rem;
        position: relative
    }
}

.lf {
    padding: 15rem 9rem;
    color: #1f00ff
}

.lf__inner {
    text-align: center
}

.lf__block {
    margin-left: auto;
    margin-right: auto;
    text-align: left
}

.lf__block--heading {
    width: 113rem
}

.lf__block--heading h1 {
    font-size: 9.5rem;
    text-align: center;
    margin-bottom: 9rem
}

.lf__block--heading h2 {
    font-size: 5rem;
    text-align: center;
    margin-bottom: 5rem
}

.lf__block--heading h3 {
    font-size: 3rem;
    width: 75rem;
    margin: auto
}

.lf__block--content {
    width: 75rem
}

.lf__block--image {
    width: 132rem
}

.lf__block--image img {
    width: 100%;
    height: auto;
    border-radius: .5rem
}

.lf__block--quote {
    width: 85rem;
    margin-left: 29rem
}

.lf__block--quote p {
    font-size: 4rem;
    text-transform: uppercase;
    font-family: "PP Right",sans-serif;
    line-height: 1.12;
    margin-bottom: 3rem
}

.lf__block--quote p::before {
    content: "“";
    margin-left: -.5em;
    margin-right: .4rem;
    display: inline-block
}

.lf__block--quote p::after {
    content: "”";
    margin-left: .4rem;
    display: inline-block
}

.lf__block--quote span:nth-child(2) {
    font-family: "PP Right",sans-serif;
    font-size: 2rem;
    display: block;
    margin-bottom: 1rem
}

.lf__block--quote span:nth-child(3) {
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: 1.2rem;
    display: block
}

.lf__block--ctaButton {
    width: 75rem
}

.lf__block--ctaButton .center {
    text-align: center
}

.lf__block--ctaButton .button--cta {
    margin: auto
}

.lf__block+.lf__block {
    margin-top: 4rem
}

.lf__block+.lf__block--image,.lf__block--image+.lf__block {
    margin-top: 10rem
}

.lf__block+.lf__block--quote,.lf__block--quote+.lf__block {
    margin-top: 8rem
}

@media screen and (orientation: portrait) and (max-width:800px),screen and (orientation:landscape) and (max-width:1200px) and (max-height:600px) {
    .lf {
        padding:5rem 2rem
    }

    .lf__inner {
        text-align: left
    }

    .lf__block {
        margin-left: 0;
        margin-right: 0;
        width: 100%!important;
        text-align: left!important
    }

    .lf__block--heading h1 {
        font-size: 5rem;
        margin-bottom: 4rem;
        text-align: left
    }

    .lf__block--heading h2 {
        font-size: 3.5rem;
        margin-bottom: 2rem;
        text-align: left
    }

    .lf__block--heading h3 {
        font-size: 2rem;
        width: 100%;
        margin-bottom: .5rem
    }

    .lf__block--quote {
        width: calc(100% - 4rem)!important;
        margin-left: 2rem
    }

    .lf__block--quote p {
        font-size: 2.8rem;
        margin-bottom: 2rem
    }

    .lf__block+.lf__block {
        margin-top: 2rem
    }

    .lf__block+.lf__block--image,.lf__block--image+.lf__block {
        margin-top: 4rem
    }

    .lf__block--image+.lf__block--image {
        margin-top: 2rem
    }

    .lf__block+.lf__block--quote,.lf__block--quote+.lf__block {
        margin-top: 7rem
    }

    .lf__block--quote+.lf__block--quote {
        margin-top: 2rem
    }
}

/* Add these styles at the end of the file */

/* Steps section styling - updated */
.steps__bucket {
    position: absolute;
    z-index: 15;
    max-width: 30%;
    height: auto;
    transition: opacity 0.5s ease;
    /* transform: translate(-50%, -50%);
    left: 50%;
    top: 50%; */
}

/* Make sure the bucket is hidden in step 1 */
.steps[data-car-active="0"] .steps__bucket {
    opacity: 0 !important;
}

/* Show bucket in steps 2 and 3 */
.steps[data-car-active="1"] .steps__bucket,
.steps[data-car-active="2"] .steps__bucket {
    opacity: 1 !important;
}

/* Fix step slides */
.steps__slides {
    position: relative;
    z-index: 30;
}

.steps__slide {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    position: absolute;
    width: 100%;
    left: 0;
}

.steps__slide.active {
    opacity: 1;
    visibility: visible;
    position: relative;
}