/* ════════════════════════════════════════════════════════════════
   КДС Клиник — Header CSS
   Структура:
     header_top_center
       header_top_top        (лого + мобильные иконки)
       header_top_right      (телефон / адрес / поиск / кнопка)
       header_left_top       (навигация; JS переносит внутрь
                              header_top_right на мобиле)
   ════════════════════════════════════════════════════════════════ */

/* ─── Переменные ────────────────────────────────────────────────── */
:root {
  --c-accent:        #f84b50;
  --c-accent-dk:     #dc4550;
  --c-accent-grad:   linear-gradient(135deg, #dc4550 0%, #dd752d 100%);
  --c-accent-hover:  #e03237;
  --c-text:          #1a1a1a;
  --c-text-soft: #373737;
  --c-border:        #ebebeb;
  --c-topbar-bg: #fff7ef;
  --c-topbar-border: #ffe0c5;
  --c-panel-shadow:  0 12px 40px rgba(0,0,0,.13), 0 2px 8px rgba(0,0,0,.06);
  --h-desktop:       115px; /* header_top ≈ 65px + header_left_top ≈ 50px */
  --h-mobile:        60px;
  --radius: 6px;
  --transition:      .18s ease;
}

/* ─── Сброс наследования body ───────────────────────────────────── */
body {
  padding-top: var(--h-desktop);
}
body.kdc-nav-open {
  overflow: hidden;
}


/* ══════════════════════════════════════════════════════════════════
   1. ОБЁРТКА ХЕДЕРА
   ══════════════════════════════════════════════════════════════════ */
.header {
  position: fixed;
  top: 0; left: 0; width: 100%;
  z-index: 9000;
  background: #fff;
  box-shadow: 0 1px 0 var(--c-border), 0 4px 16px rgba(0,0,0,.05);
  transition: transform .25s ease, box-shadow .25s ease;
}
.header.header_hidden {
  transform: translateY(-100%);
}
/* Тень усиливается при открытой мобильной шторке */
.header.is-nav-open {
  box-shadow: none;
}


/* ══════════════════════════════════════════════════════════════════
   2. ВЕРХНЯЯ ПОЛОСА (персиковый фон)
   ══════════════════════════════════════════════════════════════════ */
.header_top {
  background: var(--c-topbar-bg);
  border-bottom: 4px solid #fbeee1;
}

/* Внешний flex-контейнер — лого-строка + правая часть + навигация */
.header_top_center {
  display: flex;
  flex-wrap: wrap;           /* навигация переносится на след. строку */
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5%;
}


/* ══════════════════════════════════════════════════════════════════
   3. ЛОГО-СТРОКА (header_top_top)
      Содержит: лого слева + мобильные иконки справа (скрыты на desktop)
   ══════════════════════════════════════════════════════════════════ */
.header_top_top {
  display: flex;
  align-items: center;
  flex: 0 0 auto;          /* не растягивается — лого занимает ровно свою ширину */
  padding: 3px 0;
  width: 100%;
}

/* Логотип */
.header-item-left {
  display: flex;
  align-items: center;
}
.brand {
  display: inline-flex;
  text-decoration: none;
}
.brand img {
  width: 141px;
  height: auto;
  display: block;
}
.log_top_name,
.log_top {
  display: flex;
  align-items: center;
}

/* Мобильные иконки — скрыты на desktop */
.kdc-mobile-actions {
  display: none;
}
.kdc-mobile-icon {
  display: none;
}
.kdc-burger {
  display: none;
}


/* ══════════════════════════════════════════════════════════════════
   4. ПРАВАЯ ЧАСТЬ ХЕДЕРА (телефон / адрес / поиск / кнопка)
   ══════════════════════════════════════════════════════════════════ */
.header_top_right {
  display: flex;
  align-items: center;
  flex: 1 1 0;             /* занимает всё оставшееся место в строке */
  min-width: 0;
  gap: 24px;
  padding: 7px 0 7px 32px;
}

/* Блок «телефон + слоган» */
.header_left_bottom {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  flex: 1 1 auto;
  min-width: 0;
}
.header_left_first {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
}
.header_left_first p {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--c-text);
  cursor: pointer;
  transition: color var(--transition);
}
.header_left_first p:hover {
  color: var(--c-accent);
}

