@import 'ui-kit.css';
@import 'ui-blocks.css';
@import 'hovers.css';
@import 'components/form-elements.css';


/*! Homepage  | main section*/

.hero {
    display: flex;
    position: relative;
    min-height: 840px;
    overflow: hidden;
    background-color: #030E39;
    border-radius: 0px 0px 64px 64px;
}

.hero .container {
    position: relative;
    min-height: 100%;
    width: 100%;
}


.hero__inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    min-height: 100%;
    padding: 64px 0 56px 0;
    color: var(--color-white);
}

.hero__inner .title img {
    vertical-align: middle;
    margin-left: 6px;
}

.hero__text {
    margin-top: 35px;
    opacity: 0.8;
}

.hero__button {
    margin-top: 49px;
    margin-bottom: 48px;
}

.hero__anchor {
    margin: auto 0 0 0;
}

.hero__bgimage {
    position: absolute;
    z-index: 0;
    overflow: hidden;
    width: min(1245px, 100%);
    max-height: 100%;
    bottom: 0;
    right: 0;
}

.hero__bgimage img {
    display: block;
    width: 100%;
    object-fit: contain;
}

.section-blur {
    pointer-events: none;
    position: absolute;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.section-blur .blur-item {
    position: absolute;
    display: block;
    object-fit: contain;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.section-blur .blur-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.hero .blur-item:nth-child(1) {
    margin: 34px 0 0 579px;
    width: 800px;
}

.hero .blur-item:nth-child(2) {
    width: 816px;
    margin: -155px 0 0 596px;
}

.hero .blur-item:nth-child(3) {
    width: 848px;
    margin: 212px 0 0 -445px;
}

.hero .blur-item:nth-child(4) {
    width: 853px;
    margin: -111px 0 0 -474px;
}

.hero .blur-item:nth-child(5) {
    width: 846px;
    margin: -204px 0 0 180px;
}

.hero .blur-item:nth-child(6) {
    width: 559px;
    margin: 240px 0 0 398px;
}

.hero .blur-item:nth-child(7) {
    width: 816px;
    margin: -204px 0 0 -609px;
}

/*! Homepage | homepage-solution */

.homepage-solution {
    width: 100%;
    margin: 120px 0;
}

.solution__info-title {
    max-width: 992px;
    margin-top: 32px;
    word-wrap: break-word;
    letter-spacing: -0.02em;
    color: var(--title-on-light-section);
}

.solution__info-title span {
    letter-spacing: inherit;
}

.solution__info-text {
    width: 100%;
    margin: 40px 67px 0 auto;
    max-width: 589px;
    color: var(--text-on-light-section);
}

.--tabs-container__menu-item {
    cursor: pointer;
}

/* ! Homepage | tabs */
/* .tab {
    width: 40%
  } */

.--tabs-container__items,
.--tabs-container__items-inner {
    position: relative;
    display: block !important;
}

.--tabs-container__items-inner>* {
    height: auto !important;
}

.--tabs-container__items-inner {
    transition: height 0.7s;
}

.--tabs-container__items-inner.swiper-wrapper {
    transition-property: transform, height;
    display: flex !important;
    align-items: stretch;
}

.--tabs-container__item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

    opacity: 0;
    pointer-events: none;
    transition: 0.4s opacity;
}

.--tabs-container__item.-active {
    position: relative;
    z-index: 1;

    opacity: 1;
    pointer-events: auto;
}

.homepage-solution-tabs {
    margin: 124px 0;
}

.mob-sign-post {
    display: none;
}

.solution-tabs {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}

.tabs__items {
    width: 40%;
    min-width: 40%;
    max-width: 544px;
}


.tab__card-image {
    width: 100%;
}

.tab__card-image img {
    display: block;
    width: 100%;
}

.tab__card {
    display: flex;
    flex-direction: column;

    padding: 40px;
    width: 100%;
    min-height: 100%;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 32px;
}

.tab__card .title {
    display: none;
}

.tab__card .text {
    margin-top: 40px;
    margin-bottom: 24px;
}

.tab__card .button {
    margin-top: auto;
}

.tabs__nav {
    width: 100%;
    margin-left: 128px;
}

.tabs__nav-inner {
    margin-top: 56px;
    cursor: pointer;
}

.tabs__nav-item {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    color: var(--color-dark-blue-opasity4);
    padding: 19px 0;
    box-sizing: border-box;
    cursor: pointer;
    user-select: none;
}

.tabs__nav-item * {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.tabs__nav-item span {
    transition: transform 0.4s, color 0.4s;
}

.tabs__nav-item+.tabs__nav-item {
    border-top: 1.5px solid rgba(15, 60, 138, 0.15);
}

.tabs__nav-item:first-child {
    padding-top: 0;
}

.tabs__nav-item:last-child {
    padding-bottom: 0;
}

.tabs__nav-item:before {
    content: '';

    position: absolute;
    left: 0;
    margin-top: 14px;
    display: block;
    width: 30px;
    height: 22px;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzEiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAzMSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjQ1NzU3IDEwLjUwMDFMMTIuMzQ1NCAzLjAxNTg3TDEwLjEzOCAwLjk4NDMyNkwtOS42MzAyOWUtMDcgMTIuMDAwMUwxMC4xMzggMjMuMDE1OUwxMi4zNDU0IDIwLjk4NDNMNS40NTc1NyAxMy41MDAxTDMwLjAzODYgMTMuNTAwMUwzMC4wMzg2IDEwLjUwMDFMNS40NTc1NyAxMC41MDAxWiIgZmlsbD0iIzI1MzU1NiIvPgo8L3N2Zz4K);
    transform: translateX(10px);
    opacity: 0;
    transition: opacity 0.4s, transform 0.4s;
}

.tabs__nav-item.-active {
    pointer-events: none;
}

.tabs__nav-item.-active:before {
    opacity: 1;
    transform: translateX(0);
}

.tabs__nav-item.-active span {
    color: var(--title-on-light-section);
    transform: translateX(46px);
}

/* ! Homepage | rate  */

.rate-section {
    margin: 160px 0 0 0;
    padding-bottom: 120px;
    overflow: hidden;
}

.rate {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.rate__scheme {
    width: 545px;
    min-width: 545px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.rate__scheme svg {
    width: 100%;
}

.rate__scheme .info {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 320px;
    height: 320px;
    bottom: 65px;
    border-radius: 50%;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -16px rgba(38, 51, 115, 0.16);
}

#rate_mask_gradient path {
    transition: all 0.7s;
}

.rate__scheme .info:before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 400px;
    height: 400px;
    transform: translate(-50%, -50%);
    opacity: 0.1;
    border: 1.5px solid #0F3C8A;
    border-radius: 50%;
}

.rate__scheme .info .title {
    margin-top: 24px;
}

.rate__scheme .info .description {
    margin-top: 8px;
}

.rate__scheme-info {
    width: 100%;
}

.scheme-info__percent {
    margin: 24px 0 8px 0;
}

.rate__title {
    margin-top: 24px;
}

.rate__content {
    width: 49%;
    max-width: 656px;
    margin-left: 50px;
}

.rate__checks {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 40px;
    gap: 12px;
}

.rate__checks .check {
    grid-column: span 3;
    padding: 24px 16px;
    max-width: 210px;
    color: var(--color-dark-blue);

    background: var(--color-white);
    box-shadow: 4px 8px 24px -8px rgba(10, 36, 88, 0.08);
    border-radius: 20px;
    /* min-width: 155px; */
}

.rate__checks .check:nth-child(7n + 5),
.rate__checks .check:nth-child(7n + 6),
.rate__checks .check:nth-child(7n + 7) {
    grid-column: span 4;
}

.check__icons {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.check__plus {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-grey);
    transition: background 0.4s;
    cursor: pointer;
}

.check__plus::after {
    content: '';
    /* color: var(--color-dark-blue); */
    width: 15px;
    height: 15px;
    display: block;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuODQzNzUgOEgxMy4xNTYyIiBzdHJva2U9IiMwRjNDOEEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNOCAyLjg0Mzc1VjEzLjE1NjIiIHN0cm9rZT0iIzBGM0M4QSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
    transition: opacity 0.4s;
}

.check__helper {
    position: relative;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.4s;
}

.check__helper:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    transition: opacity 0.4s;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIyQzE3LjUyMjggMjIgMjIgMTcuNTIyOCAyMiAxMkMyMiA2LjQ3NzE1IDE3LjUyMjggMiAxMiAyQzYuNDc3MTUgMiAyIDYuNDc3MTUgMiAxMkMyIDE3LjUyMjggNi40NzcxNSAyMiAxMiAyMloiIGZpbGw9IiNGMEYxRkEiLz4KPHBhdGggZD0iTTEyIDE2VjEyIiBzdHJva2U9IiMwRjNDOEEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMiA4SDEyLjAxIiBzdHJva2U9IiMwRjNDOEEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
}

