:root{
--navy:#363547;
--orange:#FF5600;
--gray:#7C9295;
--white:#FFFFFF;
}
@keyframes pmenu-step-open {
    0%   { transform: translateY(-100%); }
    3%   { transform: translateY(-93.75%); }
    6%   { transform: translateY(-93.75%); }
    9%   { transform: translateY(-87.5%); }
    12%  { transform: translateY(-87.5%); }
    15%  { transform: translateY(-81.25%); }
    18%  { transform: translateY(-81.25%); }
    21%  { transform: translateY(-75%); }
    24%  { transform: translateY(-75%); }
    27%  { transform: translateY(-68.75%); }
    30%  { transform: translateY(-68.75%); }
    33%  { transform: translateY(-62.5%); }
    36%  { transform: translateY(-62.5%); }
    39%  { transform: translateY(-56.25%); }
    42%  { transform: translateY(-56.25%); }
    45%  { transform: translateY(-50%); }
    48%  { transform: translateY(-50%); }
    51%  { transform: translateY(-43.75%); }
    54%  { transform: translateY(-43.75%); }
    57%  { transform: translateY(-37.5%); }
    60%  { transform: translateY(-37.5%); }
    63%  { transform: translateY(-31.25%); }
    66%  { transform: translateY(-31.25%); }
    69%  { transform: translateY(-25%); }
    72%  { transform: translateY(-25%); }
    75%  { transform: translateY(-18.75%); }
    78%  { transform: translateY(-18.75%); }
    81%  { transform: translateY(-12.5%); }
    84%  { transform: translateY(-12.5%); }
    87%  { transform: translateY(-6.25%); }
    90%  { transform: translateY(-6.25%); }
    93%  { transform: translateY(0); }
    100% { transform: translateY(0); }
}
@keyframes pmenu-step-close {
    0%   { transform: translateY(0); }
    3%   { transform: translateY(-6.25%); }
    6%   { transform: translateY(-6.25%); }
    9%   { transform: translateY(-12.5%); }
    12%  { transform: translateY(-12.5%); }
    15%  { transform: translateY(-18.75%); }
    18%  { transform: translateY(-18.75%); }
    21%  { transform: translateY(-25%); }
    24%  { transform: translateY(-25%); }
    27%  { transform: translateY(-31.25%); }
    30%  { transform: translateY(-31.25%); }
    33%  { transform: translateY(-37.5%); }
    36%  { transform: translateY(-37.5%); }
    39%  { transform: translateY(-43.75%); }
    42%  { transform: translateY(-43.75%); }
    45%  { transform: translateY(-50%); }
    48%  { transform: translateY(-50%); }
    51%  { transform: translateY(-56.25%); }
    54%  { transform: translateY(-56.25%); }
    57%  { transform: translateY(-62.5%); }
    60%  { transform: translateY(-62.5%); }
    63%  { transform: translateY(-68.75%); }
    66%  { transform: translateY(-68.75%); }
    69%  { transform: translateY(-75%); }
    72%  { transform: translateY(-75%); }
    75%  { transform: translateY(-81.25%); }
    78%  { transform: translateY(-81.25%); }
    81%  { transform: translateY(-87.5%); }
    84%  { transform: translateY(-87.5%); }
    87%  { transform: translateY(-93.75%); }
    90%  { transform: translateY(-93.75%); }
    93%  { transform: translateY(-100%); }
    100% { transform: translateY(-100%); }
}