.lozung {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--c-text-soft);
  white-space: nowrap;
  margin-top: 1px;
  justify-content: center;
}
.lozung svg {
  width: 14px;
  fill: currentColor;
  color: #ed7817;
}

/* Адрес */
.locations_kdc {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 1 auto;
  min-width: 0;
  width: 225px;
}
.locations_kdc_icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #c3273a;
}
.locations_kdc_icon img {
  width: 18px; height: 18px;
}
.con_kdc_big {
  min-width: 0;
}
.con_kdc_big_top {
  display: block;
  font-size: 13px;
  line-height: 1.35;
  color: var(--c-text);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color var(--transition);
}
.con_kdc_big_top:hover {
  color: var(--c-accent);
}

/* Поиск */
.header-item-left_mix {
  flex: 1 1 220px;
  min-width: 40%;
}
.header-search.search-catalog__block {
  display: flex;
  align-items: center;
  width: 100%;
  height: 41px;
  border: 1.5px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  position: relative;
  transition: border-color var(--transition);
}
.header-search.search-catalog__block:focus-within {
  border-color: #ff616c;
  /* box-shadow: 0 0 0 3px rgba(248,75,80,.1); */
}
.search_input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  padding: 1px 10px 0 14px;
  border: none;
  outline: none;
  font-size: 14px;
  color: var(--c-text);
  background: transparent;
}
.search_input::placeholder {
  color: #b0b0b0;
}
.header-search__voice-btn,
.header-search__search-submit-btn,
.search-catalog__btn {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 39px;
  height: 100%;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  color: #999;
  transition: color var(--transition);
}
.header-search__voice-btn:hover,
.header-search__search-submit-btn:hover {
  color: var(--c-accent);
}
.search_five_res {
  position: absolute;
  top: calc(100% + 6px);
  left: 0; right: 0;
  z-index: 200;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--c-panel-shadow);
}

/* На мобиле — результаты поиска как полноэкранный оверлей под шапкой.
   :not(:empty) срабатывает только когда JS вставил контент.
   Никакого JS не нужно — чистый CSS. */
@media (max-width: 1200px) {
  .search_five_res:not(:empty) {
    position: fixed;
    top: var(--h-mobile);
    left: 0; right: 0; bottom: 0;
    z-index: 2500;         /* выше панели навигации (2000) и иконок (2100) */
    border-radius: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 -1px 0 var(--c-border);
    /* плавное появление */
    animation: search-fade-in .15s ease both;
  }
  @keyframes search-fade-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
  }
}

.head_call_header {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 24px;
  font-size: 13.5px;
  line-height: 1;
  color: #fff;
  white-space: nowrap;
  border: none;
  border-radius: var(--radius);
  background: var(--c-accent-grad);
  cursor: pointer;
  transition: filter var(--transition), transform .1s ease;
}
.head_call_header:hover {
  filter: brightness(1.06);
}
.head_call_header:active {
  transform: scale(.98);
}


/* ══════════════════════════════════════════════════════════════════
   5. НИЖНЯЯ СТРОКА НАВИГАЦИИ (header_left_top)
   ══════════════════════════════════════════════════════════════════ */
.header_left_top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  width: 100%;                /* перенос строки от flex-wrap в header_top_center */
  padding: 0 0 0;
  /* border-top: 1px solid rgb(255 224 197 / 43%); */
}
.sale_point {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
}
.head_client_kdc_right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
}

/* Ссылки навигации */
.menu_link_top {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 13px 13px;
  font-size: 14.5px;
  color: var(--c-text);
  white-space: nowrap;
  text-decoration: none;
  transition: color var(--transition), background var(--transition);
  border-radius: 0;
}
.menu_link_top:hover {
  color: var(--c-accent);
  background: rgba(248,75,80,.05);
  border-radius: 8px 8px 0 0;
}
.menu_link_top.spec_mol img {
  width: 18px; height: 18px;
}
.menu_link_top.video_sec {
  padding-left: 43px;
}
.video_icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #c3273a;
}
.video_icon::before {
  content: '';
  position: absolute;
  left: 7px; top: 5px;
  border: 4px solid transparent;
  border-left: 6px solid #fff;
}
.rev_kdc { position: relative; }
.rev_kdc i {
}
button.kdc-hovermenu__close-x {
    display: none;
}

/* ══════════════════════════════════════════════════════════════════
   6. ТУЛТИПЫ «О клинике» / «Пациентам»
   ══════════════════════════════════════════════════════════════════ */
