:root {
  --font-primary: 'Roboto', sans-serif;
  --color-primary: #6C0000;
  --color-accent: #007bff;
  --color-border: #ccc;
  --transition-speed: 0.3s;
}

/* Accessibility: keyboard focus remains visible even where legacy modules
   suppress the default browser outline. No dimensions or layout change. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid #005fcc!important;
  outline-offset:3px!important;
}
html body .rd37 #proj-faq .proj-faq-item summary:focus-visible,
html.ro42 body .col-new-d .gallery :where(a,button,[tabindex]):focus-visible{
  outline:3px solid #005fcc!important;
  outline-offset:3px!important;
}

/* The footer callback control is now a real button. Reset only native button
   chrome so its established .gruppa-2-2 appearance stays pixel-identical. */
button.gruppa-2-2.manager_button{
  display:block;
  border:0;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
}

body,
h1, h2, h3, h4, h5, h6,
p, a, li, ul, span, div,
input, button, tr, th, td {
  font-family: var(--font-primary) !important;
  text-shadow: none !important;
}

/* -----------------------------------------------------------------------------
   2. CONTACT FORM 7 — Submit Button
   ----------------------------------------------------------------------------- */

.wpcf7-submit {
  border: none;
  cursor: pointer;
}

/* -----------------------------------------------------------------------------
   3. TABS COMPONENT
   ----------------------------------------------------------------------------- */

ul.tabs__caption {
  line-height: 50px;
}

ul.tabs__caption li {
  line-height: 50px;
  padding: 0 12px;
}

.tabs p {
  position: relative;
  left: 15px;
}

/* -----------------------------------------------------------------------------
   5. POPUP — #popmake-5277
   Fully responsive. Replaces the hardcoded top/left pixel values.
   ----------------------------------------------------------------------------- */

#popmake-5277 {
  width: 90% !important;
  max-width: 700px !important;
  height: auto !important;
  padding-bottom: 20px !important;
  /* Centered via Popup Maker settings is preferred,
     but if CSS override is needed: */
  inset: 0 !important;
  margin: auto !important;
  opacity: 1 !important;
}

/* Responsive: full-width on small screens */
@media (max-width: 768px) {
  #popmake-5277 {
    width: 95% !important;
    padding: 15px !important;
  }

  #popmake-5277 .frm_nptdp {
    width: 100% !important;
    padding: 10px !important;
  }
}

/* -----------------------------------------------------------------------------
   6. POPUP FORM — Input Fields
   Floating label effect with smooth transitions
   ----------------------------------------------------------------------------- */

.popmake-content input[type="text"],
.popmake-content input[type="email"],
.popmake-content input[type="tel"],
.popmake-content input[type="number"] {
  display: block;
  width: 100%;
  padding: 10px;
  font-size: 16px;
  border: none;
  border-bottom: 2px solid var(--color-border);
  outline: none;
  background-color: transparent;
  box-sizing: border-box;
  font-family: inherit;
}

/* Floating Labels */
.popmake-content .input-label,
.popmake-content .input-label2 {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 16px;
  color: transparent; /* hidden by default */
  pointer-events: none;
  transition: top var(--transition-speed) ease,
              font-size var(--transition-speed) ease,
              color var(--transition-speed) ease;
}

/* Animate label up on focus */
.popmake-content span > input:focus + .input-label,
.popmake-content span > input:focus + .input-label2 {
  top: -20px;
  font-size: 12px;
  color: var(--color-accent);
}

/* Underline highlight bar */
.popmake-content .input-highlight,
.popmake-content .input-highlight2 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 0;
  background-color: var(--color-accent);
  transition: width var(--transition-speed) ease;
}

.popmake-content .input-field:focus + .input-label + .input-highlight,
.popmake-content .input-field:focus + .input-label2 + .input-highlight2 {
  width: 100%;
}

