/* Правки ПЗЭМ поверх эталона и примитивы OD-LAYOUT. Подключается в EtalonChrome ПОСЛЕ
   tokens.css и site.css — правки перебивают эталон порядком, без усиления селекторов
   (решение 27.09). До 01.10.2026 блок стоял в разметке каждой страницы тегом <style> и
   ещё дважды попадал в RSC-данные (~72 КБ на страницу); теперь — файл с версией по
   содержимому и кэшем на год (lib/assetVersion.ts, next.config.mjs). Эталон не меняется. */
@layer od-layout {
:where(.od-stack,.od-row,.od-row-top,.od-cluster,.od-grid,.od-field,.od-stat,.od-cell,.od-tile) > :where(*){min-width:0}
.od-stack{display:flex;flex-direction:column;gap:var(--od-gap,8px)}
.od-row{display:flex;align-items:center;gap:var(--od-gap,8px)}
.od-row-top{display:flex;align-items:flex-start;gap:var(--od-gap,8px)}
.od-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--od-gap,8px)}
.od-fill{flex:1 1 0;min-width:0}.od-fixed{flex:none}
.od-grid{display:grid;gap:var(--od-gap,12px);grid-template-columns:repeat(var(--od-cols,3),minmax(0,1fr))}
.od-stat,.od-field,.od-cell{display:grid;gap:var(--od-gap,2px)}
:where(.od-stat,.od-field,.od-cell) > :where(*){display:block}
.od-tile{display:grid;grid-template-rows:auto 1fr}:where(.od-tile) > :where(*){display:block}
.od-media{display:block;width:100%;height:auto;aspect-ratio:var(--od-ratio,auto)}.od-media-cover{object-fit:cover}
.od-truncate{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.od-clamp-2,.od-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.od-clamp-2{-webkit-line-clamp:2}.od-clamp-3{-webkit-line-clamp:3}
.od-lines-2{min-height:calc(2 * 1.4em)}.od-nowrap{white-space:nowrap}.od-keep{word-break:keep-all;overflow-wrap:anywhere}
.od-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%}.od-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0}
.od-rail{display:flex;gap:var(--od-gap,8px);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-inline:var(--od-rail-pad,16px);scroll-padding-inline:var(--od-rail-pad,16px)}
.od-rail::-webkit-scrollbar{display:none}:where(.od-rail) > :where(*){flex:none;scroll-snap-align:start}
:where(.od-rail) > :where(:last-child){margin-inline-end:var(--od-rail-pad,16px)}
.od-spacer{flex:none;visibility:hidden;pointer-events:none}.od-touch{min-width:44px;min-height:44px}
}
/* ПЗЭМ: служебная полоса (страна, язык, четыре ссылки, телефон) на
   1200–1439 не влезает и в самом эталоне (вынос вбок до 147 px), а наш
   телефон ещё длиннее. Ссылки прижимаются к телефону, промежутки — 20
   (токены системы); на 1440 и шире — как в эталоне. */
@media (min-width: 1200px) and (max-width: 1439px) {
  .topbar .topbar-inner { gap: var(--pz-sp-20); }
  .topbar .topbar-links { margin-left: auto; gap: var(--pz-sp-20); }
}
@media (min-width: 1200px) and (max-width: 1279px) {
  .topbar .topbar-inner, .topbar .topbar-links, .topbar .loc { gap: var(--pz-sp-16); }
}
/* ПЗЭМ: на телефоне страна и наш номер (длиннее эталонного) не влезали
   в 360 на 7 px — промежуток между ними 16 вместо 30. */
@media (max-width: 479px) { .topbar .topbar-inner { gap: var(--pz-sp-16); } }
/* ПЗЭМ: у новостей 122 записи — постраничник из 8 кнопок не влезал в 360
   (вынос вбок); на узких экранах переносится на вторую строку. */
@media (max-width: 479px) { .pager { flex-wrap: wrap; row-gap: var(--pz-sp-8); } }
/* ПЗЭМ: обозначения изделий в названиях проектов («НГСВ-6,3-3,0-1200-
   09Г2С») без пробелов не влезали в плитку на 360 — перенос как в od-keep. */
.ptile-name { overflow-wrap: anywhere; }
/* ПЗЭМ: reset-globals.css снимает стили старого сайта и ставит main
   { display: unset } — main становился строчным, его нижний отступ
   (.pg-list, 80 px) не работал, и последний блок прилипал к подвалу.
   По умолчанию браузера main — блочный, как в эталоне. */
#main { display: block; }
/* ПЗЭМ (решение владельца 26.09): политика и согласие — текстом по
   левому краю, а не колонкой по центру; ширина строки та же. */