/* ============ pmenu-root: реальная обёртка мобайл-меню на живом сайте.
На этапе демо-превью (просмотр файла как отдельной HTML-страницы)
здесь была имитация рамки телефона (.device/.screen) с
display:flex/центрированием — эти правила были не частью самого меню,
а окружением для показа макета. При вставке через wp_footer они
перезаписывали <body> живого сайта (весь сайт становился flex-контейнером)
и зажимали меню в узкую 390px-колонку — отсюда "меню сбоку, за кадром".
Теперь .pmenu-root ничего не позиционирует и не ограничивает по
размеру — вся раскладка живёт на .topbar/.menu-panel/.submenu через
position:fixed относительно окна браузера. */
.pmenu-root, .pmenu-root *{
font-family: Helvetica, Arsenal, Arial, sans-serif !important;
}
.pmenu-root *{ box-sizing:border-box; }
/* ============ pattern layer — real asset provided by the client (PNG,
colour #7C9295, transparency pre-tuned by them in PowerPoint against the
real menu mockup on an actual iPhone 16) — used as-is, no CSS recreation ============ */
/* background-size:cover (not 100% 100%) — растягивает без искажения пропорций,
иначе угол диагоналей "поплывёт", если высота реального меню не совпадёт
1-в-1 с исходным изображением. Файл menu-pattern.png должен лежать рядом
с html (или замените url(...) на реальный адрес после загрузки в Медиатеку WordPress). */
/* ============ top header bar (Elementor-built header stays visible) ============
На реальном сайте эту кнопку в итоге интегрируем в шаблон Elementor-хедера
(см. План, Этап 1, п.7). На тестовом этапе делаем её position:fixed, чтобы
кнопка была всегда доступна поверх контента живой страницы. */
.topbar{
position:fixed;
top:0; left:0; right:0;
z-index:99999;
display:flex;
align-items:center;
justify-content:space-between;
padding:14px 18px;
background: rgba(54,53,71,.92);
backdrop-filter: blur(2px);
}
.logo{
color:var(--white);
font-size:15px;
letter-spacing:.03em;
font-weight:700;
}
.logo span{ color:var(--orange); }
/* burger / close toggle — квадратная кнопка с подписью "Меню" сверху и
несимметричной "лесенкой" линий справа, превращающейся в слегка приплюснутый крестик */
.pmenu-root .menu-toggle{
width:60px;
height:60px;
/* Цвет #1C1B26 переведен в формат rgb (28, 27, 38). 
   Последняя цифра 0.85 задает прозрачность 85%. 
   Вы можете менять её, например: 0.5 — полупрозрачный, 1.0 — сплошной. */
background: rgba(54, 53, 71, 1);
border:1px solid rgba(255, 255, 255, 0.4);
/* ИСПРАВЛЕНО: Скругление углов уменьшено с 14px до 8px (кнопка станет более квадратной) */
border-radius:8px;
cursor:pointer;
display:flex;
flex-direction:column;
align-items:flex-end;
justify-content:center;
gap:7px;
padding:9px 14px 9px 10px;
}
.pmenu-root .toggle-label{
color:var(--white);
font-size:12px;
font-weight:600;
line-height:1;
white-space:nowrap;
}
.pmenu-root .toggle-icon{
position:relative;
width:24px;
height:15px;
flex-shrink:0;
}
.pmenu-root .toggle-icon .bar{
position:absolute;
/* ИСПРАВЛЕНО: Прижимаем все линии к правому краю, а не к левому */
right:0;
height:2.5px;
background:var(--white);
border-radius:2px;
transition: top .28s ease, width .28s ease, transform .28s ease, opacity .2s ease;
transform-origin:center center;
}
.pmenu-root .toggle-icon .bar1{ top:0;    width:24px; }
.pmenu-root .toggle-icon .bar2{ top:6.3px; width:18px; }
.pmenu-root .toggle-icon .bar3{ top:12.5px; width:11px; }
.pmenu-root .menu-toggle.is-open .bar1{ top:6.3px; width:22px; transform:rotate(35deg); }
.pmenu-root .menu-toggle.is-open .bar2{ opacity:0; width:0; }
.pmenu-root .menu-toggle.is-open .bar3{ top:6.3px; width:22px; transform:rotate(-35deg); }
/* ============ menu panel (drops from top, covers whole viewport) =========
Главная страница меню — единое полотно: список, теги и контакты скроллятся
вместе как одна страница (без отдельного "запертого" низа). Если контент
не помещается на экране — появляется обычная прокрутка всей панели;
если помещается (как в исходном мокапе) — прокрутки не будет вовсе.
Подменю (.submenu/.submenu-scroll ниже) устроены иначе и это сохранено:
там длинные списки (20+ пунктов) остаются со спойлером — закреплённые
заголовок/"Назад" сверху и "Обсудить проект" снизу, крутится только
середина — так удобнее ориентироваться в длинном каталоге услуг. */
.pmenu-root .menu-panel{
position:fixed;
left:0; right:0; top:0; bottom:0;
background-color: var(--navy);
/* ИСПРАВЛЕНО: Ссылка заменена на относительный путь. Картинка берется прямо из папки темы */
background-image: linear-gradient(rgba(54,53,71,0.65), rgba(54,53,71,0.65)), url("menu-pattern.png");
background-size: cover, 100% 60vh;
background-position: center, center bottom;
background-repeat: no-repeat, no-repeat;
transform: translateY(-100%);
opacity:0;
visibility:hidden;
display:flex;
flex-direction:column;
overflow-y:auto;
scrollbar-width: thin;
scrollbar-color: var(--white) transparent;
z-index:99998;
}
.pmenu-root .menu-panel::-webkit-scrollbar{ width:5px; }
.pmenu-root .menu-panel::-webkit-scrollbar-thumb{ 
    background-color: #FFFFFF !important; 
    box-shadow: inset 0 0 6px rgba(255, 255, 255, 1) !important; 
    border-radius:4px; 
}
.pmenu-root .menu-panel::-webkit-scrollbar-track{ background:transparent !important; }
.pmenu-root .menu-panel.open{
opacity:1;
transform: translateY(0);
visibility:visible;
animation: pmenu-step-open 1.2s ease-out forwards;
}
.pmenu-root .menu-panel.closing {
    opacity: 1;
    visibility: visible;
    animation: pmenu-step-close 1.2s ease-out forwards;
}

