/* Мобильная адаптация: точечные правки там, где zero-блок Тильды ломается на узком
   экране (13.08.2026).

   Природа поломки: элементы zero-блока стоят на АБСОЛЮТНЫХ координатах внутри
   артборда, для мобильного Тильда лишь пересчитывает координаты по своей сетке.
   Если реальный текст переносится не так, как в редакторе, соседний элемент никуда
   не сдвигается — он просто оказывается под чужой строкой. Поэтому чиним не «сеткой»,
   а конкретным атомом, и обязательно проверяем геометрию в браузере, а не на глаз.

   Блок rec1378094561 — сквозная форма «Оставить заявку» в подвале всех страниц. */
@media screen and (max-width: 959px) {
  /* Заголовок 32px не влезал в отведённые 253px и уходил на вторую строку,
     а подзаголовок остаётся приколоченным к top:64px — строки накладывались
     (проверено: 94% площади). Даём ту же ширину, что у подзаголовка (268px
     в координатах артборда), и кегль, при котором «Оставить заявку» — одна строка.

     Верхняя граница 959px, а не 560px: артборд масштабируется множителем
     ширина/320, и на промежуточных ширинах (замерено на 600 и 820) перенос
     возвращался. nowrap фиксирует одну строку при любом масштабе, ширина 268px
     гарантирует, что строка не вылезет за артборд. */
  #rec1378094561 .tn-elem__13780945611759221855055 { width: 268px !important; }
  #rec1378094561 .tn-elem__13780945611759221855055 .tn-atom {
    font-size: 26px !important;
    line-height: 1.15 !important;
    white-space: nowrap;
  }
}

/* --- Блок «Рекомендации при выборе дизайна» на /dizayn-proyekt-otelya/ ---
   Мобильных координат автор блока не задал: восьми карточкам достались четыре
   значения top, на 375px они легли друг на друга (70 пар пересечений).
   Раскладываем в поток; порядок сгенерирован из десктопных координат
   скриптом tools/zero_block_stack.py. */
@media screen and (max-width: 639px) {
  #rec2139040661 .t396__artboard, #rec2139040661 .t396__filter, #rec2139040661 .t396__carrier {
    height: auto !important; min-height: 0 !important;
  }
  #rec2139040661 .t396__artboard {
    display: flex; flex-direction: column; padding: 0 20px; box-sizing: border-box;
  }
  #rec2139040661 .t396__elem {
    position: relative !important; top: auto !important; left: auto !important;
    width: 100% !important; height: auto !important; margin: 0 0 18px !important;
  }
  #rec2139040661 .t396__elem .tn-atom { height: auto !important; }
  #rec2139040661 .tn-elem[data-elem-id="1768470525601000003"] { order: 1; }
  #rec2139040661 .tn-elem[data-elem-id="1775638190467000001"] { order: 2; }
  #rec2139040661 .tn-elem[data-elem-id="1775621285306000001"] { order: 3; }
  #rec2139040661 .tn-elem[data-elem-id="176121273888987970"] { order: 4; }
  #rec2139040661 .tn-elem[data-elem-id="175981159419094080"] { order: 5; }
  #rec2139040661 .tn-elem[data-elem-id="1770784334974000001"] { order: 6; }
  #rec2139040661 .tn-elem[data-elem-id="1775727964003000001"] { order: 7; }
  #rec2139040661 .tn-elem[data-elem-id="1775635428638000001"] { order: 8; }
  #rec2139040661 .tn-elem[data-elem-id="1775725421390000001"] { order: 9; }
  #rec2139040661 .tn-elem[data-elem-id="1775728119120000008"] { order: 10; }
  #rec2139040661 .tn-elem[data-elem-id="1775728124307000009"] { order: 11; }
  #rec2139040661 .tn-elem[data-elem-id="1775728023457000002"] { order: 12; }
  #rec2139040661 .tn-elem[data-elem-id="1775728051298000005"] { order: 13; }
  #rec2139040661 .tn-elem[data-elem-id="1775728051298000004"] { order: 14; }
  #rec2139040661 .tn-elem[data-elem-id="1775728077739000007"] { order: 15; }
  #rec2139040661 .tn-elem[data-elem-id="1775728077739000006"] { order: 16; }
  #rec2139040661 .tn-elem[data-elem-id="1775645511236000001"] { order: 17; }
  #rec2139040661 .tn-elem[data-elem-id="1775645533774000002"] { order: 18; }
  #rec2139040661 .tn-elem[data-elem-id="1775635987826000001"] { order: 19; }
  #rec2139040661 .tn-elem[data-elem-id="1775728023457000003"] { order: 20; }
  #rec2139040661 .tn-elem[data-elem-id="1758710415441"] { order: 21; }
}