.pg-text .rich { margin-left: 0; margin-right: 0; }
/* ПЗЭМ: у карточек оборудования (pcard) подложка картинки и подпись —
   span, то есть строчные: пропорция подложки (aspect-ratio эталона) не
   работала, картинки «плясали» по высоте (страницы отраслей и этапов). */
.pcard:not(.ind-eq) .pcard-media, .pcard .pcard-name { display: block; } /* у .ind-eq раскладку с центровкой задаёт эталон */
/* ПЗЭМ (замечание владельца 26.09): первый экран раздела/категории —
   текст сверху, а не по центру высоты картинки (был пробел между крошками
   и заголовком); между блоками страницы 60 вместо 80. */
main .cat-hero { align-items: start; }
/* ПЗЭМ: таблицы документов на карточке (NormBlocks, data-norm) — длинные
   заголовки из выгрузок переносятся, а не распирают таблицу шире области. */
/* ПЗЭМ: тонкая линия схем (швы, трубы, мешалка) — в плитках «Исполнений»
   так же, как в схеме «Конструкции» (в эталоне .thin задан только у .scheme). */
.exec-scheme .thin { stroke-width: 1; stroke: var(--pz-blue-light); }
/* ПЗЭМ (решения владельца 26.09): страна и язык в меню не дублируются.
   Уже 768 px: в верхней строке «Россия и СНГ ▾» (без глобуса) и телефон (уже 375 — мельче), язык «RU | EN» — в синей строке
   между логотипом и кнопкой меню. От 768 px — как в эталоне (всё в верхней строке). */
/* ПЗЭМ (правка владельца 26.09): широкая секция (проекты) и следующий блок страницы не складывают
   отступы — у секции снимается нижний, остаётся верхний отступ блока (48/60 px). */
.section-wide:has(+ .container > .cat-block:first-child) { padding-bottom: 0; }
/* ПЗЭМ: слайды проектов не тянутся по самому высокому; высоту ленты задаёт site.js по текущему слайду */
.project-track { align-items: flex-start; }
.project-slider { transition: height var(--pz-dur) var(--pz-ease-out); }
/* ПЗЭМ (правка владельца 27.09): разделитель крошек «/» — в конце предыдущего пункта, чтобы при
   переносе длинного последнего пункта он оставался на своей строке, а не начинал новую. */
/* Правка 27.09: крошки — строкой текста, перенос по словам (не пунктами целиком). Пункты — inline;
   «/» приклеен к предыдущему пункту неразрывным пробелом, после него — обычный пробел для переноса. */
ol.crumbs { display: block; }
ol.crumbs li { display: inline; }
ol.crumbs li + li::before { content: none; }
ol.crumbs li:not(:last-child)::after { content: " / "; color: var(--pz-gray-2); white-space: pre-wrap; }
/* ПЗЭМ (правка владельца 26.09): «Наши проекты» на телефоне и планшете — фото сразу под текстом
   (слайды ленты тянулись по самому высокому, строка текста растягивалась до пустоты). */
@media (max-width: 1199px) {
  .project-track .project { grid-template-rows: none; align-content: start; }
}
/* ПЗЭМ (правка владельца 26.09): блок «Узнайте стоимость» на главной — на всю ширину сетки
   продукции на всех экранах (был одной клеткой, справа оставалась пустота). */