/* Раньше фон висел на .menu-scroll — а у него своя маленькая высота
(только шапка + список), и картинка физически обрезалась по этой
границе независимо от background-size. Теперь фон живёт на .menu-panel
(весь прокручиваемый холст) — картинке есть куда "дотянуться" вниз
на свою настоящую высоту, не упираясь в границу списка пунктов. */
.pmenu-root .menu-scroll{
padding: 18px 20px 10px;
position: relative;
z-index: 2;
}
.pmenu-root .menu-label{
color:var(--white);
font-size:30px;
font-weight:700;
letter-spacing:.02em;
margin:0 0 14px 2px;
}
.pmenu-root .menu-list{ list-style:none; margin:0 0 18px; padding:0; }
.pmenu-root .menu-item {
    opacity: 0;
    transform: translateY(10px);
    animation: none;
}
.pmenu-root .menu-panel.open .menu-item, .pmenu-root .submenu.open .menu-item, #hrManagementSubmenu.open .menu-item, #partnershipSubmenu.open .menu-item{ animation: reveal .5s ease forwards; }
@keyframes reveal{
to{ opacity:1; transform:translateY(0); }
}
.item-row{
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
background:none;
border:1px solid transparent;
padding:13px 14px;
border-bottom:1px solid rgba(255,255,255,.08);
color:var(--white);
font-size:17px;
font-family:inherit;
cursor:pointer;
text-align:left;
border-radius:6px;
transition: color 0.2s ease, border-color 0.2s ease;
}
/* ИСПРАВЛЕНО: Защита от темно-голубого цвета Elementor при наведении на корневые пункты */
.item-row:hover, .item-row:focus, .item-row:active {
color: var(--white) !important;
background: none !important;
}
.item-row.is-active, .item-row.is-active:hover{
color:var(--orange) !important;
border: 1px solid var(--orange) !important;
}
.item-row.is-active .chev{ border-color:var(--orange) !important; }
/* "Вакансии": строка = реальная ссылка + отдельная кнопка-стрелка (как
аккордеоны внутри "Наши услуги"). Без этих правил браузер показывал
свои стили по умолчанию: синюю подчёркнутую ссылку и системную кнопку. */
.item-row--split{
display:flex; align-items:center; justify-content:space-between;
width:100%; border:1px solid transparent;
border-bottom:1px solid rgba(255,255,255,.08);
border-radius:6px;
}
.item-row-link{
flex:1; display:block; color:var(--white); text-decoration:none;
font-size:17px; padding:13px 14px;
}
.item-row-toggle{
background:none; border:none; cursor:pointer;
padding:13px 14px; display:flex; align-items:center; flex-shrink:0;
-webkit-appearance:none; appearance:none;
}
.item-row--split.is-active{ border-color:var(--orange); }
.item-row--split.is-active .item-row-link{ color:var(--orange); }
.item-row--split.is-active .chev{ border-color:var(--orange); }
.divider-row{
display:flex;
align-items:center;
justify-content:space-between;
padding:10px 4px;
color:var(--white);
font-size:15px;
}
.lang-toggle{
display:flex; gap:6px;
background:rgba(255,255,255,.08);
padding:4px; border-radius:20px;
}
.lang-toggle button{
border:none; background:none; color:var(--gray);
font-size:12px; padding:4px 10px; border-radius:16px; cursor:pointer;
font-family:inherit;
}
.lang-toggle button.active{ background:var(--orange); color:var(--white); }
/* bottom fixed block: tagline + CTA + contacts
фон убран: было сплошной var(--navy), который перекрывал паттерн, лежащий
слоем ниже внутри той же .menu-panel (базовый navy .menu-panel остаётся
виден и без этой заливки) */
.pmenu-root .menu-bottom{
padding:16px 20px 20px;
border-top:1px solid rgba(255,255,255,.1);
}
.tagline{
color:var(--white);
font-size:13px;
line-height:1.4;
margin:24px 0 12px;
max-width:240px;
}
.cta-btn{
display:block;
width:100%;
background:var(--orange);
color:var(--white);
border:none;
padding:13px;
font-size:15px;
font-weight:700;
border-radius:6px;
margin-bottom:16px;
cursor:pointer;
font-family:inherit;
}
.contacts-heading{
color:var(--white);
font-size:15px;
font-weight:600;
letter-spacing:.02em;
margin:40px 0 10px;
}
.contacts-block{
margin-top:0;
}
.contact-line{
display:flex; align-items:center; gap:10px;
color:var(--white); font-size:14px;
margin-bottom:10px;
}
.contact-line a,
.contact-line a:visited,
.contact-line a:hover,
.contact-line a:focus,
.contact-line a:active { 
color: var(--white) !important; 
text-decoration: none !important; 
}
.icon{ flex-shrink:0; color:var(--white); } /* поменяйте на var(--gray), если серый будет смотреться лучше */
.icon svg{ width:20px; height:20px; display:block; }
.callback-btn{
background:none;
border:1px solid var(--gray);
color:var(--white);
font-size:13px;
padding:6px 12px;
border-radius:16px;
margin-left:auto;
cursor:pointer;
font-family:inherit;
white-space:nowrap;
display:flex;
align-items:center;
gap:6px;
}
.callback-icon{ width:14px; height:14px; flex-shrink:0; color:var(--white); }
.map-btn{
background:none;
border:1px solid var(--gray);
color:var(--white);
font-size:12px;
padding:5px 10px;
border-radius:16px;
cursor:pointer;
font-family:inherit;
text-decoration:none;
white-space:nowrap;
margin-left:auto;
}
.address-text{ font-size:13px; line-height:1.35; color:var(--white); }
/* было justify-content:space-between — video-row (YouTube/RuTube) утыкался
в правый край экрана, ровно там, где сидит круглая иконка Jivosite.
Теперь ряды идут компактно друг за другом слева, правый нижний угол
остаётся свободным под виджет чата. */
.icons-row{ display:flex; align-items:center; gap:22px; margin:14px 0 6px; }
.social-row{ display:flex; gap:14px; }
.video-row{ display:flex; gap:14px; }
.social-row a, .video-row a{
width:34px; height:34px;
border-radius:50%;
border:1px solid var(--gray);
display:flex; align-items:center; justify-content:center;
color:var(--white);
font-size:12px;
font-weight:700;
text-decoration:none;
flex-shrink:0;
}
.social-row a svg, .video-row a svg{ width:21px; height:auto; display:block; }
.video-row a svg.rutube-icon{ width:22px; transform: translateY(-2px); }
/* VK/Telegram: те же 21px по ширине бокса, что у остальных, но сам рисунок
буквы/самолётика внутри их viewBox занимает меньше площади, чем, например,
заполненный кружок Tenchat — из-за этого визуально казались мельче.
Увеличиваем именно эти два индивидуально. */
.social-row a[aria-label="VK"] svg{ width:29px; }
.social-row a[aria-label="Telegram"] svg{ width:29px; transform: translateX(-2px); }
.social-row a img, .video-row a img{ display:block; }
.faq-link{
display:block; color:var(--gray); font-size:13px; margin-top:8px; text-decoration:underline;
}
/* ============ submenu overlay (slides right -> left, covers everything) === */
.pmenu-root .submenu{
position:fixed;
top:0; right:0; bottom:0;
width:100%;
background-color: var(--navy);
background-image: linear-gradient(rgba(54,53,71,0.65), rgba(54,53,71,0.65)), url("menu-pattern.png");
background-size: cover, 100% 60vh;
background-position: center, center bottom;
background-repeat: no-repeat, no-repeat;
transform:translateX(100%);
transition: transform .65s ease;
z-index:99999;
display:flex;
flex-direction:column;
}
.pmenu-root .submenu.open{ transform:translateX(0); }
.pmenu-root .submenu-head{
display:flex; align-items:center; gap:10px;
padding:16px 18px 8px;
color:var(--white);
}
.back-btn{
background:none; border:none; color:var(--white);
display:flex; align-items:center; gap:6px;
font-size:15px; cursor:pointer; font-family:inherit;
padding:6px 4px;
}
.back-btn .chevL{
width:8px; height:8px;
border-left:2px solid var(--white);
border-bottom:2px solid var(--white);
transform:rotate(45deg);
}
.pmenu-root .submenu-title{
font-size:19px; font-weight:700; color:var(--white);
padding: 0 18px 10px 36px;
margin-top:14px;
border-bottom:1px solid rgba(255,255,255,.08);
margin-bottom:6px;
}
.crumb{ color:var(--gray); font-weight:400; font-size:13px; display:block; margin-top:8px; }

