/* Шапка «Кусково» — приведение к макету TrueStudio.
   Работаем поверх готовой разметки темы Archi, сам header.php НЕ трогаем.
   Логотип остаётся прежний — меняем только его окружение.

   Соответствие макета и разметки темы:
     .header          -> .site-header
     .header-top      -> .site-header .info
     .phones          -> .site-header .info .col-md-8 > span
     .messengers .msg -> .site-header .info .col-md-8 .social-list a
     .util-btn        -> .site-header .info .col-md-4 .social-list a
     nav.main a       -> .site-header #mainmenu > li > a
     .nav-cta         -> пункт меню с классом nav-cta (добавляется в админке) */

.site-header{
  --ts-ink:#f7f4ee;
  --ts-ink-2:#a39b8e;
  --ts-accent:#fab207;
  --ts-accent-glow:#ffcd3c;
  --ts-line:rgba(247,244,238,0.10);
  --ts-line-2:rgba(247,244,238,0.16);
}

/* ── Верхняя полоса ──────────────────────────────────── */
.site-header .info{
  border-bottom:1px solid rgba(247,244,238,.07);
  font-size:13px;
}
/* Колонки полосы — bootstrap 8/4. Правая треть (360px под контент) не вмещает
   обе кнопки (нужно 389px), из-за чего «Личный кабинет» вылезал за правый край
   на 29px. Переводим строку во flex: колонки занимают по содержимому,
   а внешние края остаются на линиях контейнера. */
@media (min-width:992px){
  .site-header .info .row{
    display:flex;align-items:center;justify-content:space-between;
  }
  .site-header .info .row > .col-md-8{width:auto;float:none;flex:1 1 auto;min-width:0}
  .site-header .info .row > .col-md-4{width:auto;float:none;flex:0 0 auto}
}
/* Оба элемента полосы лежат во float'ах темы — переводим контейнер во flex,
   иначе телефон и мессенджеры меняются местами. */
.site-header .info .col-md-8{
  display:flex;align-items:center;gap:18px;
}
.site-header .info .col-md-8 > span,
.site-header .info .col-md-8 > .social-list{float:none !important}
.site-header .info .col-md-8 > span{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--ts-ink);
}
.site-header .info .col-md-8 > span a{
  font-weight:500;letter-spacing:.01em;color:var(--ts-ink);
  transition:color .2s;
}
.site-header .info .col-md-8 > span a:hover{color:var(--ts-accent)}
.site-header .info .info-list i.fa-phone{color:var(--ts-accent)}

/* Мессенджеры — круглые кнопки, как в макете */
.site-header .info .col-md-8 .social-list{
  display:inline-flex;align-items:center;gap:8px;
  margin:0;padding:0;list-style:none;vertical-align:middle;
}
.site-header .info .col-md-8 .social-list li{margin:0;padding:0;list-style:none}
.site-header .info .col-md-8 .social-list li a{
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(247,244,238,.06);
  border:1px solid var(--ts-line);
  transition:background .25s,border-color .25s,transform .2s;
}
.site-header .info .col-md-8 .social-list li a:hover{
  background:var(--ts-accent);border-color:var(--ts-accent);
  transform:translateY(-1px);
}
.site-header .info .col-md-8 .social-list li a:hover svg,
.site-header .info .col-md-8 .social-list li a:hover i{color:#0a0807 !important}
.site-header .info .col-md-8 .social-list li svg{width:14px;height:14px;display:block}

/* Правая часть — «Служба поддержки» и «Личный кабинет» */
.site-header .info .col-md-4{text-align:right}
.site-header .info .col-md-4 .social-list{
  display:inline-flex;align-items:center;gap:10px;
  margin:0;padding:0;list-style:none;float:none;
}
.site-header .info .col-md-4 .social-list li{margin:0;padding:0;list-style:none}
.site-header .info .col-md-4 .social-list a{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 13px;border-radius:999px;
  font-size:12.5px;font-weight:500;
  border:1px solid var(--ts-line);
  background:rgba(247,244,238,.04);
  color:var(--ts-ink);
  margin-right:0 !important;
  transition:background .2s,border-color .2s,color .2s;
  white-space:nowrap;
}
.site-header .info .col-md-4 .social-list a:hover{
  background:rgba(247,244,238,.1);border-color:var(--ts-line-2);
}
/* Последняя ссылка — «Личный кабинет», акцентная */
.site-header .info .col-md-4 .social-list > a:last-child{
  border-color:rgba(250,178,7,.4);
  background:rgba(250,178,7,.1);
  color:var(--ts-accent);
}
.site-header .info .col-md-4 .social-list > a:last-child:hover{
  background:var(--ts-accent);color:#0a0807;border-color:var(--ts-accent);
}
/* Точка-индикатор у «Службы поддержки» */
.site-header .info .col-md-4 .social-list li:first-child a::before{
  content:"";width:6px;height:6px;border-radius:50%;background:currentColor;
}

/* ── Основное меню ───────────────────────────────────── */
@media (min-width:992px){
  /* Строку шапки делаем флексом. Бороться с float темы бесполезно:
     <nav> — блочный, и при width:auto он всё равно занимает всю строку,
     из-за чего меню уходит под логотип. У флекс-элементов float игнорируется,
     и логотип с меню встают в ряд сами. */
  .site-header .container > .row > .col-md-12{
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    float:none;
  }
  .site-header .container > .row > .col-md-12 > #logo{float:none;flex:0 0 auto}
  .site-header .container > .row > .col-md-12 > nav{
    width:auto;flex:0 1 auto;float:none;position:relative;z-index:2;
  }
  .site-header #mainmenu{
    display:inline-flex;align-items:center;gap:2px;
    width:auto;float:right;
  }
  .site-header #mainmenu > li{margin:0}
  .site-header #mainmenu > li > a{
    padding:9px 12px;border-radius:999px;white-space:nowrap;
    /* Тема даёт меню Raleway 14px с разрядкой 3px и line-height 33px —
       на фоне остальной шапки (Open Sans 12–13px без разрядки) оно смотрится
       крупным и занимает лишние ~170px. Приводим к типографике шапки. */
    font-family:'Open Sans',Arial,Helvetica,sans-serif;
    font-size:13px;font-weight:500;
    letter-spacing:.4px;line-height:1.4;
    color:var(--ts-ink);
    transition:background .25s,color .25s;
  }
  .site-header #mainmenu > li > a:hover{
    background:rgba(247,244,238,.08);color:var(--ts-accent);
  }
  .site-header #mainmenu > li.active > a,
  .site-header #mainmenu > li.current-menu-item > a{color:var(--ts-accent)}

  /* Кнопка «Подобрать помещение» — пункт меню с классом nav-cta */
  .site-header #mainmenu > li.nav-cta{margin-left:10px}
  .site-header #mainmenu > li.nav-cta > a{
    background:var(--ts-accent);color:#0a0807;
    font-family:'Open Sans',Arial,Helvetica,sans-serif;
    font-size:13px;letter-spacing:.4px;line-height:1.4;
    font-weight:600;padding:10px 18px;
    box-shadow:0 8px 24px -8px rgba(250,178,7,.55);
    transition:transform .2s,background .2s,box-shadow .25s;
  }
  .site-header #mainmenu > li.nav-cta > a:hover{
    background:var(--ts-accent-glow);color:#0a0807;transform:translateY(-1px);
  }
}