.hm-prod .hm-prod-cta { grid-column: 1 / -1; grid-template-rows: none; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.hm-prod .hm-prod-cta p { margin: 0; }
.hm-prod .hm-prod-cta .btn { width: auto; padding: 0 var(--pz-sp-40); }
@media (max-width: 599px) {
  .hm-prod .hm-prod-cta { grid-template-columns: minmax(0, 1fr); }
  .hm-prod .hm-prod-cta .btn { width: 100%; }
}
/* ПЗЭМ (решение владельца 26.09): полосы браузера на телефоне не белые. Верх красит theme-color
   (app/layout.tsx, цвет служебной полосы шапки); под страницей — цвет подвала. У самой страницы фон белый. */
html { background: var(--pz-black); }
/* Safari на iOS 26 не читает theme-color и красит полосы браузера по фону body — поэтому
   фон body цвета служебной полосы шапки, а белый — у самой страницы (#main).
   html body — специфичнее правила body из site.css, который подключается позже. */
html body { background: var(--pz-blue-2); }
#main { background: var(--pz-white); }
/* Запасной шрифт с метриками Inter (Arial, подогнанный как у next/font): если Inter ещё не
   загрузился, подмена не сдвигает строки. */
@font-face { font-family: "Inter Fallback"; src: local("Arial"); ascent-override: 90.49%; descent-override: 22.56%; line-gap-override: 0%; size-adjust: 107.06%; }
html:root { --pz-font: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
/* ПЗЭМ (правка владельца 26.09): на iPhone кнопки первого экрана карточки пропадали после касания
   или прокрутки пальцем. Старый общий стиль (app/globals.css) сдвигает .btn при нажатии
   (transform на :active) — Safari после этого не перерисовывал кнопку. На страницах эталона
   сдвиг снят, кнопкам — свой слой и без серой подсветки касания. */
.site-header ~ * .btn:active, #main .btn:active { transform: none; }
#main .btn { -webkit-tap-highlight-color: transparent; transform: translateZ(0); backface-visibility: hidden; }
/* ПЗЭМ (правка владельца 26.09): синяя форма заявки в окне на телефоне — компактнее,
   чтобы кнопка «Отправить» была видна без прокрутки. Поля — по-прежнему 44 px. */
@media (max-width: 767px) {
  .modal:has(.modal-card.is-blue) { padding: var(--pz-sp-8); }
  .modal-card.is-blue { padding: var(--pz-sp-20) var(--pz-sp-16); max-height: calc(100dvh - var(--pz-sp-16)); }
  .modal-card.is-blue .modal-h { font-size: var(--pz-fs-h3); padding-right: var(--pz-space-4); }
  .modal-card.is-blue .modal-sub { margin: var(--pz-sp-8) 0 var(--pz-sp-16); font-size: var(--pz-fs-small); }
  .modal-card.is-blue .form-blue { gap: var(--pz-sp-8); }
  .modal-card.is-blue textarea.fb-input { min-height: var(--pz-space-8); }
  .modal-card.is-blue .fb-attach { min-height: var(--pz-space-4); margin-top: 0; }
  .modal-card.is-blue .form-blue .fb-consent { font-size: var(--pz-fs-small); }
  .modal-card.is-blue .form-blue .btn-cyan { margin-top: var(--pz-sp-4); }
}
.country-short, .lang-short, .navbar-lang { display: none; }
@media (max-width: 767px) {
  .site-header .topbar [data-country-label] { display: none; }
  .site-header .topbar .country-short { display: inline; }
  .site-header .topbar .country-btn .icon { display: none; }
  .site-header .navbar-lang { display: flex; }
  .site-header .navbar-lang .lang-long { display: none; }
  .site-header .navbar-lang .lang-short { display: inline; }
  .site-header .navbar-lang .lang-opt { min-width: 32px; }
}
@media (max-width: 374px) { .site-header .topbar .phone-num { font-size: var(--pz-fs-body); } }
.table[data-norm] thead th { white-space: normal; }
/* слова в ячейках переносятся по слогам — таблица сжимается до ширины области;
   поля ячеек 16 вместо 20 (на 1280 колонка карточки 695 px) */
.table[data-norm] th, .table[data-norm] td { hyphens: auto; overflow-wrap: break-word; }
@media (min-width: 768px) { .table[data-norm] th, .table[data-norm] td { padding: var(--pz-sp-16); } }
@media (min-width: 768px) { main .cat-block { padding-top: var(--pz-sp-60); } }
/* Квиз «Расчёт стоимости» (components/etalon/QuizEtalon.tsx) — в синей карточке формы эталона */
.qz-progress { display: flex; align-items: center; gap: var(--pz-sp-16); margin-bottom: var(--pz-sp-24); color: var(--pz-blue-light); font-size: var(--pz-fs-small); white-space: nowrap; }
.qz-bar { flex: 1; height: var(--pz-sp-4); border-radius: var(--pz-r-round); background: var(--pz-line-on-blue); overflow: hidden; }
.qz-bar > span { display: block; height: 100%; background: var(--pz-cyan); transition: width var(--pz-dur) var(--pz-ease-out); }
.qz-q { display: block; margin-bottom: var(--pz-sp-16); font-size: var(--pz-fs-block); font-weight: var(--pz-fw-bold); line-height: var(--pz-lh-head); }
.qz-text { margin-bottom: var(--pz-sp-16); color: var(--pz-blue-light); line-height: var(--pz-lh-card); }
.qz .q-list { gap: var(--pz-sp-8); }
.qz .q-item[aria-pressed="true"] { background: var(--pz-cyan); color: var(--pz-white); }
.qz .q-item[aria-pressed="true"] .icon { color: var(--pz-white); }
.qz-type-main { display: inline-flex; align-items: center; gap: var(--pz-sp-16); color: var(--pz-black); font-weight: var(--pz-fw-medium); }
.qz-type-main img { width: var(--pz-sp-60); height: var(--pz-sp-40); object-fit: contain; flex: none; }
.qz-presets { display: flex; flex-wrap: wrap; gap: var(--pz-sp-8); margin-top: var(--pz-sp-16); }
.qz-chip { min-height: 44px; padding: 0 var(--pz-sp-16); border: 1px solid var(--pz-line-on-blue); border-radius: var(--pz-r-sm); color: var(--pz-white); }
.qz-chip[aria-pressed="true"] { background: var(--pz-white); border-color: var(--pz-white); color: var(--pz-blue); }
@media (hover: hover) { .qz-chip:hover { border-color: var(--pz-white); } }
.qz-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--pz-sp-16); margin-top: var(--pz-sp-24); }
.qz-back { display: inline-flex; align-items: center; gap: var(--pz-sp-8); min-height: 44px; color: var(--pz-blue-light); }
.qz-back .icon { transform: scaleX(-1); }
@media (hover: hover) { .qz-back:hover { color: var(--pz-white); } }
.qz-actions { display: flex; gap: var(--pz-sp-8); }
.qz .btn[disabled] { opacity: .5; cursor: default; }
.qz-card { max-width: 620px; padding: var(--pz-sp-60); border-radius: var(--pz-r-lg); background: var(--pz-blue); color: var(--pz-white); }
@media (max-width: 767px) {
  .qz-card { padding: var(--pz-sp-30) var(--pz-sp-20); }
  .qz-q { font-size: var(--pz-fs-body); margin-bottom: var(--pz-sp-8); }
  .qz-type-main img { width: var(--pz-sp-40); height: var(--pz-sp-30); }
  .qz-nav { margin-top: var(--pz-sp-16); }
}
/* Карта сайта (/sitemap): колонки ссылок и раскрывающиеся списки в виде faq2 эталона */
.smap-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pz-sp-30) var(--pz-sp-20); }
.smap-col h3 { margin-bottom: var(--pz-sp-16); font-size: var(--pz-fs-acc); font-weight: var(--pz-fw-bold); line-height: var(--pz-lh-head); color: var(--pz-blue); }
.smap-col h3 a, .smap-h3 a, .smap-more a { color: var(--pz-blue); }
.smap-list { display: grid; gap: var(--pz-sp-8); }
.smap-list a { color: var(--pz-black); line-height: var(--pz-lh-head); }
@media (hover: hover) { .smap-list a:hover, .smap-col h3 a:hover, .smap-more a:hover { color: var(--pz-blue); text-decoration: underline; } }
.smap-list .smap-cat { color: var(--pz-blue); font-weight: var(--pz-fw-medium); }
.smap-sub { margin: var(--pz-sp-8) 0 var(--pz-sp-4) var(--pz-sp-16); font-size: var(--pz-fs-small); }
.smap-flow .smap-list { display: block; columns: 3; column-gap: var(--pz-sp-20); }
.smap-flow .smap-list li { break-inside: avoid; margin-bottom: var(--pz-sp-8); }
.smap-h3 { margin: var(--pz-sp-40) 0 var(--pz-sp-20); }
.smap-more { margin-bottom: var(--pz-sp-20); font-weight: var(--pz-fw-medium); }
.smap-acc { display: grid; gap: 10px; }
.smap-acc .faq2-item { background: var(--pz-bg-gray); }
.smap-acc .faq2-head { cursor: pointer; list-style: none; }
.smap-acc .faq2-head::-webkit-details-marker { display: none; }
.smap-acc details[open] > .faq2-head .faq2-ic::after { transform: rotate(0deg); }
.smap-acc .smap-cols { gap: var(--pz-sp-20); }
.smap-n { margin-left: var(--pz-sp-8); color: var(--pz-gray); font-size: var(--pz-fs-small); }
/* Карточка без проектов: «Похожее оборудование» (серая полоса) идёт сразу за карточкой —
   отступ, как у проектов (иначе блоки слипаются, котельное 27.09) */
