/* Шапка на средних экранах (примерно 1200–1330 px, а также при увеличении
   страницы на большом мониторе) не помещалась в одну строку: логотип, меню,
   иконки мессенджеров и кнопка считаются по своей исходной ширине, между ними
   стоит зазор 50 px, и правая группа переносилась на вторую строку.
   Уменьшаем зазор и разрешаем блоку с логотипом сжиматься до ширины картинки.
   Шире 1330 px всё и так помещалось — там ничего не меняем. */
@media screen and (min-width: 1200px) and (max-width: 1330px) {
  .t-menu-base__maincontainer { column-gap: 24px !important; }
  .t-menu-base__logowrapper   { flex: 0 1 auto !important; }
}

/* Адрес офиса в карточке автора.
   1. text-wrap: balance — на телефоне строка не помещалась в одну строку, и при
      обычном переносе на второй оставался обрывок, голый номер офиса («520»,
      «83», «12»). Браузер сам делит строку на две равные части.
   2. margin — в коде блока стоял отступ -6px сверху и 24px снизу, из-за чего
      текст подлезал под виджет рейтинга Яндекса, а до разделительной линии
      снизу оставалась широкая щель. Ставим 18px сверху; снизу те же 18px даёт
      собственный отступ линии, с которым этот слипается.
   Три селектора: в коде блока лежит своё правило с id — на городских страницах
   это #kmh-root, на обзорной #kl-intro. Перебиваем их селекторами с двумя id. */
#kah-shell .kah-who > .kah-role,
#kah-shell #kmh-root .kah-who > .kah-role,
#kah-shell #kl-intro .kah-who > .kah-role { text-wrap: balance; margin: 18px 0 0; }

/* Примечания под блоком «Не знаете, с чего начать?» (.kmn).
   В коде блока строка размечена сеткой под иконку и текст:
   grid-template-columns: 22px minmax(0,1fr). Но иконки в разметке нет, и голый
   текст становится безымянным элементом сетки — он попадает в первую колонку
   шириной 22 px, где каждое слово встаёт на свою строку. Текст рассыпается
   в столбик: 18 слов — 18 строк.
   Заменяем сетку на flex. Там, где иконки нет, текст занимает всю ширину
   строки; там, где иконка есть (страница /yurist-dlya-klinik), она остаётся
   на месте и вид не меняется — проверено на обеих.
   !important нужен: правило .kmn-row лежит в коде блока, который подключается
   после этого файла, и без него не перебивается. */
.kmn .kmn-row { display: flex !important; align-items: flex-start; gap: 12px; }
.kmn .kmn-ico { flex: none; }

/* ============================================================
   ПЕРВЫЙ ЭКРАН ЖИЛИЩНЫХ СТРАНИЦ (папка 747901) — оформление
   как на /yurist-zouit: слева портрет, справа надстрочник, H1,
   текст, карточка контактов и ряд кнопок связи.

   Все селекторы начинаются с .kmh-hous — этот класс стоит только на секции
   первого экрана жилищных страниц. Так правила, во-первых, перебивают
   прежние «.kmh-who{...}» из кода этих страниц (там была карточка с фото
   84 px), а во-вторых, не задевают страницы других папок, где тоже есть
   первый экран с id kmh-root, но со своими значениями.
   ============================================================ */

