/* ============================================================
   luxmed.css — слой унификации site/ под клон liczdrav.ru.
   Грузится ПОСЛЕ site.css + page.css → перебивает по каскаду.
   Добавляет: коралл-акцент, двухрядную шапку (лого+телефоны+соцсети / меню+CTA),
   тёмный подвал ЦАЛ (реквизиты+14 городов+соцсети), Lora, де-ИИ.
   ============================================================ */
:root{
  --accent:#fc6b4f; --accent-dk:#d65b42;
  --brand-tint:#ebf4f9; --line:#e5e5e5; --line-2:#ebecec;
  --dark:#13171a; --faint:#9e9e9e;
  --foot-bg:#15191c; --foot-text:#c3cad0; --foot-head:#fff; --foot-line:#2b333a;
  --accent-font:'Lora',Georgia,serif;
  --head-h:124px;
}
body{padding-top:var(--head-h)}

/* убрать старую однорядную .nav, если осталась */
header.nav{position:static!important;height:auto!important;border:0!important;padding:0!important;display:block!important}

/* ---------- HEADER (two-row) ---------- */
.lzx-header{position:fixed;top:0;left:0;right:0;z-index:300;background:#fff;box-shadow:var(--shadow)}
.lzx-main{background:#fff}
.lzx-row{display:flex;align-items:center;gap:24px;min-height:72px;max-width:1140px;margin:0 auto;padding:0 24px}
.lzx-logo{flex:0 0 auto;display:flex;align-items:center}
.lzx-logo img{height:46px;width:auto;max-width:none}
.lzx-phone{display:flex;flex-direction:column;line-height:1.25;margin-left:6px}
.lzx-phone a{font:600 16px/1.2 var(--head);color:var(--text)}
.lzx-phone a:hover{color:var(--brand)}
.lzx-phone span{font-size:12px;color:var(--soft)}
.lzx-phone .ph-hook{font-size:14px;font-weight:600;color:#1a7a4a}
.lzx-phone .ph-hours{font-size:13px;color:var(--muted)}
.lzx-right{margin-left:auto;display:flex;align-items:center;gap:20px}
.lzx-city{display:flex;flex-direction:column;gap:3px;font-size:13px;text-align:right}
.lzx-city a{color:var(--brand)}
.lzx-social{display:flex;gap:8px}
.lzx-social a{width:32px;height:32px;border-radius:50%;background:var(--text);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .25s}
.lzx-social a:hover{background:var(--brand)}
.lzx-social svg{width:15px;height:15px;fill:currentColor}
.lzx-cta{margin-left:auto;flex:0 0 auto;background:var(--accent);color:#fff;border-radius:50px;padding:12px 26px;font:500 14px/1 var(--font);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;border:0;cursor:pointer;transition:background .25s}
.lzx-cta:hover{background:var(--accent-dk);color:#fff}
.lzx-menuwrap{background:var(--bg-alt);border-top:1px solid var(--line-2)}
.lzx-menurow{display:flex;align-items:center;gap:0;max-width:1140px;margin:0 auto;padding:0 24px}
.lzx-menu{display:flex;align-items:center;flex-wrap:nowrap;gap:0}
.lzx-menu>li{position:relative}
.lzx-menu>li>a{display:flex;align-items:center;gap:5px;padding:15px 11px;white-space:nowrap;font:500 13.5px/1 var(--font);letter-spacing:.3px;color:var(--text);text-transform:uppercase;border-bottom:3px solid transparent}
.lzx-menu>li>a:hover,.lzx-menu>li.active>a{color:var(--brand);border-bottom-color:var(--brand)}
.lzx-has>a::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-3px;opacity:.7}
.lzx-drop{position:absolute;top:100%;left:0;min-width:280px;background:#fff;box-shadow:var(--shadow-h);border-radius:6px;border-top:3px solid var(--brand);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s;z-index:60}
.lzx-mega{display:flex;gap:8px;min-width:680px;padding:14px 8px;
  /* 25 пунктов в две колонки не влезали по высоте на ноутбуке 1366x768 */
  max-height:calc(100vh - 150px);overflow-y:auto;overscroll-behavior:contain}
.lzx-mega>div{min-width:300px;flex:1 1 0}
.lzx-col-h{font:700 12px/1 var(--head);text-transform:uppercase;letter-spacing:.6px;color:var(--brand-dk);padding:6px 16px 8px}
/* focus-within — доступ к выпадашкам с клавиатуры, был только :hover */
.lzx-menu>li:hover>.lzx-drop,.lzx-menu>li:focus-within>.lzx-drop{opacity:1;visibility:visible;transform:translateY(0)}
.lzx-drop li a{display:block;padding:8px 16px;font-size:14px;color:var(--body,#353535)}
.lzx-drop li a:hover{background:var(--brand-tint);color:var(--brand-dk)}
.lzx-burger{display:none;width:44px;height:44px;border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;gap:5px;margin-left:auto}
.lzx-burger span{display:block;height:2px;width:26px;background:var(--text);transition:all .25s}
.lzx-mobile{display:none}

/* ---------- FOOTER (dark, ЦАЛ) ---------- */
.footer{display:none!important}   /* спрятать старый светлый подвал */
.lzf{background:var(--foot-bg);color:var(--foot-text);font-size:14px;padding:56px 0 0}
.lzf a{color:var(--foot-text)}.lzf a:hover{color:#fff}
.lzf-in{max-width:1140px;margin:0 auto;padding:0 24px}
.lzf-grid{display:grid;grid-template-columns:1.4fr 1fr 1.6fr;gap:36px}
.lzf-col h4{color:var(--foot-head);font:700 13px/1.4 var(--head);text-transform:uppercase;letter-spacing:.8px;margin:0 0 16px}
.lzf-col p{margin:0 0 8px;line-height:1.55}.lzf-col li{margin-bottom:8px}
.lzf-col b{color:#fff}
.lzf-cities{columns:2;column-gap:24px;font-size:13px}
.lzf-cities li{break-inside:avoid;margin-bottom:6px;list-style:none}
.lzf-social{display:flex;gap:12px;margin-top:16px}
.lzf-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .25s}
.lzf-social a:hover{background:var(--brand)}.lzf-social svg{width:18px;height:18px;fill:currentColor}
.lzf-bottom{border-top:1px solid var(--foot-line);margin-top:40px;padding:20px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--faint)}
.lzf-bottom a{color:var(--faint)}
.lzf-note{color:var(--accent)}

/* ---------- КОРАЛЛ вместо зелёного/навблю (де-medshtab) ---------- */
.btn-green{background:var(--accent)!important;color:#fff!important}
.btn-green:hover{background:var(--accent-dk)!important}
.nav-cta{background:var(--accent)!important;color:#fff!important}
.qz-result-bar,.hero-tag{--x:0}
.midcta{background:linear-gradient(135deg,#2e9dd1,#2681ab)!important}
.qz-sent-ico{background:var(--brand)!important}

/* ---------- адаптив ---------- */
@media(max-width:1023px){:root{--head-h:118px}}
/* 950px — единый брейкпоинт мобильной шапки с clone/assets/theme.css:337 */
/* 1199px: единый брейкпоинт с clone/assets/theme.css — ниже него меню не влезает вместе с CTA. */
@media(max-width:1199px){
  :root{--head-h:64px}
  .lzx-row{min-height:64px}
  .lzx-phone,.lzx-right,.lzx-menuwrap{display:none}
  .lzx-burger{display:flex}
  .lzx-logo img{height:38px}
  .lzx-mobile{display:block;position:fixed;top:64px;left:0;right:0;bottom:0;z-index:290;background:#fff;overflow-y:auto;padding:12px 0;transform:translateX(-100%);transition:transform .25s;box-shadow:var(--shadow)}
  .lzx-mobile.open{transform:translateX(0)}
  .lzx-mobile a{display:block;padding:12px 24px;color:var(--text);font-weight:500;border-bottom:1px solid var(--line-2)}
  .lzx-mobile .m-sub a{padding-left:40px;font-weight:400;font-size:14px;color:var(--muted)}
  .lzf-grid{grid-template-columns:1fr}
  .lzf-cities{columns:1}
}

/* ============================================================
   ОБЩИЙ СТРАЖ: атрибут hidden должен побеждать любое display.
   У браузера [hidden]{display:none} задано с нулевой специфичностью,
   поэтому ЛЮБОЕ наше правило вида .foo{display:flex} его перебивает,
   и элемент, помеченный hidden, продолжает висеть на экране.
   На этих граблях мы уже трижды: cookie-баннер, фильтр каталога курсов,
   окно на выходе. Правило ниже закрывает класс целиком.
   ============================================================ */
[hidden]{display:none!important}

/* ============================================================
   Кнопка связи в правом нижнем углу (см. partials/contact-fab.html.j2).
   Заменяет снятые виджеты Битрикс24 / Verbox / обратного звонка одним входом.
   Ничего не всплывает само — раскрытие только по нажатию.
   Блок дословно повторяет хвост clone/assets/theme.css — правки вносить в оба
   файла сразу, иначе кнопка станет разной на клоне и в разделе.

   z-index 150 выбран между липкими панелями снизу (.svc-bar 120, .ms-sticky 49)
   и мобильным меню (.lzx-mobile, 290): кнопка перекрывает панель, но уходит под
   открытое меню, шапку (300), баннер cookie (400) и окно на выходе (9998).

   Цвета блок берёт переменными, и часть из них в кластере не объявлена —
   работают запасные значения, это НЕ недосмотр:
     --brand-btn  нет -> --brand-dk (#124f66), белый текст 9:1;
     --accent-btn нет -> #c94f36 из клона. Фирменный коралл --accent (#fc6b4f)
       здесь намеренно не используется: с белым текстом он даёт 2,86:1 при
       норме 4,5:1, а это главное действие панели.
   ============================================================ */
/* column-reverse: в разметке кнопка идёт ПЕРЕД панелью (иначе Tab с кнопки
   уходит мимо панели, и попасть в неё можно только Shift+Tab), а на экране
   панель должна раскрываться НАД кнопкой.
   pointer-events на самой рамке выключены навсегда: рамка занимает высоту
   вместе со свёрнутой панелью, и без этого невидимый прямоугольник ~270x280
   перехватывал бы клики по странице в правом нижнем углу. */
.lzc{position:fixed;right:20px;bottom:calc(20px + var(--lzc-lift,0px));z-index:150;
  display:flex;flex-direction:column-reverse;align-items:flex-end;
  opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none;
  transition:opacity .28s var(--ease,ease),transform .28s var(--ease,ease),
             visibility .28s,bottom .2s ease}
.lzc-btn,.lzc-panel{pointer-events:auto}
/* класс вешает скрипт после прокрутки первого экрана */
.lzc-on{opacity:1;visibility:visible;transform:none}

.lzc-panel{width:292px;max-width:calc(100vw - 40px);margin:0 0 10px;overflow:hidden;
  background:#fff;border:1px solid var(--line,#e5e5e5);border-radius:3px;
  box-shadow:0 14px 34px rgba(20,40,60,.16);
  opacity:0;visibility:hidden;transform:translateY(6px) scale(.98);transform-origin:100% 100%;
  transition:opacity .18s ease,transform .18s ease,visibility .18s}
.lzc-open .lzc-panel{opacity:1;visibility:visible;transform:none}

.lzc-cap{margin:0;padding:9px 13px 8px;font-size:12px;line-height:1.35;
  color:var(--soft,#878787);border-bottom:1px solid var(--line-2,#ebecec)}

/* строка панели: одна и та же раскладка у ссылки и у кнопки */
.lzc-item{display:flex;align-items:center;gap:11px;width:100%;
  padding:11px 13px;border:0;border-radius:0;background:none;cursor:pointer;
  font-family:inherit;text-align:left;text-decoration:none;color:var(--text,#191919);
  transition:background .15s ease}
.lzc-item+.lzc-item{border-top:1px solid var(--line-2,#ebecec)}
.lzc-item svg{flex:none;color:var(--brand,#2e9dd1)}
.lzc-item:hover{background:var(--brand-tint,#ebf4f9);color:var(--text,#191919)}
.lzc-txt{display:block;min-width:0}
/* Раздельные свойства вместо сокращения font: в сокращении подстановка
   var(--head,inherit) при незаданном --head даёт «font:600 15px/1.25 inherit»,
   а это недопустимая запись — браузер снимает объявление целиком. */
.lzc-txt b{display:block;font-family:var(--head,inherit);font-weight:600;
  font-size:15px;line-height:1.25;color:inherit}
.lzc-txt i{display:block;font-style:normal;font-size:12.5px;line-height:1.35;
  color:var(--muted,#494949)}

/* главное действие панели — заливкой, остальные строки остаются тихими */
.lzc-go{background:var(--accent-btn,#c94f36);color:#fff;border-top:0}
.lzc-go svg{color:#fff}
.lzc-go .lzc-txt i{color:rgba(255,255,255,.86)}
.lzc-go:hover{background:var(--accent-btn-h,#b34329);color:#fff}

/* свёрнутое состояние: иконка + одно слово, высота под палец */
/* Цвет заливки: в клоне задан --brand-btn (тёмный аква под белый текст, 5,6:1),
   в разделе /licenzirovanie/ такой переменной нет — там берётся --brand-dk. */
.lzc-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 15px;
  border:0;border-radius:3px;cursor:pointer;
  background:var(--brand-btn,var(--brand-dk,#1f6f92));color:#fff;
  font-family:var(--head,inherit);font-weight:600;font-size:14px;line-height:1;
  box-shadow:0 6px 18px rgba(20,40,60,.22);
  transition:background .2s ease}
.lzc-btn:hover{background:var(--brand-btn-h,var(--brand,#1a627f))}
.lzc-btn svg{flex:none}

@media(max-width:560px){
  .lzc{right:12px;bottom:calc(12px + var(--lzc-lift,0px))}
  .lzc-panel{width:min(292px,calc(100vw - 24px))}
}
@media(prefers-reduced-motion:reduce){
  .lzc,.lzc-panel{transition-duration:.01ms}
}

/* --- подарочная плашка «сайт-визитка» под шапкой -------------------------
   Один в один с клоном (clone/assets/theme.css): на выкате кластер лежит
   внутри того же docroot, посетитель ходит между /licenzirovanie/ и
   /services/ и не должен видеть, что это две сборки.
   Радиус 4px тоже взят из клона — намеренно, ради совпадения плашек;
   если менять, то в обоих файлах сразу.
   Переменные берутся из общей цепочки: --brand-tint и --accent из :root
   выше, --text и --brand-dk — из site.css/premium.css. */
.gift-strip{display:block;background:var(--brand-tint);border-bottom:1px solid #d5e6f0;
  color:var(--text);text-align:center;padding:10px 16px;font-size:14px;line-height:1.4}
.gift-strip:hover{background:#e2eff7;color:var(--text)}
.gift-strip b{color:var(--brand-dk);font-weight:600}
.gift-badge{display:inline-block;background:var(--accent);color:#fff;font-weight:700;
  font-size:11px;padding:2px 8px;border-radius:4px;margin-right:8px;
  text-transform:uppercase;letter-spacing:.03em;vertical-align:middle}
@media (max-width:640px){
  .gift-strip{font-size:13px}
}

/* Пока панель РАСКРЫТА, она поднимается над баннером cookie (400): баннер
   появляется с задержкой ~0,6 с и накрывал открытую панель на мобильном —
   человек, уже нажавший «Связаться», терял из виду телефон. В свёрнутом
   состоянии приоритет прежний (150), и баннер по-прежнему выше кнопки. */
.lzc.lzc-open{z-index:450}