/* Мобильное меню 2026: вложенные экраны, поиск, контакты (<=1023px). pipe-group.ru */ @media (max-width: 1023px) { /* кнопка меню в шапке — компактная иконка вместо полосы во всю ширину */ .header .menuToggle.mm26 { width: 44px; height: 44px; min-width: 44px; padding: 0 !important; margin: 0 !important; border-radius: 12px; background: #0F4C81; color: #fff; border: 0; box-shadow: 0 3px 10px rgba(15,76,129,.25); display: inline-flex !important; align-items: center; justify-content: center; order: 0; } .header .menuToggle.mm26 span { margin: 0 !important; } .header .menuToggle.mm26 .mtLbl { display: none !important; } /* панель */ /* Панель — выдвижная: занимает часть ширины, за ней видно сайт. В шаблоне она растянута на весь экран (left/right: 0), перекрываем. */ .menu ul.mmOpen { right: auto !important; width: min(82vw, 360px) !important; max-width: 82vw !important; padding: 0 0 26px !important; overscroll-behavior: contain !important; animation: mmDrawerIn .26s ease !important; } @keyframes mmDrawerIn { from { transform: translateX(-100%); } to { transform: none; } } /* затемнение страницы под панелью */ .mmScrim { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15,23,42,.45); opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease; z-index: 120; } html.mmLock .mmScrim { opacity: 1; visibility: visible; } /* кнопка закрытия — сбоку от панели, на затемнённой части */ .mmSideClose { position: fixed; top: 12px; left: calc(min(82vw, 360px) + 10px); width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: #0F4C81; font-size: 22px; line-height: 1; cursor: pointer; z-index: 130; opacity: 0; visibility: hidden; box-shadow: 0 4px 14px rgba(15,23,42,.3); transition: opacity .2s ease, visibility .2s ease; } html.mmLock .mmSideClose { opacity: 1; visibility: visible; } .mmSideClose:active { background: #fff; } .menu ul.mmOpen .mmClose, html.mmLock .menu .mmClose { display: none !important; } .menu ul.mmOpen .mmClose2 { display: none !important; } /* шапка панели: стрелка «назад», название экрана, закрыть */ .menu ul.mmOpen .mmTop { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; height: 52px; padding: 0 10px 0 6px; margin: 0 0 4px; background: #fff; border-bottom: 1px solid #eef2f6; } .menu ul.mmOpen .mmBack { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; } .menu ul.mmOpen .mmBackArrow { width: 10px; height: 10px; border-left: 2px solid #0F4C81; border-bottom: 2px solid #0F4C81; transform: rotate(45deg); } .menu ul.mmOpen .mmCrumb { flex: 1; padding-left: 4px; font-size: 16px; font-weight: 700; color: #0F4C81; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* поиск на первом экране */ .menu ul.mmOpen .mmSearchLi { padding: 8px 16px 2px; } .menu ul.mmOpen .mmSearch { display: flex; align-items: center; gap: 8px; background: #f1f5f9; border-radius: 12px; padding: 4px 12px; } .menu ul.mmOpen .mmSearch .sInput { width: 100% !important; border: 0 !important; background: none !important; padding: 12px 0 !important; font-size: 16px !important; color: #0f172a !important; outline: none !important; } .menu ul.mmOpen .mmSearch input[type=image] { width: 22px; height: 22px; opacity: .55; } /* экраны: смена списков со сдвигом */ .menu ul.mmOpen .mmScreens { margin: 0; padding: 0; } .menu ul.mmOpen .mmScreenHost { position: relative; overflow: hidden; } .menu ul.mmOpen .mmScreenHost .mmScreen { padding: 0 !important; background: none !important; border-radius: 0 !important; box-shadow: none !important; } .menu ul.mmOpen .mmScreen { will-change: transform, opacity; } .menu ul.mmOpen .mmScreen.mmIn { animation: mmScreenIn .24s ease; } .menu ul.mmOpen .mmScreen.mmOut { position: absolute; left: 0; right: 0; top: 0; animation: mmScreenOut .24s ease forwards; } @keyframes mmScreenIn { from { transform: translateX(26px); opacity: .35; } to { transform: none; opacity: 1; } } @keyframes mmScreenOut { from { transform: none; opacity: 1; } to { transform: translateX(-18px); opacity: 0; } } /* список экрана */ /* Список экрана — это