/* SEO fix 2026-03-31: H1 on homepage styled to match original H2 appearance */
.weBuild.we_work_portfolio h1 {
  font-size: 34px !important;
  font-weight: 700 !important;
  color: var(--text-color-h2, #595959) !important;
  margin-top: 30px !important;
  margin-bottom: 10px !important;
  padding-bottom: 0 !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
}

@media only screen and (max-width: 480px) {
  .weBuild.we_work_portfolio h1 {
    font-size: 18px !important;
    color: var(--text-color-h2, #292e30) !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
    margin: 10px 0 0 !important;
    padding-bottom: 0 !important;
    text-align: center !important;
  }
}

/* SEO fix 2026-03-31: H1 on homepage — responsive override matching original H2 */
@media only screen and (max-width: 820px) {
  .weBuild.we_work_portfolio h1 {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: var(--text-color-h2, #595959) !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
    margin: 30px 0 10px !important;
    padding-bottom: 0 !important;
    text-align: center !important;
  }
}

@media only screen and (max-width: 480px) {
  .weBuild.we_work_portfolio h1 {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: var(--text-color-h2, #595959) !important;
    text-transform: uppercase !important;
    line-height: 1.1 !important;
    margin: 20px 0 10px !important;
    padding-bottom: 0 !important;
    text-align: center !important;
  }
}

/* CLS FIX 2026-03-31: aspect-ratio for key elements (safe, tested) */
.swiper-container-slider .swiper-slide {
  min-height: 360px;
}
@media (max-width: 769px) {
  .swiper-container-slider .swiper-slide {
    min-height: 0;
    aspect-ratio: 768 / 198;
  }
  .swiper-container-slider .swiper-slide picture img {
    aspect-ratio: 768 / 198;
    object-fit: cover;
  }
}
.vektornyi-smart-obekt {
  aspect-ratio: 503 / 271;
}
img.adv71 {
  max-width:100%;
  height:auto;

  aspect-ratio: 1 / 1;
}

.pagination-nav {padding:30px 0 10px;border-top:1px solid #eee;}
.pagination-nav ul {list-style:none;padding:0;margin:0;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;}
.pagination-nav li {display:inline-block;}
.pagination-nav a, .pagination-nav span {display:inline-block;padding:10px 16px;border:1px solid #ddd;color:#555;text-decoration:none;font-family:"Roboto",Arial,sans-serif;font-size:15px;border-radius:4px;transition:all 0.2s ease;background:#fff;}
.pagination-nav a:hover {background:#A61E28;color:#fff;border-color:#A61E28;box-shadow:0 2px 5px rgba(166,30,40,0.3);}
.pagination-nav .current {background:#A61E28;color:#fff;border-color:#A61E28;font-weight:bold;box-shadow:0 2px 5px rgba(166,30,40,0.3);}
.pagination-nav .prev, .pagination-nav .next {font-weight:bold;font-size:15px;min-width:44px;text-align:center;}
@media (max-width:768px) {
.pagination-nav a, .pagination-nav span {padding:8px 12px;font-size:13px;}
.pagination-nav ul {gap:4px;}
}
.caruselProject{min-height:580px}
@media(max-width:768px){.caruselProject{min-height:420px}}
.caruselProject .swiper-slide .blockCarusel{min-height:400px}
.caruselProject .swiper-wrapper{min-height:440px}
.logo-2{display:block;margin:28px auto 0;max-width:198px;width:100%}
/* fix 2026-04-08: carousel overlaps H2 on mobile /tseny */
.we_work_portfolio{position:relative !important;overflow:hidden !important;}
.we_work_portfolio > .container{position:relative;z-index:5;}
.we_work_portfolio .caruselProject{position:relative;z-index:1;clear:both;}
.we_work_portfolio .caruselProject .swiper-container-carusel{overflow:hidden !important;}
@media (max-width:767px){
  .we_work_portfolio{padding:30px 0 !important;}
  .we_work_portfolio h2{margin-bottom:20px !important;}
  .we_work_portfolio .caruselProject{margin-top:20px !important;}
  .we_work_portfolio .caruselProject .swiper-container-carusel{padding:20px 30px 30px !important;}
}


/* Fix: span.slider needs display:block to work same as div.slider (HTML validation fix) */
.theme-switch-wrapper span.slider {
    display: block;
}

/* === CLS FIX: reserve space for logo before load (natural 198x75 = aspect-ratio 2.64) === */
/* Logo variants used in header-home.php and header.php */
.imgNav,
.navbar-brand-img,
.navbar-brand-img1 {
    aspect-ratio: 198 / 75;
    object-fit: contain;
}

/* === iOS SUBMENU FIX v7 (2026-04-16) ===
   common1.js sets height:0 on .subMenu, then per-item handler sets parent .dropdownm left:2000px.
   iOS WebKit strictly clips height:0 content. This CSS targets the ACTIVE parent (left:2000px)
   and restores original subMenu styling. */
@media (max-width: 768px) {
    .dropdownm[style*="left: 2000"] > .subMenu,
    .dropdownm[style*="left:2000"] > .subMenu {
        height: 100% !important;
        max-height: none !important;
        opacity: 1 !important;
    }
}

/* B4 2026-04-17: ALS Rubl font (ruble glyph) — extracted from 24 PHP templates.
   Loaded globally via custom.css. */
@font-face {
    font-family: 'ALS Rubl';
    src: url('/fonts/alsrubl/rouble.woff') format('woff');
    font-style: normal;
    font-weight: normal;
    font-display: swap; /* v13 2026-06-21: убрать шрифт ₽ из крит.пути (был 867мс, блокировал текст → FCP/LCP) */
}
.rub {
    font-family: 'ALS Rubl';
    font-style: normal;
}

/* -----------------------------------------------------------------------------
   TABS contrast fix — 2026-04-27
   Делает табы читаемыми в тёмной и светлой теме (использует CSS-переменные)
   ----------------------------------------------------------------------------- */

ul.tabs__caption {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 10px 0 0 0;
}

ul.tabs__caption li {
  cursor: pointer;
  background: var(--background-table, #eee);
  color: var(--text-color, #333);
  border: 1px solid var(--list-pills-item-border, #d4d4d4);
  border-radius: 4px 4px 0 0;
  margin-right: 4px;
  padding: 0 14px;
  line-height: 40px;
  font-weight: 500;
  user-select: none;
}

ul.tabs__caption li:hover {
  background: var(--background-table-hover, #ccc);
}

ul.tabs__caption li.active {
  background: var(--color-1, #A61E28);
  color: #fff;
  border-color: var(--color-1, #A61E28);
  font-weight: 700;
}

.tabs__content {
  background: var(--tabs-content-background-color, #fff);
  color: var(--text-color, #333);
  padding: 14px 16px;
  border: 1px solid var(--list-pills-item-border, #d4d4d4);
  border-radius: 0 4px 4px 4px;
}


/* === ASD убрать пустоту в карточках каталога на мобиле (2026-06-08) === */
/* .proj_option имеет height:92px для выравнивания карточек в ряд на десктопе.
   На мобиле (1 колонка) это даёт ~50px пустоты внизу каждой карточки. Делаем auto. */
@media (max-width:768px){
  .proj_option{height:auto!important}
  .project_item{margin-bottom:8px!important}
}

/* === card spacing v2 (2026-06-09): display:block — убрать inline-block зазор в Safari/WebKit === */
@media (max-width:768px){
  .projects_container{font-size:0!important}
  .project_item{display:block!important;width:100%!important;margin:0 0 8px 0!important;float:none!important;vertical-align:top}
}

/* === card spacing v3→v4 (2026-06-10): full-bleed — карточки до краёв экрана (клиент: фото на все поле) === */
@media (max-width:768px){
  #container_projects .projects_container{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
}

/* === card spacing v4b (2026-06-10): фото без искажения при растяжении === */
@media (max-width:768px){
  .case-item img{object-fit:cover}
}

/* === card spacing v4c (2026-06-10): колонки цены 50/50 флексом — фикс обрезки справа на мобиле === */
@media (max-width:768px){
  .options-gss-new{display:flex!important}
  .options-gss-new .options-gss-all{width:50%!important;min-width:0!important;float:none!important;flex:1 1 50%!important;box-sizing:border-box!important}
}

/* === card spacing v4d (2026-06-10): фото на всю ширину карточки — picture инлайновый ужимался до 360px === */
@media (max-width:768px){
  .case-item picture{display:block!important;width:100%!important;height:100%!important}
  .case-item img{width:100%!important;height:100%!important;display:block!important}
}

/* === card spacing v4e (2026-06-10): .case-item на всю ширину — <a> это flex, центрировал ужатый блок === */
@media (max-width:768px){
  .case-item{width:100%!important}
}

/* === v5 (2026-06-12): контейнер фото = соотношению фото (1150x780) → object-fit:cover не режет дом ===
   .case-item был height:245px (фикс), при ширине карточки ≠ соотношению фото cover обрезал низ.
   aspect-ratio делает контейнер точно под фото — дом виден целиком и в карточке каталога, и на мобиле. */
.case-item{aspect-ratio:115/78!important;height:auto!important}

/* === v6 (2026-06-13): главный слайдер проекта — фото от края до края на мобиле ===
   Full-bleed ТОЛЬКО на внешней обёртке .block_slider_2 (НЕ на .slider-for/.slick-list —
   slick считает ширину слайда JS-ом, 100vw сломал бы центрирование и asNavFor).
   Только @media max-width:768px (на десктопе .col-md-7=58% — 50vw разорвал бы Bootstrap-ряд).
   img width:100%/height:auto уже в <style id=asd-gallery-mobile-fix> — здесь не дублируем. */
@media (max-width:768px){
  .block_slider_2{
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    width:100vw!important;
    max-width:100vw!important;
  }
}

/* === v6b (2026-06-13): убрать slick-margin 10px ТОЛЬКО у главного фото (.slider-for),
   НЕ трогая миниатюры (.slider-nav) — узкий селектор .slider-for .slick-slide === */
@media (max-width:768px){
  .block_slider_2 .slider-for .slick-slide{margin:0!important}
  .block_slider_2 .slider-for .slick-slide img,
  .block_slider_2 .slider-for .slick-slide .img_awesome{width:100%!important;max-width:100%!important}
}

/* === v6c (2026-06-13): каталог — фото карточки ВПРИТЫК к краям на мобиле ===
   .project_item имел border:1px → внутренний бокс 388px при экране 390 (хайрлайн-рамка
   слева/справа = "совсем мало свободного места но оно есть"). Убираем ТОЛЬКО боковые
   бордеры, верх/низ оставляем для разделения карточек. → фото 390px, 0 свободного места. */
@media (max-width:768px){
  .project_item{border-left:0!important;border-right:0!important}
}

/* === v6d (2026-06-13): убрать "кучу пустого места" над фото проекта на мобиле ===
   Между меню-якорями (.proj-anchor-menu) и слайдером было ~79px пустоты:
   nav margin 14 + разделитель + его margin-bottom 12 + padding-bottom 50px у колонки.
   Клиент: фото должно идти ВПРИТЫК под вкладками. Только @media max-width:768px (десктоп не трогаем). */
@media (max-width:768px){
  [class*="col-"]:has(> .proj-anchor-menu){padding-bottom:4px!important}
  .proj-anchor-menu{margin-top:4px!important;margin-bottom:4px!important}
  .proj-anchor-menu + [class*="pryamougolnik"]{margin-bottom:4px!important}
}

/* === v6e (2026-06-13): каталог — карточки ВПРИТЫК на мобиле (клиент принял плотный вид) ===
   (a) 0 зазора между фото и заголовком: убираем padding-top у .project_card_title.
   (b) 0 зазора между карточками: убираем margin-bottom + верх/низ бордеры у .project_item.
   Только @media max-width:768px (граница мобайла темы — десктоп-сетка inline-block не трогается).
   Селектор .projects_container .project_item (0,2,0)+!important перебивает старые margin (329/335)
   и v6c side-borders (397). Рендерится только в каталоге и в [filter_projects2]-лендингах.
   .project_card_title (0,3,0)+!important перебивает section-34 padding:8px 6px 4px (правый/нижний/левый сохраняются).
   Применяется и к AJAX-перерисованным карточкам (section-10). Аудит 4 ревьюеров: safe-to-apply. */
@media (max-width:768px){
  .projects_container .project_item{margin-bottom:0!important;border-top:0!important;border-bottom:0!important}
  .projects_container .project_item .project_card_title{padding-top:0!important}
}

/* === v6f (2026-07-24): компактная лента ракурсов под главным фото проекта на мобиле ===
   Старое правило схлопывало обёртку до нулевой высоты, потому что миниатюры тогда были скрыты.
   После восстановления slider-nav это обрезало всю ленту и делало миниатюры недоступными.
   Фикс ограничен новой карточкой проекта (.rd37): оставляем 58px для изображений и небольшой
   запас для рамки активного кадра. Одновременно перебиваем старую фиксированную высоту 200px
   у Slick, чтобы лента не создавала пустой блок. Десктоп и другие слайдеры не затрагиваются. */
@media (max-width:768px){
  .rd37 .block_slider_2 .content-catalog-thumbs2{
    height:68px!important;
    min-height:68px!important;
    margin:8px 0 0!important;
    padding:0!important;
    overflow:visible!important;
  }
  .rd37 .block_slider_2 .slider-nav,
  .rd37 .block_slider_2 .slider-nav .slick-list,
  .rd37 .block_slider_2 .slider-nav .slick-track,
  .rd37 .block_slider_2 .slider-nav .slick-slide{
    height:60px!important;
    min-height:60px!important;
  }
  .rd37 .block_slider_2 .slider-nav{margin:0 -5px!important;padding:0 36px!important}
  .rd37 .block_slider_2 .slider-nav .slick-slide{margin:0!important}
  .product_info_new h2{margin-top:0!important}
}

/* === v7 (2026-06-17): главная — рендеры "Лучшие проекты" и "Наши работы" ВПРИТЫК к краям карточки ===
   .blockCarusel .img img (style.css) имел height:180px;object-fit:cover, но БЕЗ width:100% →
   рендер 265px стоял по центру белой карточки ~336px → белые поля по бокам
   (клиент: "разширить на всё белое поле"). Добавляем width:100% — фото заполняет карточку
   встык, как мозаика "Какие дома мы строим". Затрагивает оба блока (.blockCarusel = 13 "Наши
   работы" + 31 "Лучшие проекты"), десктоп и мобайл. */
.blockCarusel .img img{width:100%!important;}

/* === v8 (2026-06-17, исправлено через live-инспекцию браузера): главная мобайл — карусели
   проектов/работ ВСТЫК к краям и фото на всю ширину карточки (клиент: как в каталоге).
   Корень: правило .we_work_portfolio .caruselProject .swiper-container-carusel (3 класса,!important)
   держало padding 30px → swiper считал слайд на 60px уже; а .blockCarusel был ~359px (не 100% слайда)
   → фото мелкое. Перекрываем ТЕМ ЖЕ 3-классовым селектором + width:100% на карточку/фото.
   Секция .we_work_portfolio имела padding 6px → убираем. Проверено вживую: фото 744px (было 359). */
@media (max-width:990px){
  section.weBuild.we_work_portfolio,
  html body .we_work_portfolio{padding-left:0!important;padding-right:0!important}
  .we_work_portfolio .caruselProject .swiper-container-carusel,
  .caruselProject .swiper-container-carusel,
  .caruselProject .swiper-container{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}
  .caruselProject .container{max-width:100%!important;width:100%!important;padding-left:0!important;padding-right:0!important}
  .caruselProject .swiper-slide{padding-left:0!important;padding-right:0!important}
  .caruselProject .blockCarusel{padding:0!important;border-radius:0!important;box-shadow:none!important}
  .caruselProject .blockCarusel,
  .caruselProject .blockCarusel .img,
  .caruselProject .blockCarusel .img img{width:100%!important;max-width:100%!important}
  .caruselProject .blockCarusel .img img{display:block!important;object-fit:cover!important}
}

/* === v9 (2026-06-18): мозаика "Какие дома мы строим" — убрать белую рамку 46px вокруг плиток.
   .project_itemmm{padding:46px 0} давал белые полосы сверху/снизу фото (просвечивал светлый фон секции),
   фото мельчало, подпись отрывалась от фото ("пляшет"). Клиент: убрать рамки/белые поля, увеличить, подпись прижать.
   body .sections_item .project_itemmm — 3 класса, перекрывает исходный !important. */
body .sections_item .project_itemmm{padding:0!important}
.sections_item .project_itemmm img{object-fit:cover!important;display:block!important;width:100%!important}
.sections_item{margin-bottom:10px!important}

/* === v10 (2026-06-18): мозаика "Какие дома мы строим" ВСТЫК на мобиле (клиент: проекты в упор,
   без белого по бокам и между). Секция .weBuild.testv1 (6px) + .container (10px) + .sections_item (20px)
   давали ~36px по бокам; фикс-высота плитки давала зазоры. Всё в 0, контейнер на всю ширину. */
@media(max-width:768px){
  section.weBuild.testv1{padding-left:0!important;padding-right:0!important}
  section.weBuild.testv1 .container{padding-left:0!important;padding-right:0!important;max-width:100%!important;width:100%!important}
  section.weBuild.testv1 .object_we_work{padding:0!important;margin:0!important}
  section.weBuild.testv1 .sections_item{padding:0!important;margin:0!important;height:auto!important;min-height:0!important;width:100%!important}
  section.weBuild.testv1 .project_itemmm{height:auto!important;min-height:0!important}
}

/* === v11 (2026-06-19): подпись плитки мозаики — КОМПАКТНАЯ плашка, текст ПО НИЗУ.
   Клиент: (1) «описание пляшет» — центрирование в плашке 76px прыгало при 1 vs 2 строки названия;
   (2) «сверху полупрозрачного прямоугольника много места — обрежь чтобы было красиво».
   Плашка .sections_item__title была фикс-76px → при тексте по низу сверху оставался пустой
   полупрозрачный кусок. Делаем height:auto (плашка обтягивает текст), якорим у низа (bottom:0),
   текст по нижнему краю с симметричными отступами 14px → аккуратный лейбл, ровно у всех плиток. */
@media(max-width:768px){
  section.weBuild.testv1 .sections_item__title{
    height:auto!important;min-height:0!important;
    top:auto!important;bottom:0!important;
    align-items:flex-end!important;
    padding-top:14px!important;padding-bottom:14px!important;
  }
}

/* === v12 (2026-06-19): НЕБОЛЬШОЙ ЗАЗОР между проектами — клиент передумал (раньше просил «в упор»):
   «раздвинуть проекты на небольшое расстояние, иначе слиты в одно целое, не видно границ».
   (a) мозаика главной «Какие дома мы строим» — 10px между плитками (перекрывает v10 margin:0);
   (b) карточки каталога/проектов — 10px между карточками (перекрывает v6e margin-bottom:0 и v2 8px).
   Полноширинность (full-bleed) сохраняется — только нижний отступ; зазор = белый фон. Только мобайл.
   Карусели «Лучшие проекты»/«Наши работы» — по 1 проекту на слайд, не трогаем. */
@media(max-width:768px){
  section.weBuild.testv1 .sections_item{margin-bottom:10px!important}
  .projects_container .project_item{margin-bottom:10px!important}
}

/* === v14 (2026-06-21): CLS-фикс swiper-каруселей проектов (PSI: .blockCarusel сдвиг 0.131).
   Корень (диагностировано): картинки место резервируют (aspect-ratio ок), но ДО инициализации
   swiper слайды стекаются вертикально (swiper CSS/JS грузится поздно) → карусель высокая →
   при init схлопывается в 1 ряд → большой сдвиг. Фикс: форсим flex-ряд + full-width слайды
   ТОЛЬКО до init (:not(.swiper-initialized)) → высота до=после, сдвига нет. После init правила
   снимаются (swiper вешает класс swiper-initialized). Не ломает работу карусели. */
@media(max-width:990px){
  .caruselProject .swiper-container-carusel:not(.swiper-initialized) .swiper-wrapper{display:flex!important}
  .caruselProject .swiper-container-carusel:not(.swiper-initialized) .swiper-slide{flex-shrink:0!important;width:100%!important}
}
@media(max-width:768px){.ro-sticky-mob__btn span{font-size:13px!important}}
@media(max-width:600px){.ro-card-extras__metric-label,.ro-card-extras__metric-value{font-size:12px!important}}
@media(max-width:768px){
  .proj-param div[style*="font-size:11px"],.proj-param div[style*="font-size: 11px"]{font-size:13px!important}
  .list-pills__text,.tab-complection__item__text{font-size:13px!important}
  .ro-micro-cats__item,.ro-micro-cats__count,.ro-sort-panel__btn,.options-gss-all-span{font-size:13px!important}
  .weBuild table,.content-news table,.container table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
/* === v17 (2026-06-29): catch-all мобила — любой инлайн 9/10/11px -> 13px (VIP-категория «по запросу» и пр.); любая таблица скроллится внутри, не рвёт страницу (/doma-iz-breven). Главную/контакты не трогает (там нет таблиц/инлайн-мелочи). Проверено 200/200. */
@media(max-width:768px){
  [style*="font-size:10px"],[style*="font-size: 10px"],
  [style*="font-size:11px"],[style*="font-size: 11px"],
  [style*="font-size:9px"],[style*="font-size: 9px"]{font-size:13px!important}
  table{display:block!important;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* === v17b (2026-06-29): /doma-iz-breven — широкая hover-таблица (table.myHoverTb) шире контейнера; её display=block не берёт особый шаблон, поэтому скроллим контейнер. Фикс «горизонтальная прокрутка». === */
@media(max-width:768px){.projects_top_block{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}}

/* 2026-10-14 этап 1 — шапка (header.php, header-home.php):
   поиск — иконкой, а не второй красной кнопкой; главная кнопка одна — «Заказать звонок»;
   часы работы не разрываются переносом, иконки мессенджеров — следующей строкой. */
.top-nav .btn-poisk1,
.top-nav .btn-poisk2 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	min-width: 40px;
	height: 40px;
	padding: 0;
	background: #fff;
	border: 2px solid #e2e2e2;
	border-radius: 4px;
	color: #444;
	box-shadow: none;
	vertical-align: middle;
	transition: border-color .2s ease, color .2s ease;
}
.top-nav .btn-poisk1 svg,
.top-nav .btn-poisk2 svg {
	width: 20px;
	height: 20px;
}
.top-nav .btn-poisk1:hover,
.top-nav .btn-poisk2:hover,
.top-nav .btn-poisk1:focus-visible,
.top-nav .btn-poisk2:focus-visible,
.top-nav .form-poisk1.opened + .btn-poisk1,
.top-nav .form-poisk2.opened + .btn-poisk2 {
	border-color: #fe3636;
	color: #fe3636;
	background: #fff;
}
/* поле поиска свёрнуто в ширину 0 и раскрывается по клику на лупу (common1.js, класс .opened);
   без overflow:hidden рамка и отступы свёрнутого поля торчали из-под лупы вторым контуром */
.top-nav .form-poisk1,
.top-nav .form-poisk2 {
	height: 40px;
	overflow: hidden;
	vertical-align: middle;
}
.top-nav .form-poisk1 .form-control,
.top-nav .form-poisk2 .form-control {
	height: 40px;
	border: 2px solid #e2e2e2;
	border-radius: 4px;
	box-shadow: none;
}
.top-nav .form-poisk1 .form-control:focus,
.top-nav .form-poisk2 .form-control:focus {
	border-color: #fe3636;
	box-shadow: none;
}
.rd-hdr-hours {
	white-space: nowrap;
}

/* 2026-10-15 этап 1 — главная: карусель объектов под H1 убрана (front-page.php), и два отступа по 50px
   (.caruselProject и .allProjects) сошлись подряд — 112px пустоты между H1 и кнопкой «Все объекты».
   Только там, где карусели нет; блок с каруселью на других страницах не меняется. */
.we_work_portfolio .caruselProject:not(:has(.swiper-container-carusel)) {
	margin-top: 24px;
}
.we_work_portfolio .caruselProject:not(:has(.swiper-container-carusel)) .allProjects {
	margin-top: 0;
}

/* 2026-10-17 обход сайта: таблицы цен (.myHoverTb) на телефоне — перенос текста в ячейках.
   Стиль футера запрещал перенос (nowrap): заголовок «Цена коробки дома (фундамент, стены, кровля,
   стяжка)» тянул таблицу до ~980px, колонка с ценой уходила за экран и пряталась в прокрутке вбок */
@media (max-width: 768px) {
  html body .myHoverTb { white-space: normal; }
  html body .myHoverTb td, html body .myHoverTb th { white-space: normal; min-width: 0; overflow-wrap: break-word;
    padding: 8px 6px; font-size: 14px; line-height: 1.35; }
}

/* 2026-10-17 обход сайта: таблицы карточек (септики «Топас», газгольдеры и др., .content-catalog-box)
   на телефоне снова таблицы. Правило темы (td{display:block} до 1200px) выстраивало ячейки в столбик:
   у таблиц с шапкой («Песчаный / Суглинок …» и ниже цены, «Стоимость доставки») терялась связь
   «заголовок — цена». Теперь — обычная таблица с переносами и компактным шрифтом */
@media (max-width: 768px) {
  html body .content-catalog-box table { display: table !important; width: 100% !important; min-width: 0 !important; overflow: visible; }
  html body .content-catalog-box table td, html body .content-catalog-box table th {
    display: table-cell !important; width: auto !important; white-space: normal !important;
    padding: 6px 4px !important; vertical-align: middle; hyphens: auto; -webkit-hyphens: auto; }
  html body .content-catalog-box table td *, html body .content-catalog-box table th * {
    font-size: 13px !important; line-height: 1.35 !important; margin: 0 !important; }
  /* широкие таблицы с объединёнными ячейками (монтаж по видам грунта — 6 колонок) */
  html body .content-catalog-box table:has(td[colspan]) td { padding: 6px 2px !important; }
  html body .content-catalog-box table:has(td[colspan]) td * { font-size: 11.5px !important; }
}

/* 2026-10-17 обход сайта: таблицы в обёртке rd53 (.rd53-data-table) на телефоне. Тема задавала им
   min-width 620px и прокрутку вбок без подсказки — колонки с ценами были за краем экрана.
   Таблицы до 5 колонок теперь по ширине экрана с переносами; 6+ колонок — прокрутка с подсказкой */
@media (max-width: 767px) {
  html.rd53-page .rd53-data-table table:not(:has(tr > :nth-child(6))) { min-width: 0 !important; width: 100% !important; }
  html.rd53-page .rd53-data-table table:not(:has(tr > :nth-child(6))) td,
  html.rd53-page .rd53-data-table table:not(:has(tr > :nth-child(6))) th {
    white-space: normal !important; padding: 8px 5px !important; font-size: 13px; line-height: 1.35; overflow-wrap: break-word;
    hyphens: auto; -webkit-hyphens: auto; }
  html.rd53-page .rd53-data-table:has(table tr > :nth-child(6))::after {
    content: "← листайте таблицу →"; display: block; text-align: center; font-size: 12px; color: #8a8a8a; padding: 6px 0 2px; }
}

/* 2026-10-18 (замечание заказчика): видео с плашками «YouTube / RuTube» (figure.tube) — подпись
   позиционировалась от внешнего блока и вылезала за край видео (на телефоне — за экран), текст
   ссылок был красным на красном фоне. Подпись — в правом нижнем углу самой картинки, текст белый */
html body figure.tube { position: relative; width: fit-content; max-width: 100%; margin-left: auto; margin-right: auto; }
html body figure.tube > img { display: block; max-width: 100%; height: auto; }
html body figure.tube > figcaption { position: absolute !important; top: auto !important; left: auto !important;
  right: 10px !important; bottom: 10px !important; width: auto !important; text-align: right; }
/* :not(#…) — вес id, чтобы перебить html.rd53-page .weBuild a:not(.btn):not(.button) из rd58 */
html body figure.tube > figcaption a:not(#ro-tube-none) { color: #fff !important; text-decoration: none !important; }