.container:has(> .product) + .section-wide.is-gray { margin-top: var(--pz-sp-80); }
@media (max-width: 767px) { .container:has(> .product) + .section-wide.is-gray { margin-top: var(--pz-sp-40); } }
/* Справочник: подзаголовок h3 в тексте статьи; строка «Заменён: …» у отменённого норматива */
.art-h3 { margin: var(--pz-sp-30) 0 var(--pz-sp-16); font-size: var(--pz-fs-acc); font-weight: var(--pz-fw-bold); line-height: var(--pz-lh-head); }
.st-replaced { font-weight: var(--pz-fw-medium); }
.st-replaced a { color: var(--pz-blue); text-decoration: underline; text-underline-offset: 3px; }
/* Список документов (.docs .doc — норматив, гарантии): правило плитки /documents (.doc { display: block }) ниже в site.css
   ломало строку — значок слева, текст уезжал вправо, «Открыть» — отдельной строкой. Возвращаем строку. */
.docs .doc { display: flex; align-items: center; color: inherit; }
.docs .doc > .od-fill { flex: 1; min-width: 0; }
.docs .doc > .link-arrow { flex: none; }
/* Карточка: «Условия заказа» до 1199 px — под кнопками заявки, над вкладками (ProductTop .m-terms) */
.m-terms { display: none; }
@media (max-width: 1199px) {
  .m-terms { display: block; margin-top: var(--pz-sp-30); }
  .m-terms .panel-body { padding-top: var(--pz-sp-20); }
  .product-side .terms-wrap { display: none; }
  /* зазор над вкладками — как между кнопками и условиями (было 60 px — «белая полоска», правка 27.09) */
  .product-tabs { margin-top: var(--pz-sp-30); }
  /* правая колонка до 1199 px пуста (кнопки, условия и содержание перенесены наверх) — без своего отступа,
     иначе между вкладками и «Преимуществами» пустая полоса (правка 28.09) */
  /* только карточка товара: у проекта (.pj-side) колонка на телефоне стоит под фото и держит отступ эталона 40 px —
     без него «Характеристики» прилипали к фото (правка 30.09) */
  .product-side:not(.pj-side) { margin-top: 0; }
}
/* Отзывы: фото автора — размер задан (без сдвига страницы при загрузке), круг как у значка */
.avatar.has-img { padding: 0; overflow: hidden; }
.avatar.has-img img { display: block; width: 60px; height: 60px; object-fit: cover; }
@media (max-width: 767px) { .rv-card .avatar.has-img img { width: 50px; height: 50px; } }
/* Тип компании: «Перейти в каталог» без текста слева — кнопка обычной ширины справа; «Все отзывы» на синем */
.ct-intro.is-solo { display: flex; justify-content: flex-end; }
.ct-all-reviews { margin-top: var(--pz-sp-24); color: var(--pz-white); }
/* Верхний блок «О заводе» и типов компаний (about-hero): в эталоне синий, сливался с синим меню — правка владельца 28.09:
   светлый голубой фон из того же синего (8 %), тёмный текст, ссылки синие; меню остаётся синим. */