/* --- Блоки, у которых текст не помещается в прибитую высоту артборда ---
   Высота артборда зафиксирована в разметке, а на 375px текст переносится и
   становится выше расчётной: хвост ложился на следующую секцию (замерено
   tools/artboard_overflow_check.js). Даём запас снизу самой записи — соседний
   блок отодвигается. height:auto тут не годится: артборд с absolute-детьми
   схлопнулся бы в ноль.
   Мелкие вылеты (36–48px у сквозных блоков) не трогаем — там ничего не
   перекрывается, элемент по замыслу свисает на соседнюю секцию. */
@media screen and (max-width: 639px) {
  #rec1902765211 { padding-bottom: 531px !important; }  /* /remont-zala/ */
  #rec1426824821 { padding-bottom: 330px !important; }  /* /remont-dvyhkomnatniy/ */
  #rec1423010821 { padding-bottom: 141px !important; }  /* /remont-v-novostroike/ */
  #rec1426798211 { padding-bottom: 125px !important; }  /* /remont-odnokomnotnih/ */
  #rec2142520771 { padding-bottom:  91px !important; }  /* /dizayn-proyekt-restorana-kafe-bara/ */
  #rec1426884471 { padding-bottom:  91px !important; }  /* /remont-cheterehcomnatniye/ */
  /* сквозной заголовок «Преимущества нашей компании»: вылет всего 36px, но он
     приходится ровно на заголовки аккордеона t585 следующей секции */
  #rec1378225111 { padding-bottom:  60px !important; }
}

/* --- «Как мы работаем — шаги» на /remont-zala/ и карточка тарифа на
   /foto-remonta-magazin-hvostikoff/: заголовок на 375px занимает три строки
   вместо одной и накрывает список — внутри блока, поэтому запасом снизу не
   лечится. Раскладываем оба блока в поток (tools/zero_block_stack.py). */
@media screen and (max-width: 639px) {
  #rec1902765301 .t396__artboard, #rec1902765301 .t396__filter, #rec1902765301 .t396__carrier {
    height: auto !important; min-height: 0 !important;
  }
  #rec1902765301 .t396__artboard {
    display: flex; flex-direction: column; padding: 0 20px; box-sizing: border-box;
  }
  #rec1902765301 .t396__elem {
    position: relative !important; top: auto !important; left: auto !important;
    width: 100% !important; height: auto !important; margin: 0 0 18px !important;
  }
  #rec1902765301 .t396__elem .tn-atom { height: auto !important; }
  #rec1902765301 .tn-elem[data-elem-id="1758710415428"] { order: 1; }
  #rec1902765301 .tn-elem[data-elem-id="176121341292122940"] { order: 2; }
  #rec1902765301 .tn-elem[data-elem-id="1768469136273000002"] { order: 3; }
  #rec1902765301 .tn-elem[data-elem-id="176121339532291410"] { order: 4; }
  #rec1902765301 .tn-elem[data-elem-id="176034693162510970"] { order: 5; }
  #rec1902765301 .tn-elem[data-elem-id="1768469100542000001"] { order: 6; }
  #rec1902765301 .tn-elem[data-elem-id="1758710415441"] { order: 7; }
}
@media screen and (max-width: 639px) {
  #rec1393084771 .t396__artboard, #rec1393084771 .t396__filter, #rec1393084771 .t396__carrier {
    height: auto !important; min-height: 0 !important;
  }
  #rec1393084771 .t396__artboard {
    display: flex; flex-direction: column; padding: 0 20px; box-sizing: border-box;
  }
  #rec1393084771 .t396__elem {
    position: relative !important; top: auto !important; left: auto !important;
    width: 100% !important; height: auto !important; margin: 0 0 18px !important;
  }
  #rec1393084771 .t396__elem .tn-atom { height: auto !important; }
  #rec1393084771 .tn-elem[data-elem-id="175946512477929940"] { order: 1; }
  #rec1393084771 .tn-elem[data-elem-id="175939402776032520"] { order: 2; }
  #rec1393084771 .tn-elem[data-elem-id="175939402776383140"] { order: 3; }
  #rec1393084771 .tn-elem[data-elem-id="1759464426385"] { order: 4; }
  #rec1393084771 .tn-elem[data-elem-id="175946719011284370"] { order: 5; }
  #rec1393084771 .tn-elem[data-elem-id="175946719013041040"] { order: 6; }
  #rec1393084771 .tn-elem[data-elem-id="175946719011496790"] { order: 7; }
  #rec1393084771 .tn-elem[data-elem-id="175946719012995080"] { order: 8; }
  #rec1393084771 .tn-elem[data-elem-id="175946719012596880"] { order: 9; }
  #rec1393084771 .tn-elem[data-elem-id="175946719012292220"] { order: 10; }
  #rec1393084771 .tn-elem[data-elem-id="175946719010986210"] { order: 11; }
  #rec1393084771 .tn-elem[data-elem-id="175946719011748520"] { order: 12; }
  #rec1393084771 .tn-elem[data-elem-id="175946719012073910"] { order: 13; }
  #rec1393084771 .tn-elem[data-elem-id="175946719013336070"] { order: 14; }
  #rec1393084771 .tn-elem[data-elem-id="175946719012644250"] { order: 15; }
  #rec1393084771 .tn-elem[data-elem-id="175946719013456900"] { order: 16; }
}