.check__helper:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    transition: opacity 0.4s;
    opacity: 0;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIyQzE3LjUyMjggMjIgMjIgMTcuNTIyOCAyMiAxMkMyMiA2LjQ3NzE1IDE3LjUyMjggMiAxMiAyQzYuNDc3MTUgMiAyIDYuNDc3MTUgMiAxMkMyIDE3LjUyMjggNi40NzcxNSAyMiAxMiAyMloiIGZpbGw9IiMwRjNDOEEiLz4KPHBhdGggZD0iTTEyIDE2VjEyIiBzdHJva2U9IiNGMEYxRkEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMiA4SDEyLjAxIiBzdHJva2U9IiNGMEYxRkEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
}

.check__helper.-active .check__helper-info {
    opacity: 1;
}

.check__helper.-active:before {
    opacity: 0;
  }

  .check__helper.-active:after {
    opacity: 1;
  }

.check__helper-info {
    position: absolute;
    z-index: 20;
    top: 50%;
    left: calc(100% + 16px);
    transform: translateY(-50%);
    padding: 16px;

    background: var(--color-white);
    box-shadow: 0px 16px 32px -8px rgba(10, 36, 88, 0.2);
    border-radius: 16px;
    color: var(--title-on-light-section);
    width: 240px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

.check__helper-info:before {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    background: var(--color-white);
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%) rotate(45deg);
}

.check__helper.-bubble-left .check__helper-info {
    left: auto;
    right: calc(100% + 16px);
}

.check__helper.-bubble-left .check__helper-info:before {
    left: auto;
    right: 0;
    transform: translate(50%, -50%) rotate(45deg);
}

.check__text {
    max-width: 150px;
    width: auto;
    margin: 24px 0 0 0;
}

.check.-active .check__plus {
    background: var(--color-dark-blue);
}

.check__plus::before {
    content: '';
    /* color: var(--color-dark-blue); */
    position: absolute;
    width: 15px;
    height: 15px;
    display: block;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNC41NzA2IDQuNzE4NjZMNi41OTM5IDEyLjY5NTRMMS44OTg0NCA3Ljk5OTkxTDMuMzEyNjUgNi41ODU2OUw2LjU5MzkgOS44NjY5NEwxMy4xNTY0IDMuMzA0NDRMMTQuNTcwNiA0LjcxODY2WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);
    transition: opacity 0.4s;
    opacity: 0;
}

.check.-active .check__plus::after {
    opacity: 0;
}

.check.-active .check__plus::before {
    opacity: 1;
}

/* ! Homepage | payment methods section */

.homepage-payment {
    overflow: hidden;
    position: relative;
    padding: 160px 0 120px 0;
}

.homepage-payment .-title,
.homepage-payment .-text {
    margin-top: 32px;
}

.homepage-payment .-button {
    margin-top: 48px;
}

.homepage-payment__inner .for-mob {
    display: none;
}

.homepage-payment__inner {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.homepage-payment__text {
    max-width: 544px;
    width: 50%;
}

.homepage-payment__image {
    margin-left: 128px;
    position: relative;
    right: 0;
    width: 50%;
    max-width: 656px;
}

.homepage-payment__image img {
    position: relative;
    z-index: 0;
    display: block;
    object-fit: contain;
    width: 100%;
}

.homepage-payment__image .main-img>img:last-child {
    position: absolute !important;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.homepage-payment__image .background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.homepage-payment__image .background .img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.homepage-payment__image .background img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: min(76px, 11.585%);
    height: min(76px, 11.585%);
    border-radius: 50%;
}

.homepage-payment__inner.-not-in-viewport .background img {
    animation-play-state: paused;
}

.homepage-payment__image .background .background-parallax-1 {
    box-shadow: 0px 16px 16px rgba(2, 10, 40, 0.8);
    animation: 2s infinite alternate scale2 ease-in-out;
    margin: min(249px, 37.957%) 0 0 max(-60px, -9.146%);
}

.homepage-payment__image .background .background-parallax-2 {
    box-shadow: 0px 16px 16px rgba(2, 10, 40, 0.8);
    animation: 2.3s infinite alternate scale2 ease-in-out;
    margin: max(-233px, -35.518%) 0 0 min(145px, 22.103%);
}

.homepage-payment__image .background .background-parallax-3 {
    box-shadow: 0px 16px 16px rgba(2, 10, 40, 0.8);
    animation: 1.6s infinite alternate scale2 ease-in-out;
    margin: min(140px, 21.341%) 0 0 max(-262px, -39.939%);
}

.homepage-payment__image .background .background-parallax-4 {
    width: min(96px, 14.634%);
    height: min(96px, 14.634%);
    box-shadow: 0px 16px 16px rgba(2, 10, 40, 0.8);
    animation: 1.8s infinite alternate scale ease-in-out;
    margin: min(201px, 30.64%) 0 0 min(223px, 33.993%);
}

.homepage-payment__image .background .background-parallax-5 {
    width: min(96px, 14.634%);
    height: min(96px, 14.634%);
    box-shadow: 0px 16px 16px rgba(2, 10, 40, 0.8);
    animation: 2.1s infinite alternate scale ease-in-out;
    margin: max(-239px, -36.432%) 0 0 max(-108px, -16.463%);
}


@keyframes scale {
    from {
        transform: translate(-50%, -50%) scale(1);
    }

    to {
        transform: translate(-50%, -50%) scale(0.72);
    }
}

@keyframes scale2 {
    from {
        transform: translate(-50%, -50%) scale(1);
    }

    to {
        transform: translate(-50%, -50%) scale(1.26);
    }
}

.homepage-payment__image .blur-item {
    filter: blur(190px);
}

.homepage-payment__image .green-blur {
    background: #00DE00;
    width: 114px;
    height: 98px;
    transform: translate(247px, -15px);
}

.homepage-payment__image .yellow-blur {
    background: #FFD43C;
    width: 138px;
    height: 120px;
    transform: translate(-237px, -127px);
}

.homepage-payment__image .pink-blur {
    background: #FF51B9;
    width: 120px;
    height: 105px;
    transform: translate(0px, 236px);
}

/* ! Homepage | about us section */

.homepage-about {
    position: relative;
    padding: 120px 0;
}

.homepage-about__inner {
    position: relative;
    z-index: 1;
}

.homepage-about__inner .section-blur {
    z-index: -1;
}

.homepage-about .signpost {
    margin-bottom: -26px;
}

.homepage-about .button {
    margin-top: 40px;
}

.homepage-about .title {
    text-indent: 336px;
    letter-spacing: -0.02em !important;
}

.homepage-about .title span {
    letter-spacing: inherit;
}

.homepage-about .title img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    display: inline-block;
    text-indent: 0;
}