.about-hero { background: color-mix(in srgb, var(--pz-blue) 8%, var(--pz-white)); color: var(--pz-black); }
.about-hero .crumbs a, .about-hero ol.crumbs li a { color: var(--pz-blue); }
.about-hero .crumbs [aria-current] { color: var(--pz-gray); }
.about-hero ol.crumbs li:not(:last-child)::after { color: var(--pz-gray-2); }
.about-hero a:not(.btn) { color: var(--pz-blue); }
.about-hero .ct-request { background: var(--pz-blue); border-color: var(--pz-blue); color: var(--pz-white); }
@media (hover: hover) { .about-hero .ct-request:hover { background: var(--pz-blue-2); } }
/* «О заводе» — текст на всю ширину, без пустых колонок (замечание владельца 04.10.2026, правило «текст не сужать»):
   вводный текст — без колонки ролика эталона (ролика на сайте нет); миссия и цель — текстом друг под другом, под ними
   один ряд: два фото и две карточки (на ширине до 1023 — два ряда по два). Высота блоков — по содержимому. */
.pg-about .about-hero-grid, .pg-about .mission { grid-template-columns: minmax(0, 1fr); }
.pg-about .mission { gap: var(--pz-sp-20); }
.about-ryad { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--pz-sp-20); margin-top: var(--pz-sp-40); }
.about-ryad > img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--pz-r-lg); }
@media (max-width: 1023px) { .about-ryad { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 404 — вариант, выбранный владельцем (04.10.2026, предложение Sbor): блок эталона без растяжения на высоту окна, под ним
   разделы каталога и ссылки на проекты, справочник и контакты; кнопки в ряд, телефон отдела продаж под ними. */
.pg-404.is-full { display: block; min-height: 0; }
.e404 .h1 { margin-top: var(--pz-sp-24); }
.e404-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--pz-sp-16); margin-top: var(--pz-sp-40); }
.e404 .e404-btns .btn { margin-top: 0; }
.e404-phone { margin-top: var(--pz-sp-24); color: var(--pz-gray); }
.e404-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pz-sp-20); }
@media (max-width: 767px) { .e404-links { grid-template-columns: minmax(0, 1fr); } }
/* Новость: списки в тексте (документы со сканами) — маркеры и отступы как у абзацев */
.nitem-text ul { list-style: disc; padding-left: var(--pz-sp-20); display: grid; gap: var(--pz-sp-8); margin: var(--pz-sp-16) 0; }
.nitem-text a { color: var(--pz-blue); text-decoration: underline; text-underline-offset: 3px; }
/* Пагинация проектов: переход на страницу N — к началу списка (#pj-list), а не к верху страницы (правка 28.09) */
#pj-list { scroll-margin-top: var(--pz-sp-24); }
/* Просмотр фото (components/etalon/PhotoViewer.tsx) */
[data-gallery] .gallery-stage img, img[data-zoom] { cursor: zoom-in; }
.pv { position: fixed; inset: 0; z-index: 95; display: flex; align-items: center; justify-content: center; padding: var(--pz-sp-60) var(--pz-sp-80); background: color-mix(in srgb, var(--pz-black) 92%, transparent); }
.pv-img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: var(--pz-r-md); background: var(--pz-white); }
.pv .pv-close { position: absolute; top: var(--pz-sp-16); right: var(--pz-sp-16); color: var(--pz-white); }
@media (hover: hover) { .pv .pv-close:hover { background: var(--pz-line-on-blue); color: var(--pz-white); } }
.pv .sbtn { position: absolute; top: 50%; margin-top: -20px; }
.pv .pv-prev { left: var(--pz-sp-20); }
.pv .pv-next { right: var(--pz-sp-20); }
.pv-count { position: absolute; bottom: var(--pz-sp-20); left: 0; right: 0; text-align: center; color: var(--pz-white); font-size: var(--pz-fs-small); }
@media (max-width: 767px) {
  .pv { padding: var(--pz-sp-60) var(--pz-sp-8); }
  .pv .sbtn { top: auto; bottom: var(--pz-sp-8); margin-top: 0; }
  .pv .pv-prev { left: var(--pz-sp-16); }
  .pv .pv-next { right: var(--pz-sp-16); }
}
@media (max-width: 1023px) { .smap-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } .smap-flow .smap-list { columns: 2; } }
@media (max-width: 767px) {
  .smap-cols { grid-template-columns: minmax(0, 1fr); }
  .smap-flow .smap-list { columns: 1; }
  .smap-acc .faq2-head { min-height: 0; padding: var(--pz-sp-16) var(--pz-sp-20); }
  .smap-acc .faq2-body { padding: 0 var(--pz-sp-20) var(--pz-sp-20); }
}
/* Уведомление о cookie (components/etalon/CookieNotice.tsx, релиз 30.09): вид всплывающего сообщения эталона (.toast) */
.cookie-note { position: fixed; left: 50%; bottom: var(--pz-sp-24); z-index: 90; display: flex; align-items: center; gap: var(--pz-sp-16); width: max-content; max-width: min(var(--pz-col-main), calc(100vw - 2 * var(--pz-gutter-m))); transform: translateX(-50%); padding: var(--pz-sp-16) var(--pz-sp-20); border-radius: var(--pz-r-sm); background: var(--pz-black); color: var(--pz-white); font-size: var(--pz-fs-small); line-height: var(--pz-lh-head); box-shadow: var(--pz-shadow); }
.cookie-note p { margin: 0; flex: 1 1 auto; min-width: 0; }
.cookie-note a { color: var(--pz-white); text-decoration: underline; text-underline-offset: 3px; }
.cookie-note .btn { flex: none; }
@media (max-width: 599px) { .cookie-note { flex-direction: column; align-items: stretch; bottom: var(--pz-sp-8); } }
/* Листинги — картинка целиком (решение владельца 01.10.2026).
   Каталог: модели (рендеры) — целиком на белом. У плиток каталога (.ctile-media.is-render) это правило
   эталона, позициям класс ставит lib/modelImages.ts; у «Похожего оборудования» (.pcard-media) — то же здесь.
   Фото позиций — по кадру, с обрезкой краёв, как в эталоне.
   Проекты, новости, отрасли, типы компаний: фото тоже заполняет плитку, как в эталоне (серые поля вокруг
   фото владелец отклонил); вертикальные картинки (письма, свидетельства) — целиком на белом. Класс is-doc
   ставит строка в EtalonChrome по форме загруженной картинки. */
