:root{
    --h1TextSize: 6.5rem; 
    --h2TextSize: 3.3rem; 
    --h3TextSize: 2.4rem; 
    --h4TextSize: 2.1rem; 
    --h5TextSize: 1.8rem; 
    --h6TextSize: 1.5rem; 
    --pTextSize: 1.4rem;

    --globalFontSize : calc(15px * var(--globalScale));


    --globalSectionWidth : calc(1600px * var(--globalScale));

    --color-white: #fff;

    --color-bg-A1 : #f0f1fa;
    --color-bg-A2 : #e4e6ef;

    --color-txt-A1 : #000000;
    --color-txt-A2 : #313131;

    --color-usr-A : #6b04ff;
    /* --------------------------- */
    --color-bg-B1 : #16141a; /*#221f27*/;
    --color-bg-B2 : rgba(0, 0, 0, 0.3);

    --color-txt-B1 : #e4e6ef;
    --color-txt-B2 : #aaa;

    --color-usr-B : #150d49;

}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter_28pt-Regular.ttf');
    font-weight: 100 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter_28pt-Medium.ttf');
    font-weight: 500 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Mona';
    src: url('../fonts/MonaSans-Medium.ttf');
    font-weight: 100 400;
    font-display: swap;
}
@font-face {
    font-family: 'Mona';
    src: url('../fonts/MonaSans-SemiBold.ttf');
    font-weight: 500 900;
    font-display: swap;
}

html,
body{
    margin: 0;
    background: var(--color-bg-A1);
    color: var(--color-txt-A2);
    font-size: var(--globalFontSize);
    font-weight: 400;
    font-family: 'Mona', sans-serif;
}
html{
    height: 100%;
}
body{
    height: auto;
    transition: opacity 0.5s;
}
body.anchorfinding{
    opacity: 0;
}
body::after{
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 500;
    background: url('../media/noise.png') repeat;
    background-size: 3vw;
    pointer-events: none;
    opacity: 0.5;
}

h1,h2,h3,h4,h5,h6,
.fs-h1,.fs-h2,.fs-h3,.fs-h4,.fs-h5,.fs-h6{
    color: var(--color-txt-A1);
}

*{
    position: relative;
    box-sizing: border-box;
}

img{
    width: 100%;
}


h1, .fs-h1 { font-size: var(--h1TextSize); font-weight: 400; }
h2, .fs-h2 { font-size: var(--h2TextSize); font-weight: 400; }
h3, .fs-h3 { font-size: var(--h3TextSize); font-weight: 400; }
h4, .fs-h4 { font-size: var(--h4TextSize); font-weight: 400; }
h5, .fs-h5 { font-size: var(--h5TextSize); font-weight: 400; }
h6, .fs-h6 { font-size: var(--h6TextSize); font-weight: 400; }
p,li,a { font-size: var(--pTextSize); }
small { font-size: calc(var(--pTextSize) / 1.5); }

.fs-l{
    font-family: 'Inter', sans-serif;
    font-size: calc(var(--h1TextSize) * 1.4) !important;
    line-height: 0.9;
    margin-top: calc(80px * var(--globalScale));
    margin-bottom: calc(80px * var(--globalScale));
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
}
.lh-1{
    line-height: 1;
}

.ff-1{
    font-family: 'Mona', sans-serif;
}
.ff-2{
    font-family: 'Inter', sans-serif;
}

.fw-normal{
    font-weight: 400;
}
.fw-bold,b,strong{
    font-weight: 500;
}