.homepage-about__inner .blur-item:nth-child(1) {
    margin: 61px 0 0 -327px;
    width: 945px;
}

.homepage-about__inner .blur-item:nth-child(2) {
    margin: 101px 0 0 489px;
    width: 923px;
}

.homepage-about__inner .blur-item:nth-child(3) {
    margin: -70px 0 0 -502px;
    width: 914px;
}

/*! Homepage | why us */

.why-us {
    padding: 120px 0 140px 0;
}

.why-us__inner {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.why-us__text {   
    position: sticky;
    top: min(40%, 250px); 
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 566px;
    width: 43%;
}

.why-us__text .-text {
    margin-top: 35px;
    max-width: 480px;
}

.why-us__text .-button {
    margin-top: 40px;
}

.why-us__text.hidden {
    margin-top: min(250px, 40%);
    opacity: 0;
    pointer-events: none;
}

.why-us__cards {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    pointer-events: none;
}

.why-us__cards .section-blur {
    z-index: -1;
}

.why-us__card {
    width: 320px;
    min-height: 400px;
    padding: 64px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    background: rgba(40, 53, 93, 0.7);
    box-shadow: 0px 40px 64px -24px rgba(2, 10, 40, 0.8);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    pointer-events: auto;
}

.why-us__card img {
    width: 92px;
    display: block;
}

.why-us__card .title {
    margin-top: 40px;
}

.why-us__card .text {
    opacity: 0.8;
    margin-top: 16px;
}


.why-us__card:nth-child(1) {
    margin: -358px 0 0 auto;
}

.why-us__card:nth-child(2) {
    margin: -224px auto 0 0;
}

.why-us__card:nth-child(3) {
    margin: -89px -113px 0 0;

}

.why-us__card:nth-child(4) {
    margin: -57px auto 0 113px;

}

.why-us__card:nth-child(5) {
    margin: -250px 111px 0 auto;
}


.why-us__cards .blur-item:nth-child(1),
.our-values__cards .blur-item:nth-child(1) {
    margin: -448px 0 0 292px;
    width: 917px;
}

.why-us__cards .blur-item:nth-child(2),
.our-values__cards .blur-item:nth-child(2) {
    margin: 300px 0 0 172px;
    width: 947px;
}

.why-us__cards .blur-item:nth-child(3),
.our-values__cards .blur-item:nth-child(3) {
    margin: -364px 0 0 -464px;
    width: 947px;
}

.why-us__cards .blur-item:nth-child(4),
.our-values__cards .blur-item:nth-child(4) {
    margin: -382px 0 0 358px;
    width: 896px;
}


/*! integrations */

.integrations {
    margin: 120px 0 160px 0;
}

.integrations .container>.title {
    margin-top: 32px;
}

.integrations__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 64px;
}

.integrations__item {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    grid-column: span 1;
    padding: 40px;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 24px;
}

.integrations__item .title {
    white-space: nowrap;
}

.integrations__item .text {
    margin-left: 40px;
    max-width: 270px;
}

/*! homepage | integrate-accordions */

.integrate-accordions {
    margin: 160px 0 0 0;
    padding-bottom: 160px;
    overflow: hidden;
}

.integrate-accordions__wrapper {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}

.integrate-accordions__left {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    max-width: 544px;
    width: 45%;
}

.integrate-accordions__left .svg-group {
    position: absolute;
    opacity: 0;
    transition: opacity 0.4s;
    pointer-events: none;
    width: 100%;
    display: block;
}

.integrate-accordions__left .svg-group.-active {
    opacity: 1;
    pointer-events: auto;
    position: relative;
}

.integrate-accordions__right {
    margin-left: 128px;
    max-width: 656px;
    width: 50%;
}

.integrate-accordions__right .title {
    margin-top: 32px;
}

.integrate-accordions__right .accordions {
    margin-top: 57px;
    max-width: 580px;
}

.accordion-left-border {
    position: relative;
}

.accordion-left-border:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 2px;
    height: 100%;
    background: var(--color-dark-blue-opasity4);
    border-radius: 2px;
    transition: background 0.4s;
}

.accordion-left-border .--accordion__open {
    padding: 6px 0 5px 40px;
    cursor: pointer;
    color: var(--color-dark-blue-opasity4);
    transition: color 0.4s;
    user-select: none;
}

.accordion-left-border.-open .--accordion__open {
    pointer-events: none;
}

.accordion-left-border .--accordion__content {
    padding: 16px 0 5px 40px;
    color: var(--title-on-light-section);
    opacity: 0.8;
}


.accordion-left-border.-open:before {
    background: var(--title-on-light-section);
}

.accordion-left-border.-open .title {
    color: var(--title-on-light-section);
}

.accordion-left-border.-open .--accordion__open {
    color: var(--title-on-light-section);
}

.accordion-left-border+.accordion-left-border {
    margin-top: 32px;
}





/* ! Solutions page */

.solution {
    overflow: hidden;
    padding-bottom: 160px;
}

.solution__title .-opasity {
    color: var(--color-dark-blue-opasity4);
}

.solution__description2 {
    opacity: 0.8;
    margin-top: 27px;
}

.solution__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 64px;
}

.solution-item {
    grid-column: span 1;
    padding: 32px;
    display: flex;
    flex-direction: column;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 32px;
}

.solution-item .-image {
    width: 100%;
    margin-bottom: 32px;
    transition: transform 0.4s;
}

.solution__body1 {
    height: 40%;
    opacity: 0.8;
    margin: 16px 0;
}

.solution__button {
    min-width: 100%;
    width: 100%;
    align-self: center;
    display: flex;
    justify-content: center;
    margin: auto 0 0 0;
}

.solution-dots {
    display: none;
}

.png-animation {
    width: 100%;
    position: relative;
}

.png-animation img:first-child {
    position: relative;
}

.png-animation img {
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    /* display: none; */
    /* visibility: hidden; */
}

.png-animation img.-active {
    opacity: 1;
    /* display: block; */
    /* visibility: visible; */
}

/* ! payment processing */

.signpost {
    color: rgba(15, 60, 138, 0.8);
}

.payment__about-wrapper {
    overflow: hidden;
}

.payment__about {
    margin-top: 80px;
}

.payment__about .title,
.payment__about .title * {
    letter-spacing: -0.02em;
}

.payment__about .title {
    max-width: 1216px;
}

.payment__signpost-about {
    margin-bottom: 32px;
}

.animation-section {
    margin: 160px 0;
}