.head_client {
  position: relative;
}
.client_block {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 16px;
  font-size: 14.5px;
  color: var(--c-text);
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--transition), background var(--transition);
}
.client_block:hover {
  color: var(--c-accent);
  background: rgba(248,75,80,.05);
  border-radius: 8px 8px 0 0;
}
.client_block .icon-svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
  opacity: .6;
  transition: transform .2s ease;
}
.head_client:hover .icon-svg {
  transform: rotate(180deg);
}

/* Выпадающий тултип */
.navbar-pc__tooltip.tooltip-simple {
  position: absolute;
  top: calc(100% + 0px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 500;
  padding-top: 0;
  display: none;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease;
}
.head_client:hover .navbar-pc__tooltip.tooltip-simple {
  display: block;
  pointer-events: auto;
  opacity: 1;
}
.tooltip-arrow {
  display: block;
  width: 21px;
  height: 8px;
  left: 3%;
  position: relative;
  margin: 0 auto;
  overflow: visible;
  transform: translate(-50%) rotate(
180deg);
}
.tooltip-arrow path {
  fill: #fff;
  filter: drop-shadow(0 -2px 3px rgba(0,0,0,.08));
}
.tooltip__content {
  position: relative;
  width: 230px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  overflow: hidden;
}
.profile-menu {
  list-style: none;
  margin: 0;
  padding: 4px 0;
}
.client_info {
  border-bottom: 1px solid rgba(235,235,235,.8);
}
.client_info:last-child {
  border-bottom: none;
}
.client_info_title {
  display: flex;
  padding: 11px 16px;
  font-size: 13.5px;
  color: var(--c-text);
  text-decoration: none;
  transition: color var(--transition), background var(--transition);
}
.client_info_title:hover {
  background: #fdf1f1;
  color: var(--c-accent);
}
/* Кнопка «Назад» в мобильной под-панели — скрыта на desktop */
.kdc-client-panel__back {
  display: none;
}


/* ══════════════════════════════════════════════════════════════════
   7. HOVER-МЕГАМЕНЮ «Все услуги»
   ══════════════════════════════════════════════════════════════════ */
.kdc-hovermenu {
  position: relative;
  display: inline-flex;
}
.kdc-hovermenu__trigger {
  position: relative;
  z-index: 1001;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 13px 22px;
  font-size: 14.5px;
  border-radius: 8px 8px 0 0;
  background: #fbeee1;
  color: var(--c-text);
  text-decoration: none;
  transition: color var(--transition), background var(--transition);
}
.kdc-hovermenu.is-open .kdc-hovermenu__trigger {
  background: #fff;
  color: var(--c-text);
  border-radius: 8px 8px 0 0;
  box-shadow: 0 -2px 0 0 #fff inset;
}

/* Панель мегаменю */
.kdc-hovermenu__panel {
  position: fixed;
  left: 0; right: 0; top: 0;
  z-index: 1000;
  background: #fff;
  box-shadow: var(--c-panel-shadow);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  pointer-events: none;
}
.kdc-hovermenu__panel.is-open {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  margin-top: -5px;
}
.kdc-hovermenu__panel-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5%;
}
.kdc-hovermenu__viewport {
  overflow: hidden;
  transition: height .22s ease;
}
.kdc-hovermenu__cols {
  display: flex;
  align-items: stretch;
}

/* Колонки */
.kdc-hovermenu__col {
  width: 310px;
  flex: 0 0 310px;
  max-height: 72vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 12px 0;
  border-right: 1px solid var(--c-border);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .15s ease, transform .15s ease;
  scrollbar-width: thin;
  scrollbar-color: #e0e0e0 transparent;
}
.kdc-hovermenu__col.is-visible {
  opacity: 1;
  transform: none;
}
.kdc-hovermenu__col:last-child { border-right: none; }

/* Внутреннее содержимое колонки */
.kdc-hovermenu__col-inner {
  opacity: 1;
  min-height: 60px;
  transition: opacity .12s ease;
}
.kdc-hovermenu__col-inner.is-swapping { opacity: 0; }
.kdc-hovermenu__col-inner--loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
}
.kdc-hovermenu__spinner {
  width: 22px; height: 22px;
  border: 2.5px solid var(--c-border);
  border-top-color: var(--c-accent);
  border-radius: 50%;
  animation: kdc-spin .7s linear infinite;
}
@keyframes kdc-spin { to { transform: rotate(360deg); } }
.kdc-hovermenu__empty {
  padding: 14px 20px;
  color: #aaa;
  font-size: 13px;
}

