body {
    font-family: Inter var, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 400;
    font-style: normal;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "pnum";
}

html {
    --bg-body: #f8fafc;
    --orange-red: #f24e1e;
    --PhoneGraphic: #F6F8FB;
    --PhoneGraphic-2: #fff;
    --CheckoutPhoneGraphic: #fff;
    --CheckoutPhoneGraphic2: #fff;
    --background-image2: url("/themes/t1/images/world/q-4b5ee648-white.webp");
    --world-box: 0 56px 88px #D7DBDF inset;
    --PhoneGraphic-shadow: 0 50px 100px -20px rgba(50, 50, 93, .25), 0 30px 60px -30px rgba(0, 0, 0, .3), inset 0 -2px 6px 0 rgba(10, 37, 64, .35);
    --HomepageHeroGraphic__dashboard: #fff;
    --app-card-background: #fff;
    --big-map: url("/themes/t1/images/big-map-white.webp");
    --map-marker: url("/themes/t1/images/light-gif-maker.gif");
    --bg-location: url(/themes/t1/images/location-04097d75ra3bf9deaed86877c7e0cfb064ad7beb9dee45e74bd046f8ee34f38a74.webp) no-repeat top 50px left;
    --sl_block_shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --bgImagee9441: url('/themes/t1/images/kinder_control_tablet_1800x780w.webp') no-repeat;
    --bgImagee9441c: url('/themes/t1/images/m_bnr_kids_airplane_beach_750x474w.webp') no-repeat;
    --bgGPSlocation: url('/themes/t1/images/GPS-location-coordinates-light.webp') no-repeat;
    --bgcurrent_location: url('/themes/t1/images/Current-location-coordinates-light.webp') no-repeat;
    --bgCurrentlocation: url('/themes/t1/images/Current-location-light.webp') no-repeat;
    --ln-gradient: linear-gradient(
            134deg,
            hsla(0, 0%, 50%, 0.2), /* Серый цвет с 20% прозрачностью */ hsla(0, 0%, 70%, 0.1), /* Более светлый серый с 10% прозрачностью */ hsla(0, 0%, 90%, 0.05) /* Очень светлый серый с 5% прозрачностью */
    );
    --header-blur: rgba(255, 255, 255, 0.5);

    /* Общие */
    --text-color: rgb(17 24 39);
    --text-project: #f24e1e;
    --iti-selected-country: rgb(17 24 39);
    --bg-transparent: #fff;
    --input-number: #F6F8FB;
    --custom-gradient: linear-gradient(180deg, rgba(248, 250, 252, .8) .1%, #fff 32.45%) padding-box, radial-gradient(49.41% 64.58% at 49.4% 0, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, 0) 100%) padding-box;
    scroll-behavior: smooth;
}

html.dark {
    --bg-body: #0E0E0F;
    --orange-red: #f24e1e;
    --PhoneGraphic: #1D1D20;
    --PhoneGraphic-2: #1D1D20;
    --CheckoutPhoneGraphic: #0E0E0F;
    --CheckoutPhoneGraphic2: rgb(42, 42, 45);
    --background-image2: url("/themes/t1/images/world/q-4b5ee648.webp");
    --world-box: 0 56px 88px #e2e8ff1f inset;
    --PhoneGraphic-shadow: 0 50px 100px -20px rgba(49, 56, 68, 1), 0 30px 60px -30px rgba(0, 0, 0, .3), inset 0 -2px 6px 0 #37383C;
    --HomepageHeroGraphic__dashboard: #0E0E0F;
    --app-card-background: #1D1D20;
    --big-map: url("/themes/t1/images/big-map-dark.webp");
    --map-marker: url("/themes/t1/images/dark-gif-maker.gif");
    --bg-location: url(/themes/t1/images/location-04097d75ra3bf9deaed86877c7e0cfb064ad7beb9dee45e74bd046f8ee34f38a7.webp) no-repeat top 50px left;
    --sl_block_shadow: inset 0 0 0 1px hsla(0, 0%, 100%, .02), inset 0 1px 0 hsla(0, 0%, 100%, .06), 0 6px 32px rgba(0, 0, 0, .6);
    --bgImagee9441: url('/themes/t1/images/kinder_control_tablet_1800x780.webp') no-repeat;
    --bgImagee9441c: url('/themes/t1/images/m_bnr_kids_airplane_beach_750x474.webp') no-repeat;
    --bgGPSlocation: url('/themes/t1/images/GPS-location-coordinates.webp') no-repeat;
    --bgcurrent_location: url('/themes/t1/images/Current-location-coordinates.webp') no-repeat;
    --bgCurrentlocation: url('/themes/t1/images/Current-location.webp') no-repeat;
    --ln-gradient: linear-gradient(134deg, hsla(0, 0%, 100%, .08), hsla(0, 0%, 100%, .02), hsla(0, 0%, 100%, 0) 55%);
    --header-blur: rgba(24, 24, 25, 0.3);

    /* Общие */
    --text-color: #fff;
    --text-project: #f24e1e;
    --iti-selected-country: #fff;
    --bg-transparent: #1D1D20;
    --input-number: #1D1D20;
    --custom-gradient: linear-gradient(180deg, rgba(7, 8, 10, .6) .1%, #07080a 32.45%) padding-box, radial-gradient(49.41% 64.58% at 49.4% 0, hsla(0, 0%, 100%, .03) 0, hsla(0, 0%, 100%, 0) 100%) padding-box;
    scroll-behavior: smooth;
}


/* Общие */
.text-project {
    color: var(--text-project)
}

.bg-project {
    background-color: var(--text-project)
}

.dark\:bg-black:is(.dark *) {

    background-color: var(--bg-body) !important;
}

a {
    cursor: pointer
}

.common-Button--default {
    color: #fff !important;
    background-color: #3ecf8e !important;
    border: none !important;
    -webkit-box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
}

.body {
    background: var(--bg-body);
}

.bg-body {
    background: var(--bg-body);
}

.bg-transparent {
    background: var(--bg-transparent);
}


.CheckoutPhoneGraphic2 {
    background: var(--CheckoutPhoneGraphic2);
}


.text-brand, .text-code-keyword {
    --tw-text-opacity: 1;
    color: rgb(255 98 67/var(--tw-text-opacity));
}

/* END Общие */

.PhoneGraphic-2 {
    background: var(--PhoneGraphic-2);
}

.phone-active {

    transition: 300ms;
}

.glide__bullet--active {
    background: #f24e1e !important;
}

.glide__bullet {
    background: rgb(var(--slate-200));
}

.dark .glide__bullet {
    background: rgb(var(--zinc-700));
}

.m_m {
    margin-left: 106px;
    width: 25px;
    height: 28px;
    margin-top: 5px;
}

.if_need_hidden {
    display: none
}

#start-class {
    transform: translateY(19.625rem);
    transition: 300ms;
}

@keyframes scaleAnimation {
    from {
        transform: translateY(19.625rem);
    }
    to {
        transform: translateY(0rem);
    }
}

.scaling {
    animation: scaleAnimation 1s forwards; /* Продолжительность анимации 1 секунда */
}

#phone-active {
    transform: translateY(-19.625rem);
    transition: 300ms;
}

@keyframes scale2Animation {
    from {
        transform: translateY(-19.625rem);
    }
    to {
        transform: translateY(0rem);
    }
}

.border-white\/7\.5 {
    border-color: hsla(0, 0%, 100%, .075);
}

.scaling2 {
    animation: scale2Animation 1s forwards; /* Продолжительность анимации 1 секунда */
}

.overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: inherit;
}

.dark\:button-secondary:is(.dark *) {

    box-shadow: 0 .75px .75px #e7f0fd29 inset, 0 0 1px #e7f0fd1f inset;

}

.dark\:button-secondary:is(.dark *) {

    background: linear-gradient(180deg, rgba(212, 232, 255, .04) 0%, rgba(212, 232, 255, 0) 100%), rgba(212, 232, 255, .04)
}

.dark\:button-backgrounds-normal:is(.dark *) {
    background: linear-gradient(180deg, rgba(212, 232, 255, .03) 0%, rgba(212, 232, 255, 0) 100%), rgba(212, 232, 255, .03)

}

.dark\:button-secondary:is(.dark *):hover {
    background: linear-gradient(180deg, rgba(212, 232, 255, .1) 0%, rgba(212, 232, 255, 0) 100%), rgba(212, 232, 255, .07)
}

.dark\:button-secondary:is(.dark *):active {
    background: linear-gradient(180deg, rgba(212, 232, 255, .07) 0%, rgba(212, 232, 255, 0) 100%), rgba(212, 232, 255, .08)
}

.app-card-background {
    background: var(--app-card-background);
    border: 1px solid hsla(0, 0%, 100%, .02);
    -webkit-backdrop-filter: blur(32px);
    backdrop-filter: blur(32px);
    transition: all .1s cubic-bezier(.25, 1, .5, 1);
}