.animation-1,
.animation-2 {
    width: min(100%, 1328px);
    margin: 0 auto;
}

.svg-lines-animations-container {
    position: relative;
}

.default-svg-animation {
    pointer-events: none;
    position: relative;
    width: 100%;
}

.default-svg-animation svg:not(.svg-arrow) {
    z-index: 1;
}

.default-svg-animation svg.svg-arrow {
    z-index: 5;
}

.default-svg-animation.mobile-animation {
    display: none;
}

.default-svg-animation svg:first-child {
    position: relative !important;
}

.default-svg-animation .glob-animation-group,
.default-svg-animation .animation-group {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
}

.default-svg-animation .glob-animation-group .svg-arrow {
    z-index: 10;
    opacity: 0;
    transition: opacity 0.4s;
}

.default-svg-animation .glob-animation-group.-active .svg-arrow {
    opacity: 1;
}

.default-svg-animation .glob-animation-group:first-child,
.default-svg-animation .glob-animation-group:first-child .animation-group:first-child {
    position: relative;
}

.default-svg-animation .glob-animation-group:first-child .animation-group:first-child svg:first-child {
    position: relative !important;
}

.default-svg-animation svg {
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.svg-arrow {
    position: absolute;
    z-index: 5;
    width: 24px !important;
    height: 24px !important;
    display: block;
}

body:not(.-apple) .svg-arrow {
    box-shadow: 0px 4px 10px rgba(7, 27, 110, 0.12);
    border-radius: 50%;
}

.animation-group .svg-arrow {
    z-index: 3;
}

.line-for-animation .blue-line {
    position: relative;
    opacity: 0;
    transition: opacity 0.4s;
}

.default-svg-animation svg.-animation-process {
    z-index: 2;
}

.default-svg-animation svg.-previous-animation-process {
    z-index: 2;
}

.line-for-animation.-animation-process .blue-line {
    opacity: 1;
}

.cards-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
    width: 100%;
    height: inherit;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}

.cards-wrapper .col {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.animation-card {
    background: #FFFFFF;
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: min(24px, 1.647vw);
    transition: border 0.4s;
    border: 2px solid var(--color-white);
}

.animation-card.-active {
    border-color: var(--color-blue);
}

.animation-card.customer-card {
    display: block;
    position: relative;
    border-radius: min(12px, 0.823vw);
    width: min(208px, 14.276vw);
    height: min(132px, 9.06vw);
    margin-bottom: min(20px, 1.3726vw);
    padding: min(16px, 1.098vw) min(16px, 1.098vw) min(16px, 1.098vw) min(12px, 0.823vw);
}

.animation-card.customer-card img {
    width: 100%;
    display: block;
}

.animation-card.customer-card .title {
    margin-top: min(12px, 0.823vw);
}

.animation-card.customer-card .outer-img {
    position: absolute;
    right: min(-16px, -1.098vw);
    bottom: min(-20px, -1.372vw);
    border-radius: 50%;
    width: min(64px, 4.392vw);
    height: min(64px, 4.392vw);
    display: flex;
    justify-content: center;
    align-items: center;
    background: #FFFFFF;
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
}

.animation-card.customer-card .outer-img .img {
    position: relative;
    width: min(1.6472vw, 24px);
    height: min(1.6472vw, 24px);
}

.animation-card .img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: opacity 0.4s;
}

.animation-card .img img:last-child {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
}

.animation-card.-active .img img:last-child {
    opacity: 1;
}

.animation-card.-active .img img:first-child {
    opacity: 0;
}

.animation-card {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-radius: min(12px, 0.823vw);
    width: min(320px, 21.962vw);
    height: min(96px, 6.588vw);
    padding: min(24px, 1.647vw) min(24px, 1.647vw) min(24px, 1.647vw) min(24px, 1.647vw);
}

.animation-card>.img {
    position: relative;
    width: min(32px, 2.196vw);
    height: min(32px, 2.196vw);
}

.animation-card .img+.content {
    margin-left: min(24px, 1.647vw);
}

.animation-card+.animation-card {
    margin-top: min(16px, 1.098vw);
}

.animation-card .title {
    font-size: min(1.098vw, 16px);
    color: var(--title-on-light-section);
    font-family: 'Avenir Next';
    font-weight: 600;
    line-height: 140%;
    letter-spacing: 0.02em;
}

.animation-card .text {
    font-family: 'Avenir Next';
    font-weight: 500;
    font-size: min(0.9608vw, 14px);
    line-height: 130%;
    letter-spacing: 0.02em;

    color: var(--title-on-light-section);
    opacity: 0.8;
}

.animation-card .title+.text {
    margin-top: min(4px, 0.274vw);
}


.cards-wrapper.-accordions {
    height: 100%;
}

.cards-wrapper.-accordions .col {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    pointer-events: none;
}

.cards-wrapper.-accordions .col .animation-card {
    pointer-events: auto;
}

.cards-wrapper.-accordions .col-1 {
    align-items: flex-start;
}

.cards-wrapper.-accordions .col-2 {
    align-items: center;
    justify-content: flex-start;
}

.cards-wrapper.-accordions .col-3 {
    align-items: flex-end;
}

.cards-wrapper.-accordions .animation-card {
    border: none;
}

.cards-wrapper.-accordions .animation-card {
    background: #FFFFFF;
    box-shadow: 0px 12px 32px -16px rgba(10, 36, 88, 0.5);
    width: min(152px, 27.941%);
    height: min(152px, 27.941%);
    min-width: min(152px, 27.941%);
    min-height: min(152px, 27.941%);
    border-radius: min(32px, 21.052%);

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.cards-wrapper.-accordions.s2s .animation-card {
    margin-bottom: min(62px, 11.071%);
    padding: min(30px, 19.73%) min(11px, 7.23%) min(30px, 19.73%) min(11px, 7.23%);
}

.cards-wrapper.-accordions .animation-card+.animation-card {
    margin-top: 0;
}

.cards-wrapper.-accordions .col-2 .animation-card {
    margin-bottom: min(80px, 14.285%);
}

.cards-wrapper.-accordions .col-2 .animation-card:last-child {
    margin-bottom: 0;
}



.cards-wrapper.-accordions .animation-card.user-card {
    width: min(96px, 17.64%);
    height: min(96px, 17.64%);
    min-width: min(96px, 17.64%);
    min-height: min(96px, 17.64%);
    border-radius: 50%;
    padding: 0;
}

.cards-wrapper.-accordions .animation-card.user-card .img {
    width: min(32px, 33.35%);
    height: min(32px, 33.35%);
}

.cards-wrapper.-accordions .animation-card .img {
    width: min(32px, 30.77%);
    height: min(32px, 30.77%);
}

.cards-wrapper.-accordions .animation-card .img+.text {
    margin-top: min(16px, 1.098vw);
}

.cards-wrapper.-accordions .animation-card .text {
    width: 100%;
    text-align: center;
    font-size: min(87.5%, 14px);
}

.cards-wrapper.h2h .col .animation-card:first-child {
    margin-top: min(87px, 15.993%);
}

.cards-wrapper.-accordions.h2h .col.col-1 .animation-card,
.cards-wrapper.-accordions.h2h .col.col-3 .animation-card {
    margin-bottom: 0;
    margin-top: min(112px, 20.74%);
}

.cards-wrapper.cashier .col .animation-card {
    margin-bottom: min(16px, 2.85%);
}

.cards-wrapper.-accordions.cashier .col-2 .animation-card:last-child {
    margin-bottom: min(16px, 2.85%);
}

.cards-wrapper.cashier .col-2 {
    justify-content: center;
}

.cards-wrapper.cashier .col-1,
.cards-wrapper.cashier .col-3 {
    justify-content: space-between;
}




.animation-2 .animation-card.customer-card .title,
.animation-2 .col-3 .animation-card .title {
    font-size: min(14px, 0.972vw);
    line-height: 130%;
}

.animation-2 .col-2 .animation-card {
    border-radius: min(80px, 5.55vw);
    width: min(360px, 25vw);
    height: min(80px, 5.55vw);
    padding: min(6px, 0.416vw);
}

.animation-2 .col-2 .animation-card .img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: min(64px, 4.44vw);
    height: min(64px, 4.44vw);
    border-radius: 50%;
    background-color: var(--color-dark-blue);
    transition: background 0.4s;
}

