@charset "UTF-8";
:root {
    --modal-animation-time: 0.3s;
    --black: #303030;
    --gray: #929292;
    --white: #fff;
    --blue: #0603a1;
    --stroke: #e7e7e7;
    --bg-1: #f1f5f8;
    --bg-2: #f0f4fb;
    --theme-gradient: linear-gradient(90deg, #6a11cb, #2575fc);
    --theme-gradient-hover: linear-gradient(90deg, #2575fc, #6a11cb)
}

@font-face {
    font-family: swiper-icons;
    font-style: normal;
    font-weight: 400;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff")
}

:root {
    --swiper-theme-color: #007aff
}

.swiper, swiper-container {
    display: block;
    list-style: none;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: 0;
    position: relative;
    z-index: 1
}

.swiper-vertical > .swiper-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    -o-transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    width: 100%;
    z-index: 1
}

.swiper-android .swiper-slide, .swiper-wrapper {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.swiper-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-slide, swiper-slide {
    -ms-flex-negative: 0;
    display: block;
    flex-shrink: 0;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    width: 100%
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition-property: height, -webkit-transform;
    transition-property: height, -webkit-transform;
    -o-transition-property: transform, height;
    transition-property: transform, height;
    transition-property: transform, height, -webkit-transform
}

.swiper-backface-hidden .swiper-slide {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-3d .swiper-wrapper {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-3d {
    -webkit-perspective: 1200px;
    perspective: 1200px
}

.swiper-3d .swiper-cube-shadow, .swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d
}

.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top {
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
    background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-css-mode > .swiper-wrapper {
    -ms-overflow-style: none;
    overflow: auto;
    scrollbar-width: none
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory
}

.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
    -ms-scroll-snap-type: none;
    scroll-snap-type: none
}

.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: none
}

.swiper-centered > .swiper-wrapper:before {
    -ms-flex-negative: 0;
    -webkit-box-ordinal-group: 10000;
    -ms-flex-order: 9999;
    content: "";
    flex-shrink: 0;
    order: 9999
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop: always
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
    -webkit-margin-start: var(--swiper-centered-offset-before);
    margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal > .swiper-wrapper:before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
    -webkit-margin-before: var(--swiper-centered-offset-before);
    margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical > .swiper-wrapper:before {
    height: var(--swiper-centered-offset-after);
    min-width: 1px;
    width: 100%
}

.swiper-lazy-preloader {
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top: 4px solid transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 42px;
    left: 50%;
    margin-left: -21px;
    margin-top: -21px;
    position: absolute;
    top: 50%;
    -webkit-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    width: 42px;
    z-index: 10
}

.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader, .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader {
    -webkit-animation: swiper-preloader-spin 1s linear infinite;
    animation: swiper-preloader-spin 1s linear infinite
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

@-webkit-keyframes swiper-preloader-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes swiper-preloader-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@font-face {
    font-display: swap;
    font-family: Manrope;
    font-style: normal;
    font-weight: 600;
    src: url(fonts/Manrope-SemiBold.ttf) format("woff2")
}

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

button, input, option, select, textarea {
    -webkit-appearance: none;
    background: none;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    outline: none;
    padding: 0;
    resize: none
}

button:focus:required:invalid, input:focus:required:invalid, option:focus:required:invalid, select:focus:required:invalid, textarea:focus:required:invalid {
    border-color: red
}

button:required:valid, input:required:valid, option:required:valid, select:required:valid, textarea:required:valid {
    border-color: green
}

*, :after, :before {
    -webkit-tap-highlight-color: transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none
}

img {
    display: block;
    max-width: 100%
}

body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    color: var(--black);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: Manrope, sans-serif;
    font-size: 16px;
    font-weight: 600;
    justify-content: space-between;
    line-height: 24px;
    margin: 0;
    min-height: 100vh;
    position: relative
}

body::-webkit-scrollbar {
    width: 7px
}

body::-webkit-scrollbar-track {
    background: var(--stroke)
}

body::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.main {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

a, h1, h2, h3, h4, h5, li, ol, p, ul {
    color: inherit;
    list-style: none;
    margin: 0;
    padding: 0;
    text-decoration: none
}

button {
    color: var(--black);
    cursor: pointer;
    font-family: Manrope, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px
}

circle, path, svg {
    -webkit-transition: fill .5s ease;
    -o-transition: fill .5s ease;
    transition: fill .5s ease
}

circle {
    -webkit-transition: fill-opacity .5s ease;
    -o-transition: fill-opacity .5s ease;
    transition: fill-opacity .5s ease;
    -webkit-transition: stroke .5s ease;
    -o-transition: stroke .5s ease;
    transition: stroke .5s ease
}

a {
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s
}

[disabled] {
    opacity: .5;
    pointer-events: none
}

[hidden] {
    display: none !important
}

hr {
    background: #eee;
    border: none;
    border-radius: 10px;
    height: 1px;
    -webkit-transform: matrix(1, 0, 0, -1, 0, 0);
    -ms-transform: matrix(1, 0, 0, -1, 0, 0);
    transform: matrix(1, 0, 0, -1, 0, 0);
    width: 100%
}

.container {
    margin: 0 auto;
    max-width: 1324px;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%
}

.visually-hidden {
    clip: rect(0 0 0 0);
    border: none;
    height: 1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px
}

@-webkit-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

@keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

@media screen and (max-width: 500px) {
    body {
        font-size: 14px;
        line-height: 20px
    }
}

.alert {
    -ms-grid-columns: 1fr;
    grid-gap: 10px;
    display: -ms-grid;
    display: grid;
    grid-template-columns:1fr;
    left: 50%;
    pointer-events: none;
    position: fixed;
    top: 50px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 11
}

.alert__box {
    -webkit-animation: alert-fadein .2s ease-in-out forwards;
    animation: alert-fadein .2s ease-in-out forwards;
    background: #333;
    color: #fff;
    font-size: 14px;
    line-height: 16px;
    margin: 0 auto;
    max-width: 300px;
    padding: 10px 17px;
    text-align: center;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

.alert__box:before {
    -webkit-animation: lifetime var(--lifetime) linear forwards;
    animation: lifetime var(--lifetime) linear forwards;
    background: #1f1f1f;
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%
}

.alert__box.success {
    background: #4ab868
}

.alert__box.success:before {
    background: #37814b
}

.alert__box.error {
    background: #f02b2b
}

.alert__box.error:before {
    background: #aa2323
}

.alert__box.notify {
    background: #fdcb6e
}

.alert__box.notify:before {
    background: #c09d5b
}

.alert__box.close {
    -webkit-animation: alert-fadeout .3s ease-in-out forwards;
    animation: alert-fadeout .3s ease-in-out forwards
}

@-webkit-keyframes alert-fadein {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px)
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes alert-fadein {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px)
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes alert-fadeout {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px)
    }
}

@keyframes alert-fadeout {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(-100px);
        transform: translateY(-100px)
    }
}

@-webkit-keyframes lifetime {
    0% {
        width: 100%
    }
    to {
        width: 0
    }
}

@keyframes lifetime {
    0% {
        width: 100%
    }
    to {
        width: 0
    }
}

.btn {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    border-radius: 16px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    justify-content: center;
    line-height: 24px;
    overflow: hidden;
    padding: 16px;
    position: relative;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.btn-1 {
    background: var(--theme-gradient);
    color: var(--white);
    z-index: 1
}

.btn-1:before {
    background: var(--theme-gradient-hover);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    width: 100%;
    z-index: -1
}

.btn-1:hover:before {
    opacity: 1
}

.btn-2 {
    background: rgba(6, 3, 161, .12);
    border-radius: 12px !important;
    color: var(--blue);
    z-index: 1
}

.btn-2:before {
    background: var(--theme-gradient-hover);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
    width: 100%;
    z-index: -1
}

.btn-2:hover {
    color: var(--white)
}

.btn-2:hover:before {
    opacity: 1
}

.btn-3 {
    background: var(--white);
    border-radius: 16px;
    color: var(--black)
}

.btn-3:hover {
    color: var(--blue)
}

.checkbox input {
    display: none
}

.checkbox input:checked + label:before {
    background: var(--white) url(images/icons/check.svg) center no-repeat;
    background-size: contain;
    border-color: var(--stroke)
}

.checkbox input[disabled] + label {
    opacity: .5;
    pointer-events: none
}

.checkbox label {
    cursor: pointer;
    display: block;
    padding-left: 24px;
    position: relative
}

.checkbox label:before {
    border: 2px solid var(--stroke);
    border-radius: 5px;
    content: "";
    height: 18px;
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: 18px
}

.checkbox--term label:before {
    height: 16px;
    width: 16px
}

@media screen and (max-width: 500px) {
    .checkbox label {
        padding-left: 22px
    }

    .checkbox label:before {
        height: 16px;
        width: 16px
    }
}

.dotted, .dotted ul {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

.dotted ul li {
    background: rgba(0, 0, 0, .1);
    border-radius: 100px;
    cursor: pointer;
    height: 10px;
    margin-right: 10px;
    width: 10px
}

.dotted ul li:last-child {
    margin-right: 0
}

.dotted ul li.active {
    background: #333
}

.input {
    border-radius: 16px;
    -webkit-box-shadow: inset 0 0 0 2px var(--stroke);
    box-shadow: inset 0 0 0 2px var(--stroke);
    color: #231f20;
    font-family: Manrope, sans-serif;
    font-size: 16px;
    line-height: 24px;
    padding: 16px 20px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: 100%
}

.input::-webkit-input-placeholder {
    color: var(--gray)
}

.input::-moz-placeholder {
    color: var(--gray)
}

.input:-ms-input-placeholder {
    color: var(--gray)
}

.input::-ms-input-placeholder {
    color: var(--gray)
}

.input::placeholder {
    color: var(--gray)
}

.input:focus {
    -webkit-box-shadow: inset 0 0 0 2px var(--blue);
    box-shadow: inset 0 0 0 2px var(--blue)
}

.input-required {
    position: relative
}

.input-required:before {
    background: #d83f3f;
    border-radius: 100%;
    content: "";
    height: 4px;
    position: absolute;
    right: 12px;
    top: 12px;
    width: 4px;
    z-index: 2
}

.input-file label {
    -ms-grid-columns: auto 10px auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    grid-gap: 10px;
    background: #f0f4fb;
    border: 1px dashed var(--blue);
    border-radius: 16px;
    cursor: pointer;
    display: -ms-grid;
    display: grid;
    grid-template-columns:auto auto;
    justify-content: center;
    padding: 16px
}

.input-file__names, .input-file label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.input-file__names {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 12px;
    margin-top: 4px;
    max-width: 372px;
    overflow: auto
}

.input-file__names::-webkit-scrollbar {
    height: 5px
}

.input-file__names::-webkit-scrollbar-track {
    background: var(--stroke)
}

.input-file__names::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.input-file__name {
    color: var(--gray);
    font-size: 14px;
    line-height: 22px;
    white-space: nowrap
}

.textarea {
    min-height: 120px
}

@media screen and (max-width: 500px) {
    .input {
        padding: 12px 16px
    }

    .input-file label {
        padding: 12px 20px
    }

    .textarea {
        min-height: 80px
    }
}

.lightbox {
    background: rgba(0, 0, 0, .7);
    cursor: pointer;
    height: 100vh;
    left: 0;
    padding: 50px 20px;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 20
}

.lightbox__wrapper {
    width: 100%
}

.lightbox__content, .lightbox__wrapper {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    justify-content: center
}

.lightbox__content {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 80%
}

.lightbox__content iframe, .lightbox__content img, .lightbox__content video {
    max-height: 100%;
    max-width: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.lightbox__arrow {
    border: 2px solid #fff;
    border-bottom: none;
    border-right: none;
    cursor: pointer;
    height: 20px;
    width: 20px
}

.lightbox__arrow--prev {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    margin-right: 15px;
    order: 1;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.lightbox__arrow--next {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    margin-left: 15px;
    order: 3;
    -webkit-transform: rotate(-225deg);
    -ms-transform: rotate(-225deg);
    transform: rotate(-225deg)
}

@media screen and (max-width: 480px) {
    .lightbox {
        padding: 50px 10px
    }

    .lightbox__arrow--prev {
        margin-right: 5px
    }

    .lightbox__arrow--next {
        margin-left: 5px
    }
}

[data-lightbox] {
    cursor: pointer
}

[data-lightbox] > * {
    pointer-events: none
}

.radio {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.radio input:checked + label:before {
    background: var(--blue) url(images/icons/radio.svg) center no-repeat;
    background-size: 6px;
    -webkit-box-shadow: none;
    box-shadow: none
}

.radio input[disabled] + label {
    opacity: .5;
    pointer-events: none
}

.radio label {
    cursor: pointer;
    display: inline-block;
    padding-left: 26px;
    position: relative
}

.radio label:before {
    border-radius: 100%;
    -webkit-box-shadow: inset 0 0 0 1px var(--stroke);
    box-shadow: inset 0 0 0 1px var(--stroke);
    content: "";
    height: 18px;
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 18px
}

@media screen and (max-width: 500px) {
    .radio label {
        padding-left: 22px
    }

    .radio label:before {
        height: 16px;
        width: 16px
    }
}

.select {
    border-radius: 16px;
    -webkit-box-shadow: inset 0 0 0 2px var(--stroke);
    box-shadow: inset 0 0 0 2px var(--stroke);
    font-family: Manrope, sans-serif;
    font-size: 16px;
    line-height: 24px;
    padding: 16px 20px;
    position: relative;
    width: 100%
}

.select:hover {
    cursor: pointer
}

.select.open {
    -webkit-box-shadow: inset 0 0 0 2px var(--blue);
    box-shadow: inset 0 0 0 2px var(--blue)
}

.select__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border: 2px solid var(--stroke);
    border-radius: 12px;
    -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, .12);
    box-shadow: 0 4px 24px rgba(0, 0, 0, .12);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    left: 0;
    max-height: 300px;
    overflow-y: auto;
    padding: 8px 20px;
    position: absolute;
    top: calc(100% + 6px);
    width: 100%;
    z-index: 10
}

.select__list::-webkit-scrollbar {
    width: 5px
}

.select__list::-webkit-scrollbar-track {
    background: var(--gray)
}

.select__list::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.select__list li {
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s
}

.select__button, .select__list li {
    color: var(--black);
    cursor: pointer;
    width: 100%
}

.select__button {
    font-size: 16px;
    line-height: 24px;
    position: relative;
    text-align: left
}

.select__button:before {
    background: url(images/icons/select-arrow.svg) no-repeat 50%;
    content: "";
    height: 16px;
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 16px
}

.select__button.active:before {
    -webkit-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg)
}

@media screen and (max-width: 500px) {
    .select {
        padding: 12px 16px
    }
}

.swiper-btn {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background: var(--black);
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 38px;
    justify-content: center;
    width: 38px;
    z-index: 3
}

.swiper-btn:hover svg path {
    fill: #efcd18
}

.swiper-pagination {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    justify-content: center;
    overflow-x: auto;
    width: 100%;
    z-index: 2
}

.swiper-pagination-bullet {
    background: #ddd;
    border-radius: 100%;
    cursor: pointer;
    display: inline-block;
    gap: 12px;
    height: 6px;
    -webkit-transition: all .25s;
    -o-transition: all .25s;
    transition: all .25s;
    white-space: nowrap;
    width: 6px
}

.swiper-pagination-bullet-active {
    background: #efcd18
}

.about {
    background: url(images/main/bg.webp) 50% no-repeat;
    background-size: cover;
    position: relative
}

.about:before {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(top, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(180deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.about:after {
    background: -webkit-gradient(linear, left bottom, left top, from(#f1f5f8), to(rgba(241, 245, 248, 0)));
    background: -o-linear-gradient(bottom, #f1f5f8 0, rgba(241, 245, 248, 0) 100%);
    background: linear-gradient(0deg, #f1f5f8, rgba(241, 245, 248, 0));
    background-size: cover;
    bottom: 0;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%
}

.about__container {
    padding: 50px 0
}

.about__box {
    -ms-grid-columns: 1fr 20px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(2, 1fr);
    margin-bottom: 48px
}

.about__info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 36px
}

.about__info-title {
    margin-bottom: 24px
}

.about__info-text {
    margin-bottom: 16px
}

.about__advantages {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between
}

.about__advantages-item {
    border-right: 1px solid var(--stroke);
    display: block;
    padding-right: 42px
}

.about__advantages-item:last-child {
    border-right: 0;
    padding-right: 0
}

.about__advantages-counter {
    font-size: 36px;
    font-weight: 700;
    line-height: 44px
}

.about__price {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    padding: 36px;
    position: relative
}

.about__price-title {
    margin-bottom: 24px
}

.about__price-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px
}

.about__price-item {
    gap: 16px
}

.about__price-image, .about__price-item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.about__price-image {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    background: var(--black);
    border-radius: 100%;
    height: 48px;
    justify-content: center;
    width: 48px
}

.about__price-image img {
    height: 28px;
    width: 28px
}

.about__price-bg {
    bottom: 0;
    max-width: 279px;
    position: absolute;
    right: 0;
    width: 100%
}

.about__more {
    background: var(--white);
    border-radius: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    padding: 24px
}

.about__more-image {
    max-width: 248px;
    width: 100%
}

.about__more-image img {
    border-radius: 16px
}

@media screen and (max-width: 1200px) {
    .about__advantages {
        gap: 10px
    }
}

@media screen and (max-width: 1000px) {
    .about__box {
        -ms-grid-columns: 100%;
        gap: 24px;
        grid-template-columns:100%
    }

    .about__advantages {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .about__more {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

@media screen and (max-width: 700px) {
    .about__price {
        padding: 36px 36px 77px
    }

    .about__price-bg {
        max-width: 146px
    }
}

@media screen and (max-width: 500px) {
    .about__container {
        padding: 32px 0
    }

    .about__box {
        margin-bottom: 24px
    }

    .about__info {
        border-radius: 16px;
        padding: 16px
    }

    .about__info-title {
        margin-bottom: 12px
    }

    .about__advantages {
        gap: 10px
    }

    .about__advantages-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-right: 12px;
        text-align: center
    }

    .about__advantages-counter {
        font-size: 24px;
        line-height: 30px
    }

    .about__advantages-description {
        font-size: 12px;
        line-height: 18px
    }

    .about__price {
        border-radius: 16px;
        padding: 16px 16px 77px
    }

    .about__price-title {
        margin-bottom: 12px
    }

    .about__price-list {
        gap: 6px;
        position: relative;
        z-index: 2
    }

    .about__price-item {
        gap: 8px
    }

    .about__price-image {
        height: 36px;
        width: 36px
    }

    .about__price-image img {
        height: 24px;
        width: 24px
    }

    .about__price-bg {
        right: -10px
    }

    .about__more {
        border-radius: 16px;
        gap: 12px;
        padding: 16px
    }

    .about__more-image {
        max-width: 100%;
        width: 100%
    }
}

.advantages__container {
    padding: 50px 0
}

.advantages__box {
    -ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(4, 1fr)
}

.advantages__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--bg-1);
    border-radius: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    position: relative
}

.advantages__info {
    padding: 20px 16px;
    text-align: center
}

.advantages__marker {
    height: 32px;
    left: 16px;
    position: absolute;
    top: 16px;
    width: 32px
}

@media screen and (max-width: 1000px) {
    .advantages__box {
        -ms-grid-columns:(1fr) [ 3 ];
        grid-template-columns:repeat(3, 1fr)
    }
}

@media screen and (max-width: 800px) {
    .advantages__box {
        -ms-grid-columns:(1fr) [ 2 ];
        grid-template-columns:repeat(2, 1fr)
    }
}

@media screen and (max-width: 500px) {
    .advantages__container {
        padding: 32px 0
    }

    .advantages__box {
        -ms-grid-columns: 100%;
        gap: 8px;
        grid-template-columns:100%
    }

    .advantages__title {
        text-align: center
    }

    .advantages__item {
        -ms-grid-columns: 32% 1fr;
        border-radius: 16px;
        display: -ms-grid;
        display: grid;
        grid-template-columns:32% 1fr
    }

    .advantages__info {
        padding: 6px 16px 6px 12px;
        text-align: start
    }

    .advantages__image img {
        height: 100%;
        width: 100%
    }

    .advantages__marker {
        height: 24px;
        left: 6px;
        top: 6px;
        width: 24px
    }
}

.auto {
    background: #f1f5f8 url(images/main/bg.webp) 50% no-repeat;
    background-size: cover;
    position: relative
}

.auto:before {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(top, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(180deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.auto:after {
    background: -webkit-gradient(linear, left bottom, left top, from(#f1f5f8), to(rgba(241, 245, 248, 0)));
    background: -o-linear-gradient(bottom, #f1f5f8 0, rgba(241, 245, 248, 0) 100%);
    background: linear-gradient(0deg, #f1f5f8, rgba(241, 245, 248, 0));
    background-size: cover;
    bottom: 0;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%
}

.auto__container {
    padding: 50px 0
}

.auto__box {
    -ms-grid-columns: 1fr 20px 1fr 20px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(3, 1fr)
}

.auto__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--white);
    border-radius: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 6px;
    overflow: hidden;
    padding: 12px 20px 20px;
    text-align: center
}

.auto__image {
    max-width: 326px;
    width: 100%
}

.auto__name {
    font-size: 24px;
    line-height: 32px
}

.auto__description {
    color: var(--gray)
}

@media screen and (max-width: 800px) {
    .auto__box {
        -ms-grid-columns:(1fr) [ 2 ];
        grid-template-columns:repeat(2, 1fr)
    }
}

@media screen and (max-width: 500px) {
    .auto__container {
        padding: 32px 0
    }

    .auto__box {
        -ms-grid-columns: 100%;
        gap: 12px;
        grid-template-columns:100%
    }

    .auto__title {
        text-align: center
    }

    .auto__item {
        padding: 12px 16px
    }

    .auto__name {
        font-size: 20px;
        line-height: 26px
    }
}

.benefit__container {
    padding: 48px 0 50px
}

.benefit__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url(images/benefit/bg-1.webp) 50% no-repeat;
    background-size: cover;
    border-radius: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 32px 36px;
    position: relative
}

.benefit__title {
    color: var(--white);
    max-width: 664px;
    width: 100%
}

.benefit__image {
    max-width: 313px;
    position: absolute;
    right: 291px;
    top: 0;
    width: 100%
}

.benefit__btn {
    max-width: 226px;
    width: 100%
}

@media screen and (max-width: 1200px) {
    .benefit__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .benefit__image {
        position: relative;
        right: auto;
        top: auto
    }

    .benefit__title {
        text-align: center
    }
}

@media screen and (max-width: 500px) {
    .benefit__container {
        padding: 18px 0 32px
    }

    .benefit__box {
        gap: 0;
        padding: 16px
    }

    .benefit__title br {
        display: none
    }

    .benefit__btn {
        max-width: 100%
    }
}

.cities__container {
    padding: 50px 0
}

.cities__box {
    background: var(--white);
    border-radius: 48px;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    overflow: hidden;
    padding: 64px;
    position: relative
}

.cities__list, .cities__title {
    position: relative;
    z-index: 2
}

.cities__list {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -ms-grid-columns: 1fr 16px 1fr 16px 1fr 16px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 16px;
    grid-template-columns:repeat(4, 1fr);
    justify-content: space-between;
    max-height: 264px;
    max-width: 797px;
    overflow-y: auto
}

.cities__list::-webkit-scrollbar {
    width: 5px
}

.cities__list::-webkit-scrollbar-track {
    background: var(--stroke)
}

.cities__list::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.cities__image {
    bottom: 0;
    max-width: 477px;
    position: absolute;
    right: 0
}

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

@media screen and (max-width: 800px) {
    .cities__image {
        display: none
    }

    .cities__list {
        -ms-grid-columns:(1fr) [ 3 ];
        grid-template-columns:repeat(3, 1fr);
        max-width: 100%
    }
}

@media screen and (max-width: 600px) {
    .cities__list {
        -ms-grid-columns: 1fr 12px 1fr;
        gap: 12px;
        grid-template-columns:repeat(2, 1fr)
    }
}

@media screen and (max-width: 500px) {
    .cities__container {
        padding: 32px 0
    }

    .cities__box {
        border-radius: 16px;
        padding: 16px
    }

    .cities__title {
        text-align: center
    }
}

.compare-m {
    background: #f1f5f8;
    display: none
}

.compare-m__container {
    padding: 32px 0
}

.compare-m__title {
    text-align: center
}

.compare-m__swiper .swiper-slide {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    padding: 16px
}

.compare-m__swiper .swiper-slide:first-child {
    background: var(--theme-gradient);
    color: var(--white)
}

.compare-m__swiper .swiper-slide:first-child .compare-m__name {
    color: hsla(0, 0%, 100%, .6)
}

.compare-m__swiper .swiper-slide:first-child .compare-m__subtitle {
    color: var(--white)
}

.compare-m__subtitle {
    color: var(--blue);
    font-size: 18px;
    line-height: 26px
}

.compare-m__name {
    color: var(--gray)
}

.compare-m__list {
    gap: 4px
}

.compare-m__item, .compare-m__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.compare-m__item {
    border-bottom: 1px solid var(--stroke);
    gap: 2px;
    padding-bottom: 4px
}

.compare-m__item:last-child {
    border-bottom: none
}

.compare-m__controls {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    justify-content: center;
    margin-top: 16px
}

.compare-m__controls .swiper-pagination {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

@media screen and (max-width: 500px) {
    .compare-m {
        display: block
    }
}

.compare {
    background: #f1f5f8
}

.compare__container {
    padding: 50px 0
}

.compare__table-wrapper {
    overflow: auto;
    width: 100%
}

.compare__table-wrapper::-webkit-scrollbar {
    height: 5px
}

.compare__table-wrapper::-webkit-scrollbar-track {
    background: var(--stroke)
}

.compare__table-wrapper::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.compare__table {
    border-collapse: collapse;
    display: table;
    min-width: 1024px;
    width: 100%
}

.compare__table thead {
    display: block;
    font-weight: 700;
    padding-right: 5px
}

.compare__table thead tr {
    -ms-grid-columns: minmax(0, 221px) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    display: -ms-grid;
    display: grid;
    grid-template-columns:minmax(0, 221px) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)
}

.compare__table thead tr td {
    color: var(--blue);
    display: block;
    padding: 0 13px 24px;
    text-align: center;
    white-space: nowrap
}

.compare__table thead tr td:last-child {
    border-right: 0
}

.compare__table tbody {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-weight: 600
}

.compare__table tbody tr {
    -ms-grid-columns: minmax(0, 221px) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    background: var(--white);
    border-bottom: 1px solid var(--stroke);
    display: -ms-grid;
    display: grid;
    grid-template-columns:minmax(0, 221px) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr)
}

.compare__table tbody tr:first-child {
    border-radius: 24px 24px 0 0;
    overflow: hidden
}

.compare__table tbody tr:last-child {
    border-bottom: 0;
    border-radius: 0 0 24px 24px;
    overflow: hidden
}

.compare__table tbody tr td {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-right: 1px solid #d1d3d4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    padding: 13px;
    text-align: center
}

.compare__table tbody tr td:first-child {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    background: var(--bg-2);
    font-weight: 700;
    justify-content: start
}

.compare__table tbody tr td:nth-child(2) {
    background: var(--theme-gradient);
    color: var(--white)
}

.compare__table tbody tr td:last-child {
    border-right: 0
}

@media screen and (max-width: 500px) {
    .compare {
        display: none
    }
}

.contacts {
    min-height: 636px;
    position: relative
}

.contacts__container {
    padding: 44px 0
}

.contacts__map {
    left: 0;
    min-height: 636px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.contacts__box {
    background: var(--white);
    border-radius: 24px;
    -webkit-box-shadow: 0 0 24px rgba(0, 0, 0, .06);
    box-shadow: 0 0 24px rgba(0, 0, 0, .06);
    max-width: 441px;
    padding: 36px;
    position: relative;
    width: 100%;
    z-index: 2
}

.contacts__content {
    gap: 16px
}

.contacts__content, .contacts__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.contacts__item {
    gap: 6px
}

.contacts__name {
    color: var(--gray)
}

.contacts__value {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px
}

.contacts__btn {
    max-width: 226px;
    width: 100%
}

.contacts__social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 6px
}

.contacts__social-item {
    height: 36px;
    width: 36px
}

.contacts__social-item img {
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: 100%
}

.contacts__social-item:hover img {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
}

.contacts-link:hover {
    color: var(--blue)
}

@media screen and (max-width: 500px) {
    .contacts__container {
        padding: 50px 0 24px
    }

    .contacts__box {
        background: var(--bg-1);
        border-radius: 16px;
        -webkit-box-shadow: none;
        box-shadow: none;
        max-width: 100%;
        padding: 16px
    }

    .contacts__title {
        margin: 0 0 24px !important
    }

    .contacts__item {
        gap: 2px
    }

    .contacts__value {
        font-size: 16px;
        line-height: 24px
    }

    .contacts__btn {
        max-width: 100%
    }

    .contacts__map {
        max-height: 250px;
        min-height: 250px;
        position: relative
    }

    .contacts__links {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 6px
    }
}

.documents__container {
    padding: 50px 0
}

.documents__box {
    background: url(images/documents/bg.webp) 50% no-repeat;
    background-size: cover;
    border-radius: 64px;
    padding: 64px
}

.documents__list {
    -ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr 20px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(5, 1fr);
    margin-bottom: 24px
}

.documents__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 24px;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    position: relative
}

.documents__item, .documents__number {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.documents__number {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--bg-2);
    border-radius: 100%;
    font-size: 18px;
    height: 32px;
    justify-content: center;
    left: 16px;
    line-height: 26px;
    position: absolute;
    top: 16px;
    width: 32px
}

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

.documents__name {
    text-align: center
}

.documents__description {
    background: var(--white);
    border-radius: 24px;
    color: var(--gray);
    padding: 24px;
    text-align: center
}

@media screen and (max-width: 1200px) {
    .documents__box {
        padding: 32px
    }
}

@media screen and (max-width: 1000px) {
    .documents__list {
        -ms-grid-columns:(1fr) [ 3 ];
        grid-template-columns:repeat(3, 1fr)
    }
}

@media screen and (max-width: 700px) {
    .documents__list {
        -ms-grid-columns: 1fr 12px 1fr;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        gap: 12px;
        grid-template-columns:repeat(2, 1fr);
        justify-content: center
    }
}

@media screen and (max-width: 500px) {
    .documents__container {
        padding: 32px 0
    }

    .documents__title {
        text-align: center
    }

    .documents__box {
        border-radius: 24px;
        padding: 16px
    }

    .documents__item {
        border-radius: 16px;
        gap: 6px;
        padding: 0
    }

    .documents__name {
        padding: 0 8px 10px
    }

    .documents__number {
        font-size: 16px;
        height: 24px;
        left: 6px;
        line-height: 24px;
        top: 6px;
        width: 24px
    }

    .documents__description {
        padding: 16px
    }
}

.estimation {
    background: #f1f5f8
}

.estimation__container {
    padding: 50px 0 24px
}

.estimation__form {
    -ms-grid-columns: minmax(auto, 812px) 38px minmax(auto, 418px);
    background: var(--white);
    border-radius: 24px;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    gap: 38px;
    grid-template-columns:minmax(auto, 812px) minmax(auto, 418px);
    padding: 36px
}

.estimation__form, .estimation__left {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -ms-grid;
    display: grid;
    justify-content: space-between
}

.estimation__left {
    -ms-grid-columns: minmax(auto, 294px) 10px minmax(auto, 432px);
    gap: 10px;
    grid-template-columns:minmax(auto, 294px) minmax(auto, 432px)
}

.estimation__right {
    border-left: 2px solid var(--stroke);
    gap: 16px;
    padding-left: 38px
}

.estimation__auto, .estimation__right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.estimation__auto {
    gap: 12px
}

.estimation__config {
    -ms-grid-columns: auto 56px auto;
    grid-column-gap: 56px;
    grid-row-gap: 24px;
    display: -ms-grid;
    display: grid;
    grid-template-columns:auto auto
}

.estimation__config-wrapper {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.estimation__config-block, .estimation__config-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.estimation__config-block {
    gap: 8px
}

.estimation__subtitle {
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    margin-bottom: 8px
}

.estimation__subtitle br {
    display: none
}

.estimation__subtitle--auto {
    margin-bottom: 16px
}

.estimation__progress {
    position: relative
}

.estimation__progress-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 12px;
    bottom: 10px;
    color: var(--gray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    gap: 8px;
    left: 50%;
    line-height: 22px;
    padding: 12px 16px;
    position: absolute;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: calc(100% - 32px)
}

.estimation__progress-counter {
    display: inline-block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.estimation__progress-line {
    background: var(--stroke);
    height: 2px;
    max-width: 320px;
    position: relative;
    width: 100%
}

.estimation__progress-value {
    background: var(--blue);
    height: 2px;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all .25s;
    -o-transition: all .25s;
    transition: all .25s
}

.estimation__image {
    max-width: 384px;
    width: 100%
}

.estimation__image img {
    border-radius: 12px;
    width: 100%
}

.estimation__description {
    background: var(--bg-2);
    border-radius: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px;
    padding: 16px
}

.estimation__description img {
    height: 24px;
    width: 24px
}

.estimation__btn {
    margin-top: auto;
    width: 100%
}

@media screen and (max-width: 1200px) {
    .estimation__form {
        -ms-grid-columns: 100%;
        grid-template-columns:100%
    }

    .estimation__right {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-left: 0;
        padding-left: 0
    }
}

@media screen and (max-width: 900px) {
    .estimation__left {
        -ms-grid-columns: 100%;
        grid-template-columns:100%
    }

    .estimation__config {
        -ms-grid-columns: 1fr 12px 1fr;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        grid-column-gap: 12px;
        grid-template-columns:1fr 1fr;
        justify-content: space-between
    }

    .estimation__config-wrapper {
        gap: 16px
    }
}

@media screen and (max-width: 500px) {
    .estimation__container {
        padding: 32px 0 18px
    }

    .estimation__title {
        text-align: center
    }

    .estimation__subtitle {
        font-size: 16px;
        line-height: 24px
    }

    .estimation__subtitle--auto {
        margin-bottom: 8px
    }

    .estimation__subtitle br {
        display: block
    }

    .estimation__form {
        border-radius: 16px;
        gap: 20px;
        padding: 16px
    }

    .estimation__auto {
        gap: 8px
    }

    .estimation__progress-wrapper {
        padding: 8px 12px;
        width: calc(100% - 12px)
    }

    .estimation__right {
        gap: 10px
    }
}

.footer {
    background: var(--black)
}

.footer__container {
    padding: 24px 0
}

.footer__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    justify-content: space-between
}

.footer__logo {
    max-width: 222px
}

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

.footer__politics {
    color: var(--white);
    font-size: 14px;
    line-height: 22px;
    text-decoration: underline
}

.footer__politics:hover {
    color: #efcd18
}

@media screen and (max-width: 800px) {
    .footer__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.header {
    background: #fff;
    -webkit-box-shadow: 0 0 16px 0 rgba(19, 22, 39, .1);
    box-shadow: 0 0 16px 0 rgba(19, 22, 39, .1);
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 10
}

.header__container {
    padding: 17px 0 16px
}

.header__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    justify-content: space-between
}

.header__logo {
    height: 43px;
    max-width: 222px;
    width: 100%
}

.header__menu {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px
}

.header__menu-item {
    color: var(--gray)
}

.header__menu-item:hover {
    color: var(--black)
}

.header__menu-item a.active {
    color: var(--blue)
}

.header__info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0
}

.header__socials, .header__socials-wrapper {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px
}

.header__socials-wrapper {
    color: var(--gray);
    font-size: 14px;
    line-height: 22px;
    margin-left: 3px
}

.header__socials-item {
    height: 20px;
    width: 20px
}

.header__socials-item img {
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s
}

.header__socials-item:hover img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1)
}

.header__phone {
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
    white-space: nowrap
}

.header__phone:hover {
    color: var(--blue)
}

.header__btn {
    max-width: 162px;
    padding: 12px 16px;
    width: 100%
}

.header__mobile, .header__mobile-messengers {
    display: none
}

@media screen and (max-width: 1200px) {
    .header__menu {
        gap: 9px
    }
}

@media screen and (max-width: 1000px) {
    .header__btn, .header__info, .header__menu {
        display: none
    }

    .header__mobile {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 24px
    }

    .header__phone-mobile {
        height: 24px;
        width: 24px
    }

    .header__mobile-messengers {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 6px
    }

    .header__mobile-messengers img {
        height: 20px;
        min-width: 20px
    }
}

@media screen and (max-width: 500px) {
    .header__container {
        padding: 12px 0
    }

    .header__logo {
        max-width: 189px
    }
}

@media screen and (max-width: 400px) {
    .header__mobile-messengers {
        display: none
    }
}

.messengers__container {
    padding: 50px 0
}

.messengers__box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: url(images/messengers/bg.webp) 50% no-repeat;
    background-size: cover;
    border-radius: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 24px;
    overflow: hidden;
    padding: 64px;
    position: relative
}

.messengers__image {
    bottom: 0;
    height: auto;
    max-width: 411px;
    position: absolute;
    right: 44px;
    width: 100%
}

.messengers__title {
    color: var(--white)
}

.messengers__items {
    gap: 12px
}

.messengers__item, .messengers__items {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.messengers__item {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    background: var(--white);
    border-radius: 16px;
    gap: 6px;
    justify-content: center;
    padding: 12px 16px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.messengers__item:hover {
    color: var(--blue)
}

@media screen and (max-width: 1200px) {
    .messengers__image {
        right: -150px
    }
}

@media screen and (max-width: 900px) {
    .messengers__box {
        padding: 64px 64px 150px
    }

    .messengers__image {
        max-width: 200px;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%)
    }
}

@media screen and (max-width: 500px) {
    .messengers__container {
        padding: 32px 0
    }

    .messengers__box {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        background: url(images/messengers/bg-mobile.webp) 50% no-repeat;
        background-size: cover;
        gap: 16px;
        padding: 28px 16px 106px
    }

    .messengers__image {
        max-width: 155px
    }

    .messengers__title {
        text-align: center
    }

    .messengers__items {
        gap: 4px
    }

    .messengers__item {
        border-radius: 12px;
        gap: 2px;
        padding: 6px
    }

    .messengers__item img {
        height: 16px;
        width: 16px
    }
}

.models {
    background: #f1f5f8;
    position: relative
}

.models:after {
    background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(bottom, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(0deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    bottom: 0;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%
}

.models__container {
    padding: 24px 0 50px
}

.models__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--white);
    border-radius: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 34px 48px
}

.models__title {
    max-width: 275px;
    width: 100%
}

.models__swiper {
    max-width: 832px;
    width: 100%
}

.models__swiper .swiper-wrapper {
    -webkit-transition-timing-function: linear;
    -o-transition-timing-function: linear;
    transition-timing-function: linear
}

.models__swiper .swiper-slide {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 6px
}

.models__name {
    font-size: 13px;
    line-height: 22px;
    text-align: center;
    text-transform: uppercase
}

@media screen and (max-width: 800px) {
    .models__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .models__title {
        text-align: center
    }
}

@media screen and (max-width: 500px) {
    .models__container {
        padding: 18px 0 32px
    }

    .models__box {
        border-radius: 16px;
        overflow: hidden;
        padding: 16px
    }

    .models__swiper {
        overflow: visible
    }

    .models__swiper .swiper-slide {
        max-width: 76px
    }

    .models__name {
        font-size: 12px;
        line-height: 18px
    }
}

.offer {
    background: url(images/offer/offer-bg.webp) top no-repeat;
    background-size: auto
}

.offer__container {
    padding: 41px 0
}

.offer__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    position: relative
}

.offer__info {
    margin-top: 56px;
    max-width: 512px;
    padding-left: 16px;
    width: 100%
}

.offer__title {
    font-size: 62px;
    font-weight: 700;
    line-height: 70px;
    margin-bottom: 32px;
    position: relative
}

.offer__title-advantages {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--white);
    border-radius: 16px;
    color: var(--black);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    gap: 8px;
    left: 0;
    letter-spacing: .96px;
    line-height: 22px;
    max-width: 294px;
    padding: 6px 16px;
    position: absolute;
    text-transform: uppercase;
    top: -58px;
    width: 100%;
    z-index: 3
}

.offer__title-advantages img {
    height: 36px;
    width: 36px
}

.offer__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 18px;
    gap: 14px;
    line-height: 28px
}

.offer__list-item {
    padding-left: 36px;
    position: relative
}

.offer__list-item:before {
    background: url(images/icons/custom-marker.svg) 50% no-repeat;
    background-size: 32px;
    content: "";
    height: 32px;
    left: 0;
    position: absolute;
    top: 0;
    width: 32px
}

.offer__form {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--white);
    border-radius: 16px;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .12);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 420px;
    padding: 24px;
    width: 100%;
    z-index: 2
}

.offer__form-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 38px;
    margin-bottom: 24px
}

.offer__form-title br {
    display: none
}

.offer__form-subtitle {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    margin-bottom: 12px
}

.offer__form-inputs {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px
}

.offer__form-radios {
    -ms-grid-columns: 1fr 36px 1fr;
    -webkit-column-gap: 36px;
    -moz-column-gap: 36px;
    column-gap: 36px;
    display: -ms-grid;
    display: grid;
    grid-template-columns:1fr 1fr;
    margin-bottom: 20px;
    row-gap: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.offer__form-radios .radio {
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content
}

.offer__form-btn {
    width: 100%
}

.offer__image {
    bottom: 4px;
    max-width: 527px;
    position: absolute;
    right: 307px;
    width: 100%
}

.offer__image-description {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background: var(--white);
    border-radius: 24px;
    color: #05b417;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: 96px;
    max-width: 306px;
    padding: 16px;
    position: absolute;
    text-align: center;
    top: -80px;
    -webkit-transform: rotate(-8.927deg);
    -ms-transform: rotate(-8.927deg);
    transform: rotate(-8.927deg);
    width: 100%
}

@media screen and (max-width: 1200px) {
    .offer__image {
        right: 50px
    }

    .offer__image-description {
        display: none
    }
}

@media screen and (max-width: 1000px) {
    .offer {
        background-position: top
    }

    .offer__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 16px
    }

    .offer__image {
        bottom: auto;
        max-width: 365px;
        position: relative;
        right: auto
    }

    .offer__title {
        margin-bottom: 10px;
        text-align: center
    }

    .offer__list {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 5px
    }
}

@media screen and (max-width: 500px) {
    .offer__box {
        gap: 0
    }

    .offer__container {
        padding: 36px 0 18px
    }

    .offer__title {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        font-size: 36px;
        gap: 12px;
        line-height: 42px
    }

    .offer__title-advantages {
        font-size: 14px;
        left: auto;
        letter-spacing: .84px;
        line-height: 20px;
        max-width: 254px;
        padding: 6px 12px;
        position: relative;
        text-align: start;
        top: auto
    }

    .offer__info {
        margin-top: 0;
        padding-left: 0
    }

    .offer__list {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 14px;
        gap: 6px;
        line-height: 20px;
        margin-bottom: 63px
    }

    .offer__list-item {
        padding-left: 26px
    }

    .offer__list-item:before {
        background-size: 24px;
        height: 24px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 24px
    }

    .offer__image {
        max-width: 100%
    }

    .offer__image-description {
        display: block;
        left: 50%;
        padding: 2px 20px;
        top: -40px;
        -webkit-transform: translateX(-50%) rotate(-8.927deg);
        -ms-transform: translateX(-50%) rotate(-8.927deg);
        transform: translateX(-50%) rotate(-8.927deg)
    }

    .offer__form {
        max-width: 100%;
        padding: 16px
    }

    .offer__form-title {
        font-size: 20px;
        line-height: 26px;
        text-align: center
    }

    .offer__form-title br {
        display: block
    }

    .offer__form-inputs {
        gap: 8px;
        margin-bottom: 16px
    }

    .offer__form-radios {
        margin-bottom: 16px
    }
}

.primacy {
    background: #f1f5f8
}

.primacy__container {
    padding: 50px 0
}

.primacy__box {
    -ms-grid-columns: 1fr 20px 1fr;
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(2, 1fr)
}

.primacy__item {
    background: var(--white);
    border-radius: 24px;
    overflow: hidden;
    padding: 25px 36px;
    position: relative
}

.primacy__info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 6px;
    max-width: 404px;
    position: relative;
    z-index: 2
}

.primacy__name {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px
}

.primacy__description {
    color: var(--gray)
}

.primacy__image {
    bottom: 0;
    max-width: 209px;
    position: absolute;
    right: 0;
    width: 100%
}

@media screen and (max-width: 1200px) {
    .primacy__info {
        max-width: 300px
    }

    .primacy__image {
        max-width: 155px
    }
}

@media screen and (max-width: 800px) {
    .primacy__box {
        -ms-grid-columns: 100%;
        grid-template-columns:100%
    }
}

@media screen and (max-width: 500px) {
    .primacy__container {
        padding: 32px 0
    }

    .primacy__box {
        gap: 12px
    }

    .primacy__title {
        text-align: center
    }

    .primacy__item {
        padding: 16px 16px 49px
    }

    .primacy__image {
        max-width: 88px
    }

    .primacy__name {
        font-size: 20px;
        line-height: 26px
    }
}

.problem {
    background: #f1f5f8;
    position: relative
}

.problem:after {
    background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(bottom, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(0deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    bottom: 0;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%
}

.problem__container {
    padding: 24px 0 50px
}

.problem__box {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url(images/messengers/bg.webp) 50% no-repeat;
    background-size: cover;
    border-radius: 24px;
    gap: 36px;
    justify-content: space-between;
    padding: 17px 48px
}

.problem__box, .problem__info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.problem__info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    color: var(--white);
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px
}

.problem__image {
    max-width: 218px
}

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

.problem__btn {
    min-width: 212px
}

@media screen and (max-width: 1000px) {
    .problem__info {
        text-align: center
    }

    .problem__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

@media screen and (max-width: 500px) {
    .problem:after {
        height: 32px
    }

    .problem__container {
        padding: 18px 0 32px
    }

    .problem__box {
        background: url(images/messengers/bg-mobile.webp) 50% no-repeat;
        background-size: cover;
        gap: 6px;
        padding: 12px 16px 16px
    }

    .problem__info {
        gap: 12px
    }

    .problem__image {
        max-width: 63%
    }

    .problem__title {
        margin: 0 auto
    }

    .problem__btn {
        width: 100%
    }
}

.profit {
    background: #f1f5f8;
    position: relative
}

.profit:after {
    background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(bottom, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(0deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    bottom: 0;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    width: 100%
}

.profit__container {
    padding: 50px 0
}

.profit__box {
    -ms-grid-columns: minmax(0, 612px) 16px minmax(0, 640px);
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -ms-grid;
    display: grid;
    gap: 16px;
    grid-template-columns:minmax(0, 612px) minmax(0, 640px);
    justify-content: space-between
}

.profit__image img {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    width: 100%
}

.profit__list {
    gap: 16px
}

.profit__item, .profit__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.profit__item {
    border-bottom: 1px solid #ddd;
    gap: 12px;
    padding-bottom: 16px
}

.profit__text {
    -webkit-animation: fadeInFromNone .25s ease-in-out;
    animation: fadeInFromNone .25s ease-in-out;
    color: var(--gray);
    display: none;
    text-align: start
}

.profit__text.active {
    display: block
}

.profit__toggler {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 18px;
    font-weight: 700;
    gap: 16px;
    justify-content: space-between;
    line-height: 26px;
    text-align: start
}

.profit__toggler.active .profit__plus-ve {
    opacity: 0
}

.profit__plus {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 17.5px;
    justify-content: center;
    position: relative;
    width: 17.5px
}

.profit__plus-ve {
    height: 17.5px;
    left: 50%;
    opacity: 1;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%) rotate(0deg);
    -ms-transform: translateX(-50%) rotate(0deg);
    transform: translateX(-50%) rotate(0deg);
    -webkit-transition: opacity .25s;
    -o-transition: opacity .25s;
    transition: opacity .25s;
    width: 2px
}

.profit__plus-go, .profit__plus-ve {
    background: var(--black);
    border-radius: 100px;
    display: block
}

.profit__plus-go {
    height: 2px;
    width: 17.5px
}

.profit__plus:hover .profit__plus-go, .profit__plus:hover .profit__plus-ve {
    background: #efcd18;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s
}

@media screen and (max-width: 800px) {
    .profit__box {
        -ms-grid-columns: 100%;
        grid-template-columns:100%
    }
}

@media screen and (max-width: 500px) {
    .profit__container {
        padding: 32px 0
    }

    .profit__image {
        margin: 0 auto;
        max-width: 60%
    }

    .profit__toggler {
        font-size: 16px;
        line-height: 24px
    }
}

.questions {
    background: #f1f5f8;
    position: relative
}

.questions__container {
    padding: 50px 0 24px
}

.questions__list {
    gap: 12px;
    width: 100%
}

.questions__item, .questions__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.questions__item {
    background: var(--white);
    border-radius: 16px;
    gap: 2px;
    padding: 12px 36px
}

.questions__text {
    -webkit-animation: fadeInFromNone .25s ease-in-out;
    animation: fadeInFromNone .25s ease-in-out;
    display: none;
    text-align: start
}

.questions__text.active {
    display: block
}

.questions__toggler {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 18px;
    font-weight: 700;
    gap: 16px;
    justify-content: space-between;
    line-height: 26px;
    text-align: start
}

.questions__toggler.active .questions__plus-ve {
    opacity: 0
}

.questions__name br {
    display: none
}

.questions__plus {
    height: 17.5px;
    position: relative;
    width: 17.5px
}

.questions__plus, .questions__plus-wrapper {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

.questions__plus-wrapper {
    background: var(--bg-2);
    border-radius: 100%;
    height: 42px;
    min-width: 42px
}

.questions__plus-wrapper:hover .questions__plus-go, .questions__plus-wrapper:hover .questions__plus-ve {
    background: #efcd18;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s
}

.questions__plus-ve {
    height: 17.5px;
    left: 50%;
    opacity: 1;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%) rotate(0deg);
    -ms-transform: translateX(-50%) rotate(0deg);
    transform: translateX(-50%) rotate(0deg);
    -webkit-transition: opacity .25s;
    -o-transition: opacity .25s;
    transition: opacity .25s;
    width: 2.5px
}

.questions__plus-go, .questions__plus-ve {
    background: var(--black);
    border-radius: 100px;
    display: block
}

.questions__plus-go {
    height: 2.5px;
    width: 17.5px
}

@media screen and (max-width: 500px) {
    .questions__container {
        padding: 32px 0 18px
    }

    .questions__title {
        text-align: center
    }

    .questions__list {
        gap: 8px
    }

    .questions__item {
        padding: 6px 16px
    }

    .questions__toggler {
        font-size: 16px;
        line-height: 24px
    }

    .questions__plus {
        height: 16px;
        width: 16px
    }

    .questions__plus-go {
        width: 16px
    }

    .questions__plus-ve {
        height: 16px;
        width: 2px
    }

    .questions__plus-wrapper {
        height: 24px;
        min-width: 24px;
        width: 24px
    }

    .questions__name br {
        display: block
    }
}

.ransom-m {
    display: none
}

.ransom-m__container {
    padding: 12px 0 32px
}

.ransom-m__box {
    background: var(--white);
    border-radius: 16px;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .12);
    padding: 16px 16px 0
}

.ransom-m__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px;
    max-height: 469px;
    overflow: auto;
    padding-right: 6px
}

.ransom-m__list::-webkit-scrollbar {
    width: 2px
}

.ransom-m__list::-webkit-scrollbar-track {
    background: var(--stroke)
}

.ransom-m__list::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.ransom-m__list-item {
    background: var(--bg-1);
    border-radius: 16px;
    padding: 12px
}

.ransom-m__list-item:last-child {
    margin-bottom: 16px
}

.ransom-m__sublist {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2px
}

.ransom-m__sublist, .ransom-m__sublist-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ransom-m__sublist-item {
    gap: 8px
}

.ransom-m__name {
    color: var(--gray)
}

@media screen and (max-width: 500px) {
    .ransom-m {
        display: block
    }
}

.ransom-table__container {
    padding: 24px 0 50px
}

.ransom-table__table-wrapper {
    border-radius: 12px;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .06);
    overflow: auto;
    width: 100%
}

.ransom-table__table-wrapper::-webkit-scrollbar {
    height: 5px
}

.ransom-table__table-wrapper::-webkit-scrollbar-track {
    background: var(--stroke)
}

.ransom-table__table-wrapper::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.ransom-table__table {
    background: #fff;
    border-collapse: collapse;
    min-width: 1024px;
    width: 100%
}

.ransom-table__table thead {
    background: var(--bg-2);
    display: block;
    font-weight: 700;
    padding-right: 5px
}

.ransom-table__table thead tr {
    -ms-grid-columns: minmax(0, 310px) minmax(0, 220px) minmax(0, 220px) minmax(0, 220px) minmax(0, 330px);
    border-bottom: 1px solid #d1d3d4;
    display: -ms-grid;
    display: grid;
    grid-template-columns:minmax(0, 310px) minmax(0, 220px) minmax(0, 220px) minmax(0, 220px) minmax(0, 330px)
}

.ransom-table__table thead tr td {
    border-right: 1px solid #d1d3d4;
    display: block;
    padding: 16px 36px 14px;
    white-space: nowrap
}

.ransom-table__table thead tr td:last-child {
    border-right: 0
}

.ransom-table__table tbody {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-weight: 600;
    max-height: 342px;
    overflow: auto
}

.ransom-table__table tbody::-webkit-scrollbar {
    width: 5px
}

.ransom-table__table tbody::-webkit-scrollbar-track {
    background: var(--stroke)
}

.ransom-table__table tbody::-webkit-scrollbar-thumb {
    background: var(--blue);
    border-radius: 20px
}

.ransom-table__table tbody tr {
    -ms-grid-columns: minmax(0, 310px) minmax(0, 220px) minmax(0, 220px) minmax(0, 220px) minmax(0, 330px);
    background: #fff;
    border-bottom: 1px solid #d1d3d4;
    display: -ms-grid;
    display: grid;
    grid-template-columns:minmax(0, 310px) minmax(0, 220px) minmax(0, 220px) minmax(0, 220px) minmax(0, 330px)
}

.ransom-table__table tbody tr:last-child {
    border-bottom: 0
}

.ransom-table__table tbody tr td {
    border-right: 1px solid #d1d3d4;
    display: block;
    padding: 12px 36px
}

.ransom-table__table tbody tr td:last-child {
    border-right: 0
}

@media screen and (max-width: 500px) {
    .ransom-table {
        display: none
    }
}

.ransom {
    overflow: hidden
}

.ransom__container {
    padding: 50px 0 24px
}

.ransom__box {
    position: relative
}

.ransom__swiper .swiper-slide {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px
}

.ransom__swiper .swiper-pagination {
    margin-top: 24px
}

.ransom__controls {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    gap: 16px;
    justify-content: center;
    margin-top: 16px
}

.ransom__controls, .ransom__description {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ransom__description {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: var(--bg-1);
    border-radius: 16px;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px;
    padding: 16px
}

.ransom__name {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px
}

.ransom__price {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px
}

.ransom__config {
    color: var(--gray)
}

.ransom__config-value {
    color: var(--black);
    display: inline-block
}

.ransom__images {
    position: relative;
    width: 100%
}

.ransom__images img {
    border-radius: 16px;
    height: 100%;
    max-height: 270px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

.ransom__images .swiper-pagination {
    bottom: 16px;
    position: absolute;
    z-index: 2
}

@media screen and (max-width: 500px) {
    .ransom {
        overflow: visible
    }

    .ransom__container {
        padding: 32px 0 24px
    }

    .ransom__title {
        text-align: center
    }

    .ransom__description {
        gap: 6px;
        padding: 12px
    }

    .ransom__price {
        font-size: 20px;
        line-height: 26px
    }

    .ransom__name {
        font-size: 16px;
        line-height: 24px
    }

    .ransom__swiper .swiper-slide {
        gap: 4px
    }
}

.reviews {
    background: #f0f4fb;
    overflow: hidden;
    position: relative
}

.reviews:before {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(hsla(0, 0%, 100%, 0)));
    background: -o-linear-gradient(top, #fff 0, hsla(0, 0%, 100%, 0) 100%);
    background: linear-gradient(180deg, #fff, hsla(0, 0%, 100%, 0));
    background-size: cover;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.reviews__container {
    padding: 50px 0
}

.reviews__box {
    position: relative
}

.reviews__swiper .swiper-pagination {
    margin-top: 16px
}

.reviews__swiper .swiper-slide img {
    border-radius: 16px;
    height: auto;
    width: 100%
}

.reviews__btn-next, .reviews__btn-prev {
    left: -16px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.reviews__btn-next {
    left: auto;
    right: -16px
}

@media screen and (max-width: 500px) {
    .reviews {
        overflow: hidden
    }

    .reviews__container {
        padding: 32px 0
    }

    .reviews__title {
        text-align: center
    }

    .reviews__btn-next, .reviews__btn-prev {
        display: none
    }

    .reviews__swiper {
        overflow: visible
    }
}

.seo__container {
    padding: 50px 0 24px
}

.seo__content {
    margin-bottom: 24px;
    max-height: 462px;
    overflow: hidden
}

.seo__content.active {
    max-height: 100%;
    overflow: visible
}

.seo__more {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 500;
    gap: 9px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

.seo__more.active svg {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.seo__more:hover {
    color: var(--blue)
}

.seo__more:hover svg path {
    fill: var(--blue);
    -webkit-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s
}

@media screen and (max-width: 500px) {
    .seo__container {
        padding: 32px 0 18px
    }
}

.steps {
    background: #f1f5f8
}

.steps__container {
    padding: 50px 0
}

.steps__box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url(images/steps/bg.webp) 50% no-repeat;
    background-size: cover;
    border-radius: 36px;
    gap: 15px;
    padding: 36px 48px
}

.steps__box, .steps__info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.steps__info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 24px;
    max-width: 274px;
    width: 100%
}

.steps__list {
    -ms-grid-columns: minmax(0, 167px) 20px minmax(0, 167px) 20px minmax(0, 167px) 20px minmax(0, 167px) 20px minmax(0, 167px);
    display: -ms-grid;
    display: grid;
    gap: 20px;
    grid-template-columns:repeat(5, minmax(0, 167px));
    width: 100%
}

.steps__item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    position: relative
}

.steps__item:before {
    background: url(images/steps/arrow.svg) 50% no-repeat;
    background-size: contain;
    content: "";
    height: 8.1px;
    position: absolute;
    right: -54px;
    top: 16px;
    width: 88px
}

.steps__item:last-child:before {
    background: none
}

.steps__name {
    text-align: center
}

.steps__image {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background: var(--black);
    border-radius: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 64px;
    justify-content: center;
    width: 64px
}

.steps__image img {
    height: 42px;
    width: 42px
}

.steps__btn--mobile {
    display: none
}

@media screen and (max-width: 1200px) {
    .steps__box {
        padding: 24px
    }

    .steps__item:before {
        right: -35px;
        width: 50px
    }
}

@media screen and (max-width: 900px) {
    .steps__box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .steps__info {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .steps__title {
        text-align: center
    }
}

@media screen and (max-width: 700px) {
    .steps__list {
        -ms-grid-columns:(minmax(0, 167px)) [ 3 ];
        grid-template-columns:repeat(3, minmax(0, 167px))
    }

    .steps__item:before {
        right: -20px
    }
}

@media screen and (max-width: 500px) {
    .steps__container {
        padding: 32px 0
    }

    .steps__box {
        border-radius: 16px;
        padding: 16px
    }

    .steps__title {
        max-width: 183px !important
    }

    .steps__list {
        -ms-grid-columns: 100%;
        gap: 8px;
        grid-template-columns:100%;
        padding-left: 12px
    }

    .steps__item {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 8px
    }

    .steps__item:before {
        background: url(images/steps/arrow-mobile.svg) 50% no-repeat;
        background-size: contain;
        height: 38px;
        left: -20px;
        right: auto;
        top: 100%;
        width: 10px
    }

    .steps__name {
        text-align: start
    }

    .steps__image {
        height: 48px;
        min-width: 48px;
        width: 48px
    }

    .steps__image img {
        height: 32px;
        width: 32px
    }

    .steps__btn {
        display: none
    }

    .steps__btn--mobile {
        display: block;
        width: 100%
    }
}

.tabs {
    max-width: 600px
}

.tabs__togglers {
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
    width: 100%
}

.tabs__toggler {
    font-size: 16px;
    line-height: 24px;
    margin-right: 20px;
    padding-bottom: 10px
}

.tabs__toggler.active {
    position: relative
}

.tabs__toggler.active:before {
    background: #333;
    bottom: -1px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 100%
}

.tabs__box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    line-height: 24px;
    width: 100%
}

.type__container {
    padding: 60px 0
}

@media screen and (max-width: 500px) {
    .type__container {
        padding: 32px 0
    }
}

.words__container {
    padding: 24px 0 100px
}

.words__swiper .swiper-slide {
    border-radius: 16px;
    -webkit-box-shadow: inset 0 0 0 1px var(--stroke);
    box-shadow: inset 0 0 0 1px var(--stroke);
    color: var(--gray);
    padding: 12px 16px;
    white-space: nowrap;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    width: fit-content !important
}

@media screen and (max-width: 500px) {
    .words {
        overflow: hidden
    }

    .words__container {
        padding: 18px 0 50px
    }

    .words__swiper {
        overflow: visible
    }
}

.alerts__buttons {
    -ms-grid-columns: -webkit-max-content 15px -webkit-max-content 15px -webkit-max-content;
    -ms-grid-columns: max-content 15px max-content 15px max-content;
    grid-gap: 15px;
    display: -ms-grid;
    display: grid;
    grid-template-columns:repeat(3, -webkit-max-content);
    grid-template-columns:repeat(3, max-content)
}

.alerts__success {
    background: #4ab868
}

.alerts__error {
    background: #f02b2b
}

.alerts__notify {
    background: #fdcb6e
}

@media screen and (max-width: 480px) {
    .alerts__buttons {
        -ms-grid-columns: -webkit-max-content 15px -webkit-max-content;
        -ms-grid-columns: max-content 15px max-content;
        grid-template-columns:-webkit-max-content -webkit-max-content;
        grid-template-columns:max-content max-content
    }
}

.content ol, .content ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 16px
}

.content .ol, .content ol {
    padding-left: 17px
}

.content ol li {
    list-style: decimal
}

.content ul li {
    list-style: none;
    padding-left: 12px;
    position: relative
}

.content ul li:before {
    color: #363636;
    content: "•";
    left: 0;
    position: absolute;
    top: 0
}

.content h2 {
    font-size: 46px;
    font-weight: 700;
    line-height: 54px;
    margin-bottom: 36px
}

.content h3 {
    font-size: 36px;
    line-height: 44px
}

.content h3, .content p {
    margin-bottom: 16px
}

.content strong {
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: 28px
}

.content picture img {
    border-radius: 24px;
    margin-bottom: 24px;
    max-height: 321px;
    max-width: 618px;
    width: 100%
}

@media screen and (max-width: 500px) {
    .content p {
        margin-bottom: 16px
    }

    .content strong {
        margin-bottom: 8px
    }

    .content h2 {
        font-size: 30px;
        line-height: 30px;
        margin-bottom: 24px
    }

    .content h3 {
        font-size: 24px;
        line-height: 30px;
        margin-bottom: 16px
    }
}

.header__burger {
    height: 24px;
    width: 24px
}

.header__burger .b1, .header__burger .b2, .header__burger .b3 {
    background-color: var(--black);
    border-radius: 10px;
    display: block;
    height: 3px;
    margin-bottom: 4px;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    width: 24px
}

.header__burger .b3 {
    margin-bottom: 0 !important
}

.header__burger.active .b1, .header__burger.active b2, .header__burger.active b3 {
    margin-bottom: 0
}

.header__burger.active .b1 {
    -webkit-transform: rotate(-45deg) translate(-6px, 1px);
    -ms-transform: rotate(-45deg) translate(-6px, 1px);
    transform: rotate(-45deg) translate(-6px, 1px)
}

.header__burger.active .b2 {
    opacity: 0
}

.header__burger.active .b3 {
    -webkit-transform: rotate(45deg) translate(-6px, -1px);
    -ms-transform: rotate(45deg) translate(-6px, -1px);
    transform: rotate(45deg) translate(-6px, -1px)
}

.menu-burger {
    background: var(--white);
    height: 100vh;
    left: 100%;
    overflow: auto;
    position: fixed;
    top: 0;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    width: 100%;
    z-index: 5
}

.menu-burger.active {
    left: 0
}

.menu-burger__container {
    padding: 96px 0 16px
}

.menu-burger__box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.menu-burger__menu {
    font-size: 16px;
    font-weight: 700;
    gap: 16px;
    line-height: 24px;
    text-align: center
}

.menu-burger__contacts, .menu-burger__menu {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 32px
}

.menu-burger__contacts {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.menu-burger__phone {
    font-size: 20px;
    line-height: 26px
}

.menu-burger__messengers, .menu-burger__messengers-wrapper {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px
}

.menu-burger__messengers-wrapper {
    color: var(--gray)
}

.menu-burger__btn {
    max-width: 265px;
    width: 100%
}

.modal {
    -webkit-animation: modal-fadeout var(--modal-animation-time) ease-in-out forwards;
    animation: modal-fadeout var(--modal-animation-time) ease-in-out forwards;
    background: rgba(0, 0, 0, .7);
    height: 100vh;
    left: 0;
    overflow-y: auto;
    padding: 80px;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 20
}

.modal.open {
    -webkit-animation: modal-fadein var(--modal-animation-time) ease-in-out forwards;
    animation: modal-fadein var(--modal-animation-time) ease-in-out forwards
}

.modal__content {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    height: auto;
    justify-content: center;
    margin: 0 auto;
    min-height: 100%
}

.modal__box, .modal__content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.modal__box {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    background: #fff;
    border-radius: 16px;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 500px;
    padding: 64px;
    position: relative;
    z-index: 1
}

.modal__box--success {
    padding: 64px 36px
}

.modal__body {
    -webkit-box-orient: horizontal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 25px;
    justify-content: space-between
}

.modal__body, .modal__form {
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.modal__form {
    -webkit-box-orient: vertical;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 48px;
    width: 100%
}

.modal__form-btn {
    width: 100%
}

.modal__form .term {
    margin-top: 0
}

.modal__social {
    background: var(--bg-1);
    border-radius: 16px;
    gap: 16px;
    padding: 16px
}

.modal__messengers, .modal__social {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.modal__messengers {
    gap: 6px
}

.modal__messengers img {
    height: 32px;
    width: 32px
}

.modal__close {
    cursor: pointer;
    margin-bottom: 0;
    max-width: 229px;
    width: 100%
}

.modal__close--fixed {
    background: url(images/icons/close.svg) 50% no-repeat;
    background-size: 20px;
    height: 20px;
    position: absolute;
    right: 20px;
    top: 20px;
    width: 20px;
    z-index: 5
}

.modal__title {
    text-align: center
}

.modal__image, .modal__subtitle, .modal__title {
    margin-bottom: 24px
}

.modal__image {
    max-width: 120px
}

@media screen and (max-width: 700px) {
    .modal {
        padding: 40px
    }

    .modal__box {
        padding: 35px
    }

    .modal__title {
        font-size: 32px;
        line-height: 40px
    }
}

@media screen and (max-width: 500px) {
    .modal {
        padding: 12px
    }

    .modal__content {
        width: 100%
    }

    .modal__box {
        border-radius: 16px;
        max-width: 296px;
        padding: 24px 16px
    }

    .modal__subtitle, .modal__title {
        margin-bottom: 16px
    }

    .modal__subtitle {
        text-align: center
    }

    .modal__form {
        gap: 8px;
        margin-bottom: 24px
    }

    .modal__social {
        gap: 8px;
        padding: 12px 16px;
        white-space: nowrap
    }

    .modal__messengers {
        gap: 6px
    }

    .modal__messengers img {
        height: 24px;
        width: 24px
    }

    .modal__image {
        margin-bottom: 16px;
        max-width: 76px
    }

    .modal__close--fixed {
        background-size: 20px;
        height: 20px;
        right: 16px;
        top: 16px;
        width: 20px
    }
}

@-webkit-keyframes modal-fadeout {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2)
    }
}

@keyframes modal-fadeout {
    0% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    to {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2)
    }
}

@-webkit-keyframes modal-fadein {
    0% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2)
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes modal-fadein {
    0% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2)
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.term {
    -ms-grid-columns: 16px 8px auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    grid-gap: 8px;
    align-items: center;
    display: -ms-grid;
    display: grid;
    grid-template-columns:16px auto;
    margin-top: 12px;
    text-align: start
}

.term p {
    color: var(--gray);
    font-size: 14px;
    line-height: 22px
}

.term p a {
    text-decoration: underline
}

.term p a:hover {
    color: var(--black)
}

@media screen and (max-width: 996px) {
    .term {
        grid-gap: 5px
    }

    .term p {
        font-size: 10px;
        line-height: 18px
    }
}

.title {
    font-size: 46px;
    font-weight: 700;
    line-height: 54px;
    margin-bottom: 36px;
    z-index: 3
}

.title-bg {
    color: var(--white);
    display: inline-block;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    z-index: 2
}

.title-bg:before {
    content: "";
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: -1
}

.title-bg--offer:before {
    background: var(--black);
    border-radius: 24px;
    height: calc(100% + 11px);
    left: -16px;
    width: calc(100% + 48px)
}

.title-bg--benefit {
    margin-left: 8px
}

.title-bg--benefit:before {
    background: #efcd18;
    border-radius: 12px;
    height: 100%;
    left: -8px;
    width: calc(100% + 16px)
}

.title-bg--messengers {
    margin-left: 8px
}

.title-bg--messengers:before {
    background: var(--black);
    border-radius: 12px;
    height: 100%;
    left: -8px;
    width: calc(100% + 16px)
}

.title-main {
    font-size: 36px;
    font-weight: 700;
    line-height: 44px;
    z-index: 2
}

@media screen and (max-width: 600px) {
    .title-bg--offer:before {
        background: var(--black);
        border-radius: 16px;
        height: calc(100% + 4px);
        left: -9px;
        width: calc(100% + 18px)
    }
}

@media screen and (max-width: 500px) {
    .title {
        font-size: 30px;
        line-height: 36px;
        margin: 0 auto 24px;
        max-width: 296px
    }

    .title-bg--benefit {
        display: contents;
        margin-left: 0
    }

    .title-bg--benefit:before {
        display: none
    }

    .title-main {
        font-size: 24px;
        line-height: 30px;
        max-width: 264px
    }
}