.fc-usr1{
    color: var(--color-usr-A) !important;
}
.fc-usr2{
    color: var(--color-usr-B);
    background-image: linear-gradient(0, var(--color-usr-B) 10%, var(--color-white) 50%);
    text-shadow: 0 3px 20px var(--color-usr-B);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
.fd-stroke{
    color: var(--color-bg-A1);
    text-shadow: 
    -2px -2px 0 #000,  
     2px -2px 0 #000,
    -2px  2px 0 #000,
     2px  2px 0 #000;
}


header{
    display: flex;
    align-items: center;
    min-height: 100vh;
    overflow: hidden;
    padding-bottom: calc(80px * var(--globalScale));
}
header .over-hidden-inblock{
    padding-right: 5px;
}
header .contained{
    width: 100%;
    padding-top: calc(80px * var(--globalScale));
}
header h1{
    z-index: 1;
}

.header-photo-1,
.header-photo-2{
    display: inline-block;
    z-index: -1;
}
.header-photo-1{
    width: var(--h1TextSize);
}
.header-photo-1 img{
    border-radius: 50%;
}
.header-photo-2{
    width: calc(var(--h1TextSize) * 1.3);
    margin-left: var(--pTextSize);
}
.header-photo-2 img{
    border-radius: calc(10px * var(--globalScale));
}
.header-photo-1 img,
.header-photo-2 img{
    display: block;
    transform: translateY(-10%) scale(2);
}

nav{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 100;
    pointer-events: none;
}
nav.relative{
    position: absolute;
}
nav>span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(90deg, transparent 60%, #0b0b1280 120%);
    transition: opacity 0.5s;
    opacity: 0;
}
nav.active > span{
    opacity: 0.2;
    pointer-events: all;
}
nav > div{
    padding-right: calc(10px * var(--globalScale));
    padding-left: calc(10px * var(--globalScale));
    padding-top: calc(20px * var(--globalScale));
    display: flex;
    align-items: center;
    max-width: var(--globalSectionWidth);
    margin: auto;
    box-sizing: content-box;
}
.logo{
    max-width: calc(170px * var(--globalScale));
    pointer-events: all;
    padding: calc(10px * var(--globalScale)) calc(20px * var(--globalScale));
    border-radius: calc(50px * var(--globalScale));
}
.logo .logo-dark,
.logo .logo-light{
    transition: opacity 1s;
}
.logo .logo-light{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.logo.on-dark a .logo-dark{
    opacity: 0;
}
.logo.on-dark a .logo-light{
    opacity: 1;
}
.logo a,
.logo img{
    display: block;
}
.logo img{
    height: 100%;
}
.nav-links{
    margin-left: auto;
}
.nav-links.single{
    display: flex;
    justify-content: flex-end;
    min-width: calc(310px * var(--globalScale));
}
.navigation{
    width: 100%;
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    transform: translateY(10%);
    pointer-events: none;
    transition: opacity 0.5s;
}
nav.active .navigation{
    opacity: 1;
    pointer-events: all;
}


.navigation ul{
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 10px;
    background: var(--color-white);
    padding: calc(30px * var(--globalScale)) calc(40px * var(--globalScale));
    overflow: hidden;
    list-style: none;
    transform: translateX(10%);
    opacity: 0;
    transition: transform 0.5s, opacity 0.5s;
}
.navigation > :last-child{
    transition-delay: 0.25s, 0.25s;
}
nav.active .navigation ul{
    transform: none;
    opacity: 1;
}


.navigation li{
    padding: calc(10px * var(--globalScale)) 0;
}
.navigation ul a{
    font-size: var(--h5TextSize);
    font-family: 'Inter' , sans-serif;
    text-transform: uppercase;
}
.nav-links{
    pointer-events: all;
}
.nav-links .btn-1{
    padding: calc(15px * var(--globalScale)) calc(30px * var(--globalScale));
    box-shadow: unset;
    background: var(--color-usr-A);
}
.nav-links .btn-menu{
    user-select: none;
    background: var(--color-bg-A2);
    padding-left: calc(30px * var(--globalScale));
}
.no-js .nav-links .btn-menu{
    display: none;
}

.johnny-burger{
    width: calc(43px * var(--globalScale));
    -webkit-tap-highlight-color: transparent;
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.btn-menu .menu-lbl-2{
    display: none;
}
.btn-menu.active .menu-lbl-1{
    display: none;
}
.btn-menu.active .menu-lbl-2{
    display: inline;
}
.btn-menu.active{
    background: var(--color-white);
}
.btn-menu.active .johnny-burger {
    transform: rotate(45deg);
}
[class*="johnny-burger-"] {
    fill:none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke: var(--color-txt-A1);
    stroke-width:5.5;
    stroke-linecap:round;
}
.johnny-burger-top-bun {
    stroke-dasharray: 40 121;
}
.johnny-burger .johnny-burger-bot-bun {
    stroke-dasharray: 40 121;
}
.btn-menu.active .johnny-burger .johnny-burger-top-bun {
    stroke-dashoffset: -68px;
}
.btn-menu.active .johnny-burger .johnny-burger-bot-bun {
    stroke-dashoffset: -68px;
}


section{
    padding: 120px 0;
}
.pb-section{
    padding-bottom: 120px;
}
.eyebrow{
    font-size: calc(var(--pTextSize) / 1.2);
    opacity: 0.6;
    font-family: 'Inter', sans-serif;
    text-transform: capitalize;
}

.marquee-container{
    font-size: var(--h1TextSize);
    text-transform: uppercase;
    font-family: 'Inter', sans-serif;
    color: var(--color-bg-A1);
    background: var(--color-bg-B1);
}
.marquee span{
    padding: 0 calc(20px * var(--globalScale));
}
.marquee span.fc-usr1{
    transform: translateY(-50%) scale(2);
}

.section-title{
    font-family: 'Inter', sans-serif;
    font-size: var(--h1TextSize);
    font-weight: normal;
    margin-bottom: 20px;
    letter-spacing: -0.03em;
}
.section-title-row{
    padding: calc(60px * var(--globalScale)) 0;
}
.section-title-row h2,
.section-title-row p{
    margin: 0;
}
.section-title-row > :last-child{
    display: flex;
    align-items: end;
}
.bgdark{
    background: var(--color-bg-B1);
}
.bgdark *{
    color: var(--color-txt-B1);
}
.bgalt{
    background-color: var(--color-bg-A2);
}
.bgdark p,
.bgdark small,
.bgdark small a{
    color: var(--color-txt-B2);
}
small a{
    font-size: calc(var(--pTextSize) / 1.5);
}

.gradient-hint{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, var(--color-usr-A) 0%, transparent 20%);
    background-attachment: fixed;
    z-index: 1;
    pointer-events: none;
    opacity: 0.05;
}

hr{
    border: unset;
    border-top: 1px solid var(--color-bg-B2);
}

.contained{
    max-width: var(--globalSectionWidth);
    margin-left: auto;
    margin-right: auto;
}
.contained-legal{
    max-width: calc(1100px * var(--globalScale));
    margin-left: auto;
    margin-right: auto;
}
.contained-legal h2{
    margin-bottom: 0.2em;
}
.contained-legal li{
    padding-bottom: 0.5em;
}

a{
    text-decoration: none;
    font-size: var(--pTextSize);
    color: inherit;
    transition: color 0.5s, padding 0.5s;
}
a:hover{
    color: var(--color-usr-A);
}
main .text-link,
header .text-link{
    font: inherit;
    color: var(--color-usr-A);
}
[class*="btn-"]{
    font-size: calc(var(--h6TextSize) / 1.3);
    display: inline-flex;
    align-items: center;
    padding: calc(5px * var(--globalScale)) calc(10px * var(--globalScale));
    text-decoration: none;
    text-transform: uppercase;
    border: unset;
    cursor: pointer;
    border-radius: 100px;
    font-weight: 500;
    transition: transform 0.5s;
    z-index: 1;
}
[class*="btn-"].btn-big{
    padding: calc(10px * var(--globalScale)) calc(20px * var(--globalScale));
    
}
.btn-1,
.btn-2{
    background: transparent;
    padding: 0;
    background-color: var(--color-bg-B1);
    color: var(--color-txt-B1);
}
.btn-1{
    padding: calc(10px * var(--globalScale)) calc(15px * var(--globalScale));
    padding-left: calc(30px * var(--globalScale));
    box-shadow: 0 11px 20px -13px var(--color-usr-B);
}
.btn-1.btn-big{
    padding: calc(20px * var(--globalScale));
    padding-left: calc(30px * var(--globalScale));
}

.btn-2{
    background: transparent;
    color: var(--color-usr-A);
}
.btn-1 .bi,
.btn-2 .bi{
    box-sizing: content-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--pTextSize);
    width: calc(var(--pTextSize) * 2.5);
    height: calc(var(--pTextSize) * 2.5);
    background-color: var(--color-usr-A);
    color: var(--color-txt-B1);
    border-radius: 50%;
    transition: transform 0.3s, background 0.3s, color 0.3s;
}
.btn-1 .bi{
    margin-left: 20px;
}
.btn-1.btn-big .bi,
.btn-2.btn-big .bi{
    transform: scale(1.02);
    font-size: var(--h5TextSize);
    width: calc(var(--h5TextSize) * 2.5);
    height: calc(var(--h5TextSize) * 2.5);
}
.btn-1:hover .bi,
.btn-2:hover .bi{
    background: transparent;
    color: inherit;
    transform: translateX(-10px) rotate(-45deg);
}
[class*="btn-"]:hover{
    transform: translateY(-2px);
}
.btn-1:hover{
    color: var(--color-txt-B1);
}
[class*="btn-"]:focus{
    transform: scale(0.95);
    transition-duration: 0.2s;
}

button[type*="submit"] > span{
    display: flex;
    align-items: center;
}
button[type*="submit"] > :last-child{
    display: none;
}
button[type*="submit"].active{
    pointer-events: none;
}
button[type*="submit"].active > :last-child{
    display: flex;
}
button[type*="submit"].active > :first-child{
    display: none;
}
button[type*="submit"] > :last-child .bi{
    animation: submitloading 2s infinite linear;
}

.refresh-dialog{
    font-size: var(--pTextSize);
    color: #e74c3c;
    display: none;
}
.refresh-dialog.active{
    display: block;
}

@keyframes submitloading {
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}


.svc-card{
    width: 100%;
    height: 100vh;
}
.svc-card>div{
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}
.svc-card-title{
    font-size: var(--h1TextSize);
    font-family: 'Inter', sans-serif;
    z-index: 1;
    margin: 0;
    letter-spacing: -0.03em;
    line-height: 100%;
    font-weight: normal;
}
.svc-card-title span.d-block{
    display: flex;
    align-items: flex-start;
}
.svc-card-title span.fs-h2{
    line-height: 100%;
    padding-right: calc(10px * var(--globalScale));
    font-weight: bold;
    color: var(--color-usr-A);
}
.svc-card-title.text-center{
    font-size: calc(var(--h1TextSize) / 1.5);
    letter-spacing: unset;
    line-height: normal;
}
.svc-card-img{
    width: 25%;
}
.svc-card img{
    border-radius: calc(20px * var(--globalScale));
}
.svc-card-support{
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-75%);
    display: flex;
    justify-content: space-between;
}
.svc-card-support ul{
    list-style: none;
    padding: 0;
}
.svc-card-support ul{
    font-size: var(--h5TextSize);
}
.svc-card-support ul li{
    padding-bottom: calc(5px * var(--globalScale));
}
.svc-card-support ul span{
    display: block;
    font-size: var(--pTextSize);
    color: var(--color-usr-A);
    margin-bottom: calc(10px * var(--globalScale));
    text-transform: uppercase;
    font-family: 'Inter', sans-serif;
    font-weight: bold;
    padding-bottom: calc(10px * var(--globalScale));
    border-bottom: 1px solid var(--color-bg-B2);
}
.svc-card-support > :last-child{
    text-align: right;
}