.animation-2 .col-2 .animation-card.-active .img {
    background-color: var(--color-blue);
}

.animation-2 .col-2 .animation-card .img img {
    opacity: 1 !important;
    position: relative !important;
    width: min(32px, 2.196vw);
    height: min(32px, 2.196vw);
}

.animation-2 .col-2 .animation-card+.animation-card {
    margin-top: min(24px, 1.66vw);
}

.animation-2 .col-3 .animation-card {
    border-radius: min(24px, 1.647vw);
    width: min(208px, 14.44vw);
    height: min(112px, 7.77vw);
    padding: min(10px, 0.694vw) min(30px, 2.083vw);
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.animation-2 .col-3 .animation-card .img+.content {
    margin-left: 0;
    margin-top: min(14px, 0.97vw);
}


/* .payment__scheme {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 160px;
}

.payment__scheme img {
    width: 100%;
}

.scheme-image-mobile {
    display: none;
} */

/* .scheme__customer {
    position: relative;
    width: 208px;
    height: 132px;
    background: var(--color-white);
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.scheme__customer .-yellowline {
    margin-bottom: 30px;
}

.scheme__customer .-user {
    position: absolute;
    bottom: -20px;
    right: -20px;
    width: 64px;
    height: 64px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-white);
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: 50%;
}

.scheme__item {
    display: flex;
    align-items: center;
    width: 320px;
    height: 96px;
    padding: 26px 24px;
    margin-top: 16px;
    background: var(--color-white);
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: 24px;
}

.payment__scheme .-active {
    border: 2px solid #32A8FF;
}

.scheme__item .-info {
    margin-left: 24px;
} */


.payment-benefits__wrapper {
    margin-top: 200px;
}


.payment-benefits {    
    display: flex;
    align-items: flex-start;
}

.payment-benefits__text {
    width: 45%;
    margin-right: 128px;
}

.payment-benefits .-title {
    margin-top: 32px;
}

.payment-benefits .-description {
    margin: 24px 46px 0 0;
    color: var(--text-on-light-section);
}

.payment-benefits .-button {
    margin-top: 42px;
}

.payment-benefits .-button-hidden {
    display: none;
}

.payment-benefits__items {
    width: 54%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: -16px;
}

.payment-benefits__items .swiper-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

.payment-benefits__items .swiper-wrapper .benefits-card {
    height: auto;
}

.benefits-card {
    width: calc(50% - 8px);
    min-height: 244px;
    margin-bottom: 16px;
    padding: 24px 24px 32px 24px;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}

.benefits-card .-ico {
    width: 80px;
    height: 80px;
    background: var(--color-bg-grey);
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.benefits-card .-ico-container {
    max-width: 40px;
    max-height: 60px;
}

.benefits-card img {
    max-width: 100%;
    display: block;
    max-height: 100%;
    object-fit: contain;
}

.benefits-card__title {
    width: 100%;
    margin-top: 16px;
}

.benefits-card__description {
    margin-top: 8px;
}

.slider-benefits__items .benefits-card {
    justify-content: flex-start;
}

.slider-benefits__items .benefits-card__title {
    margin-top: 52px;
}

/* ! Smart routing */

.smart-routing .scheme__middle .scheme__item {
    background: #FFFFFF;
    width: 360px;
    height: 80px;
    padding: 8px;
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: 80px;
}

.smart-routing .scheme__middle .scheme__image {
    width: 64px;
    height: 64px;
    background: #0F3C8A;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.smart-routing .scheme__bank .scheme__item {
    width: 208px;
    height: 112px;
    background: #FFFFFF;
    padding: 24px 32px;
    box-shadow: 8px 12px 24px -8px rgba(10, 36, 88, 0.12);
    border-radius: 24px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

/* active на центральних ітемах */
.smart-routing .scheme__middle .-active {
    border: 2px solid #32A8FF;
}

.smart-routing .scheme__middle .-active .scheme__image {
    background: var(--color-blue);
}

.smart-routing .scheme__bank .-active {
    border: 2px solid #32A8FF;
}

.smart-routing .scheme__bank .scheme__item .-info {
    margin-left: 0;
}


.routing-benefits {
    display: block;
    padding: 16px 16px 21px 16px;
}


/* ! Solution Global coverage */



/*! form  */

.form-section {
    position: relative;
    padding: 160px 0 80px 0;
    background: var(--color-black-blue);
    overflow: hidden;
}

.form-section .signpost {
    color: var(--color-white);
    opacity: 0.8;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.form-section__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.form-section__title {
    text-align: center;
    margin-top: 28px;
}

.form-section .form {
    margin-top: 60px;
    width: 100%;
    max-width: 880px;
}


.form-wrapper .blur-item:nth-child(1) {
    margin: 270px 0 0 361px;
    width: 816px;
}

.form-wrapper .blur-item:nth-child(2) {
    margin: 205px 0 0 -76px;
    width: 809px;
}

.form-wrapper .blur-item:nth-child(3) {
    margin: 132px 0 0 -362px;
    width: 808px;
}

.form-wrapper .blur-item:nth-child(4) {
    margin: -267px 0 0 322px;
    width: 846px;
}

.form-wrapper .blur-item:nth-child(5) {
    margin: -267px 0 0 -247px;
    width: 816px;
}

.form-section .container>* {
    z-index: 2;
}

.form-wrapper {
    position: relative;
}

.form-wrapper.-is-send .thanks-modal {
    opacity: 1;
    pointer-events: auto;
}

.form-wrapper.-is-send .form-with-title {
    opacity: 0;
    pointer-events: none;
}

.thanks-modal {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

.thanks-modal .img {
    max-width: 132px;
}

.thanks-modal .img img {
    display: block;
    max-width: 100%;
}

.thanks-modal .img+.title {
    margin-top: 37px;
}

.thanks-modal .title+.text {
    margin-top: 24px;
}

.thanks-modal .text+.button {
    margin-top: 40px;
}

.form-with-title {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: opacity 0.4s;
}

/* ! Contact us page */

.contact-us {
    padding-bottom: 96px;
    padding-top: 16px;
}

.hidden_overflow {
    overflow-x: hidden;
}

.contact-us__title {
    width: 432px;
}

.contact-us__title .-text {
    margin-top: 27px;
}


.contacts-cards {
    margin-top: 65px;
    display: flex;
    justify-content: space-between;
}

.contacts-cards .card {
    width: calc(50% - 8px);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0px 40px 64px -24px rgba(2, 10, 40, 0.8);
    backdrop-filter: blur(80px);
    border-radius: 32px;
}

.card-media {
    padding: 40px 74px 40px 40px;
}

.card-media__contacts {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.card-media__contacts>* {
    margin-bottom: 24px;
}

.card-media__contacts>*:not(:last-child) {
    margin-right: 30px;
}

.card-media__contacts .-description {
    margin-top: 9px;
}

.card-media__contacts a {
    display: block;
    transition: 0.4s;
}

.card-media__contacts a:hover {
    color: var(--color-blue)
}

.card-media__social {
    margin-top: 16px;
}

.card-media__social .-text {
    margin-bottom: 12px;
}

.card-text {
    padding: 40px;
}

.card-text .-description {
    max-width: 492px;
    margin-top: 16px;
    opacity: 0.8;
}

.card-text .-button {
    margin-top: 32px;
}

/* ! About us page */
.about-us {
    min-height: 840px;
    color: var(--color-white);
    padding-top: 16px;
    background: var(--color-black-blue);
    border-radius: 0px 0px 64px 64px;
    position: relative;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.about-us .container {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    grid-column: span 12;
    height: 100%;
    width: 100%;
}

.about-us .--breadcrumb-wrapper {
    margin-bottom: 0;
}

.about-us .blur-item:nth-child(1) {
    width: 854px;
    margin: -122px 0 0 -510px;
}

.about-us .blur-item:nth-child(2) {
    width: 834px;
    margin: 119px 0 0 -475px;

}

.about-us .blur-item:nth-child(3) {
    width: 882px;
    margin: 163px 0 0 451px;

}

.about-us .blur-item:nth-child(4) {
    width: 782px;
    margin: 311px 0 0 -235px;
}

.about-us__balls {
    position: absolute;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.about-us__bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.about-us__bg .png-animation {
    width: 100%;
    display: block;
    max-height: 100%;
    max-width: 1600px;
}

/* .about-us__bg picture {
    width: 100%;
    height: 100%;
}

.about-us__bg img,
.about-us__bg picture {
    width: 100%;
    display: block;
    max-height: 100%;
    max-width: 1600px;
    object-fit: contain;
} */

.balls-item:nth-child(1) {
    background: url(../images/about-us/about-us-ball-blue.png);
    background-repeat: no-repeat;
    width: 105px;
    height: 105px;
    transform: translate(-272px, 190px);
}

.balls-item:nth-child(2) {
    background: url(../images/about-us/about-us-ball-red.png);
    width: 53px;
    height: 53px;
    background-repeat: no-repeat;
    transform: translate(309px, 172px);
}

.balls-item:nth-child(3) {
    background: url(../images/about-us/about-us-ball-pink.png);
    width: 95px;
    height: 95px;
    background-repeat: no-repeat;
    transform: translate(552px, 107px);
}

.balls-item:nth-child(4) {
    background: url(../images/about-us/about-us-ball-yellow.png);
    width: 74px;
    height: 74px;
    background-repeat: no-repeat;
    transform: translate(380px, -241px);
}

.balls-item:nth-child(5) {
    background: url(../images/about-us/about-us-ball-green.png);
    width: 80px;
    height: 80px;
    background-repeat: no-repeat;
    transform: translate(-734px, -189px);
}

.about-us__inner {
    display: flex;
    justify-content: center;
    margin: 64px 0 180px 0;
}

.about-us__inner * {
    z-index: 2;
}

.--dark-section .breadcrumb {
    color: var(--color-white);
}

.--dark-section .breadcrumb a:before,
.--dark-section .breadcrumb p:before {
    background: var(--color-white);
}

.breadcrumb * {
    z-index: 2;
}

.about-us__title {
    max-width: 1104px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.about-us__title .anchor {
    margin-top: 44px;
}

/* ! About us page| our value section */

.our-values {
    padding: 320px 0 120px 0;
    border-radius: 0px 0px 64px 64px;
}

.our-values__inner {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.our-values__text {
    position: sticky;
    top: min(40%, 250px);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 566px;
    width: 40%;

}

.our-values__text .-text {
    margin-top: 28px;
    max-width: 522px;
    opacity: 0.8;
}

.our-values__text.hidden {
    margin-top: min(250px, 40%);
    opacity: 0;
    pointer-events: none;
}




.our-values__cards {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    pointer-events: none;
}

.our-values__cards .section-blur {
    z-index: -1;
}

.our-values__card {
    width: 320px;
    min-height: 360px;
    padding: 64px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    background: rgba(40, 53, 93, 0.7);
    box-shadow: 0px 40px 64px -24px rgb(2 10 40 / 80%);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    pointer-events: auto;
}

.our-values__card img {
    width: 92px;
    display: block;
}

.our-values__card .title {
    margin-top: 40px;
}

.our-values__card .text {
    opacity: 0.8;
    margin-top: 16px;
}


.our-values__card:nth-child(1) {
    margin: -282px 0 0 auto;
}

.our-values__card:nth-child(2) {
    margin: -200px auto 0 0;
}

.our-values__card:nth-child(3) {
    margin: -117px -111px 0 0;

}

.our-values__card:nth-child(4) {
    margin: -123px auto 0 112px;

}

.our-values__card:nth-child(5) {
    margin: -157px 112px 0 auto;
}

.our-values__card:nth-child(6) {
    margin: -83px 560px 0 auto;
}




.about-us__blog {
    color: #253556;
    padding: 160px 0;
    background: #F0F1FA;
    border-radius: 0px 0px 64px 64px;
}

.about-us__blog .solution-blog+.solution-blog {
    margin-top: 40px;
}

.about-us__blog .solution-blog__inner {
    margin-top: 0;
}

.solution-blog__wrapper {
    overflow: hidden;
}

/* ! Blog page  */

.blog {
    overflow: hidden;
    padding-bottom: 120px;
}

.blog__title-desc {
    margin-top: 27px;
}

.big-post .post__image {
    min-height: 100%;
    height: 100%;
}

.big-post .post__image {
    height: 540px;
}


.post__image {
    border-radius: 16px;
    overflow: hidden;
}

.post:not(.big-post) .post__image {
    height: 360px;
}

.post__image img {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
    box-shadow: 0px 24px 56px rgba(38, 51, 115, 0.16);
    border-radius: 16px;
    transition: transform 0.4s;
    transform: translateZ(0);
}

.blog__posts {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 64px;
}

.blog__posts .post:first-child {
    margin-top: 0;
}

.blog__posts .big-post {
    width: 100%;
    color: var(--color-white);
    position: relative;
}

.big-post .post__info {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 40px;
    background: linear-gradient(180deg, rgba(3, 14, 57, 0) 0%, rgba(3, 14, 57, 0.7) 100%, rgba(3, 14, 57, 0.8) 100%);
    border-radius: 24px;
}

.big-post .post__image,
.big-post .post__image img {
    border-radius: 24px;
}

.big-post .post__info .post__name {
    width: 55%;
}

.big-post .post__data .-calendar::before {
    content: '';
    margin-top: 2px;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE1LjgzMyAzLjMzM0g0LjE2N0MzLjI0NyAzLjMzMyAyLjUgNC4wOCAyLjUgNXYxMS42NjdjMCAuOTIuNzQ2IDEuNjY2IDEuNjY3IDEuNjY2aDExLjY2NmMuOTIgMCAxLjY2Ny0uNzQ2IDEuNjY3LTEuNjY2VjVjMC0uOTItLjc0Ni0xLjY2Ny0xLjY2Ny0xLjY2N1pNMTMuMzMyIDEuNjY3VjVNNi42NjggMS42NjdWNU0yLjUgOC4zMzNoMTUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==);
}

.big-post .post__data .-time::before {
    content: '';
    margin-top: 2px;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI2EpIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xMC4wMDEgMTguMzMzYTguMzMzIDguMzMzIDAgMSAwIDAtMTYuNjY2IDguMzMzIDguMzMzIDAgMCAwIDAgMTYuNjY2WiIvPjxwYXRoIGQ9Ik0xMCA1djVsMy4zMzMgMS42NjciLz48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDIwdjIwSDB6Ii8+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+);
}

.post {
    width: calc(50% - 8px);
    margin-top: 65px;
}

.post__name {
    margin-top: 32px;
    margin-right: 40px;
    transition: color 0.4s;
}

.post__data {
    margin-top: 16px;
    display: flex;
}

.post__data .-calendar {
    margin-right: 24px;
    display: flex;
    align-items: center;
}

.post__data .-calendar::before {
    content: '';
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE1LjgzMyAzLjMzM0g0LjE2N0MzLjI0NyAzLjMzMyAyLjUgNC4wOCAyLjUgNXYxMS42NjdjMCAuOTIuNzQ2IDEuNjY2IDEuNjY3IDEuNjY2aDExLjY2NmMuOTIgMCAxLjY2Ny0uNzQ2IDEuNjY3LTEuNjY2VjVjMC0uOTItLjc0Ni0xLjY2Ny0xLjY2Ny0xLjY2N1pNMTMuMzMyIDEuNjY3VjVNNi42NjggMS42NjdWNU0yLjUgOC4zMzNoMTUiIHN0cm9rZT0iIzI1MzU1NiIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==);
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.post__data .-time {
    display: flex;
    align-items: center;
}

.post__data .-time::before {
    content: '';
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI2EpIiBzdHJva2U9IiMyNTM1NTYiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xMC4wMDEgMTguMzMzYTguMzMzIDguMzMzIDAgMSAwIDAtMTYuNjY2IDguMzMzIDguMzMzIDAgMCAwIDAgMTYuNjY2WiIvPjxwYXRoIGQ9Ik0xMCA1djVsMy4zMzMgMS42NjciLz48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDIwdjIwSDB6Ii8+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+);
    width: 20px;
    height: 20px;
    margin-right: 8px;
}


.button-show-more {
    width: 100%;
    margin-top: 51px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.blog .button__transparent::before {
    content: '';
    background: no-repeat center / contain url(../images/blog/ArrowsClockwise.svg);
    width: 20px;
    height: 20px;
    margin-right: 8px;
    text-align: center;
    animation: rotating 1s linear infinite;
    animation-play-state: paused;
}

.blog .button__transparent.-loading:before {
    animation-play-state: running;
}



@-webkit-keyframes rotating

/* Safari and Chrome */
    {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.blog .button__transparent::after {
    display: none;
}

.subscribe {
    overflow: hidden;
    padding: 120px 0 102px 0;
}

.subscribe__inner {
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0px 40px 64px -24px rgba(2, 10, 40, 0.8);
    backdrop-filter: blur(80px);
    border-radius: 32px;
    padding: 56px;
    display: flex;
    justify-content: space-between;
}

.subscribe__text {
    max-width: 450px;
}

.subscribe__text .-description {
    margin-top: 24px;
    color: rgba(255, 255, 255, 0.8)
}

.subscribe__media {
    width: 50%;
    max-width: 600px;
}

.subscribe .input-box input {
    width: 100%;
    height: 72px;
    padding: 20px 72px 22px 39px;

    font-family: 'Avenir Next';
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 140%;
    letter-spacing: 0.02em;
}

.subscribe .input-box input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.subscribe .input-box {
    position: relative;
    width: 100%;
}

.subscribe__media .send-email {
    position: absolute;
    width: 72px;
    height: 72px;
    top: 0;
    right: 0;
    z-index: 2;
    background: var(--color-blue);
    box-shadow: 0px 16px 40px -24px #32A8FF;
    border-radius: 12px;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;

}


.subscribe__media .send-email::after {
    content: '';
    position: absolute;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEuMzM1LjU4YS43NS43NSAwIDAgMC0xLjA3LjgxN2wyLjEwNCA3LjI3NWEuNzUuNzUgMCAwIDAgLjU5NS41MzFsOC41MzUgMS40M2MuNDAyLjA3OS40MDIuNjU1IDAgLjczNWwtOC41MzUgMS40MjlhLjc1Ljc1IDAgMCAwLS41OTUuNTMxTC4yNjQgMjAuNjAzYS43NS43NSAwIDAgMCAxLjA3MS44MTdsMTkuNS05Ljc1YS43NS43NSAwIDAgMCAwLTEuMzRMMS4zMzUuNThaIiBmaWxsPSIjZmZmIi8+PC9zdmc+);
    width: 21px;
    height: 21px;
    z-index: 5;
}

.subscribe__media .checkbox {
    margin-top: 24px;
}

.subscribe__media .card-media__social {
    display: flex;
    margin-top: 48px;
}

.subscribe__media .card-media__social p {
    padding-right: 24px;
    max-width: 141px;
}

/* ! Blog post page */

.blog-post {
    padding-bottom: 160px;
}

.blog-post .--breadcrumb-wrapper {
    height: 96px;
}

.blog-post__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.blog-post__image {
    width: 100%;
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 24px;
    overflow: hidden;
}

.blog-post__image img {
    width: 100%;
    display: block;
    border-radius: 24px;
}

.blog-post__inner .post__info {
    max-width: 880px;
    width: 100%;
    margin-top: 55px;
}

.post-editor {
    max-width: 880px;
}

.post-editor h2 {
    font-weight: 600;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -0.01em;
    margin-top: 40px;
}

.post-editor p {
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.02em;
    margin-top: 24px;
}

.post-editor p strong {
    font-weight: 600;
    line-height: inherit;
}

.post-editor hr {
    margin-top: 39px;
    color: var(--color-black-blue);
    border: none;
    border-bottom: 2px solid rgba(37, 53, 86, 0.15);
}

.post-editor p>img {
    width: 100%;
    margin-top: 40px;
    box-shadow: inset 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 16px;
    display: block;
}

.post-editor a {
    color: var(--color-blue);
    font-weight: 600;
    transition: 0.4s;
    cursor: pointer;
}

.post-editor a:hover {
    opacity: 0.7;
}

.post-editor ul li {
    list-style-type: none;
    position: relative;
}

.post-editor ul li::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--title-on-light-section);
    display: inline-block;
    position: absolute;
    left: 13px;
    top: 8px;
}

.post-editor ol {
    counter-reset: section;
}

.post-editor ol li::before {
    content: counter(section) '.';
    counter-increment: section;

    position: absolute;
    font-family: 'Mont';
    font-weight: 800;
    font-size: 16px;
    line-height: 150%;
    left: 10px;
}

.post-editor ol li::marker {
    font-weight: bold;
}

.post-editor li {
    position: relative;
    margin-top: 16px;
    padding-left: 32px;
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.02em;
}

.blog-slider {
    padding: 120px 0 96px 0;
    /* overflow: hidden; */
}

.blog-slider__title {
    display: flex;
    justify-content: space-between;
}

.blog-slider__items {
    margin-top: 70px;
    overflow: hidden;
}

.blog-slider__items .post {
    margin-top: 0;
}

.blog-slider__arrows {
    display: flex;
}

.blog-slider__arrows .-arrow {
    position: relative;
    width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: border 0.4s, background 0.4s;
}

.blog-slider__arrows .arrow-before {
    margin-right: 16px;
}

.blog-slider__arrows .-arrow:before {
    content: '';
    background: no-repeat center / contain url(../images/arrows/arrow-short-white.svg);
    width: 12px;
    height: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.4s;
}

.blog-slider__arrows .-arrow:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: background 0.4s, transform 0.4s;
    background: rgba(255, 255, 255, 0);
}

.blog-slider__arrows .arrow-before:before {
    transform: rotate(180deg);
}

.blog-slider__items .post__data .-calendar::before {
    content: '';
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE1LjgzMyAzLjMzM0g0LjE2N0MzLjI0NyAzLjMzMyAyLjUgNC4wOCAyLjUgNXYxMS42NjdjMCAuOTIuNzQ2IDEuNjY2IDEuNjY3IDEuNjY2aDExLjY2NmMuOTIgMCAxLjY2Ny0uNzQ2IDEuNjY3LTEuNjY2VjVjMC0uOTItLjc0Ni0xLjY2Ny0xLjY2Ny0xLjY2N1pNMTMuMzMyIDEuNjY3VjVNNi42NjggMS42NjdWNU0yLjUgOC4zMzNoMTUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==);
}

.blog-slider__items .post__data .-time::before {
    content: '';
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI2EpIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xMC4wMDEgMTguMzMzYTguMzMzIDguMzMzIDAgMSAwIDAtMTYuNjY2IDguMzMzIDguMzMzIDAgMCAwIDAgMTYuNjY2WiIvPjxwYXRoIGQ9Ik0xMCA1djVsMy4zMzMgMS42NjciLz48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDIwdjIwSDB6Ii8+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+);
}

.blog-slider__items .swiper-pagination {
    display: none;
}


/* ! FAQ page  */
.faq {
    padding-bottom: 120px;
    color: var(--title-on-light-section);
}

.faq__inner {
    display: grid;
    align-items: flex-start;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 84px;
    gap: 16px;
}

.faq__inner>.accordions {
    grid-column: span 2;
}

.faq__title {
    text-align: left;
}

.accordion__item {
    width: 100%;
    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 24px;
}

.accordion__item+.accordion__item {
    margin-top: 16px;
}

.accordion__question {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    cursor: pointer;

    padding: 29px 24px 24px 32px;
}

.accordion__question .plus {
    min-width: 40px;
    width: 40px;
    height: 40px;
    margin-top: -5px;
    position: relative;
    margin-left: 24px;
    border: 1px solid hsla(218, 80%, 30%, 0.2);
    border-radius: 50%;
    transition: background 0.4s, transform 0.4s, border 0.4s;
    transform: translateZ(0) rotate(0deg);
}

.accordion__question .plus::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0LjUgMjBIMjUuNSIgc3Ryb2tlPSIjMEYzQzhBIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIwIDE0LjVWMjUuNSIgc3Ryb2tlPSIjMEYzQzhBIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);
    width: 100%;
    height: 100%;
    transition: opacity 0.4s;
}

.accordion__question .plus::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0LjUgMjBIMjUuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yMCAxNC41VjI1LjUiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K);
    width: 100%;
    height: 100%;
    transition: opacity 0.4s;
    opacity: 0;
}

