@font-face {
    font-family: "CeraPro";
    src: url("../fonts/CeraPro-Black.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "CeraPro";
    src: url("../fonts/CeraPro-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "CeraPro";
    src: url("../fonts/CeraPro-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "CeraPro";
    src: url("../fonts/CeraPro-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

:root {
    --color-white: #ffffff;
    --color-blue-dark: #4a60f4;
    --color-blue: #1e90f5;
    --color-black: #151515;
    --color-dark: #141430;
    --color-grey: #7f7fa9;
    --color-bg: #f2f5ff;
    --color-grey-light: rgba(74, 96, 244, 0.2);
    --section-gap: 100px;
    --container-padding-x: 18px;
    --ease-out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@media (min-width: 767px) {
    :root {
        --section-gap: 140px;
        --container-padding-x: 40px;
    }
}

@media (min-width: 1300px) {
    :root {
        --section-gap: 200px;
    }
}

* {
    padding: 0;
    margin: 0;
    border: 0;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

aside,
nav,
footer,
header,
section {
    display: block;
}

html,
body {
    scrollbar-gutter: stable;
}

img,
video,
canvas,
svg {
    display: block;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}

input,
input::placeholder,
textarea,
textarea::placeholder {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}

input {
    width: 100%;
    float: left;
    display: block;
    margin: 0;
    padding: 0;
    border: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-transform: inherit;
}

input::-moz-placeholder {
    color: inherit;
}

input::placeholder {
    color: inherit;
}

input:focus,
input._fill {
    outline: none;
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input::-ms-clear {
    display: none;
}

button {
    display: inline-block;
    cursor: pointer;
    padding: 0;
    border: none;
    background: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}

button:disabled {
    cursor: default;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

a {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

img {
    vertical-align: top;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

ol,
ul {
    padding: 0;
}

ol[role="list"],
ul[role="list"],
ol[role="listbox"],
ul[role="listbox"] {
    list-style: none;
}

.container {
    max-width: 1680px;
    width: 100%;
    margin: 0 auto;
    padding-left: var(--container-padding-x);
    padding-right: var(--container-padding-x);
}

.container-sm {
    max-width: 1410px;
    width: 100%;
    margin: 0 auto;
    padding-left: var(--container-padding-x);
    padding-right: var(--container-padding-x);
}

html::-webkit-scrollbar,
.custom-scrollbar::-webkit-scrollbar {
    background-color: transparent;
    width: 4px;
    height: 4px;
    border-radius: 2px;
}

html::-webkit-scrollbar-track,
.custom-scrollbar::-webkit-scrollbar-track {
    background-color: transparent;
}

html::-webkit-scrollbar-thumb,
.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: var(--color-grey-light);
    border-radius: 2px;
}

html,
.custom-scrollbar {
    scrollbar-color: var(--color-grey-light) transparent;
    scrollbar-width: thin;
}

html.lenis,
html.lenis body {
    height: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: clip;
}

.lenis.lenis-smooth iframe {
    pointer-events: none;
}

::-moz-selection {
    background: #b3d4fc;
}

::selection {
    background: #b3d4fc;
}

::-moz-selection {
    background: #b3d4fc;
}

body {
    font-family: "CeraPro", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 400;
    background-color: var(--color-bg);
    color: var(--color-black);
}

/* body.lock {
  overflow: hidden;
} */

@media (min-width: 1023px) {
    body {
        font-size: 22px;
    }
}

main {
    overflow: hidden;
}

.h1 {
    font-size: 27px;
    line-height: 1;
    font-weight: 700;
}

@media (min-width: 767px) {
    .h1 {
        font-size: 44px;
    }
}

@media (min-width: 1300px) {
    .h1 {
        font-size: 50px;
        line-height: 1.1;
    }
}

@media (min-width: 1860px) {
    .h1 {
        font-size: 64px;
    }
}

.h2 {
    font-size: 20px;
    line-height: 1.1;
    font-weight: 700;
}

@media (min-width: 767px) {
    .h2 {
        font-size: 24px;
    }
}

@media (min-width: 1300px) {
    .h2 {
        font-size: 30px;
        font-weight: 500;
    }
}

.info {
    font-size: 14px;
    line-height: 1.3;
    font-weight: 500;
}

@media (min-width: 767px) {
    .info {
        font-size: 16px;
    }
}

@media (min-width: 1300px) {
    .info {
        font-size: 18px;
    }
}

.section-pt {
    padding-top: var(--section-gap);
}

.section-title {
    padding-bottom: 40px;
    text-align: center;
    max-width: 1260px;
    margin: 0 auto;
}

@media (min-width: 767px) {
    .section-title {
        padding-bottom: 64px;
    }
}

.section-title span {
    color: var(--color-blue-dark);
}

.embla__container {
    display: flex;
}

.embla__slide {
    flex: 0 0 100%;
    min-width: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.button-primary {
    display: block;
    padding: 16px 24px;
    border-radius: 60px;
    background-color: var(--color-blue-dark);
    color: var(--color-white);
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: background-color 0.2s ease-out;
    position: relative;
}

@media (min-width: 1023px) {
    .button-primary {
        padding: 20px 24px;
    }
}

.button-primary:hover {
    background-color: var(--color-blue);
}

.button-primary:disabled {
    background-color: var(--color-grey);
    color: var(--color-white);
}

.button-light {
    display: block;
    padding: 16px 24px;
    border-radius: 60px;
    background-color: rgba(74, 96, 244, 0.2);
    color: var(--color-black);
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition:
        background-color 0.2s ease-out,
        color 0.2s ease-out;
}

@media (min-width: 1023px) {
    .button-light {
        padding: 20px 24px;
    }
}

.button-light:hover {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.button-light:disabled {
    background-color: var(--color-grey);
    color: var(--color-white);
}

.button-dark {
    display: block;
    padding: 16px 24px;
    border-radius: 60px;
    background-color: var(--color-black);
    color: var(--color-white);
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: background-color 0.2s ease-out;
    position: relative;
}

@media (min-width: 1023px) {
    .button-dark {
        padding: 20px 24px;
    }
}

.button-dark:hover {
    background-color: var(--color-blue-dark);
}

.button-dark:disabled {
    background-color: var(--color-grey);
    color: var(--color-white);
}

.button-outline {
    display: block;
    padding: 16px 24px;
    border-radius: 60px;
    border: 1px solid var(--color-white);
    color: var(--color-white);
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: border-color 0.2s ease-out;
}

@media (min-width: 1023px) {
    .button-outline {
        padding: 20px 24px;
    }
}

.footer {
    padding-top: 120px;
    padding-bottom: 32px;
    margin-top: -27px;
    background: linear-gradient(
        0,
        rgba(74, 96, 244, 0.16) 0%,
        rgba(74, 96, 244, 0) 100%
    );
}

@media (min-width: 1023px) {
    .footer {
        padding-top: 160px;
        padding-bottom: 60px;
        margin-top: -32px;
    }
}

.footer__wrapper {
    border-radius: 60px;
    padding: 20px;
    background-color: var(--color-white);
}

.footer__logo {
    max-width: 308px;
    height: auto;
    margin: 0 auto;
}

[data-spoiler] [data-title] {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

[data-spoiler] [data-wrapper] {
    overflow: hidden;
    height: 0;
    transition: height 0.25s ease-out;
}

[data-spoiler].default [data-wrapper] {
    height: auto;
}

.label {
    display: inline-block;
    color: var(--color-blue-dark);
    background: rgba(74, 96, 244, 0.12);
    backdrop-filter: blur(8px);
    border-radius: 60px;
    padding: 16px 24px;
}

.pagination {
    display: flex;
    justify-content: center;
    margin-top: 24px;
    gap: 7px;
}

.pagination .embla__dot {
    background-color: #d1d1de;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.pagination .embla__dot--selected {
    background-color: var(--color-blue-dark);
}

.question + .question [data-title] {
    padding-top: 24px;
    margin-top: 24px;
    border-top: 1px solid rgba(74, 96, 244, 0.2);
}

@media (min-width: 1023px) {
    .question + .question [data-title] {
        margin-top: 74px;
        padding-top: 48px;
    }
}

.question [data-title] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    transition: color 0.2s ease-out;
}

.question [data-title] svg {
    flex: 0 0 40px;
}

@media (min-width: 767px) {
    .question [data-title] svg {
        flex: 0 0 48px;
    }
}

.question [data-content] {
    padding-top: 24px;
    color: var(--color-grey);
}

@media (min-width: 1023px) {
    .question [data-content] {
        width: calc(100% - 80px);
    }
}

.question.active [data-title] {
    color: var(--color-blue-dark);
}

.question.active [data-title] svg {
    rotate: 180deg;
}

.projects {
    position: relative;
}

.projects__img {
    height: 760px;
    border-radius: 30px;
}

@media (min-width: 1023px) {
    .projects__img {
        height: 800px;
    }
}

.projects__content {
    position: absolute;
    inset: 0;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media (min-width: 1023px) {
    .projects__content {
        padding: 30px;
    }
}

@media (min-width: 1860px) {
    .projects__content {
        padding: 60px;
    }
}

.projects__list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

@media (min-width: 1300px) {
    .projects__list {
        flex-direction: row;
        gap: 10px;
    }
}

.projects__li {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 16px 24px;
    border-radius: 50px;
    background-color: var(--color-white);
    color: var(--color-blue-dark);
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
    transition-property: color, background-color;
}

@media (min-width: 1300px) and (max-width: 1860px) {
    .projects__li {
        font-size: 16px;
    }
}

@media (min-width: 1300px) {
    .projects__li {
        flex-grow: 1;
    }
}

.projects__li.active {
    background-color: var(--color-blue-dark);
    color: var(--color-white);
}

.projects__tabs {
    background-color: var(--color-white);
    border-radius: 17px;
}

@media (min-width: 1023px) {
    .projects__tabs {
        align-self: start;
        min-width: 650px;
    }
}

@media (min-width: 1300px) {
    .projects__tabs {
        border-radius: 30px;
    }
}

.ptab {
    display: flex;
    gap: 17px;
    align-items: center;
    padding: 17px 16px;
    cursor: pointer;
}

@media (min-width: 1300px) {
    .ptab {
        gap: 30px;
        padding: 32px;
    }
}

.ptab + .ptab {
    border-top: 0.58px solid rgba(74, 96, 244, 0.2);
}

.ptab.active h3 {
    color: var(--color-blue-dark);
}

.ptab img {
    --img-size: 46px;
    width: var(--img-size);
    height: var(--img-size);
    flex: 0 0 var(--img-size);
    border-radius: 50px;
}

@media (min-width: 1023px) {
    .ptab img {
        --img-size: 80px;
    }
}

.ptab__info {
    display: flex;
    flex-direction: column-reverse;
    gap: 4px;
    margin-top: 9px;
    color: var(--color-grey);
}

@media (min-width: 1023px) {
    .ptab__info {
        margin-top: 16px;
        flex-direction: row;
        gap: 24px;
    }

    .ptab__info span + span {
        position: relative;
    }

    .ptab__info span + span::before {
        content: "";
        position: absolute;
        left: -12px;
        top: 50%;
        translate: 0 -50%;
        display: block;
        height: 20px;
        width: 0;
        border-left: 1px solid rgba(74, 96, 244, 0.2);
    }
}

.simple-grid {
    display: grid;
    grid-template-columns: 100%;
    gap: 16px;
}

@media (min-width: 1300px) {
    .simple-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
}

.simple {
    padding: 32px;
    background-color: var(--color-white);
    border-radius: 21px;
}

@media (min-width: 1023px) {
    .simple {
        border-radius: 30px;
    }
}

@media (min-width: 1300px) {
    .simple {
        padding: 32px;
    }
}

@media (min-width: 1860px) {
    .simple {
        padding: 48px;
    }
}

.simple img {
    height: 190px;
    width: auto;
    margin: 0 auto;
    transition: rotate 0.45s ease;
}

@media (min-width: 1300px) {
    .simple img {
        margin-top: 40px;
        height: 250px;
    }
}

@media (min-width: 1860px) {
    .simple img {
        height: 300px;
    }
}

.simple img:hover {
    rotate: 7deg;
}

.simple__content {
    padding-top: 24px;
    margin-top: 40px;
    border-top: 1px solid rgba(74, 96, 244, 0.2);
}

@media (min-width: 1023px) {
    .simple__content {
        padding-top: 30px;
        margin-top: 80px;
    }
}

@media (min-width: 1860px) {
    .simple__content {
        margin-top: 120px;
    }
}

.simple__content p {
    margin-top: 17px;
}

@media (min-width: 1023px) {
    .simple__content p {
        margin-top: 24px;
    }
}

.simple.active {
    background-color: var(--color-blue-dark);
    color: var(--color-white);
}

.simple.active .simple__content {
    border-top: 1px solid var(--color-white);
}

.label-do {
    display: none;
}

@media (min-width: 1023px) {
    .label-do {
        display: inline-block;
        margin: 0 auto;
        margin-top: 20px;
    }
}

.do {
    position: relative;
    display: flex;
    gap: 24px;
    align-items: center;
    padding: 20px;
    border-radius: 30px;
    background-color: transparent;
    transition: background-color 0.2s ease-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    overflow: hidden;
}

@media (min-width: 1023px) {
    .do {
        gap: 48px;
        padding: 48px;
    }
}

.do::after {
    content: "";
    display: block;
    position: absolute;
    inset: 0;
    opacity: 1;
    background: linear-gradient(
        180deg,
        rgba(241, 245, 255, 0) 0%,
        #f1f5ff 100%
    );
    transition: opacity 0.2s ease-out;
}

.do__num {
    width: 54px;
    height: 63px;
    flex: 0 0 54px;
}

@media (min-width: 1023px) {
    .do__num {
        width: 100px;
        height: 100px;
        flex: 0 0 100px;
    }
}

@media (min-width: 1860px) {
    .do__num {
        width: 132px;
        height: 132px;
        flex: 0 0 132px;
    }
}

.do__num img {
    height: 100%;
    width: auto;
}

.do__content h3 {
    color: var(--color-grey);
    transition: color 0.2s ease-out;
}

.do__content p {
    margin-top: 8px;
    color: var(--color-grey);
}

@media (min-width: 1023px) {
    .do__content p {
        margin-top: 24px;
    }
}

.do.active {
    background-color: var(--color-white);
}

.do.active h3 {
    color: var(--color-dark);
}

.do.active::after {
    opacity: 0;
}

.join-block {
    position: relative;
    z-index: 2;
    max-width: 920px;
    margin: 0 auto;
    padding-bottom: 27px;
}

@media (min-width: 1023px) {
    .join-block {
        padding-bottom: 32px;
    }
}

.join-block__bg {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100px;
    width: 100%;
    background-color: var(--color-blue-dark);
    border-radius: 30px;
    transition: translate 0.8s ease-out;
}

@media (min-width: 1023px) {
    .join-block__bg {
        width: calc(100% + 64px);
        height: calc(100% - 58px);
        left: -32px;
    }
}

.join-block__bgc {
    display: none;
}

@media (min-width: 1300px) {
    .join-block__bgc {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding: 30px;
        margin-left: auto;
        width: 410px;
        height: 100%;
        color: var(--color-white);
    }

    .join-block__bgc::before {
        content: "";
        display: block;
        position: absolute;
        top: -60px;
        left: 50%;
        translate: -50% 0;
        width: 250px;
        height: 230px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../img/icons/sticker.avif");
    }
}

.join-block__bgc .button-outline {
    margin-top: 30px;
}

.join-block__content {
    position: relative;
    z-index: 2;
    padding: 24px;
    background-color: var(--color-white);
    border-radius: 30px;
    transition: translate 0.8s ease-out;
}

@media (min-width: 767px) {
    .join-block__content {
        padding: 32px;
    }
}

@media (min-width: 1023px) {
    .join-block__content {
        padding: 60px;
    }
}

.join-block__content p {
    margin-top: 24px;
    color: var(--color-grey);
}

.join-block__content a {
    margin-top: 48px;
    width: 100%;
}

@media (min-width: 1023px) {
    .join-block__content a {
        margin-top: 64px;
    }
}

.join-block.active .join-block__bg {
    translate: 200px 0;
}

.join-block.active .join-block__content {
    translate: -200px 0;
}

@media (min-width: 1023px) {
    .mark {
        position: relative;
    }

    /* .mark::before {
        content: "";
        position: absolute;
        left: 5.45em;
        top: -0.38em;
        display: block;
        width: 24px;
        height: 24px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%234a60f4%22%20d%3D%22M9.968%206a1%201%200%200%201%20.915%201.402l-4.62%2010.5a1%201%200%200%201-.915.598h-2.03a1%201%200%200%201-.963-1.27l2.94-10.5A1%201%200%200%201%206.26%206zM20.61%206a1%201%200%200%201%20.828%201.563l-7.14%2010.5a1%201%200%200%201-.827.437h-1.939a1%201%200%200%201-.915-1.402l4.62-10.5A1%201%200%200%201%2016.152%206z%22%2F%3E%3C%2Fsvg%3E");
    } */
}

.vigoda-title {
    position: relative;
}

.vigoda-title h2 {
    padding: 24px 24px 57px;
    background-color: var(--color-white);
    border-radius: 22px;
}

@media (min-width: 1023px) {
    .vigoda-title h2 {
        border-radius: 30px;
        max-width: 75%;
    }
}

@media (min-width: 1300px) {
    .vigoda-title h2 {
        padding: 50px 38px 70px;
    }
}

@media (min-width: 1860px) {
    .vigoda-title h2 {
        padding: 60px 48px 80px;
    }
}

.vigoda-title h2 span {
    color: var(--color-blue-dark);
}

@media (min-width: 1023px) {
    .vigoda-title::after {
        content: "";
        position: absolute;
        z-index: 5;
        top: -20px;
        right: 0;
        width: 280px;
        height: 275px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../img/icons/percent.avif");
        pointer-events: none;
    }
}

@media (min-width: 1860px) {
    .vigoda-title::after {
        top: -56px;
        right: 60px;
        width: 340px;
        height: 275px;
    }
}

.vigoda-slider {
    position: relative;
    margin-top: -43px;
}

@media (min-width: 1023px) {
    .vigoda-slider {
        margin-top: -60px;
    }
}

@media (min-width: 1023px) {
    .vigoda-slider .pagination {
        display: none;
    }
}

.vslide {
    position: relative;
    flex: 0 0 256px;
    background-color: var(--color-white);
    border-radius: 22px;
}

@media (min-width: 1023px) {
    .vslide {
        flex: 0 0 25%;
        border-radius: 30px;
        transition: translate 0.8s ease-out;
    }
}

.vslide::after {
    content: "";
    display: block;
    position: absolute;
    z-index: 5;
    top: 86px;
    right: 0;
    translate: 50% 0;
    width: 56px;
    height: 58px;
    background-size: contain;
}

@media (min-width: 1023px) {
    .vslide::after {
        width: 80px;
        height: 80px;
        transition:
            translate 0.2s ease-out,
            opacity 0.2s ease-out;
        opacity: 0;
    }
}

.vslide:nth-child(1)::after {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22none%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20filter%3D%22url(%23a)%22%3E%3Crect%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22%23fff%22%20rx%3D%2240%22%2F%3E%3Cpath%20fill%3D%22%23151515%22%20d%3D%22M40%2020c-11%200-20%209-20%2020s9%2020%2020%2020%2020-9%2020-20-9-20-20-20m-6.34%2010.1c1.96%200%203.54%201.58%203.54%203.56%200%201.96-1.58%203.54-3.54%203.54-1.98%200-3.56-1.58-3.56-3.54%200-1.98%201.58-3.56%203.56-3.56M46.44%2050c-1.96%200-3.54-1.6-3.54-3.56s1.58-3.54%203.54-3.54S50%2044.48%2050%2046.44%2048.4%2050%2046.44%2050M33%2050.06l-3-3L47.06%2030l3%203z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22a%22%20width%3D%2284%22%20height%3D%2280%22%20x%3D%22-4%22%20y%3D%220%22%20color-interpolation-filters%3D%22sRGB%22%20filterUnits%3D%22userSpaceOnUse%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20result%3D%22hardAlpha%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%2F%3E%3CfeOffset%20dx%3D%22-4%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20k2%3D%22-1%22%20k3%3D%221%22%20operator%3D%22arithmetic%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.290196%200%200%200%200%200.376471%200%200%200%200%200.956863%200%200%200%200.2%200%22%2F%3E%3CfeBlend%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_2009_1527%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

@media (min-width: 1023px) {
    .vslide:nth-child(1)::after {
        translate: none;
    }
}

.vslide:nth-child(2)::after {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22none%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20filter%3D%22url(%23a)%22%3E%3Crect%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22%23fff%22%20rx%3D%2240%22%2F%3E%3Cpath%20fill%3D%22%23151515%22%20d%3D%22M54%2058c2.206%200%204-1.794%204-4V26c0-2.206-1.794-4-4-4H26c-2.206%200-4%201.794-4%204v28c0%202.206%201.794%204%204%204zM35.106%2035.316l8%204%203.106-6.21%203.578%201.79-4.894%209.79-8-4-3.106%206.21-3.578-1.79z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22a%22%20width%3D%2284%22%20height%3D%2280%22%20x%3D%22-4%22%20y%3D%220%22%20color-interpolation-filters%3D%22sRGB%22%20filterUnits%3D%22userSpaceOnUse%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20result%3D%22hardAlpha%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%2F%3E%3CfeOffset%20dx%3D%22-4%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20k2%3D%22-1%22%20k3%3D%221%22%20operator%3D%22arithmetic%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.290196%200%200%200%200%200.376471%200%200%200%200%200.956863%200%200%200%200.2%200%22%2F%3E%3CfeBlend%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_2009_1530%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

@media (min-width: 1023px) {
    .vslide:nth-child(2) {
        translate: -100% 0;
    }

    .vslide:nth-child(2)::after {
        translate: none;
    }
}

.vslide:nth-child(3)::after {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22none%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20filter%3D%22url(%23a)%22%3E%3Crect%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22%23fff%22%20rx%3D%2240%22%2F%3E%3Cpath%20fill%3D%22%23151515%22%20d%3D%22M42%2038V28h-4v14h12v-4zm10.728%2012.728L40%2063.456%2027.272%2050.728a18%2018%200%201%201%2025.456%200%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22a%22%20width%3D%2284%22%20height%3D%2280%22%20x%3D%22-4%22%20y%3D%220%22%20color-interpolation-filters%3D%22sRGB%22%20filterUnits%3D%22userSpaceOnUse%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20result%3D%22hardAlpha%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%2F%3E%3CfeOffset%20dx%3D%22-4%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20k2%3D%22-1%22%20k3%3D%221%22%20operator%3D%22arithmetic%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.290196%200%200%200%200%200.376471%200%200%200%200%200.956863%200%200%200%200.2%200%22%2F%3E%3CfeBlend%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_2009_1533%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

@media (min-width: 1023px) {
    .vslide:nth-child(3) {
        translate: -200% 0;
    }

    .vslide:nth-child(3)::after {
        translate: none;
    }
}

.vslide:nth-child(4)::after {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22none%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20filter%3D%22url(%23a)%22%3E%3Crect%20width%3D%2280%22%20height%3D%2280%22%20fill%3D%22%23fff%22%20rx%3D%2240%22%2F%3E%3Cpath%20fill%3D%22%23151515%22%20d%3D%22M54%2022a4%204%200%200%201%204%204v28a4%204%200%200%201-4%204H26a4%204%200%200%201-4-4V26a4%204%200%200%201%204-4zm-6.84%2028-1.9-8.16%206.32-5.46-8.34-.72L40%2028l-3.24%207.68-8.34.72%206.32%205.46-1.9%208.14L40%2045.68z%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22a%22%20width%3D%2284%22%20height%3D%2280%22%20x%3D%22-4%22%20y%3D%220%22%20color-interpolation-filters%3D%22sRGB%22%20filterUnits%3D%22userSpaceOnUse%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeColorMatrix%20in%3D%22SourceAlpha%22%20result%3D%22hardAlpha%22%20values%3D%220%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200%22%2F%3E%3CfeOffset%20dx%3D%22-4%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%222%22%2F%3E%3CfeComposite%20in2%3D%22hardAlpha%22%20k2%3D%22-1%22%20k3%3D%221%22%20operator%3D%22arithmetic%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.290196%200%200%200%200%200.376471%200%200%200%200%200.956863%200%200%200%200.2%200%22%2F%3E%3CfeBlend%20in2%3D%22shape%22%20result%3D%22effect1_innerShadow_2009_1481%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

@media (min-width: 1023px) {
    .vslide:nth-child(4) {
        translate: -300% 0;
    }

    .vslide:nth-child(4)::after {
        translate: none;
    }
}

.vslide__content {
    height: 100%;
    padding: 32px;
    overflow: hidden;
    border-radius: inherit;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left bottom;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22400%22%20height%3D%22556%22%20viewBox%3D%220%200%20400%20556%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_2401_1407)%22%3E%3Crect%20width%3D%22400%22%20height%3D%22556%22%20fill%3D%22white%22%2F%3E%3Cg%20filter%3D%22url(%23filter0_f_2401_1407)%22%3E%3Ccircle%20cx%3D%2229%22%20cy%3D%22477%22%20r%3D%22149%22%20fill%3D%22%234A60F4%22%20fill-opacity%3D%220.2%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3Cdefs%3E%3Cfilter%20id%3D%22filter0_f_2401_1407%22%20x%3D%22-470%22%20y%3D%22-22%22%20width%3D%22998%22%20height%3D%22998%22%20filterUnits%3D%22userSpaceOnUse%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeFlood%20flood-opacity%3D%220%22%20result%3D%22BackgroundImageFix%22%2F%3E%3CfeBlend%20mode%3D%22normal%22%20in%3D%22SourceGraphic%22%20in2%3D%22BackgroundImageFix%22%20result%3D%22shape%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%22175%22%20result%3D%22effect1_foregroundBlur_2401_1407%22%2F%3E%3C%2Ffilter%3E%3CclipPath%20id%3D%22clip0_2401_1407%22%3E%3Crect%20width%3D%22400%22%20height%3D%22556%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

@media (min-width: 1023px) {
    .vslide__content {
        padding: 48px;
    }
}

.vslide img {
    height: 100px;
    width: auto;
    -o-object-fit: contain;
    object-fit: contain;
}

.vslide h3 {
    margin-top: 60px;
}

.vslide p {
    margin-top: 17px;
}

.vigoda-slider.active .vslide {
    translate: none;
}

.vigoda-slider.active .vslide::after {
    translate: 50% 0;
    opacity: 1;
    transition-delay: 0.7s;
}

.ms-section {
    position: relative;
}

.ms-section::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 255px;
    background: linear-gradient(0, #f1f5ff 0%, rgba(241, 245, 255, 0) 100%);
}

@media (min-width: 1300px) {
    .ms-section::before {
        height: 300px;
    }
}

.ms-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.ms {
    position: relative;
    z-index: 5;
    padding-top: 20px;
    padding-bottom: 25px;
    max-width: 1880px;
}

@media (min-width: 1023px) {
    .ms {
        padding-top: 40px;
        padding-bottom: 40px;
    }
}

@media (min-width: 1300px) {
    .ms {
        padding-top: 60px;
        padding-bottom: 60px;
    }
}

.ms__wrap {
    position: relative;
    display: grid;
    grid-template-columns: 100%;
    gap: 32px;
    background-color: var(--color-white);
    border-radius: 30px;
    padding: 24px;
}

@media (min-width: 1023px) {
    .ms__wrap {
        grid-template-columns: 1fr 40%;
        justify-content: space-between;
        gap: 20px;
        align-items: center;
    }

    .ms__wrap::after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 50%;
        translate: -50% -50%;
        background-color: var(--color-black);
        width: 585px;
        height: 82px;
        border-radius: 60px;
        background-image: url("../img/icons/logo.svg");
        background-repeat: no-repeat;
        background-size: 490px auto;
        background-position: center;
    }
}

@media (min-width: 1300px) {
    .ms__wrap {
        padding: 100px 70px;
        grid-template-columns: 1fr 44%;
    }
}

@media (min-width: 1860px) {
    .ms__wrap {
        padding: 132px 100px;
    }
}

@media (min-width: 1023px) {
    .ms__text {
        display: flex;
        flex-direction: column;
        order: 1;
        justify-content: space-between;
        height: 100%;
    }
}

@media (min-width: 1023px) {
    .ms__text h1 {
        margin-top: 32px;
        order: 2;
    }
}

@media (min-width: 1860px) {
    .ms__text h1 {
        margin-top: 64px;
    }
}

.ms__text h1 span {
    color: var(--color-blue-dark);
}

.ms__text p {
    margin-top: 20px;
}

@media (min-width: 1023px) {
    .ms__text p {
        margin-top: 32px;
        order: 3;
        max-width: 785px;
    }
}

@media (min-width: 1023px) {
    .ms__textwrap {
        display: flex;
        flex-direction: column;
    }
}

.ms__people {
    margin-top: 20px;
    width: 150px;
    height: auto;
}

@media (min-width: 1023px) {
    .ms__people {
        order: 1;
        margin-top: 0;
        width: 210px;
    }
}

.ms__btns {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 32px;
}

@media (min-width: 1023px) {
    .ms__btns {
        flex-direction: row;
        gap: 20px;
        margin-top: 32px;
        order: 4;
        justify-self: flex-end;
    }

    .ms__btns .button-primary {
        padding: 20px 48px;
    }

    .ms__btns .button-light {
        padding: 20px 32px;
    }
}

@media (min-width: 1860px) {
    .ms__btns {
        gap: 30px;
    }
}

.ms__phones {
    order: 5;
    margin-top: 4px;
    font-weight: bold;
    color: var(--color-blue-dark);
    width: 100%;
    text-align: center;
}

.msact {
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

@media (min-width: 1023px) {
    .msact {
        order: 2;
    }
}

.msact img {
    position: relative;
    z-index: 5;
    max-width: 500px;
    height: auto;
}

@media (min-width: 1023px) {
    .msact img {
        max-width: none;
    }
}

.msact video {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 53.125%;
    height: 42.57%;
    -o-object-fit: cover;
    object-fit: cover;
}

/* POPUP */
.popup {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(51, 51, 51, 0.7);
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 20;
    transition: all 0.8s ease 0s;
}

.popup.open {
    opacity: 1;
    visibility: visible;
}

.popup.open .popup__content {
    transform: perspective(600px) translate(0px, 0%) rotateX(0deg);
    opacity: 1;
}

.popup__body {
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 10px;
    transition: all 0.8s ease 0s;
}

.popup__content {
    max-width: 470px;
    width: 100%;
    padding: 80px 40px 40px 40px;
    background-color: #fff;
    position: relative;
    transition: all 0.8s ease 0s;
    opacity: 0;
    transform: perspective(600px) translate(0px, -100%) rotateX(45deg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 30px;
}

@media (max-width: 768px) {
    .popup__content {
        max-width: 390px;
        padding: 60px 30px 30px;
    }
}

.popup__close {
    position: absolute;
    right: 20px;
    top: 20px;
    text-decoration: none;
    will-change: transform;
    transition: 0.5s ease;
}

.popup__close:hover {
    transform: rotate(45deg);
}

.leed-form {
    display: flex;
    flex-direction: column;
    gap: 60px;

    form {
        display: flex;
        flex-direction: column;
        gap: 20px;

        button {
            height: 63px;
            border-radius: 10px;
            padding: 20px 30px;
            width: 100%;
            max-width: 100%;
            background-color: var(--color-blue);
            color: var(--color-white);
            font-weight: 500;
            font-size: 18px;
            line-height: 130%;
            transition: 0.3s ease;

            &:hover {
                background-color: var(--color-blue-dark);
            }
        }

        input {
            height: 63px;
            border: 1px solid var(--color-grey);
            width: 100%;
            font-weight: 500;
            font-size: 18px;
            line-height: 130%;
            color: var(--color-grey);
            padding: 20px 30px;
            border-radius: 10px;
            transition: 0.3s ease;

            &:hover {
                border-color: #1e90f5;
            }

            &:active,
            &:focus {
                color: #1e90f5;
                border-color: #1e90f5;
            }
        }

        ::placeholder {
            color: var(--color-grey);
        }
    }
}

.leed-form__title {
    text-align: center;

    span {
        font-weight: 500;
        font-size: 30px;
        line-height: 110%;
        color: var(--color-black);
    }

    p {
        font-weight: 400;
        font-size: 24px;
        line-height: 130%;
        color: var(--color-grey);
        margin-top: 24px;
    }
}

@media (max-width: 768px) {
    .leed-form__title {
        span {
            font-size: 28px;
        }
    }
}

/* END_POPUP */
