/* =================================================================
   mobile-fix.css — фикс мобильной вёрстки.
   Подключается ПОСЛЕДНИМ, чтобы перебивать остальные правила.
   Работает только на экранах ≤768px, десктоп не трогает.
   ================================================================= */

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

    /* 1. Запрещаем горизонтальный скролл */
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    /* 2. Главные контейнеры — на всю ширину экрана */
    body.redesign #page-wrapper,
    body.redesign .row,
    body.redesign .main-menu-wrap,
    body.redesign .header,
    body.redesign .slider,
    body.redesign .main,
    body.redesign .footer {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    /* 3. Мягкие отступы по бокам, чтобы контент не прилипал к краям */
    body.redesign .row {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    body.redesign #page-wrapper {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* 4. Шапка — логотип, телефоны, колонки стопкой */
    body.redesign .header {
        padding: 1rem 0 !important;
    }
    body.redesign .header .row {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    body.redesign .header-col {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin-bottom: .5rem;
    }
    body.redesign .header .phone a {
        font-size: 1.05rem !important;
        word-break: break-word;
    }
    body.redesign .header .logo img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 5. Главное меню — вертикально, на всю ширину */
    body.redesign .header .main-menu ul {
        display: block !important;
    }
    body.redesign .header .main-menu ul li {
        display: block !important;
        width: 100% !important;
    }
    body.redesign .header .main-menu ul li a {
        padding: .75rem 0 !important;
    }

    /* 6. Слайдер — единственный настоящий виновник с width:680px */
    body.redesign .main_slider,
    body.redesign #main_slider,
    body.redesign #slider,
    body.redesign .nivoSlider,
    body.redesign .slider-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-width: 0 !important;
        margin: 0 auto !important;
    }
    body.redesign #slider img,
    body.redesign .nivoSlider img,
    body.redesign .main_slider img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }

    /* 7. Сайдбар / меню «Услуги» */
    body.redesign .aside,
    body.redesign .aside__menu-wrap,
    body.redesign .aside-menu,
    body.redesign .show_main-menu {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        float: none !important;
    }
    body.redesign .show_main-menu {
        text-align: center !important;
    }

    /* 8. Контент страницы */
    body.redesign .main #mainsection {
        width: 100% !important;
        padding: 1rem !important;
        box-sizing: border-box !important;
    }
    body.redesign #pageinfo_content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 9. Медиа — не выходят за пределы родителя */
    body.redesign img,
    body.redesign video,
    body.redesign iframe,
    body.redesign embed,
    body.redesign object {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 10. Таблицы — не растягивают страницу */
    body.redesign table {
        max-width: 100% !important;
    }
    body.redesign table td,
    body.redesign table th {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    /* 11. Лента новостей */
    body.redesign .news-item {
        width: 100% !important;
        max-width: 100% !important;
    }
    body.redesign .news-item__thumb,
    body.redesign .news-item__thumb_full,
    body.redesign .news-item__content,
    body.redesign .news-item__content_width_full {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }
    body.redesign .news-item__thumb img,
    body.redesign .news-item__thumb video {
        width: 100% !important;
        height: auto !important;
    }

    /* 12. Галерея доп.фото в новости */
    body.redesign .news-gallery a {
        display: inline-block !important;
        max-width: 45% !important;
        margin: 4px !important;
    }
    body.redesign .news-gallery img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 13. Подвал — колонки стопкой */
    body.redesign .footer .f-col_left,
    body.redesign .footer .f-col_center,
    body.redesign .footer .f-col_right {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        padding: 0 !important;
    }
    body.redesign .footer .f-col_left address {
        padding-right: 0 !important;
    }

    /* 14. Клиенты / работы / баннеры */
    body.redesign .clients .client-card,
    body.redesign .works-list .work-card {
        width: 100% !important;
        float: none !important;
        padding-right: 0 !important;
    }
    body.redesign .clients-line .row {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body.redesign .clients-line .swiper-button-next,
    body.redesign .clients-line .swiper-button-prev {
        display: none !important;
    }

    /* 15. Плавающая кнопка звонка — уменьшаем */
    #popup__toggle {
        transform: scale(.75);
        transform-origin: bottom right;
    }
}

@media screen and (max-width: 480px) {
    body.redesign h1 { font-size: 1.25rem !important; }
    body.redesign h2 { font-size: 1rem !important; }
    body.redesign .header .phone a { font-size: .95rem !important; }
    body.redesign .header-col { width: 100% !important; }
    body.redesign .row {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    body.redesign #pageinfo_content { font-size: 13px !important; }
}