@font-face {
    font-family: "Roboto";
    src: url('fonts/Roboto-Regular.woff2') format('woff2'),
    url('fonts/Roboto-Regular.woff') format('woff');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url('fonts/Roboto-Italic.woff2') format('woff2'),
    url('fonts/Roboto-Italic.woff') format('woff');
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url('fonts/Roboto-Medium.woff2') format('woff2'),
    url('fonts/Roboto-Medium.woff') format('woff');
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url('fonts/Roboto-semibold.woff2') format('woff2'),
    url('fonts/Roboto-semibold.woff') format('woff');
    font-style: normal;
    font-weight: 600;
    font-display: swap;
}

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

/* ------------------------------------------------------------------------ */

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

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

:focus,
:active {
    outline: none;
}

a:focus,
a:active {
    outline: none;
}

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

html,
body {
    height: 100%;
    width: 100%;
    font-size: 100%;
    line-height: 1;
    font-size: 14px;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

input,
button,
textarea {
    font-family: inherit;
}

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

button {
    cursor: pointer;
    background-color: transparent;
}

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

a {
    color: inherit;
}

a,
a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

ul li {
    list-style: none;
}

.list-with-dots li {
    position: relative;
    padding-left: 26px;
    font-size: 16px;
}

.list-with-dots li::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #56b8ff;
}

img {
    vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: 400;
}

::-webkit-scrollbar {
    width: 9px;
    height: 8px;
    background-color: #f0f0f0;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #56b8ff;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #0e1a42;
}

/* ---------------------------------------------------------------------------- */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 40px;
}

body {
    font-family: "Roboto", sans-serif;
    line-height: normal;
    background: #fff;
}

.wrapper {
    overflow: hidden;
}

.container {
    max-width: 1800px;
    margin: 0 auto;
    padding: 0 40px;
}

section {
    margin: 0px 0px 100px 0px;
}

.title {
    font-weight: 600;
    font-size: 64px;
    color: #0e1a43;
    margin: 0px 0px 60px 0px;
}

input {
    border: 2px solid #fff;
}

textarea {
    border: 2px solid #fff;
}

input:focus {
    border: 2px solid #56b8ff;
}

textarea:focus {
    border: 2px solid #56b8ff;
}

/* -------------------------header------------------------- */

.header {
    background: #0e1a43;
    padding: 0px 0px 3px 0px;
}

.header__container {
}

.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.header__left {
    display: flex;
    align-items: center;
    gap: 68px;
}

.header__logo {
}

.header__logo-img {
}

.header__list {
    display: flex;
    align-items: center;
    gap: 48px;
}

.header__item {
}

.header__item-link {
    font-weight: 600;
    font-size: 16px;
    color: #fff;
}

.header__right {
    display: flex;
    align-items: center;
    gap: 48px;
}

.header__contacts {
    display: flex;
    align-items: center;
    gap: 48px;
}

.header__contacts-item {
}

.header__contacts-item-link {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header__contacts-item-name {
    font-weight: 500;
    font-size: 16px;
    color: #fff;
}

.lang {
    padding: 10px 16px;
    position: relative;
    cursor: pointer;
}

.lang__content {
    position: absolute;
    top: 110%;
    left: 0;
    z-index: 2;
    width: 100%;

    background-color: #fff;
    border-radius: 12px;

    transform: translateY(-20px);
    opacity: 0;
    pointer-events: none;
    transition: all .3s ease;
}

.lang--active .lang__content {
    transform: translateY(0px);
    opacity: 1;
    pointer-events: all;
}

.lang__list {
    width: 100%;
}

.lang__item {
    width: 100%;
    text-align: center;
    padding: 10px 16px;
    font-size: 16px;
    cursor: pointer;
}

.lang__head {
    display: flex;
    align-items: center;
    gap: 4px;
}

.lang__name {
    font-weight: 500;
    font-size: 16px;
    color: #fff;
}

.header__link {
    font-weight: 500;
    font-size: 16px;
    color: #202020;

    display: inline-block;
    padding: 14.5px 16px;
    background: #fff;
    border-radius: 40px;

    transition: all .2s ease;
}

.header__link:hover {
    background: #0094ff;
    color: #fff;
}

.burger-btn {
    display: none;
}

/* -------------------------preview------------------------- */

.page__preview {
    padding: 100px 0;
    position: relative;
    z-index: 1;
}

.page__gallery {
    padding: 24px 0 60px 0;
    margin: 0px 0px 400px 0px;
}

.preview__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
}

