/* =============================================================================
   ОБЛИК ПЛОЩАДКИ — слой поверх style.css
   Концепт 3 «Чистая функциональность» + цвет морской волны из концепта 4.
   Выбор оператора 07.09.2026.

   Почему слоем, а не правкой style.css: там 58 КБ прямых значений без
   переменных, красный зашит в 37 правил. Слой снимается одной строкой в
   header.php и возвращает прежний вид целиком.

   Контрасты пересчитаны по WCAG, не на глаз:
     текст #0F1724 на белом ............ 18,0 : 1
     вторичный #5B6675 на белом ........  5,8 : 1
     ссылка #15736F на белом ...........  5,7 : 1   на секции 5,4 : 1
     тёмный текст на кнопке #31CDCC ....  9,2 : 1
   Ярко-бирюзовый #31CDCC белым текстом даёт 1,96 : 1 — нечитаемо, поэтому
   на кнопке он с ТЁМНЫМ текстом, а роль «акцент на светлом» держит #15736F
   того же тона.
   ========================================================================== */

:root{
  --fon:              #FFFFFF;
  --fon-sekcii:       #F6F9FC;
  --fon-ekrana:       #F7FAFD;
  --fon-kartochki:    #F7F9FC;
  --fon-shapki-tabl:  #F1F5F9;

  --granica:          #DEE6EF;
  --granica-tonkaya:  #ECF1F7;

  --tekst:            #0F1724;
  --tekst-vtor:       #5B6675;

  --akcent:           #31CDCC;   /* морская волна — заливка кнопок */
  --akcent-navedenie: #28B3B0;
  --akcent-tekst:     #15736F;   /* тот же тон, читаемый на светлом */
  --akcent-nazhatie:  #0F6D6C;
  --na-akcente:       #0F1724;   /* текст поверх морской волны */

  --znak:             #FF7108;   /* оранжевый знак логотипа */
}

/* --- Основа ------------------------------------------------------------- */
body{ background: var(--fon); color: var(--tekst); }
.bg-light{ background-color: var(--fon-sekcii) !important; }
h1,h2,h3,h4,h5{ color: var(--tekst); }

/* --- Кнопки: красный → морская волна ------------------------------------ */
.lead-button,
.btn-red-custom,
.nav-link.active,
input.wpcf7-form-control.has-spinner.wpcf7-submit,
span.page-numbers,
a.page-numbers{
  background-color: var(--akcent) !important;
  border-color: var(--akcent) !important;
  color: var(--na-akcente) !important;
}
.lead-button:hover,
.btn-red-custom:hover,
.nav-link:hover,
input.wpcf7-form-control.has-spinner.wpcf7-submit:hover,
a.page-numbers:hover,
.current:hover{
  background-color: var(--akcent-navedenie) !important;
  border-color: var(--akcent-navedenie) !important;
  color: var(--na-akcente) !important;
}
.nav-link{ border-color: var(--akcent) !important; }

/* --- Ссылки и мелкий акцент --------------------------------------------- */
#masthead a:hover,
.site-footer a:hover,
.about-button:hover,
.media-body a:hover,
.header-phone-number:hover,
.header-icon-link:hover,
.bread-first-section a,
.regions-contacts i,
.date-post,
.section_tables_price .nov-price,
.main-block-preims-company .new-white-info-block ul li strong,
.main-block-preims-company ul li i{
  color: var(--akcent-tekst) !important;
}
.main-block-preims-company .new-white-info-block ul li:before{
  background-color: var(--akcent-tekst) !important;
}

/* --- Шапка --------------------------------------------------------------- */
.header-accent-bar{ background: var(--akcent) !important; }
.header-logo-tagline{ border-left-color: var(--znak) !important; }
.site-header{ background: var(--fon); }