/* Строка пункта (ссылка + стрелка-кнопка рядом) */
.kdc-hovermenu__row {
  display: flex;
  flex-direction: column;
}
.kdc-hovermenu__row-top {
  display: flex;
  align-items: stretch;
}
.kdc-hovermenu__row-top:hover .kdc-hovermenu__item {
  /* background: #fdf1f1; */
  color: var(--c-accent);
}
.kdc-hovermenu__row-top:hover .kdc-hovermenu__item-arrow {
  color: var(--c-accent);
}

/* Ссылка */
.kdc-hovermenu__item {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 10px 16px 10px 20px;
  color: var(--c-text);
  font-size: 14.5px !important;
  line-height: 1.35;
  text-decoration: none;
  white-space: normal !important;
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
}
.kdc-hovermenu__item-text { flex: 1 1 auto; }

/* Кнопка-стрелка (отдельный элемент — тап по ней раскрывает, тап по ссылке переходит) */
.kdc-hovermenu__item-arrow-btn {
  flex: 0 0 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  cursor: pointer;
  color: #c0c0c0;
  transition: color var(--transition), background var(--transition);
}
.kdc-hovermenu__item-arrow-btn:hover {
  color: var(--c-accent);
  background: #fdf1f1;
}
.kdc-hovermenu__item-arrow {
  display: inline-flex;
  transition: transform .18s ease, color .12s ease;
}
.kdc-hovermenu__item-arrow--down { transform: rotate(90deg); }
.kdc-hovermenu__row.is-sub-open .kdc-hovermenu__item-arrow--down { transform: rotate(-90deg); }

/* Состояния active (текущий путь) */
.kdc-hovermenu__item.is-active {
  background: #fdf1f1;
  color: var(--c-accent);
}
.kdc-hovermenu__item.is-active + .kdc-hovermenu__item-arrow-btn,
.kdc-hovermenu__item.is-active ~ .kdc-hovermenu__item-arrow-btn {
  color: var(--c-accent);
}

/* Подменю 5-го уровня — выезжает вниз */
.kdc-hovermenu__submenu {
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  background: #faf8f6;
  transition: grid-template-rows .2s ease;
}
.kdc-hovermenu__submenu > div {
  overflow: hidden;
  opacity: 0;
  transition: opacity .2s ease .04s;
}
.kdc-hovermenu__row.is-sub-open .kdc-hovermenu__submenu { grid-template-rows: 1fr; }
.kdc-hovermenu__row.is-sub-open .kdc-hovermenu__submenu > div { opacity: 1; }

.kdc-hovermenu__subitem {
  display: block;
  padding: 8px 20px 8px 38px;
  font-size: 13px !important;
  color: #555;
  text-decoration: none;
  position: relative;
  transition: background var(--transition), color var(--transition);
}
.kdc-hovermenu__subitem::before {
  content: '';
  position: absolute;
  left: 22px; top: 50%;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-50%);
  opacity: .5;
}
.kdc-hovermenu__subitem:hover { background: #fdf1f1; color: var(--c-accent); }

/* Иконка бургера в триггере «Все услуги» */
.kdc-hovermenu__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px; height: 15px;
}
.kdc-hovermenu__icon-burger {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  justify-content: center; gap: 3px;
  transition: opacity .15s ease, transform .15s ease;
}
.kdc-hovermenu__icon-burger span {
  display: block;
  height: 2px; width: 100%;
  background: currentColor;
  border-radius: 1px;
}
.kdc-hovermenu__icon-arrow {
  position: absolute; inset: 0;
  opacity: 0;
  transform: translateY(-3px) scale(.8);
  transition: opacity .15s ease, transform .15s ease;
}
.kdc-hovermenu.is-open .kdc-hovermenu__icon-burger {
  opacity: 0; transform: translateY(3px) scale(.8);
}
.kdc-hovermenu.is-open .kdc-hovermenu__icon-arrow {
  opacity: 1; transform: none;
  width: 18px; height: 18px;
}

/* Кнопка «Назад»/«Закрыть» в drilldown — скрыта на desktop */
.kdc-hovermenu__back { display: none; }