.pmenu-root .submenu-scroll{
flex:1; 
overflow-y:auto; 
padding: 6px 18px 10px;
scrollbar-width: thin; 
scrollbar-color: var(--white) transparent;
-webkit-overflow-scrolling: touch !important; /* Автоматически включает идеальный плавный скролл во всех подменю */
overscroll-behavior-y: contain !important;     /* Защищает от блокировок каждую шторку каталога услуг */
}
.pmenu-root .submenu-scroll::-webkit-scrollbar{ width:5px; }
.pmenu-root .submenu-scroll::-webkit-scrollbar-thumb{ 
    background-color: #FFFFFF !important; 
    box-shadow: inset 0 0 6px rgba(255, 255, 255, 1) !important; 
    border-radius:4px; 
}
.chev{
width:9px; height:9px;
border-right:2px solid var(--white);
border-bottom:2px solid var(--white);
transform:rotate(-45deg);
flex-shrink:0;
transition: border-color .2s ease;
margin-left:12px;
}
.pmenu-root .sub-item{
display:block; width:100%; text-align:left;
background:none; border:1px solid transparent;
color:var(--white); font-size:15.5px; font-family:inherit;
padding:11px 14px; border-bottom:1px solid rgba(255,255,255,.07);
cursor:pointer; border-radius:6px; text-decoration:none;
transition: color 0.2s ease;
}
/* ИСПРАВЛЕНО: Защита от темно-голубого цвета Elementor при наведении на подпункты */
.pmenu-root .sub-item:hover, .pmenu-root .sub-item:focus, .pmenu-root .sub-item:active {
color: var(--white) !important;
text-decoration: none !important;
background: none !important;
}
.pmenu-root .sub-item--nav{
display:flex; align-items:center; justify-content:space-between;
}
.pmenu-root .sub-item.is-active, .pmenu-root .sub-item.is-active:hover{ 
color:var(--orange) !important; 
border:1px solid var(--orange) !important; 
}
/* ИСПРАВЛЕНО: Добавлен !important для защиты оранжевой стрелочки активного подпункта */
.pmenu-root .sub-item.is-active .chev{ border-color:var(--orange) !important; }