.big-map {
    margin: 70px;
}


.h2-2 {
    font-family: Whyte Inktrap, sans-serif;
}

.how-it-works {
    z-index: 1;
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}

.benefit {
    background: var(--map-marker);
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    height: 387px;

}

.ymaps-layers-pane {
    filter: grayscale(1);
    -ms-filter: grayscale(1);
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
}

.cta-section {
    background: radial-gradient(100% 100% at 50% 0px, rgba(255, 0, 0, 0.75) 0px, rgba(255, 120, 0, 0.58) 100%), rgba(255, 98, 67, 0.75);
    background-blend-mode: overlay, normal;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px 0px, rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(255, 100, 69, 0.3) 0px 8px 44px 0px;
}

.icon-marker {
    cursor: pointer;
    max-width: 35px;
    width: 35px;
    height: 35px;
    border-radius: 50%;

    position: relative;
    transform: translate(-50%, -50%);
}

.infoWindow {
    width: 250px;
    padding: 15px;
    padding-left: 50px;

    position: relative;

    border-radius: 15px;
    background-color: rgba(255, 255, 255, 0.9);
    font-size: 16px;
}

.infoIcon {
    width: 30px;
    height: 30px;

    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
}

.step {
    padding-left: 67px;
}

.arrow-1 {
    display: inline-block;
    position: relative;
    top: 30px;
    bottom: auto;
    left: 30%;
}


@media screen and (max-width: 991px) {
    .arrow-1 {
        display: none;
    }

    .step {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media screen and (max-width: 479px) {
    .arrow-1, .arrow-1.right {
        display: none;
    }
}

.arrow, .arrow-2 {
    padding-bottom: 40px;
}


.steps {
    width: 110px;
    padding-bottom: 40px;
    display: inline-block;
    height: 155px;
}

.text-span-3 {
    color: var(--orange-red);
}

.outline-brand {
    outline-color: rgb(234, 88, 11);
}

.shadow-orange-button-shadow {
    --tw-shadow: 0px 0px 0px 1px rgba(0, 0, 0, .2), 0px 1px 4px 0px rgba(0, 0, 0, .5), 0px 1px 0px 0px hsla(0, 0%, 100%, .2) inset, 0px 3px 20px 0px rgba(255, 100, 69, .4);
    --tw-shadow-colored: 0px 0px 0px 1px var(--tw-shadow-color), 0px 1px 4px 0px var(--tw-shadow-color), inset 0px 1px 0px 0px var(--tw-shadow-color), 0px 3px 20px 0px var(--tw-shadow-color);
}

.bg-orange-button {
    transition: 0.2s ease-in-out;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.1)), rgb(234, 88, 11);
    text-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px;
}


.ColumnLayout {
    --columnRowGap: var(--rowGapLarge);
    display: grid;
    row-gap: var(--columnRowGap);
    align-items: flex-start
}

.HubPage .ColumnLayout {
    -moz-column-gap: var(--gridColumnGap);
    column-gap: var(--gridColumnGap)
}


.bg-zinc-950 {
    --tw-bg-opacity: 1;
    background-color: rgb(9 9 11/var(--tw-bg-opacity))
}

.HomepageDashboardGraphic {
    display: grid;
    grid:auto/132px 1fr;
    gap: 24px;
    width: 975px;
    padding: 24px 0 24px 24px;
    border-radius: 8px;

    box-shadow: inset 0 1px 1px 0 hsla(0, 0%, 100%, .1), 0 50px 100px -20px rgba(23, 23, 24, .25), 0 30px 60px -30px rgba(0, 0, 0, .3);
    font-size: 11px;
    font-weight: 300;
    letter-spacing: .2px;
    line-height: 14px;
    color: #425466;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.HomepageDashboardGraphic__company {
    display: grid;
    grid:max-content/auto-flow max-content;
    gap: 8px;
    align-items: center;
    font-weight: 620;

    letter-spacing: .8px;
    text-transform: uppercase
}

.HomepageDashboardGraphic__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding-right: 16px
}

.HomepageDashboardGraphic__searchBar {
    display: flex;
    align-items: center;
    border-radius: 4px;
    height: 20px;
    width: 278px;
    background: #fff;
    color: #62788d
}

.HomepageDashboardGraphic__searchIcon {
    width: 10px;
    margin: 1px 5px 0 6px
}

.HomepageDashboardGraphic__body {
    display: grid;
    grid:auto/1fr 20px;
    gap: 12px;
    margin-right: 12px;
    z-index: 10;
    position: relative;
}

.HomepageDashboardGraphic__content {
    display: grid;
    gap: 12px
}

.HomepageDashboardGraphic__topSection {

    border-radius: 4px;

}

.HomepageDashboardGraphic__title {
    font: var(--fontWeightBold) 17px/22.9px var(--fontFamily);
    color: #414552;
    border-bottom: 1px solid #ebeef1;
    padding-bottom: 5px
}

.HomepageDashboardGraphic__todaySection {
    display: grid;
    grid-template-columns:2fr 1fr;
    gap: 46px;
    padding: 20px 0 0
}

.HomepageDashboardGraphic__todaySection--right {
    display: grid;
    gap: 20px
}

.HomepageDashboardGraphic__netVolumeLayout {
    display: flex;
    justify-content: space-between;
    width: 255px
}

.HomepageDashboardGraphic__copy--XSmall {
    font: var(--fontWeightNormal) 10px/12px var(--fontFamily);
    color: #727f96
}

.HomepageDashboardGraphic__copy--XSmall b {
    color: #15be53;
    font: var(--fontWeightSemibold) 10px/12px var(--fontFamily)
}

.HomepageDashboardGraphic__copy--XSmallFancy {
    color: #635bff
}

.HomepageDashboardGraphic__copy--small {
    font: var(--fontWeightNormal) 11px/14px var(--fontFamily);
    letter-spacing: -.1px;
    color: #727f96
}

.HomepageDashboardGraphic__copy--small b {
    font: var(--fontWeightSemibold) 11px/14px var(--fontFamily);
    letter-spacing: -.1px;
    color: #0a2540
}

.HomepageDashboardGraphic__copy--smallInvoices {
    font: var(--fontWeightNormal) 11px/14px var(--fontFamily);
    letter-spacing: -.1px;
    color: #0a2540
}

.HomepageDashboardGraphic__copy--smallHeaderFancy {
    font: var(--fontWeightSemibold) 11px/14px var(--fontFamily);
    color: #635bff;
    align-self: start;
    margin-top: 2px
}

.HomepageDashboardGraphic__copy--medium {
    font: var(--fontWeightNormal) 12px/15px var(--fontFamily);
    letter-spacing: -.1px;
    color: #727f96
}

.HomepageDashboardGraphic__copy--medium b {
    font: var(--fontWeightBold) 12px/15px var(--fontFamily);
    letter-spacing: -.1px;
    color: #0a2540
}

.HomepageDashboardGraphic__copy--large,
.HomepageDashboardGraphic__copy--large b {
    font: var(--fontWeightNormal) 14px/18px var(--fontFamily);
    color: #0a2540
}