/* ══════════════════════════════════════════════════════════════════
   8. ПЛАНШЕТ (≤1280px / ≤1100px)
   ══════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════════
   8. ПЛАНШЕТ / СРЕДНИЕ МОНИТОРЫ (1201px–1400px)
      На 1201px+ показываем полный desktop header.
      При сужении окна прячем адрес и сжимаем поиск.
   ══════════════════════════════════════════════════════════════════ */

/* ─ Десктопный фикс против style.css ─────────────────────────────
   style.css задаёт .header_top_right { width:100% }
   и .header_top_center { flex-wrap:wrap } — из-за этого лого
   и правый блок оказывались на разных строках. Перебиваем здесь
   через !important только на десктопе (≥1201px).              */
@media (min-width: 1201px) {
  .header_top_center  {}
  .header-item-left   { flex: 0 0 auto !important; width: auto !important; }
  .header_top_right   {flex: 1 1 0 !important;width: auto !important;}
  .header_left_bottom { width: auto !important; flex-wrap: nowrap; }
}
@media (max-width: 1400px) {
  .locations_kdc { display: none; }
  .header-item-left_mix { flex-basis: 200px; }
  .kdc-hovermenu__col {width: 290px;flex: 0 0 290px;}
  
}
@media (max-width: 1320px) {
  .brand img {width: 120px;}
  .header_left_first p { font-size: 17px; }
  .header_top_right {gap: 14px;padding-left: 16px;}
  .menu_link_top,
  .client_block,
  .kdc-hovermenu__trigger {font-size: 13px;padding: 11px 14px;background: none;}
}



