@media screen and (max-width: 1920px) {
    .container {
        max-width: calc(100% - 300px);
    }
}

/*****************************************/

@media screen and (max-width: 1500px) {
    .container {
        max-width: 100%;
    }
}

/*****************************************/

@media screen and (max-width: 1200px) {

}


/*****************************************/

@media screen and (max-width: 1100px) {
    .wrapper .page-content .bart-inner {
        grid-template-columns: 1fr;
    }
}


/*****************************************/

@media screen and (max-width: 991px) {
    .tableOuter table {
        min-width: 700px;
    }
    .tableOuter {
        overflow-x: scroll;
        padding: 0px 10px;
    }
    .grid-container {
        grid-template-columns: repeat(2, 1fr);
    }
    .popup {
        width: 90%;
    }
    .wrapper-systems .photo-gallery {
        width: 100%;
    }
    .top-block {
        padding: 100px 0 50px 0;
    }
}



/***************** END 991 ************************/


@media (max-width: 1024px){
    .site-header {
        padding: 10px 0;
    }

    /* показываем бургер */
    .burger{
        width:44px;
        height:44px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        flex-direction:column;
        gap:7px;
        cursor:pointer;
        border-radius:10px;
        user-select:none;
        z-index:1002; /* выше панели */
    }
    .burger span{
        width:28px;
        height:2px;
        background:#fff;
        display:block;
        transition: transform .25s ease, opacity .2s ease;
    }
    .burger.is-active span:nth-child(1){ transform: translateY(9px) rotate(45deg); }
    .burger.is-active span:nth-child(2){ opacity:0; }
    .burger.is-active span:nth-child(3){ transform: translateY(-9px) rotate(-45deg); }

    /* панель меню:
       - выезжает сверху
       - сверху 50px оставляем видимым хедер (логотип/крестик)
       - во всю ширину
    */
    .header-menu{
        position:fixed;
        top:63px;
        left:0;
        right:0;
        width:100%;
        height:calc(100vh - 50px);
        background: rgba(0,0,0,.96);
        transform: translateY(-110%);
        transition: transform .25s ease;
        z-index:1000;
        overflow-y:auto;

        /* чтобы скролл был приятнее */
        -webkit-overflow-scrolling: touch;

        /* убираем "десктопные" flex-стили */
        display:block;
    }
    .site-header.is-menu-open .header-menu{
        transform: translateY(0);
    }

    /* nav на всю ширину */
    .primary-menu{
        width:100%;
    }

    /* список пунктов */
    .primary-menu ul.head-menu{
        width:100%;
        margin:0;
        padding:0;
        list-style:none;

        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:0;
    }

    .primary-menu ul.head-menu > li{
        width:100%;
        margin:0;
        padding:0;
        border-bottom: 1px solid rgba(255,255,255,.12);
    }

    /* строка пункта: текст слева, стрелка справа */
    .primary-menu .head-menu .link-menu{
        width:100%;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        padding: 8px 16px;           /* внутренние отступы по бокам */
        box-sizing:border-box;
    }

    /* ссылки — белые, слева */
    .primary-menu ul.head-menu > li > a,
    .primary-menu ul.head-menu > li .link-menu > a{
        flex:1 1 auto;
        min-width:0;
        display:block;
        text-align:left;
        color:#fff;
        text-decoration:none;
        font-size:18px;
        font-weight:500;
        line-height:1.2;

        /* вертикальные отступы клика */
        padding: 10px 0;
    }

    /* стрелка как кнопка (>=30x30), справа */
    .primary-menu .head-menu .arrow{
        flex:0 0 34px;
        width:34px;
        height:34px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border: 1px solid rgb(67 67 67 / 90%);
        border-radius:3px;
        color:#fff;
        cursor:pointer;
        user-select:none;
    }
    .primary-menu .head-menu .arrow svg{
        width:14px;
        height:14px;
        display:block;
        transition: transform .25s ease;
        transform-origin: 50% 50%;
    }

    /* подменю: внутри потока, скрыто по умолчанию (открывает JS) */
    .primary-menu .head-menu .sub-wrapper{
        width:100%;
        display:none;  /* важно, иначе всегда видно */
        padding:0;
        margin:0;
        background: transparent;
        border: none;
        border-radius: 0;
        position: static;
    }

    /* список подменю: сдвиг 15px + общий отступ 16px */
    .primary-menu .head-menu .sub-wrapper > ul.sub-menu{
        width:100%;
        margin:0;
        list-style:none;
        padding: 6px 16px 12px calc(16px + 15px); /* 16 базовый + 15 ваш */
        box-sizing:border-box;
    }

    .primary-menu .head-menu .sub-wrapper > ul.sub-menu > li{
        margin:0;
        padding:0;
    }

    .primary-menu .head-menu .sub-wrapper > ul.sub-menu > li > a{
        display:block;
        width:100%;
        color:#fff;
        text-decoration:none;
        font-size:16px;
        line-height:1.2;
        opacity:.95;
        padding:10px 0;
        border-radius:10px;
    }

    .primary-menu .head-menu .sub-wrapper > ul.sub-menu > li > a:hover{
        background: rgba(255,255,255,.08);
    }

    /* Активный раскрытый пункт: серее + стрелка повернулась */
    .primary-menu .head-menu > li.is-sub-open > .link-menu{
        background: rgba(255,255,255,.06);
    }
    .primary-menu .head-menu > li.is-sub-open > .link-menu .arrow svg{
        transform: rotate(180deg);
    }

    /* если вдруг в меню есть пункты БЕЗ подменю, но без .link-menu (редко) */
    .primary-menu ul.head-menu > li:not(.menu-item-has-children) > a{
        padding: 14px 16px;
    }

    /* блокируем фон страницы при открытом меню (включает ваш JS) */
    body.is-locked{
        overflow:hidden;
    }

    /* 1) На мобилке hover НЕ должен крутить стрелку */
    .primary-menu .head-menu > li.menu-item-has-children:hover .arrow svg{
        transform: none !important;
    }

    /* 2) И hover НЕ должен "визуально" показывать dropdown (если остались desktop-стили opacity/visibility) */
    .primary-menu .head-menu > li.menu-item-has-children:hover .sub-wrapper{
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    /* 3) Поворот стрелки — только от класса is-sub-open */
    .primary-menu .head-menu > li.is-sub-open > .link-menu .arrow svg{
        transform: rotate(180deg) !important;
    }
    /*******************************/

    .wrapper .page-content .pc-inner {
        padding: 65px 0 80px 0;
    }
    .wrapper.wrapper-blog-cat {
        padding: 65px 0 80px 0;
    }
    .wrapper.wrapper-contacts {
        padding: 65px 0 80px 0;
    }
    .wrapper.wrapper-inspiration {
        padding: 65px 0 80px 0;
    }
    .wrapper.wrapper-blog-article {
        padding: 65px 0 80px 0;
    }
}



/***************** END 950 ************************/

@media screen and (max-width: 768px) {
    .swiper-backface-hidden .swiper-slide {
        width: 100% !important;
    }
    .photo-gallery__thumbs {
        grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
    }
}

/***************** END 768 ************************/


@media screen and (max-width: 760px) {

}


@media screen and (max-width: 700px) {

}


/*********************************************/

@media screen and (max-width: 600px) {

}

/**************** END 650 *************************/

@media screen and (max-width: 500px) {
    .aligncenter,.alignleft,.alignright {
        width: 100%;
    }
}

@media screen and (max-width: 450px) {

}



@media screen and (max-width: 370px) {

}


@media screen and (max-width: 350px) {

}