.pcard-media.is-render { background: var(--pz-white); }
.pcard-media.is-render img { object-fit: contain; }
.ptile-media.is-doc, .ncard-media.is-doc, .side-news-media.is-doc, .news-media.is-doc, .pcard-media.is-doc { background: var(--pz-white); }
.ptile-media.is-doc img, .ncard-media.is-doc img, .side-news-media.is-doc img, .news-media.is-doc img, .pcard-media.is-doc img { object-fit: contain; }
/* «Написать нам» — меню в служебной полосе (решение владельца 01.10.2026): вид — выпадающий список
   телефонов эталона (.phone-menu), пункты-кнопки оформлены как его ссылки. */
.mail-pop { position: relative; display: inline-flex; }
.mail-menu { left: 0; right: auto; min-width: 280px; }
.mail-menu .mail-addr { display: grid; gap: 6px; padding: 14px 16px; line-height: 1.2; border-bottom: 1px solid var(--pz-line-on-blue); }
.mail-menu button { display: flex; align-items: center; gap: var(--pz-sp-8); width: 100%; padding: 12px 16px; color: var(--pz-white); font-size: var(--pz-fs-small); font-weight: var(--pz-fw-bold); line-height: 1; text-align: left; border-bottom: 1px solid var(--pz-line-on-blue); }
.mail-menu > :last-child { border-bottom: 0; }
.mail-menu a, .mail-menu button { white-space: nowrap; }
@media (hover: hover) { .mail-menu button:hover { background: var(--pz-blue); } }
/* Формы заявок: под «Прикрепить файл» — подсказка о форматах и размере; файл больше 20 МБ —
   предупреждение (решение владельца 01.10.2026), белым, как ошибки полей синей формы. */
