/* ============================================================
   Дизайн главной — макет v4. Грузится ПОВЕРХ design.css.
   Токены (--graphite, --blue, --red, ...) берём из design.css.
   Секции главной скоупим под .glavnaya-v4. Шапка — глобальная.
   ============================================================ */

/* ===== Резиновая шапка (глобально) ===== */
.okna-header{ background:var(--bg); border-bottom:1px solid var(--line); }
.okna-header-inner{
  max-width:1280px; margin:0 auto; padding:0 32px; min-height:88px;
  display:flex; align-items:center; gap:24px; flex-wrap:wrap;
}
.okna-brand{ display:flex; align-items:center; gap:10px; flex:0 0 auto; text-decoration:none; }
.okna-brand-mark{ width:34px; height:34px; border-radius:8px; background:var(--red);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.okna-brand-name{ font-weight:800; font-size:18px; letter-spacing:-.01em; color:var(--text); white-space:nowrap; }
.okna-header .primary-navigation{ flex:1 1 auto; min-width:0; }
.okna-header .primary-navigation > .menu-button-container{ display:none; } /* десктоп/планшет: меню развёрнуто */
.okna-header .primary-navigation ul.menu,
.okna-header .primary-navigation .menu-wrapper{
  display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; justify-content:center;
}
.okna-header .primary-navigation a{ color:var(--text); font-weight:600; font-size:15px; }
.okna-header .primary-navigation a:hover{ color:var(--blue); }
.okna-header-actions{ display:flex; align-items:center; gap:16px; flex:0 0 auto; margin-left:auto; }
.okna-header-phones{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.25; }
.okna-hdr-phone{ font-weight:700; font-size:15px; color:var(--text); text-decoration:none; white-space:nowrap;
  display:inline-flex; align-items:center; gap:6px; }
.okna-hdr-phone:hover{ color:var(--blue); }
.okna-hdr-phone--main{ font-size:16px; }
.okna-hdr-phone--main svg{ color:var(--red); }
.okna-hdr-cta{ white-space:nowrap; padding:11px 20px; }

/* планшет: ужимаем, чтобы шапка не ломалась */
@media (max-width:1024px){
  .okna-header-inner{ padding:10px 24px; row-gap:10px; }
  .okna-header .primary-navigation ul.menu{ gap:6px 14px; }
  .okna-header .primary-navigation a{ font-size:14px; }
  .okna-hdr-phone{ font-size:14px; }
}
@media (max-width:768px){
  .okna-header-inner{ justify-content:space-between; }
  .okna-header .primary-navigation{ order:3; flex-basis:100%; }
  .okna-header .primary-navigation ul.menu{ justify-content:flex-start; }
}

/* ===== Каркас секций главной ===== */
/* снять ограничения родителя Twenty Twenty-One — на главной И на ГЕО-посадках (тот же шаблон), для полноширинных секций (иначе padding <main> = белая полоса над hero) */
.home #primary,.home .content-area,.home .site-main,.home #content,
.okna-geo-landing #primary,.okna-geo-landing .content-area,.okna-geo-landing .site-main,.okna-geo-landing #content{ max-width:none; padding:0; margin:0; width:100%; }
.home .okna-crumbs{ display:none; } /* крошки на главной скрываем визуально (вывод и JSON-LD остаются) */
.glavnaya-v4{ width:100%; }
.glavnaya-v4 .okna-wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding:0 40px; }
.glavnaya-v4 > section{ padding:32px 0; }  /* зазор между блоками ~64px (было 144) — ближе к услугам (56). Десктоп. */
.glavnaya-v4 > section.gv-soft{ background:var(--bg-soft); }
.glavnaya-v4 > section.gv-dark{ background:var(--graphite); color:#fff; }
/* ★ F95 §1 · САМОДОСТАТОЧНОСТЬ БЛОКОВ: авто-разделитель на стыке двух блоков ОДНОГО фона.
   Класс .is-same-bg-prev ставит рендер каскада (home-shell.php) по карте data-bg, если фон блока совпал
   с предыдущим видимым. Тонкая линия-токен по верхнему краю, внутри контейнера — стык бело↔бело /
   голубой↔голубой не сливается при ЛЮБОМ порядке блоков. Ритм 44/48 моб · 72/72 деск не меняется. */
.glavnaya-v4 > .is-same-bg-prev{ position:relative; }
.glavnaya-v4 > .is-same-bg-prev::before{ content:""; position:absolute; top:0; height:1px; background:var(--ok-line,#e3e9f0); left:16px; right:16px; }
@media (min-width:768px){ .glavnaya-v4 > .is-same-bg-prev::before{ left:max(40px, calc(50% - var(--okna-cw,1200px)/2)); right:max(40px, calc(50% - var(--okna-cw,1200px)/2)); } }
.glavnaya-v4 .gv-dark h2,.glavnaya-v4 .gv-dark h3{ color:#fff; }
.glavnaya-v4 .gv-dark p{ color:var(--muted-d); }

/* заголовки секций */
.gv-head{ max-width:780px; margin-bottom:38px; }
/* ЕДИНЫЙ формат заголовков секций главной = эталон .okna-section-title (design.css): 30/800/слева/черта 52×3.
   .center больше НЕ центрирует заголовок — все секции слева, «как на услугах». Источник истины — design.css. */
.gv-head.center{ margin-left:0; margin-right:0; text-align:left; }
.gv-head h2{ font-size:30px; font-weight:800; line-height:1.15; position:relative; padding-bottom:12px; margin:0; }
.gv-head h2::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background:var(--red); }
.gv-head p{ margin-top:16px; color:var(--muted); font-size:18px; }
.gv-dark .gv-head p{ color:var(--muted-d); }
.gv-chip{ width:48px; height:48px; border-radius:10px; background:var(--blue-soft);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px; color:var(--blue); }
.gv-chip svg{ display:block; }
.tick{ color:#37c47a; flex:0 0 auto; }

/* кнопка на всю ширину (карточка героя/формы) */
.okna-btn-block{ display:flex; width:100%; justify-content:center; }

/* ===== 1. Герой (главная) ===== */
.okna-hero-home{ background:var(--graphite); color:#fff; border-radius:0; margin:0; padding:0;
  background-size:cover; background-position:center; position:relative; box-shadow:none; }
.okna-hero-home::before{ content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(20,24,34,.92) 40%, rgba(20,24,34,.62)); }
.okna-hero-home.has-bg{ background-color:#11151d; }
.okna-hero-home > .okna-wrap{ position:relative; z-index:1; }
.okna-hero-grid{ display:grid; grid-template-columns:1.25fr .85fr; gap:48px; align-items:center;
  padding-top:64px; padding-bottom:64px; }
.okna-hero-main h1{ color:#fff; font-size:46px; line-height:1.08; letter-spacing:-.03em; margin:0 0 18px; max-width:18ch; }
.okna-hero-badge{ display:inline-block; background:rgba(255,255,255,.08); color:#9fc0ff;
  font-size:13px; font-weight:700; padding:7px 14px; border-radius:6px; margin-bottom:16px; max-width:60ch; }
.okna-hero-main .sub{ color:var(--muted-d); font-size:19px; max-width:48ch; margin:0 0 24px; }
.okna-hero-home .okna-benefits{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 26px; padding:0; }
.okna-hero-home .okna-benefits li{ background:rgba(255,255,255,.06); border:1px solid var(--line-d);
  border-radius:8px; padding:12px 14px; color:#dbe2ee; font-size:15px; font-weight:500; }
.okna-hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.okna-hero-home .okna-btn.secondary{ background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.okna-hero-home .okna-btn.secondary:hover{ background:rgba(255,255,255,.1); color:#fff; }
.okna-hero-card{ background:#fff; color:var(--text); border-radius:var(--ok-radius-card,16px); padding:28px; box-shadow:var(--shadow-lg); }
.okna-hero-card h3,.okna-hero-card__title{ font-size:21px; font-weight:800; margin:0 0 6px; color:var(--text); }  /* Г2: заголовок формы — не h-тег (SEO: один H1 на экране) */
.okna-hero-card-sub{ color:var(--muted); font-size:14px; margin:0 0 18px; }
.okna-hero-card .okna-field{ border:1px solid var(--line); border-radius:var(--ok-radius-field,8px); padding:12px 14px; /* Волна 1-бис: 6px→8 */
  font-size:15px; color:var(--muted); margin-bottom:12px; background:#fff; }
.okna-hero-card-note{ font-size:12px; color:var(--muted); text-align:center; margin:10px 0 0; }
/* Г2: цифры-доказательства (честные) под CTA */
.okna-hero-proof{ display:flex; gap:30px; flex-wrap:wrap; margin:26px 0 0; padding:20px 0 0; border-top:1px solid rgba(255,255,255,.16); }
.okna-hero-proof b{ display:block; font-size:26px; font-weight:800; color:#fff; line-height:1.1; }
.okna-hero-proof span{ font-size:13px; color:var(--muted-d); }
/* Г2: стилизация реальной CF7-формы в карточке героя (компактно, кнопка — фирменная красная) */
.okna-hero-card .wpcf7{ margin:0; }
.okna-hero-card .wpcf7 p{ margin:0 0 12px; }
.okna-hero-card .wpcf7 input:not([type=submit]):not([type=checkbox]):not([type=radio]),
.okna-hero-card .wpcf7 textarea,
.okna-hero-card .wpcf7 select{ width:100%; padding:12px 14px; border:1.5px solid var(--line); border-radius:var(--ok-radius-field,8px); /* Волна 1-бис: select 10px→8 (роль выбора) */
  font-family:inherit; font-size:15px; background:#fbfcfe; color:var(--text); box-sizing:border-box; }
.okna-hero-card .wpcf7 input:focus,.okna-hero-card .wpcf7 textarea:focus{ outline:none; border-color:var(--blue); background:#fff; }
.okna-hero-card .wpcf7 textarea{ min-height:76px; resize:vertical; }
.okna-hero-card .wpcf7 input[type=file]{ font-size:13px; color:var(--muted); padding:8px 0; background:none; border:0; }
.okna-hero-card .wpcf7 .wpcf7-submit{ width:100%; padding:14px 20px; border:0; border-radius:11px;
  background:var(--red,#e0223a); color:#fff; font-family:inherit; font-weight:700; font-size:16px; cursor:pointer;
  box-shadow:0 12px 26px rgba(224,34,58,.28); transition:transform .14s ease, background-color .16s ease, box-shadow .16s ease; }
.okna-hero-card .wpcf7 .wpcf7-submit:hover{ background:#c31a30; transform:translateY(-2px); box-shadow:0 16px 32px rgba(224,34,58,.34); }
/* НАЖАТИЕ (та же специфичность, что hover, после него → выигрывает при :active): вниз + сжатие + темнее */
.okna-hero-card .wpcf7 .wpcf7-submit:active{ background:#a51124 !important; transform:translateY(1px) scale(.985); box-shadow:0 4px 12px rgba(224,34,58,.30); }
.okna-hero-card .wpcf7-acceptance,.okna-hero-card .wpcf7 .wpcf7-list-item{ font-size:12px; color:var(--muted); }
.okna-hero-card .wpcf7-not-valid-tip{ font-size:12px; }
/* Г2.1: КОРОТКАЯ форма hero (телефон + кнопка + мелкое согласие) — компактная карточка */
.okna-hero-card .okna-cf7-row label{ display:block; font-size:13px; font-weight:600; color:#41495a; margin:0 0 6px; }
.okna-hero-card .okna-cf7-row label br{ display:none; }
.okna-hero-card .okna-req{ color:var(--red); }
.okna-hero-card .okna-hf-submit{ margin:6px 0 0; }
.okna-hero-card .okna-hf-consent{ margin:12px 0 0; }
.okna-hero-card .okna-hf-consent small{ font-size:12px; color:var(--muted); line-height:1.45; display:block; }
.okna-hero-card .okna-hf-consent a{ color:var(--blue); }
/* Г2.1: цифры-доказательства — единый вид (крупное число + подпись снизу, ровный ряд) */
.okna-hero-proof{ align-items:flex-start; }
.okna-hero-proof > div{ min-width:78px; }
.okna-hero-proof b{ font-size:30px; }

/* ===== 2. Когда нужна замена (situations) — 3 карточки ===== */
.gv-cards-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gv-card{ background:#fff; border:1px solid var(--line); border-radius:var(--ok-radius-dropdown,10px); box-shadow:var(--shadow-sm);
  padding:24px; transition:transform .16s ease, box-shadow .16s ease; }
.gv-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.gv-card h3{ font-size:18px; margin:0 0 8px; color:var(--text); }
.gv-card p{ font-size:14.5px; color:var(--muted); margin:0; }
/* situations — редизайн 03.07.2026 по макету владельца: header карточки одной строкой (иконка в круге
   СЛЕВА от H3 — поправка владельца поверх макета) + красная мини-черта; ховер прежний (от .gv-card).
   H2/подзаголовок секции — каноны (.okna-section-title/.okna-section-sub), отступы ниже только вертикальные. */
.gv-situations .okna-section-title{ margin-bottom:14px; }
.gv-situations .okna-section-sub{ max-width:780px; margin-top:0; margin-bottom:0; }
.gv-sit{ margin-top:26px; }
.gv-sit__card{ padding:20px 22px 22px; } /* компактнее макетных по высоте (просьба ТЗ) */
.gv-sit__head{ display:flex; align-items:center; gap:14px; padding-bottom:14px; margin-bottom:12px; }
.gv-sit__ico{ flex:0 0 auto; width:56px; height:56px; border-radius:50%;
  background:#fff; border:1px solid #dfe8f7;
  display:grid; place-items:center; overflow:hidden; }
.gv-sit__ico-img{ width:50px; height:50px; object-fit:contain; display:block; } /* присланные иллюстрации-иконки */
/* красная мини-черта — ПОД НАЗВАНИЕМ (замечание владельца 03.07.2026: была под иконкой, у левого края header) */
.gv-sit__head h3{ position:relative; font-size:17.5px; margin:0; color:var(--ink,#123d87); font-weight:700; line-height:1.25; }
.gv-sit__head h3::after{ content:""; position:absolute; left:0; bottom:-14px; width:36px; height:3px;
  border-radius:999px; background:var(--red,#e0223a); }
/* шахматная раскраска (владелец 03.07.2026): карточки 1/3/5 светло-голубые — мягкое отличие от белых
   (v2: graphite забракован владельцем — «в глаз бьёт»); круг иконки на голубом — белый, чтобы не сливался */
.gv-sit__card--tint{ background:var(--blue-soft,#eef3fc); border-color:#dfe8f7; }
.gv-sit__card--tint .gv-sit__ico{ background:#fff; border-color:#dfe8f7; }

/* ===== Услуга: блок «Когда нужна замена» (.okna-rs) — вертикальные табы + панель с фон-картинкой ===== */
.okna-rs{ background:#f6f9fd; border:1px solid #dbe4f0; border-radius:22px; padding:40px; }
.okna-rs > h2{ margin:0 0 12px; }                       /* красный акцент-черта — от .okna-usluga > section > h2::after */
.okna-rs__sub{ max-width:760px; margin:0 0 28px; color:var(--muted); font-size:17px; line-height:1.6; }
.okna-rs__grid{ display:grid; grid-template-columns:0.4fr 0.6fr; gap:24px; align-items:stretch; }

/* — Табы (слева) — */
.okna-rs__tabs{ display:flex; flex-direction:column; gap:8px; background:#fff; border:1px solid #dbe4f0;
  border-radius:16px; padding:8px; min-width:0; }
/* !important — перебить базовую кнопку Twenty Twenty-One (button:not(:hover)... спец.0,3,1, грузится позже) */
.okna-rs__tab{ flex:1 1 0; display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  padding:12px 14px; border:1px solid transparent !important; border-radius:12px !important; background:transparent !important; cursor:pointer;
  color:var(--text,#1c2433) !important; font-family:inherit; font-size:15px; font-weight:600; line-height:1.25;
  transition:background-color .16s ease, border-color .16s ease, color .16s ease; }
.okna-rs__tab + .okna-rs__tab{ box-shadow:0 -1px 0 #eef2f8; }      /* мягкий разделитель */
.okna-rs__tab-ico{ flex:0 0 auto; width:34px; height:34px; border-radius:9px; display:flex; align-items:center;
  justify-content:center; background:#eef3fb; color:#8a97ab; transition:background-color .16s ease, color .16s ease; }
.okna-rs__tab-ico svg{ width:20px; height:20px; display:block; }
.okna-rs__tab-name{ min-width:0; }
.okna-rs__tab:hover{ background:#f3f7ff !important; color:var(--ink,#123d87) !important; border-color:#dbe4f0 !important; }
.okna-rs__tab:hover .okna-rs__tab-ico{ color:var(--blue,#1c5bd6); }
.okna-rs__tab.is-active{ background:#f3f7ff !important; border-color:var(--blue,#1c5bd6) !important; color:var(--ink,#123d87) !important; font-weight:800; box-shadow:none; }
.okna-rs__tab.is-active .okna-rs__tab-ico{ background:var(--blue,#1c5bd6); color:#fff; }
.okna-rs__tab:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }

/* — Панель (справа): фон-картинка + затемнение + текст — */
.okna-rs__panel{ position:relative; min-height:540px; border-radius:16px; overflow:hidden; isolation:isolate;
  background:#0e2348; display:flex; flex-direction:column; justify-content:flex-end; }
.okna-rs__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:opacity .25s ease; }
.okna-rs__shade{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(8,20,44,.04) 0%, rgba(8,20,44,.10) 38%, rgba(8,20,44,.72) 78%, rgba(8,20,44,.92) 100%); }
.okna-rs__content{ position:relative; z-index:2; padding:34px; color:#fff; transition:opacity .25s ease, transform .25s ease; }
.okna-rs__title{ margin:0 0 12px; font-size:26px; font-weight:800; line-height:1.18; color:#fff; }
.okna-rs__accent{ display:block; width:46px; height:3px; border-radius:2px; background:var(--red,#e0223a); margin:0 0 16px; }
.okna-rs__desc{ margin:0 0 20px; font-size:16px; line-height:1.62; color:rgba(255,255,255,.92); max-width:560px; }
.okna-rs__info{ display:inline-block; padding:11px 16px; border-radius:12px; font-size:14px; line-height:1.45;
  color:#eaf1ff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }
/* fade при переключении (высота панели фиксирована — скачков нет) */
.okna-rs__panel.is-swap .okna-rs__content{ opacity:0; transform:translateY(10px); }
.okna-rs__panel.is-swap .okna-rs__img{ opacity:0; }
/* Без картинки (пустой/упавший image_url): прячем <img>, панель остаётся с цельным тёмным фоном — текст читается. */
.okna-rs__panel.is-noimg{ background:linear-gradient(135deg, #0e2348 0%, #0a1a38 100%); }
.okna-rs__panel.is-noimg .okna-rs__img{ display:none; }

/* — Адаптив — */
@media (max-width:768px){
  .okna-rs{ padding:28px; }
  .okna-rs__grid{ grid-template-columns:1fr; gap:16px; }
  /* табы — горизонтальная лента-скролл сверху */
  .okna-rs__tabs{ flex-direction:row; overflow-x:auto; overflow-y:hidden; gap:8px; scrollbar-width:thin;
    -webkit-overflow-scrolling:touch; }
  .okna-rs__tab{ flex:0 0 auto; min-width:240px; }
  .okna-rs__tab + .okna-rs__tab{ box-shadow:none; }
  .okna-rs__panel{ min-height:420px; }
}
@media (max-width:600px){
  .okna-rs{ padding:18px; border-radius:18px; }
  .okna-rs__sub{ font-size:15px; margin-bottom:18px; }
  .okna-rs__tab{ min-width:200px; font-size:14px; padding:10px 12px; }
  .okna-rs__panel{ min-height:360px; }
  .okna-rs__content{ padding:22px; }
  .okna-rs__title{ font-size:21px; }
  .okna-rs__desc{ font-size:15px; }
}

/* ===== Услуга: блок «Что входит в работу» (.okna-ws) — светлая секция + тёмная карточка-процесс (5 этапов) ===== */
.okna-ws > h2{ margin:0 0 12px; }                        /* красная черта — от .okna-usluga > section > h2::after */
.okna-ws__sub{ max-width:880px; margin:0 0 26px; color:var(--muted); font-size:17px; line-height:1.6; }
.okna-ws__card{ background:linear-gradient(158deg,#103163 0%,#0b1c3b 100%); border:1px solid rgba(122,166,239,.16);
  border-radius:26px; box-shadow:0 24px 60px rgba(12,28,60,.20); padding:32px 28px; }
/* Раскладка 3+2: оба ряда — сетка 3 колонки (одинаковая ширина карточек). Нижний ряд = 2 карточки в первых двух
   колонках, выровнены по левому краю под верхними (3-я ячейка пустая). Соединители убраны. */
.okna-ws__steps{ list-style:none; padding:0; display:grid; gap:24px; }
.okna-ws__row--top{ grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 24px; }
.okna-ws__row--bottom{ grid-template-columns:repeat(2,minmax(0,1fr)); max-width:720px; margin:0 auto 22px; } /* шахматка: нижний ряд 2 карточки центрированы под зазорами верхнего (возврат 6a666f5; repeat(3)+слева был регрессией 6fbdd9b). Планшет ниже сбрасывает max-width:none. */
.okna-ws__step{ position:relative; display:flex; flex-direction:column; align-items:flex-start;
  background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.10); border-radius:18px;
  padding:28px; min-height:230px; }
/* номер-пилюля + заголовок этапа — в одну строку; зона выровнена по высоте под самый длинный
   заголовок (3 строки: 3×1.28×20px ≈ 77px) → описания всех карточек стартуют на одной линии.
   align-items:flex-start — номера-пилюли на одной верхней линии; короткие заголовки оставляют пустое
   место снизу зоны (это и даёт выравнивание). На мобиле (1 колонка) выравнивать не с чем — min-height снят. */
.okna-ws__head{ display:flex; align-items:flex-start; gap:14px; min-height:77px; margin:0 0 12px; }
.okna-ws__num{ flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px;
  padding:0 10px; border-radius:999px; background:linear-gradient(135deg,#1c5bd6 0%,#4f86ef 100%); color:#fff;
  font-size:15px; font-weight:800; letter-spacing:.03em; font-variant-numeric:tabular-nums; }
.okna-ws__title{ margin:0; color:#fff; font-size:20px; font-weight:700; line-height:1.28; }
.okna-ws__desc{ margin:0; color:rgba(255,255,255,.72); font-size:15px; line-height:1.55; }
/* плашка «На выходе» */
.okna-ws__out{ display:flex; align-items:center; gap:14px; padding:16px 20px; border-radius:18px;
  background:rgba(255,255,255,.06); border:1px solid rgba(122,166,239,.30); }
.okna-ws__out-ico{ flex:0 0 auto; width:40px; height:40px; border-radius:11px; display:flex; align-items:center;
  justify-content:center; background:rgba(28,91,214,.22); color:#dceaff; }
.okna-ws__out-ico svg{ width:24px; height:24px; display:block; }
.okna-ws__out p{ margin:0; color:rgba(255,255,255,.88); font-size:15px; line-height:1.5; }
.okna-ws__out strong{ color:#fff; font-weight:800; }

@media (max-width:1024px){
  .okna-ws__row--top, .okna-ws__row--bottom{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; width:100%; max-width:none; }
  .okna-ws__row--top{ margin:0 0 18px; }
  .okna-ws__row--bottom{ margin:0 0 22px; }
  .okna-ws__step{ min-height:auto; }
}
@media (max-width:768px){
  .okna-ws__sub{ font-size:15px; margin-bottom:18px; }
  .okna-ws__card{ padding:22px 18px; border-radius:20px; }
  .okna-ws__row--top, .okna-ws__row--bottom{ grid-template-columns:1fr; gap:16px; margin:0 0 16px; }
  .okna-ws__step{ padding:20px; }
  .okna-ws__head{ min-height:0; align-items:center; }   /* 1 колонка: центрируем название по центру номера (owner 08.08); лишнюю высоту снимаем */
  .okna-ws__out{ align-items:flex-start; }
}

/* ===== Услуга: блок «Подберём стекло» (.okna-pick) — тёмный CTA-баннер с фон-автобусом ===== */
.okna-pick > h2{ margin:0 0 14px; }                 /* красная черта — от .okna-usluga > section > h2::after */
.okna-pick__banner{ position:relative; overflow:hidden; border-radius:26px; padding:40px;
  background-repeat:no-repeat; background-size:cover; background-position:center right;
  box-shadow:0 24px 60px rgba(12,28,60,.20); }
.okna-pick__banner::before{ content:""; position:absolute; inset:0; z-index:1; background:transparent; pointer-events:none; }
.okna-pick__body{ position:relative; z-index:2; max-width:620px; }
.okna-pick__title{ margin:0 0 14px; color:#fff; font-size:30px; font-weight:800; line-height:1.2; max-width:600px; }
.okna-pick__sub{ margin:0 0 24px; color:rgba(255,255,255,.85); font-size:17px; line-height:1.6; max-width:560px; }
.okna-pick__ctas{ display:flex; flex-wrap:wrap; gap:14px; margin:0 0 18px; }
.okna-pick__btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; height:48px; padding:0 24px;
  border-radius:12px; font-size:16px; font-weight:700; text-decoration:none; white-space:nowrap; cursor:pointer;
  border:1.5px solid transparent; transition:background-color .15s ease, color .15s ease, border-color .15s ease; }
.okna-pick__btn-ico{ display:inline-flex; }
.okna-pick__btn-ico svg{ width:18px; height:18px; display:block; }
.okna-pick__btn--red{ background:var(--red,#e0223a); color:#fff; border-color:var(--red,#e0223a); }
.okna-pick__btn--red:hover,.okna-pick__btn--red:focus{ background:var(--red-hover,#c81a30); border-color:var(--red-hover,#c81a30); color:#fff; }
.okna-pick__btn--ghost{ background:#fff; color:var(--blue,#1c5bd6); border-color:var(--blue,#1c5bd6); }
.okna-pick__btn--ghost:hover,.okna-pick__btn--ghost:focus{ background:#eef3fb; color:#1448aa; border-color:#1448aa; }
.okna-pick__btn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.okna-pick__phone{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; margin:0; color:rgba(255,255,255,.8); font-size:15px; }
.okna-pick__phone-ico{ display:inline-flex; color:#cfe0ff; }
.okna-pick__phone-ico svg{ width:18px; height:18px; display:block; }
.okna-pick__phone a{ color:#cfe0ff; font-weight:800; font-size:17px; text-decoration:none; font-variant-numeric:tabular-nums; white-space:nowrap; }
.okna-pick__phone a:hover{ color:#fff; text-decoration:underline; }
.okna-pick__advs{ position:relative; z-index:2; list-style:none; margin:28px 0 0; padding:24px 0 0;
  border-top:1px solid rgba(219,228,240,.18); display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.okna-pick__adv{ min-width:0; }
.okna-pick__adv-ico{ width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  background:rgba(28,91,214,.18); border:1px solid rgba(122,166,239,.28); color:#cfe0ff; margin-bottom:12px; }
.okna-pick__adv-ico svg{ width:22px; height:22px; display:block; }
.okna-pick__adv h4{ margin:0 0 6px; color:#fff; font-size:15px; font-weight:700; line-height:1.3; }
.okna-pick__adv p{ margin:0; color:rgba(255,255,255,.66); font-size:13.5px; line-height:1.45; }

@media (max-width:1024px){
  .okna-pick__banner{ padding:32px; }
  .okna-pick__advs{ grid-template-columns:repeat(2,1fr); gap:18px; }
  .okna-pick__title{ font-size:26px; }
}
@media (max-width:768px){
  .okna-pick__banner{ padding:24px; border-radius:20px; background-position:center; }
  .okna-pick__banner::before{ background:rgba(11,31,63,.5); }   /* мобайл — затемняем фон сильнее, текст читаем */
  .okna-pick__body{ max-width:none; }
  .okna-pick__title{ font-size:22px; }
  .okna-pick__sub{ font-size:15px; }
  .okna-pick__ctas{ flex-direction:column; gap:10px; }
  .okna-pick__btn{ width:100%; }
  .okna-pick__phone{ flex-direction:column; align-items:flex-start; gap:4px; }
  .okna-pick__advs{ grid-template-columns:1fr; gap:16px; }
  /* этап 8.1: на мобайле в баннере заявки прячем телефон и преимущества — оставляем суть (заголовок+подзаголовок+кнопки), блок компактный */
  .okna-pick__banner .okna-pick__phone,
  .okna-pick__banner .okna-pick__advs{ display:none !important; }
  .okna-pick__banner .okna-pick__ctas{ margin-bottom:0; }
}

/* ===== «Для каких автобусов подходит» (.okna-bm) — табы стран + лента логотипов марок ===== */
/* На ГЛАВНОЙ блок сквозной, но без .okna-wrap — центрируем его в общую колонку 1200px (как соседние блоки).
   Значения = `.glavnaya-v4 .okna-wrap{max-width:1200px;padding:0 40px}` (медиа-запросов у wrap нет → 40px на
   всех ширинах). Скоуп .glavnaya-v4 → услугу (.okna-usluga) НЕ трогает: там центрирует родитель. */
.glavnaya-v4 .okna-bm{ max-width:calc(var(--okna-cw) + 80px); margin-left:auto; margin-right:auto; padding-left:40px; padding-right:40px; box-sizing:border-box; }
/* красная черта — задаём прямо тут: блок сквозной (на услуге .okna-usluga даёт её сам, на главной
   .glavnaya-v4 — нет; своё правило гарантирует акцент везде, на услуге идемпотентно — тот же ::after). */
.okna-bm > h2{ position:relative; margin:0 0 12px; padding-bottom:12px; }
.okna-bm > h2::after{ content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a); }
/* H2 brands на ГЛАВНОЙ — единый стиль с .gv-head h2 (размер/вес/трекинг 1:1). Цвет — ink #123d87:
   .gv-head h2 и H2 на услуге фактически рендерятся ink (замер rgb(18,61,135)), а var(--text)=#1c2433 не совпал.
   На услуге свой эталон (.okna-usluga>section>h2) — скоуп .glavnaya-v4 его не задевает. */
.glavnaya-v4 .okna-bm > h2{ font-size:30px; font-weight:800; line-height:1.15; color:var(--ink, #123d87); }
.okna-bm__sub{ max-width:820px; margin:0 0 24px; color:var(--muted); font-size:17px; line-height:1.6; }
.okna-bm__card{ background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-sm); padding:24px; }
/* табы стран */
.okna-bm__tabs{ display:flex; flex-wrap:nowrap; gap:8px; margin:0 0 20px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; } /* табы = слайдер, по образцу .okna-bm__strip (owner 08.08) */
.okna-bm__tabs::-webkit-scrollbar{ display:none; }
.okna-bm__tab{ appearance:none; cursor:pointer; flex:0 0 auto; white-space:nowrap; font-family:inherit; font-size:14px; font-weight:700; line-height:1;
  padding:10px 16px; border-radius:999px; background:#f3f7ff !important; color:var(--ink,#123d87) !important;
  border:1px solid #dbe4f0 !important; transition:background-color .15s ease, color .15s ease, border-color .15s ease; }
.okna-bm__tab:hover{ border-color:var(--blue,#1c5bd6) !important; }
.okna-bm__tab.is-active{ background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important; }
.okna-bm__tab:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
/* лента логотипов */
.okna-bm__strip-wrap{ position:relative; }
/* scroll-behavior:auto (по умолчанию) — мгновенные программные scrollLeft для автоскролла/drag/бесшовного переноса;
   плавность стрелок обеспечивает scrollBy({behavior:'smooth'}) в JS, ей CSS-режим не нужен. */
.okna-bm__strip{ list-style:none; margin:0; padding:4px; display:flex; gap:14px; overflow-x:auto;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.okna-bm__strip::-webkit-scrollbar{ display:none; }
.okna-bm__item{ flex:0 0 auto; }
.okna-bm__link{ display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:10px; width:150px; height:140px;
  padding:18px 12px; border:1px solid var(--line); border-radius:14px; background:#fff; text-decoration:none;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.okna-bm__link:hover{ border-color:var(--blue,#1c5bd6); box-shadow:0 10px 24px rgba(28,91,214,.12); transform:translateY(-3px); }
.okna-bm__logo{ flex:1 1 auto; display:flex; align-items:center; justify-content:center; width:100%; }
.okna-bm__logo img{ max-width:118px; max-height:64px; width:auto; height:auto; object-fit:contain; display:block; }
/* марка без файла логотипа — нейтральная текст-карточка с монограммой (не пусто, не чужой логотип) */
.okna-bm__mono{ display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:14px;
  background:var(--blue-soft,#eef3fb); border:1px solid #dbe4f0; color:var(--blue,#1c5bd6); font-size:24px; font-weight:800; line-height:1; }
.okna-bm__name{ flex:0 0 auto; font-size:14px; font-weight:700; color:var(--text,#1c2433); text-align:center; line-height:1.2;
  white-space:nowrap; max-width:126px; overflow:hidden; text-overflow:ellipsis; }
/* стрелки */
.okna-bm__arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:40px; height:40px; border-radius:999px;
  display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:24px; line-height:1; color:var(--ink,#123d87) !important;
  background:#fff !important; border:1px solid var(--line) !important; box-shadow:0 6px 18px rgba(12,28,60,.14);
  transition:background-color .15s ease, color .15s ease, opacity .15s ease; }
.okna-bm__arrow:hover{ background:var(--blue,#1c5bd6) !important; color:#fff !important; border-color:var(--blue,#1c5bd6) !important; }
.okna-bm__arrow--prev{ left:-6px; }
.okna-bm__arrow--next{ right:-6px; }
.okna-bm__arrow:disabled{ opacity:0; pointer-events:none; }
/* интерактивный скроллбар: дорожка (клик = переход) + палец (drag = прокрутка/позиция в круге) */
.okna-bm__bar{ position:relative; height:8px; border-radius:999px; background:#eef2f8; margin:16px 6px 0; overflow:hidden;
  cursor:pointer; touch-action:none; user-select:none; -webkit-user-select:none; }
.okna-bm__bar:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }
.okna-bm__bar-fill{ position:absolute; top:0; left:0; height:100%; width:30%; min-width:32px; border-radius:999px;
  background:var(--blue,#1c5bd6); cursor:grab; transition:left .12s ease, width .12s ease; }
.okna-bm__bar:hover .okna-bm__bar-fill{ background:#1a4fc0; }
/* во время drag/автоскролла — без анимации (палец едет синхронно с лентой), курсор «зажат» */
.okna-bm__bar.is-dragging,
.okna-bm__bar.is-dragging .okna-bm__bar-fill,
.okna-bm__bar-fill:active{ cursor:grabbing; }
.okna-bm__bar.is-dragging .okna-bm__bar-fill,
.okna-bm__bar.is-live .okna-bm__bar-fill{ transition:none; }
/* низ карточки */
.okna-bm__foot{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:22px;
  padding-top:20px; border-top:1px solid var(--line); }
.okna-bm__notfound{ display:flex; align-items:center; gap:12px; text-decoration:none; max-width:520px; }
.okna-bm__notfound-ico{ flex:0 0 auto; width:42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  background:var(--blue-soft,#eef3fb); color:var(--blue,#1c5bd6); }
.okna-bm__notfound-ico svg{ width:22px; height:22px; display:block; }
.okna-bm__notfound-txt{ font-size:14.5px; line-height:1.4; color:var(--muted); }
.okna-bm__notfound-txt strong{ color:var(--ink,#123d87); }
.okna-bm__notfound:hover .okna-bm__notfound-txt strong{ color:var(--blue,#1c5bd6); }
.okna-bm__foot-right{ display:flex; align-items:center; gap:18px; }
.okna-bm__count{ font-size:15px; color:var(--muted); white-space:nowrap; }
.okna-bm__count-num{ color:var(--ink,#123d87); font-weight:800; font-variant-numeric:tabular-nums; }
.okna-bm__all{ display:inline-flex; align-items:center; height:44px; padding:0 22px; border-radius:11px; font-size:15px; font-weight:700;
  text-decoration:none; white-space:nowrap; background:var(--blue,#1c5bd6); color:#fff; border:1.5px solid var(--blue,#1c5bd6);
  transition:background-color .15s ease, color .15s ease; }
.okna-bm__all:hover{ background:#1448aa; border-color:#1448aa; color:#fff; }

@media (max-width:1024px){
  .okna-bm__link{ width:140px; height:132px; }
}
@media (max-width:768px){
  .okna-bm__card{ padding:18px; border-radius:16px; }
  .okna-bm__arrow{ display:none; }                 /* на мобиле — скролл свайпом, стрелки прячем */
  .okna-bm__link{ width:128px; height:124px; padding:14px 10px; }
  .okna-bm__foot{ flex-direction:column; align-items:flex-start; }
  .okna-bm__foot-right{ width:100%; justify-content:space-between; gap:12px; }
}

/* ===== 3. Услуги (services-home) — редизайн 03.07.2026 по макету владельца:
   слева промо-карточка с фоном-автобусом, справа сетка 2×4 карточек-ссылок, внизу плашка марок.
   (старое правило .gv-services .gv-grid удалено вместе с разметкой; .gv-grid/.gv-chip — общие, не тронуты) ===== */
.gv-services .okna-section-title{ margin-bottom:24px; }
.gv-svc{ display:grid; grid-template-columns:0.92fr 1.08fr; gap:20px; align-items:stretch; }
/* промо-карточка: текст слева на светлой зоне, автобус справа из фона */
.gv-svc__promo{ background-color:#fff; background-size:cover; background-position:right bottom; background-repeat:no-repeat;
  border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-sm); padding:36px 34px;
  display:flex; flex-direction:column; justify-content:center; min-height:420px; } /* right bottom: зеркало-стекло из фона не режется нижним краем (сверка с макетом) */
.gv-svc__cta .gv-svc__btn-arr{ margin-left:10px; font-size:17px; line-height:1; } /* стрелки в кнопках — как на макете */
.gv-svc__promo h3{ margin:0 0 14px; font-size:25px; line-height:1.2; font-weight:800; color:var(--ink); max-width:330px; }
.gv-svc__promo p{ margin:0 0 22px; font-size:15px; line-height:1.65; color:var(--text); max-width:340px; }
.gv-svc__cta{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.gv-svc__cta .okna-btn{ display:inline-flex; align-items:center; justify-content:center; min-width:220px; min-height:48px;
  font-size:15.5px; line-height:1.25; padding:12px 24px; box-sizing:border-box; } /* габариты явно — TT1 раздувает голые a-кнопки */
/* сетка карточек-ссылок */
.gv-svc__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; align-content:stretch; }
.gv-svc__item{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:16px 18px; min-height:64px; text-decoration:none; box-sizing:border-box;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease; }
a.gv-svc__item:hover{ border-color:var(--blue); background:#f6f9ff; box-shadow:0 6px 18px rgba(28,91,214,.12); }
.gv-svc__ico{ flex:0 0 auto; display:grid; place-items:center; width:40px; }
.gv-svc__name{ flex:1 1 auto; font-size:15px; font-weight:700; color:var(--ink); line-height:1.3; }
.gv-svc__chev{ flex:0 0 auto; color:var(--blue); display:grid; place-items:center; transition:transform .16s ease; }
a.gv-svc__item:hover .gv-svc__chev{ transform:translateX(4px); }
.gv-svc__item--static{ cursor:default; }
/* плашка марок (некликабельна) */
.gv-svc__brands{ display:flex; align-items:center; gap:16px; margin-top:20px; background:var(--blue-soft);
  border-radius:14px; padding:18px 24px; }
.gv-svc__brands-ico{ flex:0 0 auto; display:grid; place-items:center; }
.gv-svc__brands p{ margin:0; font-size:15px; color:var(--text); }
.gv-svc__brands b{ color:var(--ink); }
@media (max-width:1024px){
  .gv-svc{ grid-template-columns:1fr; }
  .gv-svc__promo{ min-height:340px; }
}
@media (max-width:600px){
  .gv-svc__grid{ grid-template-columns:1fr; } /* 1 колонка: названия до 26 символов, в 2 колонки на 390 рвутся — решение по читаемости */
  .gv-svc__promo{ padding:24px 20px; min-height:0; background-image:none !important; } /* фон скрыт: автобус наезжал бы на текст (ТЗ разрешает) */
  .gv-svc__promo h3, .gv-svc__promo p{ max-width:none; }
  .gv-svc__cta{ width:100%; }
  .gv-svc__cta .okna-btn{ width:100% !important; min-height:48px; }
  .gv-svc__brands{ align-items:flex-start; padding:16px 18px; }
}

/* ===== 4. «Подберём стекло» (picker-dark, 03.07.2026) — тёмный баннер .okna-pick (стили выше, общие с услугами);
   прежний светлый gv-picker удалён вместе с веткой главной в picker-cta.php (.gv-ways/.gv-way живут — no-catalog-cta) ===== */
/* внешний H2 секции убран (владелец 03.07.2026) — заголовок баннера сам стал H2 (title_tag хелпера) */
/* кнопки баннера на главной — ФАКТИЧЕСКИЕ цвета услуг (computed с /vkleyka/: синяя #1c5bd6 залитая + белая контурная).
   !important — анти-TT1: без него TT1 красил <button> в свой тёмный rgb(40,48,61) с зелёным текстом (замер) */
.gv-pickdark .okna-pick__btn--red{ background:#1c5bd6 !important; border-color:#1c5bd6 !important; color:#fff !important; }
.gv-pickdark .okna-pick__btn--red:hover,
.gv-pickdark .okna-pick__btn--red:focus{ background:#1448aa !important; border-color:#1448aa !important; color:#fff !important; }
.gv-pickdark .okna-pick__btn--ghost{ background:transparent !important; border-color:rgba(255,255,255,.75) !important; color:#fff !important; }
.gv-pickdark .okna-pick__btn--ghost:hover,
.gv-pickdark .okna-pick__btn--ghost:focus{ background:rgba(255,255,255,.14) !important; border-color:#fff !important; color:#fff !important; }
.gv-ways{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.gv-way{ background:#fff; border:1px solid #d7e1f4; border-radius:8px; padding:10px 16px; font-weight:700; color:var(--ink); font-size:14px; }

/* ===== 5. Типы стёкол (glass-types) — плитки ===== */
.gv-types{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.gv-tile{ position:relative; border-radius:var(--ok-radius-dropdown,10px); overflow:hidden; min-height:150px;
  display:flex; flex-direction:column; justify-content:flex-end; padding:18px; color:#fff; border:1px solid var(--line); }
.gv-tile .gv-tile-bg{ position:absolute; inset:0; background:linear-gradient(160deg,#2a4d96,#123d87); }
.gv-tile.alt .gv-tile-bg{ background:linear-gradient(160deg,#3a4256,#1e2330); }
.gv-tile .gv-tile-ov{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.45)); }
.gv-tile span{ position:relative; font-size:12px; color:#cdd8ee; font-weight:600; }
.gv-tile b{ position:relative; font-size:17px; font-weight:800; margin-top:4px; }

/* ===== 6. Подбор по каталогу на главной (podbor-home, 04.07.2026 — каскадный «Быстрый подбор») =====
   Статичные карточки .gv-catalog удалены вместе с блоком catalog-home (заменён podbor-home).
   Селектор .okna-qp везёт свои стили сам (mu-plugins/okna-tree-nav.php). Своё здесь — только обвязка. */
.gv-podbor .okna-section-title{ margin-bottom:14px; }
.gv-podbor .okna-section-sub{ max-width:820px; }
.gv-podbor .okna-podbor-pair{ margin-top:6px; } /* компонент сам даёт margin:24px 0; чуть поджать под подзаголовок */
/* панель открыта по умолчанию → держим её В ПОТОКЕ (не absolute), иначе перекрывает плашку-примечание и
   её левый бордюр торчит из-под панели (аудит 04.07.2026). Скоуп .gv-podbor — на /katalog/ панель прежняя (absolute). */
.gv-podbor .okna-qp__panel{ position:static !important; left:auto; right:auto; top:auto; margin:8px 0 0;
  box-shadow:0 8px 24px rgba(20,30,55,.10); } /* max-height:340+overflow — из базового правила компонента */
.gv-note{ margin-top:20px; background:#fff; border:1px solid var(--line); border-left:3px solid var(--blue);
  border-radius:8px; padding:18px 22px; color:var(--muted); font-size:15px; }

/* ===== 7. Предложения (offers) ===== */
.gv-offers{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gv-offer{ border:1px solid var(--line); border-radius:var(--ok-radius-dropdown,10px); padding:24px; background:#fff;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:8px; }
.gv-offer h3{ font-size:17px; margin:0; color:var(--text); }
.gv-offer p{ font-size:14px; color:var(--muted); margin:0; }
.gv-offer.feat{ background:var(--graphite); border-color:var(--graphite); color:#fff; }
.gv-offer.feat h3{ color:#fff; } .gv-offer.feat p{ color:var(--muted-d); }

/* ===== 9. Марки (brands-home) — теги по группам ===== */
.gv-bgroup{ margin-bottom:22px; }
.gv-bgroup h3{ font-size:16px; color:var(--ink); margin:0 0 12px; display:flex; align-items:center; gap:10px; }
.gv-flag{ font-size:13px; background:var(--blue-soft); color:var(--blue); padding:3px 10px; border-radius:4px; font-weight:800; letter-spacing:.03em; }
.gv-tags{ display:flex; flex-wrap:wrap; gap:10px; }
.gv-tags a{ background:#fff; border:1px solid var(--line); border-radius:6px; padding:8px 14px; font-weight:600; color:var(--text); font-size:14px; }
.gv-tags a:hover{ border-color:#c9d8f5; color:var(--ink); }

/* ===== 10. Нет в каталоге (dark CTA) ===== */
.gv-nocat .gv-box{ background:var(--graphite); color:#fff; border-radius:var(--ok-radius-card,16px); padding:44px;
  display:grid; grid-template-columns:1.4fr auto; gap:30px; align-items:center; }
.gv-nocat h2{ color:#fff; margin:0 0 10px; } /* размер/черта — в едином стиле H2 (тёмный → текст белый) */
.gv-nocat p{ color:var(--muted-d); font-size:17px; max-width:62ch; margin:0; }

/* ===== Для какого транспорта работаем (gv-tt) — редизайн Ф6 по макету ===== */
.gv-tt__sub{ max-width:760px; }
/* инфо-баннер: иллюстрация-декор слева + текст/преимущества справа */
.gv-tt__banner{ display:grid; grid-template-columns:minmax(260px,0.85fr) 1.4fr; align-items:stretch;
  background:var(--bg-soft); border:1px solid var(--line); border-radius:22px; overflow:hidden; margin:30px 0 34px; }
.gv-tt__banner-media{ background-repeat:no-repeat; background-position:left center; background-size:contain; min-height:236px; }
.gv-tt__banner-body{ padding:30px 34px; }
.gv-tt__banner-lead{ display:flex; align-items:center; gap:12px; font-size:19px; font-weight:800; color:var(--ink); }
.gv-tt__banner-lead svg{ width:26px; height:26px; flex:0 0 auto; }
.gv-tt__banner-text{ color:var(--muted); font-size:16px; line-height:1.55; margin:12px 0 20px; max-width:56ch; }
.gv-tt__adv{ list-style:none; margin:0; padding:20px 0 0; display:grid; grid-template-columns:repeat(3,1fr);
  gap:18px; border-top:1px solid var(--line); }
.gv-tt__adv li{ display:flex; gap:12px; align-items:flex-start; }
.gv-tt__adv svg{ width:26px; height:26px; flex:0 0 auto; }
.gv-tt__adv span{ font-size:14px; line-height:1.4; color:var(--ink); }
/* сетка 8 карточек-ссылок на витрины типов */
.gv-tt__grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.gv-tt__grid>li{ display:flex; }
.gv-tt__card{ position:relative; display:flex; align-items:center; width:100%; min-height:64px;
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px 48px 18px 22px;
  text-decoration:none; color:var(--ink); box-shadow:var(--shadow-sm);
  transition:border-color .15s, box-shadow .15s; }
.gv-tt__card:hover{ border-color:#c9d6ef; box-shadow:0 8px 24px rgba(18,61,135,.10); }
.gv-tt__name{ font-weight:700; font-size:16px; line-height:1.3; }
.gv-tt__arr{ position:absolute; right:16px; top:50%; transform:translateY(-50%); width:26px; height:26px; border-radius:50%;
  border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:var(--blue); transition:transform .15s, border-color .15s; }
.gv-tt__arr svg{ width:7px; height:12px; }
.gv-tt__card:hover .gv-tt__arr{ transform:translateY(-50%) translateX(3px); border-color:var(--blue); }
@media (max-width:1024px){ .gv-tt__grid{ grid-template-columns:repeat(2,1fr); } .gv-tt__adv{ grid-template-columns:1fr; gap:12px; } }
@media (max-width:768px){ .gv-tt__banner{ grid-template-columns:1fr; } .gv-tt__banner-media{ min-height:180px; background-position:center; } }
@media (max-width:600px){ .gv-tt__grid{ grid-template-columns:1fr; } .gv-tt__banner-body{ padding:22px 20px; } .gv-tt__banner-lead{ font-size:17px; } }

/* ===== 11. Процесс — шаги-карточки + врезка «вклейка» (Г3.3: переделан из таймлайна) ===== */
.gv-eyebrow{ display:inline-block; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--blue); background:var(--blue-soft); padding:5px 12px; border-radius:999px; margin-bottom:14px; }
.gv-head__sub{ margin-top:14px; color:var(--muted); font-size:17px; max-width:640px; }

.gv-proc{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:34px; }
.gv-proc__step{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--ok-radius-card,16px);
  padding:22px 18px 20px; box-shadow:var(--shadow-sm); }
.gv-proc__num{ width:38px; height:38px; border-radius:10px; background:var(--ink); color:#fff; font-weight:800;
  font-size:17px; display:grid; place-items:center; margin-bottom:14px; }
.gv-proc__step h4{ font-size:16px; margin:0 0 8px; line-height:1.25; }
.gv-proc__step p{ font-size:13.5px; color:var(--muted); margin:0; line-height:1.5; }

.gv-proc__why{ display:grid; grid-template-columns:1.3fr 1fr; gap:32px; align-items:center; margin-top:26px;
  background:var(--graphite); color:#fff; border-radius:var(--ok-radius-card,16px); padding:30px 34px; }
.gv-proc__why-text h3{ margin:0 0 10px; font-size:21px; color:#fff; }
.gv-proc__why-text p{ margin:0; color:var(--muted-d); font-size:15px; line-height:1.65; }
.gv-proc__layers{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; justify-content:center; }
.gv-proc__layers span{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); color:#fff;
  font-weight:700; font-size:14px; padding:10px 16px; border-radius:10px; }
.gv-proc__layers i{ color:var(--blue); font-style:normal; font-weight:700; }

/* ===== 12. Вклейка (why-gluing) ===== */
.gv-why{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:center; }
.gv-why h2{ font-size:30px; }
.gv-why .muted{ color:var(--muted); margin-top:14px; }
.gv-why ul{ list-style:none; margin:16px 0 0; padding:0; }
.gv-why li{ display:flex; gap:12px; margin-bottom:14px; font-size:15.5px; }
.gv-why li .muted{ font-size:14px; margin:0; }
.gv-why-visual{ background:var(--card-dark); border-radius:var(--ok-radius-card,16px); min-height:280px;
  display:flex; align-items:center; justify-content:center; padding:24px; }
.gv-why-visual .gv-layers{ text-align:center; width:100%; max-width:300px; }
.gv-layer{ background:rgba(255,255,255,.08); border:1px solid var(--line-d); border-radius:8px;
  padding:12px 24px; margin:8px 0; color:#dbe2ee; font-size:14px; font-weight:600; }

/* ===== 13. Факторы цены ===== старый плоский вид .okna-pf-home/.okna-pf-card УДАЛЁН (не рендерится).
   Богатый блок — .okna-pf2 (единый модуль inc/pf-block.php), включается галочкой на любой странице. ===== */

/* ===== 14. B2B (dark) ===== */
.gv-b2b .gv-box{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:center; }
.gv-b2b h2{ font-size:30px; }
.gv-b2b .gv-feats{ list-style:none; margin:16px 0 0; padding:0; }
.gv-b2b .gv-feats li{ display:flex; gap:12px; align-items:center; padding:12px 0;
  border-bottom:1px solid var(--line-d); color:#dbe2ee; font-size:16px; }
.gv-stats{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.gv-stat{ background:var(--card-dark); border:1px solid var(--line-d); border-radius:var(--ok-radius-dropdown,10px); padding:24px; }
.gv-stat b{ font-size:34px; color:#fff; display:block; letter-spacing:-.02em; }
.gv-stat span{ color:var(--muted-d); font-size:14px; }

/* ===== 15. Гарантия — блок заменён, старые правила .gv-guar__* удалены.
   ★ W2-FIX-03, коммит 3, 30.07.2026. Удалён 61 ряд: этот блок целиком, два
   хвоста общего селектора .glavnaya-v4 … > * ниже по файлу и фрагмент
   .gv-guar__card:active в design.css.

   ЧТО СЕЙЧАС ЖИВОЕ И ГДЕ ОНО ЛЕЖИТ — проверено грепом, а не по памяти:
     разметку печатает    template-parts/home/blocks/guarantee-home.php
     правила поколения 3  assets/ok-home-w3.css — .ok-guar__* , правило на :872,
                          мобильное display:none на :1089. ★ НЕ в design.css:
                          там всего одна строка прозы, и искать правила туда
                          ходить бесполезно.
     откат флага okna_home_shell_v2=0 вернёт на главную поколение 2
                          (.okna-org-guar__*) — у него свой лист.

   ОСНОВАНИЕ УДАЛЕНИЯ: производителей ноль. Греп по всем деревьям (php, js,
   шаблоны) и по базе — записи ЛЮБОГО статуса, включая черновики и корзину,
   мета-поля, опции, мета терминов, uploads. Живой HTML пяти поверхностей —
   ноль вхождений. Полный вывод: evidence/w2-fix-03/GREP_gv-guar.txt.

   ★ ОСИРОТЕВШИЙ АССЕТ: вместе с .gv-guar__lead::before ушла единственная
   ссылка на assets/img/sections/guarantee-bus-ghost.webp (16 884 Б). Файл
   остался на диске без потребителя — снести отдельной уборкой, но не молча:
   здесь он назван, чтобы через полгода не гадать, чей он. ===== */

/* ===== 16. География — блок заменён на .okna-geo-req (з.2, assets/geo-request.css).
   Старые правила .gv-geo/.gv-map-panel/.gv-cities/.gv-map-svg удалены — разметка больше не выводится. ===== */

/* ===== 17. Калькулятор веса стекла (переиспользуемый модуль inc/calc-block.php, логика assets/calc.js) =====
   Единый контейнер: слева светлая зона ввода, справа тёмно-синяя зона результата. Скоуп .calc-w__*.
   .ctrl/.people/.okna-calc-msg — классы, которые ведёт calc.js (className перезаписывается) → стилизуем их в скоупе.
   Блок работает на ЛЮБОЙ странице (галочка _okna_calc_show), поэтому .okna-wrap скоупим тут (глобального нет). */
.calc-w{ padding:56px 0; }  /* самостоятельный отступ вне главной; на главной .glavnaya-v4>section (32px) перебивает */
.calc-w .okna-wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding:0 40px; }
.calc-w__box{ display:grid; grid-template-columns:54% 46%; margin-top:26px; border:1px solid var(--line);
  border-radius:24px; overflow:hidden; box-shadow:var(--shadow); }

/* Левая зона ввода — подложка левфон.webp (подготовлена владельцем: светлый фон + призрак-автобус) на всю зону */
.calc-w__left{ position:relative; overflow:hidden; padding:36px 40px;
  background:#f4f7fc url(img/sections/calc-left-bg.webp) center right / cover no-repeat; }
.calc-w__left > *{ position:relative; z-index:1; }
.calc-w__head{ display:flex; align-items:center; gap:16px; margin-bottom:26px; }
.calc-w__ico{ flex:none; width:60px; height:60px; display:flex; align-items:center; justify-content:center; }
.calc-w__ico img{ width:60px; height:60px; object-fit:contain; display:block; }
.calc-w__title{ margin:0 0 4px; font-size:23px; font-weight:800; line-height:1.2; color:var(--ink); }
.calc-w__sub{ margin:0; font-size:14px; line-height:1.4; color:var(--muted); }
.calc-w__fields{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:22px; }
.calc-w__field{ display:flex; flex-direction:column; gap:8px; font-size:13px; font-weight:700; color:var(--muted); }
.calc-w__fields .ctrl{ width:100%; border:1px solid var(--line) !important; border-radius:var(--ok-radius-field,8px) !important; /* Волна 1-бис: калькулятор-поле 12px→8 */
  padding:13px 14px !important; font-size:16px !important; font-weight:600; color:var(--ink) !important;
  background:#fff !important; font-family:inherit; }  /* TT1 бьёт inputs → !important в скоупе; 16px = без iOS-зума */
.calc-w__fields .ctrl:focus{ border-color:var(--blue) !important; outline:none; box-shadow:0 0 0 3px rgba(28,91,214,.12); }
.calc-w__fields .ctrl.okna-field-error{ border-color:var(--red) !important; }
.calc-w__fields .ctrl.okna-field-warn{ border-color:#e0a13a !important; }
.calc-w__hint{ font-size:11.5px; font-weight:600; line-height:1.35; color:var(--muted); }
.calc-w__hint:empty{ display:none; }
.calc-w__btn{ display:inline-flex; align-items:center; gap:10px; border:0; border-radius:12px;
  background:var(--blue); color:#fff !important; padding:14px 28px; font-size:16px; font-weight:700; font-family:inherit;
  cursor:pointer; transition:background .18s ease, transform .1s ease; }
.calc-w__btn:hover{ background:var(--ink); color:#fff !important; }           /* !important — TT1 не перекрасит текст в чёрный */
.calc-w__btn:active{ background:var(--ink); color:#fff !important; transform:translateY(1px); } /* нажатие-вдавливание */
.calc-w__btn:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
.calc-w__note{ margin:22px 0 0; padding-top:18px; border-top:1px solid var(--line);
  display:flex; gap:8px; font-size:13px; line-height:1.5; color:var(--muted); }
.calc-w__note-ico{ flex:none; font-size:15px; color:var(--muted); }

/* Правая зона результата — подложка правыйфон.webp (владелец: тёмно-синее стекло) + лёгкий градиент слева под текст */
.calc-w__right{ position:relative; padding:36px 40px; display:flex; flex-direction:column; justify-content:center; color:#fff;
  background:linear-gradient(90deg, rgba(8,18,42,.66) 0%, rgba(8,18,42,.2) 58%, rgba(8,18,42,0) 100%), url(img/sections/calc-right-bg.webp) center / cover no-repeat; }
.calc-w__res-label{ margin:0 0 12px; font-size:16px; color:rgba(255,255,255,.7); }
.calc-w__res{ margin:0; font-weight:800; letter-spacing:-.02em; line-height:1; color:#fff; white-space:nowrap; }
.calc-w__res b{ font-size:68px; }
.calc-w__approx{ font-size:34px; font-weight:700; color:rgba(255,255,255,.6); }
.calc-w__unit{ font-size:26px; font-weight:700; color:rgba(255,255,255,.6); }
.calc-w__res-note{ margin:12px 0 0; font-size:15px; color:rgba(255,255,255,.6); }
.calc-w__right .okna-calc-msg{ margin:16px 0 0; font-size:13.5px; line-height:1.5; color:#ffd39a; }
.calc-w__right .okna-calc-msg:empty{ display:none; }
.calc-w__right .okna-calc-msg ul{ margin:6px 0 0; padding-left:18px; }
.calc-w__tip{ display:flex; align-items:flex-start; gap:14px; margin-top:24px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:16px; padding:18px 20px; }
.calc-w__tip:has(.people:empty){ display:none; }
.calc-w__tip-ico{ flex:none; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:center; color:#7fb0ff; }
.calc-w__tip-ico svg{ width:20px; height:20px; }
.calc-w__tip .people{ font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.92); }
.calc-w__tip .people.is-joke{ color:#ffd39a; }

/* Адаптив калькулятора (MOBILE_PRAVILA 900/600) */
@media (max-width:768px){
  .calc-w__box{ grid-template-columns:1fr; }
  .calc-w__left,.calc-w__right{ padding:30px 26px; }
  .calc-w__res b{ font-size:56px; }
}
@media (max-width:600px){
  .calc-w .okna-wrap{ padding:0 16px; }
  .calc-w__fields{ grid-template-columns:1fr; }
  .calc-w__btn{ width:100%; justify-content:center; }
  .calc-w__res b{ font-size:50px; }
  .calc-w__left,.calc-w__right{ padding:26px 20px; }
  .calc-w__head{ margin-bottom:20px; }
  .calc-w__ico,.calc-w__ico svg{ width:52px; height:52px; }
}

/* ===== 18. Примеры выполненных работ (CPT okna_case; фото+видео, попап-галерея .okna-case-modal) =====
   Скоуп .okna-case__*. Play/бейдж — синие/белые (красный CTA только hero, ТЗ п.7). Старый .gv-case* удалён. */
.okna-cases__grid{ display:grid; grid-template-columns:repeat(var(--cols,3),1fr); gap:24px; margin-top:26px; align-items:stretch; }
.okna-case.is-hidden{ display:none; }                                   /* режим «Показать ещё» */
/* Слайдер: горизонтальная лента со снапом; стрелки в шапке */
.okna-cases--slider .okna-cases__grid{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding-bottom:6px; }
.okna-cases--slider .okna-case{ flex:0 0 calc((100% - (var(--cols,3) - 1) * 24px) / var(--cols,3)); scroll-snap-align:start; }
.okna-cases__head{ display:flex; flex-direction:column; }
.okna-cases__nav{ display:flex; gap:8px; justify-content:flex-end; margin-top:8px; }
.okna-cases--slider .okna-cases__grid::-webkit-scrollbar{ height:6px; }
.okna-cases--slider .okna-cases__grid::-webkit-scrollbar-thumb{ background:var(--line); border-radius:999px; }
.okna-cases__arrow{ width:40px; height:40px; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--ink);
  font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.okna-cases__arrow:hover{ background:var(--blue); color:#fff; border-color:var(--blue); }
.okna-cases__foot{ display:flex; gap:14px; justify-content:center; align-items:center; margin-top:26px; flex-wrap:wrap; }
.okna-cases__foot:empty{ display:none; }
.okna-cases__all{ text-decoration:none; }  /* синяя .okna-btn (не красная) */
.okna-case{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:18px;
  overflow:hidden; box-shadow:var(--shadow-sm,0 6px 18px rgba(20,30,55,.08)); transition:transform .18s ease, box-shadow .18s ease; }
.okna-case.is-clickable{ cursor:pointer; }
.okna-case:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.okna-case__media{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--bg-soft); }
/* absolute-fill (единый cover-паттерн): img{height:100%} на aspect-ratio-родителе не доезжал + TT1 img{height:auto} → полоса снизу. Фикс. */
.okna-case__img{ position:absolute; inset:0; width:100% !important; height:100% !important; object-fit:cover; display:block; transition:transform .35s ease; }
.okna-case:hover .okna-case__img{ transform:scale(1.03); }
.okna-case__badge{ position:absolute; top:12px; left:12px; z-index:2; background:var(--blue-soft); color:var(--blue);
  font-size:12px; font-weight:700; padding:5px 11px; border-radius:7px; box-shadow:0 2px 8px rgba(20,30,55,.12); }
.okna-case__play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2;
  width:60px; height:60px; border:0; border-radius:50%; background:rgba(255,255,255,.92); color:var(--blue);
  display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 6px 20px rgba(20,30,55,.28);
  transition:transform .18s ease, background .18s ease; }
.okna-case__play svg{ width:26px; height:26px; margin-left:3px; }
.okna-case:hover .okna-case__play{ transform:translate(-50%,-50%) scale(1.08); background:#fff; }
.okna-case__vlabel{ position:absolute; top:12px; right:12px; z-index:2; display:inline-flex; align-items:center; gap:4px;
  background:rgba(18,29,53,.72); color:#fff; font-size:11.5px; font-weight:700; padding:4px 9px; border-radius:7px; }
.okna-case__vlabel svg{ width:12px; height:12px; }
.okna-case__body{ display:flex; flex-direction:column; padding:20px 22px; flex:1; }
.okna-case__title{ margin:0 0 8px; font-size:19px; font-weight:700; line-height:1.3; color:var(--ink); }
.okna-case__title a{ color:var(--ink); text-decoration:none; }
.okna-case__title a:hover{ color:var(--blue); }
.okna-case__text{ margin:0 0 12px; font-size:15px; line-height:1.6; color:var(--muted); }
.okna-case__term{ margin:auto 0 0; font-size:14px; color:var(--blue); font-weight:600; }
.okna-case__term b{ font-weight:700; }
@media (max-width:1024px){ .okna-cases--grid .okna-cases__grid,.okna-cases--more .okna-cases__grid{ grid-template-columns:repeat(2,1fr); gap:20px; } }
@media (max-width:600px){
  .okna-cases--grid .okna-cases__grid,.okna-cases--more .okna-cases__grid{ grid-template-columns:repeat(var(--cols-m,1),1fr); }
  .okna-cases--slider .okna-case{ flex-basis:86%; }   /* слайдер на мобиле — 1 карточка в кадре + подглядывание */
}

/* Попап-галерея кейсов (образец — лайтбокс #okna-lb; медиа-лента фото+видео, ленивый плеер) */
.okna-case-modal{ position:fixed; inset:0; z-index:9999; display:none; }
.okna-case-modal.is-open{ display:flex; align-items:center; justify-content:center; }
.okna-case-modal__overlay{ position:absolute; inset:0; background:rgba(10,18,38,.82); }
.okna-case-modal__box{ position:relative; z-index:1; width:min(920px,94vw); max-height:92vh; overflow:auto;
  background:#fff; border-radius:18px; padding:16px; box-shadow:var(--shadow-lg); }
.okna-case-modal__close{ position:absolute; top:10px; right:10px; z-index:3; width:40px; height:40px; border:0; padding:0;
  border-radius:50%; background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 4px 14px rgba(20,30,55,.18); }
.okna-case-modal__close svg{ width:18px; height:18px; display:block; }
.okna-case-modal__close:hover{ background:var(--blue); color:#fff; }
.okna-case-modal__stage{ position:relative; display:flex; align-items:center; justify-content:center; background:#0b1428; border-radius:12px; overflow:hidden; }
.okna-case-modal__slide{ width:100%; display:flex; align-items:center; justify-content:center; }
.okna-case-modal__img{ max-width:100%; max-height:70vh; object-fit:contain; display:block; }
.okna-case-modal__video{ position:relative; width:100%; aspect-ratio:16/9; }
.okna-case-modal__poster{ position:absolute; inset:0; background:#0b1428 center / cover no-repeat; display:flex; align-items:center; justify-content:center; }
.okna-case-modal__vplay{ width:72px; height:72px; border:0; border-radius:50%; background:rgba(255,255,255,.92); color:var(--blue);
  display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 8px 26px rgba(0,0,0,.4); transition:transform .18s ease, background .18s ease; }
.okna-case-modal__vplay:hover{ transform:scale(1.08); background:#fff; }
.okna-case-modal__vplay svg{ width:30px; height:30px; margin-left:4px; }
.okna-case-modal__player{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.okna-case-modal__err{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:15px; background:#0b1428; }
.okna-case-modal__arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:44px; height:44px; border:0;
  border-radius:50%; background:rgba(255,255,255,.95) !important; color:var(--ink) !important; font-size:26px; line-height:1; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.25); }
.okna-case-modal__arrow--prev{ left:12px; } .okna-case-modal__arrow--next{ right:12px; }
.okna-case-modal__arrow:hover{ background:var(--blue) !important; color:#fff !important; }
.okna-case-modal__arrow[disabled]{ opacity:.35; cursor:default; }
.okna-case-modal__arrow[hidden]{ display:none; }
.okna-case-modal__dots{ display:flex; justify-content:center; gap:8px; padding:12px 0 2px; }
.okna-case-modal__dot{ width:8px; height:8px; border:0; border-radius:50%; background:var(--line); cursor:pointer; padding:0; }
.okna-case-modal__dot.is-active{ background:var(--blue); }
.okna-case-modal__info{ padding:14px 8px 6px; }
.okna-case-modal__badge{ display:inline-block; background:var(--blue-soft); color:var(--blue); font-size:12px; font-weight:700; padding:5px 11px; border-radius:7px; margin-bottom:8px; }
.okna-case-modal__title{ margin:0 0 8px; font-size:22px; font-weight:800; line-height:1.25; color:var(--ink); }
.okna-case-modal__text{ margin:0 0 8px; font-size:15px; line-height:1.6; color:var(--muted); }
.okna-case-modal__term{ margin:0; font-size:14px; font-weight:600; color:var(--blue); }
@media (max-width:600px){
  .okna-case-modal__box{ width:96vw; padding:10px; }
  .okna-case-modal__title{ font-size:19px; }
  .okna-case-modal__vplay{ width:60px; height:60px; }
  .okna-case-modal__arrow{ width:38px; height:38px; }
}

/* ===== 19. Полезные разделы ===== */
.gv-links{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.gv-links a{ display:flex; align-items:center; gap:10px; background:var(--bg-soft); border:1px solid var(--line);
  border-radius:8px; padding:14px 16px; font-weight:600; color:var(--text); font-size:14.5px; }
.gv-links a:hover{ color:var(--blue); border-color:#c9d8f5; }

/* ===== 20. FAQ ===== */
/* ЕДИНЫЙ компактный аккордеон .okna-faq (канон для ВСЕГО сайта, включая главную) живёт в assets/design.css.
   Здесь FAQ-правил НЕТ и быть не должно — никаких per-страничных вариантов (SKILL_faq.md).
   Подзаголовок .okna-faq__sub — тоже в design.css (единый стандарт подзаголовков секций). */

/* ===== 21. SEO-текст ===== */
.gv-seo{ max-width:920px; }
.gv-seo h2{ margin:0 0 16px; } /* размер/черта — в едином стиле H2 (конец файла) */
.gv-seo p{ color:var(--muted); font-size:15px; margin:0 0 14px; }

/* ===== 22. Финальная форма ===== */
.gv-final{ background:var(--blue-soft); }
.gv-final .gv-box{ background:#fff; border-radius:var(--ok-radius-card,16px); box-shadow:var(--shadow);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); overflow:hidden; }
.gv-final .gv-info{ padding:42px; background:var(--graphite); color:#fff; }
.gv-final .gv-info h2{ color:#fff; margin:0 0 14px; } /* размер/черта — в едином стиле H2 (тёмный → текст белый) */
.gv-final .gv-info p{ color:var(--muted-d); margin:0 0 18px; }
.gv-final .gv-info .li{ display:flex; gap:12px; align-items:center; color:#dbe2ee; font-size:15px; margin-bottom:12px; }
.gv-final .gv-info .ph{ color:#fff; font-weight:800; font-size:18px; }
.gv-final .gv-form{ padding:42px; }
.gv-final .okna-field{ border:1px solid var(--line); border-radius:var(--ok-radius-field,8px); padding:13px 14px; /* Волна 1-бис: 6px→8 */
  font-size:15px; color:var(--muted); margin-bottom:14px; background:#fff; }
.okna-anchor{ position:absolute; }
html{ scroll-padding-top:92px; } /* чтобы якоря не прятались под липкой шапкой */

/* ===== Адаптив секций (планшет; мобайл — отдельный этап) ===== */
@media (max-width:1024px){
  .gv-services .gv-grid,.gv-types,.gv-links{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gv-proc{ grid-template-columns:repeat(3,1fr); row-gap:16px; }
  .gv-proc__why{ grid-template-columns:1fr; gap:22px; text-align:center; }
  .gv-proc__why-text{ text-align:left; }
}
@media (max-width:1024px){
  .okna-hero-grid,.gv-why,.gv-b2b .gv-box,.gv-nocat .gv-box,
  .gv-geo .gv-map-panel,.gv-final .gv-box,.gv-offers{
    grid-template-columns:minmax(0,1fr);
  }
  .okna-hero-home .okna-benefits{ grid-template-columns:1fr 1fr; }
  .gv-proc{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .gv-proc{ grid-template-columns:1fr; }
}

/* ============================================================
   Шапка v2 — кастомное меню + тёмные выпадашки + 3-уровневое мега-меню
   ============================================================ */
.okna-header-inner{ position:relative; } /* контекст для абсолютной мега-панели */
.okna-nav{ flex:1 1 auto; min-width:0; }
.okna-menu{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; }
.okna-menu > li{ position:relative; }
.okna-menu > li > a{ display:inline-flex; align-items:center; gap:6px; padding:9px 13px; border-radius:8px;
  color:var(--text); font-weight:600; font-size:15px; text-decoration:none; white-space:nowrap; transition:.14s; }
.okna-menu > li > a:hover{ color:var(--blue); background:var(--blue-soft); }
.okna-caret{ font-size:11px; opacity:.7; }
/* Каталог — первым, акцентный */
.okna-menu > li.okna-mega > a{ background:var(--red); color:#fff; font-weight:700; }
.okna-menu > li.okna-mega > a:hover{ background:var(--red-hover, #c81a30); color:#fff; }

/* Тёмная выпадашка (Услуги и т.п.) — ЕДИНЫЙ тёмный стиль для ЛЮБОГО .okna-drop (по классу, не по тексту).
   !important: фон --graphite и светлые состояния пунктов НЕ должны перебиваться общим
   a:hover{color:var(--ink)} (design.css) и тёмной темой TT1 (рецепт из otchet_diag_buttons). */
.okna-drop{ position:absolute; top:calc(100% + 8px); left:0; min-width:248px; background:var(--graphite) !important;
  border:1px solid var(--line-d); border-radius:12px; box-shadow:var(--shadow-lg); padding:10px;
  opacity:0; visibility:hidden; transform:translateY(6px); transition:.16s; z-index:90; }
.okna-has-drop:hover > .okna-drop,
.okna-has-drop:focus-within > .okna-drop{ opacity:1; visibility:visible; transform:none; }
.okna-drop ul{ list-style:none; margin:0; padding:0; }
.okna-drop a,
.okna-drop a:link,
.okna-drop a:visited{ display:block; padding:9px 12px; border-radius:8px; background:transparent !important; color:#cfd6e2 !important; font-size:14.5px; font-weight:500; text-decoration:none !important; }
.okna-drop a:hover,
.okna-drop a:focus,
.okna-drop a:focus-visible{ background:rgba(255,255,255,.10) !important; color:#fff !important; }
.okna-drop a:active{ background:var(--blue,#1c5bd6) !important; color:#fff !important; }

/* Мега-панель «Каталог» — тёмная, 3 уровня */
.okna-mega{ position:static; } /* панель тянем во всю ширину inner */
.okna-mega-panel{ position:absolute; top:calc(100% + 8px); left:0; right:auto; width:880px; max-width:calc(100vw - 48px);
  background:var(--graphite); border:1px solid var(--line-d); border-radius:14px; box-shadow:var(--shadow-lg);
  padding:16px; opacity:0; visibility:hidden; transform:translateY(6px); transition:.16s; z-index:95; }
.okna-mega:hover > .okna-mega-panel,
.okna-mega:focus-within > .okna-mega-panel{ opacity:1; visibility:visible; transform:none; }
/* Раскладка мегаменю (страны/марки/МОДЕЛИ) ПЕРЕПИСАНА НАЧИСТО → assets/megamenu.css
   (неймспейс okna-mm-*, отдельный handle okna-megamenu-css). Старые .okna-cat-cols/.okna-cm-list
   и пр. удалены, чтобы старые правила/кэш не перебивали новую раскладку моделей (3 колонки). */

@media (max-width:1024px){
  .okna-menu > li > a{ font-size:14px; padding:8px 10px; }
  .okna-mega-panel{ width:720px; }
}
@media (max-width:1024px){
  .okna-nav{ order:3; flex-basis:100%; }
  .okna-menu{ justify-content:flex-start; }
  .okna-mega-panel{ width:calc(100vw - 48px); }
}

/* ============================================================
   Шапка v3 — полировка (читаемость, одна строка, мост, лого NN, телефоны)
   ============================================================ */
/* одна строка */
.okna-header{ padding:0 !important; margin:0 !important; } /* перебить #masthead (id) родителя Twenty Twenty-One */
.okna-header-inner{ flex-wrap:nowrap; align-items:center; gap:20px; }
.okna-brand{ flex:0 0 auto; }
.okna-brand-mark{ background:none !important; width:auto; height:26px; border-radius:0; }
.okna-brand-name{ font-size:18px; font-weight:800; color:var(--text); }

/* читаемое меню (без наследования родителя) */
.okna-header .okna-menu{ display:flex; flex-wrap:nowrap; align-items:center; gap:2px; }
.okna-header .okna-menu > li > a{ color:#1C2433; font-size:15px; font-weight:600; padding:9px 12px; border-radius:8px; white-space:nowrap; }
.okna-header .okna-menu > li > a:hover{ color:var(--blue); background:var(--blue-soft); }
.okna-header .okna-menu > li > a:active{ transform:translateY(1px); color:var(--blue) !important; background:var(--blue-soft); } /* нажатие верхней строки */
.okna-header .okna-menu > li > a:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
.okna-header .okna-menu > li.okna-mega > a{ color:#fff; background:var(--red); font-weight:700; }
.okna-header .okna-menu > li.okna-mega > a:hover{ background:#c81a30; color:#fff; }
.okna-caret{ font-size:11px; opacity:.65; }

/* телефоны — единый стиль, справа перед кнопкой */
.okna-header-actions{ flex:0 0 auto; gap:14px; }
.okna-header-phones{ flex-direction:column; align-items:flex-end; gap:3px; }
.okna-hdr-phone{ display:inline-flex; align-items:center; gap:7px; font-size:15px; font-weight:700; color:#1C2433; white-space:nowrap; }
.okna-hdr-phone:hover{ color:var(--blue); }
.okna-ph-ic{ width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; color:var(--blue); flex:0 0 auto; }
.okna-ph-ic svg{ display:block; }
.okna-ph-max{ background:#1c7ef5; color:#fff; border-radius:6px; font-weight:800; font-size:12px; }

/* hover-мост + задержка закрытия (Каталог и Услуги) */
.okna-mega > .okna-mega-panel, .okna-has-drop > .okna-drop{ top:100%; }
.okna-mega-panel::before, .okna-drop::before{ content:""; position:absolute; left:0; right:0; top:-14px; height:16px; }
.okna-mega > .okna-mega-panel, .okna-has-drop > .okna-drop{ transition:opacity .16s ease, visibility .16s ease, transform .16s ease; transition-delay:.25s; }
.okna-mega:hover > .okna-mega-panel, .okna-has-drop:hover > .okna-drop, .okna-has-drop:focus-within > .okna-drop{ transition-delay:0s; }

/* резинка: одна строка на десктопе, перенос ниже на узких (мобайл — отдельно) */
@media (max-width:1024px){
  .okna-header .okna-menu > li > a{ font-size:14px; padding:8px 9px; }
  .okna-hdr-phone{ font-size:14px; }
  .okna-header-inner{ gap:14px; }
}
@media (max-width:1024px){
  .okna-header-inner{ flex-wrap:wrap; }
  .okna-nav{ order:3; flex-basis:100%; }
  .okna-header .okna-menu{ flex-wrap:wrap; }
}

/* Шапка v3.1 — открытие выпадашек через JS hover-intent (.okna-open), закрытие управляет JS */
.okna-mega > .okna-mega-panel, .okna-has-drop > .okna-drop{ transition-delay:0s; }
.okna-mega.okna-open > .okna-mega-panel,
.okna-has-drop.okna-open > .okna-drop{ opacity:1; visibility:visible; transform:none; }

/* ============================================================
   Мега-меню Вариант Б: Популярное (полоса) + Типы стекла + дерево
   ============================================================ */
.okna-mega-panel.okna-cat-panel{ width:1060px; }
/* popular/types/body раскладка → перенесены в assets/megamenu.css (okna-mm-*). */
@media (max-width:1024px){
  .okna-mega-panel.okna-cat-panel{ width:900px; }
}
@media (max-width:1024px){ .okna-mega-panel.okna-cat-panel{ width:calc(100vw - 48px); } }

/* ============================================================
   Каталог стёкол (Слой 6): фильтры + карточки товаров + бейджи статуса
   ============================================================ */
.okna-catalog{ max-width:calc(var(--okna-cw) + 32px); margin:36px auto 0; padding:0 16px; }
.okna-catalog > h2{ margin:0 0 18px; } /* размер/черта — в едином стиле H2 (конец файла) */
.okna-filters{ display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; padding:18px; }
.okna-filter{ display:flex; flex-direction:column; gap:4px; font-size:12px; font-weight:700; color:var(--muted); }
.okna-filter select{ min-width:148px; }
.okna-filter-actions{ display:flex; gap:10px; align-items:center; margin-left:auto; }
.okna-catalog-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:22px; }
.okna-catalog-grid .okna-card{ position:relative; display:flex; flex-direction:column; overflow:hidden; padding:0; border-radius:16px; } /* §4.1 макет 20: радиус карточки 16 (канон каталога/поиска/витрин; база .okna-card=10 из design.css --ok-radius-dropdown). overflow:hidden скругляет и верх фото. Мобайл 14 — своё правило ниже (макет 06). */
/* Клик по всей карточке → товар (ссылка-оверлей; кнопки «Заказать»/«Купить» выше по z-index) */
.okna-card--link{ position:relative; cursor:pointer; }
.okna-card-link{ position:absolute; inset:0; z-index:1; }
.okna-card--link .okna-card-actions{ position:relative; z-index:2; }
.okna-card--link:hover{ box-shadow:0 6px 20px rgba(18,61,135,.10); }
.okna-card-img{ aspect-ratio:1/1; height:auto; background:#eef3fc center/cover no-repeat; }
/* .okna-card-img--ph — стандартная заглушка-картинка (стекло+силуэт+надписи). Фон задаётся инлайн-стилем в functions.php (один источник, webp+png). Текст поверх НЕ накладываем. */
.okna-card-body{ padding:16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.okna-card-body h3{ font-size:16px; margin:0; }
.okna-card-chars{ font-size:13px; color:var(--muted); margin:0; }
.okna-card-art{ font-size:12px; color:#9aa4b6; margin:0; }
.okna-card-type{ display:none; } /* v3.1: тип-бейдж по умолчанию скрыт; показывает только мобильный каталог (ok-catalog.css) */
.okna-card-price{ font-size:17px; font-weight:800; color:var(--ink); margin:4px 0 0; }
.okna-card-actions{ display:flex; gap:8px; margin-top:auto; padding-top:12px; }
.okna-card-actions .okna-btn{ padding:9px 10px; font-size:13px; flex:1; text-align:center; justify-content:center; }
.okna-badge{ position:absolute; top:10px; left:10px; z-index:2; font-size:11px; font-weight:800;
  padding:4px 9px; border-radius:5px; letter-spacing:.02em; }
.okna-badge-instock{ background:#e6f7ee; color:#1c8a4e; }
.okna-badge-order{ background:var(--blue-soft); color:var(--blue); }
.okna-badge-out{ background:#fdeaec; color:var(--red); }
.okna-badge-disc{ background:#eef0f4; color:var(--muted); }
/* Маркетинговые бейджи (Популярный / −N%) — текст через CSS attr, в HTML-разметке слов НЕТ (Вариант 4).
   Популярный — слева под статусом наличия (фиолетовый); скидка −N% — справа (красный). */
.okna-mbadge{ position:absolute; z-index:3; font-size:11px; font-weight:800; padding:4px 9px;
  border-radius:5px; letter-spacing:.02em; line-height:1.2; pointer-events:none; }
.okna-mbadge::before{ content:attr(data-label); }
.okna-mbadge-pop{ top:40px; left:10px; background:#efe7fb; color:#6b32c9; }
.okna-mbadge-sale{ top:10px; right:10px; background:#fdeaec; color:#d11a2a; }
/* Цена со скидкой: старая зачёркнута, новая — красным акцентом */
.okna-price-was{ color:#9aa4b6; text-decoration:line-through; font-weight:600; margin-right:6px; font-size:.92em; }
.okna-price-now{ color:#d11a2a; }
/* Скрытая Schema-разметка Offer (availability/price для роботов) — не влияет на вид */
.okna-schema-offer{ position:absolute; width:0; height:0; overflow:hidden; }
@media (max-width:1024px){ .okna-catalog-grid{ grid-template-columns:repeat(2,1fr); } }

/* Выравнивание телефонов в шапке: значки строго друг под другом, номера ровными краями */
.okna-header-phones{ align-items:flex-start; gap:4px; }
.okna-hdr-phone{ display:grid; grid-template-columns:18px auto; align-items:center; column-gap:8px; }
.okna-ph-ic{ width:18px; height:18px; justify-content:center; }

/* Телефоны: табличные цифры → равная ширина цифр, ровный правый край обоих номеров */
.okna-hdr-phone{ font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }

/* Каталог: пустой результат + совместимая замена (логика совместимости) */
.okna-empty .okna-empty-cta{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.okna-compat{ margin-top:26px; }
.okna-compat-sep{ border:0; border-top:1px solid var(--line); margin:0 0 20px; }
.okna-compat-head{ font-size:20px; font-weight:800; color:var(--text); margin-bottom:6px; }
.okna-compat-note{ font-size:14px; color:var(--muted); margin:0 0 18px; }

/* Финальная форма: CF7 (телефон/марка/имя) — заполняем блок, без пустоты */
.gv-final .gv-form{ display:flex; flex-direction:column; justify-content:center; }
.gv-form-sub{ color:var(--muted); margin:0 0 18px; font-size:15px; }
.gv-form .okna-cf7-row{ margin:0 0 14px; }
.gv-form .wpcf7 label{ display:block; font-size:13px; font-weight:700; color:var(--muted); }
.gv-form .okna-req{ color:var(--red); }
.gv-form .wpcf7 input[type=tel],
.gv-form .wpcf7 input[type=text]{ width:100%; margin-top:6px; }
.gv-form .wpcf7-submit{ width:100%; margin-top:4px; }
.gv-form .wpcf7-response-output{ margin:12px 0 0; border-radius:8px; font-size:13px; } /* Волна 1: радиус 6→8, кегль 14→13 к канону (лист легаси) */
/* CF7: скрыть контейнер скрытых полей (рендерится как пустой бордюр fieldset) */
.wpcf7 .hidden-fields-container{ display:none; }
.gv-form .wpcf7 fieldset{ border:0; margin:0; padding:0; }

/* ============================================================
   Каталог: плейсхолдер-силуэт стекла, цены карточки, страница карточки
   ============================================================ */
/* (старый SVG-контур .okna-card-img--ph убран — теперь стандартная заглушка-картинка, см. functions.php) */
.okna-card-price{ display:flex; flex-direction:column; gap:2px; }
.okna-price-glass{ font-size:15px; color:var(--text); }
.okna-price-glass b{ color:var(--ink); font-size:18px; }
.okna-price-install{ font-size:13px; color:var(--muted); }
.okna-price-install b{ color:var(--text); }
.okna-price-note{ font-size:11px; color:#9aa4b6; margin:2px 0 0; }
/* Страница карточки стекла */
.okna-steklo-single{ max-width:1080px; }
.okna-steklo-grid{ display:grid; grid-template-columns:1fr 1.2fr; gap:30px; align-items:start; margin:18px 0 28px; }
.okna-steklo-photo{ height:300px; border-radius:var(--ok-radius-dropdown,10px); border:1px solid var(--line); position:relative; }
.okna-steklo-photo .okna-badge{ position:absolute; top:12px; left:12px; }
.okna-steklo-info h1{ font-size:26px; margin:0 0 14px; }
.okna-steklo-chars{ list-style:none; margin:0 0 18px; padding:0; }
.okna-steklo-chars li{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); font-size:15px; }
.okna-steklo-chars span{ color:var(--muted); }
.okna-steklo-chars b{ color:var(--text); }
.okna-steklo-prices{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--ok-radius-dropdown,10px); padding:16px 18px; margin:0 0 16px; }
.okna-steklo-prices .okna-price-glass b{ font-size:22px; }
.okna-steklo-form{ margin:30px 0; max-width:560px; }
.okna-muted{ color:var(--muted); }
.okna-steklo-others{ margin-top:34px; }
@media (max-width:768px){ .okna-steklo-grid{ grid-template-columns:1fr; } }

/* ============================================================
   Каталог: ровные карточки + пагинация + модалка заявки
   ============================================================ */
.okna-catalog-grid{ align-items:stretch; }
.okna-catalog-grid .okna-card{ height:100%; }
.okna-catalog-count{ color:var(--muted); font-size:14px; margin:0 0 14px; }
/* ПРАВИЛО выравнивания подвала карточки (SKILL_kartochka_tovara, 04.07.2026): шапка (заголовок+chars) —
   ФИКСИРОВАННАЯ высота (кламп 2 строки), подвал (.okna-card-foot: цены+примечание+кнопки) стартует на одной линии
   у всех карточек ряда при любой длине названия; кнопки прижаты к низу (margin-top:auto). */
.okna-card-head{ display:flex; flex-direction:column; gap:6px; }
.okna-card-title{ min-height:42px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
/* chars — было min-height:18px (1 строка) → цена «всплывала»; теперь ФИКСИРОВАННАЯ высота 2 строк + кламп:
   короткий добивается пустотой, 3-строчный (Yutong) обрезается — шапка не «дышит» при любой ширине карточки
   (min-height пружинил на 8px между витриной и каталогом — разная ширина). Диагностика OTCHET_kartochki_diagnostika. */
.okna-card-chars{ height:38px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.okna-card-art{ min-height:16px; }
.okna-card-foot{ display:flex; flex-direction:column; flex:1 1 auto; } /* подвал заполняет остаток → кнопки к низу */
.okna-card-price{ min-height:74px; }
.okna-card-actions{ margin-top:auto; display:flex; gap:8px; padding-top:12px; }
/* Артикул — ТОЛЬКО на витрине главной скрыт (у 6/8 пусто, даёт зазор). В каталоге остаётся (B2B-поиск по номеру). */
.okna-showcase .okna-card-art{ display:none; }
.okna-card-actions .okna-btn{ flex:1; min-height:42px; display:inline-flex; align-items:center; justify-content:center; text-align:center; padding:9px 10px; font-size:13px; }
/* Пагинация */
.okna-pagination{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin:26px 0 0; }
.okna-page{ min-width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; /* ★№21 §1.3: тап-цель 40→44 (база всех пагинаций; каталог/блог/гео) */
  border:1px solid var(--line); border-radius:8px; color:var(--text); text-decoration:none; font-weight:700; }
.okna-page:hover{ border-color:#c9d8f5; color:var(--blue); }
.okna-page--cur{ background:var(--ink); color:#fff; border-color:var(--ink); }
.okna-page--gap{ border:none; color:var(--muted); font-weight:700; cursor:default; pointer-events:none; min-width:24px; }
/* Модалка заявки */
.okna-modal{ position:fixed; inset:0; z-index:1000; display:none; }
.okna-modal.is-open{ display:block; }
.okna-modal__overlay{ position:absolute; inset:0; background:rgba(20,24,34,.55); }
.okna-modal__box{ position:relative; max-width:460px; margin:8vh auto 0; background:#fff; border-radius:var(--ok-radius-card,16px);
  box-shadow:var(--shadow-lg); padding:30px; max-height:84vh; overflow:auto; }
/* .okna-modal__close — единый стиль крестика в design.css (UI-кит). Старое текстовое правило убрано. */
.okna-modal__box h3{ margin:0 0 6px; font-size:20px; }
/* строка предмета заказа в попапе «1 клик» (видна клиенту, точное название — менеджеру) */
.okna-1click-item{ margin:0 0 14px; padding:9px 12px; border-radius:10px; background:var(--pf-bg,#f7faff);
  border:1px solid var(--pf-line,#e8ecf2); font-size:13.5px; line-height:1.4; color:var(--ink,#123d87); }
.okna-1click-item[hidden]{ display:none; }
.okna-1click-item__lab{ color:var(--muted,#6b7686); }
.okna-1click-item strong{ font-weight:700; }
.okna-modal__box .wpcf7 .okna-cf7-row{ margin:0 0 12px; }
.okna-modal__box .wpcf7 label{ display:block; font-size:13px; font-weight:700; color:var(--muted); }
.okna-modal__box .wpcf7 input[type=tel],.okna-modal__box .wpcf7 input[type=text]{ width:100%; margin-top:6px; }
.okna-modal__box .wpcf7-submit{ width:100%; margin-top:4px; }
.okna-modal__box .hidden-fields-container{ display:none; }

/* ===== Страница 404 — стили ПЕРЕЕХАЛИ в assets/404.css (пакет SITE-404) =====
   Прежний блок «фирстиль v4» (.okna-404 / .okna-404-code / .okna-404-links / .okna-404-timer)
   удалён: он относился к старому дизайну страницы и конфликтовал бы с новым (например,
   .okna-404-timer был строкой текста, а стал карточкой). Новые стили живут в отдельном
   assets/404.css и грузятся ТОЛЬКО на is_404() — из glavnaya.css они больше не тянутся
   на все страницы сайта. История старого блока — в git. */

/* ===== Посадочная seo_filter: «под заказ» + теги своей ветки ===== */
.okna-empty-order{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--ok-radius-card,16px); padding:26px 30px; margin:18px 0 28px; }
.okna-empty-order h2{ margin:0 0 8px; }
.okna-empty-order p{ color:var(--muted); margin:0 0 18px; max-width:680px; }
.okna-empty-cta{ display:flex; gap:12px; flex-wrap:wrap; }
.okna-branch-tags{ margin-top:30px; border-top:1px solid var(--line); padding-top:18px; }
.okna-branch-tags h2{ font-size:20px; margin:0 0 14px; }
.okna-tags-group{ margin:0 0 16px; }
.okna-tags-group h3{ font-size:14px; color:var(--muted); margin:0 0 8px; font-weight:700; }
.okna-tags-list{ display:flex; flex-wrap:wrap; gap:8px; }
.okna-tag{ display:inline-flex; align-items:center; padding:6px 13px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--text); text-decoration:none; font-size:13px; }
.okna-tag:hover{ border-color:#c9d8f5; color:var(--blue); }
.okna-tag--extra{ display:none; }
.okna-tags-toggle{ display:none; }
.okna-tags-toggle:checked ~ .okna-tags-list .okna-tag--extra{ display:inline-flex; }
.okna-tags-toggle:checked ~ .okna-tags-more{ display:none; }
.okna-tags-more{ display:inline-block; margin-top:10px; color:var(--blue); cursor:pointer; font-size:13px; font-weight:600; }

/* ===== FAQ «показать ещё вопросы»: механика переехала в design.css (единый компонент .okna-faq) ===== */

/* ===== SEO-текст «читать полностью» (без клоакинга — CSS max-height) ===== */
.okna-seo-text{ margin:28px 0; }
/* Снять legacy-клип 170px (style.css:29 — старый блок-<div>) с НОВОЙ секции AI-рендера (<section class="okna-seo-text">).
   tag+class специфичнее голого .okna-seo-text → целит только <section>, старый <div class="okna-seo-text"> не трогает.
   Сворачиванием новой секции рулит .okna-st-body{max-height:--st-max} + кнопка .okna-st-btn ниже. */
section.okna-seo-text{ max-height:none; overflow:visible; }
.okna-seo-text h2{ margin:0 0 12px; }
.okna-st-toggle{ display:none; }
.okna-st-body{ max-height:var(--st-max,420px); overflow:hidden; position:relative;
  /* ★ W5-P05 добор (06.08): затухание свёрнутого текста делаем МАСКОЙ (в прозрачный),
     а НЕ белым ::after-оверлеем. Маска открывает реальный фон под блоком — подложку
     #eef1f6 на услугах, белую карточку на ценах, — и не зависит от подложки впредь.
     Прежний `background:linear-gradient(..., #fff)` давал белый прямоугольник на #eef1f6. */
  -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 90px), transparent);
          mask-image:linear-gradient(to bottom, #000 calc(100% - 90px), transparent); }
.okna-st-body > *:first-child{ margin-top:0; }
.okna-st-body::after{ content:none; } /* белый фейд-оверлей снят — теперь маска на самом блоке */
.okna-st-toggle:checked ~ .okna-st-body{ max-height:none; -webkit-mask-image:none; mask-image:none; }
.okna-st-body--open{ max-height:none; -webkit-mask-image:none; mask-image:none; }
.okna-st-btn{ display:inline-block; margin-top:12px; color:var(--blue); cursor:pointer; font-weight:700; font-size:14px; }
.okna-st-btn:hover{ color:var(--ink); }
.okna-st-btn::after{ content:attr(data-more) " ▾"; }
.okna-st-toggle:checked ~ .okna-st-btn::after{ content:attr(data-less) " ▴"; }
.okna-seo-text.is-short .okna-st-body{ max-height:none; -webkit-mask-image:none; mask-image:none; } /* ★ W5-P05 добор: короткий текст (весь виден) — маску тоже снять, иначе подрежет последние строки */
.okna-seo-text.is-short .okna-st-body::after{ display:none; }
.okna-seo-text.is-short .okna-st-btn{ display:none; }
/* ===== Оформление SEO-текста посадочной по эталону — ТОЛЬКО .okna-st-body (не глобально, ТЗ §17/§18).
   НЕ трогаем механизм сворачивания (587-609) и глобальный акцент h2 (.okna-seo-text h2::after, ~стр.1249).
   2026-08-02: типографика приведена к «05 Гайд по вёрстке.dc.html» (разделы 2, 7): проза #526173,
   маркированный список — синяя точка 7px #1c5bd6 (НЕ зелёная галочка), цитата — синий бар #1c5bd6
   + фон #f5f8fd + радиус только справа, контентная таблица — светлая шапка #eef3f9 + рамка-карточка. ===== */
.okna-st-body{ line-height:1.7; color:#526173; }
.okna-st-body p{ margin:0 0 18px; font-size:16.5px; line-height:1.7; color:#526173; }
/* GEO-TYPO fix: на гео/главной SEO-текст лежит и в .gv-seo, и в .okna-st-body — правило .gv-seo p (серый --muted)
   перебивало наследуемый тёмный цвет .okna-st-body и делало абзацы выцветшими. Возвращаем читаемый
   ИМЕННО для .okna-st-body внутри seo-блока (простой текст главной .gv-seo p не трогаем). */
.okna-seo-text .okna-st-body p,
.okna-seo-text .okna-st-body li{ color:#526173; font-size:16.5px; }
.okna-st-body > *:last-child{ margin-bottom:0; }
.okna-st-body strong{ font-weight:800; color:var(--ink,#123d87); }
.okna-st-body a{ color:var(--blue,#1c5bd6); font-weight:700; text-decoration:none; }
.okna-st-body a:hover{ text-decoration:underline; }
/* Заголовки: H2 оформляет ГЛОБАЛЬНАЯ система (.okna-seo-text h2 + красный ::after) — здесь только ритм-отступ.
   H3 в глобальную систему не входит → свой ink/800 + короткий красный акцент. */
/* ЕДИНЫЙ стиль заголовков ТЕЛА текста (h2 и h3) — везде одинаково (гео/услуги/блог/новости/главная):
   синий ink + короткая красная черта. Тело статьи может использовать h2 ИЛИ h3 — оба выглядят согласованно
   (h2 чуть крупнее). Секционный заголовок страницы (.okna-seo-text h2 / .gv-seo h2, вне .okna-st-body) — отдельная система. */
.okna-st-body h2{ margin:46px 0 16px; font-size:26px; font-weight:800; line-height:1.28; color:var(--ink,#123d87); position:relative; padding-bottom:10px; }
.okna-st-body h3{ margin:44px 0 14px; font-size:22px; font-weight:800; line-height:1.25; color:var(--ink,#123d87); position:relative; padding-bottom:10px; }
.okna-st-body h2::after,
.okna-st-body h3::after{ content:''; position:absolute; left:0; bottom:0; width:44px; height:3px; border-radius:999px; background:var(--red,#e0223a); }
.okna-st-body h2:first-child, .okna-st-body h3:first-child{ margin-top:0; }
/* Контентная таблица — по «05 Гайд» (раздел 7 «Таблица»): читается как мягкая карточка.
   Обёртка таблицы-как-карточки (border/radius/shadow) — на самой <table> (HTML из wp_editor не оборачиваем).
   Светлая шапка #eef3f9, th 800/#123d87, разделитель #d8e2f0, вертикальная сетка #dbe4f0/#eef1f6. */
.okna-st-body table{ width:100%; border-collapse:separate; border-spacing:0; margin:22px 0 36px; font-size:14.5px;
  min-width:480px; background:#fff; border:1px solid #e3e9f2; border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(20,40,80,.05); }
.okna-st-body th, .okna-st-body td{ border:0; border-right:1px solid #eef1f6; border-bottom:1px solid #e8ecf2; padding:14px 18px; text-align:left; vertical-align:top; line-height:1.55; }
.okna-st-body th:last-child, .okna-st-body td:last-child{ border-right:0; }
.okna-st-body thead tr{ background:#eef3f9; }
.okna-st-body thead th{ border-bottom:2px solid #d8e2f0; }
.okna-st-body th{ background:#eef3f9; color:var(--ink,#123d87); font-weight:800; font-size:14.5px; }
.okna-st-body tbody tr:nth-child(even) td{ background:#f5f8fd; }
.okna-st-body td:first-child, .okna-st-body th:first-child{ width:36%; color:var(--ink,#123d87); font-weight:700; }
/* Нумерованный список — по гайду: синий бейдж-кружок 26px (#eef3fc/#1c5bd6), без рамки-карточки */
.okna-st-body ol{ list-style:none; counter-reset:okstep; padding:0; margin:20px 0 28px; display:grid; gap:12px; }
.okna-st-body ol > li{ counter-increment:okstep; position:relative; margin:0; padding:0 0 0 40px; font-size:16.5px; line-height:1.55; color:#526173; }
.okna-st-body ol > li::before{ content:counter(okstep); position:absolute; left:0; top:0;
  width:26px; height:26px; border-radius:999px; background:var(--blue-soft,#eef3fc); color:var(--blue,#1c5bd6);
  font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; }
/* Маркированный список — по гайду: синяя точка 7px #1c5bd6 (НЕ зелёная галочка) */
.okna-st-body ul{ list-style:none; padding:0; margin:18px 0 26px; display:grid; gap:10px; }
.okna-st-body ul > li{ position:relative; margin:0; padding-left:24px; font-size:16.5px; line-height:1.55; color:#526173; }
.okna-st-body ul > li::before{ content:''; position:absolute; left:4px; top:.72em; width:7px; height:7px; border-radius:50%; background:var(--blue,#1c5bd6); }
/* Цитата — по гайду: синий левый бар #1c5bd6, фон #f5f8fd, радиус только справа, cite серый */
.okna-st-body blockquote{ margin:30px 0 36px; padding:16px 22px; background:#f5f8fd;
  border:0; border-left:3px solid var(--blue,#1c5bd6); border-radius:0 10px 10px 0; font-style:normal; color:#1d2433; font-size:16.5px; line-height:1.6; }
.okna-st-body blockquote > *:last-child{ margin-bottom:0; }
.okna-st-body blockquote p{ font-size:16.5px; line-height:1.6; color:#1d2433; }
.okna-st-body blockquote strong{ display:block; margin-bottom:6px; color:var(--ink,#123d87); font-weight:800; }
.okna-st-body blockquote cite{ display:block; margin-top:10px; font-size:13.5px; font-weight:700; color:#8a94a6; font-style:normal; }
/* Мобила: таблица скроллится внутри (без скролла страницы), отступы мягче */
@media(max-width:600px){
  .okna-st-body table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .okna-st-body th, .okna-st-body td{ padding:12px 14px; min-width:150px; }
  .okna-st-body td:first-child, .okna-st-body th:first-child{ width:auto; min-width:120px; }
  .okna-st-body ol > li{ padding-left:38px; }
}

/* ===== Верхние теги — навигация посадочной (отдельно от нижних «Похожие подборы») ===== */
/* Сквозная ПАРА «Быстрого подбора»: селектор + чипы как единый блок (отступы вместо двойных). */
.okna-podbor-pair{ margin:24px 0; }
.okna-podbor-pair .okna-qp{ margin:0 0 12px; }
.okna-podbor-pair .okna-top-tags{ margin:0; }
.okna-top-tags{ margin:14px 0 26px; padding:16px 18px; background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--ok-radius-card,16px); }
.okna-top-tags__head{ font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin:0 0 12px; }
.okna-top-tags .okna-tags-group{ margin:0 0 12px; }
.okna-top-tags .okna-tags-group:last-child{ margin-bottom:0; }
.okna-tag--active{ background:var(--ink); color:#fff; border-color:var(--ink); cursor:default; }
.okna-tag-badge{ font-style:normal; font-size:11px; background:var(--red); color:#fff; border-radius:4px; padding:1px 5px; margin-left:5px; }

/* Вводный текст посадочной (под H1) */
.okna-sf-intro{ font-size:17px; color:var(--muted); max-width:800px; margin:6px 0 18px; line-height:1.6; }

/* «Не нашли нужное стекло?» — компактный вариант под непустым листингом */
.okna-empty-order--compact{ padding:18px 22px; }
.okna-empty-order--compact h2{ font-size:20px; }

/* ===== Листинг: кнопки в ОДНУ полосу, «Заказать замену» в одну строку ===== */
.okna-card-actions{ gap:6px; }
.okna-card-actions .okna-btn{ white-space:nowrap; padding:9px 8px; font-size:13px; min-height:40px; }
.okna-card-actions .okna-order-btn{ flex:2; }
.okna-card-actions .okna-btn.secondary{ flex:1; }
/* ★ 2026-08-02 · МАКЕТ 06 (мобайл): карточка товара в листинге — radius 14,
   заголовок 12.5/700 #1d2433, кнопка 44/r8. Специфичность поднята префиксом
   html body (как в ok-home-w2), чтобы перебить .okna-card-actions .okna-btn{min-height:40}
   и body h3{font-size:19px !important} (okna-mobile.css:63). Scoped на .okna-catalog-grid:
   каталог, SEO-посадочные, «Другие стёкла». Витрина главной (.ok-showcase) — свой вид. */
@media (max-width:600px){
  .okna-catalog-grid .okna-card{ border-radius:14px; }
  html body .okna-catalog-grid .okna-card-body{ padding:10px 11px 12px; gap:6px; }
  html body .okna-catalog-grid .okna-card-body h3{
    font-size:12.5px !important;
    font-weight:700 !important;
    color:#1d2433 !important;
    line-height:1.35;
    /* ★ v3.1 §A2 обрыв: было min-height:52px = 3 СТРОКИ (комментарий «2 строки» врал; 12.5×1.35=16.875, ×3≈50.6).
       Заголовок «Стекло для автобуса … (лобовое)» уходил в 3 строки, т.к. -webkit-box line-clamp тут
       блокифицируется во flow-root и НЕ режет. Жёсткий кап 2 строки: min+max 33.75px (2×16.875) + overflow.
       Где -webkit-box работает (реальные браузеры) — многоточие в конце; иначе чистый срез 2-й строки.
       Пары выравниваются (обе 2 строки). */
    min-height:33.75px; max-height:33.75px; overflow:hidden;
  }
  html body .okna-catalog-grid .okna-card-chars{ font-size:12px; line-height:1.4; min-height:34px; }
  /* ★ Выравнивание по §21.6: артикул резервирует 2 строки (min-height), цена — фикс-высоту,
     чтобы строка цены и кнопка стартовали на одном уровне во всех карточках строки. */
  html body .okna-catalog-grid .okna-card-art{ font-size:11.5px; min-height:39px; line-height:1.4; }
  html body .okna-catalog-grid .okna-card-price{ font-size:14px; min-height:76px; }
  html body .okna-catalog-grid .okna-card-foot{ margin-top:auto; }
  html body .okna-catalog-grid .okna-card-actions{ gap:8px; padding-top:10px; }
  html body .okna-catalog-grid .okna-card-actions .okna-btn,
  html body .okna-catalog-grid .okna-card-actions .okna-tocart{
    min-height:44px !important;
    height:44px;
    border-radius:8px;
    font-size:13px;
    padding:9px 10px;
  }
  html body .okna-catalog-grid .okna-card-img{ border-radius:14px 14px 0 0; }
}
/* «Показать ещё» (AJAX) — по центру между листингом и пагинацией */
.okna-loadmore-wrap{ text-align:center; margin:22px 0 4px; }
.okna-loadmore{ min-width:220px; }

/* ===== Калькулятор веса: сообщения валидации / подпись / шутка ===== */
.okna-calc-onepiece{ font-size:12px; color:var(--muted); margin:4px 0 8px; }
.okna-calc-msg{ font-size:13px; margin-top:10px; line-height:1.5; }
.okna-calc-msg.is-error{ color:var(--red); }
.okna-calc-msg.is-warn{ color:#b8860b; }
.people.is-joke{ font-style:italic; }

/* ===== Калькулятор v2: подсветка полей, подсказки, фикс высоты ответа ===== */
.okna-field-hint{ display:block; font-size:11.5px; line-height:1.35; margin-top:4px; min-height:15px; color:var(--muted); }
.ctrl.okna-field-info{ border-color:#9cc0ff; }
.ctrl.okna-field-warn{ border-color:#d9a400; box-shadow:0 0 0 1px #d9a400 inset; }
.ctrl.okna-field-error{ border-color:var(--red); box-shadow:0 0 0 1px var(--red) inset; }
.ctrl.okna-field-info + .okna-field-hint{ color:var(--blue); }
.ctrl.okna-field-warn + .okna-field-hint{ color:#b8860b; }
.ctrl.okna-field-error + .okna-field-hint{ color:var(--red); }
/* блок ответа фиксированной высоты — не прыгает между сообщениями */
.okna-calc-answer{ min-height:210px; }
.okna-calc-msg ul{ margin:6px 0 0; padding-left:18px; }
.okna-calc-msg li{ margin:2px 0; }
.gv-calc-result .people:empty{ display:none; }

/* ===== Баннер акции под листингом (посадочные + каталог) ===== */
.okna-promo{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  border-radius:var(--ok-radius-card,16px); padding:22px 26px; margin:26px 0; }
.okna-promo__body{ flex:1 1 320px; }
.okna-promo__badge{ display:inline-block; font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
  padding:3px 10px; border-radius:999px; margin-bottom:8px; }
.okna-promo__title{ margin:0 0 6px; font-size:22px; }
.okna-promo__text{ margin:0; font-size:15px; color:var(--muted); }
.okna-promo__btn{ flex:0 0 auto; white-space:nowrap; }
.okna-promo--red_accent{ background:var(--blue-soft); border:1px solid #f3c9cf; }
.okna-promo--red_accent .okna-promo__badge{ background:var(--red); color:#fff; }
.okna-promo--blue{ background:var(--blue-soft); border:1px solid #cfe0fb; }
.okna-promo--blue .okna-promo__badge{ background:var(--blue); color:#fff; }
.okna-promo--dark{ background:var(--graphite); }
.okna-promo--dark .okna-promo__title{ color:#fff; } .okna-promo--dark .okna-promo__text{ color:var(--muted-d); }
.okna-promo--dark .okna-promo__badge{ background:var(--red); color:#fff; }
.okna-promo--light{ background:var(--bg-soft); border:1px solid var(--line); }
.okna-promo--light .okna-promo__badge{ background:var(--ink); color:#fff; }
/* Врезки в листинг (задел) — оформлены под карточку */
.okna-insert{ align-items:center; justify-content:center; text-align:center; }
.okna-insert--ad{ min-height:250px; display:flex; }

/* Акция: воздух от пагинации + картинка */
.okna-promo{ margin-top:40px; }
.okna-promo__img{ flex:0 0 auto; }
.okna-promo__img img{ display:block; max-width:170px; height:auto; border-radius:var(--ok-radius-dropdown,10px); }
@media (max-width:600px){ .okna-promo__img{ display:none; } }

/* Отступ от пагинации до баннера акции — выше по специфичности (перебивает прежнее правило), заметный воздух */
.okna-catalog .okna-promo, .okna-sf .okna-promo, .okna-usluga .okna-promo{ margin-top:48px; }
.okna-pagination{ margin-bottom:6px; }

/* Карточка товара: расширенные характеристики + взаимозаменяемость */
.okna-steklo-extra{ margin:24px 0; }
.okna-steklo-extra h2{ font-size:20px; margin:0 0 12px; }
.okna-steklo-compat{ margin:28px 0; }
.okna-steklo-compat h2{ font-size:20px; margin:0 0 14px; }

/* Витрины каталога */
.okna-showcase{ margin:8px 0; }
.okna-showcase__head{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0 0 16px; }
.okna-showcase__head h2{ margin:0; }
.okna-showcase__all{ flex:0 0 auto; }

/* Логотип в шапке (SVG, пропорции viewBox 1600×700) */
.okna-brand-logo{ display:block; height:60px; width:auto; }   /* подрезанный SVG, ширина ~261px */
@media (max-width:600px){ .okna-brand-logo{ height:46px; } }
/* Раскладка шапки: логотип слева | меню справа (прижато к телефонам) | телефоны+«Заявка» у правого края.
   Меню в одной группе с действиями и прижато к ним; слева между логотипом и меню — свободный запас. */
.okna-header-inner{ flex-wrap:nowrap; align-items:center; gap:24px; }
.okna-brand{ flex:0 0 auto; min-width:0; }                /* логотип — как есть */

/* nav растягивается и толкает меню вправо, к телефонам */
.okna-header .okna-nav{ flex:1 1 auto; min-width:0; position:static; transform:none; display:flex; }
.okna-header .okna-nav .okna-menu{ width:100%; justify-content:flex-end; flex-wrap:nowrap; gap:2px; }

/* телефоны + кнопка — у правого края, рядом с меню */
.okna-header-actions{ flex:0 0 auto; margin-left:0; }

@media (max-width:1024px){ /* среднее — меню жмётся, но остаётся в строке */
  .okna-header .okna-nav .okna-menu > li > a{ padding:8px 9px; font-size:14px; }
}
@media (max-width:1024px){ /* узко — меню уходит в свою строку под логотип/телефоны, не наезжает */
  .okna-header-inner{ flex-wrap:wrap; }
  .okna-header .okna-nav{ flex:1 1 100%; order:3; }
  .okna-header .okna-nav .okna-menu{ flex-wrap:wrap; justify-content:flex-start; }
}

/* Врезка «свой блок»: картинка реальным <img> (object-fit), клампинг текста, законченный вид */
/* как обычная карточка товара: дети на всю ширину (перебить .okna-insert{align-items:center}) */
.okna-insert--own{ align-items:stretch; text-align:left; }
.okna-insert--own .okna-card-img{ height:158px; width:auto; align-self:stretch; }
.okna-insert__img{ padding:0; overflow:hidden; }
.okna-insert__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.okna-insert__tag{ display:inline-block; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--red); margin:0 0 6px; }
.okna-insert__text{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* === Центрирование шапки (фикс «уехала влево») === */
.okna-header{ display:flex !important; justify-content:center !important; width:100%; }
.okna-header > .okna-header-inner{ width:100%; max-width:1280px; margin:0; }

/* ============================================================
   ФИНАЛЬНЫЙ ФИКС ШАПКИ — перекрывает все предыдущие слои.
   Цель: контейнер по центру экрана, логотип слева, меню справа
   у телефонов, «Заявка» у правого края. Логотип крупный.
   ============================================================ */

/* 1. .okna-header — на всю ширину экрана, центрирует своё содержимое.
   ВАЖНО: max-width:none !important — снимает ограничение ширины контента темы
   Twenty Twenty-One (alignwide 1240px), из-за которого шапка липла влево. */
.okna-header{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:var(--bg);
  border-bottom:1px solid var(--line);
}

/* 2. .okna-header-inner — фиксированная макс-ширина, центр через margin:auto */
.okna-header > .okna-header-inner{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:1280px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:clamp(16px,2.5vw,32px) !important;
  padding-right:clamp(16px,2.5vw,32px) !important;
  min-height:92px !important;
  display:flex !important;
  align-items:center !important;
  gap:clamp(12px,1.5vw,24px) !important;
  flex-wrap:nowrap !important;
  position:relative !important;
}

/* 3. логотип слева, КРУПНЫЙ */
.okna-header .okna-brand{ flex:0 0 auto !important; }
.okna-header .okna-brand-logo{
  display:block !important;
  height:64px !important;
  width:auto !important;
  max-width:none !important;
}

/* 4. меню растягивается и прижимается ВПРАВО, к телефонам */
.okna-header .okna-nav{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:flex !important;
  justify-content:flex-end !important;
  position:static !important;
  transform:none !important;
}
.okna-header .okna-nav .okna-menu{
  width:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
  gap:2px !important;
}

/* 5. телефоны + «Заявка» у правого края */
.okna-header .okna-header-actions{ flex:0 0 auto !important; margin-left:0 !important; }

/* 6. мега-панель «Каталог» — открывается от своего пункта, не уезжает */
.okna-header .okna-mega-panel{ left:0 !important; right:auto !important; }

/* 7. узкие экраны — меню в свою строку, не наезжает */
@media (max-width:1024px){
  .okna-header > .okna-header-inner{ flex-wrap:wrap !important; }
  .okna-header .okna-nav{ flex:1 1 100% !important; order:3 !important; justify-content:flex-start !important; }
  .okna-header .okna-nav .okna-menu{ flex-wrap:wrap !important; justify-content:flex-start !important; }
  .okna-header .okna-brand-logo{ height:52px !important; }
}

/* === Логотип: крупный знак + текст шрифтом сайта === */
.okna-header .okna-brand{ display:flex !important; align-items:center !important; gap:12px !important; text-decoration:none !important; }
.okna-header .okna-brand-mark{ display:block !important; height:76px !important; width:auto !important; max-width:none !important; }   /* было 84px → −8% */
.okna-header .okna-brand-text{ display:flex; flex-direction:column; line-height:1.04; }
.okna-header .okna-brand-l1,
.okna-header .okna-brand-l2{
  font-family:'Manrope',system-ui,sans-serif;
  font-weight:800; font-size:22px; letter-spacing:.01em; color:#0B397F; text-transform:uppercase;
}
@media (max-width:1024px){
  .okna-header .okna-brand-mark{ height:58px !important; }   /* было 64px → −8% */
  .okna-header .okna-brand-l1, .okna-header .okna-brand-l2{ font-size:18px; }
}
@media (max-width:600px){
  .okna-header .okna-brand-text{ display:none; } /* на мобильном — только знак */
  .okna-header .okna-brand-mark{ height:48px !important; }   /* было 52px → −8% */
}

/* === «Каталог» — отдельно, у логотипа слева === */
/* width:100% — меню заполняет всю зону, чтобы внутри было свободное место;
   только тогда margin-right:auto у «Каталога» (ниже) отталкивает остальные пункты вправо. */
.okna-header .okna-nav .okna-menu{ width:100% !important; justify-content:flex-end !important; }
/* Меню сокращено до 4 пунктов → возвращаем нормальный размер; свободно помещается,
   margin-right:auto у «Каталога» (ниже) толкает остальные пункты вправо к телефонам. */
.okna-header .okna-nav .okna-menu > li > a{ padding:9px 12px !important; font-size:15px !important; }
/* Каталог (первый пункт, .okna-mega) выталкиваем в левый край меню-зоны,
   остальные пункты прижимаются вправо за счёт авто-margin справа от Каталога */
.okna-header .okna-nav .okna-menu > li.okna-mega{ margin-right:auto !important; }

/* === Акцентные кнопки шапки: единая высота, текст в одну строку === */
.okna-header .okna-menu > li.okna-mega > a,
.okna-header .okna-hdr-cta{
  height:42px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 18px !important;          /* высота задаётся height, не паддингом — не квадрат */
  white-space:nowrap !important;       /* текст НИКОГДА не в две строки */
  border-radius:var(--ok-radius-btn,4px) !important;
  line-height:1 !important;
}
/* текст не влезает → кнопка расширяется (за счёт inline-flex + nowrap + padding по бокам),
   НЕ становится двухэтажной и НЕ квадратной */

/* Общее правило: ВСЕ кнопки шапки — текст в одну строку (не влезает → шире, не двухэтажная) */
.okna-header .okna-btn,
.okna-header .okna-menu > li > a{ white-space:nowrap !important; }

/* === Кнопки шапки по палитре: Каталог=Бледная(контур), Запросить цену=Синяя === */
/* Каталог стёкол — БЛЕДНАЯ (контур). box-sizing:border-box — чтобы контур 2px не сбил высоту 42px. */
/* Каталог стёкол — ЗАЛИТАЯ синяя кнопка с иконкой (название/иконка — из «Меню и шапка») */
.okna-header .okna-menu > li.okna-mega > a{
  display:inline-flex !important; align-items:center !important; gap:8px !important;
  background:#1c5bd6 !important;
  color:#fff !important;
  border:1px solid #1c5bd6 !important;
  box-sizing:border-box !important;
  font-weight:700 !important;
}
.okna-header .okna-menu > li.okna-mega > a .okna-cat-trigger__ic{ display:inline-flex; align-items:center; }
.okna-header .okna-menu > li.okna-mega > a svg{ width:16px; height:16px; display:block; }
/* HOVER — инверсия (белый фон + синий текст); НАЖАТИЕ — потемнение(ink)+вдавливание; ОТКРЫТО — ink; ФОКУС — обводка */
.okna-header .okna-menu > li.okna-mega > a:hover{ background:#fff !important; color:#1c5bd6 !important; border-color:#1c5bd6 !important; }
.okna-header .okna-menu > li.okna-mega > a:active{ background:var(--ink,#123d87) !important; color:#fff !important; border-color:var(--ink,#123d87) !important; transform:translateY(1px); }
.okna-header .okna-menu > li.okna-mega.okna-open > a{ background:var(--ink,#123d87) !important; color:#fff !important; border-color:var(--ink,#123d87) !important; }
/* ОТКРЫТО главнее HOVER: при открытом меню курсор стоит на кнопке (иначе её не открыть наведением) — :hover не должен
   белить кнопку. .okna-open > a:hover/:active = (0,5,2) — выше обычного :hover (0,4,2), и ниже по файлу → тёмная при наведении. */
.okna-header .okna-menu > li.okna-mega.okna-open > a:hover,
.okna-header .okna-menu > li.okna-mega.okna-open > a:active{ background:var(--ink,#123d87) !important; color:#fff !important; border-color:var(--ink,#123d87) !important; }
.okna-header .okna-menu > li.okna-mega > a:focus-visible{ outline:2px solid #1c5bd6; outline-offset:2px; }
/* Запросить цену — СИНЯЯ; рамка в цвет фона (не видна), чтобы при hover не «прыгала» */
.okna-header .okna-hdr-cta{
  background:#1c5bd6 !important;
  color:#fff !important;
  border:1px solid #1c5bd6 !important;
}
/* единый паттерн: HOVER — инверсия; ACTIVE — потемнение+вдавливание; FOCUS — обводка */
.okna-header .okna-hdr-cta:hover{ background:#fff !important; color:var(--blue,#1c5bd6) !important; border:1px solid var(--blue,#1c5bd6) !important; }
.okna-header .okna-hdr-cta:active{ background:var(--ink,#123d87) !important; color:#fff !important; border-color:var(--ink,#123d87) !important; transform:translateY(1px); }
.okna-header .okna-hdr-cta:focus-visible{ outline:2px solid var(--blue,#1c5bd6); outline-offset:2px; }

/* === Контакты шапки: телефоны (номер + подпись курсивом) + почта; из настроек === */
/* блок контактов выровнен по вертикали по центру относительно кнопки «Запросить цену» */
.okna-header .okna-header-actions{ align-items:center !important; }
.okna-header .okna-header-contacts{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.okna-header .okna-header-phones{ display:flex; flex-direction:column; align-items:stretch; gap:5px; }
/* строка телефона: [иконка][текст] — значки трубок строго друг под другом (общая левая вертикаль) */
.okna-header .okna-hdr-phone{ display:grid !important; grid-template-columns:18px auto; column-gap:8px; align-items:center; text-decoration:none; }
.okna-header .okna-header-contacts .okna-ph-ic{ width:18px; height:18px; color:var(--blue); flex:0 0 auto; }
.okna-header .okna-hdr-phone-text{ display:flex; flex-direction:column; line-height:1.08; text-align:left; }
/* номер — табличные цифры (правый край номеров ровный при равной длине) */
.okna-header .okna-hdr-phone-num{ font-size:15px; font-weight:700; color:#1C2433; white-space:nowrap; font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; }
.okna-header .okna-hdr-phone:hover .okna-hdr-phone-num{ color:var(--blue); }
/* подпись — курсив, мельче номера, приглушённый */
.okna-header .okna-hdr-phone-label{ font-size:11px; font-style:italic; color:var(--muted); white-space:nowrap; line-height:1.1; }
/* почта — синяя ссылка (тип «ссылка» из палитры), иконка-конверт ровно под трубками */
.okna-header .okna-hdr-email{ display:grid; grid-template-columns:18px auto; column-gap:8px; align-items:center; text-decoration:none; color:var(--blue); font-size:13px; }
.okna-header .okna-hdr-email-text{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px; white-space:nowrap; }
.okna-header .okna-hdr-email:hover .okna-hdr-email-text{ color:#1448aa; }
@media (max-width:1024px){
  .okna-header .okna-hdr-phone-num{ font-size:14px; }
  .okna-header .okna-hdr-email{ font-size:12px; }
}

/* ============================================================
   ДВУХУРОВНЕВАЯ ЛИПКАЯ ШАПКА: топбар (город+контакты) + sticky-сжатие
   ============================================================ */

/* Шапка целиком — липкая, на всю ширину, контент стопкой (топбар над основной) */
.okna-header{ position:sticky !important; top:0 !important; z-index:1000 !important; background:#fff; transition:box-shadow .2s; }

/* Выравнивание правой вертикали: у кнопки шапки убираем правый margin (наследуется из базового
   .okna-btn → margin:4px 8px 4px 0), из-за которого CTA не дотягивалась до правого края контента
   на 8px, а контакты топбара дотягивались → казалось, что топбар «шире». Теперь правый край CTA
   совпадает с правым краем контактов топбара (общая правая вертикаль = край контента 1280-сетки). */
.okna-header .okna-hdr-cta{ margin:0 !important; }

/* --- ТОПБАР --- (схлопывается плавно по max-height/opacity, без display:none).
   topbar-inner повторяет сетку header-inner 1:1 (max-width 1280, margin auto, padding clamp(16,2.5vw,32)),
   поэтому правый/левый края топбара и основной шапки всегда совпадают, в т.ч. на адаптиве. */
.okna-topbar{ background:#f4f7fb; border-bottom:1px solid var(--line,#e6ebf2); font-size:13px; width:100%;
  overflow:hidden; max-height:48px; opacity:1;
  transition:max-height .25s ease, opacity .2s ease, border-color .25s ease; }
.okna-topbar-inner{ max-width:1280px; margin:0 auto; padding:7px clamp(16px,2.5vw,32px);
  display:flex; align-items:center; justify-content:space-between; gap:16px; box-sizing:border-box;
  transition:padding .25s ease; }
.okna-city{ background:none; border:none; cursor:default; color:var(--ink,#1e2430); font:inherit;
  display:inline-flex; align-items:center; gap:6px; padding:0; }
.okna-city strong{ font-weight:700; }
.okna-topbar-contacts{ display:flex; align-items:center; gap:22px; }
/* телефоны в топбаре — В СТРОЧКУ (перебить grid из блока контактов), подписи прячем */
.okna-header .okna-topbar-contacts .okna-header-phones{ flex-direction:row; align-items:center; gap:22px; }
.okna-header .okna-topbar-contacts .okna-hdr-phone{ display:inline-flex !important; align-items:center; gap:6px; white-space:nowrap; }
.okna-header .okna-topbar-contacts .okna-hdr-phone-text{ display:inline; line-height:normal; }
.okna-header .okna-topbar-contacts .okna-hdr-phone-label{ display:none !important; } /* подписи в строчке прячем */
.okna-header .okna-topbar-contacts .okna-hdr-phone-num{ font-size:13px; font-variant-numeric:tabular-nums; }
.okna-header .okna-topbar-contacts .okna-ph-ic{ width:15px; height:15px; }
.okna-header .okna-topbar-contacts .okna-hdr-email{ display:inline-flex !important; align-items:center; gap:6px; color:#1c5bd6; font-size:13px; grid-template-columns:none; }

/* компактный телефон в основной шапке: по умолчанию СКРЫТ; показывается только в sticky */
.okna-header .okna-hdr-phone--compact{ display:none !important; align-items:center; gap:6px; white-space:nowrap; margin-right:14px;
  grid-template-columns:none; font-weight:700; color:#1C2433; text-decoration:none; }
.okna-header .okna-hdr-phone--compact .okna-hdr-phone-num{ font-size:15px; font-variant-numeric:tabular-nums; }

/* --- STICKY-СЖАТИЕ (класс okna-scrolled на body) --- */
/* топбар схлопывается плавно: высота→0, прозрачность→0, паддинги→0 (display НЕ трогаем — он не анимируется) */
.okna-scrolled .okna-header .okna-topbar{ max-height:0; opacity:0; border-bottom-color:transparent; }
.okna-scrolled .okna-header .okna-topbar-inner{ padding-top:0 !important; padding-bottom:0 !important; }
.okna-scrolled .okna-header > .okna-header-inner{ min-height:60px !important; }      /* шапка ниже */
.okna-scrolled .okna-header .okna-brand-mark{ height:42px !important; }              /* логотип меньше */
.okna-scrolled .okna-header .okna-brand-l1,
.okna-scrolled .okna-header .okna-brand-l2{ font-size:13px !important; }
.okna-scrolled .okna-header{ box-shadow:0 2px 10px rgba(0,0,0,.07); }
.okna-scrolled .okna-header .okna-nav .okna-menu > li > a{ padding:7px 9px !important; }
.okna-scrolled .okna-header .okna-menu > li.okna-mega > a,
.okna-scrolled .okna-header .okna-hdr-cta{ height:34px !important; }                 /* кнопки компактнее */
.okna-scrolled .okna-header .okna-hdr-phone--compact{ display:inline-flex !important; } /* показать 1 телефон */

/* --- ПЛАВНЫЕ ПЕРЕХОДЫ большая⇄компактная (анимируются в ОБЕ стороны, ~0.25с) --- */
.okna-header > .okna-header-inner{ transition:min-height .25s ease, padding .25s ease; }
.okna-header .okna-brand-mark{ transition:height .25s ease; }
.okna-header .okna-brand-l1,
.okna-header .okna-brand-l2{ transition:font-size .25s ease; }
.okna-header .okna-nav .okna-menu > li > a{ transition:padding .25s ease, transform .1s ease, background .15s ease, color .15s ease; }
.okna-header .okna-menu > li.okna-mega > a,
.okna-header .okna-hdr-cta{ transition:height .25s ease, padding .25s ease, background .15s ease, color .15s ease, transform .1s ease; }
.okna-header{ transition:box-shadow .25s ease !important; }
.okna-header .okna-hdr-phone--compact{ transition:opacity .25s ease; }

/* === Логотип — НЕ текстовая ссылка: убираем подчёркивание во всех состояниях === */
/* (перекрывает дефолт a{text-decoration:underline} родительской темы и любые ссылочные правила) */
.okna-header .okna-brand,
.okna-header .okna-brand:hover,
.okna-header .okna-brand:focus{
  text-decoration:none !important;
}
.okna-header .okna-brand .okna-brand-l1,
.okna-header .okna-brand .okna-brand-l2{
  text-decoration:none !important;
}

/* === Доделка A: сортировка каталога + второй вид листинга «витрина-замена» (горизонтальный список) === */
.okna-filters .okna-sort select{ min-width:170px; }
.okna-sf-sort{ display:flex; align-items:flex-end; gap:12px; margin:0 0 14px; }
.okna-reset-sort{ white-space:nowrap; }

/* ПЕРЕКЛЮЧАТЕЛЬ ВИДА ЛИСТИНГА (плитка/список) — один листинг, переключение CSS-классом, дефолт плитка */
.okna-listing-head{ display:flex; justify-content:flex-end; margin:0 0 14px; }
.okna-view-toggle{ display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
/* !important — перебиваем дефолтный тёмный фон <button> темы Twenty Twenty-One (грузится после glavnaya.css) */
.okna-view-toggle .okna-view-btn{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:34px; background:#fff !important; border:0 !important; box-shadow:none !important; cursor:pointer; color:var(--muted) !important; padding:0; }
.okna-view-btn + .okna-view-btn{ border-left:1px solid var(--line); }
.okna-view-btn svg{ fill:currentColor; }
.okna-view-toggle .okna-view-btn:hover{ color:#1c5bd6 !important; }
.okna-view-toggle .okna-view-btn.is-active{ background:#1c5bd6 !important; color:#fff !important; }
/* Вид СПИСОК: те же карточки строками (изображение слева, данные справа) */
.okna-listing.is-list .okna-catalog-grid{ display:flex; flex-direction:column; gap:12px; }
.okna-listing.is-list .okna-card{ flex-direction:row; align-items:stretch; width:100%; max-width:none; }
.okna-listing.is-list .okna-card-img{ width:170px; min-width:170px; flex:0 0 170px; aspect-ratio:1/1; height:auto; min-height:0; border-radius:10px 0 0 10px; }
.okna-listing.is-list .okna-card-body{ flex:1 1 auto; }
.okna-listing.is-list .okna-card-actions{ margin-top:auto; }
@media (max-width:600px){
  .okna-listing.is-list .okna-card{ flex-direction:column; }
  .okna-listing.is-list .okna-card-img{ width:100%; min-width:0; flex:none; border-radius:10px 10px 0 0; }
}

/* ============================================================
   Сквозной блок-навигатор каталога «Каталог по марке» (вид «Быстрый подбор»)
   ============================================================ */
.okna-catalog-nav{ margin:0 0 22px; }
.okna-catalog-nav .okna-tag-count{ font-style:normal; font-size:.78em; line-height:1; margin-left:6px; background:#eef3fb; color:var(--blue); border-radius:999px; padding:2px 7px; font-weight:600; }
.okna-catalog-nav .okna-tag{ padding:7px 14px; }
.okna-catalog-nav .okna-tag:hover .okna-tag-count{ background:#dde8fb; }
/* сворачивание ТОЛЬКО марок внутри страны — ПО ШИРИНЕ (один ряд), без жёсткого числа */
.okna-catalog-nav .okna-cn-list{ max-height:44px; overflow:hidden; transition:max-height .28s ease; }
.okna-catalog-nav .okna-cn-toggle{ position:absolute; opacity:0; pointer-events:none; }
.okna-catalog-nav .okna-cn-toggle:checked ~ .okna-cn-list{ max-height:1200px; }
/* «Показать ещё»: по умолчанию видна (работает без JS); JS прячет, если марки влезли в один ряд */
.okna-catalog-nav .okna-cn-more{ display:inline-block; cursor:pointer; margin-top:6px; }
.okna-catalog-nav .okna-cn-group.okna-cn-fits .okna-cn-more{ display:none; }
.okna-catalog-nav .okna-cn-more::after{ content:attr(data-more); }
.okna-catalog-nav .okna-cn-toggle:checked ~ .okna-cn-more::after{ content:attr(data-less); }

/* ============================================================
   H1 каталога/посадочных — «божеский» размер ~40px (был гигантский) + адаптив
   ============================================================ */
.okna-usluga h1,
.okna-sf h1{ font-size:clamp(26px, 4vw, 40px) !important; line-height:1.16; letter-spacing:-.01em; margin:0 0 14px; }

/* ============================================================
   Хлебные крошки — привязать к сетке контента (1080px, центр), а не во всю ширину
   ============================================================ */
.okna-crumbs{ max-width:calc(var(--okna-cw) + 80px); margin-left:auto !important; margin-right:auto !important;
  padding-left:40px; padding-right:40px; box-sizing:border-box; width:100%; }

/* ============================================================
   Сброс вертикального ритма Twenty Twenty-One на ВНУТРЕННИХ страницах.
   Тема вешает на всех прямых детей <main>: .site-main > * { margin-top:90px }
   (+ .site-main > *:first-child{margin-top:0}). Обёртка контента — ВТОРОЙ ребёнок
   после <nav.okna-crumbs> и получала 90px пустоты под крошками.

   ВАЖНО (почему прежний сброс не сработал): дочерняя тема ПОВТОРНО подключает
   twentytwentyone/style.css ПОСЛЕ glavnaya.css (link поз.8 vs поз.6). При равной
   специфичности ТТ1 выигрывает по порядку. Поэтому повышаем специфичность через
   body:not(.home):not(.single-steklo) (0,3,1) — перебивает и .site-main > * (0,1,0),
   и .site-main > *:first-child (0,2,0) НЕЗАВИСИМО от порядка подключения. Без !important.
   Главная (.home) и карточка (.single-steklo, свои правила в single.css) исключены.
   ============================================================ */
body:not(.home):not(.single-steklo) .site-main > *{ margin-top:0; }
/* Компактно (владелец 16.07): было 18/14 → вместе с padding крошек и обёрткой темы
   набегало 128px от шапки до контента ради одной строки. Сжато, воздух сохранён. */
body:not(.home):not(.single-steklo) .okna-crumbs{ margin-top:6px; margin-bottom:8px; }
/* Обёртка темы над крошками: .site-main{padding:30px 0 0} — на внутренних это чистое
   пустое место сверху (шапка и так отделена). Убираем — экран не воруем. */
body:not(.home):not(.single-steklo) .site-main{ padding-top:0; }

/* ============================================================
   ЛИСТИНГ — причёска (hover, врезки 1:1, список, фильтр по кнопке + поля). Логику не трогаем.
   ============================================================ */
/* 1. HOVER карточек: accent-рамка + тень, БЕЗ выцветания/opacity; контент читаем */
.okna-catalog-grid .okna-card,.okna-listing .okna-card{ transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.okna-catalog-grid .okna-card:hover,.okna-listing .okna-card:hover{ border-color:#1c5bd6; box-shadow:0 10px 28px rgba(28,91,214,.16); transform:translateY(-3px); }
.okna-card-link:hover,.okna-card-link:focus,.okna-card-link:active{ background:transparent !important; }
/* кнопки карточки — цвет/hover/active из design.css (единая база). Здесь ниже — только геометрия. */

/* 2. ВРЕЗКИ/АКЦИИ: картинка СТРОГО 1:1 (img absolute, чтобы натуральная высота картинки не делала прямоугольник) */
.okna-catalog-grid .okna-insert{ position:relative; display:flex; flex-direction:column; overflow:hidden; padding:0; }
.okna-insert__img{ position:relative; width:100%; aspect-ratio:1/1 !important; height:auto !important; min-height:0; overflow:hidden; background:#eef3fc; }
.okna-insert__img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* 3. СПИСОК: кнопки компактные СПРАВА, по НИЖНЕЙ строке КОНТЕНТА (цена/выезд), а не у подвала карточки */
.okna-listing.is-list .okna-card-body{ position:relative; padding-right:268px; display:block; }
.okna-listing.is-list .okna-card-actions{ position:absolute; right:16px; bottom:16px; margin:0; justify-content:flex-end; gap:10px; width:auto; }
.okna-listing.is-list .okna-card-actions .okna-btn{ flex:0 0 auto; min-width:0; width:auto; padding:9px 20px; }
.okna-listing.is-list .okna-insert__img{ width:182px; min-width:182px; flex:0 0 182px; height:182px; aspect-ratio:auto; align-self:flex-start; border-radius:12px 0 0 12px; }
@media(max-width:600px){
  .okna-listing.is-list .okna-card-body{ padding-right:0; }
  .okna-listing.is-list .okna-card-actions{ position:static; justify-content:stretch; margin-top:12px; }
  .okna-listing.is-list .okna-card-actions .okna-btn{ flex:1 1 auto; }
}

/* 4. ФИЛЬТР по кнопке (скрыт по умолчанию) */
.okna-filterbox{ margin:0 0 6px; position:relative; }
.okna-filter-toggle{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid #dbe4f0; border-radius:10px; padding:9px 16px; font-family:'Manrope',system-ui,sans-serif; font-size:14px; font-weight:700; color:#123d87; cursor:pointer; line-height:1.2; }
.okna-filter-toggle:hover{ border-color:#1c5bd6; color:#1c5bd6; }
.okna-filter-toggle svg{ width:17px; height:17px; }
.okna-filter-badge{ background:#1c5bd6; color:#fff; border-radius:999px; font-size:12px; padding:1px 7px; min-width:18px; text-align:center; }
.okna-filters[hidden]{ display:none !important; }
.okna-filters{ margin-top:10px; border:1px solid var(--line,#e8ecf2); border-radius:14px; background:var(--bg-soft,#f6f8fb); }

/* 5. ПОЛЯ фильтра под дизайн-гайд (как поиск селектора) */
.okna-filters select,.okna-filters input[type=search],.okna-filters input[type=text],.okna-filters input:not([type=hidden]){
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  border:1px solid #dbe4f0 !important; border-radius:var(--ok-radius-field,8px) !important; background-color:#fff !important; /* Волна 1-бис: фильтр-бар 9px→8 (роль фильтра; search-тип здесь в контексте фильтра, не хедер-поиск) */
  padding:8px 32px 8px 12px; min-height:40px; font-family:'Manrope',system-ui,sans-serif; font-size:14px;
  color:var(--text,#1c2433); outline:none !important; box-shadow:none !important;
}
.okna-filters select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='none' stroke='%236b7686' stroke-width='1.6' d='M1 1.5 6 6l5-4.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; cursor:pointer;
}
.okna-filters select:focus,.okna-filters input:focus{ border-color:#1c5bd6 !important; box-shadow:0 0 0 3px rgba(28,91,214,.14) !important; }
.okna-filters .okna-filter-actions .okna-btn{ border-radius:10px !important; min-height:40px; } /* геометрия; цвет/hover — из design.css */
/* Панель фильтра: «Показать» компактная кнопка + сбросы = текст-ссылки (не полноразмерные). Ряд по центру. */
.okna-filter-actions{ display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; margin-top:6px; }
.okna-filter-reset{ font-size:14px !important; }
/* кнопка «Фильтр» — белая по дизайну (перебиваем тёмную кнопку темы) */
.okna-filterbox .okna-filter-toggle{ background:#fff !important; color:#123d87 !important; border:1px solid #dbe4f0 !important; box-shadow:none !important; }
.okna-filterbox .okna-filter-toggle:hover,.okna-filterbox .okna-filter-toggle[aria-expanded="true"]{ border-color:#1c5bd6 !important; color:#1c5bd6 !important; }

/* ============================================================
   ЛИСТИНГ — доработка (otchet_listing_polish2): квадрат в списке, читаемые кнопки, заметный hover, акция вровень
   ============================================================ */
/* 1. СПИСОК: картинка СТРОГО квадрат (align-self:flex-start отменяет растяжение по высоте строки) */
.okna-listing.is-list .okna-card-img{
  width:182px !important; min-width:182px !important; max-width:182px; flex:0 0 182px !important;
  height:182px !important; aspect-ratio:auto !important; align-self:flex-start !important;
  border-radius:12px 0 0 12px; overflow:hidden;
}
/* и фото, и заглушка-картинка — cover по центру (заглушка теперь полноценная картинка, не контур) */
.okna-listing.is-list .okna-card-img{ background-size:cover !important; background-position:center !important; }
@media(max-width:600px){
  .okna-listing.is-list .okna-card-img{ width:100% !important; max-width:none; min-width:0 !important;
    height:auto !important; aspect-ratio:1/1 !important; flex:none !important; border-radius:12px 12px 0 0; align-self:auto !important; }
}

/* 2. (Кнопки hover — перенесено в ЕДИНУЮ ИНВЕРСИЮ в конце файла) */

/* 3. HOVER/ACTIVE карточки — заметно, но без выцветания (плитка и список) */
.okna-catalog-grid .okna-card,.okna-listing .okna-card{ cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.okna-catalog-grid .okna-card:hover,.okna-listing .okna-card:hover{
  transform:translateY(-3px) !important; box-shadow:0 6px 20px rgba(18,61,135,.14) !important; border-color:#1c5bd6 !important;
}
.okna-catalog-grid .okna-card:active,.okna-listing .okna-card:active{
  transform:translateY(-1px) !important; box-shadow:0 3px 12px rgba(18,61,135,.12) !important;
}

/* 4. Карточка-акция/врезка — вровень по высоте с товарами (тянется до низа ряда, кнопка внизу) */
.okna-catalog-grid{ align-items:stretch; }
.okna-catalog-grid .okna-insert{ height:100%; }
.okna-catalog-grid .okna-insert .okna-card-body{ flex:1 1 auto; display:flex; flex-direction:column; }
.okna-catalog-grid .okna-insert .okna-card-actions{ margin-top:auto; }

/* ИНВЕРСИЯ кнопок .okna-btn — теперь ОДИН источник в design.css (частные правила снесены).
   Кнопка «Фильтр» (toggle) — не .okna-btn, своя инверсия ниже. */
.okna-filterbox .okna-filter-toggle:hover,.okna-filterbox .okna-filter-toggle:focus,.okna-filterbox .okna-filter-toggle[aria-expanded="true"]{
  background:#1c5bd6 !important; color:#fff !important; border-color:#1c5bd6 !important;
}
.okna-filterbox .okna-filter-toggle:hover svg,.okna-filterbox .okna-filter-toggle[aria-expanded="true"] svg{ color:#fff; }

/* ============================================================
   ПРАВКА 5: шапка листинга в ОДНУ линию — [Заголовок · Найдено] .... [Фильтр] [плитка/список]
   ============================================================ */
.okna-cat-head{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin:0 0 16px; }
.okna-cat-head__l{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; min-width:0; }
.okna-cat-head__l h2{ margin:0; }
.okna-cat-head__l .okna-catalog-count{ margin:0; color:var(--muted,#6b7686); font-size:14px; font-weight:600; white-space:nowrap; }
.okna-cat-head__r{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
/* форма фильтра раскрывается ПОЛНОЙ шириной ПОД шапкой (а не в узкой правой ячейке) */
.okna-cat-head .okna-filterbox{ position:static; margin:0; }
.okna-cat-head .okna-filters{ position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:30; margin-top:0; }
@media(max-width:768px){
  .okna-cat-head__l{ flex:1 1 100%; }
  .okna-cat-head__r{ width:100%; justify-content:flex-start; }
}

/* ============ Светлое ПУСТОЕ состояние каталога (нет позиций по фильтру) — общий стиль: марка + витрина ============ */
.okna-catalog-empty{ display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  background:#fff; border:1px solid #dbe4f0; border-radius:16px; padding:22px 26px; margin:16px 0 26px; }
.okna-catalog-empty__ic{ flex:0 0 auto; width:52px; height:52px; border-radius:50%;
  background:#eef3fc; color:#1c5bd6; display:flex; align-items:center; justify-content:center; }
.okna-catalog-empty__body{ flex:1 1 320px; min-width:240px; }
.okna-catalog-empty__title{ font-size:18px; font-weight:800; color:#123d87; margin:0 0 4px; }
.okna-catalog-empty__sub{ margin:0; color:#526173; font-size:14px; line-height:1.5; max-width:560px; }
.okna-catalog-empty__act{ display:flex; gap:10px; flex-wrap:wrap; flex:0 0 auto; }
@media(max-width:768px){
  .okna-catalog-empty{ align-items:flex-start; }
  .okna-catalog-empty__act{ width:100%; }
  .okna-catalog-empty__act .okna-btn{ flex:1 1 auto; text-align:center; justify-content:center; }
}

/* ============================================================
   ЕДИНЫЙ СТИЛЬ СЕКЦИОННЫХ ЗАГОЛОВКОВ H2 (otchet_unify_h2) — ОДИН источник истины.
   Эталон: .gv-head (синий жирный + короткая красная черта снизу).
   Грузится последним (glavnaya.css) → выигрывает каскад над разрозненными старыми font-size.
   ИСКЛЮЧЕНИЯ (НЕ в группах): карточка товара (.okna-steklo-*, single.css), мелкие ярлыки
   (.okna-branch-tags, .okna-empty-order, инлайн-шапка листинга .okna-cat-head__l),
   а также .okna-section-title/.okna-related__title (уже оформлены — эталонные примеры).
   ============================================================ */
/* — Светлый фон: текст --ink (тёмно-синий) + красная черта — */
.gv-head h2,
.gv-why h2,
.gv-seo h2,
.okna-catalog > h2,
.okna-usluga > section > h2,
.okna-allmarks section h2,
.okna-seo-text h2,
.okna-showcase__head h2{
  font-size:30px; font-weight:800; line-height:1.15;
  color:var(--ink,#123d87); position:relative; padding-bottom:12px;
}
.gv-head h2::after,
.gv-why h2::after,
.gv-seo h2::after,
.okna-catalog > h2::after,
.okna-usluga > section > h2::after,
.okna-allmarks section h2::after,
.okna-seo-text h2::after,
.okna-showcase__head h2::after{
  content:""; position:absolute; left:0; bottom:0;
  width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a);
}
/* — Тёмный фон: та же форма + красная черта, но текст БЕЛЫЙ (синий бы пропал) — */
.glavnaya-v4 .gv-dark h2,
.gv-b2b h2,
.gv-nocat h2,
.gv-geo .gv-map-panel h2,
.gv-final .gv-info h2{
  font-size:30px; font-weight:800; line-height:1.15;
  color:#fff; position:relative; padding-bottom:12px;
}
.gv-b2b h2::after,
.gv-nocat h2::after,
.gv-geo .gv-map-panel h2::after,
.gv-final .gv-info h2::after{
  content:""; position:absolute; left:0; bottom:0;
  width:52px; height:3px; border-radius:999px; background:var(--red,#e0223a);
}
/* — Мобила: заголовки секций меньше, черта сохраняется — */
@media (max-width:768px){
  .gv-head h2, .gv-why h2, .gv-seo h2,
  .okna-catalog > h2, .okna-usluga > section > h2, .okna-allmarks section h2, .okna-seo-text h2, .okna-showcase__head h2,
  .glavnaya-v4 .gv-dark h2, .gv-b2b h2, .gv-nocat h2, .gv-geo .gv-map-panel h2, .gv-final .gv-info h2{
    font-size:25px; padding-bottom:12px;
  }
}

/* ============================================================
   ФИКС МЕГА-ПАНЕЛИ «Каталог» — выровнять РОВНО по контентной сетке шапки.
   ПРИЧИНА перекоса (замеры, vw 1424): <li.okna-mega> получал position:relative
   от `.okna-menu > li{position:relative}` (специфичность 0,1,1 БЬЁТ
   `.okna-mega{position:static}` 0,1,0) → офсет-родителем абсолютной панели
   становился сам ПУНКТ (left≈409), а не сетка. Панель `left:0; width:1060px`
   считала left от пункта → правый край 1469 при правом крае сетки 1352:
   вылезала на 117px и давала горизонтальный скролл (docScrollW 1469 > 1424).
   РЕШЕНИЕ (Вариант 1): на десктопе пункт делаем static → офсет-родитель
   становится .okna-header-inner (он уже position:relative, стр.347/861).
   Панель тянем left:0; right:0; width:auto = ровно ширина контентной сетки,
   фиксированная (НЕ привязана к пункту, не меняет ширину при наведении).
   Цвет/тёмный вид/анимация (fade, .okna-open) — без изменений. Меняем только геометрию.
   Скоуп min-width:1025px — мобильный/планшетный адаптив (≤1024) НЕ трогаем. */
@media (min-width:1025px){
  /* пункт «Каталог» — статичный: офсет-родитель панели = .okna-header-inner (сетка), а не пункт */
  .okna-header .okna-nav .okna-menu > li.okna-mega{ position:static !important; }
  /* панель — фикс по сетке: от левого до правого края контейнера шапки; снять width:1060/880 */
  .okna-header .okna-mega-panel,
  .okna-header .okna-mega-panel.okna-cat-panel{
    left:0 !important; right:0 !important; width:auto !important; max-width:none !important;
  }
  /* ЗАЗОР пункт→панель и его перекрытие. Замер: низ кнопки «Каталог» y=103, верх панели y=128 → зазор 25px.
     Панель якорится к .okna-header-inner (низ строки шапки 92px), а кнопка центрирована в строке → между
     ними пустая зона. КОРЕНЬ пропадания: style.css `.okna-mega-panel{display:none}` + `.okna-mega:hover
     .okna-mega-panel{display:flex}` — display управляется ТОЛЬКО :hover. Курсор в зазоре → :hover слетает →
     display:none мгновенно → панель И её ::before-мост исчезают разом (мост на панели бесполезен — пропадает
     вместе с ней). Решение из двух частей:

     (1) Удержание через JS hover-intent: megamenu.js держит класс .okna-open 260ms после ухода курсора.
     Привязываем DISPLAY к .okna-open (а не только opacity/visibility) → во время перехода пункт→панель
     панель остаётся в потоке (display:flex), курсор успевает дойти, на панели mouseenter снова продлевает. */
  .okna-header .okna-mega.okna-open > .okna-mega-panel{ display:flex !important; }
  /*  (2) ПОЛНОШИРИННЫЙ прозрачный мост в зазоре, на ВСЕГДА-отрисованном элементе (сам пункт, не пропадающая
     панель). li.okna-mega = position:static (см.выше) → её ::after якорится к .okna-header-inner; bottom:0 =
     низ строки шапки = верх панели в ЛЮБОМ scroll-state (обычная 92px и .okna-scrolled 60px), height 26
     перекрывает зазор (25px обычный / 13px scrolled). Мост — часть .okna-mega: курсор над ним держит
     .okna-mega:hover → style.css display:flex не слетает (любая траектория пункт→панель, без таймингов).
     pointer-events ловим ТОЛЬКО при hover/.okna-open — закрытое меню зазор по ширине шапки НЕ перехватывает. */
  .okna-header .okna-menu > li.okna-mega::after{
    content:""; position:absolute; left:0; right:0; bottom:0; height:26px;
    background:transparent; pointer-events:none; z-index:94;
  }
  .okna-header .okna-menu > li.okna-mega:hover::after,
  .okna-header .okna-menu > li.okna-mega.okna-open::after{ pointer-events:auto; }
}

/* ===================== Блок «Цена и факторы» PF-1 (.okna-pf2) — только услуга. Токены v4. ===================== */
.okna-pf2{ --pf-ink:#123d87; --pf-blue:#1c5bd6; --pf-red:#e0223a; --pf-line:#e8ecf2; --pf-line2:#dbe4f0; --pf-bg:#f7faff; }
.okna-pf2__wrap{ max-width:calc(var(--okna-cw) + 80px); margin:0 auto; padding:0 40px; box-sizing:border-box; }
/* верх */
.okna-pf2__top{ display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:28px; align-items:start; margin:0 0 28px; }
/* (красная капсула-бейдж .okna-pf2__badge убрана ранее — не выводится; мёртвый CSS удалён) */
.okna-pf2__title{ margin:0 0 12px; font-size:30px; font-weight:800; line-height:1.2; color:var(--pf-ink); letter-spacing:-.02em; }
.okna-pf2__lead{ margin:0; font-size:16px; line-height:1.6; color:var(--muted,#6b7686); max-width:620px; }
.okna-pf2__cta{ background:var(--pf-ink); border-radius:22px; padding:24px; color:#fff; box-shadow:0 18px 44px rgba(18,61,135,.22); }
.okna-pf2__cta-title{ margin:0 0 8px; font-size:18px; font-weight:800; color:#fff; }
.okna-pf2__cta-txt{ margin:0 0 16px; font-size:14px; line-height:1.55; color:#cdd9f0; }
.okna-pf2__cta-btn{ display:flex; align-items:center; justify-content:center; width:100%; height:48px; border:0; border-radius:12px;
  padding:0; cursor:pointer; text-decoration:none; font-family:inherit; background:var(--pf-blue) !important; color:#fff !important;
  font-size:15px; font-weight:700; transition:background-color .15s ease; }
.okna-pf2__cta-btn:hover{ background:#1448aa !important; }
/* карточки-ориентиры */
/* шапка ленты: заголовок слева + стрелки справа */
.okna-pf2__cards-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px; }
.okna-pf2__cards-head{ font-size:15px; font-weight:800; color:var(--pf-ink); margin:0; }
.okna-pf2__cards-nav{ display:flex; gap:8px; flex:0 0 auto; }
/* !important — перебить базовые button-стили ТТ1 */
.okna-pf2__arrow{ width:38px; height:38px; border-radius:10px !important; display:flex; align-items:center; justify-content:center; cursor:pointer;
  background:#fff !important; border:1px solid var(--pf-line2,#dbe4f0) !important; color:var(--pf-ink,#123d87) !important; padding:0 !important;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease; }
.okna-pf2__arrow:hover{ background:var(--pf-blue,#1c5bd6) !important; color:#fff !important; border-color:var(--pf-blue,#1c5bd6) !important; }
.okna-pf2__arrow:disabled{ opacity:.4; cursor:default; pointer-events:none; }
.okna-pf2__arrow svg{ width:20px; height:20px; display:block; }
/* карточка-ссылка: без подчёркивания, цвета наследуются (две цены красные остаются) */
.okna-pf2__card--link{ text-decoration:none !important; color:inherit; cursor:pointer; }
.okna-pf2__card--link .okna-pf2__card-name,
.okna-pf2__card--link .okna-pf2__card-prval{ text-decoration:none; }
/* лента: авто-скролл (okna-cycle-strip) + свайп; нативный скроллбар СКРЫТ (при цикле он показал бы утроенную ширину).
   scroll-behavior:auto — авто двигает scrollLeft мгновенно (smooth конфликтует с rAF). */
.okna-pf2__cards{ display:flex; gap:16px; overflow-x:auto; overflow-y:hidden; margin:0 0 12px; padding:4px 2px 12px;
  scroll-behavior:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain;
  scrollbar-width:none; -ms-overflow-style:none; }
.okna-pf2__cards::-webkit-scrollbar{ display:none; height:0; width:0; }
.okna-pf2__card{ flex:0 0 230px; background:#fff; border:1px solid var(--pf-line); border-radius:18px; padding:16px; text-align:center;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.okna-pf2__card:hover{ border-color:var(--pf-blue); box-shadow:0 12px 28px rgba(28,91,214,.12); transform:translateY(-2px); }
.okna-pf2__card-photo{ height:130px; display:flex; align-items:center; justify-content:center; margin:0 0 8px; }
.okna-pf2__card-photo img{ max-width:100%; max-height:130px; width:auto; height:auto; object-fit:contain; display:block; }
.okna-pf2__card-silhouette{ color:#9fb6e6; } .okna-pf2__card-silhouette svg{ width:64px; height:64px; }
.okna-pf2__card-name{ font-size:16px; font-weight:800; color:var(--pf-ink); margin:0 0 8px; }
/* две цены: подпись приглушённая, число красное */
.okna-pf2__card-prices{ display:flex; flex-direction:column; gap:5px; }
.okna-pf2__card-pr{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding:5px 10px; border-radius:10px; background:#f7faff; }
.okna-pf2__card-prlabel{ font-size:12.5px; color:var(--muted,#6b7686); }
.okna-pf2__card-prval{ font-size:16px; font-weight:800; color:var(--pf-red); white-space:nowrap; line-height:1.1; }
.okna-pf2__cards-note{ font-size:13px; line-height:1.5; color:var(--muted,#6b7686); background:var(--pf-bg); border:1px solid var(--pf-line2);
  border-radius:14px; padding:12px 16px; margin:0 0 30px; }
/* факторы */
.okna-pf2__h3{ font-size:22px; font-weight:800; color:var(--pf-ink); margin:0 0 16px; letter-spacing:-.01em; }
.okna-pf2__factors{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin:0 0 34px; align-items:stretch; }
.okna-pf2__factor{ display:flex; flex-direction:column; gap:9px; background:#fff; border:1px solid var(--pf-line); border-radius:16px; padding:16px; }
/* верхняя строка: иконка СЛЕВА + заголовок в ряд; текст-описание — под ними на всю ширину */
/* общий min-height хедера = высота самого длинного заголовка (3 строки) → описания во всех карточках на одной линии */
.okna-pf2__factor-head{ display:flex; align-items:center; gap:10px; min-height:56px; }
.okna-pf2__factor-ico{ flex:0 0 auto; width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  background:var(--blue-soft,#eef3fb); color:var(--pf-blue); }
.okna-pf2__factor-ico svg{ width:20px; height:20px; }
.okna-pf2__factor-title{ margin:0; font-size:15px; font-weight:800; color:var(--pf-ink); line-height:1.25; }
.okna-pf2__factor-txt{ margin:0; font-size:13.5px; line-height:1.5; color:var(--muted,#6b7686); }
/* шаги */
.okna-pf2__steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0 0 30px; position:relative; align-items:stretch; }
.okna-pf2__step{ display:flex; flex-direction:column; gap:9px; position:relative; background:#fff; border:1px solid var(--pf-line); border-radius:18px; padding:22px 18px 18px; }
.okna-pf2__step:not(:last-child)::after{ content:""; position:absolute; top:40px; right:-12px; width:24px; border-top:2px dashed var(--pf-line2); z-index:1; }
.okna-pf2__step-n{ position:absolute; top:-12px; left:18px; width:30px; height:30px; border-radius:50%; background:var(--pf-red); color:#fff;
  font-size:14px; font-weight:800; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(224,34,58,.32); }
/* верхняя строка: иконка СЛЕВА + заголовок в ряд; текст — под ними */
.okna-pf2__step-head{ display:flex; align-items:center; gap:10px; min-height:40px; }
.okna-pf2__step-ico{ flex:0 0 auto; width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  background:var(--blue-soft,#eef3fb); color:var(--pf-blue); }
.okna-pf2__step-ico svg{ width:20px; height:20px; }
.okna-pf2__step-title{ margin:0; font-size:15.5px; font-weight:800; color:var(--pf-ink); line-height:1.25; }
.okna-pf2__step-txt{ margin:0; font-size:13.5px; line-height:1.5; color:var(--muted,#6b7686); }
/* гарантия */
.okna-pf2__warranty{ display:flex; align-items:center; gap:16px; background:var(--pf-bg); border:1px solid var(--pf-line2); border-radius:18px; padding:20px 24px; }
.okna-pf2__warranty-ico{ flex:0 0 auto; width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(26,127,55,.10); color:#1a7f37; }
.okna-pf2__warranty-ico svg{ width:26px; height:26px; }
.okna-pf2__warranty-title{ margin:0 0 5px; font-size:16px; font-weight:800; color:var(--pf-ink); }
.okna-pf2__warranty-txt{ margin:0; font-size:14px; line-height:1.5; color:var(--muted,#6b7686); max-width:840px; }
/* ★ F96 §1 · переключатель ДЕСКТОП/МОБИЛКА текста шагов «Как формируется цена» и гарантии. Тексты — только в
   inc/pf-block.php (--d длинные по десктоп-ветке макета 15, --m короткие по мобильной). База = десктоп (показываем --d,
   прячем --m); @media≤600 наоборот. Хардкода текста в CSS нет. */
.okna-pf2__t--m{ display:none; }
@media (max-width:600px){ .okna-pf2__t--d{ display:none; } .okna-pf2__t--m{ display:inline; } }
/* адаптив */
@media (max-width:1024px){
  .okna-pf2__top{ grid-template-columns:1fr; }
  .okna-pf2__factors{ grid-template-columns:repeat(3,1fr); }
  .okna-pf2__steps{ grid-template-columns:repeat(2,1fr); }
  .okna-pf2__step:not(:last-child)::after{ display:none; }
}
@media (max-width:768px){
  .okna-pf2__wrap{ padding:0 16px; }
  .okna-pf2__title{ font-size:24px; }
  .okna-pf2__factors{ grid-template-columns:1fr; }
  .okna-pf2__steps{ grid-template-columns:1fr; gap:22px; }
  .okna-pf2__cta-btn{ width:100%; }
}
/* ★ F95 §4 · КАНОН модуля «Цена и факторы» — компактная МОБИЛЬНАЯ раскладка шагов «Как формируется цена» + размер
   текста гарантии. Перенесено из usluga-view.css (скоуп услуги снят) → модуль одинаков на всех страницах с галочкой
   (услуги + model/marka/geo). По макету: бледная цифра-кружок 26px СЛЕВА по центру карточки, БЕЗ иконки, заголовок
   14/700, текст 12.5, радиус 12, зазор 12; текст гарантии 12.5. Десктоп (база выше) не задет. */
@media (max-width:600px){
  .okna-pf2__steps{ gap:12px !important; }
  .okna-pf2__step{ display:block !important; position:relative; padding:13px 15px 13px 53px !important; border-radius:12px !important; }
  .okna-pf2__step:not(:last-child)::after{ display:none !important; }
  .okna-pf2__step-n{ position:absolute !important; left:15px; top:50%; transform:translateY(-50%); width:26px !important; height:26px !important; min-width:26px; font-size:13px !important; background:#eef3fc !important; color:#1c5bd6 !important; box-shadow:none !important; margin:0 !important; }
  .okna-pf2__step-ico{ display:none !important; }
  .okna-pf2__step-head{ display:block !important; min-height:0 !important; margin:0 !important; }
  .okna-pf2__step-title{ font-size:14px !important; font-weight:700 !important; margin:0 !important; line-height:1.3; }
  .okna-pf2__step-txt{ font-size:12.5px !important; margin:3px 0 0 !important; line-height:1.4; }
  .okna-pf2__warranty-txt{ font-size:12.5px !important; line-height:1.4; }
}

/* ---- PF-2: таблица реальных цен из каталога (.okna-pf2__catalog) ---- */
.okna-pf2__catalog{ margin-top:34px; }
.okna-pf2__catalog-head{ margin:0 0 14px; }
.okna-pf2__catalog .okna-pf2__h3{ margin:0 0 4px; }
.okna-pf2__catalog-sub{ margin:0; font-size:14px; color:var(--muted,#6b7686); }
/* сетка/рамка/шапка/паддинги/ховер/карточки — из единого .okna-table (design.css); тут только специфика PF-2 */
.okna-pf2__table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.okna-pf2__table{ min-width:680px; }
.okna-pf2__td-photo{ width:64px; }
.okna-pf2__td-photo img{ width:48px; height:38px; object-fit:cover; border-radius:7px; display:block; border:1px solid var(--pf-line2,#dbe4f0); }
.okna-pf2__glass-ico{ display:inline-flex; width:48px; height:38px; align-items:center; justify-content:center; border-radius:7px; background:#eef3fb; color:#9fb6e6; }
.okna-pf2__glass-ico svg{ width:22px; height:22px; }
.okna-pf2__mark{ display:block; font-weight:800; color:var(--pf-ink,#123d87); }
.okna-pf2__model{ display:block; font-size:13px; color:var(--muted,#6b7686); margin-top:2px; }
.okna-pf2__td-sell{ font-weight:700; white-space:nowrap; }
.okna-pf2__install-price{ color:var(--pf-red,#e0223a); font-weight:800; white-space:nowrap; }
.okna-pf2__install-na{ color:#8a97ab; }
.okna-pf2__instock{ display:inline-block; font-size:12.5px; font-weight:700; color:#1a7f37; white-space:nowrap; }
.okna-pf2__open{ color:var(--pf-blue,#1c5bd6) !important; text-decoration:none; font-weight:700; white-space:nowrap; }
.okna-pf2__open:hover{ text-decoration:underline; }
.okna-pf2__more-wrap{ text-align:center; margin-top:18px; }
.okna-pf2__more{ display:inline-flex; align-items:center; height:46px; padding:0 26px; border-radius:12px; text-decoration:none;
  font-size:15px; font-weight:700; color:var(--pf-blue,#1c5bd6) !important; background:#fff !important;
  border:1.5px solid var(--pf-blue,#1c5bd6) !important; transition:background-color .15s ease, color .15s ease; }
.okna-pf2__more:hover{ background:var(--pf-blue,#1c5bd6) !important; color:#fff !important; }
/* мобайл: карточки-строки даёт .okna-table--cards (design.css); тут только специфика выравнивания PF-2 */
@media (max-width:600px){
  .okna-pf2__td-mark{ align-items:flex-start; }
  .okna-pf2__td-act{ justify-content:flex-end; padding-top:8px; }
}

/* ============================================================
   Блок «Отзывы клиентов» v2 (Яндекс) — глобально, в системе сайта.
   ============================================================ */
.okna-reviews{ padding:60px 0; }
/* шапка — по ЦЕНТРУ (макет): иконка над крупным H2, подпись под ним; без левой красной черты */
/* шапка отзывов — слева, заголовок в общем формате (эталон .okna-section-title); иконка убрана */
.okna-reviews__head{ margin:0 0 26px; }
.okna-reviews__subhead{ margin:2px 0 22px; font-size:17px; line-height:1.6; color:var(--muted,#6b7686); }

/* логотип «Я» (рисуем сами) */
.okna-ya-logo{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; flex:0 0 auto;
  border-radius:5px; background:#fc3f1d; color:#fff; font-weight:800; font-size:12px; line-height:1; font-family:Arial,Manrope,sans-serif; }

/* ----- баннер сводки ----- */
.okna-reviews__summary{ position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(210px,270px) 1fr; gap:22px;
  align-items:center; padding:24px 30px; margin:0 0 10px; border:1px solid var(--line,#e3e9f2); border-radius:22px; background:#f4f8ff;
  background-image:linear-gradient(90deg,rgba(244,248,255,.97) 0%,rgba(244,248,255,.92) 50%,rgba(244,248,255,.80) 100%), url('img/reviews/reviews-banner-bg.webp');
  background-size:cover; background-position:right center; background-repeat:no-repeat; box-shadow:0 14px 40px rgba(12,28,60,.06); }
.okna-reviews__rate{ position:relative; z-index:1; }
.okna-reviews__rate-num{ font-size:54px; font-weight:800; line-height:1; color:var(--ink,#123d87); letter-spacing:-.02em; }
.okna-reviews__rate-cnt{ margin-top:4px; font-size:14px; color:var(--muted,#6b7686); }
.okna-reviews__source{ display:inline-flex; align-items:center; gap:7px; margin-top:10px; font-size:13px; font-weight:600; color:#3a4a66; }
.okna-rev__stars{ display:inline-flex; gap:2px; line-height:0; }
/* звёзды — inline-SVG без fill (дефолт чёрный); красим именно fill, TT1 перебивает → !important. И баннер, и карточки. */
.okna-rev__stars span svg{ fill:#d8dee9 !important; }
.okna-rev__stars span.is-on svg{ fill:#f5b50a !important; }
.okna-rev__stars--big{ gap:4px; margin:8px 0 2px; }
.okna-rev__stars--big svg{ width:24px; height:24px; }

.okna-reviews__aspects{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.okna-reviews__aspect{ background:#fff; border:1px solid #e3ecf9; border-radius:16px; padding:14px 14px 12px; text-align:left; box-shadow:0 6px 18px rgba(18,61,135,.08); }
.okna-reviews__aspect-ic{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:10px;
  background:rgba(28,91,214,.10); color:var(--blue,#1c5bd6); margin-bottom:8px; }
.okna-reviews__aspect-name{ font-size:13px; color:#5a6b80; line-height:1.25; min-height:2.4em; }
.okna-reviews__aspect-pct{ font-size:24px; font-weight:800; color:var(--ink,#123d87); line-height:1.1; }
.okna-reviews__aspect-lbl{ font-size:12px; color:var(--muted,#6b7686); }
.okna-reviews__based{ margin:0 0 26px; font-size:13px; color:var(--muted,#8a93a3); }

/* ----- сетка карточек ----- */
.okna-reviews__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; align-items:stretch; }
.okna-rev{ display:flex; flex-direction:column; gap:14px; background:#fff; border:1px solid var(--line,#e8ecf2);
  border-radius:18px; padding:22px 24px; box-shadow:0 10px 30px rgba(12,28,60,.05); }
.okna-rev__top{ display:flex; align-items:flex-start; gap:13px; }
.okna-rev__ava{ width:60px; height:60px; border-radius:50%; flex:0 0 auto; object-fit:cover; object-position:center; background:#eef2f8; }
.okna-rev__ava--ini{ display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:20px; letter-spacing:.02em; }
.okna-rev__id{ min-width:0; }
.okna-rev__name{ font-weight:800; font-size:16px; color:var(--ink,#123d87); line-height:1.2; }
.okna-rev__cap{ font-size:12.5px; color:var(--muted,#8a93a3); margin:1px 0 5px; }
.okna-rev__body{ display:flex; flex-direction:column; gap:12px; }
.okna-rev__text{ margin:0; font-size:15px; line-height:1.62; color:#3f4a5c; }
.okna-rev__text.is-clamp{ display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden; }
/* стиль текст-ссылки — из общего .okna-tlink (design.css); здесь только отступ/размер карточного варианта */
.okna-rev__more-link{ align-self:flex-start; margin:2px 0 0; font-size:14px; line-height:1.4; }
.okna-rev__photos{ display:flex; flex-wrap:wrap; gap:10px; }
.okna-rev__photo{ display:block; width:calc(50% - 5px); aspect-ratio:4/3; border-radius:14px; overflow:hidden;
  border:1px solid var(--line,#e8ecf2); padding:0; margin:0; background:none; -webkit-appearance:none; appearance:none; cursor:pointer; }
.okna-rev__photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s; }
.okna-rev__photo:hover img{ transform:scale(1.04); }

/* подпись отзыва под фото в попапе (.okna-lb__caption) — карточка: кавычка, текст, автор+уровень, звёзды, ссылка */
.okna-lb__caption{ max-width:680px; margin:14px auto 0; background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px;
  padding:18px 22px; box-shadow:0 12px 32px rgba(12,28,60,.12); text-align:left; }
.okna-lb__cap-quote{ display:block; font-size:34px; line-height:1; font-weight:800; color:var(--blue,#1c5bd6); margin:0 0 2px; }
.okna-lb__cap-text{ margin:0; font-size:15px; line-height:1.6; color:#3f4a5c; }
.okna-lb__cap-text.is-clamp{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
/* стиль текст-ссылки — из общего .okna-tlink (design.css); здесь только отступ/размер */
.okna-lb__cap-more{ margin:6px 0 0; font-size:14px; }
.okna-lb__cap-foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; margin-top:14px; }
.okna-lb__cap-author{ font-weight:800; font-size:15px; color:var(--ink,#123d87); }
.okna-lb__cap-lvl{ font-size:12.5px; color:var(--muted,#8a93a3); margin:1px 0 4px; }
.okna-lb__cap-link{ font-size:13px; font-weight:600; color:#5a6b80; text-decoration:none; }
.okna-lb__cap-link:hover{ color:var(--blue,#1c5bd6); }
@media(max-width:600px){
  .okna-lb__caption{ margin-top:10px; padding:14px 16px; border-radius:14px; }
  .okna-lb__cap-text.is-clamp{ -webkit-line-clamp:3; }
}
.okna-rev__src{ display:inline-flex; align-items:center; gap:7px; align-self:flex-start; font-size:13px; font-weight:600; color:#5a6b80; text-decoration:none; }
.okna-rev__src:hover{ color:var(--blue,#1c5bd6); }

.okna-reviews__more{ margin:24px 0 0; text-align:center; }

@media(max-width:768px){
  .okna-reviews__summary{ grid-template-columns:1fr; gap:18px; }
  .okna-reviews__aspects{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px){
  .okna-reviews{ padding:42px 0; }
  .okna-reviews__grid{ grid-template-columns:1fr; gap:16px; }
  .okna-rev{ padding:20px; }
  .okna-reviews__summary{ padding:20px; background-image:linear-gradient(90deg,rgba(244,248,255,.97),rgba(244,248,255,.92)); }
  .okna-reviews__rate-num{ font-size:46px; }
  .okna-reviews__aspect-name{ min-height:0; }
  .okna-reviews__more .okna-btn{ width:100%; justify-content:center; }
}

/* ============================================================
   Г3-Часть2: кластер СОЦДОКАЗАТЕЛЬСТВА (партнёры(слайдер→design.css) /
   сертификаты / о-нас). Блоки только главной (tpl-glavnaya).
   Г3-Ч2-финал 02.07.2026: контент реальный (FAKTY_referens) — бейджи «РЫБА» сняты, класс .gv-fish удалён.
   Ритм фонов: faq(soft) → partners(white) → gv-cert(white) → gv-about(blue-soft) → reviews(soft).
   ============================================================ */

/* --- 3. Статусы и гарантии (.gv-cert, белый фон; бывш. «Сертификаты») --- */
.gv-cert__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.gv-cert__card{ background:#fff; border:1px solid var(--line); border-radius:var(--ok-radius-card,16px); padding:24px 22px 20px;
  display:flex; flex-direction:column; }
/* иконка-статус (fallback, пока владелец не дал сканы) */
.gv-cert__ico{ width:64px; height:64px; border-radius:14px; background:var(--blue-soft);
  display:grid; place-items:center; margin-bottom:16px; }
/* слот под скан документа (встанет вместо иконки, клик/лайтбокс — при появлении файлов) */
.gv-cert__scan{ aspect-ratio:4/3; border:1px solid var(--line); border-radius:10px; overflow:hidden; margin-bottom:16px; }
.gv-cert__scan img{ width:100%; height:100%; object-fit:cover; display:block; }
.gv-cert__card h4{ margin:0 0 6px; font-size:16.5px; line-height:1.3; color:var(--ink); }
.gv-cert__card p{ margin:0 0 12px; font-size:14px; line-height:1.55; color:var(--muted); }
.gv-cert__badge{ margin-top:auto; align-self:flex-start; background:var(--blue-soft); color:var(--blue);
  font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; }

/* --- 4. О нас (.gv-about, фон blue-soft — отличен от soft у соседей) ---
   Редизайн 03.07.2026 по макету владельца (на-главную-блок-визуал.png): белая карточка-контейнер,
   слева H2-канон + 3 строки + 4 карточки-факта + 2 кнопки + строка 3 преимуществ, справа фото основателей.
   Прежняя карточка цифр (.gv-about__stats) удалена вместе с разметкой — история на странице /o-kompanii/. */
.gv-about{ background:var(--blue-soft); }
.gv-about__box{ background:#fff; border:1px solid var(--line); border-radius:22px; padding:38px 40px 34px;
  box-shadow:0 10px 30px rgba(20,40,80,.06); }
.gv-about__grid{ display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); gap:44px; align-items:stretch; } /* левая шире: воздух карточкам-фактам и строке преимуществ (аудит) */
.gv-about__lead{ margin-top:20px; }
.gv-about__lead p{ margin:0 0 10px; font-size:16px; line-height:1.6; color:var(--text); }
/* 4 карточки-факта с иконками (по макету) */
.gv-about__facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:18px; }
.gv-about__fact{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 10px 14px;
  display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.gv-about__fact-ico{ height:36px; display:grid; place-items:center; }
.gv-about__fact-label{ font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.3; }
/* кнопки: красная заявка (решение Архитектора по макету) + вторичная на страницу «О компании».
   Габариты заданы явно: без контекста TT1 делает a-кнопки block/20px/92px высотой (замер CDP) */
.gv-about__cta{ display:flex; align-items:center; gap:14px; margin-top:24px; }
.gv-about__cta .okna-btn{ display:inline-flex; align-items:center; justify-content:center;
  font-size:16px; line-height:1.25; padding:13px 26px; min-height:48px; box-sizing:border-box; }
/* строка 3 преимуществ с тонкими разделителями (по макету) */
.gv-about__adv{ display:flex; margin-top:26px; padding-top:22px; border-top:1px solid var(--line); }
.gv-about__adv-item{ flex:1 1 0; display:flex; align-items:flex-start; gap:10px; min-width:0; }
.gv-about__adv-item + .gv-about__adv-item{ border-left:1px solid var(--line); padding-left:18px; margin-left:18px; }
.gv-about__adv-ico{ flex:0 0 auto; margin-top:2px; }
.gv-about__adv-text b{ display:block; font-size:14px; color:var(--ink); line-height:1.3; margin-bottom:3px; }
.gv-about__adv-text span{ font-size:12.5px; color:var(--muted); line-height:1.4; display:block; }
/* фото основателей — карточка со скруглением, не «сырой прямоугольник» */
.gv-about__photo{ border-radius:18px; overflow:hidden; border:1px solid var(--line); min-height:380px;
  box-shadow:0 8px 24px rgba(20,40,80,.08); }
.gv-about__photo img{ width:100%; height:100%; object-fit:cover; display:block; }

/* --- адаптив кластера --- */
@media (max-width:1024px){
  .gv-cert__grid{ grid-template-columns:repeat(2,1fr); }
  .gv-about__box{ padding:28px 24px 26px; }
  .gv-about__grid{ grid-template-columns:1fr; gap:26px; }
  .gv-about__photo{ min-height:0; max-height:480px; }
}
@media (max-width:600px){
  .gv-cert__grid{ grid-template-columns:1fr; }
  .gv-about__box{ padding:22px 16px 20px; }
  .gv-about__facts{ grid-template-columns:repeat(2,1fr); }
  .gv-about__cta{ flex-direction:column; align-items:stretch; }
  .gv-about__cta .okna-btn{ width:100% !important; text-align:center; min-height:48px; } /* !important: TT1 даёт a-кнопке fit-content(276px) */
  .gv-about__adv{ flex-direction:column; gap:14px; }
  .gv-about__adv-item + .gv-about__adv-item{ border-left:0; padding-left:0; margin-left:0; }
}

/* ============================================================
   ФИКС-ПАКЕТ вёрстки (агентный аудит 02.07.2026)
   ============================================================ */
/* карточки-ссылки каталога/ситуаций: убрать подчёркивание всего текста (TT1 a{underline}) */
a.gv-card{ text-decoration:none; }
/* мобилка: сетка «Когда нужно заменить…» перестраивается (была 3 колонки и вылет за 390px) */
@media (max-width:768px){ .gv-cards-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .gv-cards-3{ grid-template-columns:1fr; } }
/* мобилка: цепочка слоёв вклейки — без разорванных стрелок */
@media (max-width:600px){
  .gv-proc__layers{ gap:8px; }
  .gv-proc__layers i{ display:none; }
  .gv-proc__layers span{ font-size:13px; padding:8px 12px; }
}
/* мобилка: калькулятор — ряд Длина/Ширина/Толщина без «лесенки» (подписи в 2 строки рвали линию инпутов) */
@media (max-width:600px){
  .gv-calc-form .three{ grid-template-columns:1fr; }
}
/* мобилка: плашка «Не нашли марку?» с кнопкой «Все марки» — переносом, не обрезом */
@media (max-width:600px){
  .okna-bm__notfound{ flex-wrap:wrap; max-width:100%; }
}

/* мобилка: «Все марки автобусов» — на свою строку во всю ширину (space-between выталкивал кнопку за экран) */
@media (max-width:600px){
  .okna-bm__foot-right{ flex-wrap:wrap; }
  .okna-bm__all{ width:100%; text-align:center; box-sizing:border-box; }
}
/* SEO-блок: свёрнутый текст — фейд вместо жёсткого среза букв посреди строки */
.okna-seo-clip{ position:relative; }
.okna-seo-toggle:not(:checked) ~ .okna-seo-text::after,
.okna-seo-text:not(.is-open)::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:56px;
  /* ★ W5-P05 добор (06.08): убран второй, слабый белый фейд поверх подложки (был виден
     как светлая полоса на всю ширину секции). Реальное затухание свёртки делает маска
     на .okna-st-body; этот legacy-оверлей обнулён в прозрачный, чтобы не красить белым. */
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,0)); pointer-events:none; }
/* ★ Критик A: legacy-путь div.okna-seo-text (клип 170px из style.css:38; рендер seo-text.php:60/74/110)
   на боевом сейчас НЕ отрисовывается (проверено: все .okna-seo-text = <section> maxH:none, обреза нет).
   Но чтобы обнулённый ::after не дал жёсткий обрез, ЕСЛИ путь активируется (флаг shell_v2 off /
   fallback seo_text_full) — затухание МАСКОЙ в свёрнутом состоянии (bg-независимо, не в белый). */
.okna-seo-toggle:not(:checked) ~ div.okna-seo-text{
  -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 56px), transparent);
          mask-image:linear-gradient(to bottom, #000 calc(100% - 56px), transparent); }
.okna-seo-toggle:checked ~ div.okna-seo-text{ -webkit-mask-image:none; mask-image:none; }
.okna-seo-toggle:checked ~ .okna-seo-text::after{ content:none; }
.okna-seo-text{ position:relative; }

/* ============================================================
   Вариации видимы (карточка товара, 03.07.2026 — по диагностике дублей)
   ============================================================ */
/* чип «Обогрев» — правый верхний угол фото (наличие слева, маркет-бейджи слева ниже) */
.okna-badge-heat{ left:auto; right:10px; background:var(--blue-soft); color:var(--blue); }
/* мобилка: карточки узкие (~146px) — бейджи компактнее, чтобы «На складе» и «Обогрев» не толкались */
@media (max-width:600px){
  .okna-badge{ font-size:var(--ok-fs-micro,12.5px); padding:3px 6px; top:8px; left:8px; letter-spacing:0; } /* MOB-05: 9px → пол ДС 12.5 (--ok-fs-micro). Бейдж absolute — раскладку не двигает. */
  .okna-badge-heat{ left:auto; right:8px; }
  .okna-mbadge-pop{ top:31px; left:8px; }
}
/* контраст ИИ-рендеров: автобус-фон заметнее, белый не сереет. Не нравится — удалить это правило (обратимо) */
.okna-card-img{ filter:contrast(1.09) saturate(1.12); }
.okna-card-img--ph{ filter:none; } /* заглушку «нет фото» не трогаем */
/* страница товара: ссылка на аналог-вариацию под ценой */
.st-analog-link{ display:block; margin:10px 0 2px; font-size:14px; color:var(--blue); text-decoration:none;
  background:var(--blue-soft); border:1px solid #dbe6fb; border-radius:10px; padding:9px 13px; font-weight:600; }
.st-analog-link b{ font-weight:800; }
.st-analog-link:hover{ border-color:var(--blue); }

/* Блок «Гарантия» (порт B2B okna-org-guar) обёрнут в div.okna-org → правило .glavnaya-v4 > section{padding:32px 0}
   на него не попадает (секция вложена). Возвращаем верхний отступ-ритм главной (низ 32px даёт сама секция). */
.glavnaya-v4 .okna-org--home{ padding-top:32px; }

/* Каталожный блок подбора («Не нашли нужное стекло?») на главной: обёртка .okna-wrap даёт ширину 1200,
   ритм 32px даёт .glavnaya-v4 > section — обнуляем собственный margin блока, чтобы не задваивать. */
.okna-nocat-home .okna-podbor{ margin:0; }

/* ============================================================
   Блок «Как проходит замена стекла» — ПЕРЕВЁРСТАН под макет (10.07). Desktop: 2 колонки (лево H2+картинка,
   право белая карточка = timeline 5 этапов + врезка вклейки). Mobile <768: 1 колонка, этапы = accordion.
   Скоуп .gv-proc2 (старый .gv-process/.gv-proc не используется). Ширина/ритм — от .glavnaya-v4 .okna-wrap/section.
   ============================================================ */
/* LANE-D-HOME P1 (CE-01/CE-03): голый 1fr = minmax(auto,1fr) — трек НЕ сжимается ниже min-content колонки
   (493.53px из-за nowrap-цепочки .gv-proc2__chain) → документ распирало до 534px при ICB 375 (+159px),
   и тот же каскад тиражирован на 1117 гео-городов + 84 региона. minmax(0,…) + min-width:0 на грид-детях
   снимают min-content-пол: колонка теперь честно сжимается до ширины .okna-wrap. */
.gv-proc2__grid{ display:grid; grid-template-columns:43% minmax(0,1fr); gap:44px; align-items:stretch; }
/* подзаголовок = КАНОН .okna-section-sub (ось 37px + 17/1.6/muted авто) — свой класс не плодим */
.gv-proc2__left{ display:flex; flex-direction:column; min-width:0; }  /* колонка: H2 + подзаголовок + картинка тянется вниз */
.gv-proc2__media{ margin:20px 0 0; flex:1 1 auto; min-height:300px; border-radius:28px; overflow:hidden; box-shadow:0 18px 44px rgba(20,40,80,.10); }
.gv-proc2__media img{ display:block; width:100%; height:100%; object-fit:cover; }  /* заполняет высоту колонки вровень с правой карточкой (как в макете) */
.gv-proc2__card{ background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:26px; box-shadow:0 14px 40px rgba(20,30,55,.07); padding:30px 32px; min-width:0; }
.gv-proc2__steps{ list-style:none; margin:0; padding:0; }
.gv-proc2__step{ position:relative; padding:0 0 20px 52px; }
.gv-proc2__step:not(:last-child){ border-bottom:1px dashed #e3e9f3; margin-bottom:20px; }
.gv-proc2__step:last-child{ padding-bottom:0; }
.gv-proc2__step:not(:last-child)::before{ content:""; position:absolute; left:17px; top:38px; bottom:-22px; width:2px; background:#cfdcf3; z-index:0; }
.gv-proc2__num{ position:absolute; left:0; top:0; z-index:1; width:36px; height:36px; border-radius:50%; background:var(--ink,#123d87); color:#fff!important; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; }
.gv-proc2__body{ min-width:0; }
.gv-proc2__head{ display:flex; align-items:center; gap:10px; width:100%; min-width:0; background:none!important; border:0!important; padding:5px 0 0; margin:0; text-align:left; cursor:default; font:inherit; color:inherit; box-shadow:none!important; }
.gv-proc2__title{ flex:1 1 auto; min-width:0; overflow-wrap:anywhere; font-size:18px; font-weight:800; color:var(--ink,#123d87)!important; line-height:1.2; }
.gv-proc2__chev{ display:none; flex:0 0 auto; color:var(--blue,#1c5bd6); width:22px; height:22px; transition:transform .22s ease; }
.gv-proc2__chev svg{ width:22px; height:22px; display:block; }
.gv-proc2__panel-in{ padding-top:6px; }
.gv-proc2__panel-in p{ margin:0; color:#526173; font-size:14.5px; line-height:1.55; }
.gv-proc2__why{ display:flex; gap:14px; margin:22px 0 0; padding:18px 20px; background:var(--blue-soft,#eef3fc); border-radius:18px; min-width:0; }
.gv-proc2__why-ic{ flex:0 0 auto; width:34px; height:34px; color:var(--blue,#1c5bd6); }
.gv-proc2__why-ic svg{ width:34px; height:34px; display:block; }
/* LANE-D-HOME P1: ГЛАВНЫЙ носитель min-content — правило на why-body отсутствовало вовсе, поэтому флекс-ребёнок
   с min-width:auto распирался под ширину неразрывной цепочки (5 nowrap-звеньев + 4 стрелки ≈ 400px) и тянул
   за собой всю грид-колонку. min-width:0 разрешает сжатие → overflow-x:auto цепочки ниже реально включается. */
.gv-proc2__why-body{ min-width:0; flex:1 1 auto; }
.gv-proc2__why-h3{ margin:2px 0 6px; font-size:16px; font-weight:800; color:var(--ink,#123d87); }
.gv-proc2__why-text{ margin:0 0 14px; color:var(--muted,#6b7686); font-size:13.5px; line-height:1.55; }
.gv-proc2__chain{ display:flex; align-items:center; flex-wrap:wrap; gap:5px; min-width:0; }
.gv-proc2__chain-item{ background:#fff; border:1px solid #d7e1f4; border-radius:7px; padding:4px 9px; font-size:11.5px; font-weight:700; color:var(--ink,#123d87); white-space:nowrap; }
.gv-proc2__chain-arr{ color:var(--blue,#1c5bd6); width:13px; height:13px; flex:0 0 auto; }
.gv-proc2__chain-arr svg{ width:13px; height:13px; display:block; }
@media (max-width:1024px){
  /* LANE-D-HOME P1: было `1fr` — именно эта строка (CE-01, glavnaya.css:2349-2350) держала трек на 493.53px. */
  .gv-proc2__grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
  .gv-proc2__left{ display:block; min-width:0; }                /* 1 колонка — картинка в натуральном размере, не тянем */
  .gv-proc2__media{ flex:none; min-height:0; max-width:600px; }
  .gv-proc2__media img{ height:auto; }
}
@media (max-width:768px){
  .gv-proc2__card{ padding:0; border:0; box-shadow:none; background:transparent; }
  .gv-proc2__step{ background:#fff; border:1px solid var(--line,#e8ecf2); border-radius:16px; padding:14px 16px 14px 58px; margin:0 0 12px; box-shadow:0 6px 18px rgba(20,40,80,.05); }
  .gv-proc2__step:not(:last-child){ border-bottom:1px solid var(--line,#e8ecf2); }
  .gv-proc2__step:not(:last-child)::before{ display:none; }
  .gv-proc2__num{ left:16px; top:14px; }
  .gv-proc2__head{ cursor:pointer; padding:0; min-height:44px; }
  .gv-proc2__chev{ display:block; }
  .gv-proc2__step.is-open .gv-proc2__chev{ transform:rotate(180deg); }
  .gv-proc2__panel{ max-height:0; overflow:hidden; transition:max-height .24s ease; }
  .gv-proc2__step.is-open .gv-proc2__panel{ max-height:280px; }
  /* h-scroll: цепочка «Проём → Праймер → Клей → Стекло → Контроль» читается как цепочка, а не рвётся переносом.
     Работает только вместе с min-width:0 на .gv-proc2__why-body (см. P1 выше) — иначе распирает наружу. */
  .gv-proc2__chain{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px;
    scrollbar-width:thin; overscroll-behavior-x:contain; }
  .gv-proc2__chain-item{ flex:0 0 auto; }
}
/* ≤480: цепочка занимает всю ширину карточки-врезки — иконка-щит уходит над текстом, чтобы звенья не жались */
@media (max-width:480px){
  .gv-proc2__why{ flex-direction:column; gap:10px; padding:16px; }
  .gv-proc2__step{ padding-left:52px; }
  .gv-proc2__num{ left:12px; }
}
.gv-proc2--noanim .gv-proc2__panel, .gv-proc2--noanim .gv-proc2__chev{ transition:none!important; }

/* ============================================================
   LANE-D-HOME — слой представления главной (перенос дизайн-прототипа «02 Главная»).
   Порядок: (1) профилактика выпирания по всем блокам, (2) мобильные решения по блокам,
   (3) тач-цели и поля форм. Только токены, брейкпоинты только 1024/768/600/480.
   Скоуп .glavnaya-v4 → главная + гео-посадки (тот же шаблон), услугу (.okna-usluga) не трогает.
   ============================================================ */

/* --- 1. ПРОФИЛАКТИКА ВЫПИРАНИЯ (тот же класс дефекта, что CE-01 в .gv-proc2) ---
   Грид-/флекс-ребёнок по умолчанию имеет min-width:auto и не сжимается ниже своего min-content;
   голый `1fr` = `minmax(auto,1fr)` даёт то же самое на треке. Пока внутри блока есть хоть один
   неразрывный элемент (white-space:nowrap, длинный артикул, таблица, широкая картинка) — контейнер
   распирает наружу и документ получает горизонтальный скролл. Снимаем min-content-пол разом
   по всем сеточным контейнерам главной: min-width:0 безвреден, пока контенту хватает места,
   и включается ровно тогда, когда иначе была бы полоса прокрутки. */
.glavnaya-v4 .gv-cards-3 > *,
.glavnaya-v4 .gv-offers > *,
.glavnaya-v4 .gv-types > *,
.glavnaya-v4 .gv-links > *,
.glavnaya-v4 .gv-svc > *,
.glavnaya-v4 .gv-svc__grid > *,
.glavnaya-v4 .gv-tt__grid > *,
.glavnaya-v4 .gv-tt__adv > *,
.glavnaya-v4 .gv-tt__banner > *,
.glavnaya-v4 .gv-why > *,
.glavnaya-v4 .gv-b2b .gv-box > *,
.glavnaya-v4 .gv-stats > *,
.glavnaya-v4 .gv-nocat .gv-box > *,
.glavnaya-v4 .gv-cert__grid > *,
.glavnaya-v4 .gv-about__grid > *,
.glavnaya-v4 .gv-about__facts > *,
.glavnaya-v4 .gv-final .gv-box > *,
.glavnaya-v4 .calc-w__box > *,
.glavnaya-v4 .calc-w__fields > *,
.glavnaya-v4 .okna-cases--grid .okna-cases__grid > *,
.glavnaya-v4 .okna-cases--more .okna-cases__grid > *,
.glavnaya-v4 .okna-reviews__grid > *,
.glavnaya-v4 .okna-reviews__summary > *,
.glavnaya-v4 .okna-reviews__aspects > *,
.glavnaya-v4 .okna-pick__advs > *,
.glavnaya-v4 .okna-hero-grid > *,
.glavnaya-v4 .okna-hero-home .okna-benefits > *,
.glavnaya-v4 .okna-pf2__top > *,
.glavnaya-v4 .okna-pf2__factors > *,
.glavnaya-v4 .okna-pf2__steps > *{ min-width:0; }

/* ВНИМАНИЕ на будущее: сами треки (grid-template-columns) правятся ТОЛЬКО ПО МЕСТУ, в исходном правиле
   с той же специфичностью. Новое правило вида `.glavnaya-v4 .gv-b2b .gv-box{…}` (0,3,0) вне @media
   перебило бы адаптивные `.gv-b2b .gv-box{grid-template-columns:1fr}` (0,2,0) из @media(max-width:1024)
   и вернуло бы двухколоночную раскладку на телефон. Проверено на живой странице — так и произошло.
   Поэтому здесь только min-width (свойство без адаптивных переопределений), а minmax(0,…) внесён
   в исходные объявления блоков выше по файлу. */
/* Длинные неразрывные строки (артикулы, модели, e-mail) переносим внутри карточек, а не наружу. */
.glavnaya-v4 .gv-card p, .glavnaya-v4 .gv-offer p, .glavnaya-v4 .gv-sit__head h3,
.glavnaya-v4 .gv-cert__card p, .glavnaya-v4 .gv-links a{ overflow-wrap:anywhere; }

/* --- 2. МОБИЛЬНЫЕ РЕШЕНИЯ ПО БЛОКАМ ---
   Палитра: stack / collapse / tabs / h-scroll / reduce. Принцип владельца «один экран на блок».
   ГРАНИЦА С ФУНДАМЕНТОМ D0 (okna-mobile.css, грузится ДО этого файла): типографику (body h2 23px),
   поля форм (input/select/textarea 16px), .okna-btn 48px и тач-минимум даёт ОН — здесь НЕ дублируем
   и НЕ перебиваем (иначе .glavnaya-v4 .okna-btn{44px} понизил бы кнопку с 48 до 44).
   Ниже — только раскладка блоков главной, которой в D0 нет. */
@media (max-width:768px){
  .glavnaya-v4 > section{ padding:24px 0; }

  /* podbor-home — единственный блок главной вообще без мобильных правил (MR-2: «десктопное ужатие»).
     Решение STACK: каскад «Страна → Марка → Модель» в колонку, панель во всю ширину и в потоке. */
  .gv-podbor .okna-podbor-pair{ display:block; }
  .gv-podbor .okna-qp{ width:100%; }
  /* тач-норма поля (44px) живёт в тач-оси внизу файла (тот же .okna-qp__field) — ширина тут только layout */
  .gv-podbor .okna-qp__panel{ position:static !important; width:auto !important;
    max-width:none !important; left:auto; right:auto; max-height:280px; overflow-y:auto; }
  .gv-podbor .gv-note{ padding:14px 16px; }

  /* Типы стёкол — REDUCE: плитки остаются 2×2 (блок держится в один экран), ниже ростом. */
  .gv-types{ gap:12px; }
  .gv-tile{ min-height:120px; }

  /* Полезные разделы — REDUCE: 2 колонки компактнее (1 колонка дала бы 8 экранов прокрутки).
     min-height:44 — тач-норма, перенесена в тач-ось внизу файла (ширина тут только layout). */
  .gv-links{ gap:10px; }
  .gv-links a{ padding:12px 14px; }
}

@media (max-width:600px){
  /* Поля контейнера: 40px на телефоне съедают пятую часть экрана (у .okna-wrap медиа-запросов не было
     вовсе — 40px на всех ширинах). 18px — ровно тот же канон, что design.css держит для
     .okna-partner/.okna-about на телефоне. */
  .glavnaya-v4 .okna-wrap{ padding:0 18px; }
  .glavnaya-v4 .okna-bm{ padding-left:18px; padding-right:18px; }
  /* Витрина «Популярные стёкла»: design.css держит её ось как calc(--okna-head-indent - 10px) — поправка
     под собственный контейнер витрины (база 75 → 141 на десктопе). На телефоне design.css обнуляет токен,
     и от формулы остаётся чистый -10px: H2 витрины свисает левее ВСЕХ прочих заголовков (замер CDP:
     X=8 против X=18 у соседей, на 375 — X=4). Обнуляем ровно там, где поправка потеряла смысл.
     (0,3,0)+!important — перебить .glavnaya-v4 .okna-showcase__head (0,2,0)+!important из design.css. */
  .glavnaya-v4 .okna-showcase .okna-showcase__head{ margin-left:0 !important; }
  /* Марки — тач-цель тегов до канона 44px (были ~36px); min-height перенесён в тач-ось внизу файла. */
  .gv-tags a{ display:inline-flex; align-items:center; }
  /* B2B-цифры — STACK: две крупные цифры рядом на 375 не читаются. */
  .gv-stats{ grid-template-columns:minmax(0,1fr); }
  .gv-stat{ padding:18px; }
  /* Финальная форма — обе половины компактнее, блок держится в один экран. */
  .gv-final .gv-info, .gv-final .gv-form{ padding:24px 18px; }
}

@media (max-width:480px){
  .glavnaya-v4 .okna-wrap{ padding:0 14px; }
  .glavnaya-v4 .okna-bm{ padding-left:14px; padding-right:14px; }
  /* Типы стёкол — STACK: на самых узких 2 колонки рвут подписи плиток. */
  .gv-types{ grid-template-columns:minmax(0,1fr); }
  .gv-tile{ min-height:96px; }
  /* Полезные разделы — STACK. */
  .gv-links{ grid-template-columns:minmax(0,1fr); }
  /* Карточки компактнее — меньше вертикали на блок. */
  .gv-card, .gv-offer{ padding:18px; }
  .gv-sit__card{ padding:16px 16px 18px; }
  .gv-sit__ico{ width:44px; height:44px; }
  .gv-sit__ico-img{ width:38px; height:38px; }
}

/* [W5-P02 п.5] Тач-цели ≥44: табы марок, ссылки отзывов.
   Канон «И» (D-209). Без !important — тот же вес, позже по файлу. */
@media (hover:none) and (pointer:coarse){
  .okna-bm__tab{ min-height:44px; }
  .okna-rev__more-link,
  .okna-rev__src{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-bm__notfound{ min-height:44px; }
  .okna-showcase__all{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-card-actions .okna-btn{ min-height:44px; }
  html body .ok-showcase .okna-btn.okna-showcase__all{ min-height:44px; }
  .ok-showcase .okna-card-actions .okna-btn{ min-height:44px; }
  .okna-pick__phone a{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-cf7-acc a{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-karta .seg__btn{ min-height:44px; }
  .okna-hf-consent a{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-pf2__open{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .okna-qp__field{ min-height:44px; }
  .ok-podbor .okna-qp__chip{ min-height:44px; }
  .gv-links a{ min-height:44px; }
  .gv-tags a{ min-height:44px; }
}