/* ══════════════════════════════════════════════════════════════════
   9. МОБИЛЬНЫЙ ХЕДЕР (≤1200px)
   header_top_top: всегда виден — лого слева + иконки справа.
   Шторка и поиск — отдельные элементы kd-drawer / kd-search.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  :root  {--h-mobile: 54px;}
  body   { padding-top: var(--h-mobile); }

  /* Хедер: только полоса с логотипом + иконками */
  .header_top {
    border-bottom: none;
    box-shadow: 0 1px 0 var(--c-border);
  }
  .header_top_center {
    flex-wrap: nowrap;
    padding: 0;
  }

  /* Полоса лого+иконки — всегда поверх всего */
  .header_top_top {
    width: 100%;
    flex: 0 0 auto;
    justify-content: space-between;
    padding: 0 14px 0 14px;
    min-height: var(--h-mobile);
    background: var(--c-topbar-bg);
    border-bottom: 1px solid var(--c-topbar-border);
    position: relative;
    z-index: 4100;  /* выше kd-drawer(4000) и kd-search(4000) */
  }
  .brand img {width: 100px;}

  /* Иконки: телефон, поиск, бургер */
  .kdc-mobile-actions {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .kdc-mobile-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 8px;
    background: none;
    color: var(--c-text);
    cursor: pointer;
    transition: background var(--transition), color var(--transition);
    text-decoration: none;
    background: #f6e7dac4;
    border-radius: 33px;
  }
  .kdc-mobile-icon:hover {/* background: rgba(0,0,0,.06); */}
  .kdc-mobile-icon svg   {width: 22px;height: 22px;color: #824e26;}
  .header.is-nav-open .kdc-mobile-icon--search { color: var(--c-accent); }

  /* Бургер → крестик */
  .kdc-burger {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: none;
    cursor: pointer;
    transition: background var(--transition);
  }
  .kdc-burger:hover {/* background: rgb(249 227 207); */}
  .kdc-burger span {
    display: block;
    width: 25px;
    height: 2px;
    background: var(--c-text);
    border-radius: 2px;
    transition: transform .22s ease, opacity .22s ease;
  }
  .header.is-nav-open .kdc-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg);  }
  .header.is-nav-open .kdc-burger span:nth-child(2) { opacity: 0; transform: scaleX(0);          }
  .header.is-nav-open .kdc-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg);}

  /* Скрываем старые блоки header_top_right / header_left_top:
     на мобиле весь их контент живёт в kd-drawer */
  .header_top_right,
  .header_left_top {
    display: none !important;
  }

  /* Затемнение фона при открытой шторке */
  .header::before {
    content: '';
    position: fixed; inset: 0;
    background: rgba(0,0,0,.45);
    opacity: 0; visibility: hidden;
    transition: opacity .28s ease, visibility .28s;
    z-index: 3900;
  }
  .header.is-nav-open::before { opacity: 1; visibility: visible; }

  /* Стопим скролл страницы */
  body.kdc-nav-open { overflow: hidden; }

  /* hover-мегаменю на мобиле — drilldown на весь экран */
  .kdc-hovermenu__panel {
    display: block;
    position: fixed;
    top: 0 !important; left: 0; right: 0; bottom: 0;
    height: 100dvh;
    z-index: 5000;
    margin-top: 0 !important;
    box-shadow: none;
  }
  .kdc-hovermenu__panel-inner { max-width: none; padding: 0; height: 100%; }
  .kdc-hovermenu__viewport { height: 100% !important; overflow: hidden; }
  .kdc-hovermenu__cols { height: 100%; position: relative; }
  .kdc-hovermenu__col {
    display: none; flex-direction: column;
    width: 100%; flex: 0 0 100%;
    max-height: none; height: 100%;
    border-right: none; padding: 0;
    transform: translateX(24px); opacity: 0;
    transition: opacity .22s ease, transform .22s ease;
  }
  .kdc-hovermenu__col:last-child { display: flex; }
  .kdc-hovermenu__col.is-visible { transform: none; opacity: 1; }
  /* Анимация ухода при «Назад» — уезжает вправо и гаснет */
  .kdc-hovermenu__col.is-leaving {
    transform: translateX(100%) !important;
    opacity: 0 !important;
    pointer-events: none;
    /* Это :last-child, поэтому display:flex — оставляем, но анимируем */
  }
  .kdc-hovermenu__col-inner {
    flex: 1 1 auto; overflow-y: auto;
    -webkit-overflow-scrolling: touch; padding: 0;
  }
  .kdc-hovermenu__row-top { border-bottom: 1px solid var(--c-border); }
  .kdc-hovermenu__item    {padding: 15px 16px 15px 20px;font-size: 15.5px !important;}
  .kdc-hovermenu__item-arrow-btn { flex: 0 0 52px; border-left: 1px solid var(--c-border); }

  /* Полоса навигации: «← Назад/Закрыть» слева + ✕ справа */
  .kdc-hovermenu__back-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 0 0 auto;
    background: var(--c-topbar-bg);
    border-bottom: 1px solid var(--c-border);
  }
  .kdc-hovermenu__back {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 15px 16px;
    flex: 1 1 auto;
    border: none;
    background: none;
    font-size: 15px;
    color: var(--c-text);
    cursor: pointer;
    text-align: left;
  }
  .kdc-hovermenu__back svg {flex: 0 0 auto;color: #000;}
  .kdc-hovermenu__back--close {
    color: var(--c-text-soft);
    font-weight: 400;
  }
  /* X кнопка — закрывает всё меню услуг */
  .kdc-hovermenu__close-x {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    height: 52px;
    border: none;
    border-left: 1px solid var(--c-border);
    background: none;
    color: #4f4f4f;
    cursor: pointer;
    transition: color var(--transition), background var(--transition);
  }
  .kdc-hovermenu__close-x:hover { color: var(--c-accent); background: #fdf1f1; }
}


/* ══════════════════════════════════════════════════════════════════
   10. МОБИЛЬНАЯ ШТОРКА НАВИГАЦИИ  .kd-drawer
   ══════════════════════════════════════════════════════════════════ */
.kd-drawer { display: none; } /* desktop */

@media (max-width: 1200px) {
  .kd-drawer {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: min(300px, 88vw);
    height: 100dvh;
    background: #fff;
    z-index: 4000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-top: var(--h-mobile);
    /* box-shadow: -12px 0 48px rgba(0,0,0,.18); */
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.25,.46,.45,.94);
  }
  .kd-drawer.is-open { transform: none; }

  /* Контакты */
  .kd-drawer__contacts {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 13px 20px 16px;
    background: var(--c-topbar-bg);
    border-bottom: 1px solid var(--c-topbar-border);
  }
  .kd-drawer__phone {
    font-size: 19px;
    color: var(--c-text);
    text-decoration: none;
    transition: color var(--transition);
    font-family: Montserrat-Bold, "Helvetica Neue", Arial, sans-serif;
  }
  .kd-drawer__phone:hover { color: var(--c-accent); }
  .kd-drawer__hours {
    font-size: 12px;
    color: var(--c-text-soft);
  }
  .kd-drawer__address {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: var(--c-text-soft);
    text-decoration: none;
    line-height: 18px;
    margin-bottom: 8px;
  }
  .kd-drawer__address img {flex: 0 0 auto;margin-top: 2px;background: #dd5942;width: 33px;height: 33px;border-radius: 50px;padding: 8px;}
  .kd-drawer__cta {
    width: 100%;
    padding: 13px;
    font-size: 14px;
    color: #fff;
    border: none;
    border-radius: var(--radius);
    background: var(--c-accent-grad);
    cursor: pointer;
    transition: filter var(--transition), transform .1s ease;
  }
  .kd-drawer__cta:hover   { filter: brightness(1.06); }
  .kd-drawer__cta:active  { transform: scale(.98); }

  /* Навигация */
  .kd-drawer__nav {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 0px 0 0px;
  }

  /* Кнопка «Все услуги клиники» */
  .kd-drawer__svc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 14px 20px;
    font-size: 15px;
    /* color: #df272f; */
    background: rgb(255 238 238);
    border: none;
    border-bottom: 1px solid var(--c-border);
    cursor: pointer;
    transition: background var(--transition);
  }
  .kd-drawer__svc:hover { background: rgba(248,75,80,.12); }
  .kd-drawer__svc svg   {color: #444444;flex: 0 0 auto;}

  /* Ссылки навигации */
  .kd-drawer__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 14px 20px;
    font-size: 15px;
    color: var(--c-text);
    text-decoration: none;
    border: none;
    border-bottom: 1px solid var(--c-border);
    background: none;
    cursor: pointer;
    transition: color var(--transition), background var(--transition);
  }
  .kd-drawer__link:hover { color: var(--c-accent); background: rgba(248,75,80,.04); }
  .kd-drawer__link sup   {}
  .kd-drawer__link svg   {color: #8c8c8c;transition: transform .22s ease, color var(--transition);flex: 0 0 auto;}

  /* Видео врачей — красная точка-иконка */
  .kd-drawer__link--video {gap: 8px;display: flex;justify-content: flex-start;}
  .kd-drawer__vdot {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--c-accent-dk);
    /* box-shadow: 0 4px 12px rgba(220,69,80,.3); */
    position: relative;
  }
  .kd-drawer__vdot::before {
    content: '';
    position: absolute;
    left: 7px; top: 5px;
    border: 4px solid transparent;
    border-left: 6px solid #fff;
  }

  /* Аккордеон «О клинике» / «Пациентам» */
  .kd-drawer__link--exp svg { transition: transform .22s ease; }
  .kd-drawer__group.is-open .kd-drawer__link--exp svg { transform: rotate(180deg); color: var(--c-accent); }
  .kd-drawer__group.is-open .kd-drawer__link--exp { color: var(--c-accent); }

  .kd-drawer__sub {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows .26s ease;
    background: #fafafa;
  }
  .kd-drawer__group.is-open .kd-drawer__sub { grid-template-rows: 1fr; }
  /* Обязательный inner-div для корректной работы grid 0fr→1fr trick */
  .kd-drawer__sub > div { overflow: hidden; }
  .kd-drawer__sub-link {
    display: block;
    padding: 12px 20px 12px 32px;
    font-size: 14px;
    color: var(--c-text-soft);
    text-decoration: none;
    border-bottom: 1px solid var(--c-border);
    transition: color var(--transition), background var(--transition);
    position: relative;
  }
  .kd-drawer__sub-link::before {
    content: '';
    position: absolute;
    left: 20px; top: 50%;
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--c-accent);
    opacity: .5;
    transform: translateY(-50%);
  }
  .kd-drawer__sub-link:hover { color: var(--c-accent); background: #fdf1f1; }

  /* Отступ снизу под нижнее меню */
  body { padding-bottom: 62px; }
  .kd-drawer { padding-bottom: 62px; }
}