.HomepageDashboardGraphic__flexGroup {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.HomepageDashboardGraphic__flexGroup--baseline {
    align-items: baseline
}

.HomepageDashboardGraphic__flexGroup--gap {
    display: flex;
    gap: 6px;
    align-items: baseline
}

.HomepageDashboardGraphic__flexGroup--gap svg {
    flex-shrink: 0
}


.HomepageHeroGraphic {
    position: relative;
    z-index: 2
}

.HomepageHeroGraphic__phone.PhoneGraphic {

    --phoneWidth: 275px;
    --phoneHeight: 540px;
    position: relative;
    margin-top: 60px;
    left: 140px;
    overflow: hidden;
}

.HomepageHeroGraphic__dashboard {
    position: absolute;
    top: 0;
    left: 253px;
    min-height: 600px;

    overflow: hidden;
}


@media screen and (max-width: 991px) {
    .HomepageHeroGraphic__phone.PhoneGraphic {
        --phoneWidth: 275px;
        --phoneHeight: 540px;
        position: relative;
        margin-top: 60px;
        left: 40px
    }

    .HomepageHeroGraphic__dashboard {
        position: absolute;
        top: 0;
        left: 153px;
    }
}

.bg-map {
    background: var(--big-map);
    background-repeat: no-repeat;
    background-color: var(--HomepageHeroGraphic__dashboard);
    background-position-y: bottom;
}

.PhoneGraphic {
    --phoneBorderRadius: 36px;
    --phoneScreenBorderRadius: 29px;
    --phoneWidth: 264px;
    --phoneHeight: 533px;
    width: var(--phoneWidth);
    height: var(--phoneHeight);
    padding: 8px;
    border-radius: var(--phoneBorderRadius);
    background: var(--PhoneGraphic);
    box-shadow: var(--PhoneGraphic-shadow);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    font-size: 16px
}

.HubPage .PhoneGraphic {
    --phoneGraphicShadow: 0px 20px 39px -20px rgba(0, 0, 0, 0.3), 0px 32px 66px -13px rgba(50, 50, 93, 0.25), 0px -1px 3px 0px rgba(10, 37, 64, 0.35) inset
}

.PhoneGraphic--scaleLarge {
    --phoneWidth: 301px;
    --phoneHeight: 615px;
    border-radius: 42px
}

.PhoneGraphic__screen {
    position: relative;
    height: 100%;
    border-radius: var(--phoneScreenBorderRadius);
    -webkit-mask-image: -webkit-radial-gradient(#fff, #000);
    background: #fff
}

.CheckoutPhoneGraphic {
    --checkoutPhoneVerticalPadding: 5px;
    --checkoutPhoneInputMinHeight: 10px;
    --checkoutPhoneFontSize: 11px;
    --checkoutPhoneContainerPaddingVertical: 14px;
    --checkoutPhoneContainerPaddingHorizontal: 10px;
    --checkoutPhoneBackToArrowHeight: 8px;
    --checkoutPhonePayButtonColor: #0a2540
}

.CheckoutPhoneGraphic {
    height: 100%;
    border-radius: 28px;
    background: var(--CheckoutPhoneGraphic);
    font-size: var(--checkoutPhoneFontSize);
    font-weight: 400;

}

.CheckoutPhoneGraphic--scaleLarge {
    --checkoutPhoneVerticalPadding: 8px;
    --checkoutPhoneInputMinHeight: 28px;
    --checkoutPhoneFontSize: 13px;
    --checkoutPhoneBackToArrowHeight: 10px
}

.CheckoutPhoneGraphic--scaleLarge .CheckoutPhoneGraphic__applePay {
    height: 16px
}

.CheckoutPhoneGraphic--logo {
    padding-top: 0
}

.CheckoutPhoneGraphic__backTo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: -10px 0 20px
}

.CheckoutPhoneGraphic__backToArrow {
    margin-right: var(--checkoutPhoneBackToArrowHeight);
    height: var(--checkoutPhoneBackToArrowHeight);
    width: auto
}

.CheckoutPhoneGraphic__backTo + .CheckoutPhoneGraphic__image {
    margin-top: 20px;
    height: 60px
}

.CheckoutPhoneGraphic__logo {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60px
}

.CheckoutPhoneGraphic__image {
    display: flex;
    justify-content: center;
    height: 80px
}

.CheckoutPhoneGraphic__image .Picture {
    border-radius: 4px;
    overflow: hidden
}

.CheckoutPhoneGraphic__description {
    margin-top: 15px;
    text-align: center;
    color: #0a2540;
    font-weight: var(--fontWeightSemibold)
}

.CheckoutPhoneGraphic__price {
    margin: 2px 0 16px;
    text-align: center
}

.CheckoutPhoneGraphic__button {
    border-radius: 4px;
    padding: var(--checkoutPhoneVerticalPadding) 0;
    text-align: center;
    font-weight: 600;
    color: #fff;
    background: var(--checkoutPhonePayButtonColor);
    box-shadow: 0 2px 4px -1px rgba(50, 50, 93, .25), 0 1px 3px -1px rgba(0, 0, 0, .3)
}

.CheckoutPhoneGraphic__buttonsContainer {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.CheckoutPhoneGraphic__button {
    display: grid;
    place-items: center
}

.CheckoutPhoneGraphic__linkButton {
    background-color: #33ddb3
}

.CheckoutPhoneGraphic__applePay {
    display: block;
    height: 14px;
    margin: 0 auto
}

.CheckoutPhoneGraphic__separator {
    margin: 16px 0 12px;
    text-align: center;
    background: linear-gradient(#e6ebf1, #e6ebf1) no-repeat 0 50%/100% 1px
}

.CheckoutPhoneGraphic__separatorTitle {
    display: inline;
    padding: 0 6px;
    background: #fff
}

.CheckoutPhoneGraphic__input {
    min-height: var(--checkoutPhoneInputMinHeight);
    line-height: var(--checkoutPhoneInputMinHeight);
    margin: 6px 0 16px;
    color: #62788d;
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgba(50, 50, 93, .07), 0 2px 3px -1px rgba(50, 50, 93, .12), 0 1px 3px -1px rgba(0, 0, 0, .12)
}

.CheckoutPhoneGraphic__input--card {
    display: grid;
    grid:auto/repeat(2, 1fr)
}

.CheckoutPhoneGraphic__placeholder {
    display: grid;
    grid-template-columns:1fr;
    grid-auto-flow: column;
    padding-left: 8px
}

.CheckoutPhoneGraphic__placeholder--number {
    gap: 0 6px;
    grid-area: auto/span 2;
    align-items: center;
    padding-right: 6px;
    border-bottom: 1px solid #e6ebf1
}

.CheckoutPhoneGraphic__placeholder--cvc {
    padding-right: 4px;
    border-left: 1px solid #e6ebf1;
    white-space: nowrap
}

.CheckoutPhoneGraphic__cvcIcon {
    margin: 4px 0 0 4px
}

.CheckoutPhoneGraphic__input--country {
    margin-bottom: 24px
}

.CheckoutPhoneGraphic__placeholder--country {
    align-items: center;
    padding-right: 9px;
    border-bottom: 1px solid #e6ebf1
}


.text-orange-glow-1 {
    --tw-text-opacity: 1;
    color: rgb(255 106 76/var(--tw-text-opacity));
}

.text-orange-emphasis-container {
    position: relative;
    text-wrap: nowrap;
    white-space: nowrap;
    z-index: 4
}

.text-orange-emphasis-container .emphasis-shadow {
    position: absolute;
    color: rgb(239, 135, 118);
    left: 0;
    top: -1px;
    line-height: normal;
}


.text-orange-emphasis-container .text-orange-emphasis {
    --default-foreground-color: #ff6243;
    --default-gradient-end-color: #eb4734;
    color: var(--foreground-color, var(--default-foreground-color));
    background-color: var(--foreground-color, var(--default-foreground-color));
    background-image: linear-gradient(180deg, var(--foreground-color, var(--default-foreground-color)), var(--gradient-end-color, var(--default-gradient-end-color)));
    background-size: 100%;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
    z-index: 4;
}


@media (min-width: 670px) {
    .illustration-column {
        display: block;
        position: absolute;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 40%;
        flex: 0 1 40%;

        z-index: -1;
        top: 0;
    }

}

@media (max-width: 670px) {
    .illustration-column {
        display: block;
        position: absolute;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 40%;
        flex: 0 1 40%;
        right: -460px;
        z-index: -1;
        top: 0;
    }
}

@media (min-width: 880px) {
    .illustration-column {
        padding-top: 0;
        margin-bottom: 0;

    }


}

.ln__offset {

    background-color: var(--header-blur);
    backdrop-filter: blur(10px);
    border-bottom-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.08);
}

.page-header {
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    width: 100%;
    z-index: 15;
}

.pin {
    display: none;
    width: 50px;
    height: 50px;
    border-radius: 50% 50% 50% 0;
    position: absolute;
    top: 175px;
    margin: -20px 0 0 -20px;
    z-index: 999999;
    left: 120px;
}


.pulse {
    display: none;
    background: #EA580B;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    position: absolute;
    left: 80px;
    top: 150px;
    border: 1px solid #fff;
    margin: 25px 0 0 -6px;
    -webkit-transform: rotateX(55deg);
    -moz-transform: rotateX(55deg);
    -o-transform: rotateX(55deg);
    -ms-transform: rotateX(55deg);
    transform: rotateX(55deg);
    z-index: 5;
}

.pulse2 {
    display: none;
    background: #EA580B;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    position: absolute;
    border: 1px solid #fff;
    margin: 30px 0 0 -6px;

    z-index: 5;
}


.pulse:after {
    content: "";
    border-radius: 50%;
    height: 40px;
    width: 40px;
    position: absolute;
    margin: -13px 0 0 -13px;
    -webkit-animation: pulsate 1s ease-out;
    -moz-animation: pulsate 1s ease-out;
    -o-animation: pulsate 1s ease-out;
    -ms-animation: pulsate 1s ease-out;
    animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-box-shadow: 0 0 1px 2px #EA580B;;
    box-shadow: 0 0 1px 2px #EA580B;
    -webkit-animation-delay: 1.1s;
    -moz-animation-delay: 1.1s;
    -o-animation-delay: 1.1s;
    -ms-animation-delay: 1.1s;
    animation-delay: 1.1s;
}

.pulse2:after {
    content: "";
    border-radius: 50%;
    height: 40px;
    width: 40px;
    position: absolute;
    margin: -10px 0 0 -20px;
    -webkit-animation: pulsate 1s ease-out;
    -moz-animation: pulsate 1s ease-out;
    -o-animation: pulsate 1s ease-out;
    -ms-animation: pulsate 1s ease-out;
    animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-box-shadow: 0 0 1px 2px #EA580B;;
    box-shadow: 0 0 1px 2px #EA580B;
    -webkit-animation-delay: 1.1s;
    -moz-animation-delay: 1.1s;
    -o-animation-delay: 1.1s;
    -ms-animation-delay: 1.1s;
    animation-delay: 1.1s;
}

@media (max-width: 960px) {
    .pulse2:after {
        margin: -13px 0 0 -13px;
    }
}

@-moz-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        -moz-transform: scale(0.1, 0.1);
        -o-transform: scale(0.1, 0.1);
        -ms-transform: scale(0.1, 0.1);
        transform: scale(0.1, 0.1);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
}

@-webkit-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        -moz-transform: scale(0.1, 0.1);
        -o-transform: scale(0.1, 0.1);
        -ms-transform: scale(0.1, 0.1);
        transform: scale(0.1, 0.1);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
}