.process-card{
    display: flex;
    flex-wrap: wrap;
    height: 100%;
    align-items: center;
    --process-card-title: var(--h1TextSize);
    --process-card-linewidth: calc(5px * var(--globalScale));
}
.process-card > div{
    display: flex;
    flex-wrap: wrap;
}
.process-card-pagination{
    display: flex;
    flex-direction: column;
    width: 20%;
    justify-content: space-around;
}
.process-card-pagination span{
    display: flex;
    justify-content: center;
    font-size: var(--process-card-title);
}
.process-card-pagination .process-card-no,
.process-card-pagination .process-card-no-spacer{
    background: #a8a8af;
    width: calc(var(--h6TextSize) * 2);
    height: calc(var(--h6TextSize) * 2);
    font-size: var(--h6TextSize);
    text-align: center;
    color: var(--color-txt-B1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.5s, transform 0.5s;
    transform: scale(0.7);
}
.process-card-pagination .process-card-no-spacer{
    opacity: 0;
}
.process-card-pagination .pagination-mid{
    margin: auto;
}
.process-card-liner{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--process-card-linewidth);
    height: 100%;
    background: var(--color-bg-B2);
}
.process-card-pagination .process-card-no::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: var(--process-card-linewidth);
    height: 590%;
    background-color: var(--color-usr-A);
    transform-origin: top;
    transform: translate(-50%, 100%) scaleY(var(--kinetic));
}
.process-card-no.noanim::after{
    display: none;
}