/* ══════════════════════════════════════════════════════════════════
   11. МОБИЛЬНЫЙ ОВЕРЛЕЙ ПОИСКА  .kd-search
   Поиск вверху, результаты снизу — как Google/Яндекс.
   ══════════════════════════════════════════════════════════════════ */
.kd-search { display: none; } /* desktop */

@media (max-width: 1200px) {
  .kd-search {
    display: flex;
    flex-direction: column;
    position: fixed;
    inset: 0;
    z-index: 4500;
    background: #fff;
    transform: translateY(-100%);
    opacity: 0;
    transition: transform .26s cubic-bezier(.25,.46,.45,.94), opacity .26s ease;
    pointer-events: none;
  }
  .kd-search.is-open {
    transform: none;
    opacity: 1;
    pointer-events: auto;
  }

  /* Верхняя полоса: «←» + поисковый блок */
  .kd-search__bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: var(--c-topbar-bg);
    border-bottom: 1px solid #fde9d8;
    flex: 0 0 auto;
  }
  .kd-search__back {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px; height: 40px;
    border: none; border-radius: 8px;
    background: none;
    color: var(--c-text);
    cursor: pointer;
    transition: background var(--transition);
  }
  .kd-search__back:hover { background: rgba(0,0,0,.06); }

  /* Слот — занимает всё оставшееся место справа от кнопки «←» */
  .kd-search__slot {
    flex: 1 1 auto;
    min-width: 0;
  }

  /* Поисковый блок, перемещённый в слот: сброс старых стилей */
  .kd-search__slot .header-search.search-catalog__block {
    width: 100% !important;
    height: 42px !important;
    border: 1.5px solid var(--c-border) !important;
    border-radius: var(--radius) !important;
    background: #fff !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
  }
  .kd-search__slot .header-search.search-catalog__block:focus-within {
    border-color: #9999995e !important;
    /* box-shadow: 0 0 0 3px rgba(248,75,80,.1) !important; */
  }

  /* Результаты поиска: полноэкранный оверлей ниже поисковой полосы */
  .kd-search__slot .search_five_res:not(:empty) {
    position: fixed !important;
    /* top вычисляется JS-ом или фиксирован: bar ≈ 64px */
    top: 64px !important;
    left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 4600 !important;
    background: #fff !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    animation: kd-fadein .15s ease both;
  }
  @keyframes kd-fadein {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
  }
}