/* Ключевые услуги — заметнее обычного тонкого едва видимого разделителя */
/* Отдельная чистая линия-разделитель после блока из 3 базовых услуг —
не border конкретного пункта (у него скруглённые уголки box'а и это
было видно), а самостоятельный элемент на всю ширину. */
.services-divider{
height:1px;
background:rgba(255,255,255,.9);
margin:8px 14px 12px;
}
/* ===== Аккордеон внутри "Наши услуги": Построение отдела продаж /
Построение региональных продаж / Тренинги и обучение / Систематизация
бизнеса. Заголовок — одновременно ссылка (переход на страницу услуги) и
отдельная кнопка-стрелка (раскрыть/свернуть список якорей той же
страницы). Раскрытые пункты сдвинуты правее, имитируя вложенность. ===== */
.acc-head{ display:flex; align-items:center; justify-content:space-between; padding:0; }
.acc-link{
flex:1; display:block; color:var(--white); text-decoration:none;
font-size:15.5px; padding:11px 14px;
}
.acc-head.is-active .acc-link{ color:var(--orange); }
.acc-toggle{
background:none; border:none; cursor:pointer;
padding:11px 14px; display:flex; align-items:center; flex-shrink:0;
}
.acc-toggle .chev{ margin-left:0; }
.acc-head.open .acc-toggle .chev{ transform: rotate(-135deg); border-color:var(--orange); }
/* Пункты 2-го уровня ("Построение системного отдела продаж" и т.п.) —
в свёрнутом виде стрелка смотрит вниз (не вправо, как у обычных
пунктов), чтобы явно отличать "раскрывающийся аккордеон" от простого
перехода на страницу. В развёрнутом виде — как у всех остальных. */
.acc-head--lvl2 .acc-toggle .chev{ transform: rotate(45deg); }
.acc-head--lvl2.open .acc-toggle .chev{ transform: rotate(-135deg); border-color:var(--orange); }
.acc-sub{
max-height:0; overflow:hidden;
transition: max-height .3s ease;
}
.acc-sub.open{ max-height:900px; }
/* Уровень 1 — прямые пункты и подзаголовки внутри раскрытого аккордеона */
.acc-sub > .sub-item:not(.acc-head):not(.lvl3-link):not(.lvl4-item),
.acc-sub > .acc-head > .acc-link {
    padding-left: 30px;
    font-size: 14.5px;
}
.acc-sub > .sub-item:not(.acc-head):not(.lvl3-link):not(.lvl4-item),
.acc-sub > .acc-head > .acc-link {
    padding-left: 30px;
    font-size: 14.5px;
}
/* Уровень 2 — вложенный аккордеон внутри аккордеона
(напр. "Аудит отдела продаж" -> его собственные якоря) — сдвинут ещё правее */
.acc-sub .acc-sub > .sub-item { padding-left: 52px; font-size: 14px; } and 
/* Уровень 3 — та же подпись категории, но уже реальная ссылка на страницу
(клик = переход в начало страницы услуги). Уровень 4 — пункты с "-",
ссылки на конкретные разделы/якоря той же страницы, самый глубокий отступ. */
.acc-sub > .sub-item.lvl3-link { padding-left: 30px; font-size: 14.5px; }
.acc-sub > .sub-item.lvl4-item { padding-left: 46px; font-size: 14px; opacity: .9; }
/* Те же уровни 3/4, но без промежуточной категории 2-го уровня
(Построение региональных продаж, Тренинги и обучение, Систематизация
бизнеса — там всего 1 аккордеон, а не 2 вложенных, как в "Построение
отдела продаж"), поэтому отступ считаем на 1 шаг короче. */
.acc-sub .acc-sub > .sub-item.lvl3-link { padding-left:46px; font-size:14.5px; }
.acc-sub .acc-sub > .sub-item.lvl4-item { padding-left:62px; font-size:14px; opacity:.9; }
.acc-head--lvl2 .acc-link{ font-weight:700; }
.pmenu-root .sub-item--bold{ font-weight:700; }
.pmenu-root .submenu-bottom{
padding:12px 18px 18px;
border-top:1px solid rgba(255,255,255,.1);
}
.discuss-btn{
display:block; width:100%; background:none; color:var(--orange);
border:1px solid var(--orange); padding:11px; border-radius:6px;
font-size:14px; font-weight:700; margin-bottom:12px; cursor:pointer;
font-family:inherit;
}
/* ============ responsive breakpoints per ТЗ ============ */
@media (max-width:480px){
.item-row{ font-size:16px; }
.logo{ font-size:14px; }
}
@media (max-width:360px){
.item-row{ font-size:15px; padding:10px 4px; }
.tagline{ font-size:12px; }
.cta-btn{ font-size:14px; padding:11px; }
.contact-line{ font-size:13px; }
}
.dev-note{
max-width:390px;
color:#9a9aab;
font-size:12px;
line-height:1.5;
margin-top:14px;
padding:0 6px;
}
/* === 1. Скрыть всю полосу на десктопе === */
@media (min-width: 1025px) {
    .pmenu-root .topbar {
        display: none !important;
    }
}