@-o-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        -moz-transform: scale(0.1, 0.1);
        -o-transform: scale(0.1, 0.1);
        -ms-transform: scale(0.1, 0.1);
        transform: scale(0.1, 0.1);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
}

@keyframes pulsate {
    0% {
        -webkit-transform: scale(0.1, 0.1);
        -moz-transform: scale(0.1, 0.1);
        -o-transform: scale(0.1, 0.1);
        -ms-transform: scale(0.1, 0.1);
        transform: scale(0.1, 0.1);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
    50% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
    }
}

@-moz-keyframes bounce {
    0% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -webkit-transform: translateY(-2000px) rotate(-45deg);
        -moz-transform: translateY(-2000px) rotate(-45deg);
        -o-transform: translateY(-2000px) rotate(-45deg);
        -ms-transform: translateY(-2000px) rotate(-45deg);
        transform: translateY(-2000px) rotate(-45deg);
    }
    60% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
        -webkit-transform: translateY(30px) rotate(-45deg);
        -moz-transform: translateY(30px) rotate(-45deg);
        -o-transform: translateY(30px) rotate(-45deg);
        -ms-transform: translateY(30px) rotate(-45deg);
        transform: translateY(30px) rotate(-45deg);
    }
    80% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        -moz-transform: translateY(-10px) rotate(-45deg);
        -o-transform: translateY(-10px) rotate(-45deg);
        -ms-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }
    100% {
        -webkit-transform: translateY(0) rotate(-45deg);
        -moz-transform: translateY(0) rotate(-45deg);
        -o-transform: translateY(0) rotate(-45deg);
        -ms-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
    }
}

@-webkit-keyframes bounce {
    0% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -webkit-transform: translateY(-2000px) rotate(-45deg);
        -moz-transform: translateY(-2000px) rotate(-45deg);
        -o-transform: translateY(-2000px) rotate(-45deg);
        -ms-transform: translateY(-2000px) rotate(-45deg);
        transform: translateY(-2000px) rotate(-45deg);
    }
    60% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
        -webkit-transform: translateY(30px) rotate(-45deg);
        -moz-transform: translateY(30px) rotate(-45deg);
        -o-transform: translateY(30px) rotate(-45deg);
        -ms-transform: translateY(30px) rotate(-45deg);
        transform: translateY(30px) rotate(-45deg);
    }
    80% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        -moz-transform: translateY(-10px) rotate(-45deg);
        -o-transform: translateY(-10px) rotate(-45deg);
        -ms-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }
    100% {
        -webkit-transform: translateY(0) rotate(-45deg);
        -moz-transform: translateY(0) rotate(-45deg);
        -o-transform: translateY(0) rotate(-45deg);
        -ms-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
    }
}

@-o-keyframes bounce {
    0% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -webkit-transform: translateY(-2000px) rotate(-45deg);
        -moz-transform: translateY(-2000px) rotate(-45deg);
        -o-transform: translateY(-2000px) rotate(-45deg);
        -ms-transform: translateY(-2000px) rotate(-45deg);
        transform: translateY(-2000px) rotate(-45deg);
    }
    60% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
        -webkit-transform: translateY(30px) rotate(-45deg);
        -moz-transform: translateY(30px) rotate(-45deg);
        -o-transform: translateY(30px) rotate(-45deg);
        -ms-transform: translateY(30px) rotate(-45deg);
        transform: translateY(30px) rotate(-45deg);
    }
    80% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        -moz-transform: translateY(-10px) rotate(-45deg);
        -o-transform: translateY(-10px) rotate(-45deg);
        -ms-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }
    100% {
        -webkit-transform: translateY(0) rotate(-45deg);
        -moz-transform: translateY(0) rotate(-45deg);
        -o-transform: translateY(0) rotate(-45deg);
        -ms-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
    }
}

@keyframes bounce {
    0% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        -webkit-transform: translateY(-2000px) rotate(-45deg);
        -moz-transform: translateY(-2000px) rotate(-45deg);
        -o-transform: translateY(-2000px) rotate(-45deg);
        -ms-transform: translateY(-2000px) rotate(-45deg);
        transform: translateY(-2000px) rotate(-45deg);
    }
    60% {
        opacity: 1;
        -ms-filter: none;
        filter: none;
        -webkit-transform: translateY(30px) rotate(-45deg);
        -moz-transform: translateY(30px) rotate(-45deg);
        -o-transform: translateY(30px) rotate(-45deg);
        -ms-transform: translateY(30px) rotate(-45deg);
        transform: translateY(30px) rotate(-45deg);
    }
    80% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
        -moz-transform: translateY(-10px) rotate(-45deg);
        -o-transform: translateY(-10px) rotate(-45deg);
        -ms-transform: translateY(-10px) rotate(-45deg);
        transform: translateY(-10px) rotate(-45deg);
    }
    100% {
        -webkit-transform: translateY(0) rotate(-45deg);
        -moz-transform: translateY(0) rotate(-45deg);
        -o-transform: translateY(0) rotate(-45deg);
        -ms-transform: translateY(0) rotate(-45deg);
        transform: translateY(0) rotate(-45deg);
    }
}

.card-box {
    width: 100%;
    border-radius: 10px;
    isolation: isolate;
    overflow: hidden;
    position: relative
}


.world {

    position: absolute;
    top: 48px;
    transform: translate(-50%);
    left: 50%;
    width: 560px;
    height: 560px;
    border-radius: 50%;
    border: 1px solid rgba(226, 232, 255, .1);
    box-shadow: var(--world-box);
    animation: world-rotate 100s linear infinite
}

.world:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.world-mask {
    position: absolute;
    width: 100%;
    height: 100%
}

.world-mask img {
    transform: translateY(560px);
    width: 557px;
    height: 432.5px;
    animation: world-gradient 15s linear infinite
}

.world-line {
    position: absolute
}

.world-line:nth-child(1) {
    width: 205.787px;
    height: 108.755px;
    left: 108.16px;
    top: -33.53px
}

.world-line:nth-child(2) {
    width: 195.409px;
    height: 145.604px;
    left: 254.52px;
    top: -10.47px
}

.world-line:nth-child(3) {
    width: 70.938px;
    height: 132.863px;
    left: 275.51px;
    top: .23px
}

.world-line:nth-child(4) {
    width: 277.752px;
    height: 111.434px;
    left: 15.09px;
    top: 77.65px
}

.world-line:nth-child(5) {
    width: 295.033px;
    height: 134.371px;
    left: 244.25px;
    top: 39.73px
}

.world-line:nth-child(6) {
    width: 151.797px;
    height: 154.094px;
    left: 205.17px;
    top: -9.93px
}