.fb-files.is-error { color: var(--pz-white); font-weight: var(--pz-fw-medium); }
/* «Написать нам» в мобильном меню — раскрывается списком (решение владельца 01.10.2026): стрелка как у
   пунктов меню (.mnav-item .caret-r), подпункты — с отступом под текст пункта. */
.mnav-util .mnav-mail-btn .caret-r { width: 5px; height: 10px; margin-left: var(--pz-sp-8); fill: currentColor; opacity: 0.4; transition: transform var(--pz-dur) var(--pz-ease-out); }
.mnav-util .mnav-mail-btn[aria-expanded="true"] .caret-r { transform: rotate(90deg); }
.mnav-util ul.mnav-mail { display: grid; gap: var(--pz-sp-16); padding: var(--pz-sp-16) 0 0 32px; }
.mnav-util ul.mnav-mail[hidden] { display: none; }
.mnav-mail-addr { color: var(--pz-blue-light); font-weight: var(--pz-fw-bold); }
/* Окна «Оставьте заявку» и «Остались вопросы?»: после отправки — только плашка «Заявка отправлена»
   (решение владельца 01.10.2026). У .form-blue в эталоне display: grid — он перебивал hidden, и форма
   оставалась над сообщением; заголовок и подзаголовок окна при успехе скрываются (класс is-sent, site.js). */
.form-blue[hidden] { display: none; }
.modal-card.is-sent > .modal-h, .modal-card.is-sent > .modal-sub { display: none; }
.modal-card.is-sent .form-success { margin-top: 0; }
/* «Скачать опросный лист» (раздел, категория, карточка) — синяя контурная кнопка эталона (.btn-outline-blue)
   вместо серой (.btn-ghost): серая выглядела отключённой (решение владельца 01.10.2026). В разделе кнопка
   на всю ширину ряда — как правило эталона для .btn-ghost. */
.cat-actions .btn-outline-blue { grid-column: 1 / -1; }
/* Карта «Контактов» — OpenStreetMap (Leaflet) вместо виджета Яндекса с рекламой (решение владельца 01.10.2026):
   метка — синяя, шрифт подписей — как на сайте. */
.map .map-lazy.is-map { height: 100%; }
/* isolation — свой контекст наложения: внутренние z-index карты (слои 400, кнопки 1000) не выходят наружу, выпадающее
   меню шапки и затемнение под ним — всегда поверх карты (баг 05.10.2026: карта закрывала меню «Проекты») */
.leaflet-container { font: inherit; font-size: var(--pz-fs-small); isolation: isolate; }
.pz-pin svg { width: 36px; height: 46px; display: block; filter: drop-shadow(0 2px 3px rgb(0 0 0 / 0.3)); }
.pz-pin path { fill: var(--pz-blue); }
.pz-pin circle { fill: var(--pz-white); }

/* «Раздел × регион» (02.10.2026): плитка категории и под ней её позиции ссылками — одна карточка */
.sr-cat { display: flex; flex-direction: column; gap: var(--pz-sp-16); }
.sr-cat-list { padding: 0 var(--pz-sp-4); }

/* «Партнёры» (02.10.2026): карточка партнёра со ссылкой на его сайт — только по договорённости
   (кафедра «Экономика и финансы» ПГУ). Раскладка карточки та же; наведение — синяя граница логотипа и название. */
.partner-link { display: block; color: inherit; }
.partner-link .partner-logo, .partner-link .partner-name { transition: border-color var(--pz-dur) var(--pz-ease-out), color var(--pz-dur) var(--pz-ease-out); }
@media (hover: hover) {
  .partner-link:hover .partner-logo { border-color: var(--pz-blue); }
  .partner-link:hover .partner-name { color: var(--pz-blue); }
}