.seen .process-card-pagination .process-card-no,
.seen-passed .process-card-pagination .process-card-no{
    background: var(--color-usr-A);
    transform: none;
}
.process-card-title{
    padding-left: calc(80px * var(--globalScale));
    width: 40%;
    font-size: var(--process-card-title);
    color: var(--color-usr-A);
    text-transform: uppercase;
    font-family: 'Inter', sans-serif;
    transform-origin: left;
    transition: opacity 0.5s;
    letter-spacing: -0.05em;
    opacity: 0;
    transition-delay: 0;
}
.seen .process-card-title{
    opacity: 1;
    transition-delay: 0.5s;
}
.process-card-title img{
    max-width: 87%;
    border-radius: calc(20px * var(--globalScale));
}
.process-card-title span{
    display: block;
    margin-bottom: 0.5em;
}
.process-card-txt{
    display: flex;
    flex-direction: column;
    width: 40%;
    opacity: 0.2;
    transition: opacity 0.5s;
}
.process-card-txt > div{
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
}
.process-card-txt h2{
    font-family: 'Inter', sans-serif;
}
.seen .process-card-txt{
    opacity: 1;
}
.seen-passed .process-card-txt,
.seen-passed .process-card-txt-last{
    opacity: 1;
}

.process-transout{
    width: 100%;
    opacity: 0;
}
.process-transout .fs-h2{
    display: block;
    font-family: 'Inter', sans-serif;
    margin: 0.83em 0;
}

.process-card-txt h2,
.process-card-txt .fs-h2{
    font-weight: 500;
    font-size: var(--h6TextSize);
    margin-bottom: 0.5em;
}
.process-card-txt p{
    margin-top: 0;
}