/* === 2. На мобайле/планшете: убрать фон и логотип, оставить кнопку === */
@media (max-width: 1024px) {
    .pmenu-root .topbar {
        background: transparent !important;
        backdrop-filter: none !important;
        padding: 14px 18px !important;
    }

    .pmenu-root .logo {
        display: none !important;
    }

    /* Кнопка остаётся прижатой вправо */
    .pmenu-root .topbar {
        justify-content: flex-end !important;
    }
}
/* --- РЕГУЛИРОВКА ОТСТУПОВ МЕНЮ (mobile-menu.css) --- */
/* Здесь настраиваются отступы для заголовков и пунктов плоского списка */
.sub-item.menu-item.flat-group-head {
  font-weight: 700;
  padding-left: 24px; /* ← отступ для заголовков групп */
}

.sub-item.menu-item.flat-group-child {
  padding-left: 46px;  /* ← отступ для подпунктов (тире + текст) */
  font-weight: 400;
}
/* -------------------------------------------------- */

/* ИСПРАВЛЕНО: Поднимаем все всплывающие окна Elementor Pro на слой выше (z-index: 100001), 
   чтобы они открывались поверх мобильного меню (у которого z-index: 99999), 
   позволяя шторкам оставаться открытыми на заднем фоне. */
.elementor-popup-modal {
  z-index: 100001 !important;
}