/* На ноутбучных экранах меню в полный размер не помещается рядом с логотипом
   (нужно ~1053px + 204px логотипа при строке 1170px) и распирает страницу,
   давая горизонтальный скролл. Ужимаем отступы и шрифт по мере сужения окна. */
@media (min-width:992px) and (max-width:1500px){
  .site-header #mainmenu > li > a{padding:9px 10px;font-size:12.5px}
  .site-header #mainmenu{gap:0}
  .site-header #mainmenu > li.nav-cta{margin-left:6px}
  .site-header #mainmenu > li.nav-cta > a{padding:9px 15px;font-size:12.5px}
  .site-header .container > .row > .col-md-12{gap:12px}
}
@media (min-width:992px) and (max-width:1300px){
  .site-header #mainmenu > li > a{padding:8px 8px;font-size:12px;letter-spacing:0}
  .site-header #mainmenu > li.nav-cta > a{padding:8px 13px;font-size:12px;letter-spacing:0}
}

/* ── Шапка поверх первого экрана (только у прежней главной) ──
   Правила писались под блок [ts_hero] и держались на классе home.
   07.09.2026 на главной встала v4, а прежняя вёрстка уехала на
   /staraya-glavnaya/ — то есть «главная» и «страница со старым первым
   экраном» разошлись. Поэтому ключ теперь свой: класс tsb-oldhome
   плагин вешает на любую страницу с [ts_hero]. */