.process-transout .process-card-txt span.fs-h2::after,
.process-transout .process-card-txt p::after{
    content: var(--pseudoContent);
}
.seen-passed .process-transout,
.seen .process-transout{
    opacity: 1;
}
.process-transout .contained{
    height: 100%;
}
.process-transout .process-card-no::after{
    transform: translate(-50%, 100%) scaleY(1);
}
.process-transout-l::before,
.process-transout-l::before,
.process-transout-r::before{
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 100vh;
    transform: translateY(-50%);
    background: var(--color-bg-A1);
}
.process-transout .contained{
    display: flex;
}
.process-transout-l,
.process-transout-r{
    width: 50%;
    overflow: hidden;
}
.process-transout-r{
    flex-direction: row-reverse;
}
.process-transout-l > div,
.process-transout-r > div{
    flex: 0 0 200%;
}
.process-transout .bgdark{
    display: flex;
}
.process-transout .bgdark,
.process-transout-liner{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.process-transout-l,
.process-transout-r,
.process-transout .bgdark,
.process-transout-liner,
.process-transout .bgdark::before,
.process-transout .bgdark::after{
    animation-play-state: paused;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: calc(-1s * var(--kinetic));
    animation-fill-mode: forwards;
    will-change: transform;
}
.process-transout .process-card-title{
    transition: unset;
}
.process-transout .bgdark::before,
.process-transout .bgdark::after{
    content: "";
    position: absolute;
    top: 0;
    width: 50%;
    height: 100%;
    background: var(--color-usr-A);
    z-index: 1;
}
.process-transout .bgdark::before{
    left: 0;
    animation-name: transoutBgDarkL;
}
@keyframes transoutBgDarkL {
    0%{
        transform: translateX(5%);
    }
    100%{
        transform: translateX(-100%);
    }
}
.process-transout .bgdark::after{
    right: 0;
    animation-name: transoutBgDarkR;
}
@keyframes transoutBgDarkR {
    0%{
        transform: translateX(-5%);
    }
    100%{
        transform: translateX(100%);
    }
}

.process-transout-liner{
    background: var(--color-usr-A);
    width: var(--process-card-linewidth);
    left: 50%;
    top: 50%;
    height: 100vh;
    transform: translate(-50%, -50%);
    animation-name: processTransoutLiner;
}
@keyframes processTransoutLiner {
    0%{
        transform: translate(-50%, -50%) scaleY(0);
    }
    100%{
        transform: translate(-50%, -50%);
    }
}
.process-transout-l{
    animation-name: processTransoutL;
}
@keyframes processTransoutL {
    100%{
        transform: translateX(-100vw) scale(2);
    }
}
.process-transout-r{
    animation-name: processTransoutR;
}
@keyframes processTransoutR {
    100%{
        transform: translateX(100vw) scale(2);
    }
}
.process-transout .bgdark{
    opacity: 0;
    animation-name: processTransoutbgD;
}
@keyframes processTransoutbgD {
    0%{
        opacity: 1;
    }
    25%{
        transform: none;
    }
    100%{
        transform: scale(3);
        opacity: 1;
    }
}

.noanim{
    animation: unset;
}

.sticky{
    position: sticky;
    top: 35vh;
}
.sticky .section-title{
    border-left: calc(5px * var(--globalScale)) solid var(--color-usr-A);
    padding: calc(50px * var(--globalScale)) 0;
    padding-left: calc(50px * var(--globalScale));
}
.why-us{
    padding-left: calc(100px * var(--globalScale));
}

.plan-card{
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-bg-B2);
    min-height: calc(750px * var(--globalScale));
    padding: calc(30px * var(--globalScale)) calc(40px * var(--globalScale));
    border-radius: calc(40px * var(--globalScale));
    overflow: hidden;
}
.plan-card-title{
    display: block;
    margin-top: auto;
    font-size: var(--h3TextSize);
    font-weight: 500;
    color: var(--color-txt-B1);
}
.rounded-title,
.rounded-title2{
    display: inline-block;
    padding: 10px 30px; 
    border: 1px solid var(--color-bg-B2); 
    border-radius: 50px;
    font-size: calc(var(--pTextSize) / 1.5);
    font-weight: 500;
    text-transform: uppercase;
}
.plan-card ul{
    padding: 0;
    list-style: none;
}
.plan-card li{
    padding: 0.2em 0;
}
.plan-card li::before{
    content: "\F26A";
    font-family: 'bootstrap-icons';
    color: var(--color-usr-A);
}
.plan-card .btn-big{
    padding: 0;
    margin-bottom: 0.83em;
}

.bgdark .rounded-title{
    border-color: var(--color-txt-B1);
    color: var(--color-txt-B1);
}
.bgdark .rounded-title2,
.rounded-title2{
    border-color: var(--color-usr-A);
    color: var(--color-usr-A);
}

.kinetic-override *{
    font-family: 'Inter', sans-serif;
    color: var(--color-txt-A2);
}
.kinetic-override h2,
.kinetic-override .over-hidden .fs-h2{
    letter-spacing: -0.05em;
    line-height: 90%;
    font-weight: normal;
}
.kinetic-override .over-hidden .fs-h2{
    padding: calc(10px * var(--globalScale));
    padding-top: 0;
}
.kinetic-override p{
    font-size: calc(var(--pTextSize) * 1.5);
}
.kinetic-override .kinetic-anim-rotate-goleft{
    padding: calc(10px * var(--globalScale));
}
.kinetic-override .m-a-all{
    transform: scale(3);
}