.world-line div {
    transform: translate(-100%);
    height: 100%;
    width: 100%;
    background-image: linear-gradient(to right, rgba(109, 46, 255, 0) 56.77%, rgba(158, 122, 255, .35) 70.83%, rgba(254, 139, 187, .7) 84.9%, #ffbd7a 99.99%, rgba(255, 189, 122, 0) 100%);
    animation: world-line 7s linear infinite
}

.world-line:nth-child(2) div,
.world-line:nth-child(3) div,
.world-line:nth-child(5) div {
    background-image: linear-gradient(to left, rgba(109, 46, 255, 0) 56.77%, rgba(158, 122, 255, .35) 70.83%, rgba(254, 139, 187, .7) 84.9%, #ffbd7a 99.99%, rgba(255, 189, 122, 0) 100%);
    transform: translate(300px);
    animation-name: world-line-reverse
}

.world-line:nth-child(1) div {
    animation-delay: .5s
}

.world-line:nth-child(2) div {
    animation-delay: 1s
}

.world-line:nth-child(3) div {
    animation-delay: 1.5s
}

.world-line:nth-child(4) div {
    animation-delay: 2s
}

.world-line:nth-child(5) div {
    animation-delay: 2.5s
}

.world-line:nth-child(6) div {
    animation-delay: 3s
}


@keyframes world-gradient {
    0% {
        transform: translateZ(0) translateY(560px)
    }
    to {
        transform: translateZ(0) translateY(-560px)
    }
}

@keyframes world-line {
    0%,
    40.0001% {
        transform: translateZ(0) translate(-100%)
    }
    40% {
        transform: translateZ(0) translate(300px)
    }
}

@keyframes world-line-reverse {
    0%,
    40.0001% {
        transform: translateZ(0) translate(300px)
    }
    40% {
        transform: translateZ(0) translate(-100%)
    }
}

@keyframes world-rotate {
    to {
        transform: translateZ(0) translate(-50%) rotate(1turn)
    }
}

.lazy-background-image {
    transition: 1s cubic-bezier(.6, .6, 0, 1) opacity
}

.lazy-background-image-hidden {
    opacity: 0
}

.lazy-background-image-backgroundImage {
    background-image: var(--background-image2);
    background-size: cover
}

.lazy-background-image-maskImage {
    -webkit-mask-image: var(--background-image);
    mask-image: var(--background-image);
    -webkit-mask-size: cover;
    mask-size: cover
}

.crafted {
    width: 1440px;
    height: 1512px;
    position: relative;
    padding: 116px 222px 0
}

.crafted .container-sm {
    content-visibility: auto
}

.crafted .square-frames {
    margin: 0 auto 20px;
    position: relative
}

.crafted .section-header {
    margin-bottom: 40px
}

.crafted-boxes {
    display: flex;
    gap: 24px;
    margin-top: 24px
}

.crafted-boxes .crafted-cmd {
    flex: 1
}

.crafted-edge {
    width: 600px
}

@media (max-width: 996px) {
    .crafted {
        padding: 84px 0 0;
        width: 548px;
        height: 2016px
    }

    .crafted-boxes {
        margin-top: 36px;
        flex-direction: column
    }

    .crafted-boxes .crafted-cmd {
        flex: initial
    }

    .crafted-boxes .crafted-edge {
        width: auto;
        width: initial
    }
}

.crafted-edge .card-description {
    margin-bottom: 60px
}

.crafted-edge .card-heading {
    padding-bottom: 0
}

.crafted-edge .card-box {
    height: 758px;
}

.crafted-edge-dots {
    width: 90px;
    height: 26px;
    position: absolute;
    top: 16px;
    right: 16px
}

@media (max-width: 996px) {
    .crafted-edge .card-description {
        margin-bottom: 24px
    }
}

.about-team-section {
    background: var(--PhoneGraphic-2);
}

.bg-location {
    background: var(--bg-location);
    background-size: 80% auto
}

.HoverArrow {
    --arrowSpacing: 5px;
    --arrowHoverTransition: 150ms cubic-bezier(0.215, 0.61, 0.355, 1);
    --arrowHoverOffset: translateX(3px);
    --arrowTipTransform: none;
    --arrowLineOpacity: 0;
    position: relative;
    top: 1px;
    margin-left: var(--arrowSpacing);
    stroke-width: 2px;
    fill: none;
    stroke: currentColor
}

.HoverArrow--sizeSmall {
    --arrowSpacing: 4px;
    stroke-width: 1.5px
}

.HoverArrow__linePath {
    opacity: var(--arrowLineOpacity);
    transition: opacity var(--hoverTransition, var(--arrowHoverTransition))
}

.HoverArrow__tipPath {
    transform: var(--arrowTipTransform);
    transition: transform var(--hoverTransition, var(--arrowHoverTransition))
}

@media (pointer: fine) {
    a:hover .HoverArrow__linePath,
    button:hover .HoverArrow__linePath {
        --arrowLineOpacity: 1
    }

    a:hover .HoverArrow__tipPath,
    button:hover .HoverArrow__tipPath {
        --arrowTipTransform: var(--arrowHoverOffset)
    }
}

@media (pointer: coarse) {
    a:active .HoverArrow__linePath,
    button:active .HoverArrow__linePath {
        --arrowLineOpacity: 1
    }

    a:active .HoverArrow__tipPath,
    button:active .HoverArrow__tipPath {
        --arrowTipTransform: var(--arrowHoverOffset)
    }
}

.bg-outline-button {
    background: rgba(255, 255, 255, 0.01);
    box-shadow: rgba(255, 255, 255, 0.16) 0px 0px 0px 1px;
    backdrop-filter: blur(14px);
}


.open .uncollapsed-rotate {
    --tw-rotate: 90deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.\!open .uncollapsed-rotate {
    --tw-rotate: 90deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes hue-rotate {
    0% {
        filter: hue-rotate(0deg)
    }
    to {
        filter: hue-rotate(360deg)
    }
}

.text-shark-gray-300 {
    --tw-text-opacity: 1;
    color: rgb(185 186 191/var(--tw-text-opacity));
}

.sl_block .blocks_sl:nth-child(2) {
    opacity: 0.7
}

.sl_block .blocks_sl:nth-child(3) {
    opacity: 0.6
}

.sl_block .blocks_sl:nth-child(4) {
    opacity: 0.5
}

.sl_block .blocks_sl:nth-child(5) {
    opacity: 0.4
}

.sl_block .blocks_sl:nth-child(6) {
    opacity: 0.3
}

.sl_block .blocks_sl:nth-child(7) {
    opacity: 0
}

.sl_block .blocks_sl:nth-child(8) {
    opacity: 0
}

.blocks_sl {
    transition: transform 1s;
}

.sl_block .blocks_sl:first-child {
    background-color: hsla(0, 0%, 100%, .02);
    border-radius: .75rem;
    --tw-shadow: var(--sl_block_shadow);
    --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), inset 0 1px 0 var(--tw-shadow-color), 0 6px 32px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}


/* barcode container */
.anim-box {
    position: relative;
    width: 220px;
    height: 100px;
    padding: 10px 30px;
    transition: transform .6s ease-out;
}

/* adds the 4 corners */
.anim-box:before, .anim-box:after, .anim-box > :first-child:before, .anim-box > :first-child:after {
    position: absolute;
    width: 10%;
    height: 15%;
    border-color: var(--text-color);
    border-style: solid;
    content: ' ';
}

/* top left corner */
.anim-box:before {
    top: 0;
    left: 0;
    border-width: 2px 0 0 2px;
}

/* top right corner */
.anim-box:after {
    top: 0;
    right: 0;
    border-width: 2px 2px 0 0;
}

/* bottom right corner */
.anim-box > :first-child:before {
    bottom: 0;
    right: 0;
    border-width: 0 2px 2px 0;
}

/* bottom left corner */
.anim-box > :first-child:after {
    bottom: 0;
    left: 0;
    border-width: 0 0 2px 2px;
}

/* barcode bars */
.anim-item {
    display: inline-block;
    background-color: var(--text-color);
    height: 80px;
}

.anim-item-sm {
    width: 2px;
    margin-right: 3px;
}

.anim-item-md {
    width: 3px;
    margin-right: 2px;
}

.anim-item-lg {
    width: 5px;
    margin-right: 5px;
}


.anim-box .scanner {
    animation-play-state: running;
}

/* animated laser beam */
.scanner {
    width: 100%;
    height: 3px;
    background-color: #22C55F;
    opacity: 0.7;
    position: relative;
    box-shadow: 0px 0px 8px 10px rgba(25, 162, 74, 0.49);
    top: 50%;
    animation-name: scan;
    animation-duration: 4s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state: paused;
}

@keyframes scan {
    0% {
        box-shadow: 0px 0px 8px 10px rgba(25, 162, 74, 0.49);
        top: 50%;
    }
    25% {
        box-shadow: 0px 6px 8px 10px rgba(25, 162, 74, 0.49);
        top: 5px;
    }
    75% {
        box-shadow: 0px -6px 8px 10px rgba(25, 162, 74, 0.49);
        top: 98%;
    }
}

.timeline .line input[type="range"] {
    flex: 1;
    all: unset;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: initial !important;
    border: none;
    outline: none;
    width: 100%;
    position: relative;
}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background: #22C55F;
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;
    margin-top: calc(0.24rem * -1.4);
}

.timeline .line input[type="range"]::-webkit-slider-runnable-track {
    background: #22C55F;
    height: 0.24rem;
    border-radius: 0.24rem;
}

.timeline .line input[type="range"]::-moz-range-track {
    background: #22C55F;
    height: 0.24rem;
    border-radius: 0.24rem
}

.timeline .line input[type="range"]::-ms-track {
    background: #22C55F;
    height: 0.24rem;
    border-radius: 0.24rem
}

.timeline .line input[type="range"]::-ms-thumb {
    appearance: none;
    background: #22C55F;
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;
    margin-top: calc(0.24rem * -1.4);
}

.timeline .line input[type="range"]::-moz-range-thumb {
    unset: all;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    background: #22C55F;
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 50%;
    margin-top: calc(0.24rem * -1.4);
}

.timeline {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    padding-bottom: 0.2rem;
}

.line {
    --line-height: 0.24rem;
    flex: 1;
    display: flex;
    align-items: center;
    position: relative;
}

.line::before {
    content: "";
    width: 0;
    position: absolute;
    background: #22C55F;
    height: 0.24rem;
    border-radius: calc(0.24rem / 2);
}

@-webkit-keyframes driving {
    0% {
        transform: translateY(-650px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes driving {
    0% {
        transform: translateY(-650px);
    }
    100% {
        transform: translateY(0);
    }
}

.gps-bg {

    position: relative;
    perspective: 300px;

}

.gps-bg:after {
    content: "";

    position: absolute;
    width: 200%;
    height: 5em;
    bottom: 0;
    transform: skewY(-2deg);
}

.gps-bg__guts {
    position: absolute;
    transform: rotateX(45deg);
    width: calc(100% + 1000px);
    height: 100%;
    left: -500px;
}

.gps-bg__bg {
    height: 1300px;
    background-image: url(/themes/t1/images/roads2.svg);
    background-position: 50%;
    background-size: 15%;
    position: absolute;
    top: -162px;
    width: 100%;
    transform: translateY(-650px);
    -webkit-animation: driving 16000ms linear 0ms infinite;
    animation: driving 16000ms linear 0ms infinite;
    opacity: 0.5;
}

.gps-bg__route {
    width: 2em;

    position: absolute;
    top: -12px;
    bottom: -162px;
    left: 50%;
    transform: translateX(-50%);

}

.gps-bg__route:after {
    content: "";
    width: 20%;
    background-color: #EA580B;
    position: absolute;
    top: 0;
    bottom: 35%;
    left: 50%;
    transform: translateX(-50%);
}

.gps-bg__fade {
    background-image: linear-gradient(to bottom, #EA580B 10%, rgba(172, 141, 255, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 60%;
    z-index: 1;
}

.gps-bg__marker {
    height: 2em;
    width: 2em;


    border-radius: 100%;
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 0.125em 10px 3px rgba(30, 31, 34, 0.25);
}

.gps-bg__marker:after {
    content: "";
    border-left: 0.5em solid transparent;
    border-right: 0.5em solid transparent;
    border-bottom: 1em solid #EA580B;
    position: absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
}

@keyframes hue-rotate {
    0% {
        filter: hue-rotate(0deg)
    }
    to {
        filter: hue-rotate(360deg)
    }
}

.research-radar {
    height: 231px;
    position: relative;
    width: 380px;
    min-width: 380px
}

.z-3 {
    z-index: 3;
}

.z-4 {
    z-index: 4;
}

.z-5 {
    z-index: 5;
}

.research-radar:before {
    background: linear-gradient(to left, rgba(243, 238, 255, .08) -.89%, rgba(243, 238, 255, 0) 100%);
    content: "";
    height: 1px;
    position: absolute;
    right: -23px;
    top: 50%;
    width: 680px;
    z-index: 2
}

.research-radar-background {
    height: 360px;
    width: 360px
}

.research-radar-logo {
    height: 80px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    z-index: 1
}

@keyframes hue-rotate {
    0% {
        filter: hue-rotate(0deg)
    }
    to {
        filter: hue-rotate(360deg)
    }
}

.research-radar-scanner {
    -webkit-clip-path: polygon(0 0, 93.3673469388% 0, 93.3673469388% 25.1275510204%, 50% 50.1275510204%, 0 50.1275510204%);
    clip-path: polygon(0 0, 93.3673469388% 0, 93.3673469388% 25.1275510204%, 50% 50.1275510204%, 0 50.1275510204%);
    height: 340px;
    left: 0;

    position: absolute;
    top: 0;

    transform: rotate(-201deg);
    width: 340px
}

.research-radar-scanner-wrapper {
    height: 100%;
    left: 10px;
    pointer-events: none;
    position: absolute;
    top: 10px;
    width: 100%
}

.research-radar-scanner-wrapper-visible .research-radar-scanner {
    animation: researchRadarRotate 10s infinite linear
}

.research-radar-scanner:before,
.research-radar-scanner:after {
    content: ""
}

.research-radar-scanner:before {
    background: linear-gradient(267deg, rgba(234, 88, 11, .4) 13.23%, rgba(3, 0, 20, 0) 50%);
    border-radius: 50%;
    display: block;
    height: 100%;
    width: 100%
}

.research-radar-scanner:after {
    background: linear-gradient(to bottom, rgba(234, 88, 11, .24) .11%, rgba(120, 123, 255, 0) 100%), linear-gradient(to bottom, rgba(255, 255, 255, .24) .11%, rgba(255, 255, 255, 0) 100%);
    height: 380px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: rotate(60deg);
    transform-origin: bottom;
    width: 1px
}

@keyframes researchRadarRotate {
    0% {
        transform: rotate(-201deg)
    }
    to {
        transform: rotate(159deg)
    }
}

@keyframes hue-rotate {
    0% {
        filter: hue-rotate(0deg)
    }
    to {
        filter: hue-rotate(360deg)
    }
}

.research-radar-item {
    height: 100px;
    position: absolute;
    width: 100px
}

.research-radar-item-active div {
    animation: researchRadarItem 3s calc(var(--index) * .01s) cubic-bezier(.6, .6, 0, 1) 1
}

.research-radar-item div {
    border-radius: 50%;
    opacity: 0;
    position: absolute;
    transform: scale(0)
}

.research-radar-item div:nth-child(1),
.research-radar-item div:nth-child(2),
.research-radar-item div:nth-child(3) {
    background: rgba(234, 88, 11, .04)
}

.research-radar-item div:nth-child(1) {
    height: 100px;
    width: 100px;
    left: calc(50% - 50px);
    top: calc(50% - 50px)
}

.research-radar-item div:nth-child(2) {
    height: 68px;
    width: 68px;
    left: calc(50% - 34px);
    top: calc(50% - 34px)
}

.research-radar-item div:nth-child(3) {
    height: 36px;
    width: 36px;
    left: calc(50% - 18px);
    top: calc(50% - 18px)
}

.research-radar-item div:nth-child(4) {
    height: 12px;
    width: 12px;
    left: calc(50% - 6px);
    top: calc(50% - 6px);
    background: rgba(234, 88, 11, .16);
    box-shadow: inset 0 0 6px 4px #ed78ff0a, inset 0 0 8px #787bff0f, inset 0 0 4px #787bff0a
}

.research-radar-item div:nth-child(5) {
    height: 8px;
    width: 8px;
    left: calc(50% - 4px);
    top: calc(50% - 4px);
    background: rgba(234, 88, 11, .48);
    box-shadow: inset 0 0 6px 4px #ed78ff0a, inset 0 0 8px #787bff0f, inset 0 0 4px #787bff0a
}

.research-radar-item div:nth-child(6) {
    height: 20px;
    width: 20px;
    left: calc(50% - 10px);
    top: calc(50% - 10px);
    background: rgba(234, 88, 11, .76);
    filter: blur(8px);
    mix-blend-mode: screen;
    transform: scaleY(-1)
}

.research-radar-item:nth-child(1) {
    left: 25px;
    top: 27px;
}

.research-radar-item:nth-child(2) {
    left: 203px;
    top: 15px
}

.research-radar-item:nth-child(3) {
    left: 147px;
    top: 91px
}

.research-radar-item:nth-child(4) {
    left: 199px;
    top: 78px;
}

.research-radar-item:nth-child(5) {
    left: 15px;
    top: 91px;
}

.research-radar-item:nth-child(6) {
    left: 91px;
    top: 9px;
}

.research-radar-item:nth-child(7) {
    left: 237px;
    top: 125px;
}

@keyframes researchRadarItem {
    0% {
        opacity: 0;
        transform: scale(0)
    }
    25% {
        opacity: 1
    }
    50%,
    75% {
        opacity: 1;
        transform: scale(1)
    }
    to {
        opacity: 0;
        transform: scale(1.2)
    }
}

.icon_parent {
    position: absolute;
    cursor: pointer;
    transform: perspective(600px) rotateY(0deg);
    opacity: 1;
    transition: all 0.5s ease 0.4s;
}

.icon_parent.inactive {
    transform: perspective(600px) rotateY(-90deg);
    opacity: 1;
}

.icon_parent svg {
    fill: #EA580B;
    animation: 1.5s icon ease-in-out infinite;
}

.icon_parent .shadow {
    position: absolute;
    left: 30%;
    width: 20px;
    height: 5px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.3);
    transform-origin: 50% 50%;
    animation: 1.5s shadow ease-in-out infinite;
}

@keyframes icon {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes shadow {
    0% {
        transform: scaleX(0.75);
    }
    50% {
        transform: scaleX(1);
    }
    100% {
        transform: scaleX(0.75);
    }
}

.bg-gradient-section-divider {
    background-image: linear-gradient(45deg, transparent 25%, #fff, transparent 75%);
}

.big-w-dots-container {
    -webkit-clip-path: path("M143 0C84 0 43 26 12 55L0 67l130 130L259 67C235 34 188 0 143 0Zm320 0c-59 0-100 26-131 55l-12 12-160 161 130 129L579 67C555 34 508 0 463 0Zm321 0c-59 0-100 26-131 55l-12 12-321 321 34 34c53 52 139 52 191 0L900 67C875 34 829 0 784 0Z");
    clip-path: path("M143 0C84 0 43 26 12 55L0 67l130 130L259 67C235 34 188 0 143 0Zm320 0c-59 0-100 26-131 55l-12 12-160 161 130 129L579 67C555 34 508 0 463 0Zm321 0c-59 0-100 26-131 55l-12 12-321 321 34 34c53 52 139 52 191 0L900 67C875 34 829 0 784 0Z")
}

.big-w-dots-container .dot {
    animation: strobe var(--duration) ease infinite;
    background: var(--color);
    animation-delay: var(--delay)
}

@keyframes strobe {
    0% {
        opacity: .3
    }
    50% {
        opacity: 1
    }
    to {
        opacity: .3
    }
}

.bg-shark-gray-950 {
    --tw-bg-opacity: 1;
    background-color: rgb(29 29 32/var(--tw-bg-opacity));
}

.dark\:bg-shark-gray-950:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(29 29 32);

}

.dark\:shadow-bento-card:is(.dark *) {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);

}

.shadow-bento-card, .shadow-code-mockup {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.dark\:shadow-bento-card:is(.dark *) {
    --tw-shadow: 0px 1px 0px 0px hsla(0, 0%, 100%, .06) inset, 0px 4px 10px 0px rgba(0, 0, 0, .3);
    --tw-shadow-colored: inset 0px 1px 0px 0px var(--tw-shadow-color), 0px 4px 10px 0px var(--tw-shadow-color);

}

.shadow-bento-card {
    --tw-shadow: 0px 1px 0px 0px hsla(0, 0%, 100%, .06) inset, 0px 4px 10px 0px rgba(0, 0, 0, .3);
    --tw-shadow-colored: inset 0px 1px 0px 0px var(--tw-shadow-color), 0px 4px 10px 0px var(--tw-shadow-color);
}

.app-card-background {
    background: linear-gradient(180deg, hsla(0, 0%, 100%, .03), hsla(0, 0%, 100%, 0)), hsla(0, 0%, 100%, .05);
    border: 1px solid hsla(0, 0%, 100%, .05);
    -webkit-backdrop-filter: blur(32px);
    backdrop-filter: blur(32px);
    transition: all .1s cubic-bezier(.25, 1, .5, 1)
}

.bg-gray-button {
    border-radius: 6px;
    padding: 6px 12px !important;
    border: 1px solid #1d1d20;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, .05), hsla(0, 0%, 100%, 0)), #3a3a40
}

.bg-gray-button,
.bg-gray-button:hover {
    box-shadow: inset 0 2px 0 0 hsla(0, 0%, 100%, .05), 0 1px 3px 0 rgba(0, 0, 0, .1)
}

.bg-gray-button:hover {
    background: linear-gradient(180deg, hsla(0, 0%, 100%, .15), hsla(0, 0%, 100%, 0)), #3a3a40
}

.bg-gray-button:active {
    background: #3a3a40;
    box-shadow: inset 0 2px 0 0 hsla(0, 0%, 100%, .05), 0 1px 3px 0 rgba(0, 0, 0, .1);
    color: rgba(250, 250, 252, .8)
}

@media (min-width: 1280px) {
    .faded-app-placeholder {
        border-width: 1px;
        border-style: solid;
        border-radius: 8px;
        background-clip: content-box, border-box;
        background-origin: border-box;
    }

    .faded-app-placeholder.c {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        margin-top: 81px;
        border-top: 0
    }
}

@media (max-width: 1279px) {
    .faded-app-placeholder-mobile {
        border-width: 1px;
        border-style: solid;
        border-radius: 8px;
        background-clip: content-box, border-box;
        background-origin: border-box;
    }

    .faded-app-placeholder-mobile.t {
        --background-angle: 0deg;
        --border-angle: 180deg
    }

    .faded-app-placeholder-mobile.r {
        --background-angle: 90deg;
        --border-angle: -90deg
    }

    .faded-app-placeholder-mobile.b {
        --background-angle: 180deg;
        --border-angle: 0deg
    }
}

.bgImagee9441cca978546ed8833907c6097f372 {
    background: var(--bgImagee9441);
    background-size: cover;
    background-position: center center;
}

.bgCurrentlocation2 {
    background: var(--bgcurrent_location);
    background-size: cover;
    background-position: center center;
}

.bgGPSlocation {
    background: var(--bgGPSlocation);
    background-size: cover;
    background-position: center center;
}

@media (min-width: 768px) {
    .bgImagee9441cca978546ed8833907c6097f372 {
        background: var(--bgImagee9441);
        background-size: cover;
        background-position: center center;
    }

    .bgCurrentlocation2 {
        background: var(--bgcurrent_location);
        background-size: cover;
        background-position: center center;
    }

    .bgGPSlocation {
        background: var(--bgGPSlocation);
        background-size: cover;
        background-position: center center;
    }
}

@media (min-width: 992px) {
    .bgImagee9441cca978546ed8833907c6097f372 {
        background: var(--bgImagee9441);
        background-size: cover;
        background-position: center center;
    }

    .bgCurrentlocation2 {
        background: var(--bgcurrent_location);
        background-size: cover;
        background-position: center center;
    }

    .bgGPSlocation {
        background: var(--bgGPSlocation);
        background-size: cover;
        background-position: center center;
    }
}


.bgImagee9441cca978546ed8833907c6097f3721 {
    background: var(--bgImagee9441c);
    background-size: cover;
    background-position: center center;
}

.bgCurrentlocation {
    background: var(--bgCurrentlocation);
    background-size: cover;
    background-position: center center;
}

@media (min-width: 768px) {
    .bgImagee9441cca978546ed8833907c6097f3721 {
        background: var(--bgImagee9441c);
        background-size: cover;
        background-position: center center;
    }

    .bgCurrentlocation {
        background: var(--bgCurrentlocation);
        background-size: cover;
        background-position: center center;
    }
}

@media (min-width: 992px) {
    .bgImagee9441cca978546ed8833907c6097f3721 {
        background: var(--bgImagee9441c);
        background-size: cover;
        background-position: center center;
    }

    .bgCurrentlocation {
        background: var(--bgCurrentlocation);
        background-size: cover;
        background-position: center center;
    }
}


.bg-geo-wa {
    background: var(--bg-geo-wa);
    background-size: 90%;
}

@media (max-width: 769px) {
    .bg-geo-wa {
        background: var(--bg-geo-wa-mob);
        background-size: 90%;
    }
}

.CommunitySection_socialCard {
    overflow: hidden;
    background: linear-gradient(137deg, rgba(17, 18, 20, .75) 4.87%, rgba(12, 13, 15, .9) 75.88%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid hsla(0, 0%, 100%, .06);
    border-radius: 12px;
    box-shadow: inset 0 1px 1px 0 hsla(0, 0%, 100%, .15);
    transform: translateZ(0)
}

.CommunitySection_socialCard__Grpqk {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    height: auto !important;
    max-width: 454px;
    padding: 25px;
    overflow: hidden;
    margin: 5px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid hsla(0, 0%, 100%, .06);
    border-radius: 12px;

    transform: translateZ(0)
}

.CommunitySection_socialCard__Grpqk p {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;

    letter-spacing: .2px;
}

.CommunitySection_socialCard__Grpqk:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: "";
    background: transparent;
    transition: background .3s ease
}

.CommunitySection_socialCard__Grpqk:hover .CommunitySection_join__8iTNE > svg {
    transform: translateX(2px)
}

.CommunitySection_socialCard__Grpqk:hover:after {
    background: hsla(0, 0%, 100%, .04)
}

.CommunitySection_socialCard__Grpqk .CommunitySection_header__52zZJ {
    display: flex;
    gap: 16px;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.CommunitySection_socialCard__Grpqk .CommunitySection_memberCount__jf0Q3 {

    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    color: #9c9c9d;

    letter-spacing: .3px;
}

.CommunitySection_socialCard__Grpqk .CommunitySection_join__8iTNE {
    display: inline-flex;
    gap: 3px;
    align-items: center;
    font-size: 14px;
    font-weight: 500;
    color: #fff
}

.CommunitySection_socialCard__Grpqk .CommunitySection_join__8iTNE > svg {
    width: 16px;
    transition: transform .3s ease
}

.ProjectOverview_root {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    aspect-ratio: 432/220;
    max-width: 100%;
    max-height: 100%;
    overflow: hidden;
    width: 100%;
    --mask-bottom: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%);
    --mask-right: linear-gradient(to right, #0A0A0B 20%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%), linear-gradient(to right, #0A0A0B 20%, transparent 100%);
    mask-image: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%), linear-gradient(to right, #0A0A0B 20%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect
}

.bg-line-gradient {
    --gradientBorder-size: 1px;
    --gradientBorder-gradient: linear-gradient(to bottom right, hsla(0, 0%, 100%, .17), transparent);
    background: var(--ln-gradient);
}

.GlassContainer_inner__BdNcZ {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    --gradientBorder-size: 1px;
    --gradientBorder-gradient: linear-gradient(to bottom right, hsla(0, 0%, 100%, .17), transparent);
    background: var(--ln-gradient);
    border-radius: 10px
}

.GlassContainer_inner__BdNcZ:after {
    content: "";
    pointer-events: none;
    position: absolute;
    inset: 0;
    filter: url(#noiseFilter);
    mix-blend-mode: overlay;
    opacity: .1
}

.ProjectOverview_root___sg3k {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    /* aspect-ratio: 432/320; */
    max-width: 100%;
    max-height: 100%;
    overflow: hidden;
    width: 100%;
    --mask-bottom: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%);
    --mask-right: linear-gradient(to right, #0A0A0B 40%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%), linear-gradient(to right, #0A0A0B 40%, transparent 100%);
    mask-image: linear-gradient(to bottom, #0A0A0B 50%, transparent 100%), linear-gradient(to right, #0A0A0B 40%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect
}

.GlassContainer_outer__e6vy_ {
    --gradientBorder-size: 1px;
    --gradientBorder-gradient: linear-gradient(to bottom right, hsla(0, 0%, 100%, .07), transparent);
    width: 100%;
    /* height: 100%; */
    border-radius: 18px;

}

.ProjectOverview_dd__d658U {
    padding-left: 6px;
    white-space: nowrap
}

.ProjectOverview_inner__hnVSN {
    height: 100%;
    padding: 22px 18px;
}

.ProjectOverview_inner__hnVSN::before {
    content: "";
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(to bottom right, hsla(0, 0%, 100%, .07), transparent);
    -webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);

    mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);

    mask-composite: exclude;
}

.ProjectOverview_column__7T_MN {
    min-width: 108px
}

.ProjectOverview_btn__zT7aa {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    background: #232326;
    border-radius: 6px;
    white-space: nowrap
}


.top__video-wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 53.7%;
    margin-left: 16px;
    margin-right: 16px;
    margin-bottom: 10px;
    z-index: 1
}

@media (min-width: 992px) {
    .top__video-wrap {
        width: 100%;
        height: 300px;
        padding: 0;
        margin-bottom: 0
    }
}

.top__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px
}

.top__video-line {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50%;
    background-color: #191A1B
}

.top__play-btn-wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-radius: 20px
}

.top__play-btn-wrap.hidden {
    display: none !important
}

.top__play-btn {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #191A1B;
    -webkit-animation: radial-pulse 2s infinite;
    animation: radial-pulse 2s infinite
}

@media (max-width: 991px) {
    .text-message-spy .top__play-btn,
    .whatsapp-spy .top__play-btn,
    .snapchat-spy .top__play-btn {
        width: 74px;
        height: 74px
    }
}

@media (min-width: 992px) {
    .top__play-btn {
        width: 84px;
        height: 84px
    }
}

.top__play-btn svg {
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

@-webkit-keyframes radial-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(111, 111, 112, .7)
    }
    50% {
        box-shadow: 0 0 0 25px rgba(111, 111, 112, .3)
    }
    to {
        box-shadow: 0 0 0 0 rgba(111, 111, 112, .7)
    }
}

@keyframes radial-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(111, 111, 112, .7)
    }
    50% {
        box-shadow: 0 0 0 25px rgba(111, 111, 112, .3)
    }
    to {
        box-shadow: 0 0 0 0 rgba(111, 111, 112, .7)
    }
}

.card-shadow {
    box-shadow: 0 10px 40px -12px rgba(16, 24, 40, .1);
}

.custom-gradient {
    background: var(--custom-gradient)
}

.rated-section__buttons {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    align-items: center
}

@media (min-width: 960px) {
    .rated-section__buttons {
        -webkit-flex-direction: row;
        flex-direction: row;
        width: 100%;
        max-width: 515px;
        margin: auto
    }
}

.rated-section__button {
    margin-bottom: 20px
}

@media (min-width: 960px) {
    .rated-section__button {
        box-shadow: none;
        margin: 0 15px
    }
}

@media (max-width: 475px) {
    .rated-section__button {
        max-width: 100%
    }
}

.rated-section-spacer {
    -webkit-flex: 0 0 1px;
    flex: 0 0 1px;
    background: #546e7a;
    margin: 12px 40px;
    height: 1px
}

@media (min-width: 960px) {
    .rated-section-spacer {
        margin: 0 30px;
        height: auto
    }
}

.button-v {
    width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    max-width: 288px;
    min-height: 48px;
    background: rgb(var(--primary-base));;
    box-shadow: 0 8px 16px rgba(42, 49, 61, .12);
    border-radius: 8px;
    font-weight: 700;
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    text-transform: uppercase;
    opacity: 1;
    transition: background .4s, color .4s, opacity .4s
}

.button-v.animated {
    -webkit-animation: pulse-fast 3s infinite;
    animation: pulse-fast 3s infinite
}

.button-v:hover {
    background: rgb(var(--primary-darker));
}

.button-v:active {
    opacity: .8
}

.button-v--border-blue {
    border: 1px solid rgb(var(--primary-base));
    color: rgb(var(--primary-base));
    background: 0 0
}

.button-v--border-blue:hover {
    background: rgb(var(--primary-base));
    color: #fff
}

.button-v--border-blue:active {
    opacity: .8
}

@-webkit-keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgb(var(--primary-alpha-10))
    }
    70% {
        box-shadow: 0 0 0 10px transparent
    }
    to {
        box-shadow: 0 0 0 0 transparent
    }
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgb(var(--primary-alpha-16))
    }
    70% {
        box-shadow: 0 0 0 10px transparent
    }
    to {
        box-shadow: 0 0 0 0 transparent
    }
}