/* --- /stock/, карточка «от 1 500 ₽/м2» ---
   Описание тарифа на 375px занимает все пять строк своей коробки, а кнопка
   в разметке стоит на 24px выше её низа: у остальных карточек текст короче,
   поэтому наложения не видно, а здесь кнопка легла на последнюю строку.
   Опускаем кнопку и на столько же удлиняем плашку карточки — координаты
   остальных элементов не трогаем. */
@media screen and (max-width: 639px) {
  #rec1599047031 .tn-elem[data-elem-id="1775539483708000009"] { transform: translateY(28px) !important; }
  #rec1599047031 .tn-elem[data-elem-id="1775539483708000005"],
  #rec1599047031 .tn-elem[data-elem-id="1775539483708000005"] .tn-atom { height: 232px !important; }
  #rec1599047031 { padding-bottom: 40px !important; }
}

/* --- Cookie-баннер на очень узких экранах ---
   .t657_rectangle у Тильды шириной до 340px + свои отступы и right:30px: на 320px
   (iPhone SE) это давало горизонтальный скролл. Прижимаем к обоим краям. */
@media screen and (max-width: 400px) {
  .t657.t657_rectangle {
    left: 10px !important;
    right: auto !important;
    /* именно 100vw, а не right:10px: баннер position:fixed, а из-за
       горизонтального переполнения его содержащим блоком становится body шириной
       357px — «прижать к правому краю» тогда означает прижать к краю переполнения,
       и ширина не сходится сама с собой */
    width: calc(100vw - 20px) !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}

/* --- Длинные неразрывные слова на узком экране ---
   На /privacy/ заголовок t795 и текст блока t004 содержат длинные слова и адреса:
   на 320px они не переносились и растягивали страницу до 357px. Разрешаем перенос
   внутри слова — только там, где иначе будет горизонтальный скролл. */
@media screen and (max-width: 480px) {
  .t795__title, .t795__descr, .t004 .t-text, .t004 .t-descr, .t004 .t-title {
    overflow-wrap: anywhere;
  }
}

/* --- Форма на /tekhnicheskiy-proyekt-kvartiry-lite/ ---
   Тот же дефект, что у сквозного блока, но у страницы своя копия формы
   (rec1891028951): заголовок 32px не влезает в 253px, уходит на вторую строку
   и накрывает подзаголовок, приколоченный к top:475px. Лечим тем же способом. */
@media screen and (max-width: 959px) {
  #rec1891028951 .tn-elem__18910289511770604583640000007 { width: 268px !important; }
  #rec1891028951 .tn-elem__18910289511770604583640000007 .tn-atom {
    font-size: 26px !important;
    line-height: 1.15 !important;
    white-space: nowrap;
  }
}

