@media (min-width: 576px) {

}

@media (min-width: 768px) {

}

@media (min-width: 992px) {
    header {
        padding: 0;
    }
    header .header-top{
        padding: 16px 0;
    }
    header .header-top .left{
        column-gap: 60px;
    }
    header .header-top .phones{
        column-gap: 16px;
    }
    header .header-top .phones a,
    header .header-top .working-time,
    header .header-top .address{
        font-weight: 400;
        font-size: 16px;
        line-height: 100%;
        color: var(--color-grey-12);
    }
    header .header-logo{
        height: 45px;
        width: auto;
    }
    header .header-logo img{
        height: 100%;
        aspect-ratio: 133 / 61;
    }
    header .menu-toggle i:before{
        font-size: 24px;
    }
    header .btn-phone{
        padding: 12px 12px;
        border: 1px solid #FFFFFF;
        backdrop-filter: blur(58.8px);
        background: var(--color-grey-12);
        border-radius: 12px;
        column-gap: 8px;
        font-size: 14px;
        line-height: 14px;
    }
    header .btn-phone i:before{
        font-size: 16px;
    }
    header .buttons-wrapper{
        align-items: center;
        column-gap: 16px;
    }
    header .socials{
        column-gap: 8px;
    }

    .custom-modal .modal-content{
        padding: 50px 89px;
        background: var(--color-grey-9);
        box-shadow: var(--box-shadow);
        backdrop-filter: blur(40px);
    }
    .custom-modal .header .text{
        font-size: 18px;
        line-height: 20px;
    }
    .form-styles .form-control{
        background: #05050580;
    }
    .form-styles .btn{
        padding: 20px 24px;
    }
    .section-breadcrumbs-block{
        padding-top: 150px;
    }
    .breadcrumbs-block ul li a span,
    .breadcrumbs-block ul li > span{
        font-size: 14px;
    }
    .section-breadcrumbs-block .mb-40{
        margin-bottom: 48px;
    }
    .section-breadcrumbs-block .mb-24{
        margin-bottom: 16px;
    }
    .section-breadcrumbs-block.section-mb{
        margin-bottom: 80px;
    }
    .section-breadcrumbs-block .breadcrumbs-text{
        font-weight: 400;
        font-size: 24px;
        line-height: 100%;
        letter-spacing: 10%;
    }
}