.flexeven{
    display: flex;
    justify-content: space-evenly;
}


.meet-upward-card,
.meet-upward-card > div{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}
.meet-upward-card-txt{
    width: 60%;
    display: flex;
}
.meet-upward-card-txt *{
    color: inherit;
}
.meet-upward-card-txt > div{
    margin: auto auto auto 0;
    padding-top: calc(var(--h2TextSize) * 1.5);
}
.meet-upward-card-title{
    display: flex;
    position: absolute;
    width: 98%;
    top: 0;
    left: 2%;
}
.meet-upward-card-title span{
    padding-right: 1em;
    display: inline-block;
}
.meet-upward-card-title i{
    margin: auto;
    flex: 1;
    height: 0.1em;
    background: var(--color-usr-A);
}
.meet-upward-card-name{
    display: inline-block;
}
.meet-upward-card-img{
    display: flex;
    width: 40%;
}
.meet-upward-card-img img{
    border-radius: calc(20px * var(--globalScale));
    margin: auto;
    max-width: calc(450px * var(--globalScale));
}

.border-l{
    padding-bottom: 40vh;
}
.review-card-txt{
    display: flex;
    align-items: flex-start;
    padding: calc(40px * var(--globalScale)) 0;
}
.review-card-txt > div{
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
    padding: 0 calc(45px * var(--globalScale));
}
.review-card-txt .quote{
    width: var(--h3TextSize);
    padding-top: calc(15px * var(--globalScale));
}
.review-card-txt h2{
    font-size: calc(var(--h1TextSize) / 1.5);
    font-family: 'Inter', sans-serif;
    z-index: 1;
    margin: 0;
    letter-spacing: -0.03em;
    line-height: 100%;
    font-weight: normal;
}
.review-card-source{
    margin-top: auto;
}
.review-card-source p{
    margin: 0;
}
.review-card-img{
    display: flex;
    align-items: center;
    justify-content: center;
}
.review-card-img img{
    padding: 10px;
    width: 75%;
    display: block;
    border-radius: 50%;
}

.proj-card{
    padding: 0 calc(20px * var(--globalScale));
    padding-top: calc(15px * var(--globalScale));
}

.proj-card img,
.proj-card video{
    margin-bottom: calc(20px * var(--globalScale));
}
.proj-title{
    font-size: var(--h2TextSize);
    font-family: 'Inter', sans-serif;
    margin-top: 0;
}


input,
textarea,
option,
select{
    font-family: 'Mona', sans-serif;
    font-size: var(--pTextSize);
    display: block;
    width: 100%;
    padding: 25px;
    background: transparent;
    border: unset;
    border-bottom: 1px solid var(--color-bg-B2);
}
textarea{
    resize: vertical;
}
input:focus,
textarea:focus{
    outline: none;
    box-shadow: none;
    border-color: var(--color-bg-B1);
}

form{
    overflow: hidden;
}
form .input-import{
    position: absolute;
    top: 0;
    left: -9999px;
}
#contact-upward-message{
    min-height: calc(180px * var(--globalScale));
}
#contact-upward-message-count{
    user-select: none;
    -moz-user-select: none;
    pointer-events: none;
    position: absolute;
    bottom: 10%;
    right: 2.5%;
}
#contact-upward-message-count span.red{
    color: #e74c3c;
}

footer{
    padding-bottom: calc(60px * var(--globalScale));
}
.footer-upward{
    margin-top: calc(80px * var(--globalScale));
    margin-bottom: calc(60px * var(--globalScale));
}
.footer-nav ul {
    padding: 0;
    list-style: none;
}
.footer-nav ul li{
    padding-top: 15px;
}
.footer-nav ul > :first-child{
    padding-top: 0;
}
.footer-nav a{
    display: inline-block;
    overflow: hidden;
}
.footer-nav a:hover{
    color: var(--color-txt-B1);
    padding-left: calc(var(--pTextSize) * 1.2);
}
.footer-nav a::before{
    position: absolute;
    top: 50%;
    left: 0;
    content: "\F231";
    font-family: bootstrap-icons;
    transform: translate(-100%, -50%);
    transition: transform 0.5s;
}
.footer-nav a:hover::before{
    transform: translateY(-50%);
}

.form-news .submit-container{
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
}
.form-news input{
    border-radius: 50px;
    color: var(--color-txt-B1);
    border: 1px solid var(--color-bg-A2);
}
.form-news #submit i{
    background: var(--color-usr-A);
    color: var(--color-bg-A1);
}