/* --- Тёмные и красные плашки, которых в концепте 3 нет -------------------- */
.services-2.services-block{
  background-color: var(--fon-sekcii) !important;
  color: var(--tekst) !important;
}
.services-2.services-block h2,
.services-2.services-block h3,
.services-2.services-block p,
.services-2.services-block a{ color: var(--tekst) !important; }
.cookies{ background: var(--akcent-tekst) !important; color: #fff !important; }

/* --- Таблицы: белое поле, светлая шапка, тонкие разделители --------------- */
.section_tables_price table,
.page-content table,
table.table{
  background: var(--fon);
  border-color: var(--granica);
}
.section_tables_price table thead th,
.page-content table thead th,
table.table thead th{
  background: var(--fon-shapki-tabl) !important;
  color: var(--tekst) !important;
  border-color: var(--granica) !important;
  font-weight: 600;
}
.section_tables_price table td,
.page-content table td,
table.table td{
  border-color: var(--granica-tonkaya) !important;
  color: var(--tekst);
}
.section_tables_price table tbody tr:hover td,
table.table tbody tr:hover td{ background: var(--fon-sekcii); }

/* --- Карточки ------------------------------------------------------------ */
.region-card,
.new-white-info-block,
.card-block,
.child-page-card{
  background: var(--fon-kartochki);
  border: 1px solid var(--granica);
  color: var(--tekst);
}
a.region-card:hover{
  border-color: var(--akcent-tekst);
  color: var(--akcent-tekst);
}

/* --- Аккордеон «Вопросы и ответы» ---------------------------------------- */
.accordion-custom-style .card-header,
.accordion-custom-style button{
  background: var(--fon);
  color: var(--tekst);
  border-color: var(--granica);
}

/* --- Форма --------------------------------------------------------------- */
.wpcf7 input:not([type=submit]),
.wpcf7 textarea,
.wpcf7 select{
  border: 1px solid var(--granica);
  background: var(--fon);
  color: var(--tekst);
}
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus{
  border-color: var(--akcent-tekst);
  outline: 2px solid rgba(21,115,111,.22);
  outline-offset: 1px;
}

/* --- Полоса доверия на готовых иконках ------------------------------------
   Разметки под неё в шаблоне пока нет — стили заведены заранее, чтобы блок
   встал без второй правки CSS. */
.cdx-doverie{
  display: grid; gap: 24px; padding: 28px 0;
  grid-template-columns: repeat(4, 1fr);
  background: var(--fon-sekcii);
  border-top: 1px solid var(--granica);
  border-bottom: 1px solid var(--granica);
}
.cdx-doverie__punkt{ display: flex; align-items: center; gap: 14px; }
.cdx-doverie__punkt img{ width: 40px; height: 40px; flex: 0 0 40px; }
.cdx-doverie__punkt span{ font-size: 15px; line-height: 1.35; color: var(--tekst); }
@media (max-width: 767px){
  .cdx-doverie{ grid-template-columns: repeat(2, 1fr); gap: 18px; }
}

/* --- Тёмная секция «Сопутствующие работы» --------------------------------
   В теме это фоновое фото с чёрной подложкой 70 %. В концепте 3 тёмных
   секций нет вовсе — гасим подложку и само фото. */
.section-bg-image{
  background-image: none !important;
  background-color: var(--fon-sekcii) !important;
}
.section-bg-image:after{ display: none !important; }
.section-bg-image h2,
.section-bg-image p,
.section-bg-image .regions-info-block{ color: var(--tekst) !important; }
.section-bg-image .regions-main-block{
  background: var(--fon) !important;
  border: 1px solid var(--granica);
}

/* --- Кнопка: текст обязан быть тёмным поверх морской волны ---------------- */
.lead-button,
.lead-button *,
.btn-red-custom,
.btn-red-custom *,
input.wpcf7-form-control.wpcf7-submit{
  color: var(--na-akcente) !important;
  font-weight: 600;
}

/* =============================================================================
   21.09.2026 — замечания оператора: меню, подвал, таблицы в блоге, похожие статьи
   ========================================================================== */

/* --- Меню шапки (z-260921-04) ---------------------------------------------
   Девять разделов при шрифте 18px и нулевых боковых отступах переносились в
   две строки, слова разных пунктов слипались («Цены Примеры работ О компании»),
   стрелка раскрытия уезжала к соседнему пункту, шапка росла до 203px. */
@media (min-width: 992px){
  /* Девять разделов в одну строку не входят даже при 13px (нужно ~1170px при
     контейнере 1110), поэтому пункты не рвутся внутри, а переходят вторым рядом. */
  nav.header-two .header-menu{
    flex-wrap: wrap; justify-content: flex-start !important;
    column-gap: 28px; row-gap: 0; padding: 6px 0;
  }
  #masthead .header-menu > li > a{
    font-size: 15px !important; line-height: 1.25; white-space: nowrap;
    padding: 12px 0 !important; color: var(--tekst);
  }
  .header-menu .menu-item-has-children > a{ gap: 6px; }
  .header-menu .menu-item-has-children > a::after{ flex: 0 0 10px; width: 10px; height: 10px; margin-top: -4px; }
  .header-menu .sub-menu{
    z-index: 30; border: 1px solid var(--granica);
    box-shadow: 0 10px 24px rgba(15,23,36,.10);
  }
  #masthead .header-menu .sub-menu li a{ font-size: 15px !important; white-space: normal; border-bottom-color: var(--granica-tonkaya); color: var(--tekst); }
  .header-menu .sub-menu li > a:hover{ background: var(--fon-sekcii); color: var(--akcent-tekst); }
  /* последние пункты раскрываются влево, чтобы список не уезжал за край экрана */
  .header-menu > li:nth-last-child(-n+4) > .sub-menu{ right: 0; left: auto; }
}
.header-menu .current-menu-item > a,
.header-menu .current-menu-parent > a,
.header-menu .current-menu-ancestor > a{ color: var(--akcent-tekst) !important; }

/* --- Подвал (z-260921-04/05) -------------------------------------------------
   Заголовки разделов 24px капсом ломались в три строки, пять разделов в сетке
   на четыре колонки оставляли «Наливные полы в МО» одних во втором ряду,
   между заголовком и списком не было воздуха. */