body.tsb-oldhome .site-header{
  position:absolute;top:0;left:0;right:0;z-index:50;
  background:linear-gradient(to bottom,rgba(8,7,10,.78) 0%,rgba(8,7,10,.45) 70%,rgba(8,7,10,0) 100%);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
body.tsb-oldhome .site-header .info{background:transparent}
/* Шапка уже вынута из потока (position:absolute), поэтому первый экран
   и так начинается от верха страницы. Поднимать его ещё и отрицательным
   margin НЕЛЬЗЯ — получается двойная компенсация и шапка наезжает на контент.
   Нужен только запас сверху, чтобы текст не оказался под шапкой. */
body.tsb-oldhome .ts-hero__inner{padding-top:clamp(200px,22vh,300px)}

@media (max-width:991px){
  body.tsb-oldhome .site-header{position:static;background:rgba(8,7,10,.92)}
  body.tsb-oldhome .ts-hero__inner{padding-top:120px}
  .site-header .info .col-md-4{text-align:left}
  .site-header .info .col-md-4 .social-list{flex-wrap:wrap;gap:8px;margin-top:8px}
}

/* ── Телефоны целиком — правка 25.09.2026 ─────────────── */
/* Последние цифры номеров «таяли» не из-за плагина сайта, а из-за функции
   Яндекс Метрики «скрытие номеров телефонов» — это настройка самого счётчика
   (в tag.js — settings.phhide, догружает модуль tag_phone). На десктопе он
   оборачивает каждый символ номера в <small> с прозрачностью от .94 до 0,
   на телефоне номер не трогает. Цифры и ссылка tel: при этом целые, поэтому
   достаточно вернуть прозрачность. Когда функцию выключат в Метрике,
   правило просто перестанет на что-либо действовать.
   Только главная и внутренние страницы: тестовые версии (v2–v5) не трогаем. */
body.home small[style*="opacity"],
body.tsb-inner small[style*="opacity"]{opacity:1 !important}

/* ── Подвал: кнопки «Служба поддержки» и «Личный кабинет» — правка 12.10.2026 ──
   Оформлены как верхние кнопки шапки (см. inner/inner.css, home-v4.css):
   прозрачные «пилюли» с обводкой — белой у «Службы поддержки», фирменной
   у «Личного кабинета», текст белый, тот же кегль и поля, что и в шапке.
   Разметка — из настроек темы: две ссылки прямо в <ul>, между ними <br>,
   кабинет первым. Её не трогаем: строку собирает флекс, порядок как в шапке
   (поддержка, затем кабинет) — через order, ссылки различаются по адресу.
   Только главная и внутренние страницы: тестовые версии (v2–v5) не трогаем. */
:is(body.home,body.tsb-inner) footer .subfooter .social-icons{display:block}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul{
  display:inline-flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;
  margin:0;padding:0;list-style:none;
}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul br{display:none}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a{
  display:inline-flex;align-items:center;
  padding:7px 13px;border-radius:999px;
  font-size:12.5px;font-weight:500;line-height:23.4px;
  color:#fff;background:transparent;
  border:1px solid rgba(255,255,255,.55);
  white-space:nowrap;text-decoration:none;
  transition:border-color .2s,color .2s,transform .2s;
}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a:hover,
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a:focus{
  border-color:#fff;color:#fff;transform:translateY(-1px);
}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a[href*="sluzhba-podderzhki"]{order:1}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a[href*="//lk."]{order:2;border-color:#e95c0c}
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a[href*="//lk."]:hover,
:is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a[href*="//lk."]:focus{border-color:#ff7d33}
/* Копирайт — по средней линии кнопок: строка 23.4px против кнопки 39.4px. */
@media (min-width:992px){
  :is(body.home,body.tsb-inner) footer .subfooter .col-md-6:first-child{padding-top:8px}
}
/* Кегль и поля по ширине — те же ступени, что у кнопок шапки (chrome.css). */
@media (max-width:1199px){
  :is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a{font-size:12px}
}
@media (max-width:991px){
  :is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a{padding:6px 12px}
}
@media (max-width:600px){
  :is(body.home,body.tsb-inner) footer .subfooter .social-icons ul{gap:6px}
  :is(body.home,body.tsb-inner) footer .subfooter .social-icons ul > a{padding:5px 10px;font-size:11px}
}
/* Кнопка темы «наверх» закреплена в углу окна (right и bottom 20px, 44×44)
   и в конце прокрутки ложилась на «Личный кабинет». На широких экранах
   правая колонка получает поле, чтобы до кружка оставалось ~12px (запас
   17px на полосу прокрутки: 100vw её включает, а кружок считается от края
   без неё); при ширине от ~1300px поле прежнее, 15px. На узких экранах строка
   стоит по центру, поэтому кнопки поднимаются над кружком отступом снизу. */
@media (min-width:992px) and (max-width:1199px){
  :is(body.home,body.tsb-inner) footer .subfooter .col-md-6.text-right{padding-right:max(15px,calc(93px - (100vw - 980px) / 2))}
}
@media (min-width:1200px){
  :is(body.home,body.tsb-inner) footer .subfooter .col-md-6.text-right{padding-right:max(15px,calc(93px - (100vw - 1180px) / 2))}
}
@media (max-width:991px){
  :is(body.home,body.tsb-inner) footer .subfooter{padding-bottom:44px}
}

/* Контакты в подвале (виджет темы «Контакты», custom_html-1) — 26.10.2026:
   «Администрация» и «Отдел аренды» с телефоном и почтой. Подписи разной
   длины, поэтому сетка: подпись слева, значения одной колонкой справа.
   Колонка подвала на 768–991px всего 220px — там подпись встаёт над значением.
   Без плагина разметка тоже читается: тема ставит значения под подписью. */
/* Тема рисует линию под каждым span в address — строкой служит .tsf-row
   (линия на всю ширину), у вложенного значения линия и поля сняты.
   118px — ширина «Администрация:» при кегле подвала 13px. */
footer address.tsf-contacts .tsf-row{display:grid;grid-template-columns:118px minmax(0,1fr);column-gap:10px;align-items:start}
footer address.tsf-contacts .tsf-v{display:block;border:0;padding:0;margin:0}
footer address.tsf-contacts strong{min-width:0;margin:0}
@media (min-width:768px) and (max-width:991px){
  footer address.tsf-contacts .tsf-row{grid-template-columns:minmax(0,1fr)}
}