.notif,
.form-token-fail{
    position: fixed;
    display: flex;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 100;
    backdrop-filter: blur(15px);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s;
    padding: 0 16px;
    user-select: none;
    -moz-user-select: none;
}
.notif[class*="active-"],
.form-token-fail.active{
    opacity: 1;
    pointer-events: all;
}
.notif svg{
    width: calc(115px * var(--globalScale));
    height: calc(115px * var(--globalScale));
    display: none;
}
.active-success .svg-success{
    display: inline-block;
}
.active-fail .svg-fail{
    display: inline-block;
}
.notif::before,
.form-token-fail::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-bg-B1);
    opacity: 0.85;
}
.notif > div,
.form-token-fail > div{
    text-align: center;
    margin: auto;
    background: var(--color-bg-A1);
    border-radius: calc(20px * var(--globalScale));
    padding: calc(30px * var(--globalScale));
    max-width: calc(700px * var(--globalScale));
    box-shadow: 0 11px 20px -13px var(--color-usr-B);
}
.notif > div span,
.form-token-fail > div span{
    display: block;
}

.form-token-fail .exclamation{
    text-align: center;
}
.form-token-fail .exclamation i{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--h2TextSize);
    width: calc(var(--h2TextSize) * 1.8);
    height: calc(var(--h2TextSize) * 1.8);
    border-radius: 50%;
    background: #e74c3c;
    color: var(--color-txt-B1);
}

.notif-title{
    font-size: var(--h2TextSize);
    font-family: 'Inter', sans-serif;
    font-weight: bold;
}
.notif-message{
    font-size: var(--pTextSize);
}

.active-success #success-anim {
    animation: 0.32s ease-in-out 1.03s success-anim;
    transform-origin: center;
}
@keyframes success-anim {
    from {
        transform: scale(1);
    }
    50% {
        transform: scale(1.09);
    }
    to {
        transform: scale(1);
    }
}

.active-success #success-anim .check {
    animation: 0.34s cubic-bezier(0.65, 0, 1, 1) 0.8s forwards successAnimCheck;
    stroke-dasharray: 0, 75px;
    stroke-linecap: round;
    stroke-linejoin: round;
}
@keyframes successAnimCheck {
    from {
        stroke-dasharray: 0, 75px;
    }
    to {
        stroke-dasharray: 75px, 75px;
    }
}

.active-success #success-anim .outline {
    animation: 0.38s ease-in successAnimOutline;
    transform: rotate(0deg);
    transform-origin: center;
}
@keyframes successAnimOutline {
    from {
        stroke-dasharray: 0, 345.576px;
    }
    to {
        stroke-dasharray: 345.576px, 345.576px;
    }
}

.active-success #success-anim .white-circle {
    animation: 0.35s ease-in 0.35s forwards successAnimCirc;
    transform: none;
    transform-origin: center;
}
@keyframes successAnimCirc {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(0);
    }
}

.active-fail #fail-anim {
    animation: 0.32s ease-in-out 1.03s fail-anim;
    transform-origin: center;
}

@keyframes fail-anim {
    from {
        transform: scale(1);
    }
    50% {
        transform: scale(1.09);
    }
    to {
        transform: scale(1);
    }
}

.active-fail #fail-anim .cross {
    stroke-dasharray: 0, 55px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.active-fail #fail-anim .cross.first {
    animation: 0.25s cubic-bezier(0.65, 0, 1, 1) 0.8s forwards failAnimCross;
}

.active-fail #fail-anim .cross.second {
    animation: 0.25s cubic-bezier(0.65, 0, 1, 1) 0.95s forwards failAnimCross;
}

@keyframes failAnimCross {
    from {
        stroke-dasharray: 0, 55px;
    }
    to {
        stroke-dasharray: 55px, 55px;
    }
}

.active-fail #fail-anim .outline {
    animation: 0.38s ease-in failAnimOutline;
    transform-origin: center;
}

@keyframes failAnimOutline {
    from {
        stroke-dasharray: 0, 345.576px;
    }
    to {
        stroke-dasharray: 345.576px, 345.576px;
    }
}

.active-fail #fail-anim .white-circle {
    animation: 0.35s ease-in 0.35s forwards failAnimCirc;
    transform-origin: center;
}

@keyframes failAnimCirc {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(0);
    }
}



@media only screen and (max-width: 992px) {
    .kinetic-override .m-a-all{
        transform: scale(2);
    }
    .fs-l,
    .row,
    .scroll-horiz{
        padding-left: 34px;
        padding-right: 34px;
    }
    .review-card{
        padding-left: 0;
        padding-right: 0;
    }
    .review-card-txt,
    .review-card-img,
    [class*="col-"],
    form .row{
        padding-left: 6px;
        padding-right: 6px;
    }
}