.kmh-hous{--a:#203EB0;--ad:#172f8c;--ink:#151515;--tx:#222;--mut:#5b6070;--line:#d6d9e3;
  width:100%;background:#ededed;padding:28px 20px 56px;color:var(--tx);-webkit-font-smoothing:antialiased}
.kmh-hous,.kmh-hous *{box-sizing:border-box;font-family:'Montserrat',Arial,sans-serif}
.kmh-hous h1,.kmh-hous p,.kmh-hous ul,.kmh-hous li,.kmh-hous ol{margin:0;padding:0}
.kmh-hous .kmh-wrap{max-width:1200px;margin:0 auto}

.kmh-hous .kl-bc{background:#ededed;padding:16px 20px;margin:-28px -20px 28px}
.kmh-hous .kl-bc ol{display:flex;flex-wrap:wrap;gap:4px 8px;list-style:none;margin:0;
  font:400 13px/1.5 'Montserrat',Arial,sans-serif;color:#555}
.kmh-hous .kl-bc li+li::before{content:"›";margin-right:8px;color:#9a9a9a}
.kmh-hous .kl-bc a{color:var(--a);text-decoration:none}
.kmh-hous .kl-bc a:hover{text-decoration:underline}

.kmh-hous .kmh-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  grid-template-areas:"art main";gap:48px;align-items:center}
.kmh-hous .kmh-main{grid-area:main;min-width:0}
.kmh-hous .kmh-art{grid-area:art;min-width:0;background:#fff;border-radius:12px;
  overflow:hidden;box-shadow:0 10px 30px rgba(20,30,70,.06);
  display:flex;flex-direction:column;margin:0;padding:0 0 2px}
.kmh-hous .kmh-portrait{display:block;width:100%;height:auto;aspect-ratio:3/4;
  object-fit:cover;object-position:center 25%;border-radius:12px}
/* подпись под портретом: на zouit её нет, но здесь в ней содержательный текст */
.kmh-hous .kmh-podpis{padding:12px 16px 14px;font:400 12.5px/1.5 'Montserrat',Arial,sans-serif;color:#6a6f80}

.kmh-hous .kmh-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:14px;
  font:600 12px/1.4 'Montserrat',Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--a)}
.kmh-hous .kmh-eyebrow::before{content:"";width:32px;height:2px;background:var(--a)}
.kmh-hous h1{font:600 36px/1.22 'Montserrat',Arial,sans-serif;color:var(--ink);
  margin-bottom:18px;text-wrap:balance;overflow-wrap:anywhere}
.kmh-hous .kmh-text p{font:400 16px/1.65 'Montserrat',Arial,sans-serif;color:#1f2230;max-width:640px}
.kmh-hous .kmh-text p+p{margin-top:10px}
.kmh-hous .kmh-text a{color:var(--a)}

/* строка «Материал подготовил» */
.kmh-hous .kmh-meta{margin-top:14px;font:400 13px/1.5 'Montserrat',Arial,sans-serif;color:var(--mut)}
.kmh-hous .kmh-meta a{color:var(--a);text-decoration:none}
.kmh-hous .kmh-meta a:hover{text-decoration:underline}
.kmh-hous .kmh-meta b{font-weight:600;color:#2b2f3d}

/* карточка контактов: слева адрес и почта, справа виджет рейтинга */
.kmh-hous .kmh-who{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 20px;
  align-items:center;margin-top:22px;padding:14px 16px;background:#fff;border-radius:10px}
.kmh-hous .kmh-facts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:0;
  min-width:0;font:400 14px/1.5 'Montserrat',Arial,sans-serif;color:#2b2f3d}
.kmh-hous .kmh-facts > span,.kmh-hous .kmh-facts > a{display:inline-flex;align-items:center;gap:7px;min-width:0}
.kmh-hous .kmh-facts > span:first-child{flex:1 1 260px;text-wrap:balance}
.kmh-hous .kmh-facts svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--a);
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.kmh-hous .kmh-facts a{color:var(--a);text-decoration:none}
.kmh-hous .kmh-facts a:hover{text-decoration:underline}
.kmh-hous .kmh-badge{display:block;width:150px;height:50px;border:0;flex:none;
  border-radius:8px;box-shadow:0 2px 8px rgba(20,30,70,.12)}

/* Кнопка копирования почты. В коде этих страниц от прежнего макета остался
   класс .kmh-mail — там это была широкая кнопка с заливкой, на телефоне во
   всю строку. Поэтому мало задать свои свойства, нужно явно снять чужие. */
.kmh-hous .kmh-mail{display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;
  flex:none;width:auto;min-height:0;margin:0;padding:0;border:0;background:none;box-shadow:none}
.kmh-hous .kmh-copy{position:relative;display:inline-flex;align-items:center;justify-content:center;
  flex:none;width:34px;height:34px;padding:0;border:1px solid #dfe3ed;border-radius:8px;
  background:#fff;color:var(--a);cursor:pointer;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.kmh-hous .kmh-copy:hover{background:#eef1fa;border-color:#b9c3e8}
.kmh-hous .kmh-copy svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.kmh-hous .kmh-copy .ok{display:none}
.kmh-hous .kmh-copy.is-ok{color:#17804a;border-color:#bfe4cd;background:#eefaf2}
.kmh-hous .kmh-copy.is-ok .cp{display:none}
.kmh-hous .kmh-copy.is-ok .ok{display:block}
.kmh-hous .kmh-copy::after{content:attr(data-hint);position:absolute;bottom:calc(100% + 8px);left:50%;
  transform:translateX(-50%) translateY(4px);padding:5px 9px;border-radius:6px;background:#151515;
  color:#fff;font:500 11.5px/1.3 'Montserrat',Arial,sans-serif;white-space:nowrap;opacity:0;
  pointer-events:none;transition:opacity .18s ease,transform .18s ease}
.kmh-hous .kmh-copy:hover::after,.kmh-hous .kmh-copy:focus-visible::after,
.kmh-hous .kmh-copy.is-ok::after{opacity:1;transform:translateX(-50%)}
.kmh-hous .kmh-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ряд кнопок связи */
.kmh-hous .kmh-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.kmh-hous .kmh-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:50px;padding:12px 22px;border-radius:8px;border:2px solid var(--a);max-width:100%;
  font:600 15px/1.2 'Montserrat',Arial,sans-serif;text-decoration:none!important;
  transition:background-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
.kmh-hous .kmh-btn svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kmh-hous .kmh-btn--main{background:var(--a);color:#fff!important;box-shadow:0 8px 20px rgba(32,62,176,.25)}
.kmh-hous .kmh-btn--main:hover{background:var(--ad);border-color:var(--ad);transform:translateY(-2px)}
.kmh-hous .kmh-btn--ghost{background:transparent;color:var(--a)!important}
.kmh-hous .kmh-btn--ghost:hover{background:var(--a);color:#fff!important}
.kmh-hous .kmh-btn:focus-visible,.kmh-hous .kmh-copy:focus-visible{outline:3px solid rgba(32,62,176,.35);outline-offset:3px}

.t-rec:has(.kmh-hous){padding-top:0!important;padding-bottom:0!important}
#allrecords:not([data-tilda-mode="edit"]) .kmh-hous{margin-top:110px}
@media(max-width:980px){#allrecords:not([data-tilda-mode="edit"]) .kmh-hous{margin-top:85px}}

@media screen and (max-width:1100px){
  .kmh-hous .kmh-grid{gap:32px}
  .kmh-hous h1{font-size:32px}
}
@media screen and (max-width:900px){
  .kmh-hous .kmh-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"main" "art";gap:28px}
  .kmh-hous .kmh-art{max-width:520px;width:100%;justify-self:center}
}
@media screen and (max-width:640px){
  .kmh-hous{padding:20px 16px 40px}
  .kmh-hous h1{font-size:26px;line-height:1.25}
  .kmh-hous .kmh-text p{font-size:15px}
  .kmh-hous .kmh-who{grid-template-columns:minmax(0,1fr);gap:12px;padding:14px}
  .kmh-hous .kmh-facts{gap:8px 16px;font-size:13.5px}
  .kmh-hous .kmh-act{display:grid;grid-template-columns:minmax(0,1fr)}
  .kmh-hous .kmh-btn{min-height:50px;padding:12px 14px}
  .kmh-hous .kmh-art{max-width:440px}
}
@media (prefers-reduced-motion:reduce){.kmh-hous *{transition:none!important;animation:none!important}}