.preview__container {
}

.preview__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 70px;
}

.preview__title {
    font-weight: 600;
    font-size: 74px;
    text-align: center;
    color: #fff;
}

.preview__cards {
    max-width: 1460px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.preview__card {
    max-width: 320px;
    width: 100%;

    background: rgba(255, 255, 255, 0.85);
    border-radius: 20px;
    padding: 20px 10px 45px 10px;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 13px;
}

.preview__card-img {
}

.preview__card-image {
}

.preview__card-text {
    font-weight: 500;
    font-size: 18px;
    text-align: center;
    color: #0e1a43;
}

.preview__btns {
    display: flex;
    justify-content: center;
    gap: 35px;
    width: 100%;
}

.preview__btn {
    text-align: center;
    border-radius: 50px;
    max-width: 342px;
    width: 100%;
}

.preview__btn-consul {
    font-weight: 500;
    font-size: 20px;
    color: #fff;

    padding: 24px;
    background: #56b8ff;

    transition: all .2s ease;
}

.preview__btn-consul:hover {
    background: #0094ff;
}

.preview__btn-conditions {
    padding: 23px;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid #fff;

    font-weight: 500;
    font-size: 20px;
    color: #fff;

    transition: all .2s ease;
}

.preview__btn-conditions:hover {
    background: #fff;
    color: #202020;
}

/* -------------------------desc------------------------- */

.page__desc {
}

.desc__container {
}

.desc__inner {
    display: flex;
    align-items: start;
    gap: 40px;
    justify-content: space-between;

    padding: 0px 0px 100px 0px;
    border-bottom: 2px solid #56b8ff;
}

.desc__content {
    max-width: 802px;
    width: 100%;

    display: flex;
    flex-direction: column;
    gap: 60px;
}

.desc__list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.desc__text {
    font-weight: 400;
    font-size: 18px;
    color: #202020;
}

.desc__btn {
    padding: 22px;
    max-width: 385px;
    width: 100%;

    border: 2px solid #0e1a43;
    border-radius: 76px;

    font-weight: 500;
    font-size: 20px;
    color: #0e1a43;

    transition: all .2s ease;
}

.desc__btn:hover {
    background: #0e1a43;
    color: #fff;
}

.desc__img {
    border-radius: 20px;
    overflow: hidden;
    max-width: 682px;
}

.desc__image {
    max-width: 100%;
}

/* -------------------------page__result------------------------- */
.result__content {
    display: flex;
    align-items: start;
    gap: 40px;
    justify-content: space-between;
}

.result__img {
    max-width: 682px;
    width: 100%;
}

.result__image {
    max-width: 100%;
}

.result__desc {
    max-width: 890px;
    width: 100%;
    padding: 0px 88px 0px 0px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.result__desc p {
    font-weight: 400;
    font-size: 18px;
    color: #202020;
}

.result__desc a:link {
    color: #56b8ff;
    text-decoration: underline;
}

.result__desc a:hover {
    opacity: .8;
}

.result__desc a:visited {
    color: #737373;
}

.result__desc h2 {
    font-size: 18px;
    font-weight: bold;
}

/* -------------------------free-consult------------------------- */

.page__free-consult {
    background: #0e1a43;
    padding: 113px 0 85px 0;
}

.free-consult__container {
}

.free-consult__inner {
}

.free-consult__form {
    max-width: 1277px;
    width: 100%;
    margin: 0 auto;

    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.free-consult__label {
    display: block;
    width: 100%;
    max-width: 385px;
}

.free-consult__input {
    width: 100%;
    padding: 24px;
    border-radius: 20px;
    background: #fff;

    font-weight: 400;
    font-size: 16px;
    color: #000;
}

.free-consult__input::placeholder {
    color: #b4b4b4;
}

.free-consult__form-right {
    max-width: 387px;
    width: 100%;
}

.free-consult__btn {
    padding: 24px;
    background: #56b8ff;
    border-radius: 50px;
    margin: 0px 0px 12px 0px;
    width: 100%;

    font-weight: 500;
    font-size: 20px;
    color: #fff;
    text-align: center;

    transition: all .2s ease;
}

.free-consult__btn:hover {
    background: #0094ff;
}

.free-consult__link {
    font-weight: 400;
    font-size: 14px;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-align: center;
    color: #fff;
    opacity: .7;

    display: block;
}

/* -------------------------about-us------------------------- */

.page__about-us {
}

.about-us__container {
}

.about-us__inner {
    padding: 0px 0px 100px 0px;
    border-bottom: 2px solid #56b8ff;
}

.about-us__title {
    text-align: center;
}

.about-us__cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px 60px;
}

.about-us__card {
    background: #f9f9f9;
    border-radius: 20px;
    padding: 40px 20px;
    text-align: center;
}

.about-us__card-img {
    margin: 0px 0px 12px 0px;
}

.about-us__card-image {
}

.about-us__card-list {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 12px;
}

.about-us__card-name {
    font-weight: 500;
    font-size: 24px;
    text-align: center;
    color: #0e1a43;
}

.about-us__card-desc {
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    color: #737373;
}

/* -------------------------page__stages-work------------------------- */

.page__stages-work {
}

.stages-work__container {
}

.stages-work__inner {
}

.stages-work__title {
    text-align: center;
}

.stages-work__cards {
    display: flex;
    flex-direction: column;

    max-width: 888px;
    margin: 0 auto;
    position: relative;
}

.stages-work__cards::after {
    content: '';

    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 82%;
    z-index: -1;

    background-color: #56b8ff;
}

.stages-work__card {
    display: flex;
    align-items: start;
    gap: 40px;

    max-width: 466px;
    width: 100%;
}

.stages-work__card-1 {
    margin: 0px auto 44px 0px;
    text-align: right;
}

.stages-work__card-2 {
    text-align: left;
    margin: 0px 0px 44px auto;
}

.stages-work__card-3 {
    text-align: right;
    margin: 0px auto 44px 0px;
}

.stages-work__card-4 {
    text-align: left;
    margin: 0 0 0 auto;
}

.stages-work__card-5 {
    text-align: right;
    margin: 0px auto 30px 0px;
}


.stages-work__card-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.stages-work__card-name {
    font-weight: 500;
    font-size: 32px;
    color: #0e1a43;
}

.stages-work__card-desc {
    font-weight: 400;
    font-size: 18px;
    color: #737373;
}

.stages-work__card-num {
    font-weight: 500;
    font-size: 32px;
    color: #fff;

    min-width: 46px;
    min-height: 46px;
    border-radius: 10px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #0e1a43;
}

/* ------------------------- ------------------------- */

.page__delivery-terms {
    padding: 60px 0 80px 0;
    background: #0e1a43;
}

.delivery-terms__container {
}

.delivery-terms__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.delivery-terms__title {
    text-align: center;
    color: #fff;
    margin: 0;
}

.delivery-terms__subtitle {
    max-width: 1094px;
    font-weight: 400;
    font-size: 18px;
    text-align: center;
    color: #fff;
    opacity: 0.7;
}

.delivery-terms__table {
    max-width: 830px;
    width: 100%;
}

.delivery-terms__table-row-head {
    background: #56b8ff;
    border-radius: 20px;
    display: flex;
}

.delivery-terms__table-row-head-name {
    width: 100%;
    padding: 16px;

    font-weight: 500;
    font-size: 18px;
    text-align: center;
    color: #fff;
}

.delivery-terms__table-row {
    border-bottom: 2px solid rgb(255, 255, 255, .7);
    display: flex;
}

.delivery-terms__table-row-value {
    padding: 16px;
    width: 100%;

    font-weight: 400;
    font-size: 18px;
    text-align: center;
    color: #fff;
}

.delivery-terms__table-desc {
    font-style: italic;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    color: #fff;
    opacity: 0.5;

    margin: 20px 0px 0px 0px;
}

/* -------------------------page__order------------------------- */

.page__order {
}

.order__container {
}

.page__order-contact .order__container {
    max-width: 1446px;
}

.order__inner {
    position: relative;
    z-index: 1;
    border-radius: 20px;
    overflow: hidden;

    padding: 60px 30px 56px 30px;
}

.page__order-contact .order__inner {
    background: #f9f9f9;
    border-radius: 20px;
    overflow: hidden;
}

.order__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
}

.order__title {
    margin: 0px 0px 20px 0px;

    text-align: center;
    color: #fff;
}

.page__order-contact .order__title {
    color: #0e1a43;
}

.order__subtitle {
    font-weight: 500;
    font-size: 32px;
    text-align: center;
    color: #fff;

    margin: 0px 0px 40px 0px;
}

.page__order-contact .order__subtitle {
    color: #676767;
}

.order__form {
    max-width: 1245px;
    margin: 0 auto;

    display: flex;
    align-items: start;
    gap: 30px;
    justify-content: space-between;
}

.order__form-left {
    max-width: 445px;
    width: 100%;

    display: flex;
    flex-direction: column;
    gap: 20px;
}

.order__form-label {
    display: block;
    width: 100%;
}

.order__form-input {
    padding: 24px;
    border-radius: 20px;
    background: #fff;
    width: 100%;

    font-weight: 400;
    font-size: 16px;
    color: #000;
}

.order__form-input::placeholder {
    color: #b4b4b4;
}

.order__form-right {
    max-width: 742px;
    width: 100%;
    text-align: center;
}

.order__form-textarea {
    margin: 0px 0px 15px 0px;
    height: 162px;
    resize: none;
}

.order__form-btn {
    padding: 24px;
    display: block;
    width: 100%;
    margin: 0px 0px 8px 0px;

    background: #56b8ff;
    border-radius: 50px;

    font-weight: 500;
    font-size: 20px;
    color: #fff;

    transition: all .2s ease;
}

.order__form-btn:hover {
    background: #0094ff;
}

.order__form-link {
    font-weight: 400;
    font-size: 14px;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-align: center;
    color: #fff;
    opacity: 0.7;
}

.page__order-contact .order__form-link {
    color: #676767;
}

/* -------------------------footer------------------------- */

.footer {
    padding: 40px 0 60px 0;
    background: #1e1e1e;
}

.footer__container {
}

.footer__inner {
}

.footer__top {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;

    margin: 0px 0px 46px 0px;
}

.footer__logo {
}

.footer__logo-img {
}

.footer__box {
}

.footer__box-text {
    font-weight: 400;
    font-size: 16px;
    color: #fff;
}

.footer__contacts {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.footer__contacts-item {
}

.footer__contacts-item-link {
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer__contacts-item-link-text {
    font-weight: 500;
    font-size: 16px;
    color: #fff;
}

.footer__btn {
    padding: 14px;
    font-weight: 500;
    font-size: 16px;
    color: #fff;

    max-width: 237px;
    width: 100%;

    border: 1px solid #fff;
    border-radius: 97px;

    transition: all .2s ease;
}

.footer__btn:hover {
    background: #fff;
    color: #202020;
}

.footer__bottom {
}

.footer__list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.footer__item {
}

.footer__item-link {
    font-weight: 400;
    font-size: 16px;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-align: right;
    color: #fff;
    opacity: .3;
}

/* -------------------------page__contacts------------------------- */

.page__contacts {
    position: relative;
    z-index: 1;
    padding: 24px 0 80px 0;
}

.contacts__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
}

.contacts__container {
}

.contacts__inner {
}

.pagination {
    width: 100%;
}

.pagination__list {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pagination__item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pagination__item:not(:last-child)::after {
    content: '/';

    font-weight: 400;
    font-size: 13px;
    color: #fff;
}

.pagination__item-text {
    font-weight: 700;
    font-size: 13px;
    color: #fff;
}

.pagination__item-link {
    font-weight: 400;
    font-size: 13px;
    color: #fff;
    opacity: .7;
}

.contacts__title {
    font-weight: 600;
    font-size: 74px;
    text-align: center;
    color: #fff;

    margin: 0px 0px 34px 0px;
}

.contacts__subtitle {
    font-weight: 600;
    font-size: 20px;
    color: #fff;
    text-align: center;

    margin: 0px 0px 40px 0px;
}

.contacts__cards {
    max-width: 1367px;
    margin: 0 auto;

    display: flex;
    justify-content: space-between;
    gap: 30px;
}

.contacts__card {
    background: rgba(255, 255, 255, 0.85);
    border-radius: 20px;
    padding: 20px 20px 40px 20px;
    text-align: center;
    max-width: 385px;
    width: 100%;
}

.contacts__card-img {
    margin: 0px 0px 12px 0px;
}

.contacts__card-image {
}

.contacts__card-name {
    margin: 0px 0px 12px 0px;

    font-weight: 500;
    font-size: 24px;
    text-align: center;
    color: #0e1a43;
}

.contacts__card-desc {
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    color: #202020;
}

/* -------------------------------------------------- */

.btn-link {
    position: fixed;
    bottom: 40px;
    right: 100px;
    z-index: 8;
}

/* -------------------------burger------------------------- */

.burger-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 10;

    transition: all .3s ease;
    transform: translateX(100%);
}

.burger-menu--visible {
    backdrop-filter: blur(4px);
    background: rgba(0, 0, 0, 0.5);
    transform: translateX(0%);
}

.burger-menu__window {
    width: 80%;
    min-width: 292px;
    margin: 0px 0px 0px auto;
    padding: 0 32px 32px 32px;
    background: #0e1a43;
    height: 100%;
    overflow: auto;
    position: relative;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 48px;
}

.burger-menu__close {
    position: absolute;
    top: 17px;
    right: 20px;
}

.burger-menu__logo {
}

.burger-menu__text {
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #fff;
}

/* -------------------------modal order------------------------- */

.modal-order {
    display: flex;
    align-items: center;
    justify-content: center;

    max-width: 1070px;
    width: 100%;

    display: none;
}

.modal-order .order__inner {
    padding: 60px;
}

.modal-order .order__form-right {
    max-width: 445px;
}

.modal-order__window {
    max-width: 1070px;
    max-height: 583px;
    height: 100%;
    width: 100%;
    overflow: auto;
    position: relative;
}

.fancybox__content > .f-button.is-close-btn {
    position: absolute;
    top: 30px;
    right: 30px;
    width: 20px;
    height: 20px;
    z-index: 2;
}


.fancybox__slide {
    padding: 0 !important;
    justify-content: center;
}

.modal-delivery-terms {
    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 20px;
    overflow: hidden;
}

.fancybox__backdrop {
    backdrop-filter: blur(9.300000190734863px);
}

.fancybox__content {
    padding: 0;
    background-color: transparent;
}

.fancybox__container {
    --fancybox-bg: rgba(14, 26, 67, 0.5);
}

.modal-delivery-terms__window {
    max-width: 1144px;
    width: 100%;
    height: 100%;
    overflow: auto;
    position: relative;
    background: #0e1a43;
    border-radius: 20px;
    padding: 60px 60px 80px 60px;
}

.fancybox__slide::before,
.fancybox__slide::after {
    display: none;
}

/* -------------------------page__text-page-desc------------------------- */

.text-page-desc__container {
}

.text-page-desc__inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.text-page-desc__title {
    font-weight: 600;
    font-size: 48px;
}

.text-page-desc__inner p {
    font-weight: 400;
    font-size: 16px;
}

.text-page-desc__inner h2 {
    font-size: 18px;
    font-weight: bold;
}

/* -------------------------media------------------------- */

@media (max-width: 1200px) {

    .header .header__list,
    .header .header__contacts,
    .header .header__link {
        display: none;
    }

    .burger-btn {
        display: block;
    }

    .header__right {
        gap: 16px;
    }

    .header__list,
    .header__contacts {
        flex-direction: column;
    }

    .header__link {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 1000px) {
    .preview__cards {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .preview__card {
        max-width: unset;
    }

    .preview__title {
        font-size: 32px;
    }

    .page__preview {
        padding: 16px 0 40px 0;
    }

    .preview__inner {
        gap: 24px;
    }

    .preview__btns {
        gap: 20px;
    }


    .free-consult__form {
        flex-direction: column;
        gap: 24px;
    }

    .free-consult__btn {
        margin: 0px 0px 24px 0px;
        padding: 18px;
        max-width: unset;
        font-size: 16px;
    }

    .free-consult__form-right {
        max-width: unset;
    }

    .free-consult__label {
        max-width: unset;
    }

    .page__free-consult {
        padding: 40px 0;
    }

    .free-consult__input {
        padding: 18px;
    }


    .stages-work__card {
        margin: 0;
        max-width: unset;
        text-align: left;
        gap: 16px;
    }

    .stages-work__cards {
        gap: 24px;
        max-width: unset;
    }

    .stages-work__card-1,
    .stages-work__card-3,
    .stages-work__card-5 {
        flex-direction: row-reverse;
    }

    .stages-work__cards::after {
        left: 22px;
        transform: translate(0);
    }
}

@media (max-width: 920px) {
    .contacts__cards {
        flex-direction: column;
        gap: 20px;
    }

    .contacts__card {
        max-width: unset;
        padding: 24px 17px;
    }

    .contacts__title {
        font-size: 32px;
        margin: 0px 0px 16px 0px;
    }

    .contacts__subtitle {
        font-size: 16px;
        margin: 0px 0px 24px 0px;
    }
}

@media (max-width: 768px) {
    .header__logo-img {
        max-width: 47px;
    }

    .header {
        padding: 0;
    }

    .container {
        padding: 0 20px;
    }

    .title {
        font-size: 28px;
        margin: 0px 0px 24px 0px;
        text-align: start;
    }


    .fancybox__content > .f-button.is-close-btn {
        top: 64px !important;
        right: 30px !important;
        background-color: transparent;
    }

    .fancybox__slide {
        justify-content: end;
    }

    .modal-delivery-terms__window {
        border-radius: 0;
    }

    .modal-delivery-terms {
        border-radius: 0;
    }


    .preview__card-text {
        font-size: 14px;
    }

    .preview__card {
        padding: 16px 16px 12px 16px;
        gap: 8px;
    }

    .preview__btns {
        flex-direction: column;
        gap: 20px;
    }

    .preview__btn {
        max-width: unset;
    }

    .preview__btn {
        font-size: 16px;
    }

    .preview__btn-consul {
        padding: 18px;
    }

    .preview__btn-conditions {
        padding: 17px;
    }

    .preview__card-image {
        max-width: 48px;
    }


    section {
        margin: 0px 0px 40px 0px;
    }

    .desc__inner {
        flex-direction: column-reverse;
        gap: 24px;
        padding: 0px 0px 40px 0px;
    }

    .desc__content {
        gap: 24px;
    }

    .desc__btn {
        font-size: 16px;
        max-width: unset;
        border: 1px solid #0e1a43;
        padding: 17px;
    }


    .result__content {
        flex-direction: column;
        gap: 24px;
    }

    .result__desc {
        padding: 0;
    }


    .about-us__title {
        text-align: start;
    }

    .about-us__cards {
        gap: 24px;
    }

    .about-us__card {
        padding: 24px;
    }

    .about-us__card-name {
        font-size: 18px;
    }

    .about-us__inner {
        padding: 0px 0px 40px 0px;
    }


    .stages-work__card-name {
        font-size: 18px;
    }


    .delivery-terms__title {
        margin: 0px 0px 0px 0px;
        text-align: center;
    }

    .delivery-terms__inner {
        gap: 24px;
    }

    .delivery-terms__table-row-head-name {
        font-size: 14px;
        padding: 19px 10px;
    }

    .delivery-terms__table-row-value {
        font-size: 14px;
    }

    .page__delivery-terms {
        padding: 40px 0;
    }


    .order__form {
        flex-direction: column;
        gap: 24px;
    }

    .order__container {
        padding: 0;
    }

    .order__inner {
        padding: 40px 20px;
    }

    .order__subtitle {
        text-align: start;
        font-size: 16px;
        margin: 0px 0px 40px 0px;
    }

    .order__title {
        margin: 0px 0px 16px 0px;
    }

    .order__form-left {
        max-width: unset;
    }

    .order__form-input {
        padding: 18px;
    }

    .order__form-btn {
        font-size: 16px;
        padding: 18px;
    }

    .order__form-textarea {
        height: 100px;
    }


    .footer__top {
        flex-direction: column;
        gap: 40px;
    }

    .footer__logo {
        display: none;
    }

    .footer__contacts {
        order: 1;
    }

    .footer__box:nth-child(3) {
        order: 2;
    }

    .footer__box:nth-child(2) {
        order: 4;
    }

    .footer__btn {
        order: 3;
        max-width: unset;
    }

    .footer__box:nth-child(3) .footer__box-text {
        display: inline;
    }

    .footer__box:nth-child(2) .footer__box-text {
        opacity: .3;
    }

    .footer__box-text,
    .footer__contacts-item-link-text {
        font-size: 14px;
    }

    .footer__list {
        display: flex;
        flex-direction: column;
        gap: 24px;
        align-items: start;
    }


    .contacts__card-name {
        font-size: 16px;
        margin: 0px 0px 12px 0px;
    }

    .contacts__card-desc {
        font-size: 14px;
    }

    .pagination {
        margin: 0px 0px 20px 0px;
    }

    .page__gallery .pagination {
        margin: 0;
    }

    .page__contacts {
        padding: 20px 0 40px 0;
    }


    .btn-link {
        position: fixed;
        bottom: 20px;
        right: 20px;
    }


    .modal-order {
        padding: 60px 0px 0px 0px;
        align-items: end;
    }

    .modal-order.fancybox__content > .f-button.is-close-btn {
        top: 82px !important;
    }

    .modal-order__window {
        background: #0e1a43;
        max-height: 621px;
    }

    .modal-order .order__bg {
        display: none;
    }

    .modal-order .order__inner {
        padding: 40px 20px;
    }

    .modal-order .order__form-right {
        max-width: unset;
    }

    .modal-order .order__subtitle {
        margin: 0px 0px 24px 0px;
    }

    .modal-order .order__form-btn {
        margin: 0px 0px 24px 0px;
    }

    .modal-delivery-terms {
        padding: 40px 0 0 0;
        justify-content: end;
    }

    .modal-delivery-terms__window {
        padding: 40px 20px;
    }

    .text-page-desc__title {
        font-size: 32px;
    }

    .text-page-desc__inner p {
        font-size: 16px;
    }
}

@media (max-width: 500px) {

    .desc__text,
    .result__desc p,
    .result__desc ul li,
    .about-us__card-desc,
    .stages-work__card-desc,
    .delivery-terms__subtitle,
    .delivery-terms__table-desc {
        font-size: 13px;
    }

    .list-with-dots li::before {
        content: "";
        position: absolute;
        top: 4px;
        left: 10px;
        width: 8px;
        height: 8px;
    }

    .about-us__cards {
        display: flex;
        flex-direction: column;
    }

    .result__desc h2,
    .text-page-desc__inner h2{
        font-size: 15px;
    }

    .text-page-desc__title {
        font-size: 24px;
    }

}

@media (max-width: 400px) {
    .preview__card {
        padding: 16px 0 12px 0;
    }
}

@media (max-width: 360px) {
    .preview__card {
        padding: 12px;
    }

    .preview__cards {
        grid-template-columns: repeat(1, 1fr);
    }
}


#loader {
    display: none;
}

.loader {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: block;
    margin: 15px auto;
    position: relative;
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulse 2s linear infinite;
}

@keyframes shadowPulse {
    33% {
        background: #57b9ff;
        box-shadow: -24px 0 #0e1a42, 24px 0 #57b9ff;
    }
    66% {
        background: #0e1a42;
        box-shadow: -24px 0 #57b9ff, 24px 0 #57b9ff;
    }
    100% {
        background: #57b9ff;
        box-shadow: -24px 0 #57b9ff, 24px 0 #0e1a42;
    }
}

.loader-container {
    z-index: 10000 !important;
    position: fixed;
    width: 100%;
    min-width: 100%;
    height: 100%;
    min-height: 100%;
    top: 0;
    left: 0;
}

.loader-container div.loader {
    position: relative;
    top: 50%;
    margin: -28px auto 0;

}

.gallery {
    max-width: 1800px;
    margin-top: 10px;
}

.gallery:after {
    content: '';
    display: block;
    clear: both;
}

.gallery-image {
    float: left;
    margin-bottom: 10px;
    -webkit-filter: brightness(60%);
    filter: brightness(60%);
}

.gallery-image:hover {
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
}