.accordion__content {
    opacity: 0.8;
    overflow: hidden;
    padding: 0 32px 32px 32px;
}

.accordion__item.-open .plus {
    transform: translateZ(0) rotate(45deg);
    background: var(--color-dark-blue);
    border-color: var(--color-dark-blue);    
}

.accordion__item.-open .plus::after {
    opacity: 1;
}

.accordion__item.-open .plus::before {
    opacity: 0;
    /* transform: translateZ(0) rotate(45deg);
    filter: brightness(10); */
    /* background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0LjUgMjBIMjUuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yMCAxNC41VjI1LjUiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K); */
}

.accordion__item.-open .plus {
    background: var(--color-dark-blue);
}

.faq__contact {
    position: sticky;
    top: 123px;
    min-height: 240px;
    padding: 29px 24px 40px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

    grid-column: span 1;

    background: var(--color-white);
    box-shadow: 0px 24px 56px -24px rgba(38, 51, 115, 0.16);
    border-radius: 24px;
}

.faq__text {
    opacity: 0.8;
    margin: 16px 0 32px 0;
}

.faq__contact .button__blue {
    min-width: 320px;
}


/* ! Error 404*/

.error {
    min-height: 100vh;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.error .container {
    display: flex;
    justify-content: center;
    align-items: center;
    grid-column: span 12;
}

.error__inner {
    max-width: 432px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: var(--title-on-light-section);
}

.error__image {
    width: 280px;
}

.error__title {
    margin-top: 24px;
    text-align: center;
}

.error__text {
    margin-top: 21px;
    text-align: center;
}

.error__button {
    margin-top: 32px;
    width: 320px;
}

/* ! KYC Policy */

.kyc-policy {
    padding-bottom: 120px;
}

.kyc-policy__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.kyc-policy__inner h1 {
    text-align: center;
}

.policy-editor {
    margin-top: 24px;
    max-width: 880px;
    width: 100%;
}

.policy-editor h2 {
    font-weight: 600;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -0.01em;
    margin-top: 44px;
}

.policy-editor p {
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0.02em;
    margin-top: 23px;
}

.policy-editor hr {
    margin-top: 39px;
    color: var(--color-black-blue);
    border: none;
    border-bottom: 2px solid rgba(37, 53, 86, 0.15);
}

/*! modal-form */

.modal-form {
    position: fixed;
    left: 0;
    top: 0;
    height: var(--window-inner-height);
    width: 100vw;
    overflow: scroll;
    overflow-x: hidden;
    z-index: 10000;
    background: var(--color-black-blue);
    padding: 56px 56px 44px 56px;
    display: flex;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

.modal-form.-active {
    opacity: 1;
    pointer-events: auto;
}

.modal-form .close {
    position: absolute;
    right: 56px;
    top: 56px;
    display: flex;
    align-items: center;
    color: var(--color-white);
    cursor: pointer;
    opacity: 0.8;
}

.modal-form .close:before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 6px;

    background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMC4xNjQ0IDUuMjUwMTVMNS4yNTAxNSAyMC4xNjQ0TDMuODM1OTQgMTguNzUwMkwxOC43NTAyIDMuODM1OTRMMjAuMTY0NCA1LjI1MDE1WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjI1MDE1IDMuODM1OTRMMjAuMTY0NCAxOC43NTAyTDE4Ljc1MDIgMjAuMTY0NEwzLjgzNTk0IDUuMjUwMTVMNS4yNTAxNSAzLjgzNTk0WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);
    transition: transform 0.4s;
    transform: translateZ(0);
}

.modal-form__inner {
    width: 100%;
    max-width: 880px;
    margin: auto;
}

.modal-form__inner .form {
    margin-top: 40px;
}

.modal-form__inner .title {
    width: 100%;
}

.form {
    width: 100%;
}

.hidden-input-for-page-name {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}