.site-footer{ padding: 56px 0 28px; }
.site-footer .bold-element-header{
  font-size: 14px; line-height: 1.35; letter-spacing: .05em;
  margin: 0 0 14px;
}
.site-footer .bold-element-header a{ color: #fff; }
.site-footer .footer-menu ul{ margin: 0 0 32px; }
.site-footer .footer-menu li{ margin: 0 0 7px; font-size: 15px; line-height: 1.35; }
footer.site-footer a:hover{ color: var(--akcent) !important; }
@media (min-width: 768px){
  .site-footer > .container > .row:first-child{
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 28px; margin-left: 0; margin-right: 0;
  }
  .site-footer > .container > .row:first-child > [class*="col-"]{
    max-width: none; flex: none; width: auto; padding-left: 0; padding-right: 0;
  }
}
@media (min-width: 1200px){
  .site-footer > .container > .row:first-child{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.site-footer .footer-bottom{
  border-top: 1px solid rgba(255,255,255,.14);
  padding-top: 28px; margin-top: 4px;
}
.site-footer .contact-footer{ display: inline-block; margin-bottom: 6px; }

/* --- Таблицы в статьях блога (z-260921-03) ------------------------------------
   Таблицы в теле записи без thead и без рамок — выглядели как текст столбиком. */
.single-post .page-content table{
  width: 100%; border-collapse: collapse; margin: 24px 0 28px;
  border: 1px solid var(--granica); font-size: 16px; line-height: 1.45;
}
.single-post .page-content th,
.single-post .page-content td{
  border: 1px solid var(--granica) !important;
  padding: 10px 14px; text-align: left; vertical-align: top;
}
.single-post .page-content th{ background: var(--fon-shapki-tabl); font-weight: 600; color: var(--tekst); }
.single-post .page-content tr:nth-child(even) td{ background: var(--fon-sekcii); }
@media (max-width: 767px){
  .single-post .page-content table{
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
    max-width: 100%; font-size: 15px;
  }
  .single-post .page-content th,
  .single-post .page-content td{ min-width: 140px; }
}

/* --- Похожие статьи под записью блога (z-260921-03) ------------------------ */
.cdx-pohozhie{ margin: 8px auto 56px; }
.cdx-pohozhie__zagolovok{ font-size: 26px; margin: 0 0 20px; }
.cdx-pohozhie__spisok{ display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0,1fr)); }
.cdx-pohozhie__kartochka{
  display: flex; flex-direction: column; gap: 10px; padding: 20px;
  background: var(--fon-kartochki); border: 1px solid var(--granica); border-radius: 6px;
  color: var(--tekst) !important; text-decoration: none !important;
}
.cdx-pohozhie__kartochka:hover{ border-color: var(--akcent-tekst); }
.cdx-pohozhie__foto{ width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; border-radius: 4px; }
.cdx-pohozhie__nazvanie{ font-weight: 600; font-size: 17px; line-height: 1.3; color: var(--tekst); }
.cdx-pohozhie__kartochka:hover .cdx-pohozhie__nazvanie{ color: var(--akcent-tekst); }
.cdx-pohozhie__anons{ font-size: 15px; line-height: 1.45; color: var(--tekst-vtor); }
@media (max-width: 767px){ .cdx-pohozhie__spisok{ grid-template-columns: 1fr; } }

/* блок автора в записях блога (21.09.2026): кружок с инициалом вместо фото */
.cdx-avtor{
  display: flex; align-items: flex-start; gap: 16px;
  margin: 32px 0 24px; padding: 20px 22px;
  background: var(--fon-kartochki); border: 1px solid var(--granica); border-radius: 6px;
}
.cdx-avtor__znak{
  flex: 0 0 56px; width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--akcent); color: var(--na-akcente);
  font-weight: 700; font-size: 24px; line-height: 1;
}
.cdx-avtor__tekst{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cdx-avtor__podpis{ font-size: 13px; color: var(--tekst-vtor); text-transform: uppercase; letter-spacing: .04em; }
.cdx-avtor__imya{ font-weight: 600; font-size: 18px; color: var(--tekst); line-height: 1.3; }
.cdx-avtor__o{ font-size: 15px; line-height: 1.5; color: var(--tekst-vtor); }
@media (max-width: 575px){
  .cdx-avtor{ padding: 16px; gap: 12px; }
  .cdx-avtor__znak{ flex-basis: 44px; width: 44px; height: 44px; font-size: 20px; }
}


/* =============================================================================
   21.09.2026 — СПЕЦИФИКАЦИЯ ОБЛИКА (999.324, текстовое ТЗ оператора)
   Концепт 3 + морская волна. ТЗ главнее прежних значений слоя: переменные ниже
   переопределяют :root выше. Шрифты: Manrope (заголовки) + Inter (текст),
   Google Fonts, строка в header.php.
   Контраст: #15736F под белым текстом — 5,7 : 1, поэтому кнопка теперь
   тёмно-бирюзовая с БЕЛЫМ текстом (ТЗ), а не #31CDCC с тёмным.
   ========================================================================== */
:root{
  --akcent:           #15736F;
  --akcent-navedenie: #105E5B;
  --akcent-tekst:     #15736F;
  --akcent-nazhatie:  #105E5B;
  --na-akcente:       #FFFFFF;
  --tekst:            #172126;   /* заголовки */
  --tekst-osn:        #3F4A4E;   /* основной текст */
  --tekst-vtor:       #6F7A7E;
  --fon-sekcii:       #F6F9F9;
  --fon-ekrana:       #F6F9F9;
  --fon-kartochki:    #FFFFFF;
  --fon-tehn:         #EEF4F3;
  --granica:          #DCE5E4;
  --granica-tonkaya:  #E6EEED;
  --temnaya:          #172A2A;
  --shrift-zag:       'Manrope', 'Montserrat', Arial, sans-serif;
  --shrift-tekst:     'Inter', Arial, sans-serif;
}

/* --- Типографика desktop --------------------------------------------------- */
body{
  font-family: var(--shrift-tekst); color: var(--tekst-osn);
  font-size: 17px; line-height: 27px;
}
p, li, td{ font-family: var(--shrift-tekst); }
.page-content p, .page-content li{ font-size: 17px; line-height: 27px; color: var(--tekst-osn); }
h1, h2, h3, h4, h5, .page-title{ font-family: var(--shrift-zag) !important; color: var(--tekst); letter-spacing: -0.01em; }
h1, .page-title{ font-size: 56px; line-height: 62px; font-weight: 700; max-width: 900px; }
h2{ font-size: 40px; line-height: 48px; font-weight: 700; }
h3{ font-size: 24px; line-height: 32px; font-weight: 600; }
.page-content h2{ margin: 48px 0 16px; }
.page-content h3{ margin: 32px 0 12px; }
small, .date-post, figcaption, #breadcrumbs{ font-size: 14px; line-height: 20px; }
/* длинные H1 («Полиуретанцементные полы», «Наливные полы в Красногорске»):
   на средних экранах не ниже 48 px */
@media (max-width: 1199px){ h1, .page-title{ font-size: 48px; line-height: 54px; } h2{ font-size: 34px; line-height: 42px; } }
@media (max-width: 991px){ h1, .page-title{ font-size: 40px; line-height: 46px; } h2{ font-size: 30px; line-height: 38px; } }

/* --- Типографика 360 ------------------------------------------------------- */
@media (max-width: 600px){
  body, .page-content p, .page-content li{ font-size: 16px; line-height: 24px; }
  h1, .page-title{ font-size: 34px; line-height: 39px; }
  h2{ font-size: 28px; line-height: 34px; }
  h3{ font-size: 21px; line-height: 28px; }
  small, .date-post, figcaption, #breadcrumbs{ font-size: 13px; line-height: 18px; }
  .page-content h2{ margin: 36px 0 12px; }
}

/* --- Сетка: контейнер 1280, поля 80 при 1440, 16 на телефоне --------------- */
@media (min-width: 1360px){ .container{ max-width: 1310px; } }   /* 1280 + 2×15 */
@media (max-width: 600px){
  .container, .container-fluid{ padding-left: 16px; padding-right: 16px; }
}
html, body{ overflow-x: clip; }

/* --- Кнопка по ТЗ: 52 px, радиус 8, поля 24–28 ------------------------------ */
.lead-button, .btn-red-custom, .lead-button-green,
input.wpcf7-form-control.wpcf7-submit{
  min-height: 52px; border-radius: 8px !important;
  padding: 0 26px !important;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--shrift-tekst); font-size: 16px; font-weight: 600;
  line-height: 1.2; text-decoration: none !important;
  transition: background-color .15s ease;
}
input.wpcf7-form-control.wpcf7-submit{ display: inline-block; }
.lead-button:focus-visible, .btn-red-custom:focus-visible{ outline: 3px solid rgba(21,115,111,.35); outline-offset: 2px; }
footer.site-footer a:hover{ color: #31CDCC !important; }   /* на тёмном подвале — светлый тон */

/* --- Таблицы: desktop по ТЗ ---------------------------------------------------
   Шапка #172A2A белым, зебра #FFF/#F6F9F9, строка от 56 px, ячейка 16/18,
   внешний контейнер радиус 12 и рамка #DCE5E4. Перекрывает таблицы блога
   (утро 21.09) и прайсы страниц. */
.page-content table, .section_tables_price table, table.table, .entry-content table{
  width: 100%; border-collapse: separate !important; border-spacing: 0;
  border: 1px solid var(--granica) !important; border-radius: 12px; overflow: hidden;
  margin: 24px 0 28px; background: #fff;
  font-family: var(--shrift-tekst); font-size: 15px; line-height: 22px;
}
.page-content table th, .section_tables_price table th, table.table th, .entry-content table th,
.page-content table thead td, .section_tables_price table thead td{
  background: var(--temnaya) !important; color: #fff !important;
  font-size: 14px; line-height: 20px; font-weight: 600;
  padding: 16px 18px !important; border: 0 !important; text-align: left; vertical-align: middle;
}
.page-content table td, .section_tables_price table td, table.table td, .entry-content table td{
  padding: 16px 18px !important; height: 56px; vertical-align: middle;
  border: 0 !important; border-top: 1px solid var(--granica) !important;
  color: var(--tekst); background: #fff;
  font-size: 15px; line-height: 22px;
}
.page-content table tr:nth-child(even) td, .section_tables_price table tbody tr:nth-child(even) td,
table.table tbody tr:nth-child(even) td, .entry-content table tr:nth-child(even) td{ background: var(--fon-sekcii); }
.page-content table tr:first-child td{ border-top: 0 !important; }
.page-content table tr:first-child th ~ th, .page-content table thead th ~ th{ border-left: 1px solid rgba(255,255,255,.08) !important; }

/* --- Таблицы на ≤600: каждая строка — карточка «параметр → значение» ---------
   Подписи ставит скрипт в подвале (data-label из шапки). Без шапки таблица
   карточкой не становится. Горизонтального скролла нет, значения не прячутся. */
@media (max-width: 600px){
  table.cdx-kartochki, table.cdx-kartochki tbody, table.cdx-kartochki tr, table.cdx-kartochki td{
    display: block; width: 100% !important;
  }
  table.cdx-kartochki{
    border: 0 !important; border-radius: 0; overflow: visible; background: transparent;
    min-width: 0 !important; max-width: 100%;
  }
  table.cdx-kartochki thead, table.cdx-kartochki tr.cdx-shapka{ display: none !important; }
  table.cdx-kartochki tr{
    border: 1px solid var(--granica); border-radius: 10px; background: #fff;
    padding: 16px; margin: 0 0 12px;
  }
  table.cdx-kartochki td,
  table.cdx-kartochki tr:nth-child(even) td{
    display: grid; grid-template-columns: minmax(0, 44%) minmax(0, 1fr); column-gap: 12px;
    height: auto; min-width: 0 !important; padding: 5px 0 !important; border: 0 !important;
    background: transparent !important; font-size: 14px; line-height: 20px;
    color: var(--tekst); font-weight: 500; word-break: break-word;
  }
  table.cdx-kartochki td::before{
    content: attr(data-label); color: var(--tekst-vtor);
    font-size: 13px; line-height: 18px; font-weight: 400;
  }
  table.cdx-kartochki td:first-child{
    display: block; padding: 0 0 8px !important; margin-bottom: 4px;
    border-bottom: 1px solid var(--granica-tonkaya) !important;
    font-family: var(--shrift-zag); font-size: 16px; line-height: 22px; font-weight: 700;
  }
  table.cdx-kartochki td:first-child::before{ content: none; }
  /* утреннее правило «таблица прокручивается внутри себя» — больше не нужно */
  .single-post .page-content table.cdx-kartochki{ display: block; overflow: visible; }
  .single-post .page-content table.cdx-kartochki th,
  .single-post .page-content table.cdx-kartochki td{ min-width: 0; }
}

/* --- Статья блога по макету ------------------------------------------------ */
.cdx-statya__shapka{ margin-bottom: 32px; }
.cdx-metka{
  display: inline-block; margin: 8px 0 14px; padding: 4px 10px; border-radius: 6px;
  background: var(--fon-tehn); color: var(--akcent-tekst) !important;
  font-size: 13px; line-height: 18px; font-weight: 600; text-decoration: none !important;
}
.cdx-statya .page-title{ margin: 0 0 20px; max-width: 900px; }
.cdx-statya__meta{ display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.cdx-statya__meta .date-post{ color: var(--tekst-vtor) !important; font-size: 15px; }
.cdx-avtor.cdx-avtor--stroka{
  margin: 0; padding: 0; background: none; border: 0; align-items: center; gap: 12px; max-width: 620px;
}
.cdx-avtor--stroka .cdx-avtor__znak{ flex-basis: 44px; width: 44px; height: 44px; font-size: 19px; background: var(--fon-tehn); color: var(--akcent-tekst); }
.cdx-avtor--stroka .cdx-avtor__imya{ font-size: 15px; line-height: 20px; }
.cdx-avtor--stroka .cdx-avtor__podpis{ font-size: 15px; text-transform: none; letter-spacing: 0; color: var(--tekst); font-weight: 600; }
.cdx-avtor--stroka .cdx-avtor__o{ font-size: 13px; line-height: 18px; }
.cdx-statya .page-content{ max-width: 760px; }
.cdx-oblozhka{ margin: 0 0 32px; }
.cdx-oblozhka__img, .page-content figure img{ width: 100%; height: auto; border-radius: 12px; display: block; }
.page-content figure{ margin: 28px 0; }
.page-content figcaption{ margin-top: 10px; color: var(--tekst-vtor); }
/* Содержание */
.cdx-statya__bok{ margin-bottom: 24px; }
.cdx-soderzhanie{
  background: var(--fon-sekcii); border: 1px solid var(--granica); border-radius: 12px; padding: 20px 22px;
}
.cdx-soderzhanie__zagolovok{
  font-family: var(--shrift-zag); font-weight: 700; font-size: 18px; color: var(--tekst);
  cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center;
}
.cdx-soderzhanie__zagolovok::-webkit-details-marker{ display: none; }
.cdx-soderzhanie__zagolovok::after{ content: ''; width: 9px; height: 9px; border-right: 2px solid var(--tekst-vtor); border-bottom: 2px solid var(--tekst-vtor); transform: rotate(45deg); margin: -4px 4px 0 12px; transition: transform .15s; }
.cdx-soderzhanie[open] .cdx-soderzhanie__zagolovok::after{ transform: rotate(-135deg); margin-top: 4px; }
.cdx-soderzhanie__spisok{ margin: 14px 0 0; padding-left: 22px; }
.cdx-soderzhanie__spisok li{ font-size: 15px; line-height: 21px; margin: 0 0 9px; color: var(--tekst-vtor); }
.cdx-soderzhanie__spisok a{ color: var(--akcent-tekst) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(21,115,111,.35); }
.cdx-soderzhanie__spisok a:hover{ text-decoration-color: currentColor; }
@media (min-width: 992px){
  .cdx-statya__bok .cdx-soderzhanie{ position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow: auto; }
  .cdx-statya__bok{ align-self: flex-start; position: sticky; top: 24px; }
  .cdx-soderzhanie__zagolovok{ cursor: default; pointer-events: none; }
  .cdx-soderzhanie__zagolovok::after{ display: none; }
}
.page-content h2[id]{ scroll-margin-top: 24px; }
@media (max-width: 600px){
  .cdx-statya__meta{ gap: 10px 20px; }
  .cdx-avtor--stroka .cdx-avtor__o{ display: none; }
  .cdx-oblozhka{ margin-bottom: 24px; }
}
/* Похожие статьи — карточки с картинкой слева, как в макете */
.cdx-pohozhie__zagolovok{ font-size: 28px; line-height: 34px; }
.cdx-pohozhie__kartochka{
  flex-direction: row; align-items: flex-start; gap: 16px; padding: 16px;
  background: #fff; border-radius: 12px;
}
.cdx-pohozhie__kartochka:hover{ box-shadow: 0 8px 24px rgba(23,33,38,.06); }
.cdx-pohozhie__foto{ flex: 0 0 112px; width: 112px !important; height: 112px !important; aspect-ratio: auto; border-radius: 8px; object-fit: cover; }
.cdx-pohozhie__tekst{ display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cdx-pohozhie__nazvanie{ font-family: var(--shrift-zag); font-size: 16px; line-height: 22px; font-weight: 700; }
.cdx-pohozhie__data{ font-size: 13px; line-height: 18px; color: var(--tekst-vtor); }
.cdx-pohozhie__dalee{ font-size: 14px; font-weight: 600; color: var(--akcent-tekst); margin-top: 4px; }
.cdx-pohozhie__kartochka:hover .cdx-pohozhie__dalee span{ display: inline-block; transform: translateX(4px); }
@media (max-width: 600px){ .cdx-pohozhie__foto{ flex-basis: 84px; width: 84px !important; height: 84px !important; } }

/* --- Страница услуги: первый экран (без правки шаблона) --------------------- */
.page-services .hero-price{
  font-family: var(--shrift-zag); font-weight: 700; font-size: 32px; line-height: 40px; margin: 20px 0 24px;
}
.page-services .hero-price .label-price{ font-family: var(--shrift-tekst); font-weight: 400; font-size: 16px; }
.page-services .hero-buttons{ display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; }
@media (max-width: 600px){
  .page-services .hero-price{ font-size: 26px; line-height: 32px; margin: 14px 0 18px; }
  .page-services .hero-buttons .lead-button{ width: 100%; }
}

/* --- Уточнения после снимков 21.09 ----------------------------------------- */
/* утреннее правило блога ставило рамку каждой ячейке с !important — перекрываем той же силой */
.single-post .page-content table th,
.single-post .page-content table td{ border: 0 !important; }
.single-post .page-content table tr + tr td,
.single-post .page-content table tbody tr td{ border-top: 1px solid var(--granica) !important; }
.single-post .page-content table tr:first-child td{ border-top: 0 !important; }
.single-post .page-content table th ~ th{ border-left: 1px solid rgba(255,255,255,.08) !important; }
@media (max-width: 600px){
  .single-post .page-content table.cdx-kartochki td,
  .single-post .page-content table.cdx-kartochki tr td{ border: 0 !important; }
  .single-post .page-content table.cdx-kartochki td:first-child{ border-bottom: 1px solid var(--granica-tonkaya) !important; }
}
/* ссылки в тексте — цвет акцента из ТЗ */
.page-content a:not(.lead-button):not(.btn-red-custom){ color: var(--akcent-tekst); text-underline-offset: 3px; }
.page-content a:not(.lead-button):not(.btn-red-custom):hover{ color: var(--akcent-navedenie); }
/* дата в строке под H1: тема ставила её курсивом вправо на всю ширину */
.cdx-statya__meta .date-post{
  width: auto !important; float: none !important; text-align: left !important;
  font-style: normal !important; margin: 0 !important; display: inline-block;
}
@media (max-width: 600px){
  /* заголовок карточки одинаков в чётных и нечётных строках */
  table.cdx-kartochki tr:nth-child(n) td:first-child{
    display: block; padding: 0 0 8px !important; margin-bottom: 4px;
    font-family: var(--shrift-zag); font-size: 16px; line-height: 22px; font-weight: 700; color: var(--tekst);
  }
}

/* --- Первый экран услуги: тёмный текст на светлой подложке (ТЗ: светлый экран,
   H1 до 700 px, без капса). Белый текст на светлом фото читался плохо. */
.section-first-screen{ position: relative; }
.section-first-screen::before{
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.82) 48%, rgba(255,255,255,0) 78%);
}
.section-first-screen > .container{ position: relative; z-index: 1; }
.section-first-screen h1{
  color: var(--tekst) !important; text-transform: none !important;
  font-size: 56px !important; line-height: 62px !important; font-weight: 700; max-width: 700px;
}
.section-first-screen .hero-price, .section-first-screen .hero-price *,
.section-first-screen #breadcrumbs, .section-first-screen #breadcrumbs span{ color: var(--tekst) !important; }
.section-first-screen .hero-price .label-price, .section-first-screen .price-label-value{ color: var(--tekst-vtor) !important; }
.section-first-screen #breadcrumbs a{ color: var(--akcent-tekst) !important; }
@media (max-width: 1199px){ .section-first-screen h1{ font-size: 48px !important; line-height: 54px !important; } }
@media (max-width: 600px){
  .section-first-screen::before{ background: rgba(255,255,255,.86); }
  .section-first-screen h1{ font-size: 34px !important; line-height: 39px !important; }
}
@media (max-width: 600px){
  /* таблица из двух столбцов («характеристика — значение»): не карточка на строку,
     а один список пар; подпись столбца не нужна — её роль играет первая ячейка */
  table.cdx-kartochki tr{ background: #fff !important; }
  table.cdx-kartochki--para{ border: 1px solid var(--granica) !important; border-radius: 10px; background: #fff; }
  table.cdx-kartochki--para tr{
    display: grid !important; grid-template-columns: minmax(0, 44%) minmax(0, 1fr); column-gap: 12px;
    border: 0; border-radius: 0; margin: 0; padding: 12px 16px;
    border-top: 1px solid var(--granica-tonkaya);
  }
  table.cdx-kartochki--para tr:first-child, table.cdx-kartochki--para tr.cdx-shapka + tr{ border-top: 0; }
  table.cdx-kartochki--para tr:nth-child(n) td:first-child{
    border: 0 !important; margin: 0; padding: 0 !important;
    font-family: var(--shrift-tekst); font-size: 13px; line-height: 18px; font-weight: 400; color: var(--tekst-vtor);
  }
  table.cdx-kartochki--para td{ display: block !important; padding: 0 !important; }
  table.cdx-kartochki--para td::before{ content: none !important; }
}
/* шапка лежит поверх первого экрана (position:absolute, низ ~195 px): при H1 в две
   строки центрирование поднимало заголовок под меню. Высота — по содержимому. */
.section-first-screen{ height: auto !important; min-height: 560px; padding-top: 236px !important; padding-bottom: 72px !important; }
@media (max-width: 600px){
  .section-first-screen{ min-height: 0; padding-top: 128px !important; padding-bottom: 44px !important; }
}

/* =============================================================================
   23.09.2026 — ВИЗУАЛЬНЫЙ АУДИТ (z-260923-13): 513 находок на 68 страницах,
   за ними 14 причин. Каждая правка ниже названа по причине, а не по странице.
   Прибор: .planning/lab/_vizual_audit.py, отчёт docs/polimernye-poly-vizualnyj-audit.html
   ========================================================================== */

/* --- Вторичный текст: #6F7A7E из ТЗ даёт 4,41 : 1 на белом — ниже нормы 4,5.
   Тот же тон на ступень темнее: 5,65 на белом, 5,34 на секции, 5,08 на плашке.
   Одна переменная закрывает таблицы на телефоне, даты похожих статей и блок автора. */
:root{ --tekst-vtor: #5E696D; }

/* --- Кнопка «Получить точный расчёт» / «Заказать замер»: надпись прижата к верху.
   Причина: класс Bootstrap .d-inline-block (display:inline-block !important)
   перебивал inline-flex кнопки, и при высоте 52 px и нулевом вертикальном поле
   выравнивание по центру не работало. */
.lead-button.d-inline-block{ display: inline-flex !important; }
.lead-button.d-block{ display: flex !important; }

/* --- Цена в карточках покрытий и кнопка «Получить расчёт» на «О нас»: синий
   Bootstrap #007BFF — 3,98 : 1. Переводим в акцент площадки. */
.text-primary{ color: var(--akcent-tekst) !important; }
.btn-primary{
  background-color: var(--akcent) !important; border-color: var(--akcent) !important;
  color: var(--na-akcente) !important;
}
.btn-primary:hover, .btn-primary:focus{
  background-color: var(--akcent-navedenie) !important; border-color: var(--akcent-navedenie) !important;
}

/* --- «Как мы работаем»: иконки. Файлы перерисованы (рисунок был 40–60 % холста
   и лежал на нарисованной «шахматке»), здесь — размер и подложка. */
img.etap-img{
  width: 72px; height: 72px; padding: 8px; box-sizing: border-box;
  background: var(--fon-tehn); border-radius: 12px; margin-bottom: 16px; object-fit: contain;
}
.etaps-block{ background: var(--fon); border: 1px solid var(--granica); border-radius: 12px; padding: 20px; }
span.etap-number{ color: var(--akcent-tekst); font-size: 28px; top: 16px; right: 20px; }

/* --- Иконки почты и телефона в шапке: 18 px, на телефоне без подписи —
   единственный знак ссылки. Поднимаем до 24 px, цель нажатия 44 px. */
.header-icon{ width: 24px !important; height: 24px !important; }
@media (max-width: 991px){
  .header-icon-link{ min-width: 44px; min-height: 44px; justify-content: center; }
}

/* --- Прямая речь: был обычный абзац без единого признака цитаты.
   Полоса акцента слева, своя плашка, свой кегль; подпись — отдельной строкой
   (<cite> ставит скрипт в footer.php). */
blockquote.spc-rech{
  margin: 28px 0; padding: 20px 24px 20px 26px;
  background: var(--fon-tehn); border-left: 4px solid var(--akcent);
  border-radius: 0 12px 12px 0;
}
blockquote.spc-rech p{
  margin: 0; font-size: 19px !important; line-height: 29px !important; color: var(--tekst) !important;
}
blockquote.spc-rech cite{
  display: block; margin-top: 12px; font-style: normal;
  font-size: 15px; line-height: 22px; font-weight: 600; color: var(--tekst-vtor);
}
@media (max-width: 600px){
  blockquote.spc-rech{ padding: 16px 16px 16px 18px; margin: 22px 0; }
  blockquote.spc-rech p{ font-size: 17px !important; line-height: 26px !important; }
}

/* --- Фото объекта на два экрана: вертикальный снимок 591×1280 растягивался
   на всю ширину колонки — 900×1949. Фото в тексте не выше 75 % окна
   (и не выше 680 px), ширина по пропорции, по центру. Размеры в разметке
   исправлены отдельно (_poly_razmery_kartinok.py). */
.page-content figure img,
.section-work figure img,
.entry-content figure img{
  width: auto !important; max-width: 100%; height: auto !important;
  max-height: min(75vh, 680px); margin: 0 auto; display: block;
}
.section-work figure{ margin: 28px 0; }
.section-work figure figcaption{ margin-top: 10px; color: var(--tekst-vtor); text-align: center; }
.page-content figure figcaption{ text-align: center; }

/* --- Лента блога: у обложек нет размеров — страница прыгает при загрузке.
   Обложки 16:9, место под них занимается заранее. Дата на фото белым без
   подложки читалась только на тёмном кадре. */
.blog-img{ position: relative; }
.blog-img img.img-fluid{ width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
span.date-on-photo-work{
  right: 27px; bottom: 12px; padding: 4px 10px; border-radius: 6px;
  background: var(--temnaya); color: #fff; font-size: 14px; line-height: 20px;
}

/* --- Мелкий текст на телефоне: порог чтения 14 px. ТЗ 360 давало 13 px
   хлебным крошкам, подписям и первой ячейке таблицы-списка. */
@media (max-width: 600px){
  small, .date-post, figcaption, #breadcrumbs, #breadcrumbs span{ font-size: 14px; line-height: 20px; }
  table.cdx-kartochki--para tr:nth-child(n) td:first-child{ font-size: 14px; line-height: 20px; }
}
.cdx-avtor__podpis{ font-size: 14px; }
.footer-rezhim{ font-size: 14px; line-height: 20px; }

/* --- Мобильное меню: «Виды полимерных покрытий» рвалось на две строки
   (18 px в выдвижной панели 288 px вместе со стрелкой). */
@media (max-width: 991px){
  .header-two .header-menu > li > a{
    font-size: 16px !important; white-space: nowrap; min-height: 48px;
    align-items: center; justify-content: space-between;
  }
}

/* --- Знак логотипа на телефоне: при высоте 36 px сам рисунок в файле — 23×16 px
   (вокруг поля), мельче порога иконки. 44 px: знак ~30 px, шапка не растёт. */
@media (max-width: 575px){
  .header-logo-wrap .logo-header, .logo-header{ height: 44px !important; width: auto; }
}

/* ══ 03.10.2026 — шаблон «Услуги — конструктор» (999.305 + 999.323) ═══════════════
   Макеты ChatGPT 21.09: первый экран 7/12 + 5/12, преимущества под кнопкой, этапы в ряд,
   требования двумя колонками, вопросы рядом с формой расчёта. Только классы cdx-k-*,
   старый шаблон services-template.php эти правила не задевают. */
.page-cdx-k .cdx-k-hero{ background: var(--fon-ekrana) !important; min-height: 0; padding-bottom: 48px !important; }
.page-cdx-k .cdx-k-hero::before{ display: none; }
.page-cdx-k .cdx-k-hero .bread-first-section{ position: static !important; top: auto !important; bottom: auto !important; height: auto !important; margin: 0 0 18px; }
.page-cdx-k .cdx-k-hero #breadcrumbs{ margin: 0; }
.cdx-k-hero__setka{ display: grid; grid-template-columns: 1fr; gap: 32px; align-items: center; }
.cdx-k-hero--dva .cdx-k-hero__setka{ grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.cdx-k-hero .info-first-screen{ max-width: 700px; padding: 0; }
.cdx-k-hero__lid{ font-size: 18px; line-height: 28px; color: var(--tekst-osn); margin: 14px 0 0; }
.cdx-k-hero .hero-price{ margin: 22px 0 22px; }
.cdx-k-hero__viz{ display: flex; justify-content: center; }
.cdx-k-hero__foto{ width: 100%; max-height: 420px; object-fit: cover; border-radius: 12px; }
.cdx-k-sloi{ width: 100%; max-width: 560px; height: auto; }
.cdx-k-sloi__n{ font: 600 14px/1 var(--shrift-tekst, Inter, sans-serif); fill: var(--tekst); }
.cdx-k-sloi__p{ font: 400 12px/1 var(--shrift-tekst, Inter, sans-serif); fill: var(--tekst-vtor); }
.cdx-k-plashka{ display: flex; gap: 12px; align-items: flex-start; margin: 18px 0 0; padding: 14px 16px; background: var(--fon-tehn); border: 1px solid var(--granica); border-radius: 10px; color: var(--tekst-osn); font-size: 15px; line-height: 22px; }
.cdx-k-plashka .cdx-k-ik{ flex: 0 0 22px; width: 22px; height: 22px; color: var(--akcent-tekst); }
.cdx-k-pochta{ display: inline-flex; gap: 10px; align-items: center; color: var(--akcent-tekst) !important; text-decoration: none !important; }
.cdx-k-pochta .cdx-k-ik{ width: 26px; height: 26px; }
.cdx-k-pochta span{ display: flex; flex-direction: column; line-height: 20px; }
.cdx-k-pochta small{ color: var(--tekst-vtor); font-size: 13px; }
.cdx-k-plus{ list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 24px; margin: 36px 0 0; padding: 22px 0 0; border-top: 1px solid var(--granica); }
.cdx-k-plus li{ display: flex; gap: 12px; align-items: flex-start; margin: 0; }
.cdx-k-plus__ik{ flex: 0 0 44px; height: 44px; border-radius: 50%; background: var(--fon-tehn); color: var(--akcent-tekst); display: flex; align-items: center; justify-content: center; }
.cdx-k-plus__ik .cdx-k-ik{ width: 22px; height: 22px; }
.cdx-k-plus b{ display: block; font-size: 15px; line-height: 20px; color: var(--tekst); }
.cdx-k-plus small{ display: block; font-size: 13px; line-height: 18px; color: var(--tekst-vtor); margin-top: 2px; }

.cdx-k-etapy__spisok{ list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding: 0; margin: 24px 0 0; counter-reset: none; }
.cdx-k-etap{ position: relative; display: grid; grid-template-columns: 40px 48px 1fr; grid-template-rows: 48px auto; gap: 12px 10px; align-items: center; align-content: start; margin: 0; }
.cdx-k-etap:not(:last-child)::after{ content: "→"; position: absolute; right: -18px; top: 12px; color: var(--tekst-vtor); font-size: 20px; }
.cdx-k-etap__n{ width: 40px; height: 40px; border-radius: 50%; background: var(--fon-tehn); color: var(--akcent-tekst); font: 700 18px/40px var(--shrift-zag, Manrope, sans-serif); text-align: center; }
.cdx-k-etap__ik{ width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--granica); color: var(--akcent-tekst); display: flex; align-items: center; justify-content: center; }
.cdx-k-etap__ik .cdx-k-ik{ width: 24px; height: 24px; }
.cdx-k-etap__t{ grid-column: 1 / -1; }
.cdx-k-etap__t b{ display: block; color: var(--tekst); font-size: 16px; line-height: 22px; }
.cdx-k-etap__t span{ display: block; color: var(--tekst-vtor); font-size: 14px; line-height: 20px; margin-top: 4px; }

.cdx-k-treb__kol{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 24px; }
.cdx-k-check{ list-style: none; margin: 0; padding: 18px 22px; background: var(--fon); border: 1px solid var(--granica); border-radius: 12px; }
.cdx-k-check li{ position: relative; padding: 9px 0 9px 32px; border-bottom: 1px solid var(--granica-tonkaya); margin: 0; color: var(--tekst-osn); }
.cdx-k-check li:last-child{ border-bottom: 0; }
.cdx-k-check li::before{ content: ""; position: absolute; left: 0; top: 11px; width: 20px; height: 20px; border-radius: 50%; background: var(--fon-tehn) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315736F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat; }
.cdx-k-check--mal{ display: block; padding: 0; border: 0; background: none; margin: 8px 0; }
.cdx-k-check--mal span{ position: relative; display: block; padding: 3px 0 3px 22px; font-size: 14px; line-height: 19px; color: var(--tekst-osn); }
.cdx-k-check--mal span::before{ content: ""; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; border-radius: 50%; background: var(--fon-tehn) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315736F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-8'/%3E%3C/svg%3E") center/10px no-repeat; }
.cdx-k-treb__prim{ margin: 18px 0 0; color: var(--tekst-vtor); font-size: 15px; }
.cdx-k-pokazat{ display: none; margin: 12px 0 0; padding: 0; border: 0; background: none; color: var(--akcent-tekst); text-decoration: underline; font-size: 15px; cursor: pointer; }

.cdx-k-vidy__setka{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.cdx-k-karta{ display: flex; gap: 16px; padding: 20px; background: var(--fon); border: 1px solid var(--granica); border-radius: 12px; text-decoration: none !important; color: var(--tekst-osn) !important; transition: border-color .15s, box-shadow .15s; }
.cdx-k-karta:hover{ border-color: var(--akcent-tekst); box-shadow: 0 6px 18px rgba(23,42,42,.08); }
.cdx-k-karta__viz{ flex: 0 0 120px; display: flex; align-items: center; justify-content: center; color: var(--akcent-tekst); }
.cdx-k-karta__viz img{ width: 120px; height: 100px; object-fit: cover; border-radius: 8px; }
.cdx-k-karta__viz > .cdx-k-ik{ width: 48px; height: 48px; }
.cdx-k-sloi--mal{ width: 120px; }
.cdx-k-karta__t b{ display: block; color: var(--tekst); font-size: 17px; line-height: 23px; }
.cdx-k-karta__cena{ display: block; color: var(--tekst); font-weight: 600; margin-top: 6px; }
.cdx-k-karta__dalee{ display: inline-block; margin-top: 8px; color: var(--akcent-tekst); text-decoration: underline; font-size: 15px; }

.cdx-k-faq__setka{ display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px; align-items: start; }
.cdx-k-faq .card-header h3{ margin: 0; font-size: inherit; }
.cdx-k-faq__forma{ position: sticky; top: 24px; padding: 28px; background: var(--fon-sekcii); border: 1px solid var(--granica); border-radius: 12px; }
.cdx-k-faq__fzag{ font-size: 26px !important; line-height: 32px !important; margin: 0 0 10px; }
.cdx-k-faq__forma p{ color: var(--tekst-vtor); font-size: 15px; line-height: 22px; }
.cdx-k-faq__forma .wpcf7 input:not([type=checkbox]):not([type=submit]), .cdx-k-faq__forma .wpcf7 textarea{ width: 100% !important; max-width: 100% !important; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--granica); border-radius: 8px; background: #fff; }
.cdx-k-faq__forma textarea{ max-height: 120px; }

@media (max-width: 991px){
  .cdx-k-hero--dva .cdx-k-hero__setka, .cdx-k-faq__setka{ grid-template-columns: 1fr; }
  .cdx-k-plus{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cdx-k-etapy__spisok{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cdx-k-etap::after{ display: none; }
  .cdx-k-vidy__setka{ grid-template-columns: 1fr 1fr; }
  .cdx-k-faq__forma{ position: static; }
}
@media (max-width: 600px){
  .cdx-k-hero__lid{ font-size: 16px; line-height: 24px; }
  .cdx-k-hero__viz{ order: 2; }
  .cdx-k-hero .hero-buttons{ flex-direction: column; align-items: stretch; }
  .cdx-k-plus{ grid-template-columns: 1fr; gap: 10px; margin-top: 24px; padding-top: 16px; }
  .cdx-k-plus__ik{ flex-basis: 36px; height: 36px; }
  .cdx-k-plus small{ display: none; }
  .cdx-k-etapy__spisok{ grid-template-columns: 1fr; gap: 12px; }
  .cdx-k-etap{ grid-template-columns: 36px 1fr; grid-template-rows: auto; }
  .cdx-k-etap__n{ width: 36px; height: 36px; line-height: 36px; font-size: 16px; }
  .cdx-k-etap__ik{ display: none; }
  .cdx-k-etap__t{ grid-column: 2; }
  .cdx-k-etap__t span{ display: none; }
  .cdx-k-treb__kol{ grid-template-columns: 1fr; gap: 0; }
  .cdx-k-treb__kol .cdx-k-check{ border-radius: 12px 12px 0 0; }
  .cdx-k-treb__vtoraya{ display: none; }
  .cdx-k-raskryto .cdx-k-treb__vtoraya{ display: block; border-top: 0; border-radius: 0 0 12px 12px; }
  .cdx-k-pokazat{ display: inline-block; }
  .cdx-k-vidy__setka{ grid-template-columns: 1fr; gap: 16px; }
  .cdx-k-karta{ padding: 14px; }
  .cdx-k-karta__viz{ flex-basis: 96px; }
  .cdx-k-sloi--mal, .cdx-k-karta__viz img{ width: 96px; }
  .cdx-k-faq__forma{ padding: 20px 16px; }
}

/* ── 03.10.2026 (999.323): карточки с иконкой — ограничения, позиция подрядчика, смета ── */
.cdx-k-kart__spisok{ list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; padding: 0; margin: 24px 0 0; }
.cdx-k-kart__spisok--5{ grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.cdx-k-kart__spisok--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cdx-k-kart__spisok li{ margin: 0; padding: 22px 20px; background: #fff; border: 1px solid var(--liniya, #dfe5e8); border-top: 3px solid var(--akcent-tekst); border-radius: 10px; }
.cdx-k-kart__ik{ display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--fon-tehn); color: var(--akcent-tekst); margin-bottom: 14px; }
.cdx-k-kart__ik .cdx-k-ik{ width: 22px; height: 22px; }
.cdx-k-kart__spisok h3{ font-size: 17px; line-height: 24px; margin: 0 0 8px; color: var(--tekst); text-transform: none; }
.cdx-k-kart__spisok p{ font-size: 15px; line-height: 22px; margin: 0; color: var(--tekst-osn); }
@media (max-width: 1199px){ .cdx-k-kart__spisok--5{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px){ .cdx-k-kart__spisok, .cdx-k-kart__spisok--5, .cdx-k-kart__spisok--4{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px){ .cdx-k-kart__spisok, .cdx-k-kart__spisok--5, .cdx-k-kart__spisok--4{ grid-template-columns: 1fr; gap: 12px; }
  .cdx-k-kart__spisok li{ display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; padding: 16px; }
  .cdx-k-kart__ik{ grid-row: span 2; margin: 0; } .cdx-k-kart__spisok p{ grid-column: 2; } }
/* Шапка: «Написать нам» — кнопкой, как на макете */
.header-right-wrap .cdx-shapka-knopka{ background: var(--akcent-tekst); color: #fff !important; padding: 10px 18px; border-radius: 8px; font-weight: 600; text-decoration: none !important; min-height: 44px; display: inline-flex; align-items: center; }
.header-right-wrap .cdx-shapka-knopka:hover{ filter: brightness(.92); }
.header-right-wrap .cdx-shapka-knopka .header-icon{ stroke: #fff !important; color: #fff; }
@media (min-width: 992px){ .header-right-wrap .cdx-shapka-knopka .header-icon{ display: none; } }
@media (max-width: 991px){ .header-right-wrap .cdx-shapka-knopka{ padding: 10px; } }