/* =========================================================================
   1. ИСПРАВЛЕНО: Защита и перекраска согласий во ВСЕХ стандартных popup сайта
   ========================================================================= */
/* Базовый цвет ссылок в чекбоксах согласий и формах сбора контактов делаем белым */
.elementor-field-option label a, 
.elementor-form .elementor-field-subgroup label a,
a.item-row-link {
    color: var(--white) !important;
    text-decoration: underline !important;
}
/* При наведении на политику или согласие подсвечиваем фирменным оранжевым цветом */
.elementor-field-option label a:hover, 
.elementor-form .elementor-field-subgroup label a:hover,
a.item-row-link:hover {
    color: var(--orange) !important;
    text-decoration: underline !important;
}

/* =========================================================================
   2. ИСПРАВЛЕНО: Фиксация оранжевого цвета для анкоров в Popup «Согласие Cookie»
   ========================================================================= */
/* Анкоры "Соглашение" и "Политика конфиденциальности" внутри Cookie-баннера 
   теперь всегда оранжевые (#FF5600) — и в обычном состоянии, и при тапе/наведении, 
   чтобы не сливаться с белым фоном блока */
.elementor-popup-modal p a,
.elementor-popup-modal text a,
.elementor-popup-modal p a:hover,
.elementor-popup-modal text a:hover,
.elementor-popup-modal p a:focus,
.elementor-popup-modal p a:active {
    color: var(--orange) !important;
    text-decoration: underline !important;
}

/* =========================================================================
   3. ИСПРАВЛЕНО: Монолитный белый цвет для кнопки карты и иконок соцсетей
   ========================================================================= */
/* Кнопка «Посмотреть на карте» теперь всегда остаётся строго белой */
.pmenu-root .map-btn,
.pmenu-root .map-btn:visited,
.pmenu-root .map-btn:hover,
.pmenu-root .map-btn:focus,
.pmenu-root .map-btn:active {
    color: var(--white) !important;
    border-color: var(--gray) !important;
    text-decoration: none !important;
    background: none !important;
}

/* Кнопки соцсетей и видео при тапе/наведении сохраняют ровный белый цвет обводки и иконок */
.social-row a:hover,
.video-row a:hover,
.social-row a:active,
.video-row a:active,
.social-row a:hover svg,
.video-row a:hover svg,
.social-row a:active svg,
.video-row a:active svg {
    color: var(--white) !important;
    border-color: var(--gray) !important;
}
/* ============ Адаптация под динамические панели браузеров (iOS / Android) ============ */
.pmenu-root .menu-panel,
.pmenu-root .submenu {
    height: 100vh !important; /* Запасной вариант для всех систем */
    height: var(--pmenu-vh, 100vh) !important; /* Значение прилетит из JS, валидатор спокоен */
    overscroll-behavior: contain !important;
}

/* Жесткое отключение скролла самого сайта, когда мобильное меню открыто */
html.pmenu-lock,
html.pmenu-lock body {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
}