/* ============================================================
   Слой 9 — натяжка дизайна (макет v4). ТОЛЬКО оформление.
   Грузится ПОВЕРХ style.css. Логику/разметку не меняет.
   ============================================================ */

/* Резерв места под вертикальный скроллбар ВСЕГДА → ширина вьюпорта не скачет при раскрытии «показать ещё»/аккордеонов
   (короткая страница без скроллбара была шире → центрированный контейнер смещался → отступы прыгали). Фикс на весь сайт. */
html{ scrollbar-gutter: stable; }

/* ★ W1-P01 (волна 1, пакет токенов) — LEGACY-СЛОЙ ПРИВЕДЁН К ДИЗАЙН-СИСТЕМЕ.
   Источник целевых значений: «Справочник вёрстки» (CLAUDE.md архива макета), §-ссылки в строках.
   Единый источник правды палитры и шкал — assets/ok-tokens.css (собран пакетом HC-02 по тому же
   справочнику). Здесь переменные legacy-слоя переведены на него алиасами `var(--ok-*, <прежний литерал>)`.

   ЗАЧЕМ АЛИАС, А НЕ ПРОСТО НОВЫЙ ЛИТЕРАЛ: до этого пакета палитра объявлялась ДВАЖДЫ — в ok-tokens.css
   по справочнику и здесь литералами. Два источника правды неизбежно разъезжаются; алиас оставляет один.
   ЗАЧЕМ ФОЛБЭК В var(): design.css подключается РАНЬШЕ ok-tokens.css. На разрешение custom properties
   порядок листов не влияет (вычисляются на этапе computed value), но если ok-tokens.css почему-то не
   подключится, сайт останется в прежнем виде, а не потеряет палитру целиком.
   Полная таблица «было → стало → §ДС → геометрический ли» — evidence/w1-p01/tokens-diff.md.           */