@-webkit-keyframes pulse-fast {
    0% {
        box-shadow: 0 0 0 0 rgb(var(--primary-alpha-24))
    }
    to {
        box-shadow: 0 0 0 35px transparent
    }
}

@keyframes pulse-fast {
    0% {
        box-shadow: 0 0 0 0 rgb(var(--primary-alpha-10))
    }
    to {
        box-shadow: 0 0 0 35px transparent
    }
}

@-webkit-keyframes pulse-white {
    0% {
        box-shadow: 0 0 0 0 transparent;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    50% {
        box-shadow: 0 0 0 2px #fff;
        -webkit-transform: scale(1.13);
        transform: scale(1.13)
    }
    to {
        box-shadow: 0 0 0 0 transparent;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes pulse-white {
    0% {
        box-shadow: 0 0 0 0 transparent;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    50% {
        box-shadow: 0 0 0 2px #fff;
        -webkit-transform: scale(1.13);
        transform: scale(1.13)
    }
    to {
        box-shadow: 0 0 0 0 transparent;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.counter-container {
    counter-reset: my-sec-counter; /* Устанавливаем начальное значение счетчика */
}

.counter-item::before {
    counter-increment: my-sec-counter; /* Увеличиваем значение счетчика на 1 */
    content: counter(my-sec-counter); /* Отображаем текущее значение счетчика */
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgb(var(--primary-base));
    flex: 0 0 48px;
    height: 48px;
    border: 1px solid rgb(var(--primary-base));
    border-radius: 8px;
    background-color: rgb(var(--primary-alpha-10));
    margin-right: 16px;
}

.APISection_fadeY__osgmL {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}


.APISection_fadeY__osgmL::after, .APISection_container__xEJNH .APISection_fadeY__osgmL::before {
    position: absolute;
    inset: 0;
    top: 0px;
    content: "";
    background: linear-gradient(to top, rgb(var(--bg-default)) 0, transparent 100%);
}

.APISection_fadeY__osgmL:after {
    top: auto;
    height: 109px;
    --direction: to top
}