@font-face {
    font-family: SupremeLL;
    font-display: swap;
    src: url(../fonts/SupremeLL-BoldFlat.woff2) format("woff2");
    font-weight: 710;
    font-style: normal
}

@font-face {
    font-family: SupremeLL;
    font-display: swap;
    src: url(../fonts/SupremeLL-Book.woff2) format("woff2");
    font-weight: 450;
    font-style: normal
}

@font-face {
    font-family: SupremeLL;
    font-display: swap;
    src: url(../fonts/SupremeLL-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: SupremeLL;
    font-display: swap;
    src: url(../fonts/SupremeLL-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: SupremeLL;
    font-display: swap;
    src: url(../fonts/SupremeLL-Light.woff2) format("woff2");
    font-weight: 300;
    font-style: normal
}

:root {
    --main-color: #353535;
    --violet-color: #6a6eff;
    --white-color: #fefefe;
    --blue-color: #60cdff;
    --light-blue-color: #e8f8ff;
    --dark-color: #3d3c41;
    --gray-color-70: rgba(53,53,53,0.7);
    --white-color-50: rgba(254,254,254,0.5);
    --violet-color-30: rgba(106,110,255,0.3);
    --red-color: #ff3d00
}

* {
    padding: 0;
    margin: 0;
    border: 0
}

*,*::after,*::before {
    box-sizing: border-box
}

*::after,*::before {
    display: inline-block
}

body,html {
    height: 100%;
    min-width: 320px
}

body {
    color: var(--main-color);
    line-height: 1 !important;
    !i;!;font-family: SupremeLL !important;
    !i;!;font-size: 1rem;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

button,input,textarea {
    font-family: SupremeLL;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background-color: rgba(0,0,0,0)
}

input,textarea {
    width: 100%;
    -webkit-appearance: none;
    appearance: none
}

label {
    display: inline-block
}

button,option,select {
    cursor: pointer
}

a {
    display: inline-block;
    color: inherit;
    text-decoration: none
}

ul li {
    list-style: none
}

img {
    vertical-align: top
}

h1,h2,h3,h4,h5,h6 {
    font-weight: inherit;
    font-size: inherit
}

body {
    background-color: var(--white-color)
}

.lock body {
    overflow: hidden;
    touch-action: none;
    -ms-scroll-chaining: none;
    overscroll-behavior: none
}

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 5rem
}

@supports(overflow: clip) {
    .wrapper {
        overflow:clip
    }
}

.wrapper>main {
    flex: 1 1 auto
}

.wrapper>* {
    min-width: 0
}

[class*=__container] {
    max-width: 85.875rem;
    margin: 0 auto;
    padding: 0 .8125rem
}

[class*="--gc"] {
    display: grid;
    min-width: 0;
    grid-template-columns: .8125rem 1fr minmax(auto,84.25rem) 1fr .8125rem
}

[class*="--gc"]>* {
    min-width: 0;
    grid-column: 3/4
}

.button,.button-blue {
    max-width: 18.75rem;
    min-height: 3.75rem;
    width: 100%;
    background-color: var(--violet-color);
    border-radius: 3.125rem;
    font-weight: 450;
    font-size: 1.125rem;
    line-height: 100%;
    text-align: center;
    padding: 1.125rem 1.875rem;
    display: flex;
    justify-content: center;
    gap: .625rem;
    color: var(--white-color);
    transition: background .3s
}

.button-blue:hover,.button:hover {
    background-color: #8b8eff
}

.button-blue {
    background-color: var(--blue-color);
    color: var(--main-color)
}

.button-blue:hover {
    background-color: #90dcff
}

.title {
    font-weight: 710;
    line-height: 120%;
    text-align: center
}

@-webkit-keyframes toDown {
    0 {
        -webkit-transform: translate(0,-1.25rem);
        transform: translate(0,-1.25rem);
        opacity: 0
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
        opacity: 1
    }
}

@keyframes toDown {
    0 {
        -webkit-transform: translate(0,-1.25rem);
        transform: translate(0,-1.25rem);
        opacity: 0
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
        opacity: 1
    }
}

.swiper-button-next,.swiper-button-prev {
    pointer-events: all;
    display: grid;
    place-content: center;
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    background-color: var(--violet-color);
    color: var(--white-color);
    transition: background .3s
}

.swiper-button-next:hover,.swiper-button-prev:hover {
    background-color: #8b8eff
}

.menu {
    position: fixed;
    width: 100%;
    height: 100%;
    min-height: 100svh;
    left: -100%;
    top: 0;
    z-index: 19;
    overflow: auto;
    background-color: rgba(53,53,53,.3);
    backdrop-filter: blur(8.8px);
    padding-top: 5rem;
    opacity: 0;
    transition: opacity .3s
}

.menu-open .menu {
    left: 0;
    opacity: 1
}

.menu__body {
    padding: 0 .8125rem;
    background-color: var(--white-color);
    border-radius: 0 0 1.875rem 1.875rem;
    -webkit-transform: translate(0,-100%);
    transform: translate(0,-100%);
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s
}

.menu-open .menu__body {
    -webkit-transform: translate(0,0);
    transform: translate(0,0)
}

.menu__inner {
    max-width: 84.25rem;
    width: 100%;
    margin: 0 auto;
    padding: 1.875rem 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.875rem
}

.menu__title {
    font-weight: 500;
    font-size: 2rem;
    margin-bottom: 1.25rem;
    color: var(--violet-color)
}

.menu__list {
    display: grid;
    align-content: start;
    gap: 1.5rem;
    padding-top: .625rem
}

.menu__link {
    font-weight: 450;
    font-size: 1.5rem;
    transition: color .3s
}

.menu__link:hover {
    color: var(--blue-color)
}

.menu__link.active {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    display: flex;
    align-items: center;
    gap: .375rem;
    color: var(--violet-color)
}

.menu__link.active::before {
    content: "";
    width: 1rem;
    height: 1rem;
    margin-top: 3%;
    background: url(../img/icons/star.svg) center/contain no-repeat
}

.menu__contacts:not(:last-child) {
    margin-bottom: 1.25rem
}

.menu__text {
    font-size: 1.25rem
}

.menu__text:not(:last-child) {
    margin-bottom: 1.25rem
}

.menu__btns {
    display: grid;
    align-content: start;
    gap: .625rem
}

.icon-menu {
    display: block;
    position: relative;
    width: 2.375rem;
    height: 2rem;
    z-index: 25
}

.icon-menu span,.icon-menu::after,.icon-menu::before {
    content: "";
    transition: all .3s ease 0;
    right: 0;
    position: absolute;
    width: 100%;
    height: .125rem;
    border-radius: .125rem;
    background-color: var(--dark-color)
}

.icon-menu::before {
    top: .3125rem
}

.icon-menu::after {
    bottom: .3125rem
}

.icon-menu span {
    width: 73.7%;
    top: calc(50% - .0625rem);
    right: 50%;
    -webkit-transform: translate(50%,0);
    transform: translate(50%,0)
}

.menu-open .icon-menu span {
    width: 0
}

.menu-open .icon-menu::after,.menu-open .icon-menu::before {
    background-color: var(--violet-color)
}

.menu-open .icon-menu::before {
    top: calc(50% - .0625rem);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.menu-open .icon-menu::after {
    bottom: calc(50% - .0625rem);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.video-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    padding: 1.875rem .8125rem;
    visibility: hidden;
    display: flex;
    flex-direction: column;
    pointer-events: none;
    transition: visibility .8s ease 0;
    z-index: 150
}

.video-popup[aria-hidden=true] {
    visibility: hidden;
    pointer-events: none
}

.video-popup[aria-hidden=false] {
    visibility: visible;
    pointer-events: auto
}

.video-popup.popup-show {
    visibility: visible;
    pointer-events: auto
}

.video-popup__content {
    position: relative;
    background-color: var(--white-color);
    border-radius: 2.5rem;
    padding: 1.25rem;
    max-width: 75rem;
    width: 100%;
    margin: auto;
    box-shadow: 0 5px 15px var(--gray-color-70);
    display: grid;
    -webkit-transform: scale(0);
    transform: scale(0);
    visibility: hidden;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s,-webkit-transform .3s
}

.popup-show .video-popup__content {
    z-index: 2;
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.video-popup__video {
    aspect-ratio: 1.8/1;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    border-radius: 1.5625rem
}

.video-popup__close {
    position: absolute;
    top: .625rem;
    right: .625rem;
    z-index: 3;
    cursor: pointer;
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-content: center;
    transition: opacity .3s
}

.video-popup__overlay {
    background-color: var(--gray-color-70);
    backdrop-filter: blur(8px);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .6s ease 0;
    pointer-events: none;
    z-index: 1
}

.popup-show .video-popup__overlay {
    pointer-events: all;
    opacity: 1
}

.spollers {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem
}

.spollers__column {
    flex: 1 1 auto;
    width: calc(50% - 1.25rem);
    min-width: 23.75rem;
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.spollers__item {
    font-size: 1.25rem;
    line-height: 120%;
    padding: 1.25rem 1.5625rem;
    background-color: var(--light-blue-color);
    border-radius: 2.5rem
}

.spollers__title {
    width: 100%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .625rem;
    font-weight: 450;
    font-size: 1.5rem;
    line-height: 120%;
    text-align: left;
    list-style: none
}

.spollers__title::-webkit-details-marker,.spollers__title::marker {
    display: none
}

.spollers__title::after {
    content: "";
    flex-shrink: 0;
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    background: url(../img/icons/arrow-down.svg) center/1.5rem .875rem no-repeat var(--violet-color);
    transition: background .3s,-webkit-transform .3s ease 0;
    transition: transform .3s ease 0,background .3s;
    transition: transform .3s ease 0,background .3s,-webkit-transform .3s ease 0
}

.spollers__title:hover::after {
    background-color: #8b8eff
}

.spollers__title._spoller-active::after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    background-color: var(--blue-color)
}

.spollers__body {
    padding-top: 1.25rem
}

.tabs__navigation {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 3.125rem;
    border-radius: 2.5rem;
    padding: 1.25rem;
    background-color: var(--white-color);
    margin-bottom: 3.125rem
}

.tabs__title {
    flex: 1 1 auto;
    width: calc(33.333% - 3.125rem);
    min-width: 12.5rem;
    border-radius: 2.5rem;
    padding: .9375rem 1.25rem 1.25rem 1.25rem;
    color: var(--gray-color-70);
    line-height: 120%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .625rem;
    transition: background .3s,color .3s
}

.tabs__title._tab-active {
    background-color: var(--violet-color);
    color: var(--white-color)
}

.tabs__body {
    -webkit-animation: toDown .3s linear;
    animation: toDown .3s linear
}

.tabs__items {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(20rem,1fr));
    gap: 1.25rem
}

.tabs__item {
    min-height: 19.6875rem;
    border-radius: 2.5rem;
    padding: 1.875rem;
    background-color: var(--white-color);
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

.tabs__item-num {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    border: 2px solid var(--main-color);
    border-radius: 3.125rem;
    padding: .1875rem 1rem .625rem 1rem;
    font-size: 2rem;
    display: flex;
    align-items: center;
    gap: .625rem
}

.tabs__item-num svg {
    margin-top: .4375rem
}

.tabs__item-text {
    flex: 1 1 auto;
    font-size: 1.25rem;
    line-height: 120%
}

.tabs__contacts {
    border-radius: 2.5rem;
    padding: 1.875rem;
    background-color: var(--violet-color);
    color: var(--white-color);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.25rem
}

.tabs__contacts img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.tabs__contacts-text {
    font-size: 1.25rem;
    line-height: 120%;
    text-align: center
}

.tabs__btn {
    max-width: 100%
}

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20;
    background-color: var(--white-color);
    padding: 1.5rem 0
}

.header__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem
}

.header__logo {
    position: relative;
    z-index: 25;
    max-width: 10.125rem
}

.header__logo img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.header__actions {
    position: relative;
    z-index: 25;
    display: flex;
    align-items: center;
    gap: 1.875rem
}

.header__link {
    width: 2rem;
    height: 2rem;
    display: grid;
    place-content: center;
    transition: color .3s
}

.header__link svg {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.header__link:hover {
    color: var(--blue-color)
}

.header__menu-overlay {
    position: fixed;
    width: 100%;
    height: 5rem;
    left: 0;
    top: -100%;
    background-color: var(--white-color);
    transition: left .3s;
    z-index: 22;
    pointer-events: none;
    display: grid;
    align-items: end;
    justify-items: center;
    padding: 0 .8125rem
}

.header__menu-overlay::before {
    content: "";
    max-width: 84.25rem;
    width: 100%;
    height: .125rem;
    background-color: var(--violet-color-30)
}

.menu-open .header__menu-overlay {
    top: 0
}

.contacts {
    display: flex;
    flex-wrap: wrap;
    gap: 1.875rem
}

.contacts__link {
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    background-color: var(--violet-color);
    color: var(--white-color);
    overflow: hidden;
    display: grid;
    place-content: center;
    transition: background .3s
}

.contacts__link:hover {
    background-color: #8b8eff
}

.footer {
    background-color: var(--main-color);
    color: var(--white-color);
    padding: 3.125rem 0;
    border-radius: 2.5rem 2.5rem 0 0
}

.footer__body {
    display: flex;
    gap: 1.25rem
}

.footer__info {
    max-width: 18.75rem;
    width: 100%;
    margin-right: auto;
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.footer__logo {
    max-width: 13.625rem
}

.footer__logo img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.footer__text {
    font-size: 1.25rem;
    line-height: 120%
}

.footer__btns {
    display: grid;
    align-content: start;
    gap: .625rem
}

.footer__navigation {
    flex: 1 1 auto;
    display: flex;
    gap: 3.75rem
}

.footer__navigation .footer__column:first-child {
    margin-left: auto
}

.footer__column {
    max-width: 20rem;
    width: 100%
}

.footer__block:not(:last-child) {
    margin-bottom: 1.875rem
}

.footer__title {
    font-weight: 500;
    font-size: 2rem;
    margin-bottom: 1.25rem;
    color: var(--violet-color)
}

.footer__list {
    padding-top: .625rem;
    display: grid;
    align-content: start;
    gap: 1.5rem
}

.footer__link {
    font-weight: 450;
    font-size: 1.5rem;
    transition: color .3s
}

.footer__link:hover {
    color: var(--blue-color)
}

.footer__copy {
    padding-top: .625rem;
    font-weight: 300;
    font-size: 1rem;
    color: var(--white-color-50)
}

.hero {
    padding-top: 3.125rem;
    margin-bottom: 6.25rem
}

.hero__title {
    font-weight: 710;
    text-align: center;
    line-height: 130%
}

.hero__title:not(:last-child) {
    margin-bottom: 3.125rem
}

.hero__block {
    font-size: 1.5rem;
    line-height: 110%
}

.hero__block:not(:last-child) {
    margin-bottom: 3.125rem
}

.hero__subtitle {
    text-align: center;
    margin-bottom: 1.25rem
}

.hero__benefits {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.25rem 1.875rem
}

.hero__benefit {
    display: flex;
    align-items: center;
    gap: .625rem
}

.hero__benefit svg {
    margin-top: .3125rem
}

.hero__btns {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.25rem
}

.benefits {
    margin-bottom: 6.25rem
}

.benefits__title {
    margin-bottom: 3.125rem
}

.benefits__items {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem
}

.benefits__item {
    flex: 1 1 auto;
    width: calc(33.333% - 1.25rem);
    min-width: 16.875rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.875rem 1.875rem 0 1.875rem;
    border-radius: 2.5rem;
    background-color: var(--light-blue-color);
    overflow: hidden
}

.benefits__item img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.benefits__item-text {
    flex: 1 1 auto;
    font-size: 1.5rem;
    line-height: 130%;
    text-align: center
}

.works {
    margin-bottom: 6.25rem
}

.works__body {
    border-radius: 2.5rem;
    padding: 3.125rem 2.5rem;
    background-color: var(--blue-color);
    margin-bottom: 2.5rem
}

.works__title {
    margin-bottom: 3.125rem
}

.profitable {
    margin-bottom: 6.25rem
}

.profitable__title {
    margin-bottom: 3.125rem
}

.profitable__body {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-bottom: 3.125rem;
    justify-content: center
}

.profitable__item {
    flex: 1 1 auto;
    width: calc(50% - 1.25rem);
    min-width: 21.875rem;
    display: flex;
    flex-direction: column;
    border-radius: 2.5rem;
    padding: 1.875rem 1.875rem 0 1.875rem;
    background-color: var(--light-blue-color);
    max-width: calc(50% - 1.25rem);
    align-items: center
}

.profitable__item img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.profitable__item-title {
    font-weight: 450;
    font-size: 2rem;
    line-height: 120%;
    margin-bottom: 1.25rem
}

.profitable__item-text {
    flex: 1 1 auto;
    font-size: 1.25rem;
    line-height: 120%
}

.profitable__item-text:not(:last-child) {
    margin-bottom: 1.875rem
}

.profitable__btns {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .625rem
}

.results {
    margin-bottom: 6.25rem
}

.results__body {
    border-radius: 2.5rem;
    padding: 3.125rem;
    background-color: var(--blue-color)
}

.results__title {
    margin-bottom: 3.125rem
}

.results__inner {
    position: relative
}

.results__slider {
    border-radius: 2.5rem
}

.results__arrows {
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    position: absolute;
    z-index: 5;
    left: -5rem;
    right: -5rem;
    top: 50%;
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%)
}

.results-card {
    display: flex;
    gap: 1.25rem
}

.results-card__video {
    max-width: 45.5rem;
    width: 100%;
    position: relative
}

.results-card__decor {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 3;
    padding: .875rem 0 0 .875rem;
    border-radius: 2.5rem 0 0 0;
    background-color: var(--blue-color)
}

.results-card__decor::before {
    content: "";
    position: absolute;
    top: -2.46875rem;
    right: -.03125rem;
    z-index: 4;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0 0 2.1875rem 0;
    background-color: rgba(0,0,0,0);
    box-shadow: .625rem .625rem var(--blue-color)
}

.results-card__decor::after {
    content: "";
    position: absolute;
    left: -2.46875rem;
    bottom: -.03125rem;
    z-index: 4;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0 0 2.1875rem 0;
    background-color: rgba(0,0,0,0);
    box-shadow: .625rem .625rem var(--blue-color)
}

.results-card__play {
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    display: grid;
    place-content: center;
    background-color: var(--violet-color);
    color: var(--white-color);
    padding-left: .3125rem;
    transition: background .3s
}

.results-card__play:hover {
    background-color: #8b8eff
}

.results-card__preview {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 2.5rem
}

.results-card__content {
    max-width: 31.25rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

.results-card__info {
    flex: 1 1 auto;
    border-radius: 2.5rem;
    padding: 1.875rem;
    background-color: var(--white-color);
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.results-card__title {
    font-weight: 450;
    font-size: 2rem
}

.results-card__items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: .625rem
}

.results-card__item {
    display: grid;
    align-content: start;
    gap: .625rem
}

.results-card__num {
    font-weight: 450;
    font-size: 2.5rem
}

.results-card__text {
    font-size: 1.25rem;
    line-height: 120%
}

.results-card__review {
    flex: 1 1 auto;
    border-radius: 2.5rem;
    padding: 1.25rem;
    background-color: var(--white-color);
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.results-card__client {
    display: grid;
    align-items: center;
    grid-template-columns: 3.75rem 1fr;
    gap: .3125rem .625rem
}

.results-card__client-img {
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    overflow: hidden
}

.results-card__client-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.results-card__client-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .3125rem
}

.results-card__client-name {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 450;
    font-size: 1.25rem;
    color: #546df6;
    transition: color .3s
}

.results-card__client-name svg {
    margin-top: .3125rem
}

.results-card__client-name:hover {
    color: var(--blue-color)
}

.results-card__client-company {
    font-size: 1.125rem
}

.services {
    margin-bottom: 6.25rem
}

.services__title {
    margin-bottom: 3.125rem
}

.services__body {
    display: grid;
    gap: 1.25rem
}

.services__row {
    display: flex;
    gap: 1.25rem;
    min-height: 19.0625rem
}

.services__item {
    max-width: 30.8125rem;
    width: 100%;
    flex: 1 1 auto;
    border-radius: 2.5rem;
    padding: 1.875rem;
    background-color: var(--light-blue-color);
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.services__item-title {
    font-weight: 450;
    font-size: 2rem
}

.services__item-list {
    display: grid;
    align-content: start;
    gap: .625rem;
    font-size: 1.25rem;
    line-height: 120%
}

.services__item-list li {
    display: flex;
    gap: .625rem
}

.services__item-list li::before {
    content: "";
    flex-shrink: 0;
    margin-top: .125rem;
    width: 1.25rem;
    height: 1.25rem;
    background: url(../img/icons/star.svg) center/cover no-repeat
}

.services__img {
    max-width: 20.125rem;
    width: 100%;
    padding: 1.1875rem;
    display: grid;
    place-content: center;
    border-radius: 2.5rem;
    background-color: var(--violet-color)
}

.services__img img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.discuss {
    margin-bottom: 6.25rem
}

.discuss__container {
    max-width: 63.625rem
}

.discuss__body {
    border-radius: 2.5rem;
    padding: 3.125rem;
    background-color: var(--blue-color);
    display: flex;
    justify-content: space-between;
    gap: 1.25rem;
    position: relative;
    overflow: hidden
}

.discuss__content {
    max-width: 26.3125rem;
    width: 100%
}

.discuss__title {
    text-align: left;
    margin-bottom: 3.125rem
}

.discuss__text {
    display: grid;
    align-content: start;
    gap: .625rem;
    font-size: 1.25rem;
    line-height: 120%
}

.discuss__form {
    max-width: 26.3125rem;
    width: 100%
}

.discuss__succes-from {
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 3.125rem;
    display: none;
    background-color: var(--blue-color);
    flex-direction: column;
    opacity: 0;
    transition: opacity .3s
}

.form-sent-success .discuss__succes-from {
    display: flex;
    opacity: 1
}

.discuss__succes-from .discuss__title {
    flex: 1 1 auto;
    text-align: center;
    margin-bottom: .625rem
}

.discuss__succes-from img {
    display: block;
    max-width: 20.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    margin-left: auto;
    margin-right: -3.125rem;
    margin-bottom: -3.125rem
}

.form {
    display: grid;
    align-content: start;
    gap: 1.25rem
}

.form__label {
    padding-left: 1.25rem;
    margin-bottom: .5625rem
}

.form__label span {
    color: var(--red-color)
}

.form__input {
    border-radius: 2.5rem;
    padding: 1rem 1.875rem;
    height: 3.25rem;
    background-color: var(--white-color)
}

.form__options {
    padding-left: 1.25rem
}

.form__email {
    display: none
}

.form__btn {
    max-width: 100%;
    min-height: 3.375rem;
    padding: 1rem 1.875rem
}

.form__error {
    padding-top: .625rem;
    color: var(--red-color)
}

.option-block {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem 3.125rem
}

.option-block__item {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    cursor: pointer
}

.option-block__input {
    width: 0;
    height: 0;
    opacity: 0;
    position: absolute
}

.option-block__input:focus-visible~.option-block__text:before {
    outline: auto
}

.option-block__input:checked~.option-block__text:before {
    background: url(../img/icons/check.svg) center/20px 16px no-repeat var(--white-color)
}

.option-block__text {
    display: flex;
    align-items: center;
    gap: .375rem
}

.option-block__text::before {
    content: "";
    flex-shrink: 0;
    border-radius: .25rem;
    background: var(--white-color);
    width: 1.625rem;
    height: 1.625rem
}

.faq {
    margin-bottom: 6.25rem
}

.faq__title {
    margin-bottom: 3.125rem
}

.certificates {
    margin-bottom: 1.25rem;
    padding: 3rem 0;
    background-color: #fefefe
}

.certificates__title {
    margin-bottom: 1.5rem;
    color: var(--main-color)
}

.certificates__wrapper {
    display: flex;
    gap: 2rem;
    align-items: flex-start
}

.certificates__content {
    display: grid;
    flex: 2 0 75%;
    max-width: 90%;
    grid-template-columns: 1fr 2fr;
    padding: 25px;
    background: #e8f8ff;
    border-radius: 25px
}

.certificates__text {
    color: var(--gray-color-70);
    line-height: 1.6;
    padding: 20px
}

.certificates__text p {
    margin-bottom: 1rem
}

.certificates__text p:last-child {
    margin-bottom: 0
}

.certificates__grid {
    max-width: 40%;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 1.5rem
}

.certificates__badge {
    display: flex;
    justify-content: center
}

.certificates__badge img {
    height: auto;
    width: 100%
}

.certificates__badge:hover {
    transform: translateY(-5px);
    transition: transForm .15s
}

.swiper {
    overflow: hidden
}

.swiper-initialized {
    touch-action: pan-y
}

.swiper-wrapper {
    width: 100%;
    height: 100%;
    box-sizing: content-box;
    display: flex;
    position: relative
}

.swiper-vertical .swiper-wrapper {
    flex-direction: column
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start
}

.swiper-initialized .swiper-slide {
    flex-shrink: 0
}

.swiper-android .swiper-slide,.swiper-android .swiper-wrapper {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
}

.swiper-button-lock {
    display: none !important
}

@media(min-width: 40.62375em) {
    .menu__column {
        flex:1 1 auto;
        max-width: 25.5625rem;
        width: calc(33.333% - 1.875rem);
        min-width: 16.875rem
    }
}

@media(min-width: 85.875em) {
    .title {
        font-size:3rem
    }

    .tabs__title {
        font-size: 2rem
    }

    .hero__title {
        font-size: 4rem
    }
}

@media(max-width: 88.74875em) {
    .results__arrows {
        left:-3.9375rem;
        right: -3.9375rem
    }
}

@media(max-width: 85.875em) {
    .tabs__navigation {
        gap:0
    }

    .works__body {
        margin: 0 -.8125rem
    }
}

@media(max-width: 68.74875em) {
    .benefits__item {
        padding:1.25rem 1.25rem 0 1.25rem
    }
}

@media(max-width: 61.99875em) {
    .menu__title {
        font-size:1.75rem
    }

    .tabs__navigation {
        padding: .625rem
    }

    .footer__navigation {
        gap: 1.875rem
    }

    .footer__title {
        font-size: 1.75rem
    }

    .works__body {
        padding: 1.875rem .8125rem;
        margin-bottom: 3rem
    }

    .profitable__item {
        padding: 1.25rem 1.25rem 0 1.25rem
    }

    .profitable__item-title {
        font-size: 1.75rem
    }

    .results__body {
        padding: 1.875rem .8125rem;
        margin: 0 -.8125rem
    }

    .results__inner {
        display: grid;
        align-content: start;
        gap: 1.875rem
    }

    .results__arrows {
        position: static;
        justify-content: center;
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }

    .results-card__info {
        padding: 1.25rem
    }

    .results-card__title {
        font-size: 1.75rem
    }

    .results-card__num {
        font-size: 2.25rem
    }

    .services__body {
        gap: .625rem
    }

    .services__row {
        gap: .625rem
    }

    .services__item {
        padding: 1.25rem
    }

    .services__item-title {
        font-size: 1.75rem
    }

    .services__item-list {
        font-size: 1rem
    }

    .discuss__body {
        padding: 1.875rem .8125rem;
        margin: 0 -.8125rem
    }

    .discuss__title {
        margin-bottom: 1.875rem
    }

    .discuss__text {
        font-size: 1rem
    }

    .faq {
        margin-bottom: 3.75rem
    }

    .faq__title {
        margin-bottom: 1.875rem
    }

    .certificates__wrapper {
        flex-direction: column;
        gap: 2rem
    }

    .certificates__content {
        flex: 0 0 100%;
        max-width: 100%
    }

    .certificates__grid {
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media(max-width: 47.99875em) {
    .wrapper {
        padding-top:5.375rem
    }

    .menu__title {
        font-size: 1.5rem
    }

    .menu__link {
        font-size: 1.25rem
    }

    .icon-menu {
        width: 1.75rem;
        height: 1.625rem
    }

    .spollers__item {
        padding: 1.25rem;
        font-size: 1rem
    }

    .spollers__title {
        font-size: 1.25rem
    }

    .tabs__navigation {
        margin-bottom: 1.875rem
    }

    .tabs__title {
        padding: .3125rem .75rem .625rem .75rem
    }

    .tabs__items {
        grid-template-columns: repeat(auto-fill,minmax(16.875rem,1fr));
        gap: .625rem
    }

    .tabs__item {
        min-height: 0;
        padding: 1.25rem
    }

    .tabs__item-num {
        font-weight: 450;
        font-size: 1.5rem;
        padding: .1875rem .875rem .625rem .875rem;
        gap: .5rem
    }

    .tabs__item-text {
        font-size: 1rem
    }

    .tabs__contacts-text {
        font-size: 1rem
    }

    .header {
        padding: 1.875rem 0
    }

    .header__actions {
        gap: 1.25rem
    }

    .header__link {
        width: 1.625rem;
        height: 1.625rem
    }

    .footer__body {
        flex-direction: column;
        gap: 1.875rem
    }

    .footer__info {
        margin: 0 auto;
        text-align: center
    }

    .footer__logo {
        margin: 0 auto
    }

    .footer__text {
        font-size: 1rem
    }

    .footer__navigation {
        justify-content: center
    }

    .footer__navigation .footer__column:first-child {
        margin-left: 0
    }

    .footer__column {
        max-width: 17.5rem
    }

    .footer__title {
        font-size: 1.5rem
    }

    .footer__link {
        font-size: 1.25rem
    }

    .footer__copy {
        padding-top: 1.875rem;
        text-align: center
    }

    .hero {
        padding-top: 1.875rem;
        margin-bottom: 3.75rem
    }

    .hero__title:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .hero__block:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .benefits {
        margin-bottom: 3.75rem
    }

    .benefits__title {
        margin-bottom: 1.875rem
    }

    .benefits__item-text {
        font-size: 1.25rem
    }

    .works {
        margin-bottom: 3.75rem
    }

    .works__title {
        margin-bottom: 1.875rem
    }

    .profitable {
        margin-bottom: 3.75rem
    }

    .profitable__title {
        margin-bottom: 1.875rem
    }

    .profitable__body {
        margin-bottom: 1.875rem
    }

    .profitable__item-title {
        font-size: 1.5rem
    }

    .profitable__item-text {
        font-size: 1rem
    }

    .profitable__item-text:not(:last-child) {
        margin-bottom: 1.25rem
    }

    .results {
        margin-bottom: 3.75rem
    }

    .results__title {
        margin-bottom: 1.875rem
    }

    .results-card__title {
        font-size: 1.5rem
    }

    .results-card__num {
        font-size: 2rem
    }

    .results-card__text {
        font-size: 1rem
    }

    .results-card__client-company {
        font-size: .875rem
    }

    .services {
        margin-bottom: 3.75rem
    }

    .services__title {
        margin-bottom: 1.875rem
    }

    .services__item-title {
        font-size: 1.5rem
    }

    .services__item-list li {
        gap: .3125rem
    }

    .services__item-list li::before {
        width: 1rem;
        height: 1rem
    }

    .discuss {
        margin-bottom: 3.75rem
    }

    .discuss__title {
        margin-bottom: 1.25rem
    }

    .discuss__text {
        font-size: 1rem
    }

    .faq {
        margin-bottom: 3.75rem
    }

    .faq__title {
        margin-bottom: 1.875rem
    }

    .certificates__grid {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width: 40.62375em) {
    .menu__body {
        border-radius:0
    }

    .menu__inner {
        flex-direction: column;
        text-align: center
    }

    .menu__link {
        text-align: center
    }

    .menu__link.active {
        justify-content: center;
        margin: 0 auto
    }

    .menu__contacts {
        justify-content: center
    }

    .menu__contacts:not(:last-child) {
        margin-bottom: 1.875rem
    }

    .menu__text {
        display: none
    }

    .menu__btns {
        align-content: stretch;
        justify-items: center
    }

    .video-popup__content {
        padding: .625rem
    }

    .video-popup__video {
        border-radius: 2.1875rem;
        aspect-ratio: 1/1
    }

    .video-popup__close {
        top: -1.875rem
    }

    .spollers {
        gap: .625rem
    }

    .spollers__column {
        width: calc(50% - .625rem);
        min-width: 16.875rem;
        gap: .625rem
    }

    .hero__btns {
        gap: .625rem
    }

    .benefits__items {
        gap: .625rem
    }

    .benefits__item {
        width: calc(33.333% - .625rem)
    }

    .profitable__body {
        gap: 1.625rem;
        width: 100%
    }

    .profitable__item {
        width: calc(50% - .625rem)
    }

    .results-card {
        flex-direction: column;
        gap: 1.875rem
    }

    .results-card__content {
        flex: 1 1 auto;
        max-width: none;
        gap: .625rem
    }

    .results-card__client-name {
        font-size: 1rem;
        gap: .3125rem
    }

    .results-card__client-name svg {
        width: 1.25rem;
        height: 1.25rem;
        -o-object-fit: cover;
        object-fit: cover
    }

    .services__row {
        min-height: 0;
        flex-direction: column
    }

    .services__item {
        max-width: none
    }

    .services__img {
        padding: .6875rem;
        max-width: none;
        order: 2
    }

    .discuss__body {
        flex-direction: column;
        gap: 1.875rem
    }

    .discuss__content {
        max-width: none;
        text-align: center
    }

    .discuss__title {
        text-align: center
    }

    .discuss__form {
        max-width: none
    }

    .discuss__succes-from {
        padding: 1.875rem .8125rem
    }

    .discuss__succes-from img {
        margin-right: -.8125rem;
        margin-bottom: -1.875rem
    }

    .form {
        gap: 1.875rem
    }

    .option-block {
        gap: 1.25rem
    }
}

@media(max-width: 34.37375em) {
    .footer__navigation {
        flex-direction:column;
        align-items: center;
        text-align: center
    }

    .footer__column {
        max-width: none
    }

    .footer__contacts {
        justify-content: center
    }

    .footer__list {
        padding-top: 0
    }

    .certificates__grid {
        grid-template-columns: repeat(3,1fr)
    }
}

@media(max-width: 29.99875em) {
    .button,.button-blue {
        padding:1.125rem 1.25rem;
        max-width: 100%
    }

    .title {
        font-size: 1.875rem
    }

    .menu__btn {
        max-width: 100%
    }

    .tabs__title {
        font-size: 1.125rem
    }

    .tabs__title {
        min-width: 9.375rem
    }

    .header__logo {
        max-width: 9.625rem
    }

    .footer {
        padding: 2.9375rem 0
    }

    .footer__info {
        max-width: none
    }

    .footer__logo {
        max-width: 9.5rem
    }

    .footer__btn {
        max-width: 100%
    }

    .hero__title {
        font-size: 2.25rem
    }

    .hero__block {
        font-size: 1.25rem
    }

    .hero__subtitle {
        margin-bottom: .625rem
    }

    .hero__benefits {
        flex-direction: column;
        align-items: stretch;
        gap: .625rem;
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content;
        margin: 0 auto
    }

    .hero__btn {
        max-width: 100%
    }

    .benefits__title br {
        display: none
    }

    .profitable__btn {
        max-width: 100%
    }

    .results-card__decor {
        padding: .625rem 0 0 .625rem
    }

    .services__img img {
        max-height: 10.8125rem;
        -o-object-fit: cover;
        object-fit: cover
    }
}

@media(max-width: 23.43625em) {
    .spollers__title::after {
        width:2.5rem;
        height: 2.5rem
    }
}

@media(min-width: 29.99875em)and (max-width:85.875em) {
    .title {
        font-size: clamp(1.875rem, 1.27rem + 2.01vw, 3rem) !important;
    }

    .tabs__title {
        font-size: clamp(1.125rem,.6552314266rem+1.5659604931vw,2rem)
    }

    .hero__title {
        font-size: clamp(2.25rem,1.3104628532rem+3.1319209861vw,4rem)
    }
}

@media(any-hover: none) {
    .icon-menu {
        cursor:default
    }
}

@media(any-hover: hover) {
    .icon-menu:hover span,.icon-menu:hover::after,.icon-menu:hover::before {
        background-color:var(--blue-color)
    }

    .video-popup__close:hover {
        opacity: .7
    }

    .tabs__title:hover {
        color: var(--violet-color)
    }
}

.h2.hero__subtitle {
    font-weight: 710;
    text-align: center;
    line-height: 130%;
    font-size: 4rem
}

@media(max-width: 47.9988em) {
    .h2.hero__subtitle {
        font-weight:710;
        text-align: center;
        line-height: 130%;
        font-size: 2rem
    }
}

.info {
    margin-bottom: 6.25rem
}

.info__body {
    display: grid;
    grid-template-areas: "image title""image review";
    grid-template-rows: auto 1fr;
    gap: 1.5rem 3rem
}

.info__body:not(:last-child) {
    margin-bottom: 3rem
}

.info__img {
    grid-area: image;
    max-width: 25.75rem;
    width: 100%;
    overflow: hidden;
    border-radius: 1.25rem
}

.info__img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.info__title {
    grid-area: title
}

.info__review {
    grid-area: review;
    border-radius: 1.25rem;
    padding: 1.875rem;
    background-color: var(--light-color);
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.info__review-rating {
    display: flex;
    align-items: center;
    gap: .125rem
}

.info__review-rating img {
    max-width: 2.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.info__review-text {
    flex: 1 1 auto;
    font-size: 1.25rem;
    line-height: 150%
}

.info__review-author {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: .25rem
}

.info__review-name {
    font-weight: 500;
    font-size: 1.5rem
}

.info__review-descr {
    font-size: 1.125rem;
    color: var(--inverse)
}

.info__btn {
    margin: 0 auto
}

.info__btn:not(:last-child) {
    margin-bottom: 3rem
}

.info__items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3rem
}

@media(max-width: 47.9988em) {
    .info__items {
        display:grid;
        grid-template-columns: repeat(2,1fr);
        gap: 2rem 0rem
    }
}

.info__item {
    min-width: 13rem;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: .375rem
}

.info__item-img img {
    max-height: 3.125rem;
    width: auto;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.info__item-name {
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 150%;
    text-align: center;
    text-transform: capitalize
}

.info__item-rating {
    display: flex;
    align-items: center;
    gap: .3125rem;
    font-weight: 500;
    font-size: 1.25rem
}

.info__item-stars {
    display: flex;
    align-items: center;
    gap: .125rem
}

.info__item-stars img {
    display: block;
    max-width: 1.25rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.works__title.p {
    font-size: 1.25rem;
    line-height: 150%;
    color: var(--inverse);
    text-align: center
}

.tabs__item-img {
    display: contents
}

.certificates__img {
    max-width: 100%
}

@media(max-width: 47.9988em) {
    .certificates__content {
        display:flex;
        flex: 2 0 75%;
        max-width: max-content;
        padding: 25px;
        background: #e8f8ff;
        border-radius: 25px;
        flex-direction: column
    }
}

.certificates__item img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.certificates__items {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.25rem
}

.certificates {
    margin-bottom: 6.25rem
}

.certificates__title {
    margin-bottom: 3.125rem
}

.certificates__items {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.25rem
}

.certificates__item {
    max-width: 7.5rem;
    width: 100%;
    transition: opacity .3s
}

.certificates__item img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.certificates__item:hover {
    opacity: .5
}



.hero__conditions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.875rem
}

.hero__conditions:not(:last-child) {
    margin-bottom: 3rem
}

.hero__item {
    border-radius: 3.125rem;
    padding: .625rem .9375rem .625rem .625rem;
    backdrop-filter: blur(8px);
    background: rgba(79,79,79,.3);
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--light-color);
    font-size: 1.25rem;
    line-height: 150%
}

.hero__item-info {
    border-radius: 3.125rem;
    padding: .6875rem .8125rem;
    background-color: var(--light-color);
    color: var(--inverse);
    font-weight: 600;
    font-size: 1.5rem
}

.hero__title {
    font-weight: 500;
    line-height: 150%;
    text-align: center;
    text-shadow: 0 0 20px 0 rgba(41,41,41,.2)
}

.hero__title:not(:last-child) {
    margin-bottom: 4.1875rem
}

.hero__bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.875rem;
    color: white;
}

.hero__review {
    max-width: 25rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    line-height: 111%;
}

.hero__review-head {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.hero__review-head img {
    display: block;
    max-width: 5rem;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.hero__review-rating {
    display: flex;
    align-items: center;
    gap: .3125rem;
}

.hero__review-rating ul {
    display: flex;
    align-items: center;
    gap: .125rem;
}

.hero__review-rating img {
    max-width: 1.25rem;
}

.hero__review-user {
    display: flex;
    align-items: center;
    gap: .625rem;
}

.hero__review-user img {
    border-radius: 50%;
    max-width: 3.625rem;
    max-height: 3.625rem;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.hero__review-body {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.hero__review-name {
    font-size: 1rem
}

.hero__review-date {
    font-weight: 300;
    font-size: .8125rem;
    color: white;
}

.hero__btns {
    margin-top: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.875rem;
}
.hero__review-text{
    font-size: 1.25rem;
    font-weight: 100;
}