/* ==========================================================================
   Поле «Телефон» (маска Тильды) и цельность формы — site-wide (18.08.2026)
   Задача #1268. То же, что уже вылечено на /contacts/ (#1266), но для НАТИВНЫХ
   форм Тильды по всему сайту (главная rec1378094561 «Оставить заявку», попапы,
   формы услуг/статей). Правка глобальная, т.к. .t-input-phonemask__* существует
   только внутри телефонного поля любой формы — конфликтов с другими блоками нет.

   Механика плагина tilda-phone-mask-1.1: он заменяет исходный <input> на
   <div class="t-input t-input-phonemask__wrap" style="[инлайн-стиль input'а]">
   (обёртка НАСЛЕДУЕТ рамку/скругление поля) и кладёт внутрь НОВЫЙ
   <input class="t-input t-input-phonemask">. У внутреннего input остаётся класс
   .t-input с его собственной рамкой → «рамка в рамке», а без overflow контент
   вылезает за скруглённый край. Из-за раздутой высоты поля absolute-кнопка
   zero-блока уезжала за карточку («кнопка вылезла»). Чиним детерминированно. */
.t-input-phonemask__wrap {
  overflow: hidden;            /* внутренний бокс не выходит за скругление */
  align-items: center;         /* флаг/код/поле по центру, высота как у соседей */
  box-sizing: border-box;
}
.t-input .t-input-phonemask,
.t-input-phonemask,
input[name="tildaspec-phone-part[]"].t-input-phonemask {
  border: 0 !important;        /* убираем вторую (внутреннюю) рамку */
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 100% !important;     /* тянемся на всю обёртку, без лишней высоты */
  min-height: 0 !important;
  background: transparent !important;
}
/* Фокус подсвечиваем на всей обёртке-поле, а не на «голом» внутреннем input. */
.t-input-phonemask__wrap:focus-within {
  border-color: #6d687f !important;
  box-shadow: 0 0 0 3px rgba(109, 104, 127, .18);
}
/* Пока плагин ещё не создал обёртку, «сырое» телефонное поле не должно менять
   высоту строки при догрузке — держим тот же бокс, что и у остальных полей. */
.t-form input[name="Phone"]:not(.t-input-phonemask) { box-sizing: border-box; }

/* Кнопка отправки: не даём ей пропасть/«вылезти» при догрузке форм-скриптов. */
.t-form .t-form__submit { display: block; }
.t-form .t-submit { display: inline-flex; align-items: center; justify-content: center; }

/* ==========================================================================
   Zero-блочные формы «Оставить заявку» — кнопка «Отправить» вылезала ПОД карточку
   (18.08.2026). Причина не в маске и не в кнопке: карточка zero-блока (.t396) имеет
   ФИКСИРОВАННУЮ высоту, а поле «Комментарий» приходит 5-строчным (~135px десктоп) —
   дефолт Тильды, для короткой заявочной формы избыточно. Стопка полей + кнопка
   перерастает карточку → кнопка торчит за скруглённый низ.
   Замеры на живом рендере (:8102) по ВСЕМ брейкпоинтам показали, что scoped-фикс
   на #rec1378094561 покрывал только сквозную форму (98 стр), а ВТОРАЯ zero-форма
   rec1891028951 на /tekhnicheskiy-proyekt-kvartiry-lite оставалась сломанной —
   кнопка вылезала на всех ширинах (+6…+37px). Поэтому правило НЕ привязано к id:
   ужимаем комментарий до ~3 строк в ЛЮБОЙ zero-блочной форме сайта (.t396). После —
   кнопка внутри карточки на всех брейкпоинтах обеих форм (проверено инъекцией CSS
   в живой рендер ДО деплоя). Кастомную форму /contacts (.fin-cform, не .t396) не трогает. */
.t396 .t-input-group_ta .t-input,
.t396 .t-input-group_ta textarea.t-input {
  height: 84px !important;
  min-height: 84px !important;
  max-height: 84px !important;
}

/* --- Размеры картинок (F-3, 19.08.2026) -----------------------------------
   Всем <img> проставлены атрибуты width/height по СОБСТВЕННЫМ размерам файла
   (tools/patch_img_dims.py): браузер знает пропорцию до загрузки картинки и не
   двигает соседние блоки — это и есть защита от CLS.

   Атрибуты width/height — presentational hint, самая слабая сила в каскаде,
   но сильнее НАЧАЛЬНОГО значения height:auto. Поэтому без правила ниже картинка,
   которой Тильда задала только ширину, растягивалась бы до высоты файла
   (логотип 123x68 -> 123x570 — проверено). Селектор `img` (0-0-1) перебивает
   hint и возвращает «высоту считает CSS», а собственные правила Тильды
   (.tn-atom__img{height:100%} и т.п.) специфичнее и продолжают работать как были.

   Удалять это правило нельзя, пока у картинок есть атрибуты размеров. */
img { height: auto; }