/* ══════════════════════════════════════════════════════════════════
   12. НИЖНЕЕ МЕНЮ  .kd-bottom-nav  (планшет + мобиль ≤1200px)
   ══════════════════════════════════════════════════════════════════ */
.kd-bottom-nav { display: none; } /* desktop */

@media (max-width: 1200px) {
	.kdc-hovermenu__close-x svg {
    width: 25px;
    height: 25px;
}
.search_input {
    font-size: 16px;
}
.kdc-mobile-icon--phone svg {
    fill: currentColor;
    width: 18px;
    color: #824e26b8;
}

.kdc-mobile-icon--phone {
    background: #f6e7dac4;
    border-radius: 33px;
}

.open_search_back {
    max-height: 100%;
    padding: 14px 20px 20px 20px;
}

  .kd-bottom-nav {
    display: flex;
    align-items: stretch;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 55px;
    background: var(--c-topbar-bg);
    border-top: 1px solid var(--c-border);
    z-index: 3500;
    box-shadow: 0 -4px 16px rgba(0,0,0,.07);
    /* iOS safe area */
    padding-bottom: env(safe-area-inset-bottom, 0);
  }

  .kd-bottom-nav__item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0px 4px 4px;
    border: none;
    background: none;
    color: #824e26b8;
    font-size: 10px;
    line-height: 1.2;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: color var(--transition), background var(--transition);
    border-radius: 0;
    -webkit-tap-highlight-color: transparent;
  }
  .kd-bottom-nav__item:hover,
  .kd-bottom-nav__item:active { color: var(--c-accent); }

  .kd-bottom-nav__item svg {flex: 0 0 auto;color: #824e26b8;}

  /* Центральная кнопка «Запись» — акцентная */
  .kd-bottom-nav__item--cta {
    color: var(--c-accent);
    position: relative;
  }
  .kd-bottom-nav__cta-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px; height: 46px;
    border-radius: 50%;
    background: var(--c-accent-grad);
    box-shadow: 0 4px 14px rgba(220,69,80,.38);
    /* Приподнимаем над полосой */
    margin-top: -18px;
    transition: filter .15s ease, transform .1s ease;
  }
  .kd-bottom-nav__item--cta:hover  .kd-bottom-nav__cta-circle { filter: brightness(1.07); }
  .kd-bottom-nav__item--cta:active .kd-bottom-nav__cta-circle { transform: scale(.94); }

  /* Подсветка активной страницы через :global или JS-класс */
  .kd-bottom-nav__item.is-active { color: var(--c-accent); }
}