:root{
  --graphite:#1e2330;   /* тёмный герой/секции — ДС §2 «кнопка калькулятора», совпадает */
  --graphite-2:#161a24; /* подвал, тёмные полосы — вне ДС, не трогаем */
  --card-dark:#262c3a;  /* тёмные карточки — вне ДС, не трогаем */
  --ink:var(--ok-ink,#123d87);          /* ДС §2 — значение не менялось, переведено на алиас */
  --blue:var(--ok-blue,#1c5bd6);        /* ДС §2 — значение не менялось */
  --blue-hover:var(--ok-blue-hover,#1448aa); /* ★ НОВАЯ. ДС §2: «#1448aa — hover ссылок». В legacy-слое
                                           переменной не было вовсе, a:hover брал --ink (#123d87) */
  --blue-soft:var(--ok-tint-blue,#eef3fc);   /* ДС §2 тинт — значение не менялось */
  --red:var(--ok-red,#e0223a);          /* ДС §2 — значение не менялось */
  --text:var(--ok-text,#1d2433);        /* ★ ИЗМЕНЕНО #1c2433 → #1d2433. ДС §2 «основной тёмный» */
  --muted:var(--ok-text-2,#526173);     /* ★ ИЗМЕНЕНО #6b7686 → #526173. ДС §2 «вторичный / абзацы».
                                           172 использования — самый широкий из изменённых токенов */
  --muted-d:#9aa4b6;    /* приглушённый на тёмном — ДС §2 даёт ровно #9aa4b6, совпадает */
  --line:var(--ok-border,#e8ecf2);      /* ДС §2 «рамка карточек» — значение не менялось */
  --line-d:#363d4d;     /* границы на тёмном — вне ДС, не трогаем */
  /* таблицы (единый компонент .okna-table) */
  --tbl-border:#d8dfea; /* внешняя рамка таблицы */
  --tbl-grid:#e3e9f2;   /* линии сетки между ячейками (гориз.+вертик., один цвет) */
  --tbl-head-bg:#eef3fb;/* заливка шапки */
  --tbl-head-ink:#123d87;
  --tbl-ink:#123d87;    /* текст ячеек */
  --tbl-muted:#8a97ab;  /* вторичный текст (модель, «по запросу», метки) */
  --bg:var(--ok-section-a,#ffffff);    /* ★ ОТКАТ §2.3 ПОЧИНКА ВЁРСТКИ (реш. владельца B, 14.08): #eef1f6 → #ffffff.
                                           --ok-bg (#eef1f6) НЕ трогаем — его прямые потребители (about-teaser,
                                           границы ok-header, ok-home-w2/w4, гарантия) законно серые. Историческое W5-P05 06.08 (#ffffff → #eef1f6),
                                           ДС §2 «фон страницы». --bg красит html/body/.site (подложка).
                                           Основание — замер: реальных дыр 0 на 14 типах + 13 услуг,
                                           поля/таблицы/модалки остаются белыми. Прежний STOP (D-22)
                                           ловил риск, которого нет. ОТКАТ = вернуть эту строку на
                                           var(--ok-section-a,#ffffff). */
  --bg-soft:var(--ok-section-b,#f5f8fd);/* ★ ИЗМЕНЕНО #f6f8fb → #f5f8fd. ДС §2: «секции чередуются
                                           #ffffff ↔ #f5f8fd» */
  --r:var(--ok-radius-dropdown,10px);   /* ДС §8 шкала — значение не менялось */
  --r-lg:var(--ok-radius-card,16px);    /* ДС §8 «стандартная карточка/модалка» — не менялось */
  --btn-r:var(--ok-radius-btn,4px);     /* ДС §8 «синие компактные кнопки/нав» — не менялось */
  /* ★ W1-P01B — МИГРАЦИЯ КОНТЕЙНЕРА. 1200px → 1216px, канон ДС §4
     (рамка 1280 / боковой отступ 32 → контент 1216). Решение Архитектора, D-25 вариант А.
     ЕДИНАЯ ширина контента блоков; менять ЗДЕСЬ, в одном месте. Контейнеры считают
     рамку как max-width:calc(var(--okna-cw) + 2·padding).

     ЧТО ФАКТИЧЕСКИ СДВИНУЛОСЬ (симуляция в рантайме + замер 23 страниц до правки):
       · 250 контейнеров из 262 УЖЕ стояли на контенте 1216 — их ширину задаёт новый слой
         (--ok-container-max/--ok-container-pad через .ok-container и ok-legacy-compat.css §5),
         а не эта переменная. Они не сдвинулись ни на пиксель;
       · сдвинулись ровно те контейнеры, которые ok-legacy-compat.css §5 сознательно исключил
         из приведения к канону: тело услуги (.okna-usluga, FORBID по 03-карте), её .okna-wrap,
         и единичные контейнеры 404/посадочных. Контент 1200 → 1216 — то есть они ДОГНАЛИ канон;
       · шапка на всех 20 проверенных страницах давала контент 1216 и до правки — «шапка шире
         тела на 16px» существовала только на услуге, где тело оставалось 1200.

     ЧТО НЕ СДВИНУЛОСЬ (проверено симуляцией до правки, подтверждено замером после):
       · .okna-reviews__grid на Главной и ГЕО: `600px 600px` — как было. Ожидание §2 пакета
         «станет 608px 608px» не реализуется, потому что этот контейнер давно не читает
         --okna-cw. Разбор и числа — evidence/w1-p01b/inverse-recount.md;
       · мобильные режимы: карточка отзыва 280px, scroll-snap-type:x mandatory, overflow-x:auto,
         .ok-guar__grid:none, 4 карточки гарантии — без изменений на 375.

     ⚠ СЛЕДСТВИЕ ДЛЯ ОТКАТА: ok-legacy-compat.css §5 держал канон ПОД ФЛАГОМ body.ok-shell
     именно чтобы флаг оставался полным откатом геометрии. После этой правки снятие флага
     больше не возвращает исключённые контейнеры на 1200 — откат только `git revert`. */
  --okna-cw:1216px;
  --shadow:var(--ok-shadow-soft,0 10px 30px rgba(20,40,80,.05));       /* ★ ИЗМЕНЕНО с 0 10px 36px rgba(20,30,55,.08). ДС §9 «мягкая карточка» */
  --shadow-lg:var(--ok-shadow-card-hover,0 14px 40px rgba(20,40,80,.14)); /* ★ ИЗМЕНЕНО с 0 26px 64px rgba(20,30,55,.16). ДС §9 «hover карточки / дропдаун» */
  --shadow-sm:0 6px 20px rgba(20,30,55,.06); /* D0-1 (DESIGN-REALIZ): был ПРИЗРАК — объявлен только в админ-скоупе (menu-admin.php), на :root фронта пусто → box-shadow:none на .gv-card/.okna-bm__card и др. (7 мест без фолбэка); канон одной строкой, унифицирует 4 ad-hoc фолбэка */
  --r-xl:var(--ok-radius-feature,22px); /* D0-1: радиус-22 (крупные плашки: FAQ, hero-карточки) сведён в токен из хардкода. W1-P01: ДС §8 «фиче-карточки, О компании» — значение не менялось */
}

/* ===== ЕДИНЫЙ КРЕСТИК ЗАКРЫТИЯ ПОПАПОВ (UI-кит, эталон — лайтбокс) ============================
 * Один стиль для всех попапов: белый круглый бокс 40×40 (мобайл 38), тонкая SVG-иконка X (цвет --ink),
 * hover — синяя заливка + белая иконка. !important — перебить базовые button-стили ТТ1. Иконка — okna_close_icon_svg().
 * Визуал общий для .okna-modal__close (угол панели) и .okna-city-modal__close (гео — позиция inline своя). */
.okna-modal__close,
.okna-city-modal__close{ width:40px; height:40px; padding:0; display:flex; align-items:center; justify-content:center;
  border:0; border-radius:50%; cursor:pointer; background:#fff; color:var(--ink,#123d87);
  box-shadow:0 6px 20px rgba(18,61,135,.18); transition:background-color .15s ease, color .15s ease; }
.okna-modal__close:hover,
.okna-city-modal__close:hover{ background:var(--blue,#1c5bd6); color:#fff; }
.okna-modal__close:focus-visible,
.okna-city-modal__close:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-modal__close svg,
.okna-city-modal__close svg{ width:20px; height:20px; display:block; }
/* .okna-modal__close — в углу панели (panel overflow:hidden гарантирует, что не вылезет) */
.okna-modal__close{ position:absolute; top:14px; right:14px; z-index:5; }
@media (max-width:600px){ /* D0-3: чужой брейкпоинт 560 приведён к канону 600 (SM) */
  .okna-modal__close{ width:38px; height:38px; top:8px; right:8px; }
  .okna-city-modal__close{ width:38px; height:38px; }
}

/* ===== ЕДИНЫЙ КОМПОНЕНТ ТАБЛИЦЫ (.okna-table) — ровная полная сетка ==========================
 * Обёртка .okna-table-wrap даёт внешнюю рамку (--tbl-border) + скруглённый контур (overflow:hidden).
 * Внутри — полная сетка одного цвета (--tbl-grid) по гориз. И вертик.; внешние грани ячеек сняты,
 * их роль играет рамка обёртки (без двойных линий). !important гасит границы table/th/td темы ТТ1.
 * Страничная специфика (ширины колонок, красная цена, бейдж наличия, фото-ячейка) — в своих файлах. */
.okna-table-wrap{ border:1px solid var(--tbl-border); border-radius:14px; overflow:hidden; background:#fff; }
.okna-table{ width:100%; border-collapse:collapse; background:#fff; color:var(--tbl-ink); font-size:14.5px; }
.okna-table th,
.okna-table td{ border:1px solid var(--tbl-grid) !important; padding:13px 16px; text-align:left; vertical-align:middle; }
/* шапка: лёгкая голубая заливка, ink, uppercase */
.okna-table thead th{ background:var(--tbl-head-bg); color:var(--tbl-head-ink); font-size:12px; font-weight:800;
  text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; }
.okna-table tbody tr:hover{ background:#f7faff; }
.okna-table .okna-tbl-muted{ color:var(--tbl-muted); }
/* внешние грани ячеек снимаем — внешний контур задаёт рамка обёртки (#d8dfea), внутри только сетка (#e3e9f2) */
.okna-table tr > *:first-child{ border-left:0 !important; }
.okna-table tr > *:last-child{ border-right:0 !important; }
.okna-table thead tr:first-child > *{ border-top:0 !important; }                  /* верх таблицы с шапкой */
.okna-table:not(:has(thead)) tbody tr:first-child > *{ border-top:0 !important; } /* верх таблицы без шапки */
.okna-table tbody tr:last-child > *{ border-bottom:0 !important; }                /* низ таблицы */

/* мобайл-режим «карточки-строки» — модификатор .okna-table--cards (для широких таблиц с data-label) */
@media (max-width:600px){ /* D0-3: чужой брейкпоинт 560 приведён к канону 600 (SM) */
  .okna-table-wrap.is-cards{ overflow:visible; border:0; background:transparent; border-radius:0; }
  .okna-table--cards{ min-width:0 !important; }
  .okna-table--cards thead{ display:none; }
  .okna-table--cards, .okna-table--cards tbody{ display:block; }
  .okna-table--cards tr{ display:block; background:#fff; border:1px solid var(--tbl-border) !important; border-radius:var(--ok-radius-card,16px); padding:12px 14px; margin:0 0 12px; }
  .okna-table--cards td{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:6px 0 !important; border:0 !important; }
  .okna-table--cards td::before{ content:attr(data-label); font-size:12px; font-weight:700; color:var(--tbl-muted); flex:0 0 auto; }
  .okna-table--cards td[data-label=""]::before{ display:none; }
}

/* ===== База ===== */
body,
.site,
button,
input,
select,
textarea{
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
html,
body,
.site{ background:var(--bg); color:var(--text); }
/* ★ W5-P05 (закрытие латентности, решение владельца 06.08): body ДОЛЖЕН нести подложку сам.
   Строка выше для body ПРОИГРЫВАЕТ: twentytwentyone/style.css грузится дважды, и его
   `body{ background:var(--global--color-background) }` (#d1e4dd — зелёный TT1) при РАВНОЙ
   специфичности (0,0,0,1) побеждает ПОРЯДКОМ загрузки. Бьём СПЕЦИФИЧНОСТЬЮ (html body = 0,0,0,2),
   БЕЗ нового !important — тот же приём, что строкой ниже (html body для шрифта). Латентность:
   шаблон без обёртки .site иначе показал бы чужой зелёный, и причину искали бы в наших правках.
   Видимый фон (.site поверх body) НЕ меняется — только сам body догоняет подложку. */
html body{ background-color:var(--ok-section-a,#ffffff); } /* ★ ОТКАТ §2.3 ПОЧИНКА 14.08: #eef1f6 → #ffffff (в паре с --bg) */
/* ★ W1-P01 · ГЕОМЕТРИЧЕСКИЙ ТОКЕН: интерлиньяж корпуса 1.6 → 1.55 (ДС §3 «Текст карточки / body —
   line-height:1.55»). Влияет на ВЫСОТУ текстовых блоков, ширины не затрагивает вовсе — поэтому ни одна
   строка запрещённой дельты INVERSE (там только display / grid-template-columns / overflow-x /
   scroll-snap-type и ширины карточек 280·343·598·600) пострадать не может. */
body{ line-height:var(--ok-lh-body,1.55); overflow-x:clip; } /* guard от гор. скролла при full-bleed-секциях (clip не ломает position:sticky) */

a{ color:var(--blue); }
/* ★ W1-P01: ДС §2 «#1448aa — hover ссылок». Было --ink (#123d87) — тёмно-синий заголовочный. */
a:hover{ color:var(--blue-hover); }

h1,h2,h3,h4,h5,h6{
  font-family:'Manrope',system-ui,sans-serif;
  font-weight:800;
  /* ★ W1-P01 · ГЕОМЕТРИЧЕСКИЙ ТОКЕН: трекинг −.02em → −.01em (ДС §3, строка «H2 секции»).
     Влияет на ШИРИНУ строки заголовка и, как следствие, на точку переноса. */
  letter-spacing:var(--ok-ls-h2,-.01em);
  /* ★ W1-P01: ДС §3 — H2 и H4 цвета #123d87 (фирменный тёмно-синий), а не цвет корпуса. */
  color:var(--ink);
  line-height:1.18;
}

/* ★ D0-2 (DESIGN-REALIZ) — TT1-ПЕРЕБИВКА КОРПУСА И ЗАГОЛОВКОВ НА MANROPE.
   Родительская Twenty Twenty-One грузится ПОСЛЕ наших листов и при РАВНОЙ специфичности (0,0,1)
   перебивала ПОРЯДКОМ: корпус и заголовки уезжали на системный стек TT1, а не на фирменный Manrope.
   Замер live ДО (гость, 1920 и 375): body=Helvetica Neue 20px, h2=-apple-system — Manrope не применялся нигде.
   Поднимаем спецификой html-родителя (0,0,2 / 0,0,3) — весь сайт реально на Manrope, независимо от порядка.
   НЕ !important: специфичности достаточно (правило M-0 «перебивать спецификой, не порядком»). */
html body, html .site{ font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif; }
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6{
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
/* Волна 4 §7.3: родитель TT1 ставит СПИСКАМ (ul/ol/li) и ЗАГОЛОВКАМ ТАБЛИЦ (th) системный шрифт (style.css:2636/3428, Manrope не в цепочке). Тема-потомок перебивала только `.ok-scope ul` под флагом; th не покрыт нигде → системный шрифт на 11 из 13 типов. Нейтрализуем родителя ОДИН раз, без перечня типов: (0,0,3) бьёт TT1 (0,0,1) специфичностью (в т.ч. второй экземпляр двойной загрузки). */
html body ul, html body ol, html body li, html body dl, html body dt, html body dd,
html body th, html body .wp-block-table th{ font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif; }

/* ЕДИНЫЙ КОНТЕЙНЕР всех внутренних страниц (услуги / каталог-посадочные / марка / модель / b2b / гео / цены /
   транспорт / абонент) — ширина КАК НА ГЛАВНОЙ: max-width 1200 + padding 40 → контент 1120. ВШИТО В ШАБЛОН:
   одинаково для всех страниц, включая новые. Раньше было 1080 (узкая колонка услуги) → разнобой с главной (владелец).
   Спец. 0,1,0 + !important бьёт style.css/TT1. Full-bleed hero (.okna-uhero 100vw) от этого не зависит. */
.okna-usluga{ max-width:calc(var(--okna-cw) + 80px) !important; width:100%; margin:0 auto; padding-left:40px; padding-right:40px; box-sizing:border-box; }
.page-template-tpl-usluga .okna-usluga{ padding-left:40px; padding-right:40px; }  /* услуга — та же ширина 1200/40 */
.okna-usluga h2{ font-size:28px; margin:0 0 18px; }
.okna-usluga h3{ font-size:20px; }

/* ===== Кнопки (палитра — см. ДИЗАЙН_ГАЙД.md раздел 3) =====
   .okna-btn            = СИНЯЯ (дефолт): целевое/помощь с выбором в глубине страницы.
   .okna-btn--hero      = КРАСНАЯ: ТОЛЬКО главный CTA первого экрана (1 красная на страницу).
   .okna-btn.secondary  = БЛЕДНАЯ (контур синий; на тёмном — белый контур): навигация/вторичное. */
.okna-btn{
  background:var(--blue);
  color:#fff;
  border:1px solid var(--blue);
  border-radius:var(--ok-radius-btn,4px); /* Волна 7 §10: --btn-r→новое поколение */
  padding:13px 24px;
  font-size:15px;              /* ЕДИНАЯ БАЗА размера (раньше не задан → наследовался и «плыл» до 20px). Карточки/--sm задают свой явно. */
  font-weight:700;
  letter-spacing:.01em;
  box-shadow:0 6px 18px rgba(28,91,214,.22);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
/* ===== СОСТОЯНИЯ КНОПОК: ЕДИНЫЙ ИСТОЧНИК + защита от темы TT1.
   КОРЕНЬ ПРОБЛЕМЫ: большинство кнопок — ССЫЛКИ <a class="okna-btn"> (а не <button>). Родительская тема
   Twenty Twenty-One высокоспецифичными правилами перекрашивала a-кнопки на :hover/:active → «белели-пустые».
   Раньше перебой был только для <button> и только в покое. ФИКС: целим a И button явно + !important на цвет
   во ВСЕХ состояниях. ПОКОЙ синяя залитая · HOVER инверсия · ACTIVE темнеет(ink)+вдавл · FOCUS-VISIBLE обводка. ===== */

/* СИНЯЯ (база, покой) */
a.okna-btn:not(.okna-btn--hero):not(.secondary),
button.okna-btn:not(.okna-btn--hero):not(.secondary),
.okna-btn:not(.okna-btn--hero):not(.secondary){
  background:var(--blue) !important; color:#fff !important; border:1px solid var(--blue) !important; text-decoration:none;
}
/* HOVER — инверсия */
a.okna-btn:not(.okna-btn--hero):not(.secondary):hover,
button.okna-btn:not(.okna-btn--hero):not(.secondary):hover,
.okna-btn:not(.okna-btn--hero):not(.secondary):hover{
  background:#fff !important; color:var(--blue) !important; border-color:var(--blue) !important;
  box-shadow:0 6px 18px rgba(28,91,214,.18);
}
/* ACTIVE — темнеет + вдавливание (:active и :hover:active — бить hover при зажатии над кнопкой) */
a.okna-btn:not(.okna-btn--hero):not(.secondary):active,
a.okna-btn:not(.okna-btn--hero):not(.secondary):hover:active,
button.okna-btn:not(.okna-btn--hero):not(.secondary):active,
button.okna-btn:not(.okna-btn--hero):not(.secondary):hover:active,
.okna-btn:not(.okna-btn--hero):not(.secondary):active{
  background:var(--ink) !important; color:#fff !important; border-color:var(--ink) !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(18,61,135,.25);
}
.okna-btn:not(.okna-btn--hero):focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
/* МОДИФИКАТОР --sm: компактнее для вторичных мест (карточки и т.п.). ТОЛЬКО размер — цвета/состояния от .okna-btn. */
.okna-btn.okna-btn--sm{ padding:9px 16px; font-size:14px; box-shadow:0 4px 12px rgba(28,91,214,.18); }
/* HERO-CTA — чуть крупнее базы (первый экран), но не «гигант» 20px. */
.okna-hero .okna-btn{ font-size:16px; }

/* OUTLINE (.secondary) — покой */
a.okna-btn.secondary,
button.okna-btn.secondary,
.okna-btn.secondary{
  background:#fff !important; color:var(--blue) !important; border:1px solid var(--blue) !important; box-shadow:none; text-decoration:none;
}
/* OUTLINE HOVER — заливка синим/белый текст */
a.okna-btn.secondary:hover,
button.okna-btn.secondary:hover,
.okna-btn.secondary:hover{
  background:var(--blue) !important; color:#fff !important; border-color:var(--blue) !important;
}
/* OUTLINE ACTIVE — темнее (ink) */
a.okna-btn.secondary:active,
a.okna-btn.secondary:hover:active,
button.okna-btn.secondary:active,
button.okna-btn.secondary:hover:active,
.okna-btn.secondary:active{
  background:var(--ink) !important; color:#fff !important; border-color:var(--ink) !important; transform:translateY(1px);
}
.okna-btn.secondary:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }

/* КРАСНАЯ HERO — одна на странице; тоже с !important от темы */
a.okna-btn--hero,
.okna-btn--hero{
  background:var(--red) !important; color:#fff !important; border:1px solid var(--red) !important;
  box-shadow:0 6px 18px rgba(224,34,58,.22); text-decoration:none;
}
a.okna-btn--hero:hover,
.okna-btn--hero:hover{ background:#c81a30 !important; color:#fff !important; border-color:#c81a30 !important; box-shadow:0 10px 26px rgba(224,34,58,.30); }
a.okna-btn--hero:active,
a.okna-btn--hero:hover:active,
.okna-btn--hero:active{ background:#a51124 !important; color:#fff !important; border-color:#a51124 !important; transform:translateY(1px); }
.okna-btn--hero:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }

/* ===== Поля ввода и формы (Contact Form 7 + подбор) ===== */
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],
input[type=search],input[type=date],textarea,select,
.wpcf7 input,.wpcf7 textarea,.wpcf7 select,.okna-filter select{
  border:1px solid var(--line);
  border-radius:var(--ok-radius-field,8px); /* Волна 1-бис: 6px отменён (нет ни в одном из 24 макетов при 273 полях) → роль поля 8px. Поле поиска перебивается своим классом на 10px. */
  padding:10px 12px;
  background:#fff;
  color:var(--text);
  font-size:15px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
input:focus,textarea:focus,select:focus,
.wpcf7 input:focus,.wpcf7 textarea:focus,.wpcf7 select:focus,.okna-filter select:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(28,91,214,.15);
}
.wpcf7 input[type=submit],.wpcf7-submit{
  background:var(--red);
  color:#fff;
  border:none;
  border-radius:var(--ok-radius-btn,4px); /* Волна 7 §10: --btn-r→новое поколение */
  padding:13px 26px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(224,34,58,.22);
  transition:transform .15s ease, background .15s ease;
}
.wpcf7 input[type=submit]:hover,.wpcf7-submit:hover{ background:#c81a30; transform:translateY(-2px); }
/* K ПОКАЗУ п.5: submit-кнопки CF7 («Отправить заявку», «Запросить цену») во ВСЕХ попапах и формах рендерились системным -apple-system — родительская TT1 `input[type=submit]{font-family:var(--button--font-family)}` (0,1,1) перебивала element-level Manrope из design.css. Поднимаем спецификой до (0,2,1); кнопка «Получить консультацию» (.okna-wf-consult) ловила Helvetica — тоже к доминанте (Manrope). */
.wpcf7 input.wpcf7-submit,button.okna-wf-consult{ font-family:Manrope,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }

/* ===== Единый дизайн CF7-форм (мокап «Оформление заявки», токены v4). Применяется ко ВСЕМ формам. ===== */
.wpcf7 .okna-cf7-row{ margin:0 0 14px; }
/* ПОКАЗ 09.08: поля-`<p>` попапов без контекстного правила отступа (order-modal: .okna-fleet-*) шли с margin:0 → поля слипались (телефон вплотную к textarea). Единый нижний зазор 14px ВСЕМ CF7-полям-`<p>`. Формы со своим правилом (.okna-cf7-row / .okna-pm / .okna-hero-card / .single-steklo, спецификация выше) сохраняют свой зазор — двойного нет. */
.wpcf7 p{ margin:0 0 14px; }
/* ★№26 §1: попап «Подобрать по фото» .okna-pm стал СКВОЗНЫМ (wp_footer, usluga-picker.php) — печатается на всех
   страницах с кнопкой .okna-pm-open, включая /ceny/ (ok-ceny.css .okna-pm не грузил). База .okna-modal/бокс 460 —
   ok-modal.css (глобально), форма-p — 14px выше. Сюда вынесены заголовок/подзаголовок/панель из blog-list.css —
   теперь глобально, а не пошаблонно (техдолг «извлечь .okna-pm в общий лист» закрыт; хабу blog-list.css больше не нужен). */
.okna-pm .okna-pm__title{ margin:0 0 6px; }
.okna-pm .okna-pm__sub{ margin:0 0 14px; }
.okna-pm .wpcf7 p{ margin:0 0 12px; }
.okna-pm__pane[hidden]{ display:none; }
.wpcf7 .okna-cf7-row label,.wpcf7 .okna-cf7-acc label{ font-size:14px; font-weight:700; color:var(--ink,#123d87); }
.wpcf7 .okna-req{ color:var(--red,#e0223a); font-weight:800; }
.wpcf7 .okna-opt{ font-weight:500; font-size:12px; color:var(--muted,#6b7686); }
.wpcf7 input[type=text],.wpcf7 input[type=tel],.wpcf7 input[type=email],.wpcf7 textarea{
  width:100%; min-height:54px; margin-top:6px; border:1px solid var(--line,#e8ecf2); border-radius:var(--ok-radius-field,8px); /* Волна 1-бис: было 10px (роль поля поиска на поле формы — перепутаны роли) → роль поля формы 8px */
  padding:12px 14px 12px 44px; font-size:15px; background-repeat:no-repeat; background-position:14px 50%; background-size:18px 18px; }
.wpcf7 textarea{ min-height:96px; background-position:14px 16px; padding-top:14px; }
.wpcf7 input[type=text]{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7686' stroke-width='1.8'%3E%3Ccircle cx='12' cy='8' r='3.2'/%3E%3Cpath d='M5 20c0-3.5 3-6 7-6s7 2.5 7 6'/%3E%3C/svg%3E"); }
.wpcf7 input[type=tel]{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7686' stroke-width='1.8'%3E%3Cpath d='M6 3h3l2 5-2.5 1.5a12 12 0 0 0 5 5L16 14l5 2v3a2 2 0 0 1-2 2A16 16 0 0 1 4 5a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }
.wpcf7 input[type=email]{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7686' stroke-width='1.8'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E"); }
.wpcf7 textarea{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7686' stroke-width='1.8'%3E%3Cpath d='M21 12a8 8 0 0 1-11.5 7.2L4 20l1-4.2A8 8 0 1 1 21 12z'/%3E%3C/svg%3E"); }
.wpcf7 ::placeholder{ color:#9aa6ba; }

/* подсказка под email (замочек) */
.wpcf7 .okna-cf7-hint{ display:flex; align-items:center; gap:8px; margin:-4px 0 14px; font-size:13px; color:var(--muted,#6b7686); }
.wpcf7 .okna-cf7-hint::before{ content:""; flex:0 0 15px; width:15px; height:15px; background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c5bd6' stroke-width='1.8'%3E%3Crect x='5' y='10' width='14' height='10' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E"); }

/* согласие: кастомный чекбокс + ссылка на политику */
.wpcf7 .okna-cf7-acc{ margin:16px 0; }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item{ margin:0; }
.wpcf7 .wpcf7-acceptance label{ margin:0; font-weight:500; cursor:pointer; }
.wpcf7 .wpcf7-acceptance input[type=checkbox]{ position:absolute; opacity:0; width:0; height:0; }
/* ★ F95 §2 · КАНОН галочки согласия: БЛОЧНАЯ раскладка (было display:flex — текст «Согласен на обработку» и ссылка
   «персональных данных» становились отдельными flex-элементами и рвались на две колонки на узких контейнерах).
   Квадрат ::before — абсолютом слева; текст и ссылка текут единой строкой с переносом по словам. Одно место — все формы. */
.wpcf7 .wpcf7-acceptance .wpcf7-list-item-label{ display:block; position:relative; padding-left:28px; font-size:13px; line-height:1.45; color:var(--text,#1c2433); }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item-label::before{ content:""; position:absolute; left:0; top:1px; width:18px; height:18px; border:2px solid #cdd6e4; border-radius:5px; background:#fff; transition:background-color .15s ease, border-color .15s ease; }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item-label a{ display:inline; }
.wpcf7 .wpcf7-acceptance input[type=checkbox]:checked + .wpcf7-list-item-label::before{ border-color:var(--blue,#1c5bd6); background:var(--blue,#1c5bd6) no-repeat center/11px 11px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 6'/%3E%3C/svg%3E"); }
/* ЕДИНЫЙ размер нативных (видимых) чекбоксов форм — 18px (раньше гео-согласие было 25px).
   wpcf7-acceptance-чекбоксы скрыты своим правилом (width:0) и стилизуются через ::before — их это не задевает. */
.okna-geo-req__consent input[type=checkbox], .okna-form input[type=checkbox]{ width:18px; height:18px; accent-color:var(--blue,#1c5bd6); }
.wpcf7 .wpcf7-acceptance a{ color:var(--blue,#1c5bd6); text-decoration:underline; }

/* строка кнопки + «менеджер перезвонит» */
.wpcf7 .okna-cf7-submitrow{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:6px; }
.wpcf7 .okna-cf7-submitrow p{ margin:0; }
.wpcf7 input[type=submit],.wpcf7-submit{ min-height:var(--ok-control-h,48px); border-radius:var(--ok-radius-cta,8px); font-size:16px; white-space:nowrap; } /* РАЗМЕР-КНОПОК 09.08: + font-size:16 (раньше не задан → submit наследовал кегль контекста модалки: 20px в одной, 16 в другой → высота плясала h56). Радиус 10→8 (канон главной). Единый размер CTA форм = 48/8/16. УБОРКА §2.1: литерал 8px→--ok-radius-cta (роль «красный CTA», значение то же). */
/* ===== Перебить базовые правила форм ТТ1 (спец. 0,3,1 + var(--form--*): рамка 3px тёмная, радиус 0, тёмный submit). Только в рамках .wpcf7. ===== */
.wpcf7 textarea{ border:1px solid var(--line,#e8ecf2) !important; border-radius:var(--ok-radius-field,8px) !important; min-height:130px; resize:vertical; } /* Волна 1-бис: радиус textarea → роль поля 8px (было 10px). Это ПОБЕЖДАЮЩЕЕ правило textarea — снятие обнажало скрытый 0 (критик поймал регрессию), потому !important остаётся. Услуга-4px (usluga-view.css) — в развёртке по листам. */
.wpcf7 textarea:focus{ border-color:var(--blue,#1c5bd6) !important; box-shadow:0 0 0 3px rgba(28,91,214,.15) !important; outline:none !important; }
/* Многострочное поле: иконка чата налезала на текст — у textarea иконку убираем, отступ как у обычного поля (текст читается полностью). */
.wpcf7 textarea{ background-image:none !important; padding:12px 14px !important; }
.wpcf7 input[type=submit],.wpcf7-submit{ background:var(--red,#e0223a) !important; color:#fff !important; border:none !important; border-radius:var(--ok-radius-cta,8px) !important; padding:13px 26px; font-weight:700; } /* РАЗМЕР-КНОПОК 09.08: радиус 10→8 (канон). УБОРКА §2.1: литерал 8px→--ok-radius-cta (то же значение) */
.wpcf7 input[type=submit]:hover,.wpcf7-submit:hover,
.wpcf7 input[type=submit]:focus,.wpcf7-submit:focus,
.wpcf7 input[type=submit]:active,.wpcf7-submit:active{ background:#c81a30 !important; color:#fff !important; border:none !important; }
/* ПОКАЗ 09.08: блок-ответ CF7 (.wpcf7-response-output) у общих попапов был дефолтом плагина — рамка 2px ЖЁЛТАЯ (#ffb900), радиус 0, кегль от контекста (до 20px). Выбивался из сайта. Единый вид ко ВСЕМ формам: скруглённая рамка, сайтовый кегль 13, сайтовый шрифт; ошибка/валидация — КРАСНЫЙ тон, успех — зелёный. Точечные правила форм (org/blog/hero) со своей спецификой остаются. */
.wpcf7 .wpcf7-response-output{
  margin:12px 0 0 !important; padding:10px 14px !important;
  border:1px solid var(--red,#e0223a) !important; border-radius:8px !important;
  font-size:13px !important; line-height:1.4 !important;
  background:rgba(224,34,58,.06) !important; color:var(--red,#e0223a) !important;
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 .wpcf7-response-output.wpcf7-mail-sent-ok{
  border-color:var(--ok-success,#1f9d55) !important; background:rgba(31,157,85,.08) !important; color:#1a7a44 !important;
}
/* ПОКАЗ 09.08: подсказка-ошибка поля (.wpcf7-not-valid-tip, «Важно заполнить это поле») у общих попапов = дефолт CF7 — кегль 16, красный #dc3232 (не сайтовый #e0223a), вес 400, без отступа → выбивалась из типографики сайта. Единый вид ко ВСЕМ формам: сайтовый красный, 12.5px, вес 600, отступ сверху 5px. Точечные правила форм (org и др.) со своей спецификой остаются. */
html body .wpcf7 .wpcf7-not-valid-tip{ display:block; margin:5px 0 0; color:var(--red,#e0223a); font-size:var(--ok-fs-micro,12.5px); font-weight:600; line-height:1.35; } /* УБОРКА §2.2: !important снят, префикс html body→(0,2,2) бьёт CF7-дефолт (0,1,0) И поздние сайтовые (0,2,0) blog/glavnaya/ok-home; блоговый color:#ffcdd3!important остаётся победителем */
/* Волна 1 §4.2: ВИД ОШИБКИ ПОЛЯ — единый ОБЩИЙ слой для ВСЕХ CF7-форм. Было: рамку невалидного поля красили только 3 org-модалки (org.css:344,593-594), у остальных ~71 формы поле в ошибке не менялось — виден лишь красный текст-подсказка. ★ РОД: input рендерится нативно (appearance:auto) и ИГНОРИРУЕТ border-color/box-shadow (проверено живьём — ширина/радиус меняются, цвет/тень нет). Инструмент ошибки = `outline` (рендерится на нативных input, едет за скруглением поля в совр. браузерах, offset управляем). Без перечня типов/форм. Признак состояния (.wpcf7-not-valid плагина) не трогаем. Свечение = один способ (outline 2px, offset 1px — реаch 3px << зазор полей 14px, на соседей не налезает §4.2.6). */
.wpcf7 .wpcf7-not-valid{ outline:2px solid var(--red,#e0223a) !important; outline-offset:1px !important; }
.okna-cart-mgr{ display:inline-flex; align-items:center; gap:9px; font-size:13px; color:var(--muted,#6b7686); }
.okna-cart-mgr__ic{ flex:0 0 18px; width:18px; height:18px; background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c5bd6' stroke-width='1.8'%3E%3Cpath d='M6 3h3l2 5-2.5 1.5a12 12 0 0 0 5 5L16 14l5 2v3a2 2 0 0 1-2 2A16 16 0 0 1 4 5a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }

/* ===== Прикрепление фото: drag&drop зона + превью (токены v4) ===== */
.okna-photo{ margin:0 0 14px; }
.okna-photo__label{ display:block; font-size:14px; font-weight:700; color:var(--ink,#123d87); margin:0 0 6px; }
.okna-photo__zone{ display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; cursor:pointer;
  border:2px dashed var(--line,#e8ecf2); border-radius:12px; padding:22px 16px; background:#fbfcfe; transition:border-color .15s ease, background-color .15s ease; }
.okna-photo__zone:hover,.okna-photo__zone.is-over{ border-color:var(--blue,#1c5bd6); background:#f2f6fe; }
.okna-photo:focus-within .okna-photo__zone, .okna-photo__zone:focus-within{ border-color:var(--blue,#1c5bd6); background:#f2f6fe; box-shadow:0 0 0 3px rgba(28,91,214,.15); } /* Волна 6 §9.4: фокус с клавиатуры — кольцо на зоне, когда фокус на фокусируемом элементе внутри .okna-photo (ссылка «выбрать» / file-input). Наведение/файл-выбран(превью)/ошибка(CF7-response) уже есть. */
.okna-photo__ic{ width:30px; height:30px; background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c5bd6' stroke-width='1.6'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Ccircle cx='12' cy='13.5' r='3.5'/%3E%3Cpath d='M8 7l1.5-2.5h5L16 7'/%3E%3C/svg%3E"); }
.okna-photo__txt{ font-size:14px; color:var(--text,#1c2433); }
.okna-photo__pick{ color:var(--blue,#1c5bd6); text-decoration:underline; }
.okna-photo__hint{ font-size:12px; color:var(--muted,#6b7686); }
.okna-photo__previews{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.okna-photo__item{ position:relative; width:84px; }
.okna-photo__item img{ width:84px; height:84px; object-fit:cover; border-radius:10px; border:1px solid var(--line,#e8ecf2); display:block; }
.okna-photo__sz{ display:block; font-size:11px; color:var(--muted,#6b7686); text-align:center; margin-top:2px; }
.okna-photo__rm{ position:absolute; top:-7px; right:-7px; width:22px; height:22px; border-radius:50%; border:none; cursor:pointer;
  background:var(--red,#e0223a); color:#fff; font-size:15px; line-height:22px; padding:0; box-shadow:0 2px 6px rgba(0,0,0,.2); }
@media (max-width:768px){ .okna-photo__item,.okna-photo__item img{ width:72px; } .okna-photo__item img{ height:72px; } }

/* карточка формы оформления (корзина и одиночные формы) */
.okna-cart-checkout{ background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:var(--ok-radius-card,16px); padding:28px 32px; box-shadow:0 12px 36px rgba(18,61,135,.05); max-width:760px; }
.okna-cart-checkout__h{ font-weight:800; }

@media (max-width:768px){
  .okna-cart-checkout{ padding:20px 16px; }
  .wpcf7 .okna-cf7-submitrow{ flex-direction:column; align-items:stretch; }
  .wpcf7 .okna-cf7-submitrow p,.wpcf7 input[type=submit],.wpcf7-submit{ width:100%; }
  .okna-cart-mgr{ justify-content:center; }
}

/* ===== Карточки / сетки ===== */
.okna-card{
  border:1px solid var(--line);
  border-radius:var(--ok-radius-dropdown,10px);
  box-shadow:var(--shadow);
  transition:transform .16s ease, box-shadow .16s ease;
}
.okna-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.okna-card h3{ font-size:18px; }
.okna-card-price{ color:var(--ink); }

/* Плитки марок/услуг (.okna-marks) */
.okna-marks a{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--ok-radius-dropdown,10px);
  color:var(--text);
  font-weight:600;
  box-shadow:0 3px 12px rgba(20,30,55,.05);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.okna-marks a:hover{
  transform:translateY(-3px);
  border-color:#c9d8f5;
  box-shadow:var(--shadow);
  color:var(--ink);
}
.okna-marks small{ color:var(--muted); font-weight:500; }

/* ЕДИНЫЙ эталон H2 СЕКЦИЙ услуги (= .okna-section-title): 30px / 800 / ink / left + красная черта 52×3 (radius 999),
   моб. 25px. Перебивает .okna-usluga h2{28px} (design.css:119) и .okna-usluga>section>h2{…46px} (glavnaya.css:1549)
   через !important. ОХВАТ: голые h2 секций (situations/work-scope/picker/brands/faq) + классы pf2/geo-req + services
   (на услуге тоже к эталону). НЕ входят: okna-fc__title (тёмная секция b2b — отдельно, белый текст) и
   okna-pf-form__h2 (форма — свой стиль). Внутренние h3/h4 не затрагиваются (селектор только на секционный h2/__title). */
.okna-usluga > section > h2,
.okna-usluga .okna-pf2__title,
.okna-usluga .okna-geo-req__title,
.okna-usluga .okna-section-title{
  position:relative;
  margin:0 0 18px !important; padding-bottom:12px !important; /* нижний отступ — воздух заголовок→контент (не прилипать) */
  font-size:30px !important; line-height:1.15 !important; font-weight:800 !important;
  letter-spacing:normal !important; color:var(--ink,#123d87) !important; text-align:left !important;
}
.okna-usluga > section > h2::after,
.okna-usluga .okna-pf2__title::after,
.okna-usluga .okna-geo-req__title::after,
.okna-usluga .okna-section-title::after{
  content:"" !important; position:absolute !important; left:0 !important; bottom:0 !important;
  width:52px !important; height:3px !important; border-radius:999px !important; background:var(--red,#e0223a) !important;
}
/* b2b — тёмная секция: та же типографика/черта, но текст БЕЛЫЙ (синий бы пропал); черта — свой span .okna-fc__accent */
.okna-usluga .okna-fc__title{
  margin:0 !important; padding-bottom:0 !important;
  font-size:30px !important; line-height:1.15 !important; font-weight:800 !important;
  letter-spacing:normal !important; text-align:left !important;
}
.okna-usluga .okna-fc__accent{ width:52px !important; height:3px !important; border-radius:999px !important; }
@media(max-width:600px){
  .okna-usluga > section > h2,
  .okna-usluga .okna-pf2__title,
  .okna-usluga .okna-geo-req__title,
  .okna-usluga .okna-section-title,
  .okna-usluga .okna-fc__title{ font-size:25px !important; }
}
/* ВОЗДУХ между секциями услуги — СИММЕТРИЧНАЯ ПОЛОСА padding 72/72 (как главная), а не одиночный margin-top.
   Раньше margin-top:56px !important давал асимметрию (56 сверху, 0 снизу после снятия style.css:19).
   ДЕСКТОП (min-width:601px): зануляем верт.МАРГИН и задаём padding-block:72px (сверху=снизу). Секции со СВОИМ
   padding из usluga.css (okna-fc 72/72, situations 40, faq 36, reviews 60 — спец. 0,3,2 scoped) перебивают это
   и СОХРАНЯЮТ своё (как на главной). Общие секции (были pt:0) получают 72/72. Hero (.okna-uhero) исключён.
   МОБИЛЬНЫЙ (≤600px) НЕ ТРОГАЕМ — правило ниже сохраняет margin-top:38px как было. */
@media(min-width:601px){ body.page-template-tpl-usluga .okna-usluga > section:not(.okna-uhero){ margin-block:0 !important; padding-block:72px; } }
@media(max-width:600px){ body.page-template-tpl-usluga .okna-usluga > section:not(.okna-uhero){ margin-top:38px !important; } }
/* (точечная заплатка .okna-rs{padding-top:40px} УБРАНА 2026-06-25 — после корневого фикса style.css:19 .okna-rs
   берёт штатные 40px из glavnaya.css:113 сам, дубль не нужен. См. OTCHET_usluga_padding_root.md.) */

/* ЕДИНАЯ ЛЕВАЯ ЛИНИЯ заголовков+подзаголовков — перенесена на КОНТЕЙНЕР .okna-usluga (см. блок «ЕДИНАЯ ОСЬ» ниже,
   рядом с --okna-head-indent). Старое правило было заскоуплено на body.page-template-tpl-usluga → не работало на
   seo_filter/каталоге/посадочных (тот же контейнер .okna-usluga, но другой body-класс). Дубль удалён 2026-06-26. */
/* pf2 (price-factors) на услуге — привести к ширине/линии соседей (2026-06-26). На услуге .okna-pf2__wrap имел свой
   padding:0 40px → контент (top/grid/table) инсетнут к L161 W968, уже соседей (121/1048) на 80px. Убираем инсет wrap →
   контент на полную ширину как соседи; интро (badge/title/lead) сдвигаем на линию 162 через margin-left:40 (моб.18),
   как заголовки соседних секций. CTA-карточка/грид факторов/таблица — full width. Scoped на услугу (главную не трогаем). */
body.page-template-tpl-usluga .okna-usluga .okna-pf2__wrap{ padding-left:0 !important; padding-right:0 !important; }
/* ★ C-fix/макет #15: блок НЕ в карточке → заголовок+лид БЕЗ отступа слева (край контента).
   Прежний margin-left:40 (старый канон «как соседние заголовки») отменён — сверено с макетом #15
   (h2 margin:0, на краю контейнера). Симметричный padding-right:40 у __top тоже снят → CTA к правому краю. */
body.page-template-tpl-usluga .okna-usluga .okna-pf2__intro{ margin-left:0 !important; }
body.page-template-tpl-usluga .okna-usluga .okna-pf2__top{ padding-right:0 !important; }
@media(max-width:600px){
  body.page-template-tpl-usluga .okna-usluga .okna-pf2__wrap{ padding-left:0 !important; padding-right:0 !important; }
  body.page-template-tpl-usluga .okna-usluga .okna-pf2__intro{ margin-left:0 !important; } /* ★ C-fix: мобиль — без отступа слева (был 18) */
  body.page-template-tpl-usluga .okna-usluga .okna-pf2__top{ padding-right:0 !important; }
}

/* ===== Герой — ТЁМНЫЙ (макет v4) ===== */
.okna-hero{
  background:var(--graphite);
  color:#fff;
  border-radius:var(--ok-radius-card,16px);
  padding:48px 40px;
  margin-top:26px;
  box-shadow:var(--shadow-lg);
  background-size:cover;background-position:center;
}
.okna-hero h1{
  color:#fff;
  font-size:40px;
  font-weight:800;
  letter-spacing:-.025em;
  margin:0 0 14px;
  max-width:20ch;
}
.okna-hero .sub{ color:var(--muted-d); font-size:19px; max-width:60ch; }
.okna-hero .okna-benefits li{
  background:rgba(255,255,255,.06);
  border:1px solid var(--line-d);
  color:#dbe2ee;
}
/* вторичная кнопка на тёмном — читаемая */
.okna-hero .okna-btn.secondary{
  background:transparent;color:#fff;border-color:rgba(255,255,255,.55);
}
.okna-hero .okna-btn.secondary:hover{ background:rgba(255,255,255,.1); color:#fff; }

/* ===== Каталожный hero (.okna-hero--catalog): фон-автобус справа + градиент слева + 2 CTA. Токены v4. ===== */
.okna-hero--catalog{
  position:relative; overflow:hidden; display:flex; align-items:center;
  padding:0; min-height:330px; color:#fff;
  background-color:#0f2a5e;                 /* тёмно-синий фолбэк под градиент/картинку */
  background-size:cover; background-position:center right; background-repeat:no-repeat;
  border-radius:var(--ok-radius-card,16px); box-shadow:0 18px 48px rgba(20,30,55,.18);
}
.okna-hero--catalog .okna-hero__overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(11,28,60,.93) 0%, rgba(11,28,60,.80) 38%, rgba(11,28,60,.30) 68%, rgba(11,28,60,0) 100%);
}
.okna-hero--catalog .okna-hero__inner{ position:relative; z-index:2; max-width:540px; padding:52px 48px; }
.okna-hero--catalog .okna-hero__title{
  color:#fff; font-size:38px; line-height:1.1; font-weight:800; letter-spacing:-.02em; margin:0 0 14px; max-width:18ch;
}
.okna-hero--catalog .okna-hero__sub{
  color:rgba(255,255,255,.82); font-size:18px; line-height:1.45; margin:0 0 26px; max-width:42ch;
}
.okna-hero--catalog .okna-hero__ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.okna-hero--catalog .okna-btn{ transition:background-color .18s ease, border-color .18s ease, color .18s ease, transform .12s ease; }
.okna-hero--catalog .okna-btn:active{ transform:translateY(1px); }
.okna-hero--catalog .okna-btn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
/* основная красная CTA — наш токен (не чужой #e31e30) */
.okna-hero--catalog .okna-btn--hero{ background:var(--red,#e0223a); border:1px solid var(--red,#e0223a); color:#fff; }
.okna-hero--catalog .okna-btn--hero:hover{ background:var(--red-hover,#c81a30); border-color:var(--red-hover,#c81a30); color:#fff; }
/* вторичная — контур по светлому */
.okna-hero__btn-outline{ background:transparent; border:1px solid rgba(255,255,255,.6); color:#fff; }
.okna-hero__btn-outline:hover{ background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }
/* класс-крючок для сдвига фона (если автобус наезжает на текст на конкретной картинке) */
.okna-hero--catalog.bg-left{ background-position:center left; }
.okna-hero--catalog.bg-65{ background-position:65% center; }
@media (max-width:768px){
  .okna-hero--catalog{ min-height:0; border-radius:14px; background-position:65% center; }
  .okna-hero--catalog .okna-hero__overlay{
    background:linear-gradient(180deg, rgba(11,28,60,.90) 0%, rgba(11,28,60,.86) 55%, rgba(11,28,60,.80) 100%);
  }
  .okna-hero--catalog .okna-hero__inner{ max-width:none; padding:28px 22px; }
  .okna-hero--catalog .okna-hero__title{ font-size:25px; max-width:none; }
  .okna-hero--catalog .okna-hero__sub{ font-size:15px; margin-bottom:20px; }
  .okna-hero--catalog .okna-hero__ctas{ flex-direction:column; }
  .okna-hero--catalog .okna-hero__ctas .okna-btn{ width:100%; text-align:center; }
}

/* ===== Тёмные акцентные CTA-боксы (контейнер-призыв, безопасно везде) ===== */
.okna-cta-box{
  background:var(--graphite);
  color:#fff;
  border-radius:var(--ok-radius-card,16px);
  padding:30px;
  box-shadow:var(--shadow);
}
.okna-cta-box p{ color:var(--muted-d); font-size:17px; }

/* ===== Хлебные крошки (ЭТАП 11.1: написание КАК НА УСЛУГАХ — эталон .okna-uhero__crumbs: разделитель «/», шрифт 14px.
   Адаптировано под светлый фон (на услугах hero тёмный → текст белый; тут синяя ссылка / серый «/» / тёмный текущий).
   Единый источник okna_breadcrumbs() рисует .okna-crumbs на ВСЕХ страницах автоматически. ===== */
/* Крошки компактные (владелец 16.07: «гигантские отступы, не имеющие ценности, по всему сайту»).
   Было padding:18px 0 6px + margin 18/14 (glavnaya.css:1721) → плашка 46px ради 22px текста,
   а от шапки до контента набегало 128px. Сжато до разумного, воздух оставлен. */
.okna-crumbs{ font-size:14px; color:#526173; padding:2px 0; line-height:1.6; }
.okna-crumbs ol{ list-style:none !important; margin:0 !important; padding:0 !important; display:flex; flex-wrap:wrap; align-items:center; gap:0; }
.okna-crumbs li{ display:inline-flex; align-items:center; margin:0 !important; }
.okna-crumbs li::before{ content:none; }                                  /* сброс возможного маркера темы */
.okna-crumbs li+li::before{ content:"/"; color:#aeb8c6; margin:0 8px; }   /* разделитель «/» как на услугах (.okna-uhero__crumbs .sep) */
.okna-crumbs a{ color:var(--blue,#1c5bd6); text-decoration:none; }
.okna-crumbs a:hover{ text-decoration:underline; }
.okna-crumbs span[aria-current]{ color:var(--ink,#123d87); }             /* текущий пункт — тёмно-синий ink (как заголовки сайта) */
/* Дубль крошек: если на странице есть свои крошки ВНУТРИ тёмного hero (.okna-uhero__crumbs — услуга/категория/марка/
   модель/транспорт/гео и др.), штатные крошки шапки скрываем (JSON-LD от Yoast остаётся). Точечно — только при наличии hero-крошек. */
body:has(.okna-uhero__crumbs) .okna-crumbs{ display:none; }
/* (.okna-geo-bc стилизуется в geo.css — приведён к единому виду на этапе 11.2) */

/* ===== Шапка / навигация ===== */
.site-header{ background:var(--bg); border-bottom:1px solid var(--line); }
.site-title,.site-title a{ color:var(--text)!important; font-weight:800; letter-spacing:-.01em; }
.primary-navigation,
.primary-navigation a{ font-size:16px; }
.primary-navigation a{ color:var(--text); font-weight:600; }
.primary-navigation a:hover{ color:var(--blue); }

/* ===== Мега-меню «Подбор стекла» ===== */
.okna-mega-panel{
  border:1px solid var(--line);
  border-radius:var(--ok-radius-dropdown,10px);
  box-shadow:var(--shadow-lg);
  padding:22px;
}
.okna-mega-col h4{ color:var(--ink); font-weight:800; border-bottom-color:var(--line); }
.okna-mega-mark > a b{ color:var(--text); }
.okna-mega-mark ul a{ color:var(--muted); }
.okna-mega-mark ul a:hover{ color:var(--blue); }
.okna-mega-all a{ color:var(--blue); font-weight:700; }

/* ===== Каталог: фильтры и листинг (оставляем СВЕТЛЫМ и читаемым) ===== */
.okna-filters{
  background:var(--bg-soft);
  border:1px solid var(--line);
  border-radius:var(--ok-radius-dropdown,10px);
}
.okna-grid{ gap:18px; }
/* .okna-allmarks section h2 — размер/черта в едином стиле H2 (glavnaya.css, конец файла) */

/* ===== Тёмный подвал ===== */
.okna-footer{
  background:var(--graphite-2);
  color:#cfd6e2;
  margin-top:60px;
  padding:0;
}
.okna-footer.site-footer{ max-width:calc(var(--okna-cw) + 80px); }  /* плашка футера в общую рамку 1280 (контент 1200): было TT1-alignwide ~1222 → inner не дотягивал. Спец. 0,2,0 > .site-footer */
.okna-footer-inner{
  max-width:calc(var(--okna-cw) + 80px);margin:0 auto;padding:48px 40px 28px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;
}
.okna-footer-col h4{
  color:#fff;font-size:16px;font-weight:800;margin:0 0 14px;letter-spacing:.01em;
}
.okna-footer-col p{ color:var(--muted-d); font-size:14px; margin:0 0 8px; line-height:1.7; }
.okna-footer-col ul{ list-style:none;margin:0;padding:0; }
.okna-footer-col li{ margin:0 0 9px; }
.okna-footer-col a{ color:#cfd6e2; text-decoration:none; font-size:14px; }
.okna-footer-col a:hover{ color:#fff; }
.okna-footer-phone{ color:#fff!important; font-weight:700; font-size:16px!important; }
.okna-footer-tg{ display:inline-flex; align-items:center; gap:7px; color:#cfd6e2!important; font-weight:600; font-size:14px!important; }
.okna-footer-tg svg{ flex:0 0 auto; color:#2ea6e0; transition:color .15s; }
.okna-footer-tg:hover{ color:#fff!important; }
.okna-footer-tg:hover svg{ color:#3fb6ef; }

/* Блок «Отзывы» v2 — стили перенесены в glavnaya.css (.okna-reviews, грузится глобально, поверх design.css). */
.okna-footer-bottom{
  border-top:1px solid var(--line-d);
  color:var(--muted-d);font-size:13px;
  text-align:center;padding:18px 16px;
}

/* ===== Адаптив ===== */
@media (max-width:768px){
  .okna-footer-inner{ grid-template-columns:1fr 1fr; gap:24px; }
  .okna-hero{ padding:34px 22px; }
  .okna-hero h1{ font-size:30px; }
}
@media (max-width:600px){
  .okna-footer-inner{ grid-template-columns:1fr; }
  .okna-usluga h2{ font-size:23px; }
  .okna-hero h1{ font-size:26px; }
}

/* ============================================================
   ЕДИНАЯ текстовая кнопка-ссылка .okna-tlink (источник правды) — для «Читать полностью / Свернуть / Показать ещё»
   и любых текст-действий: БЕЗ фона/рамки/тени. Перебивает TT1-стиль <button> (фон/рамка/appearance) через !important —
   известная проблема: голый <button> без этого выходит тёмной плашкой. НЕ для CTA-плашек (.okna-btn и т.п.).
   ============================================================ */
.okna-tlink, .okna-tlink:link, .okna-tlink:visited{
  background:transparent !important; border:0 !important; box-shadow:none !important;
  -webkit-appearance:none !important; appearance:none !important;
  padding:0 !important; margin:0; color:var(--blue,#1c5bd6) !important;
  font-weight:700; font-size:inherit; line-height:inherit; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; gap:4px; width:auto;
}
.okna-tlink:hover{ color:var(--ink,#123d87) !important; text-decoration:underline; }

/* ===== Блок «Смотрите также» (related, .okna-rel) — чистый ряд стрелка-ссылок вместо голых буллетов. ===== */
.okna-rel{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px 26px; }
.okna-rel li{ margin:0; padding:0; }
.okna-rel a{ display:inline-flex; align-items:center; gap:7px; color:var(--blue,#1c5bd6); text-decoration:none; font-size:15px; border-bottom:1px solid transparent; }
.okna-rel a::before{ content:"→"; color:var(--blue,#1c5bd6); font-weight:700; }
.okna-rel a:hover{ border-bottom-color:currentColor; }

/* ===== Блок «Похожие подборы» (related-picks) — компактная перелинковка смежных посадочных. Scoped: чужие .okna-tag не трогает. ===== */
.related-picks{ margin:26px 0 0; }
.related-picks__inner{ position:relative; background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; padding:14px 18px; }
.related-picks__head{ margin-bottom:8px; }
.related-picks__title{ font-size:18px; font-weight:700; color:var(--ink,#123d87); }
.related-picks__line{ display:block; width:40px; height:3px; border-radius:999px; background:var(--red,#e0223a); margin-top:6px; }
.related-picks__toggle{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.related-picks__scroller{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:14px; }
.related-picks__group{ display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; }
.related-picks__glabel{ color:var(--muted,#6b7686); white-space:nowrap; }
.related-picks__tag{ display:inline-flex; align-items:center; border:1px solid #cddcf5; color:var(--blue,#1c5bd6); background:#fff; border-radius:999px; padding:6px 14px; text-decoration:none; white-space:nowrap; transition:border-color .15s, background .15s; }
.related-picks__tag:hover{ border-color:var(--blue,#1c5bd6); background:var(--blue-soft,#eef3fc); color:var(--blue,#1c5bd6); }
.related-picks__tag--extra{ display:none; }
.related-picks__toggle:checked ~ .related-picks__scroller .related-picks__tag--extra{ display:inline-flex; }
.related-picks__more{ display:inline-flex; align-items:center; margin-left:4px; cursor:pointer; white-space:nowrap; }
.related-picks__more::after{ content:attr(data-more); }
.related-picks__toggle:checked ~ .related-picks__scroller .related-picks__more::after{ content:attr(data-less); }
.related-picks__fade, .related-picks__arrow{ display:none; }
@media(max-width:768px){
  .related-picks__inner{ padding:14px 0 14px 16px; overflow:hidden; }
  .related-picks__head{ padding-right:16px; }
  .related-picks__scroller{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-right:40px; scrollbar-width:none;
    /* ★ W5-P05 добор (06.08): правый край-подсказку скролла делаем МАСКОЙ (в прозрачный),
       а не белым оверлеем .related-picks__fade — не зависит от подложки. */
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 44px), transparent);
            mask-image:linear-gradient(to right, #000 calc(100% - 44px), transparent); }
  .related-picks__scroller::-webkit-scrollbar{ display:none; }
  .related-picks__group{ flex-wrap:nowrap; }
  .related-picks__glabel{ display:none; }
  .related-picks__tag{ flex:none; padding:10px 16px; min-height:44px; }
  .related-picks__tag--extra{ display:inline-flex; }
  .related-picks__more{ display:none; }
  .related-picks__fade{ display:none; } /* ★ W5-P05 добор: белый оверлей снят, заменён маской на .related-picks__scroller */
  .related-picks__arrow{ display:block; position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--blue,#1c5bd6); font-weight:700; font-size:18px; pointer-events:none; }
}

/* ============================================================ Блок «Наши услуги» — карточки 1:1 + горизонтальный скролл (токены v4) ============================================================ */
.okna-services{ margin:56px 0; }
.okna-services__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:22px; }
.okna-section-title{ position:relative; margin:0; padding-bottom:12px; font-size:30px; line-height:1.15; font-weight:800; color:var(--ink,#123d87); }
.okna-section-title::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a); }

/* ============================================================
   ЕДИНЫЙ СТАНДАРТ ТИПОГРАФИКИ СЕКЦИЙ (источник правды).
   Заголовок секции = .okna-section-title (30/800/слева/черта52, ink; тёмный фон → белый текст).
   Подзаголовок секции = .okna-section-sub (17/1.6/слева/muted; тёмный фон → .okna-section-sub--on-dark).
   Заголовок секции берёт единый стандарт по умолчанию. Блок вешает класс и своего размера НЕ пишет —
   КРОМЕ случая, когда макет ЭТОЙ страницы назначает другой кегль: тогда размер объявляется в листе
   страницы, поимённо, со ссылкой на макет и величину. (HEAD-01 §3.2: старая формулировка «свой размер не пишет» заменена — исключение стало законным и документируемым.)
   Внутрикарточные тайтлы (*__card-title/*__step-title/*__factor-title и т.п.) — это НЕ секционные, свой формат.
   Существующие классы подзаголовков сведены к этим значениям ниже (один стандарт).
   ============================================================ */
.okna-section-sub,
.okna-services__subtitle, .okna-related__subtitle, .okna-reviews__subhead,
.okna-rs__sub, .okna-ws__sub, .okna-bm__sub, .okna-faq__sub, .okna-pick__sub, .okna-pf-form__sub,
.okna-org-hub__lead{   /* разводящая B2B шла мимо стандарта: свои -4px/16px/1.55/#5a6b82 → подзаголовок липнул к красной черте (16.07) */
  margin:2px 0 22px; max-width:780px; font-size:17px; line-height:1.6; text-align:left; color:var(--muted,#6b7686); }
.okna-section-sub--on-dark, .okna-pick__sub{ color:rgba(255,255,255,.85); } /* тёмная подложка */
@media(max-width:600px){
  .okna-section-sub,
  .okna-services__subtitle, .okna-related__subtitle, .okna-reviews__subhead,
  .okna-rs__sub, .okna-ws__sub, .okna-bm__sub, .okna-faq__sub, .okna-pick__sub, .okna-pf-form__sub{ font-size:15px; margin-bottom:18px; }
}

/* ============================================================
   ЕДИНЫЙ ОТСТУП заголовка/подзаголовка от КРАЯ КОНТЕНТА блока = 37px на ВСЕХ типах (эталон услуга #18).
   Утверждено владельцем (HEAD 4bcbae3). Одна переменная --okna-head-indent для всех контейнеров, независимо
   от их ширины. Равняем ОТСТУП ОТ КРАЯ КОНТЕНТА (его видно глазом), НЕ абсолютную позицию от экрана.
   Полное правило: 02_ARCHITECTURE/_PRAVILA/SKILL_zagolovki.md
   ИСКЛЮЧЕНИЯ (заголовок на паддинге своей инсет-карточки, НЕ на ось): geo-req, pf-form, pf2, situations(rs),
   gv-nocat, gv-final, okna-promo--dark. КРИТЕРИЙ: карточка = свой фон+padding+radius. Полоса с фоном (picker/
   b2b/fc) = на ось. НОВЫЙ открытый блок: вешает эталонный класс заголовка → отступ приедет из переменной сам.
   ============================================================ */
:root{ --okna-head-indent:0px; } /* ★ C-fix 06.08 (решение владельца + МАКЕТ #02/#15/#18/#19 = заголовок на КРАЮ КОНТЕНТА, без +37): рычаг обнулён — все правила ниже на var() уводят заголовки/подзаголовки на ось контейнера (услуга/org/about 142→край), главная (.ok-* вне системы) не двигается, карточки-исключения не трогаются. Прежний 37 (HEAD 4bcbae3) отменён этим решением. */
/* gv-head — отступ на ВСЮ заголовочную группу (eyebrow+H2+подзаголовок едут ВМЕСТЕ); внутренний h2 без своего margin.
   .okna-about добавлен 03.07.2026 (аудит: секции-инклюды партнёров/статусов на /o-kompanii/ были без оси — заголовки «скакали») */
.glavnaya-v4 .gv-head, .okna-about .gv-head{ margin-left:var(--okna-head-indent) !important; }
.glavnaya-v4 .gv-head > h2, .okna-about .gv-head > h2{ margin-left:0 !important; }
/* открытые секции с eyebrow+H2 в classless-div (gv-why) или только H2 (gv-seo) — eyebrow И h2 к оси (вместе) */
.glavnaya-v4 .gv-why .gv-eyebrow, .glavnaya-v4 .gv-why h2,
.glavnaya-v4 .gv-seo h2{ margin-left:var(--okna-head-indent) !important; }
/* осевое правило gv-picker удалено 03.07.2026 — светлый блок заменён тёмным picker-dark (баннер .okna-pick) */
/* gv-b2b «Автопаркам» — полноширинная тёмная ПОЛОСА (как okna-fc, не инсет-карточка): heading-группу (col1: h2+лид+кнопка)
   двигаем на ось; список feats (col2) и фон-полоса не трогаются. */
.glavnaya-v4 .gv-b2b .gv-box > div{ margin-left:var(--okna-head-indent) !important; }
/* gv-nocat (graphite, padding 44) / gv-final (белая, shadow/radius) — НАСТОЯЩИЕ инсет-карточки: заголовок на паддинге
   своей карточки (как #18 pf-form/geo-req), уже с отступом ~37–44 — правомерное исключение, не трогаем. */
/* okna-showcase «Популярные стёкла» — своя шапка; ось из переменной с поправкой (база 75 → -10 = 141) */
.glavnaya-v4 .okna-showcase__head{ margin-left:var(--okna-head-indent) !important; } /* ★ C-fix: было calc(var - 10); теперь следует за осью (0 = край контента), критик C WARNING2 */
/* секционные H2 (классовые) — wrapper-префикс (.okna-usluga/.glavnaya-v4), чтобы перебить .okna-usluga h2{margin:0} */
.okna-usluga .okna-section-title, .glavnaya-v4 .okna-section-title,
.okna-about .okna-section-title, /* страница «О компании» (tpl-about) — канон-H2 на общей оси, 03.07.2026 */
.okna-usluga .okna-related__title, .glavnaya-v4 .okna-related__title,
.okna-usluga .okna-bm > h2, .glavnaya-v4 .okna-bm > h2{ margin-left:var(--okna-head-indent) !important; }
/* подзаголовки секций (p — .okna-usluga h2 их не блокирует) — глобально, отступ из переменной per-container.
   .okna-section-sub — КАНОНИЧЕСКИЙ класс: любой новый блок с ним получает ось АВТОМАТИЧЕСКИ (добавлен 03.07.2026,
   после инцидента news/blog: их копия .okna-nhome-sub была без оси — sub@0 при h2@37) */
.okna-section-sub, .okna-reviews__subhead, .okna-bm__sub, .okna-services__subtitle, .okna-related__subtitle{ margin-left:var(--okna-head-indent) !important; }
/* b2b (okna-fc): заголовок И лид по общей оси (повышенная специфичность .okna-fc — title перебивался) */
.okna-fc .okna-fc__title, .okna-fc .okna-fc__accent, .okna-fc .okna-fc__lead{ margin-left:var(--okna-head-indent) !important; }
/* ===== ЕДИНАЯ ОСЬ заголовков на КОНТЕЙНЕРЕ .okna-usluga (услуга/seo_filter/каталог/посадочные) — одна система =====
   Ось = край контента + 40 из переменной. Перенос со старого body-scoped правила (работало только на tpl-usluga) на
   контейнер → покрывает seo_filter (728 стр.), каталог, все посадочные. Новый ГОЛЫЙ секционный h2 в .okna-usluga
   получает ось АВТОМАТИЧЕСКИ. Широкие kategoriya/raboty: те же 40 от их края (108) → ~148, локально ровно (принято). */
.okna-usluga{ --okna-head-indent:0px; } /* ★ C-fix 06.08: и на контейнере услуги/каталога/посадочных — 0 (макет: край контента) */
/* ВСЕ контейнеры (главная/услуга/seo_filter/kategoriya/raboty/товар/посадочные) используют ОДИН индент 37 → отступ
   заголовка от края своего блока = 37px одинаково (как на #18). Никаких per-контейнерных костылей. */
/* прямые голые секционные h2: ws/pick/bm/faq/seo-text/subscription(«Абонентское»)/works(«Наши работы»)/related(товар).
   Исключения: .okna-rs/.okna-situations — обрамлённая карточка (padding:40, h2 на паддинге=141, +margin даст 182). */
.okna-usluga > section:not(.okna-rs):not(.okna-situations) > h2,
/* .okna-seo-text h2 УБРАНО из оси: это заголовки ВНУТРИ читаемого текста статьи (okna-st-body) — идут по КРАЮ ТЕКСТА,
   в линию с абзацами и H3, а НЕ на оси секций (иначе торчат вправо на +37). Ось 37 — только для секционных заголовков. */
.okna-usluga .okna-ws__sub, .okna-usluga .okna-faq__sub{   /* подзаги, не входившие в глоб. правило подзаголовков */
  margin-left:var(--okna-head-indent) !important; }
/* okna-promo — ТЁМНАЯ плашка-баннер (okna-promo--dark): заголовок на паддинге плашки, как gv-box/fc — НЕ равняем (исключение) */
/* листинг «Подходящие стёкла» — h2 в okna-cat-head__l (база 117, не 101) → поправка к оси */
.okna-usluga .okna-landing-listing .okna-cat-head__l > h2{ margin-left:var(--okna-head-indent) !important; } /* ★ C-fix: было calc(var - 16); теперь следует за осью (замер: десктоп 105 = карточки/соседи), критик C WARNING2 */
/* ★ C-fix критик C (WARNING1): на мобиле .okna-usluga держал 18px только для НЕ-tpl-usluga
   (каталог/seo_filter/посадочные) → заголовки уезжали на +18 от карточек. Канон (прототип: «на мобиле
   ВСЁ на одном крае») = 0 на всех .okna-usluga, а не только шаблон услуги. */
@media(max-width:600px){ :root, .glavnaya-v4, .okna-usluga{ --okna-head-indent:0px; } }
.okna-services__all{ flex:0 0 auto; white-space:nowrap; font-size:15px; font-weight:700; color:var(--blue,#1c5bd6); text-decoration:none; }
.okna-services__all:hover{ color:var(--ink,#123d87); }

.okna-services__slider{ position:relative; }
.okna-services__track{
  display:flex; gap:18px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding:4px 2px 16px; scrollbar-width:thin; scrollbar-color:#c3ccda transparent; -webkit-overflow-scrolling:touch;
}
.okna-services__track::-webkit-scrollbar{ height:8px; }
.okna-services__track::-webkit-scrollbar-thumb{ background:#c3ccda; border-radius:8px; }
.okna-services__track::-webkit-scrollbar-track{ background:transparent; }
.okna-services__track:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:3px; border-radius:14px; }

.okna-services__card{
  flex:0 0 244px; scroll-snap-align:start; display:flex; flex-direction:column; padding:14px; min-height:100%;
  background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; text-decoration:none; color:inherit;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.okna-services__card:hover{ transform:translateY(-2px); border-color:#9ec3ff; box-shadow:0 12px 30px rgba(18,61,135,.10); }
.okna-services__card:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-services__image{ display:block; aspect-ratio:1/1; overflow:hidden; border-radius:10px; background:#f5f8fd; margin-bottom:14px; }
.okna-services__image img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
.okna-services__card:hover .okna-services__image img{ transform:scale(1.02); }
.okna-services__image--ph{ display:flex; align-items:center; justify-content:center; color:#aab4c5; border:1px dashed #cdd6e4; }
.okna-services__name{ font-weight:700; font-size:18px; line-height:1.25; margin-bottom:8px; color:var(--ink,#123d87); }
.okna-services__text{ font-size:14px; line-height:1.45; color:var(--muted,#6b7686);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.okna-services__more{ margin-top:auto; padding-top:14px; font-size:14px; font-weight:700; color:var(--blue,#1c5bd6); }
.okna-services__card:hover .okna-services__more{ color:var(--ink,#123d87); }

/* ПЛИТКА услуг (разводящая /uslugi/): сетка вместо карусели, все услуги видны. Карточка та же (.okna-services__card). */
.okna-services__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; }
.okna-services__grid .okna-services__card{ flex:1 1 auto; min-height:0; }   /* в гриде — на всю ячейку, не фикс. 244px */
/* MOBM-05: хаб-плитка /uslugi/ на мобилке = макет #18 (2 колонки, компактная плитка).
   Селектор .okna-services__grid — ТОЛЬКО хаб (services.php:125); карусель главной
   (.okna-services__track) и услуга (.okna-usluga .okna-services__card) не затрагиваются.
   Все правила (0,2,0) перебивают базу (0,1,0) специфичностью — без нового !important. */
@media (max-width:600px){
  .okna-services__grid{ grid-template-columns:1fr 1fr; gap:12px; }
  .okna-services__grid .okna-services__card{ padding:12px 13px; border-radius:14px; }
  .okna-services__grid .okna-services__image{ aspect-ratio:16/10; margin-bottom:10px; }
  .okna-services__grid .okna-services__name{ font-size:14px; font-weight:800; line-height:1.25; min-height:34px; margin-bottom:6px; }
  .okna-services__grid .okna-services__text{ font-size:12px; -webkit-line-clamp:2; }
  .okna-services__grid .okna-services__more{ display:none; }   /* макет #18: карточка кликается целиком, отдельной «Подробнее» нет */
}

/* Стрелки прокрутки (десктоп). На мобиле скрыты — только свайп. JS управляет hidden/disabled. */
.okna-services__nav{
  position:absolute; top:38%; transform:translateY(-50%); z-index:3; width:40px; height:40px; border-radius:50%;
  background:#fff; border:1px solid var(--line,#e8ecf2); color:var(--ink,#123d87); font-size:24px; line-height:1; cursor:pointer;
  box-shadow:0 6px 18px rgba(18,61,135,.12); transition:background-color .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
  display:flex; align-items:center; justify-content:center; padding:0 0 3px;
}
.okna-services__nav--prev{ left:-8px; }
.okna-services__nav--next{ right:-8px; }
.okna-services__nav:hover{ border-color:var(--blue,#1c5bd6); color:var(--blue,#1c5bd6); }
.okna-services__nav:active{ transform:translateY(-50%) translateY(1px); }
.okna-services__nav:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-services__nav[disabled]{ opacity:.35; cursor:default; box-shadow:none; }
.okna-services__nav[hidden]{ display:none; }

@media (max-width:1024px){ .okna-services__card{ flex-basis:230px; } }
@media (max-width:768px){
  .okna-services__head{ flex-direction:column; align-items:flex-start; gap:10px; margin-bottom:16px; }
  .okna-section-title{ font-size:25px; }
  .okna-services__card{ flex-basis:82vw; }
  .okna-services__nav{ display:none !important; }
  /* ★ W5-P02 · Touch target «Все услуги →» (.okna-services__all). База — строчная
     ссылка ~23px (15px × lh 1.55); на планшете/телефоне область нажатия мала.
     inline-flex + min-height 44 поднимает цель без превращения ссылки в кнопку.
     На десктопе (>768) остаётся компактной (hover работает). */
  .okna-services__all{ display:inline-flex; align-items:center; min-height:44px; }
}

/* ===== Блок «Смотрите также» (.okna-related__*) — карточки: иконка-круг + текст + стрелка. Токены v4, карточки белые. ===== */
.okna-related{ margin:56px 0; }
.okna-related__head{ margin-bottom:22px; }
.okna-related__title{ position:relative; margin:0; padding-bottom:12px; font-size:30px; line-height:1.15; font-weight:800; color:var(--ink,#123d87); }
.okna-related__title::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a); }
/* .okna-related__subtitle — формат из единого .okna-section-sub (17/1.6/слева/muted), здесь не переопределяем */
.okna-related__slider{ position:relative; }
.okna-related__track{
  display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 2px 12px; scroll-padding-left:2px;
  scrollbar-width:thin; scrollbar-color:#c3ccda transparent;
}
.okna-related__track::-webkit-scrollbar{ height:8px; }
.okna-related__track::-webkit-scrollbar-thumb{ background:#c3ccda; border-radius:8px; }
.okna-related__track::-webkit-scrollbar-track{ background:transparent; }
.okna-related__track:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:3px; border-radius:14px; }
.okna-related__card{
  flex:0 0 300px; scroll-snap-align:start; display:flex; align-items:center; gap:16px; min-height:152px;
  background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; padding:20px 22px; text-decoration:none;
  box-shadow:0 6px 20px rgba(20,30,55,.05); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.okna-related__card:hover{ transform:translateY(-2px); border-color:#9ec3ff; box-shadow:0 12px 30px rgba(18,61,135,.10); }
.okna-related__card:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-related__icon{ flex:0 0 auto; width:80px; height:80px; border-radius:50%; background:#eef5ff; color:var(--blue,#1c5bd6);
  display:flex; align-items:center; justify-content:center; overflow:hidden; }
.okna-related__icon img{ width:100%; height:100%; object-fit:cover; border-radius:50%; }
.okna-related__body{ flex:1 1 auto; min-width:0; }
.okna-related__name{ display:block; font-weight:700; font-size:17px; line-height:1.25; color:var(--ink,#123d87); margin-bottom:5px; }
.okna-related__text{ display:block; font-size:14px; line-height:1.45; color:var(--muted,#6b7686);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.okna-related__arrow{ flex:0 0 auto; width:36px; height:36px; border-radius:50%; border:1px solid var(--line,#e8ecf2);
  display:flex; align-items:center; justify-content:center; color:var(--blue,#1c5bd6);
  transition:background-color .18s ease, color .18s ease, border-color .18s ease; }
.okna-related__card:hover .okna-related__arrow{ background:var(--blue,#1c5bd6); border-color:var(--blue,#1c5bd6); color:#fff; }
.okna-related__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:40px; height:40px; border-radius:50%;
  background:#fff !important; border:1px solid var(--line,#e8ecf2); color:var(--ink,#123d87) !important; font-size:24px; line-height:1; cursor:pointer;
  box-shadow:0 6px 18px rgba(18,61,135,.12); transition:background-color .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
  display:flex; align-items:center; justify-content:center; padding:0 0 3px;
}
.okna-related__nav--prev{ left:-8px; }
.okna-related__nav--next{ right:-8px; }
.okna-related__nav:hover{ border-color:var(--blue,#1c5bd6) !important; color:var(--blue,#1c5bd6) !important; }
.okna-related__nav:active{ transform:translateY(-50%) translateY(1px); }
.okna-related__nav:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-related__nav[disabled]{ opacity:.35; cursor:default; box-shadow:none; }
.okna-related__nav[hidden]{ display:none; }
@media (max-width:1024px){ .okna-related__card{ flex-basis:280px; } }
@media (max-width:768px){
  .okna-related__title{ font-size:25px; }
  .okna-related__card{ flex-basis:84vw; }
  .okna-related__nav{ display:none !important; }
}

/* ============================================================
   КОРЗИНА (сбор заявки, localStorage) — otchet_korzina_1_yadro. Токены v4.
   ============================================================ */
/* Иконка корзины + счётчик в шапке */
.okna-header-cart{ position:relative; display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px;
  border-radius:10px; color:var(--ink,#123d87); text-decoration:none; flex:0 0 auto;
  transition:background-color .15s ease, color .15s ease; }
.okna-header-cart:hover{ background:var(--blue-soft,#eef3fc); color:var(--blue,#1c5bd6); }
.okna-cart-count{ position:absolute; top:1px; right:-2px; min-width:18px; height:18px; padding:0 4px; border-radius:999px;
  background:var(--red,#e0223a); color:#fff; font-size:11px; font-weight:800; line-height:18px; text-align:center; }
.okna-cart-count.is-empty{ display:none; }

/* Кнопка «В корзину» (теперь основная — база .okna-btn синяя; состояние ✓ — зелёное).
   Спецификность ✓ поднята (button.okna-btn.okna-tocart.is-incart), чтобы перебить синюю/вторичную заливку темы с !important. */
.okna-tocart{ cursor:pointer; }
button.okna-btn.okna-tocart.is-incart,
a.okna-btn.okna-tocart.is-incart,
.okna-tocart.is-incart{ background:#e8f6f0 !important; border-color:#1d9e75 !important; color:#1d9e75 !important; }
.okna-tocart--compact{ padding:9px 12px; font-size:13px; }

/* Тост-подтверждение */
.okna-toast{ position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px); z-index:10000;
  background:var(--ink,#123d87); color:#fff; font-weight:600; font-size:14px; padding:11px 20px; border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.25); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease; }
.okna-toast.is-show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ===== Страница корзины (редизайн по макету; токены v4) ===== */
/* max-width !important — выйти из узкой контент-колонки шаблона ТТ1 (.entry-content > * = 610px, спецификность 0,1,1). */
.okna-cart-wrap{ max-width:1100px !important; width:100%; margin:0 auto; padding:0 16px 56px; }
.okna-cart-page{ margin-top:8px; }

/* Шапка списка: счётчик товаров + «Очистить корзину» */
.okna-cart-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 16px; }
.okna-cart-head__count{ font-size:14px; font-weight:700; color:var(--muted,#6b7686); }
/* !important — перебить базовое правило кнопок ТТ1 (button:not(:hover)... спецификность 0,3,1). */
.okna-cart-clear{ display:inline-flex; align-items:center; gap:6px; border:0 !important; background:transparent !important; cursor:pointer;
  font-size:13px; font-weight:600; color:var(--muted,#6b7686) !important; padding:6px 8px; border-radius:8px; transition:color .15s ease, background-color .15s ease; }
.okna-cart-clear:hover{ color:var(--red,#e0223a) !important; background:#fdecee !important; }

/* ===== Шапка-карточка страницы корзины (токены v4) ===== */
.okna-cart-crumbs{ font-size:14px; color:var(--muted,#6b7686); margin:2px 0 24px; }
.okna-cart-crumbs a{ color:var(--blue,#1c5bd6); text-decoration:none; }
.okna-cart-crumbs a:hover{ color:var(--ink,#123d87); }
.okna-cart-crumbs span{ color:var(--ink,#123d87); }
.okna-cart-header{ display:flex; align-items:center; justify-content:space-between; gap:28px;
  background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px;
  box-shadow:0 12px 36px rgba(18,61,135,.05); padding:32px 44px; margin:0 0 22px; }
.okna-cart-header__titlerow{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.okna-cart-header__title{ margin:0; font-size:clamp(40px,4vw,52px); font-weight:800; line-height:1.1; color:var(--ink,#123d87); }
.okna-cart-header__count{ display:inline-flex; align-items:center; min-height:36px; padding:0 14px; border-radius:999px;
  background:var(--blue-soft,#eef3fb); color:var(--blue,#1c5bd6); font-size:17px; font-weight:600; }
.okna-cart-header__sub{ margin:14px 0 0; font-size:19px; color:var(--muted,#6b7686); }
.okna-cart-header__actions{ display:flex; align-items:center; gap:22px; flex-shrink:0; }
.okna-cart-header__continue{ display:inline-flex; align-items:center; justify-content:center; height:54px; padding:0 28px;
  border:2px solid var(--blue,#1c5bd6); border-radius:10px; background:#fff; color:var(--ink,#123d87);
  font-weight:700; text-decoration:none; white-space:nowrap; transition:background-color .15s ease, color .15s ease; }
.okna-cart-header__continue:hover{ background:var(--blue,#1c5bd6); color:#fff; }
/* кнопка очистки в шапке: лёгкая, CTA-red, без заливки (перебиваем !important базового .okna-cart-clear) */
.okna-cart-header__clear{ color:var(--red,#e0223a) !important; white-space:nowrap; padding:6px 4px; }
.okna-cart-header__clear:hover{ color:#c81a30 !important; background:transparent !important; text-decoration:underline; }

@media (max-width:768px){
  .okna-cart-crumbs{ margin-bottom:18px; }
  .okna-cart-header{ display:block; padding:24px 18px; border-radius:16px; }
  .okna-cart-header__title{ font-size:32px; }
  .okna-cart-header__count{ min-height:30px; padding:0 12px; font-size:15px; }
  .okna-cart-header__sub{ font-size:16px; }
  .okna-cart-header__actions{ display:grid; gap:12px; margin-top:22px; }
  .okna-cart-header__continue{ width:100%; height:48px; }
  .okna-cart-header__clear{ justify-content:center; }
}

/* Список + светлая карточка товара */
.okna-cart-list{ display:flex; flex-direction:column; gap:14px; }
.okna-cart-row{ display:grid; grid-template-columns:112px 1fr auto auto 40px; align-items:center; gap:18px;
  background:#fff; border:1px solid #dbe4f0; border-radius:18px; padding:16px 18px; transition:box-shadow .15s ease, border-color .15s ease; }
.okna-cart-row:hover{ border-color:#c9d8ee; box-shadow:0 6px 20px rgba(20,40,90,.06); }
.okna-cart-row__img{ width:112px; height:112px; border-radius:12px; background:#eef3fc center/cover no-repeat; flex:0 0 auto; }
.okna-cart-row__img--ph{ position:relative; }
.okna-cart-row__img--ph::after{ content:"📷"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:30px; opacity:.35; }

.okna-cart-row__info{ min-width:0; }
.okna-cart-row__cat{ font-size:11px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:var(--blue,#1c5bd6); margin-bottom:3px; }
.okna-cart-row__title{ display:inline-block; font-weight:800; color:var(--ink,#123d87); text-decoration:none; font-size:16px; line-height:1.3; }
.okna-cart-row__title:hover{ color:var(--blue,#1c5bd6); }
.okna-cart-row__art{ font-size:12px; color:var(--muted,#6b7686); margin-top:4px; }

/* Кликабельные бейджи-переключатель варианта: активный — залитая пилюля (стекло зелёный / установка синий). Клик → setVariant. */
.okna-cart-row__vswitch{ display:inline-flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.okna-cart-vbtn{ border:1px solid transparent !important; cursor:pointer; font-size:12px; font-weight:700; line-height:1; padding:7px 13px; border-radius:999px;
  background:#f2f5fa !important; color:var(--muted,#6b7686) !important; transition:background-color .15s ease, color .15s ease, border-color .15s ease; white-space:nowrap; }
.okna-cart-vbtn:hover{ color:var(--ink,#123d87) !important; }
.okna-cart-vbtn--glass.is-on{ background:#eefaf1 !important; color:#16803a !important; border-color:#bfe8ca !important; }
.okna-cart-vbtn--install.is-on{ background:#eef5ff !important; color:var(--blue,#1c5bd6) !important; border-color:#c9ddff !important; }
.okna-cart-vbtn__req{ font-weight:600; opacity:.85; font-size:11px; }

/* Наличие (если статус сохранён): зелёная точка «В наличии» / серая «Под заказ» */
.okna-cart-row__avail{ display:inline-flex; align-items:center; gap:6px; margin-top:9px; font-size:12px; font-weight:600; color:var(--muted,#6b7686); }
.okna-cart-dot{ width:8px; height:8px; border-radius:50%; background:#aeb7c4; flex:0 0 auto; }
.okna-cart-row__avail--ok{ color:#16803a; } .okna-cart-row__avail--ok .okna-cart-dot{ background:#21a35a; }
.okna-cart-row__avail--disc{ color:#b6603a; } .okna-cart-row__avail--disc .okna-cart-dot{ background:#d08a5a; }

/* Кол-во — светлый контрол в рамке (НЕ тёмные кнопки) */
.okna-cart-row__qty{ display:inline-flex; align-items:center; gap:4px; border:1px solid #dbe4f0; border-radius:12px; padding:4px; background:#fff; }
.okna-qty-btn{ width:36px; height:36px; border:0 !important; background:#f4f7fb !important; border-radius:9px; cursor:pointer; font-size:19px; line-height:1; color:var(--ink,#123d87) !important;
  display:inline-flex; align-items:center; justify-content:center; transition:background-color .15s ease, color .15s ease; }
.okna-qty-btn:hover{ background:var(--blue-soft,#eef3fc) !important; color:var(--blue,#1c5bd6) !important; }
.okna-qty-n{ min-width:30px; text-align:center; font-weight:800; font-size:15px; color:var(--ink,#123d87); }

/* Цена позиции — одна, крупная */
.okna-cart-row__pricecell{ text-align:right; white-space:nowrap; }
.okna-cart-row__sum{ font-weight:800; font-size:18px; color:var(--ink,#123d87); }
.okna-cart-row__sum--req{ font-size:14px; font-weight:700; color:var(--muted,#6b7686); }
.okna-cart-row__per{ font-size:11.5px; color:var(--muted,#6b7686); margin-top:3px; }

/* Удаление — лёгкий значок (НЕ тёмная кнопка), hover красноватый */
.okna-cart-row__rm{ width:38px; height:38px; border:0 !important; background:transparent !important; color:#aeb7c4 !important; cursor:pointer; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center; transition:background-color .15s ease, color .15s ease; }
.okna-cart-row__rm:hover{ background:#fdecee !important; color:var(--red,#e0223a) !important; }

/* Блок преимуществ под списком */
.okna-cart-adv{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:20px; }
.okna-cart-adv__item{ display:flex; align-items:flex-start; gap:12px; background:#f7faff; border:1px solid #e6eef9; border-radius:14px; padding:16px; }
.okna-cart-adv__ic{ font-size:24px; line-height:1; flex:0 0 auto; }
.okna-cart-adv__t{ font-size:14px; font-weight:800; color:var(--ink,#123d87); }
.okna-cart-adv__d{ font-size:12.5px; color:var(--muted,#6b7686); margin-top:3px; line-height:1.45; }

/* Итог-блок (sticky снизу): Итого + N товаров слева, кнопки справа */
.okna-cart-foot{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  margin-top:22px; padding:18px 22px; background:#fff; border:1px solid #dbe4f0; border-radius:16px;
  box-shadow:0 6px 20px rgba(20,40,90,.06); }
.okna-cart-total{ font-size:16px; color:var(--text,#1c2433); }
.okna-cart-total b{ font-size:24px; color:var(--ink,#123d87); margin-left:4px; }
.okna-cart-foot__count{ font-size:13px; color:var(--muted,#6b7686); margin-top:2px; }
.okna-cart-foot__act{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.okna-cart-foot__act .okna-btn{ white-space:nowrap; }
.okna-cart-continue{ text-decoration:none; }

/* Пустая корзина */
.okna-cart-empty{ text-align:center; padding:56px 16px; }
.okna-cart-empty__ic{ font-size:48px; opacity:.5; }
.okna-cart-empty__h{ margin:14px 0 6px; font-size:22px; color:var(--ink,#123d87); }
.okna-cart-empty__t{ margin:0 auto 20px; max-width:420px; color:var(--muted,#6b7686); font-size:14px; line-height:1.5; }
.okna-cart-empty__act{ display:inline-flex; gap:10px; flex-wrap:wrap; justify-content:center; }

/* Мобила: карточка перестраивается (фото+инфо сверху, кол-во+цена снизу, удаление в углу), итог компактный */
@media (max-width:600px){
  .okna-cart-row{ position:relative; grid-template-columns:84px 1fr auto; grid-template-areas:"img info info" "qty qty price"; gap:12px 14px; padding:14px; align-items:center; }
  .okna-cart-row__img{ grid-area:img; width:84px; height:84px; align-self:start; }
  .okna-cart-row__info{ grid-area:info; } .okna-cart-row__qty{ grid-area:qty; justify-self:start; }
  .okna-cart-row__pricecell{ grid-area:price; align-self:center; justify-self:end; }
  .okna-cart-row__rm{ position:absolute; top:8px; right:8px; }
  .okna-cart-adv{ grid-template-columns:1fr; }
  .okna-cart-foot{ flex-direction:column; align-items:stretch; position:static; }
  .okna-cart-foot__act{ flex-direction:column; }
  .okna-cart-foot__act .okna-btn{ width:100%; text-align:center; justify-content:center; }
}

/* Секция оформления заявки из корзины (CF7) — раскрывается кнопкой «Оформить заявку». */
.okna-cart-checkout{ margin-top:22px; background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; padding:22px 24px; }
.okna-cart-checkout__h{ margin:0 0 6px; font-size:20px; color:var(--ink,#123d87); }
.okna-cart-checkout__lead{ margin:0 0 16px; font-size:14px; color:var(--muted,#6b7686); line-height:1.5; }
.okna-cart-checkout .okna-cf7-row{ margin:0 0 12px; }
.okna-cart-checkout .okna-cf7-row label{ display:block; font-size:13px; font-weight:700; color:var(--ink,#123d87); }
.okna-cart-checkout .okna-cf7-row input,
.okna-cart-checkout .okna-cf7-row textarea{ margin-top:5px; }
.okna-cart-checkout .okna-req{ color:var(--red,#e0223a); }
.okna-cart-checkout .okna-cf7-acc{ margin:14px 0; font-size:13px; color:var(--text,#1c2433); }
.okna-cart-checkout .okna-cf7-acc .wpcf7-list-item{ margin:0; }
.okna-cart-checkout .wpcf7-spinner{ margin-left:10px; }
.okna-cart-checkout__ok{ background:#e8f6f0; border:1px solid #1d9e75; color:#137a57; border-radius:12px; padding:16px 18px; font-weight:700; }
.okna-cart-checkout .wpcf7-response-output{ border-radius:8px; margin:14px 0 0; } /* Волна 1: радиус 10→8 к канону блока-ответа */

/* Кнопка «В корзину» в панели попап-галереи (full + правая панель + тумблер). */
.okna-lb__tocart{ width:100%; text-align:center; justify-content:center; }

/* ===== HERO страницы УСЛУГИ (тёмный, фон-автобус, крошки, 2 CTA, преимущества с галочками). Токены v4. ===== */
.okna-uhero{ position:relative; width:100vw; margin-left:calc(50% - 50vw); background:#0e2348 no-repeat center center; background-size:cover; color:#fff; overflow:hidden; } /* full-bleed: вырыв из контейнера .okna-usluga(1080) */
/* ФИКС перекоса вправо (услуга): style.css:13 `.okna-usluga section{margin:34px 0}` (специфичность 0,1,1)
   перебивал full-bleed `.okna-uhero{margin-left:calc(50% - 50vw)}` (0,1,0) → margin-left обнулялся, hero
   оставался на левом крае колонки (188px) и при width:100vw вылезал на 188px вправо: гор.скролл, тёмный фон
   не доходил до левого края (белая полоса слева), весь экран казался сдвинутым. Возвращаем СИММЕТРИЧНЫЙ вырыв
   приоритетной специфичностью (0,3,2), scoped на tpl-usluga. width:auto + парные отрицательные margin (без
   100vw) → вертикальный скроллбар не добавляет ширины, перекоса/скролла нет. Вертикальные margin (34px) от
   style.css не трогаем (задаём только left/right). */
body.page-template-tpl-usluga .okna-usluga > section.okna-uhero{
  width:auto; max-width:none;
  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
}
.okna-uhero__shade{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(12,28,60,.94) 0%, rgba(12,28,60,.82) 48%, rgba(12,28,60,.35) 100%); }
.okna-uhero__inner{ position:relative; z-index:1; max-width:calc(var(--okna-cw) + 80px); margin:0 auto; min-height:520px; padding:64px 40px 72px; display:flex; flex-direction:column; justify-content:center; } /* контент по ЕДИНОЙ сетке 1200/pad40 = 1120 как главная */
.okna-uhero__crumbs{ font-size:14px; color:rgba(255,255,255,.8); margin:0 0 18px; }
.okna-uhero__crumbs a{ color:#fff; text-decoration:none; }
.okna-uhero__crumbs a:hover{ text-decoration:underline; }
.okna-uhero__crumbs .sep{ opacity:.5; margin:0 4px; }
.okna-uhero__crumbs .cur{ color:rgba(255,255,255,.72); }
/* ГЕО-посадки: крошки ВНУТРИ тёмного hero главной (.okna-hero-home), как на услугах (.okna-uhero__crumbs). Не отдельной светлой полосой. */
.okna-hero-home .okna-geo-crumbs{ font-size:14px; color:rgba(255,255,255,.8); margin:0 0 14px; line-height:1.5; }
.okna-hero-home .okna-geo-crumbs a{ color:#fff; text-decoration:none; }
.okna-hero-home .okna-geo-crumbs a:hover{ text-decoration:underline; }
.okna-hero-home .okna-geo-crumbs .sep{ opacity:.5; margin:0 4px; }
.okna-hero-home .okna-geo-crumbs .cur{ color:rgba(255,255,255,.72); }
.okna-uhero__h1{ font-size:clamp(30px,4vw,46px); font-weight:800; line-height:1.12; margin:0 0 16px; color:#fff; max-width:700px; }
.okna-uhero__sub{ font-size:19px; line-height:1.6; color:rgba(255,255,255,.88); max-width:620px; margin:0 0 26px; }
.okna-uhero__ctas{ display:flex; gap:14px; flex-wrap:wrap; margin:0 0 26px; }
.okna-uhero__ctas .okna-btn{ white-space:nowrap; }
/* спецификность .okna-uhero a.okna-btn.okna-uhero__ghost (0,3,1) — перебить базовое .okna-btn:not(.okna-btn--hero):not(.secondary) (0,3,0, синяя заливка) */
.okna-uhero a.okna-btn.okna-uhero__ghost{ background:transparent !important; color:#fff !important; border:2px solid rgba(255,255,255,.7) !important; box-shadow:none !important; }
.okna-uhero a.okna-btn.okna-uhero__ghost:hover,.okna-uhero a.okna-btn.okna-uhero__ghost:focus{ background:#fff !important; color:var(--ink,#123d87) !important; border-color:#fff !important; }
.okna-uhero__benefits{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:12px 26px; }
.okna-uhero__benefits li{ position:relative; padding-left:28px; font-size:15px; line-height:1.4; color:rgba(255,255,255,.92); }
.okna-uhero__benefits li::before{ content:""; position:absolute; left:0; top:0; width:19px; height:19px; background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2334d399' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E"); }
@media (max-width:768px){
  .okna-uhero__shade{ background:linear-gradient(180deg, rgba(12,28,60,.84), rgba(12,28,60,.93)); }
  .okna-uhero__inner{ min-height:auto; padding:38px 16px 42px; }
  .okna-uhero__h1{ font-size:28px; }
  .okna-uhero__sub{ font-size:16px; margin-bottom:20px; }
  .okna-uhero__ctas{ flex-direction:column; gap:10px; }
  .okna-uhero__ctas .okna-btn{ width:100%; text-align:center; justify-content:center; }
  .okna-uhero__benefits{ flex-direction:column; gap:10px; }
}

/* ============================================================================
 * ЕДИНЫЙ ОТКЛИК НАЖАТИЯ для кастомных кнопок страницы УСЛУГИ (tpl-usluga).
 * Эти кнопки не используют базовый .okna-btn (у него отклик уже есть), поэтому
 * у них не было :active (нет «вдавливания») и :focus мог «обелять» цвет (TT1).
 * Здесь добавляем: :active — translateY(1px) + затемнение фона; :focus — фиксируем
 * цвет/фон/бордер базовыми значениями через !important (TT1 не сбрасывает) + кольцо.
 * Всё под body.page-template-tpl-usluga → ГЛАВНАЯ и КАТАЛОГ не затронуты (там этого
 * класса body нет). Цвета — фактические из покоя usluga.css: picker/pf синий #1c5bd6,
 * geo красный #e0223a; на услуге picker сидит на ТЁМНОМ баннере → кольцо фокуса белое.
 * ========================================================================== */
body.page-template-tpl-usluga .okna-pick__btn,
body.page-template-tpl-glavnaya .okna-pick__btn, /* баннер «Подберём стекло» на главной (picker-dark, 03.07.2026) */
body.page-template-tpl-usluga .okna-geo-req__submit,
body.page-template-tpl-usluga .okna-pf2__cta-btn,
body.page-template-tpl-usluga .okna-bm__notfound,
body.page-template-tpl-usluga .okna-geo-req__more{
  transition:transform .12s ease, background-color .15s ease, box-shadow .15s ease, color .15s ease, border-color .15s ease;
}

/* — PICKER (тёмный баннер): «Получить консультацию» (--red→синяя) — синяя заливка — */
body.page-template-tpl-usluga .okna-pick__btn--red:active,
body.page-template-tpl-usluga .okna-pick__btn--red:hover:active,
body.page-template-tpl-glavnaya .okna-pick__btn--red:active,
body.page-template-tpl-glavnaya .okna-pick__btn--red:hover:active{
  background:#0f3f8c !important; border-color:#0f3f8c !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(8,22,55,.4);
}
body.page-template-tpl-usluga .okna-pick__btn--red:focus,
body.page-template-tpl-usluga .okna-pick__btn--red:focus-visible,
body.page-template-tpl-glavnaya .okna-pick__btn--red:focus,
body.page-template-tpl-glavnaya .okna-pick__btn--red:focus-visible{
  color:#fff !important; outline:none !important;
  box-shadow:0 0 0 3px rgba(255,255,255,.6) !important;
}
/* — PICKER (тёмный баннер): «Рассчитать стоимость» (--ghost) — контурная, белый текст — */
body.page-template-tpl-usluga .okna-pick__btn--ghost:active,
body.page-template-tpl-usluga .okna-pick__btn--ghost:hover:active,
body.page-template-tpl-glavnaya .okna-pick__btn--ghost:active,
body.page-template-tpl-glavnaya .okna-pick__btn--ghost:hover:active{
  background:rgba(255,255,255,.22) !important; border-color:#fff !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(8,22,55,.3);
}
body.page-template-tpl-usluga .okna-pick__btn--ghost:focus,
body.page-template-tpl-usluga .okna-pick__btn--ghost:focus-visible,
body.page-template-tpl-glavnaya .okna-pick__btn--ghost:focus,
body.page-template-tpl-glavnaya .okna-pick__btn--ghost:focus-visible{
  color:#fff !important; border-color:#fff !important; outline:none !important;
  box-shadow:0 0 0 3px rgba(255,255,255,.55) !important;
}

/* — GEO «Проверить выезд» (красная заливка, светлый фон) — */
body.page-template-tpl-usluga .okna-geo-req__submit:active,
body.page-template-tpl-usluga .okna-geo-req__submit:hover:active{
  background:#a8162a !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(160,20,40,.3);
}
body.page-template-tpl-usluga .okna-geo-req__submit:focus,
body.page-template-tpl-usluga .okna-geo-req__submit:focus-visible{
  color:#fff !important; outline:none !important;
  box-shadow:0 0 0 3px rgba(224,34,58,.3) !important;
}

/* — PRICE-FACTORS «Получить точный расчёт» (синяя заливка, светлый фон) — */
body.page-template-tpl-usluga .okna-pf2__cta-btn:active,
body.page-template-tpl-usluga .okna-pf2__cta-btn:hover:active{
  background:#0f3f8c !important; border-color:#0f3f8c !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(12,30,70,.28);
}
body.page-template-tpl-usluga .okna-pf2__cta-btn:focus,
body.page-template-tpl-usluga .okna-pf2__cta-btn:focus-visible{
  color:#fff !important; outline:none !important;
  box-shadow:0 0 0 3px rgba(28,91,214,.32) !important;
}

/* — Ссылки-кнопки (контурные/текстовые): «Не нашли марку?» + «Добавить фото» —
   цвет текста не трогаем (не белеет), только лёгкое вдавливание + кольцо фокуса. */
body.page-template-tpl-usluga .okna-bm__notfound:active{ transform:translateY(1px); background:rgba(28,91,214,.06) !important; }
body.page-template-tpl-usluga .okna-bm__notfound:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.25) !important; }
body.page-template-tpl-usluga .okna-geo-req__more:active{ transform:translateY(1px); }
body.page-template-tpl-usluga .okna-geo-req__more:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.25) !important; border-radius:8px; }

/* ===== ДОПОЛНЕНИЕ (продолжение слоя): вкладки марок, «показать больше», стрелки каруселей ===== */
/* плавность press/кольца для добавляемых элементов */
body.page-template-tpl-usluga .okna-pf2__more,
body.page-template-tpl-usluga .okna-bm__tab,
body.page-template-tpl-usluga .okna-bm__arrow,
body.page-template-tpl-usluga .okna-pf2__arrow{
  transition:transform .12s ease, background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

/* — PRICE-FACTORS «Показать больше — весь каталог» (.okna-pf2__more): синяя контурная, на hover заливается.
   active → тёмно-синяя заливка + вдавливание; focus → сохраняем контур (не белеет) + синее кольцо. */
body.page-template-tpl-usluga .okna-pf2__more:active,
body.page-template-tpl-usluga .okna-pf2__more:hover:active{
  background:#0f3f8c !important; border-color:#0f3f8c !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(12,30,70,.28);
}
body.page-template-tpl-usluga .okna-pf2__more:focus-visible{
  background:#fff !important; color:var(--pf-blue,#1c5bd6) !important; border-color:var(--pf-blue,#1c5bd6) !important;
  outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.3) !important;
}

/* — BRANDS вкладки стран (.okna-bm__tab): фиксируем цвет в :active/:focus (TT1 не белит) + вдавливание.
   НЕактивная — светлый контур + тёмный текст; активная (.is-active) — синяя заливка + белый текст.
   JS-логику переключения и класс .is-active не трогаем — только CSS-состояния. */
body.page-template-tpl-usluga .okna-bm__tab:active,
body.page-template-tpl-usluga .okna-bm__tab:focus{
  background:#f3f7ff !important; color:var(--ink,#123d87) !important; border-color:#dbe4f0 !important;
}
body.page-template-tpl-usluga .okna-bm__tab:active{ transform:translateY(1px); }
body.page-template-tpl-usluga .okna-bm__tab:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.28) !important; }
/* активная вкладка «Все N марок» — СИНЕЙ остаётся во всех состояниях (выше специфичность, чем у общего :active) */
body.page-template-tpl-usluga .okna-bm__tab.is-active,
body.page-template-tpl-usluga .okna-bm__tab.is-active:hover,
body.page-template-tpl-usluga .okna-bm__tab.is-active:active,
body.page-template-tpl-usluga .okna-bm__tab.is-active:focus{
  background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important;
}
body.page-template-tpl-usluga .okna-bm__tab.is-active:active{ transform:translateY(1px); }
body.page-template-tpl-usluga .okna-bm__tab.is-active:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(255,255,255,.55), 0 0 0 5px rgba(28,91,214,.4) !important; }

/* — Стрелки каруселей: лёгкое вдавливание + кольцо, БЕЗ обеления.
   .okna-bm__arrow центрируется translateY(-50%) → press ДОБАВЛЯЕМ к центрированию (не заменяем);
   .okna-pf2__arrow без центрирующего трансформа → простой translateY(1px). */
body.page-template-tpl-usluga .okna-bm__arrow:active{ transform:translateY(-50%) translateY(1px); }
body.page-template-tpl-usluga .okna-bm__arrow:focus-visible{ outline:none !important; box-shadow:0 6px 18px rgba(12,28,60,.14), 0 0 0 3px rgba(28,91,214,.3) !important; }
body.page-template-tpl-usluga .okna-pf2__arrow:active{ transform:translateY(1px); }
body.page-template-tpl-usluga .okna-pf2__arrow:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.3) !important; }

/* ===== ДОПОЛНЕНИЕ: кнопка «Все марки автобусов» + карточки автобусов (price-factors) ===== */

/* — «Все марки автобусов» (.okna-bm__all, brands). Её вид (синяя заливка) задаёт glavnaya.css ГЛОБАЛЬНО
   (правило не под .glavnaya-v4 → действует и на услуге), но :active/:focus у неё не было → TT1 обелял при
   нажатии. Делаем слой услуги САМОДОСТАТОЧНЫМ (геометрия + все состояния, !important от TT1), вид синей
   заливной кнопки сохраняем (как на главной — не «контур», чтобы услуга и главная совпадали). */
body.page-template-tpl-usluga .okna-bm__all{
  display:inline-flex; align-items:center; height:44px; padding:0 22px; border-radius:11px;
  font-size:15px; font-weight:700; white-space:nowrap; text-decoration:none !important;
  background:var(--blue,#1c5bd6) !important; color:#fff !important; border:1.5px solid var(--blue,#1c5bd6) !important;
  transition:transform .12s ease, background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
body.page-template-tpl-usluga .okna-bm__all:hover{ background:#1448aa !important; border-color:#1448aa !important; color:#fff !important; }
body.page-template-tpl-usluga .okna-bm__all:active,
body.page-template-tpl-usluga .okna-bm__all:hover:active{
  background:#0f3f8c !important; border-color:#0f3f8c !important; color:#fff !important;
  transform:translateY(1px); box-shadow:0 3px 10px rgba(12,30,70,.28);
}
body.page-template-tpl-usluga .okna-bm__all:focus,
body.page-template-tpl-usluga .okna-bm__all:focus-visible{
  background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important;
  outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.32) !important;
}

/* — Карточки автобусов-ссылки (.okna-pf2__card--link, price-factors). :hover (подъём -2px + тень) уже задан
   глобально в glavnaya.css и действует на услуге — не дублируем. Добавляем только: убрать браузерный
   ПУНКТИР при фокусе и дать аккуратное синее кольцо (с клавиатуры) + отклик нажатия (вдавливание). */
body.page-template-tpl-usluga .okna-pf2__card--link:active{
  transform:translateY(0) !important;                 /* возврат с hover(-2px) вниз = эффект нажатия */
  box-shadow:0 4px 12px rgba(28,91,214,.16) !important;
}
body.page-template-tpl-usluga .okna-pf2__card--link:focus{ outline:none !important; }   /* убрать пунктир при клике мышью */
body.page-template-tpl-usluga .okna-pf2__card--link:focus-visible{
  outline:none !important; border-color:var(--blue,#1c5bd6) !important;
  box-shadow:0 0 0 2px var(--blue,#1c5bd6), 0 12px 28px rgba(28,91,214,.12) !important;   /* синее кольцо с клавиатуры */
}

/* ===== Попап-кнопки hero/brands переведены с <a href="#"> на <button> (убран мусорный «#» из URL) =====
   ТТ1 грузится ПОСЛЕ design.css и переопределяет голый <button> (шрифт/фон/паддинг/бордер/вес/выравнивание).
   Возвращаем им вид прежнего <a> — спецификностью + !important (не порядком; см. памятку про TT1).
   Старое ghost-правило ~стр.819 целило a.* — дублируем под button.*. JS попапов ловит по классу — тег не важен. */
.okna-uhero__ctas button.okna-btn{   /* hero btn1 (красная) + ghost: вернуть наследуемый шрифт Manrope */
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
.okna-uhero button.okna-btn.okna-uhero__ghost{   /* как a.okna-uhero__ghost: контур, прозрачный фон, белый текст */
  background:transparent !important; color:#fff !important;
  border:2px solid rgba(255,255,255,.7) !important; box-shadow:none !important;
}
.okna-uhero button.okna-btn.okna-uhero__ghost:hover,
.okna-uhero button.okna-btn.okna-uhero__ghost:focus{
  background:#fff !important; color:var(--ink,#123d87) !important; border-color:#fff !important;
}
button.okna-bm__notfound{   /* brands «не нашли марку»: снять ТТ1-button-стили, вернуть вид ссылки-плашки */
  -webkit-appearance:none; appearance:none;
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  font-weight:400 !important; text-align:left !important;
  padding:0 !important; background:transparent !important; border:0 !important; color:inherit !important;
}

/* ============ Блок «Отправьте фото стекла» (final-form, .okna-pf-form) — ГЛОБАЛЬНО на всех шаблонах, где выводится блок (каталог/категории/марки/посадочные/услуга). Скоуп по классу .okna-pf-form. ============ */
#final-form.okna-pf-form{ margin:44px 0; padding:0; }
.okna-pf-form__card{ background:#fff; border:1px solid #eef2f8; border-radius:22px; box-shadow:0 18px 50px rgba(18,61,135,.08); padding:40px; }
.okna-pf-form__grid{ display:grid; grid-template-columns:1.4fr .85fr; gap:32px; align-items:stretch; }
.okna-pf-form__h2{ margin:0 0 12px; font-weight:800; font-size:30px; line-height:1.15; color:var(--ink,#123d87); text-align:left; }
.okna-pf-form__h2::after{ content:""; display:block; width:52px; height:3px; background:var(--red,#e0223a); border-radius:999px; margin-top:12px; }
.okna-pf-form__sub{ margin:2px 0 22px; color:var(--muted,#6b7686); font-size:17px; line-height:1.6; max-width:780px; }
/* поля формы */
.okna-pf-form .okna-cf7-row{ margin:0 0 16px; }
.okna-pf-form .okna-cf7-row label{ display:block; font-size:14px; font-weight:700; color:var(--ink,#123d87); }
.okna-pf-form .wpcf7-form-control.wpcf7-text{ width:100%; margin-top:7px; padding:13px 14px 13px 44px; font-size:15px; border:1px solid #dbe4f0 !important; border-radius:10px !important; background-color:#fff; color:#1c2433; box-shadow:none !important; background-repeat:no-repeat; background-position:14px center; background-size:20px 20px; }
.okna-pf-form .wpcf7-form-control.wpcf7-text:focus{ border-color:var(--blue,#1c5bd6) !important; outline:none; box-shadow:0 0 0 3px rgba(28,91,214,.12) !important; }
.okna-pf-form .wpcf7-form-control.wpcf7-text::placeholder{ color:#9bb0cc; }
.okna-cf7-row--phone .wpcf7-form-control.wpcf7-text{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d93b3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h3l2 5-2.2 1.1a11 11 0 0 0 5.1 5.1L14 13l5 2v3a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }
.okna-cf7-row--mark .wpcf7-form-control.wpcf7-text{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d93b3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='11' rx='2'/%3E%3Cpath d='M4 11h16'/%3E%3Ccircle cx='8' cy='18.5' r='1.4'/%3E%3Ccircle cx='16' cy='18.5' r='1.4'/%3E%3C/svg%3E"); }
.okna-cf7-row--name .wpcf7-form-control.wpcf7-text{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d93b3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20a7 7 0 0 1 14 0'/%3E%3C/svg%3E"); }
/* зона фото */
.okna-pf-form .okna-photo__label{ display:block; font-size:14px; font-weight:700; color:var(--ink,#123d87); margin:0 0 8px; }
.okna-pf-form .okna-photo__zone{ border:2px dashed #cdd9ec !important; border-radius:14px; background:#f8fbff; padding:30px 20px; gap:10px; }
.okna-pf-form .okna-photo__zone:hover,
.okna-pf-form .okna-photo__zone.is-over{ border-color:var(--blue,#1c5bd6) !important; background:#eff5ff; }
.okna-pf-form .okna-photo__ic{ width:48px; height:48px; border-radius:50%; background-color:#eaf1ff; background-size:24px 24px; border:1px solid #dceaff; }
.okna-pf-form .okna-photo__txt{ font-weight:700; color:var(--ink,#123d87); font-size:15px; }
.okna-pf-form .okna-photo__pick{ color:var(--blue,#1c5bd6); }
.okna-pf-form .okna-photo__hint{ color:var(--muted,#6b7686); font-size:12px; }
/* согласие */
.okna-pf-form .okna-cf7-acc{ margin:14px 0 16px; font-size:14px; }
.okna-pf-form .wpcf7-acceptance .wpcf7-list-item{ margin:0; }
.okna-pf-form .wpcf7-acceptance label{ display:flex; align-items:center; gap:9px; font-weight:500 !important; color:#5a6678 !important; cursor:pointer; }
.okna-pf-form .wpcf7-acceptance input[type=checkbox]{ width:18px; height:18px; accent-color:var(--blue,#1c5bd6); flex:none; }
.okna-pf-form .okna-cf7-acc a{ color:var(--blue,#1c5bd6) !important; text-decoration:none; }
.okna-pf-form .okna-cf7-acc a:hover{ text-decoration:underline; }
/* submit + trust */
.okna-pf-form .okna-cf7-submit{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin:4px 0 0; }
.okna-pf-form .wpcf7-submit{ background:var(--red,#e0223a) !important; color:#fff !important; border:0 !important; border-radius:8px !important; padding:13px 28px !important; font-size:16px !important; font-weight:700 !important; cursor:pointer; box-shadow:0 10px 24px rgba(224,34,58,.28) !important; transition:background .15s; width:auto !important; } /* Волна 3 §6.4: pf-form submit радиус 12→8, кегль 15→16 (канон; красная тень корректна — кнопка красная) */
.okna-pf-form .wpcf7-submit:hover,
.okna-pf-form .wpcf7-submit:focus{ background:var(--red-hover,#c81a30) !important; }
.okna-pf-form .okna-cf7-trust{ display:flex; align-items:center; gap:8px; color:var(--muted,#6b7686); font-size:12.5px; line-height:1.35; }
.okna-pf-form .okna-cf7-trust__ic{ color:#9fb3cf; flex:none; }
.okna-pf-form .wpcf7-spinner{ margin:0 0 0 6px; }
/* ПРАВАЯ карточка «Как это работает» */
.okna-pf-form__how{ background:#f6f9fd; border:1px solid #eaf1fb; border-radius:18px; padding:26px 24px; display:flex; flex-direction:column; }
.okna-pf-form__how-title{ margin:0 0 18px; font-size:19px; font-weight:800; color:var(--ink,#123d87); }
.okna-pf-steps{ list-style:none; margin:0; padding:0; }
.okna-pf-step{ position:relative; display:flex; gap:14px; padding:0 0 22px; }
.okna-pf-step:last-child{ padding-bottom:4px; }
.okna-pf-step::before{ content:""; position:absolute; left:19px; top:44px; bottom:-2px; border-left:2px dashed #cdd9ec; }
.okna-pf-step:last-child::before{ display:none; }
.okna-pf-step__ic{ flex:none; width:40px; height:40px; border-radius:50%; background:#fff; border:1px solid #dbe7f7; display:flex; align-items:center; justify-content:center; color:var(--blue,#1c5bd6); position:relative; z-index:1; }
.okna-pf-step__ic svg{ width:20px; height:20px; }
.okna-pf-step__body{ display:flex; flex-direction:column; gap:3px; padding-top:3px; }
.okna-pf-step__t{ font-size:14.5px; font-weight:700; color:var(--ink,#123d87); }
.okna-pf-step__d{ font-size:13px; color:var(--muted,#6b7686); line-height:1.4; }
.okna-pf-form__bus{ margin-top:auto; padding-top:16px; }
.okna-pf-form__bus img{ display:block; width:100%; height:auto; border-radius:12px; }
/* мобайл: одна колонка, форма → карточка */
@media(max-width:768px){
  .okna-pf-form__grid{ grid-template-columns:1fr; gap:22px; }
  .okna-pf-form__card{ padding:24px 18px; }
  .okna-pf-form__h2{ font-size:24px; }
  .okna-pf-form .okna-cf7-submit{ gap:12px; }
  .okna-pf-form .wpcf7-submit{ width:100% !important; }
}

/* ============ Блок «Теги» — НЕЗАМЕТНАЯ строка ПОД футером (часть тёмного основания) ============ */
/* Рендерится через wp_footer (между </footer> и </body>). Фон = футер, без воздуха; ширина/левый край = футер. */
/* Теги = ТОЧНАЯ копия футера. Футер: тёмная плашка (.site-footer max-width:var(--responsive--alignwide-width)+
   margin auto) ВНУТРИ #page (белый фон по краям). Повторяем 1:1: секция .okna-ftags — белая на всю ширину (как
   #page; body под тегами иначе мятный), .okna-ftags__plate — тёмная плашка ТОЙ ЖЕ переменной → ширина/края/цвет
   краёв совпадают с футером на всех ширинах. Единая колонна, без полос. */
.okna-ftags{ background:#fff; margin:0; padding:0; }
/* ★ W3-P02B, 30.07.2026: рамка и отступ приведены к канону оболочки.
 *
 * ОСТАТОК МИГРАЦИИ КОНТЕЙНЕРА. Раньше здесь стояло `calc(var(--okna-cw) + 80px)`
 * и `padding: 0 40px`. После миграции `--okna-cw` на 1216px сумма дала 1296px —
 * шире канонических 1280.
 *
 * ★ ЧИСЛО БЕРЁТСЯ ИЗ РЕЕСТРА, А НЕ ВОССТАНАВЛИВАЕТСЯ СЛОЖЕНИЕМ.
 * `calc(var(--okna-cw) + 64px)` дало бы сегодня те же 1280, но завязало бы
 * рамку на переменную КОНТЕНТА и записало бы боковое поле в двух местах сразу
 * (в `calc` и в `padding`) — рассинхрон при следующей правке гарантирован.
 * Взято прямое `--ok-container-max` из `ok-tokens.css:35`. Проверено живьём:
 * токены объявлены на `:root` (не под флагом оболочки), лист `ok-tokens.css`
 * подключается вне гейта флага (`functions.php:61-76` против `:83`), значения
 * на узле не пусты ни на одной из трёх ширин. Фолбэки оставлены на случай,
 * если лист когда-нибудь отцепят.
 *
 * ★ ТРИ СТУПЕНИ ОТСТУПА, А НЕ ОДНА — ИНАЧЕ ЭТО ПОЛОВИНА РАБОТЫ.
 * Канон контейнера трёхступенчатый: 32 / 24 / 16 (`ok-layout.css:33`, `:152`,
 * `:175`). Жёсткие 32 на всех ширинах давали ступеньку против футера, стоящего
 * прямо над блоком. Замерено по левому краю ТЕКСТА:
 *
 *     ширина 1440   футер 104,5   теги 104,5   ступенька 0
 *     ширина 1024   футер  24     теги  32     ступенька +8   ← было +16
 *     ширина  375   футер  16     теги  32     ступенька +16  ← было +24
 *
 * Правка «+80→+64» одна уменьшила ступеньку вдвое и объявила бы дефект
 * закрытым. Поэтому ступени доведены до канона: 0 / 0 / 0.
 * ★ Токены отступа сами по себе по ширине НЕ переключаются — это три
 * независимых статических значения. Переключение живёт в правиле, поэтому
 * медиазапросы ниже обязательны, одним `var()` не обойтись.
 *
 * ★ `max-width` У `__inner` — СТРАХОВКА, А НЕ МЁРТВЫЙ КОД. Проверено опытом в
 * странице: при снятом `max-width` у плашки внутренний узел останавливается
 * ровно на 1280 вместо 1425. Сегодня он не связывает ни одного пикселя (потомок
 * `width:auto` не бывает шире родителя), но правка одной строки из двух развела
 * бы плашку с содержимым.
 *
 * ★ `--okna-cw` НЕ ТРОГАЕТСЯ: переменная общая, 51 обращение в 16 листах темы.
 *
 * ══ ОХВАТ: ЭТО СОСТОЯНИЕ ДАННЫХ, А НЕ ОГРАНИЧЕНИЕ КОДА ═══════════════════
 * Прежняя запись здесь гласила «узел встречается на ОДНОЙ услуге из
 * тринадцати; появление на остальных двенадцати — регресс». Замер по коду и БД
 * показал, что это неверно вдвойне:
 *
 *   гейт `okna_tags_eligible()` (`inc/usluga-tags.php:37-50`) пропускает
 *   ВЕСЬ CPT `seo_filter` плюс 15 шаблонов страниц — 771 запись из 790;
 *   метабокс предлагается редактору на всех них;
 *   заполнено полей — 2, поэтому блок печатается на ДВУХ страницах.
 *
 * Разметку печатает `blocks/usluga-tags.php:14-18`; `inc/usluga-tags.php` —
 * гейт и метабокс, разметки не печатает. Появление блока на новой странице —
 * штатное поведение по заполнению поля, а НЕ регресс вёрстки.
 *
 * ★ ВТОРАЯ СТРАНИЦА — ОПУБЛИКОВАННЫЙ МУСОР, НЕ ДЕФЕКТ ЭТОЙ ПРАВКИ:
 * `seo_filter` ID 1702, `/katalog/stekla-maz-203-205-206-226/`, значение поля
 * `123412341234` видно на боевой странице тёмной полосой под футером. Позиция
 * заведена, чистка — не предмет пакета по вёрстке.
 *
 * ★ КОММЕНТАРИЙ НАД ЭТИМ БЛОКОМ (строки выше) ОПИСЫВАЕТ ФУТЕР, КОТОРОГО НЕТ.
 * Он требует «совпадения краёв плашки с футером»; живой футер `max-width:none`,
 * full-bleed (`ok-footer.css:155`), фон `#12161f` против `#161a24` у плашки.
 * Совпадают не края фона, а рельс контента — и теперь совпадают точно.
 * Переписывать чужой контракт этот пакет не уполномочен: позиция заведена.
 *
 * `design.css` — канонический источник компонентов, и правка здесь допущена
 * как точечное исключение. Прецедента на попутную уборку она не создаёт. */
.okna-ftags__plate{ background:var(--graphite-2,#161a24); color:var(--muted-d,#9aa4b6); max-width:var(--ok-container-max,1280px); margin:0 auto; }
.okna-ftags__inner{ max-width:var(--ok-container-max,1280px); margin:0 auto; padding:0 var(--ok-container-pad-desktop,32px); }
/* Ступени отступа — теми же точками перелома, что у `.ok-container` в футере. */
@media(max-width:1024px){ .okna-ftags__inner{ padding:0 var(--ok-container-pad-tablet,24px); } }
@media(max-width:600px){  .okna-ftags__inner{ padding:0 var(--ok-container-pad-mobile,16px); } }
/* СВЁРНУТО = одна неприметная строка (inline-стиль контента перебиваем !important: было 18px/700) */
.okna-ftags summary{ color:#6b7280 !important; font-size:13px !important; font-weight:400 !important; line-height:1.4 !important; padding:9px 0 !important; margin:0 !important; list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.okna-ftags summary:hover{ color:#9aa4b6 !important; }
.okna-ftags summary::-webkit-details-marker{ display:none; }
.okna-ftags summary::after{ content:"\25BE"; font-size:.8em; color:#6b7280; transition:transform .2s; }
.okna-ftags details[open] > summary::after{ transform:rotate(180deg); }
/* РАСКРЫТО — группы и чипы в той же левой обёртке */
.okna-ftags details > div{ padding-bottom:24px; }
.okna-ftags h3{ color:#aeb8c9; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin:18px 0 2px; padding:0; border:0; }
.okna-ftags a{ color:#cfd6e2; text-decoration:none; border-color:#39414f !important; font-size:12.5px; line-height:1.2; transition:background .15s, border-color .15s, color .15s; display:inline-block; }
.okna-ftags a:hover{ color:#fff; border-color:#6b7686 !important; background:rgba(255,255,255,.06); }
@media(max-width:768px){ .okna-ftags a{ font-size:12px; } }

/* ============ «Верхние теги» — компактная строка тегов-ссылок НАД листингом (seo_filter) ============ */
/* «Верхние теги» — ОДНА горизонтальная строка-скролл под H2 «Подходящие стёкла» (chip, фирменный синий). */
.okna-vtags{ position:relative; margin:2px 0 20px; }
.okna-vtags__track{ display:flex; flex-wrap:nowrap; gap:8px; overflow-x:auto; overflow-y:hidden; padding:2px 0 8px;
  scroll-behavior:smooth; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#c5d4ea transparent;
  -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 34px),transparent); mask-image:linear-gradient(to right,#000 calc(100% - 34px),transparent); }
.okna-vtags__track::-webkit-scrollbar{ height:6px; }
.okna-vtags__track::-webkit-scrollbar-thumb{ background:#c5d4ea; border-radius:6px; }
.okna-vtags__track::-webkit-scrollbar-track{ background:transparent; }
.okna-vtags .okna-vtag{ display:inline-flex; align-items:center; flex:0 0 auto; white-space:nowrap; padding:7px 14px;
  border:1px solid #c5d4ea !important; border-radius:18px; background:#f3f7fd !important; color:#1b4f9c !important;
  text-decoration:none !important; font-size:13.5px; font-weight:600; line-height:1.2; cursor:pointer;
  transition:background .15s, border-color .15s, color .15s; }
.okna-vtags .okna-vtag:hover{ background:#e7f0fc !important; border-color:#1b4f9c !important; color:#163f7d !important; }
.okna-vtags .okna-vtag:focus-visible{ outline:2px solid #1b4f9c !important; outline-offset:2px; }
.okna-vtags .okna-vtag:active,.okna-vtags .okna-vtag.is-active{ background:#1b4f9c !important; color:#fff !important; border-color:#1b4f9c !important; }
@media(max-width:600px){ .okna-vtags{ margin-bottom:14px; } .okna-vtags .okna-vtag{ font-size:12.5px; padding:6px 12px; } }

/* H2 секции каталога «Подходящие стёкла» — привести к ЕДИНОЙ системе H2 сайта (.okna-section-title). */
.okna-cat-head__l h2{ position:relative; margin:0 !important; padding-bottom:12px !important; font-size:30px !important;
  line-height:1.15 !important; font-weight:800 !important; color:var(--ink,#123d87) !important; text-align:left !important; }
.okna-cat-head__l h2::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a); }
@media(max-width:600px){ .okna-cat-head__l h2{ font-size:25px !important; } }

/* ============================================================
   FAQ — ЕДИНЫЙ компактный аккордеон на ВЕСЬ сайт (КАНОН).
   Эталон = вид главной (Г3.1, одобрен владельцем): карточка с padding:0 22px,
   summary 17px flex, ОДИН значок-кружок слева («+» → синий залитый «×»),
   ответ 15px с выравниванием под текст вопроса. Правило: FAQ на любой странице —
   только okna_faq_render() + класс .okna-faq; вид меняется ТОЛЬКО здесь, глобально.
   См. 02_ARCHITECTURE/_PRAVILA/SKILL_faq.md. Статейный FAQ блога/новостей
   (.okna-blog-faq, blog.css) — отдельный компонент, сюда не относится.
   ============================================================ */
.okna-faq{ margin:34px 0; }
.okna-faq .okna-faq-list{ display:block; }
.okna-faq details{ background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px;
  margin-bottom:12px; padding:0 22px; box-shadow:var(--shadow-sm); overflow:hidden; }
.okna-faq summary{ list-style:none; cursor:pointer; padding:20px 0; font-weight:700; font-size:17px;
  color:var(--ink,#123d87); display:flex; align-items:center; gap:16px; }
.okna-faq summary::-webkit-details-marker{ display:none; }
.okna-faq summary::before{ content:"+"; flex:none; width:34px; height:34px; border-radius:50%;
  border:2px solid var(--blue,#1c5bd6); color:var(--blue,#1c5bd6); display:grid; place-items:center;
  font-size:20px; font-weight:600; line-height:1; box-sizing:border-box;
  transition:background .2s, color .2s, transform .2s; }
.okna-faq details[open] summary::before{ content:"\00d7"; background:var(--blue,#1c5bd6);
  border-color:var(--blue,#1c5bd6); color:#fff; }
.okna-faq summary::after{ content:none; } /* один значок: никаких шевронов справа */
/* панель ответа: компактная, текст выровнен под вопросом (кружок 34px + gap 16px = 50px) */
.okna-faq details > div{ padding:0 0 18px 50px; color:var(--muted,#6b7686); font-size:15px; line-height:1.6; }
/* типографика длинных ответов (HTML из метабокса FAQ) */
.okna-faq details > div > *:first-child{ margin-top:0; }
.okna-faq details > div > *:last-child{ margin-bottom:0; }
.okna-faq details > div p{ margin:0 0 10px; }
.okna-faq details > div strong{ color:var(--ink,#123d87); font-weight:700; }
.okna-faq details > div h3, .okna-faq details > div h4{ font-size:15px; color:var(--ink,#123d87); font-weight:700; margin:12px 0 6px; }
.okna-faq details > div ul, .okna-faq details > div ol{ list-style:none; padding:0; margin:8px 0 12px; display:grid; gap:6px; }
.okna-faq details > div li{ position:relative; padding-left:20px; }
.okna-faq details > div ul li::before{ content:""; position:absolute; left:4px; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--blue,#1c5bd6); }
.okna-faq details > div ol{ counter-reset:okfa; }
.okna-faq details > div ol li{ counter-increment:okfa; }
.okna-faq details > div ol li::before{ content:counter(okfa) "."; position:absolute; left:0; color:var(--blue,#1c5bd6); font-weight:700; }
/* механика «Показать ещё вопросы» (okna_faq_render при >6 вопросов) */
.okna-faq-toggle{ display:none; }
.okna-faq-extra{ display:none; }
.okna-faq-toggle:checked ~ .okna-faq-extra{ display:block; }
.okna-faq-morebtn{ display:inline-block; margin-top:10px; color:var(--blue,#1c5bd6); cursor:pointer; font-weight:700; font-size:14px; }
.okna-faq-morebtn:hover{ color:var(--ink,#123d87); }
.okna-faq-more-hide{ display:none; }
.okna-faq-toggle:checked ~ .okna-faq-morebtn .okna-faq-more-show{ display:none; }
.okna-faq-toggle:checked ~ .okna-faq-morebtn .okna-faq-more-hide{ display:inline; }
/* ★ FAQ «как на главной» (решение владельца): панель #f5f8fd для о-компании и B2B (услуга — своя в usluga-view.css).
   Значок канона и так слева (::before первый), подзаголовок/тумблер убраны в PHP. */
/* ★ FAQ = СТАНДАРТ ГЛАВНОЙ ВЕЗДЕ (решение владельца 03.09): band #f5f8fd во всю ширину, карточки на оси
   контента (как .ok-faq на главной), без boxed-панели — и десктоп, и мобилка. */
.ok-about-faq .okna-faq{ background:transparent; border-radius:0; padding:0; margin:0; }                              /* О компании: .ok-about-faq уже band + .ok-about-container — снять внутреннюю панель */
.okna-org-sec .okna-faq{ background:var(--ok-section-b,#f5f8fd); border-radius:0; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); padding:44px calc(50vw - 50% + 16px) 48px; } /* B2B: full-bleed band, контент на ось колонки +16 */
.ok-about-faq .okna-faq > h2, .okna-org-sec .okna-faq > h2{ font-size:23px; text-align:left; margin:0 0 14px; }
/* Категории каталога (body.ok-catalog): десктоп FAQ = band как на главной (мобилка — ok-catalog.css @media≤600 full-bleed). */
@media(min-width:601px){ body.ok-catalog .okna-faq{ background:var(--ok-section-b,#f5f8fd); border-radius:0; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); padding:44px calc(50vw - 50% + 16px) 48px; } body.ok-catalog .okna-faq h2{ font-size:23px !important; margin:0 0 14px; } }
/* мобилка: те же пропорции, чуть плотнее */
@media(max-width:600px){
  /* B2B мобилка: full-bleed проще минусовым margin (=16px padding .okna-wrap), 16px inset — карточки 358 на 390 (десктоп-calc выше даёт на мобилке лишнее). */
  .okna-org-sec .okna-faq{ margin-left:-16px; margin-right:-16px; padding:44px 16px 48px; }
  .okna-faq details{ padding:0 16px; }
  .okna-faq summary{ padding:16px 0; font-size:16px; gap:12px; }
  .okna-faq summary::before{ width:30px; height:30px; font-size:18px; }
  .okna-faq details > div{ padding:0 0 16px 42px; }
}

/* ============================================================
   КАНОН СТРЕЛОК каруселей — .okna-hscroll-nav (единственный вид стрелок на сайте).
   Стиль фирменных кнопок переключения (скруг-квадрат 42px, белый, синий hover;
   !important — против кнопочного стека TT1). Переехал из blog-list.css.
   ПРАВИЛО: новые стрелки НЕ рисовать — только этот класс (SKILL_strelki.md).
   ============================================================ */
.okna-hscroll-nav{ width:42px; height:42px; flex:0 0 auto; border-radius:10px !important; display:inline-flex; align-items:center; justify-content:center;
  background:#fff !important; border:1px solid #dbe4f0 !important; color:var(--ink,#123d87) !important; font-size:22px; line-height:1; cursor:pointer; padding:0 !important;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease; }
.okna-hscroll-nav:hover{ background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important; }
.okna-hscroll-nav:disabled{ opacity:.4; cursor:default; pointer-events:none; }
.okna-hscroll-nav[hidden]{ display:none; }
.okna-hscroll-nav:focus-visible{ outline:none !important; box-shadow:0 0 0 3px rgba(28,91,214,.3) !important; }

/* ============================================================
   «Наши партнёры» — общесайтовый компонент-слайдер .okna-part
   (inc/partners-slider.php: главная + страницы-визитки tpl-partner).
   Переехал из glavnaya.css (.gv-part) при выносе в компонент.
   ============================================================ */
.okna-part__slider{ display:flex; align-items:center; gap:14px; margin-top:6px; }
.okna-part__viewport{ overflow:hidden; flex:1 1 auto; min-width:0; touch-action:pan-y; }
.okna-part__track{ display:flex; gap:14px; transition:transform .35s ease; will-change:transform; }
.okna-part__card{ flex:0 0 calc((100% - 5*14px)/6); background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:12px;
  padding:18px 12px 14px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
  text-decoration:none; color:var(--text,#1c2433); transition:border-color .15s, transform .15s, box-shadow .15s; }
a.okna-part__card:hover{ border-color:var(--blue,#1c5bd6); transform:translateY(-2px); box-shadow:0 8px 22px rgba(20,40,80,.08); }
a.okna-part__card:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-part__logo{ height:56px; width:100%; max-width:120px; display:grid; place-items:center; }
.okna-part__logo img{ max-width:100%; max-height:56px; object-fit:contain; display:block; }
.okna-part__logo--plate{ background:var(--blue-soft,#eef3fc); border:1px solid var(--line,#e8ecf2); border-radius:8px; padding:0 8px; }
.okna-part__logo--plate b{ font-weight:700; color:var(--ink,#123d87); font-size:13px; line-height:1.2; }
.okna-part__logo--dark{ background:var(--ink,#123d87); border-radius:8px; padding:8px 12px; } /* white-версии лого (Глобалбас) — на тёмной подложке, знак не меняем */
.okna-part__logo--dark img{ max-height:40px; }
.okna-part__name{ font-weight:700; font-size:13.5px; color:var(--text,#1c2433); margin-top:2px; }
.okna-part__role{ font-size:11.5px; color:var(--muted,#6b7686); }
.okna-part__meta{ display:flex; flex-direction:column; align-items:center; gap:8px; margin-top:18px; }
.okna-part__counter{ font-size:14px; color:var(--muted,#6b7686); }
.okna-part__counter b{ color:var(--ink,#123d87); font-weight:800; }
.okna-part__bar{ width:300px; max-width:60%; height:3px; border-radius:999px; background:var(--line,#e8ecf2); overflow:hidden; display:block; }
.okna-part__bar-fill{ display:block; height:100%; width:0; border-radius:999px; background:var(--blue,#1c5bd6); transition:width .35s ease; }
.okna-part__note{ margin-top:26px; background:var(--blue-soft,#eef3fc); border-radius:var(--ok-radius-card,16px); padding:22px 26px;
  display:flex; align-items:center; gap:18px; }
.okna-part__note-ic{ flex:none; width:56px; height:56px; border-radius:50%; background:#fff; display:grid; place-items:center; }
.okna-part__note b{ font-size:16px; color:var(--ink,#123d87); display:block; margin-bottom:4px; }
.okna-part__note p{ margin:0; font-size:14px; color:var(--muted,#6b7686); }
@media (max-width:1024px){
  .okna-part__card{ flex-basis:calc((100% - 2*14px)/3); }
}
@media (max-width:768px){
  .okna-part__card{ flex-basis:calc(100% - 28px); }
  .okna-part__slider{ gap:8px; }
  .okna-part__note{ flex-direction:column; text-align:center; padding:20px 16px; }
}

/* ============================================================
   Страница-визитка партнёра (page-templates/tpl-partner.php, /partnery/*)
   ============================================================ */
.okna-partner{ padding:26px 0 0; }
.okna-partner .okna-wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding-left:40px; padding-right:40px; }
.okna-partner__head{ display:flex; align-items:center; gap:22px; margin:10px 0 22px; }
.okna-partner__logo{ flex:none; width:150px; height:84px; background:#fff; border:1px solid var(--line,#e8ecf2);
  border-radius:12px; display:grid; place-items:center; padding:12px 16px; }
.okna-partner__logo img{ max-width:100%; max-height:100%; object-fit:contain; display:block; }
.okna-partner__title h1{ margin:0 0 6px; }
.okna-partner__role{ display:inline-block; background:var(--blue-soft,#eef3fc); color:var(--blue,#1c5bd6);
  font-size:12.5px; font-weight:700; padding:4px 12px; border-radius:999px; }
.okna-partner__content{ max-width:760px; font-size:16px; line-height:1.7; color:var(--text,#1c2433); }
.okna-partner__content p{ margin:0 0 14px; }
.okna-partner__cta{ margin:30px 0 10px; background:var(--blue-soft,#eef3fc); border-radius:var(--ok-radius-card,16px);
  padding:22px 26px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.okna-partner__cta-text b{ font-size:17px; color:var(--ink,#123d87); display:block; margin-bottom:4px; }
.okna-partner__cta-text p{ margin:0; font-size:14px; color:var(--muted,#6b7686); }
.okna-partner__others{ padding:40px 0 64px; }
@media (max-width:600px){
  .okna-partner .okna-wrap{ padding-left:18px; padding-right:18px; }
  .okna-partner__head{ flex-direction:column; align-items:flex-start; gap:14px; }
  .okna-partner__cta{ flex-direction:column; align-items:flex-start; }
}
.okna-partner__logo--dark{ background:var(--ink,#123d87); }

/* ============================================================
   Страница «О компании» /o-kompanii/ (.okna-about, tpl-about.php) — 03.07.2026.
   Переиспользует: H2-канон .okna-section-title (ось — в перечне выше), слайдер .okna-part,
   статусы .gv-cert (glavnaya.css, грузится сквозно), FAQ-канон .okna-faq, CTA .okna-partner__cta.
   Своё здесь: hero, строка фактов, таймлайн истории, шаги процесса, блок основателей.
   ============================================================ */
.okna-about{ padding:20px 0 56px; }
.okna-about .okna-wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding-left:40px; padding-right:40px; } /* wrap скоупится per-container (как .okna-partner) */
.okna-about__hero{ display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:center; margin-top:10px; }
.okna-about__hero h1{ margin:0 0 14px; font-size:36px; font-weight:800; color:var(--ink,#123d87);
  letter-spacing:-.02em; line-height:1.15; }
.okna-about__lead{ margin:0; font-size:17px; line-height:1.65; color:var(--text,#1c2433); max-width:560px; }
.okna-about__facts{ list-style:none; margin:24px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:12px 34px; }
.okna-about__facts li{ margin:0; }
.okna-about__facts b{ display:block; font-size:28px; font-weight:800; color:var(--ink,#123d87); line-height:1.1; }
.okna-about__facts span{ font-size:13px; color:var(--muted,#6b7686); }
.okna-about__hero-photo{ border-radius:18px; overflow:hidden; border:1px solid var(--line,#e8ecf2);
  box-shadow:0 8px 24px rgba(20,40,80,.08); }
.okna-about__hero-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.okna-about__sec{ margin-top:56px; }
.okna-about__content{ max-width:760px; font-size:16px; line-height:1.7; color:var(--text,#1c2433); margin-top:20px; }
.okna-about__content p{ margin:0 0 14px; }
/* таймлайн истории: колонка-год + тело с вертикальной линией и точкой */
.okna-about__tl{ margin-top:26px; }
.okna-about__tl-item{ display:grid; grid-template-columns:110px 1fr; gap:0 26px; }
.okna-about__tl-when{ font-size:15px; font-weight:800; color:var(--blue,#1c5bd6); text-align:right; padding-top:2px; }
.okna-about__tl-body{ position:relative; border-left:2px solid var(--line,#e8ecf2); padding:0 0 30px 26px; }
.okna-about__tl-item:last-child .okna-about__tl-body{ padding-bottom:4px; }
.okna-about__tl-body::before{ content:""; position:absolute; left:-8px; top:4px; width:10px; height:10px;
  border-radius:50%; background:#fff; border:3px solid var(--blue,#1c5bd6); }
.okna-about__tl-body b{ display:block; font-size:16px; color:var(--ink,#123d87); margin-bottom:4px; }
.okna-about__tl-body p{ margin:0; font-size:14.5px; line-height:1.55; color:var(--muted,#6b7686); max-width:640px; }
/* шаги «Как мы работаем» — простые пронумерованные карточки (паттерн gv-proc главной скоупнут в glavnaya) */
.okna-about__steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:26px; }
.okna-about__step{ background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:14px; padding:20px 18px; }
.okna-about__step-num{ display:grid; place-items:center; width:32px; height:32px; border-radius:50%;
  background:var(--blue-soft,#eef3fc); color:var(--blue,#1c5bd6); font-weight:800; font-size:15px; }
.okna-about__step b{ display:block; font-size:15.5px; color:var(--ink,#123d87); margin:12px 0 6px; }
.okna-about__step p{ margin:0; font-size:14px; line-height:1.55; color:var(--muted,#6b7686); }
.okna-about__partners{ padding:56px 0 8px; }
.okna-about__cert{ padding:30px 0 8px; }
/* основатели: фото + текст */
.okna-about__founders{ display:grid; grid-template-columns:380px 1fr; gap:36px; align-items:center; }
.okna-about__founders-photo{ border-radius:18px; overflow:hidden; border:1px solid var(--line,#e8ecf2); }
.okna-about__founders-photo img{ width:100%; height:auto; display:block; }
.okna-about__founders-text p{ margin:18px 0 0; font-size:16px; line-height:1.7; color:var(--text,#1c2433); max-width:640px; }
.okna-about .okna-faq{ margin-top:56px; }
/* заголовок FAQ на странице — канон секционных H2 (okna_faq_render печатает голый h2; вне .okna-usluga/.glavnaya-v4 его стилизовал TT1-гигант) */
.okna-about .okna-faq > h2{ position:relative; margin:0 0 0 var(--okna-head-indent); padding-bottom:12px;
  font-size:30px; line-height:1.15; font-weight:800; color:var(--ink,#123d87); }
.okna-about .okna-faq > h2::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px;
  border-radius:999px; background:var(--red,#e0223a); }
.okna-about .okna-faq__sub{ margin-left:var(--okna-head-indent) !important; }
.okna-about .okna-partner__cta{ margin:46px 0 10px; }
@media (max-width:768px){
  .okna-about__hero{ grid-template-columns:1fr; gap:24px; }
  .okna-about__steps{ grid-template-columns:repeat(2,1fr); }
  .okna-about__founders{ grid-template-columns:1fr; gap:20px; }
}
@media (max-width:600px){
  .okna-about .okna-wrap{ padding-left:18px; padding-right:18px; }
  .okna-about__hero h1{ font-size:26px; }
  .okna-about__lead{ font-size:15.5px; }
  .okna-about__facts{ gap:12px 24px; }
  .okna-about__facts b{ font-size:24px; }
  .okna-about__steps{ grid-template-columns:1fr; }
  .okna-about__tl-item{ grid-template-columns:1fr; }
  .okna-about__tl-when{ text-align:left; padding:0 0 6px 26px; }
  .okna-about__sec{ margin-top:42px; }
}

/* ============================================================
   ФИКС-ПАКЕТ вёрстки (агентный аудит 02.07.2026)
   ============================================================ */
/* H1 визиток партнёров — фирменная типографика (был гигантский чёрный TT1) */
.okna-partner__title h1{ font-size:34px; font-weight:800; color:var(--ink,#123d87);
  letter-spacing:-.02em; line-height:1.15; }
@media (max-width:600px){ .okna-partner__title h1{ font-size:26px; } }
/* список дочерних на странице-разделе «Партнёры» — плитки вместо сырого ul (класс задаётся в контенте родителя) */
.okna-partner-list{ list-style:none; margin:18px 0 6px; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.okna-partner-list li{ margin:0; }
.okna-partner-list a{ display:block; background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:12px;
  padding:14px 16px; font-weight:700; color:var(--ink,#123d87); text-decoration:none; transition:border-color .15s; }
.okna-partner-list a:hover{ border-color:var(--blue,#1c5bd6); }
@media (max-width:768px){ .okna-partner-list{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .okna-partner-list{ grid-template-columns:1fr; } }
/* нижняя строка футера: ссылка «Политика конфиденциальности» была тёмной на тёмном — нечитаема */
.okna-footer-bottom a{ color:#cfd6e2; }
.okna-footer-bottom a:hover{ color:#fff; }
/* карточка товара (каталог/витрина): кнопки в ряд с переносом (на мобилке «Открыть» резалась краем карточки) */
.okna-card-actions{ display:flex; flex-wrap:wrap; gap:8px; }
.okna-card-actions .okna-btn{ flex:1 1 auto; min-width:0; text-align:center; justify-content:center; }
/* цена не переносится внутри числа («97 / 190 ₽») */
.okna-price-glass b, .okna-price-install b{ white-space:nowrap; }
/* мобилка: кнопки карточки товара — колонкой (flex:1 в ряд сжимал кнопку меньше текста, «В корзину» резалось) */
@media (max-width:600px){
  .okna-card-actions{ flex-direction:column; }
  .okna-card-actions .okna-btn{ width:100%; box-sizing:border-box; padding:11px 12px; font-size:14px; }
}

/* ============================================================
   ЕДИНЫЙ COVER-ПАТТЕРН ФОТО (Г4, 07.07.2026) — фото ЗАПОЛНЯЕТ медиа-зону без светлых полос.
   Причина бага: img{height:100%} на aspect-ratio-родителе НЕ доезжает (+ TT1 img{height:auto}) → полоса снизу.
   Решение: absolute-fill — не зависит от вычисления высоты родителя, переживает TT1 (!important на img).
   Применение: контейнер .okna-media-cover (сам задаёт aspect-ratio + position:relative + overflow:hidden), img внутри.
   ============================================================ */
.okna-media-cover{ position:relative; overflow:hidden; }
.okna-media-cover > img{ position:absolute !important; inset:0; width:100% !important; height:100% !important; object-fit:cover !important; display:block; }

/* ============================================================
   КАРТА САЙТА (HTML-sitemap, SEO-инструмент) — Э1 каркас.
   .okna-wrap скоупится per-container (как .okna-about/.okna-partner). Дизайн разделов — Э6.
   ============================================================ */
.okna-sitemap .okna-wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding:40px; }
.okna-sitemap__h1{ font-size:36px; line-height:1.12; font-weight:800; margin:0 0 8px; color:var(--ink,#0f1b34); }
.okna-sitemap__intro{ color:var(--muted,#5a6b86); font-size:16px; line-height:1.6; margin:0 0 32px; max-width:760px; }
.okna-sitemap__soon{ color:var(--muted,#5a6b86); margin:0; }
@media(max-width:768px){ .okna-sitemap .okna-wrap{ padding:24px 18px; } .okna-sitemap__h1{ font-size:26px; } }

/* Карта сайта — разделы/списки (Э2). SEO: колонки только визуальные, все <a> в HTML. Полный дизайн — Э6. */
.okna-sitemap__sec{ margin:0 0 38px; }
.okna-sitemap__h2{ font-size:22px; line-height:1.2; margin:0 0 16px var(--okna-head-indent); } /* канон-ось = край контента (0), как разделы сайта; критик C NOTE: убран мёртвый fallback 37px */
.okna-sitemap__h3{ font-size:16px; margin:18px 0 8px; color:var(--ink,#0f1b34); font-weight:700; }
.okna-sitemap__h3 a{ color:inherit; text-decoration:none; }
.okna-sitemap__h3 a:hover{ color:var(--blue,#1c5bd6); }
.okna-sitemap__group{ margin:0 0 14px; }
.okna-sitemap__list{ list-style:none; margin:0; padding:0; columns:2; column-gap:40px; }
.okna-sitemap__list li{ margin:0 0 8px; break-inside:avoid; }
.okna-sitemap__list a{ color:var(--blue,#1c5bd6); text-decoration:none; }
.okna-sitemap__list a:hover{ text-decoration:underline; }
@media(max-width:600px){ .okna-sitemap__list{ columns:1; } }
/* Э4: рубрики-чипсы (сверху блога/новостей) + группы по годам через <details> (свежий год open) */
.okna-sitemap__cats{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; padding:0; }
.okna-sitemap__cats li a{ display:inline-block; padding:4px 12px; background:var(--blue-soft,#eef3fc); border-radius:20px; font-size:14px; color:var(--ink,#123d87); text-decoration:none; }
.okna-sitemap__cats li a:hover{ background:#e2ebfb; }
.okna-sitemap__year{ border-top:1px solid var(--line,#e8ecf2); padding:8px 0; }
.okna-sitemap__year-sum{ cursor:pointer; list-style:none; display:flex; align-items:center; gap:8px; font-size:17px; font-weight:800; color:var(--ink,#123d87); padding:4px 0; }
.okna-sitemap__year-sum::-webkit-details-marker{ display:none; }
.okna-sitemap__year-sum::before{ content:"\25B8"; color:var(--blue,#1c5bd6); font-size:15px; transition:transform .2s ease; }
.okna-sitemap__year[open] > .okna-sitemap__year-sum::before{ transform:rotate(90deg); }
.okna-sitemap__year-n{ font-size:13px; font-weight:600; color:var(--muted,#6b7686); }
.okna-sitemap__year > .okna-sitemap__list{ margin-top:10px; }
/* Э5: пагинация тяжёлых разделов (гео) + подписи стр. N из M */
.okna-sitemap__pagenote{ font-size:14px; font-weight:600; color:var(--muted,#6b7686); }
.okna-sitemap__h1-page{ font-size:.55em; font-weight:600; color:var(--muted,#6b7686); white-space:nowrap; }
.okna-sitemap__pager{ margin:28px 0 0; }
.okna-sitemap__pager ul{ list-style:none; display:flex; flex-wrap:wrap; gap:6px; padding:0; margin:0; align-items:center; }
.okna-sitemap__pager a, .okna-sitemap__pager span{ display:inline-block; min-width:40px; text-align:center; padding:9px 13px; border-radius:8px; text-decoration:none; font-weight:700; font-size:14px; line-height:1; }
.okna-sitemap__pager a{ color:var(--blue,#1c5bd6); border:1px solid var(--line,#e8ecf2); }
.okna-sitemap__pager a:hover{ background:var(--blue-soft,#eef3fc); }
.okna-sitemap__pager .is-current{ background:var(--ink,#123d87); color:#fff; }

/* ============================================================
   ЕДИНЫЙ ГЛОБАЛЬНЫЙ ОТКЛИК КНОПОК (все страницы) — аудит 4 агентов 10.07.2026.
   Раньше :active-нажатие и :focus-visible были только под body.page-template-tpl-usluga →
   на главной/каталоге/контактах/блоге их не было. Тут — глобально всем кастомным кнопкам (не .okna-btn — у него своё).
   Эталон отклика — гео-кнопка услуг: hover + :active(translateY(1px)) + focus-ring + цвет !important.
   ============================================================ */
/* (а) НАЖАТИЕ :active — вдавливание 1px (у кнопок без своего layout-transform) */
.okna-view-btn:active, .okna-filter-toggle:active, .okna-cart-vbtn:active, .okna-qty-btn:active,
.okna-cart-row__rm:active, .okna-cart-clear:active, .okna-cart-header__clear:active, .okna-cart-header__continue:active,
.okna-page:active, .okna-tag:active, .st-toggle-opt:active, .st-tab:active, .okna-rs__tab:active,
.okna-bm__tab:active, .okna-bm__notfound:active, .okna-bm__all:active,
.okna-geo-req__submit:active, .okna-geo-req__more:active, .okna-pick__btn--red:active, .okna-pick__btn--ghost:active,
.okna-pf2__cta-btn:active, .okna-pf2__more:active, .okna-kc-quick__btn:active, .okna-city-modal__top-btn:active,
.okna-modal__close:active, .okna-org-fmt-modal__x:active, .okna-org-guar-modal__x:active, .okna-lb__close:active,
.gv-svc__item:active, .gv-tt__card:active{ transform:translateY(1px); }
/* плавность нажатия/отпускания у этих кнопок (добавляем transform к переходу, не мешая базовым) */
.okna-view-btn, .okna-filter-toggle, .okna-cart-vbtn, .okna-qty-btn, .okna-cart-row__rm, .okna-cart-clear,
.okna-cart-header__clear, .okna-cart-header__continue, .okna-page, .okna-tag, .st-toggle-opt, .st-tab, .okna-rs__tab,
.okna-bm__tab, .okna-bm__notfound, .okna-bm__all, .okna-kc-quick__btn, .okna-city-modal__top-btn,
.okna-modal__close, .okna-org-fmt-modal__x, .okna-org-guar-modal__x, .okna-lb__close,
.gv-svc__item, .gv-tt__card{ transition:transform .1s ease, background-color .15s ease, color .12s ease, border-color .15s ease, box-shadow .15s ease; }
/* (б) FOCUS-VISIBLE — кольцо (a11y) там, где не было */
.okna-view-btn:focus-visible, .okna-filter-toggle:focus-visible, .okna-cart-vbtn:focus-visible, .okna-qty-btn:focus-visible,
.okna-cart-clear:focus-visible, .okna-cart-header__clear:focus-visible, .okna-cart-header__continue:focus-visible,
.okna-page:focus-visible, .okna-tag:focus-visible, .st-toggle-opt:focus-visible, .st-tab:focus-visible,
.okna-rs__tab:focus-visible, .okna-bm__notfound:focus-visible, .okna-geo-req__submit:focus-visible,
.okna-pick__btn--red:focus-visible, .okna-pick__btn--ghost:focus-visible, .okna-pf2__cta-btn:focus-visible,
.okna-kc-quick__btn:focus-visible, .okna-city-modal__top-btn:focus-visible, .okna-modal__close:focus-visible,
.okna-org-fmt-modal__x:focus-visible, .okna-org-guar-modal__x:focus-visible, .okna-lb__close:focus-visible{
  outline:2px solid var(--blue); outline-offset:2px; }
/* (в) ЗАЩИТА ЦВЕТА от TT1 на hover (a-ссылки-кнопки, где color был без !important) */
.okna-page:hover{ color:var(--blue) !important; }
.okna-tag:hover{ color:var(--blue) !important; }
.okna-cart-header__continue:hover{ color:var(--blue) !important; }
/* (г) ВИЗБАГ: «Уточнить наличие» — база .okna-btn заливала синим поверх задуманного контура. Возвращаем контур. */
.okna-hero--catalog .okna-hero__btn-outline,
a.okna-btn.okna-hero__btn-outline, button.okna-btn.okna-hero__btn-outline{
  background:transparent !important; color:#fff !important; border:2px solid rgba(255,255,255,.65) !important; box-shadow:none !important; }
.okna-hero__btn-outline:hover{ background:#fff !important; color:var(--ink,#123d87) !important; border-color:#fff !important; }
/* (д) Контакты: kc-quick кнопки были вообще без hover/press */
.okna-kc-quick__btn:hover{ filter:brightness(.96); }
.okna-kc-quick__btn:active{ filter:brightness(.92); }
/* (е) Товар: st-toggle-opt (Только стекло / С установкой) был без hover-отклика */
.st-toggle-opt:hover:not(.is-on){ background:var(--blue-soft,#eef3fc); }
/* (ж) CF7-сабмиты: hover поднимает −2px, добавляем ОТЛИЧИМОЕ нажатие вниз (press) + focus-ring */
.wpcf7 input[type=submit]:active, .wpcf7-submit:active{ transform:translateY(0); box-shadow:0 3px 10px rgba(224,34,58,.28); }
.wpcf7 input[type=submit]:focus-visible, .wpcf7-submit:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(224,34,58,.3); }

/* (з) НАЖАТИЕ на КЛИКАБЕЛЬНЫЕ КАРТОЧКИ/ССЫЛКИ (марки/кейсы/партнёры/отзыв-Яндекс) — по жалобам владельца 10.07.
   !important — карточки имеют hover-lift (translateY-Npx) с равной/большей специфичностью; при :active нужно перебить его
   вниз/сжатием, иначе press не читается (как было у hero-сабмита). transform уже в их transition (плавный hover-lift). */
.okna-bm__link:active{ transform:translateY(1px) scale(.98) !important; }
.okna-case:active{ transform:scale(.98) !important; }
a.okna-part__card:active, .okna-part__card:active{ transform:scale(.98) !important; }
.okna-rev__src:active{ transform:translateY(1px) !important; }
.okna-rev__src{ transition:transform .1s ease, color .15s ease; display:inline-flex; }
.okna-bm__link:focus-visible, .okna-case:focus-visible, .okna-part__card:focus-visible,
.okna-rev__src:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }

/* (и) СПЛОШНОЙ ФИНАЛ: нажатие на ВСЕ оставшиеся карточки-лифты + канон-стрелки каруселей + кнопки/ссылки новостей-блога.
   Карточки: scale-press (перебивает hover-lift, !important). Стрелки: центрированные (bm) сохраняют translateY(-50%).

   ★ W2-FIX-03, коммит 3, 30.07.2026: из перечня ниже вырезан ОДИН фрагмент —
   `.gv-guar__card:active` (гарантия поколения 1, разметка не выводится).
   Удаление внутри строки следа не оставляет, поэтому метка стоит здесь: искать
   не «пропавшее правило», а `git log -S gv-guar`. Живые соседи в этом же
   перечне не тронуты — проверено поимённо. Разбор: glavnaya.css, секция 15. */
.okna-bcard:active, .okna-ncard:active, .okna-nrow:active, .okna-card:active, .okna-services__card:active,
.okna-related__card:active, .gv-card:active, .okna-kc-card--link:active,
.okna-org-why__card:active, .okna-org-fmt__card:active, .okna-org-hub__card:active{ transform:scale(.985) !important; }
/* канон-стрелка каруселей (блог/новости/прочее) — inline-flex, простое вдавливание */
.okna-hscroll-nav:active{ transform:translateY(1px); }
/* стрелки-оверлеи (центрированы top:50% translateY(-50%)) — глобально (было только под tpl-usluga) */
.okna-bm__arrow:active{ transform:translateY(-50%) translateY(1px); }
.okna-pf2__arrow:active{ transform:translateY(1px); }
/* кнопки «Все новости»/«Перейти в блог» + ссылки «Читать» */
.okna-nhome-all:active, .okna-nhome-allm:active, .okna-nrow__more:active{ transform:translateY(1px); }
.okna-nhome-all, .okna-nhome-allm, .okna-nrow__more{ transition:transform .1s ease, color .15s ease, background-color .15s ease, border-color .15s ease; display:inline-flex; }
.okna-nhome-all:focus-visible, .okna-nrow__more:focus-visible, .okna-bcard:focus-visible, .okna-ncard:focus-visible,
.okna-nrow:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }

/* [W5-P02 п.5] Тач-цели ≥44: крошки (в т.ч. тёмные в hero) и «все услуги».
   Канон «И» (D-209). Без !important — тот же вес, позже по файлу. */
@media (hover:none) and (pointer:coarse){
  .okna-crumbs a,
  .okna-uhero__crumbs a,
  .okna-services__all{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-hscroll-nav,
  .okna-services__nav,
  .okna-related__nav{
    min-width:44px;
    min-height:44px;
  }
}

/* ═══ P-СЕО-ТАБЛ (§0) · ЕДИНЫЙ САЙТ-ШИРОКИЙ ВИД ПРОКРУЧИВАЕМОЙ ОБЁРТКИ ТАБЛИЦ ═══════════
 * ОДИН источник на весь сайт (design.css грузится безусловно на всех типах), БЕЗ перечисления
 * типов записи и БЕЗ медиа-гейта. Обоснование §0: широкая таблица переполняет колонку одинаково
 * на телефоне, планшете и десктопе — защита, включённая лишь на @media(≤600), защитой не является.
 * Обёртку .okna-tbl-scroll ставит ЕДИНАЯ okna_wrap_tables() (inc/table-wrap.php) на всех типах,
 * включая услугу — она теперь наравне, не контроль. Прежние тип-скоуп-копии (ok-catalog.css под
 * @media(600), ok-home-w5.css .ok-seotext, org.css .okna-org-seo) СНЯТЫ — вид был размазан по
 * перечням и на услугу не попадал. max-width:100% — обёртка не выходит за свою колонку на любом типе;
 * overflow-x:auto — широкая таблица прокручивается ВНУТРИ, страница вправо не едет.
 * На home узкий кап 820 даёт .ok-seotext__body>* (ok-home-w5.css:745), спецификностью выше — сохраняется. */
.okna-tbl-scroll{
  display:block;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  margin:16px 0 20px;
}
.okna-tbl-scroll > table,
.okna-tbl-scroll table{ margin:0; }