/* Страница проекта (02.10.2026): «Особенности» — плашки «Пунктов преимуществ» системы (DESIGN 9,
   .tile-grid/.tile) над вкладками; данные — особые условия из документов завода (project_docs). */
.pj-feats { margin-bottom: var(--pz-sp-40); }
.pj-feats .tile-grid { margin-top: var(--pz-sp-20); }

/* Список проектов (02.10.2026, прототип Sbor, решение владельца): над плитками — чипы выбранных
   параметров (ссылка без значения), «Сбросить всё» и сортировка ссылками. В эталоне projects.html их нет. */
.pj-tools { display: grid; gap: var(--pz-sp-16); margin-bottom: var(--pz-sp-24); }
.pj-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pz-sp-16) var(--pz-sp-16); }
.pj-chip { display: inline-flex; align-items: center; gap: var(--pz-sp-4); padding: var(--pz-sp-4) var(--pz-sp-16); border: var(--pz-line); border-radius: var(--pz-r-md);
  background: var(--pz-bg-gray); color: var(--pz-blue); font-size: var(--pz-fs-small); line-height: var(--pz-lh-head);
  transition: border-color var(--pz-dur) var(--pz-ease-out); }
.pj-chip .icon { width: 1em; height: 1em; }
.pj-reset { color: var(--pz-gray); font-size: var(--pz-fs-small); text-decoration: underline; }
.pj-sort { display: flex; flex-wrap: wrap; gap: var(--pz-sp-4) var(--pz-sp-16); color: var(--pz-gray); font-size: var(--pz-fs-small); line-height: var(--pz-lh-head); }
.pj-sort a { color: var(--pz-blue); }
.pj-sort a[aria-current="true"] { color: var(--pz-black); font-weight: var(--pz-fw-bold); }
@media (hover: hover) {
  .pj-chip:hover { border-color: var(--pz-blue); }
  .pj-reset:hover, .pj-sort a:hover { color: var(--pz-cyan); }
}

/* Всплывающие формы (решение владельца 02.10.2026): без полосы прокрутки внутри карточки. В эталоне карточка
   не выше экрана (max-height + overflow-y: auto), и форма заявки на экране ниже ~920 px прокручивалась внутри
   синей плашки. Теперь карточка — по содержимому (и на телефоне тоже), а если не помещается, прокручивается
   окно целиком; затемнение закреплено на экране. Когда помещается — по центру, как раньше (margin: auto). */
.modal { align-items: flex-start; overflow-y: auto; overscroll-behavior: contain; }
.modal-scrim { position: fixed; }
.modal-card, .modal-card.is-blue { margin: auto; max-height: none; overflow: visible; }
/* Синяя форма на компьютере компактнее: поля карточки 40 вместо 60, меньше отступ под подзаголовком,
   поле сообщения ниже — на экране от ~850 px форма помещается без прокрутки. Телефон — правило 26.09 выше. */
@media (min-width: 768px) {
  .modal-card.is-blue { padding: var(--pz-sp-40); }
  .modal-card.is-blue .modal-sub { margin: var(--pz-sp-16) 0 var(--pz-sp-24); }
  .modal-card.is-blue textarea.fb-input { min-height: var(--pz-space-8); }
}

/* Перекрёстные ссылки «категория + параметр» (03.10.2026, задание Sbor): облако ссылок эталона (.link-cloud)
   с числом проектов; заголовок — .h-sub. Между заголовком и ссылками — 16. */
.pj-cross-list { margin-top: var(--pz-sp-16); }
.pj-cross-list > span[hidden] { display: none; }

/* Фото целиком, без обрезки и не выше нужного (замечание владельца 05.10.2026: «Надо фотки уменьшить и разместить
   корректно»). Шапка категории: фото не выше --pz-media-hero-h, по центру своей колонки (вертикальное фото раньше
   растягивалось на весь экран). */
.cat-hero-img { display: block; width: auto; max-width: 100%; max-height: var(--pz-media-hero-h); margin-inline: auto; object-fit: contain; }
/* Галереи карточек и проектов — раскладка эталона без изменений: рамка 872:581 на всю колонку, миниатюры, отступы — как
   было (указание владельца 05.10.2026: «блоки не трогать, играться только с фотографиями»). Меняется только то, как
   вписан снимок (site.js, по его пропорции): обычные снимки 1,2–1,6 заполняют рамку (is-fill → cover), вертикальные,
   рендеры на белом и очень широкие — целиком (contain) на белом фоне, без серых полей. Миниатюры — так же. */
.gallery-stage, .gallery-thumb { background: var(--pz-white); }
.gallery-stage::after { content: none; }
.gallery-stage img, .gallery-thumb img { object-fit: contain; }
.gallery-stage img.is-fill, .gallery-thumb img.is-fill { object-fit: cover; }