@media (min-width: 1200px) {
    header .header-top .left{
        column-gap: 90px;
    }
    .header-menu-wrapper{
        position: unset;
        padding: 0;
        width: auto;
        height: auto;
        z-index: 500;
        background: unset;
    }
    .mobile-menu-inner{
        overflow: visible;
        height: auto;
        padding-top: 0;
    }
    .mobile-menu-wrapper{
        padding: 0;
    }
    .header-menu .toggle{
        display: none;
    }
    .header-menu{
        flex-direction: row;
        row-gap: 0;
        column-gap: 12px;
    }
    header .header-logo{
        margin-right: 0px;
    }
    header .buttons-wrapper{
        margin-left: auto;
    }
    .header-menu li.active:before{
        display: none;
    }
    .header-menu li  a:hover{
        color: var(--color-purple);
    }
    .header-menu li  a{
        color: var(--color-grey-12);
        font-weight: 400;
        font-size: 14px;
    }
    .header-menu li.active > a{
        font-weight: 700;
    }
    .header-menu > li > a{
        padding: 6px 0;
    }
    .header-menu li.parent > ul{
        display: grid;
        grid-template-columns: auto auto;
        position: absolute;
        top: 100%;
        left: -100%;
        transition: var(--base-transition);
        column-gap: 20px;
        row-gap: 2px;
        padding: 10px;
        background: #171717E5;
        box-shadow: 0px 16px 40px -10px #000000CC;
        backdrop-filter: blur(24px);
        border-radius: 16px;
        width: auto;
        opacity: 0;
        visibility: hidden;
        z-index: -5;
    }
    .header-menu li.parent:hover > ul{
        visibility: visible;
        opacity: 1;
        z-index: 9;
    }
    .header-menu li.parent > ul a{
        white-space: nowrap;
        column-gap: 12px;
        color: #E5E5E5;
        font-size: 18px;
        line-height: 20px;
        padding: 12px;
        min-width: 350px;
        border-radius: 12px;
        border: 1px solid transparent;
    }
    .header-menu li.parent > ul a .image{
        width: 40px;
        height: 40px;
    }
    .header-menu li.parent > ul a .image svg{
        width: 20px;
        height: 20px;
    }
    .header-menu li.parent > ul > li > a:hover,
    .header-menu li.parent > ul > li.active a{
        border: var(--border-style-2);
        background: var(--color-grey-5);
    }
    .header-menu li.parent > ul > li > a:hover,
    .header-menu li.parent > ul > li.active > a{
        color: var(--color-purple);
    }
    .header-menu li.parent > ul > li > a:hover .image svg path,
    .header-menu li.parent > ul > li.active a .image svg path{
        stroke: var(--color-purple);
    }
    .header-menu li.parent > ul > li.bottom_link{
        grid-column: 1 / -1;
        background: #26262633;
        margin-left: -10px;
        width: calc(100% + 20px);
        margin-bottom: -10px;
        padding: 12px;
        border-top: var(--border-style-4)
    }
    .header-menu li.parent > ul > li.bottom_link a{
        justify-content: space-between;
        width: 100%;
        color: var(--color-grey-7);
        border: none;
        background: none;
        padding: 10px;
    }
    .header-menu li.parent > ul > li.bottom_link a span{
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        vertical-align: middle;
    }
    .header-menu li.parent > ul > li.bottom_link a i:before{
        font-size: 16px;
        transform: rotate(-90deg);
    }
    .header-menu li.parent > ul > li.bottom_link a:hover{
        color: var(--color-purple);
    }
    .footer-menu-wrapper.no-header{
        margin-top: 36px;
    }
    footer .divider{
        width: 100%;
        height: 1px;
        background: var(--color-grey-1);
        margin-bottom: 42px;
    }
    .form-privacy-text{
        margin-top: 50px;

    }
    .section-map-block .map,
    .section-map-block .map iframe,
    .section-map-block .map .inner{
        height: 550px;
    }
}

@media (min-width: 1400px) {
    footer .footer-text,
    footer .footer-logo{
        margin-bottom: 28px;
    }
    .footer-menu{
        margin-bottom: 0;
        row-gap: 30px;
    }
    .footer-header {
        font-weight: 500;
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 40px;
    }
    footer .row:nth-of-type(2) > .col-12:nth-of-type(2) .footer-menu, footer .row:nth-of-type(2) > .col-12:nth-of-type(5) .footer-menu{
        margin: 0;
    }
    .footer-menu a {
        font-size: 18px;
        line-height: 18px;
    }
    .footer-menu-wrapper.no-header {
        margin-top: 60px;
    }
    .footer-contacts .inner > div span, .footer-contacts .inner > div a{
        font-size: 18px;
        line-height: 18px;
    }
    .footer-contacts .inner{
        row-gap: 30px;
    }
    footer .footer-bottom{
        padding-top: 0;
        border: none;
        margin-top: 74px;
    }
    footer .footer-bottom li a, footer .footer-bottom li{
        font-size: 16px;
        line-height: 28px;
    }
    footer .footer-bottom li.dev {
        column-gap: 8px;
    }
    footer .footer-bottom li.dev img {
        height: 16px;
    }
    blockquote{
        padding-left: 26px;
        font-size: 18px;
        line-height: 27px;
    }
}
@media (min-width: 1500px) {
    header .header-logo{
        margin-right: 34px;
    }
    header .btn-phone{
        padding: 16px 12px;
        border: 1px solid #FFFFFF;
        backdrop-filter: blur(58.8px);
        background: var(--color-grey-12);
        border-radius: 12px;
        column-gap: 16px;
        font-size: 18px;
        line-height: 18px;
    }
    header .btn-phone i:before{
        font-size: 20px;
    }
    header .socials{
        column-gap: 15px;
    }
    header .header-logo {
        height: 61px;
    }
    .header-menu li a {
        font-size: 16px;
    }
    .header-menu li.parent > ul a{
        min-width: 430px;
    }
}

@media screen and (min-width: 1648px) {
    .header-menu li a {
        font-size: 18px;
    }
    .header-menu{
        column-gap: 24px;
    }
}