@media only screen and (max-width: 950px) {
    section{
        padding: 80px 0;
    }
    .review-card-img{
        padding-top: 40px;
        order: -1;
        justify-content: flex-start;
    }
    .review-card-img img{
        width: 30%;
    }

    .process-card-pagination{
        position: absolute;
        top: 0;
        left: 0;
        width: 10%;
        height: 100%;
    }
    .process-card-pagination .process-card-no::after{
        height: 690%;
    }
    .process-card-title{
        padding: 0;
    }
    .process-card-title img{
        max-width: 300px;
    }
    .process-card-title,
    .process-card-txt{
        padding: 0 16px;
        width: 90%;
        margin-left: auto;
    }
    .process-card-txt{
        opacity: 0;
        background: var(--color-bg-A1);
    }
    .seen .process-card-txt{
        opacity: 1;
        background: var(--color-bg-A1);
    }
    .seen-passed .process-card-txt{
        opacity: 0;
    }
    .process-transout .process-card-txt{
        opacity: 1;
    }
    .process-transout .process-card-txt > div{
        display: none;
    }
    .process-transout .process-card-txt > :last-child{
        display: flex;
        opacity: 1;
    }
    .meet-upward-card-img{
        width: 100%;
    }
    .meet-upward-card-txt{
        width: 100%;
    }
    .meet-upward-card-txt > div{
        margin: auto 0 0 0;
    }
}

@media only screen and (max-width: 768px) {
    .kinetic-override .m-a-all{
        transform: scale(1.5);
    }
    section{
        padding: 40px 0;
    }
    .review-card-img img{
        width: 50%;
    }
    .svc-card-support{
        position: relative;
        transform: unset;
        top: auto;
    }
    .svc-card-img{
        order: -1;
        width: 50%;
    }
}

@media only screen and (max-width: 600px) {
    :root{
        --h1TextSize: 5.80rem; 
    }
    .review-card-txt > div{
        padding-left: 10px;
        padding-right: 0;
    }
    .footer-upward{
        margin-top: calc(60px * var(--globalScale));
        margin-bottom: calc(40px * var(--globalScale));
    }
    .meet-upward-card-title{
        position: relative;
    }
    .meet-upward-card-title span{
        font-size: 0.8em;
    }
}
@media only screen and (max-width: 550px) {
    :root{
        --h1TextSize: 5.32rem; 
    }
}

@media only screen and (max-width: 500px) {
    .kinetic-override .m-a-all{
        transform: none
    }
    :root{
        --h1TextSize: 4.8365rem;
    }
    .m-np-t{
        padding-top: 0;
    }
    .border-l{
        padding-left: 0;
    }
    .pb-vh{
        padding-bottom: 0;
    }
    .review-card-img img{
        max-width: 120px;
    }
    .review-card-txt{
        padding-top: 0px;
    }
    .review-card-source{
        margin-top: 20px !important;
    }


    .fs-l,
    .row,
    .scroll-horiz{
        padding-left: 24px;
        padding-right: 24px;
    }
    .review-card-txt,
    .review-card-img,
    [class*="col-"],
    .review-card,
    form .row{
        padding-left: 0;
        padding-right: 0;
    }
    
}
@media only screen and (max-width: 450px) {
    :root{
        --h1TextSize: 4.35rem;
    }
}
@media only screen and (max-width: 380px) {
    :root{
        --h1TextSize: 4.06rem; 
        --h2TextSize: 3rem;
    }
}
@media only screen and (max-width: 350px) {
    :root{
        --h1TextSize: 3.68rem;
        --h2TextSize: 2rem;
    }

    
    .fs-l,
    .row,
    .scroll-horiz{
        padding-left: 18px;
        padding-right: 18px;
    }
    .review-card-txt,
    .review-card-img,
    [class*="col-"],
    .review-card,
    form .row{
        padding-left: 0;
        padding-right: 0;
    }
}

.no-js .process > div{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 10vh 0;
}
.no-js .process .kinetic-slide-item{
    width: 33.33%;
}
@media (max-width: 1200px){
    .no-js .process .kinetic-slide-item{
        width: 50%;
    }
}
@media (max-width: 950px){
    .no-js .process .kinetic-slide-item{
        width: 100%;
    }
}
.no-js .process-card-pagination{
    position: absolute;
    top: 0;
    left: 0;
    width: 10%;
    height: 100%;
}
.no-js .process-card-title{
    padding: 0;
}
.no-js .process-card-title,
.no-js .process-card-txt{
    opacity: 1;
}
.no-js .process-card-title,
.no-js .process-card-txt{
    padding: 0 16px;
    width: 90%;
    margin-left: auto;
}
.no-js .process-card-title{
    color: var(--color-txt-A2);
}
.no-js .process-card-liner,
.no-js .process-transout,
.no-js .process-card-no::after,
.no-js .process > div > :last-child{
    display: none;
}
.no-js .process-card-no{
    transform: none;
    background: var(--color-usr-A);
}
.no-js .process-card-pagination > span{
    position: absolute;
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
}