/* ==========================================================================
   МОБИЛЬНАЯ ШАПКА ГЛАВНОЙ — как в макете (только .main_header, до 768px)
   [телефон] [лого] [бургер] + выезжающая шторка меню.
   Подключается в footer.php после main.min.css.
   ========================================================================== */
header.main_header .mh-phone,
header.main_header .mh-logo-link,
header.main_header .mh-drawer-overlay,
header.main_header .mh-drawer-head {
    display: none;
}

body.mh-no-scroll {
    overflow: hidden;
}

@keyframes mh-phone-ring {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); border-color: rgba(255, 255, 255, 0.35); }
    50%      { box-shadow: 0 0 14px 2px rgba(255, 255, 255, 0.35); border-color: rgba(255, 255, 255, 0.85); }
}

@keyframes mh-burger-glow {
    0%, 100% { opacity: 0.85; filter: drop-shadow(0 0 0 transparent); }
    50%      { opacity: 1; filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.65)); }
}

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

    /* ---------- шапка: компактная тёмная полоса ---------- */
    header.main_header {
        position: relative;
        height: auto !important;
        padding: 62px 0 0 !important;
        background: #040a14 !important;
        background-image: none !important;
        overflow: visible !important;
    }

    header.main_header .middle-line,
    header.main_header .bottom-line,
    header.main_header .slick-co-main-mnu {
        display: none !important;
    }

    header.main_header .top-line {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        height: 62px;
        margin: 0;
        padding: 0;
        background: #040a14;
        border-bottom: 1px solid #0e1a2b;
        text-align: left;
        /* контент на сайте использует z-index не выше 122,
           лайтбокс галереи — от 1042. Полоса и шторка должны быть между ними,
           иначе карточки и слайдеры перекрывают шапку */
        z-index: 900;
    }

    /* форма обратного звонка должна оставаться выше полосы,
       иначе её крестик (top: 30px) прячется под шапкой */
    .form-wrap,
    .form-wrap2 {
        z-index: 1000;
    }

    header.main_header .top-line .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 62px;
        max-width: 100%;
        margin: 0;
        padding: 0 14px;
    }

    /* телефон */
    header.main_header .mh-phone {
        display: flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        box-sizing: border-box;
        border: 1px solid rgba(255, 255, 255, 0.28);
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.04);
        animation: mh-phone-ring 2.4s ease-in-out infinite;
    }

    header.main_header .mh-phone svg {
        display: block;
        width: 19px;
        height: 19px;
        fill: #fff;
    }

    /* лого: картинка по центру полосы, обёрнута в ссылку на главную */
    header.main_header .mh-logo-link {
        display: flex;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
        height: 62px;
    }

    header.main_header .adap-logo {
        display: flex;
        position: static;
        align-items: center;
        justify-content: center;
        width: auto;
        height: auto;
        margin: 0;
        padding: 0;
        background: transparent;
        border: 0;
        text-align: center;
        z-index: auto;
        transform: none;
    }

    header.main_header .adap-logo .logo {
        display: block;
        width: 170px;
        max-width: 100%;
        height: 38px;
        margin: 0;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        line-height: 0;
    }

    /* бургер */
    header.main_header .sandwich {
        display: flex;
        position: static;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        margin: 0;
        background: transparent;
        border: 0;
        border-radius: 0;
        z-index: 11;
    }

    header.main_header .sandwich .for-row {
        left: 0;
        gap: 6px;
    }

    header.main_header .sandwich .for-row .row-s {
        width: 30px;
        height: 2px;
        margin: 0 auto;
        background: #fff;
        border-radius: 2px;
        transition: transform 0.3s ease, opacity 0.2s ease;
        animation: mh-burger-glow 2.2s ease-in-out infinite;
    }

    header.main_header.mh-drawer-open .sandwich .for-row .row-s {
        animation: none;
    }

    header.main_header.mh-drawer-open .sandwich .row-1 { transform: translateY(8px) rotate(45deg); }
    header.main_header.mh-drawer-open .sandwich .row-2 { opacity: 0; }
    header.main_header.mh-drawer-open .sandwich .row-3 { transform: translateY(-8px) rotate(-45deg); }

    /* ---------- затемнение ---------- */
    header.main_header .mh-drawer-overlay {
        display: block;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(0, 0, 0, 0.6);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
        z-index: 1400;
    }

    header.main_header.mh-drawer-open .mh-drawer-overlay {
        opacity: 1;
        visibility: visible;
    }

    /* ---------- шторка меню ---------- */
    header.main_header .main-mnu {
        display: flex;
        position: fixed;
        top: 0;
        right: 0;
        flex-direction: column;
        width: 82%;
        max-width: 340px;
        height: 100%;
        margin: 0;
        padding: 16px 22px 34px;
        box-sizing: border-box;
        background: #040a14;
        border-left: 1px solid #0e1a2b;
        box-shadow: -12px 0 40px rgba(0, 0, 0, 0.5);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        text-align: left;
        font-size: 16px;
        text-transform: none;
        z-index: 1500;
        transform: translateX(100%);
        transition: transform 0.34s cubic-bezier(0.4, 0, 0.2, 1);
    }

    header.main_header .main-mnu.active {
        transform: translateX(0);
    }

    /* крестик */
    header.main_header .main-mnu li.mh-drawer-head {
        display: block;
        margin: 0 0 6px;
        padding: 0;
        border: 0;
        text-align: right;
    }

    header.main_header .mh-drawer-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin-left: auto;
        padding: 0;
        background: transparent;
        border: 0;
        color: rgba(255, 255, 255, 0.8);
        cursor: pointer;
    }

    header.main_header .mh-drawer-close:hover {
        color: #fff;
    }

    header.main_header .mh-drawer-close svg {
        width: 22px;
        height: 22px;
    }

    /* пункты */
    header.main_header .main-mnu li {
        display: block;
        float: none;
        margin: 0;
        padding: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.07);
        text-align: left;
    }

    header.main_header .main-mnu li a,
    header.main_header .main-mnu.opa li a {
        display: block;
        padding: 13px 2px;
        color: #fff;
        font: 400 16px/1.3 'Helvetica Neue', Arial, sans-serif;
        letter-spacing: 0.4px;
        text-transform: none;
        opacity: 1;
        transition: color 0.2s ease, padding-left 0.2s ease;
    }

    header.main_header .main-mnu li a:hover {
        padding-left: 8px;
        color: rgba(255, 255, 255, 0.7);
    }

    /* телефон в шторке */
    header.main_header .main-mnu li.phone-hidden {
        display: flex;
        align-items: center;
        margin: 0 0 20px;
        padding: 12px 14px;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.03);
    }

    header.main_header .main-mnu li.phone-hidden::before {
        content: '';
        flex: 0 0 auto;
        width: 38px;
        height: 38px;
        margin-right: 14px;
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.35) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M20.01 15.38c-1.23 0-2.42-.2-3.53-.56a.977.977 0 0 0-1.01.24l-1.57 1.97c-2.83-1.35-5.48-3.9-6.89-6.83l1.95-1.66c.27-.28.35-.67.24-1.02-.37-1.11-.56-2.3-.56-3.53 0-.54-.45-.99-.99-.99H4.19C3.65 3 3 3.24 3 3.99 3 13.28 10.73 21 20.01 21c.71 0 .99-.63.99-1.18v-3.45c0-.54-.45-.99-.99-.99z'/%3E%3C/svg%3E") center / 17px 17px no-repeat;
    }

    /* font-size с !important — в разметке у ссылки стоит инлайновый style */
    header.main_header .main-mnu li.phone-hidden a,
    header.main_header .main-mnu.opa li.phone-hidden a {
        padding: 0;
        font-size: 19px !important;
        font-weight: 500;
        letter-spacing: 0.5px;
        white-space: nowrap;
    }

    /* соцсети внизу */
    header.main_header .main-mnu li.soc-icons-hidden {
        margin-top: auto;
        padding: 18px 0 0;
        border-bottom: 0;
    }

    header.main_header .main-mnu li.soc-icons-hidden::before {
        content: 'Мы в соцсетях';
        display: block;
        margin-bottom: 14px;
        padding-bottom: 10px;
        border-bottom: 1px solid #0e1a2b;
        color: rgba(255, 255, 255, 0.4);
        font-size: 11px;
        letter-spacing: 2px;
        text-transform: uppercase;
    }

    header.main_header .main-mnu li.soc-icons-hidden .social-icons {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin: 0;
        padding: 0;
    }

    header.main_header .main-mnu li.soc-icons-hidden .social-icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px;
        height: 42px;
        min-width: 42px;
        min-height: 42px;
        padding: 0;
        box-sizing: border-box;
        border: 1px solid rgba(255, 255, 255, 0.25);
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.04);
        animation: none;
    }

    header.main_header .main-mnu li.soc-icons-hidden .social-icon svg {
        width: 18px;
        height: 18px;
    }

    header.main_header .main-mnu li.soc-icons-hidden .social-icon.ic-dz svg {
        width: 22px;
        height: 22px;
    }
}

@media only screen and (max-width: 380px) {
    header.main_header .adap-logo .logo { width: 140px; height: 32px; }
    header.main_header .main-mnu { padding-left: 16px; padding-right: 16px; }
    header.main_header .main-mnu li a { font-size: 15px; padding: 12px 2px; }
    header.main_header .main-mnu li.phone-hidden a { font-size: 17px !important; }
}