/* ============================================================
   Нишевые страницы poli-tika.ru  ·  assets/css/nishe.css
   Один файл на все 8 отраслевых страниц (вместо 8 копий inline <style>).
   Токены — из style.css (--color-primary #1552d4, --color-dark #0b1f52,
   --color-bg #f4f7fc, --color-text #0d1b3e,
   --color-text-muted #4f6490, --color-border #c2cfe8).
   Карточки товара (.product-card/.pc-price) уже описаны в catalog-fixes.css —
   здесь только каркас страницы и сетка мини-каталога.
   ============================================================ */

/* ── 1. Hero — как на /contacts/ ────────────────────────────────
   Компонент «hero с кнопками» ПЕРЕНЕСЁН 09.10.2026 в style.css
   (.page-hero--wide / .hero-actions / .btn--onhero / .btn--ghost-hero) —
   чтобы те же кнопки на прайс-листе были ровно такими же, а вид правился
   в одном месте. Здесь остался только каркас нишевых секций ниже.
   Фон по-прежнему даёт .page-hero из style.css: градиент
   135deg #0b1f52 → #1552d4 → #3b72f6 + паттерн ::after
   (фото-фон со скримом убран 03.10.2026 — КАПИТАН: «фон какой-то ебанутый,
   верни как в контактах»). */
/* ── 2. Общие блоки (перенесены из страницы контактов) ──────── */
.nz-section { padding: 0 0 80px; }
/* .nz-section--tight удалён 03.10.2026 вместе с секцией «Перейти к категориям». */
.nz-section--gal { padding: 48px 0; }
.nz-section--last { padding: 0 0 80px; }
.nz-section .section-heading {
  font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 800;
  letter-spacing: -.03em; margin-bottom: 8px; color: var(--color-text);
}
.nz-section .section-lead {
  font-size: var(--text-lg); color: var(--color-text-faint); max-width: 660px;
  margin-bottom: 40px; line-height: 1.6;
}
.nz-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 64px; }
@media (max-width: 700px) { .nz-stats { grid-template-columns: repeat(2, 1fr); } }
.nz-stat {
  background: var(--color-surface); border: 1.5px solid var(--color-border);
  border-radius: var(--radius-xl); padding: 28px 20px 24px; text-align: center;
}
.nz-stat__num {
  font-family: var(--font-display); font-size: 2.2rem; font-weight: 800;
  color: var(--color-primary); letter-spacing: -.04em; line-height: 1; margin-bottom: 8px;
}
.nz-stat__label { font-size: var(--text-sm); color: var(--color-text-faint); line-height: 1.4; }
.nz-blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 760px) { .nz-blocks { grid-template-columns: 1fr; } }
.nz-block {
  background: var(--color-surface); border: 1.5px solid var(--color-border);
  border-radius: var(--radius-xl); padding: 28px 28px 24px;
}
.nz-block__icon {
  width: 44px; height: 44px; background: #eff4ff; color: #1552d4;
  border-radius: var(--radius-lg); display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px; flex-shrink: 0;
}
.nz-block__title {
  font-family: var(--font-display); font-size: var(--text-base); font-weight: 700;
  color: var(--color-text); margin: 0 0 10px; line-height: 1.3;
}
.nz-block__text { font-size: var(--text-sm); color: var(--color-text-faint); line-height: 1.7; margin: 0; }

/* ── 3. Зоны ниши = ВКЛАДКИ мини-каталога (совмещено 03.10.2026) ──
   Было: секция «Как устроена уборка» (4 карточки) + отдельная секция
   «Что берут…» с рядом чипов-фильтром по ТЕМ ЖЕ зонам — одно и то же дважды.
   Стало: карточка зоны сама переключает сетку товаров под собой. */
.nz-section--picks { padding: 0 0 80px; }
.nz-zones {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  /* 28px -> 40px, 03.10.2026: замер «по стандарту». Ряд карточек-категорий —
     это ФИЛЬТР мини-каталога, ровно как .cat-tabs в каталоге. В каталоге
     фильтр -> шапка выбранной категории = 40px (замер браузером: .cat-tabs-wrap
     margin-bottom 40px). У нас стояло 28px — собственное число без опоры.
     Теперь 40px: тот же воздух фильтр->результат, что на боевой категории. */
  margin-bottom: 40px;
}
@media (max-width: 1100px) { .nz-zones { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px)  { .nz-zones { grid-template-columns: 1fr; } }
.nz-zone {
  font: inherit; text-align: left; cursor: pointer; padding: 0;
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--color-surface); border: 1.5px solid var(--color-border);
  border-radius: var(--radius-xl); color: inherit; appearance: none;
  /* Движение убрано 03.10.2026 (КАПИТАН: «карточки дёргаются, посмотри как
     оформлен каталог — там все хорошо»): вкладки каталога .cat-tab на
     наведении НЕ двигаются и не растят тень — только цвет рамки/фона
     (замер: сдвиг кадра 0 px против -3 px у нас). Переходы оставлены
     только на цветах — тогда ничего не прыгает ни в кадре, ни под курсором. */
  transition: border-color var(--transition), background var(--transition), color var(--transition);
}
.nz-zone:hover { border-color: var(--color-primary); }
.nz-zone:hover .nz-zone__body { background: var(--color-primary-subtle); }
.nz-zone:hover .nz-zone__title { color: var(--color-primary); }
.nz-zone:focus-visible { outline: 3px solid rgba(21,82,212,.35); outline-offset: 3px; }
.nz-zone { position: relative; }
.nz-zone.is-active { border-color: var(--color-primary); box-shadow: none; }
/* кольцо box-shadow 0 0 0 3px вокруг выбранной зоны убрано: вокруг карточки
   появлялся ореол, которого нет ни у вкладок каталога, ни у подложки. */
.nz-zone.is-active::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px; z-index: 2;
  background: linear-gradient(90deg, #1552d4, #3b72f6);
}
.nz-zone.is-active .nz-zone__body { background: #f7faff; }
/* Строка-подпись «Показать товары →» на карточке категории УДАЛЕНА целиком
   03.10.2026 (КАПИТАН: «из карточек убери „Показать товар“, наверху написано —
   этого достаточно, за счёт этого размер по высоте карточки меньше можно
   сделать»). Правило .nz-zone.is-active .nz-zone__link (гасило подпись у
   выбранной карточки) стало ненужным и убрано вместе с элементом.
   Что было до этого: сначала заливная плашка с подменой текста на «Показать
   все», потом visibility:hidden с сохранением места в 32px. */
.nz-zone__pic { display: block; position: relative; aspect-ratio: 16 / 10; background: #f4f7fc; overflow: hidden; }
.nz-zone__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* зум фото на наведении убран: картинка «дышала» под курсором */
.nz-zone__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 7px; flex: 1; }
.nz-zone__title {
  font-family: var(--font-display); font-size: 1.06rem; font-weight: 700;
  color: var(--color-dark); margin: 0; line-height: 1.25;
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.nz-zone__n {
  font-family: var(--font-body, inherit); font-size: .72rem; font-weight: 700;
  color: var(--color-primary); background: #eef3ff; border-radius: 999px; padding: 2px 8px;
}
.nz-zone.is-active .nz-zone__n { background: var(--color-primary); color: #fff; }
/* Описание зоны мельче основного текста (КАПИТАН 03.10.2026: «шрифт в описании
   на карточках … можно меньше сделать»). Было var(--text-sm) = 16px — столько же,
   сколько у абзацев страницы; в карточке шириной 276px это читалось как «грубо».
   Стало var(--text-xs) = 14px, интерлиньяж плотнее, чтобы блок не разъезжался. */
.nz-zone__text { font-size: var(--text-xs); color: var(--color-text-faint); line-height: 1.55; margin: 0; }
/* .nz-zone__link — правило удалено вместе с элементом (см. выше). Оценка
   выигрыша по высоте: строка 16px/1.3 ≈ 21px + padding-top 6px = ~27px на
   карточку; проверено замером карточек через Playwright после деплоя. */
/* стрелка-указатель больше не отъезжает на наведении (03.10.2026): в каталоге
   у вкладок .cat-tab на наведении не двигается НИЧЕГО, только цвета. */

/* ── 3b. Шапка мини-каталога = копия .cat-active-header из каталога ──
   КАПИТАН 03.10.2026: «заголовок и разделитель, разделитель надо убрать,
   заголовок сделать таким же по размеру как в каталоге и иконку вывести перед
   ним, цвет такой же как в каталоге, шрифт используй».
   Было: пилюля-плашка 16px/700 цветом --color-primary + точка-разделитель
   + линия border-bottom 1px --color-border.
   Стало (числа сняты с боевого .cat-active-header / style.css:1694-1714
   и catalog-fixes.css:125-146): иконка 56×56 (padding 12, radius 16,
   цвет берётся из .cat-icon--blue = фон #e0e7ff, штрих #3730a3 — тот же
   класс, что в шапке категории каталога), заголовок Manrope
   clamp(1.3rem,2.5vw,1.7rem)/800, letter-spacing -.025em, --color-text,
   line-height 1.1; под ним счётчик позиций мелким серым (аналог
   .cat-active-header__desc). Ни линии, ни точки — как в каталоге
   (padding: 6px 0 24px, border: 0). */
.nz-state { display: flex; align-items: center; gap: 16px; padding: 6px 0 24px; margin: 0; border: 0; }
.nz-state__icon {
  flex: 0 0 auto; width: 56px; height: 56px; padding: 12px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center; box-sizing: border-box;
}
.nz-state__icon svg { width: 100%; height: 100%; display: block; }
/* Иконка зоны: в контейнере лежат ВСЕ варианты (по одному на зону), виден
   только активный — JS переключает [hidden] вместе с выбранной зоной
   (КАПИТАН 03.10.2026: «почему иконка одна и та же?»). Цвет контейнера
   меняется классом .cat-icon--{color} — те же классы, что в каталоге. */
.nz-state__ico { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }
.nz-state__ico[hidden] { display: none !important; }
.nz-state__label {
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.5vw, 1.7rem);
  font-weight: 800; letter-spacing: -0.025em; color: var(--color-text);
  margin: 0; line-height: 1.1;
}
/* .nz-state__dot удалён 03.10.2026 вместе с точкой-разделителем. */
/* .nz-state__n (счётчик «N позиций» в шапке) удалён 03.10.2026:
   КАПИТАН — «количество позиций из заголовка можно убрать, достаточно того,
   что есть на карточке». Числа остались на карточках зон (.nz-zone__n). */
@media (max-width: 679px) {
  .nz-state { gap: 12px; }
  .nz-state__icon { width: 48px; height: 48px; padding: 10px; border-radius: 14px; }
}
/* .nz-reset (кнопка «Показать все зоны») удалена 03.10.2026 вместе с самой
   кнопкой: сброс делает повторный клик по активной карточке зоны. */

/* ── 4. Мини-каталог: чипы-фильтр + сетка карточек ──────────── */
.nz-catalog { background: none; border: 0; border-radius: 0; padding: 0; margin-bottom: 0; }
/* .nz-catalog__head / __title / __lead удалены 03.10.2026: роль шапки
   мини-каталога выполняет строка состояния .nz-state (аудит мёртвого CSS:
   8 селекторов без единого вхождения в разметке). */
.nz-picks { scroll-margin-top: 90px; }
/* .nz-chips / .nz-chip / .nz-chip__n удалены 03.10.2026 — ряд чипов-фильтра
   заменён карточками зон (.nz-zone) и строкой состояния .nz-state. */
.nz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px; align-items: stretch; }
.nz-item { display: block; }
.nz-item[hidden] { display: none !important; }
.nz-item > .product-card { height: 100%; }
.nz-empty {
  display: none; padding: 28px; text-align: center; color: var(--color-text-faint);
  font-size: var(--text-sm); border: 1.5px dashed var(--color-border); border-radius: var(--radius-lg);
}
.nz-empty.is-on { display: block; }
.nz-more { margin: 22px 0 0; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.nz-more__note { font-size: var(--text-sm); color: var(--color-text-faint); }

/* ── 5. Финальный CTA — СЕЙЧАС НЕ ИСПОЛЬЗУЕТСЯ ─────────────────
   03.10.2026: секция «Нужен расчёт под ваш объём?» заменена блоком
   «Связаться с нами» со страницы /contacts/ (см. раздел 7 ниже) — тот несёт
   те же телефоны и почту. Правила оставлены как есть: вернуть CTA — это
   одна строка в build_content.py, стили уже готовы. */
.nz-cta {
  background: linear-gradient(135deg, #0b1f52 0%, #1552d4 100%);
  border-radius: var(--radius-xl); padding: 36px 32px; color: #fff; margin-bottom: 0;
  display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap;
}
.nz-cta__title { font-family: var(--font-display); font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 800; margin: 0 0 8px; letter-spacing: -.02em; }
.nz-cta__text { font-size: var(--text-sm); opacity: .88; margin: 0; max-width: 520px; line-height: 1.6; }
.nz-cta__right { display: flex; flex-direction: column; gap: 8px; }
.nz-cta__phone {
  font-family: var(--font-display); font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 800;
  color: #fff; text-decoration: none; white-space: nowrap;
}
.nz-cta__phone:hover { color: #ffd9c2; }
.nz-cta__mail { font-size: var(--text-sm); color: rgba(255,255,255,.85); text-decoration: none; }
.nz-cta__mail:hover { color: #fff; text-decoration: underline; }
@media (max-width: 760px) { .nz-cta { padding: 26px 22px; } .nz-catalog { padding: 20px 16px 24px; } }

/* ── 6. Карточка-модель (mcard--simple) ─────────────────────────
   Эти правила на боевом живут в inline <style> страницы категории,
   в файлах CSS их нет. Здесь — точная копия нужного минимума,
   чтобы карточка на нишевой странице выглядела байт-в-байт как в каталоге.
   ─────────────────────────────────────────────────────────────── */
.nz-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); align-items: stretch; }
.mcard__media { position: relative; aspect-ratio: 1/1; background: #fff; overflow: hidden; }
.mcard__photo { display: block; width: 100%; height: 100%; }
.mcard__photo img { width: 100%; height: 100%; object-fit: contain; padding: 12px; box-sizing: border-box; transition: opacity .18s; }
.mcard__title-row { display: flex; align-items: baseline; gap: 6px; justify-content: space-between; }
.mcard__name { color: inherit; text-decoration: none; }
.mcard__name:hover { color: #1552d4; }
.mcard__badge { font-size: 9.5px; background: #eef3ff; color: #1552d4; border-radius: 999px; padding: 2px 6px; white-space: nowrap; font-weight: 700; flex: 0 0 auto; }
.mcard__all { display: inline-block; margin-top: 5px; font-size: 11px; color: #1552d4; text-decoration: none; border-bottom: 1px dashed rgba(21,82,212,.4); }
.mcard__all:hover { border-bottom-style: solid; }
.mcard.mcard--simple .product-card__price-row { padding: 0; width: auto; min-height: 34px; align-self: center; justify-content: center; }
.mcard.mcard--simple .pc-price { flex: 0 0 auto; width: auto; min-width: 0; align-items: center; text-align: center; }
.mcard.mcard--simple .pc-price__main { text-align: center; }
.mcard--simple .mcard__from { font-variant-numeric: tabular-nums; white-space: nowrap; text-align: center; }
.mcard--simple .product-card__body { padding: 16px 16px 0; }
.mcard--simple .mc-simple__hint { color: #5F7391; margin-top: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mcard--simple .mc-simple__arts, .mcard--simple .mc-simple__sizes { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mcard--simple .mc-simple__arts { display: block; }
.mcard--simple .product-card__add-full { text-decoration: none; }
.mcard--simple .product-card__add-full:hover { text-decoration: none; color: #fff; }
.mcard__cnt { align-self: flex-start; }
.mcard__go .add-label { gap: 5px; }
.mcard__go .add-label::after { content: "→"; }

/* ══ ФОТОГАЛЕРЕЯ НИШИ (03.10.2026) ══
   По образцу .production-gallery со страницы /contacts/ — та же сетка
   1 большой кадр слева на две строки + 2 малых справа, подписи поверх снизу. */
.nz-gallery {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  grid-template-rows: 260px 260px;
  gap: 16px;
  border-radius: var(--radius-xl);
  overflow: hidden;
}
@media (max-width: 700px) {
  .nz-gallery { grid-template-columns: 1fr; grid-template-rows: auto; }
  .nz-gallery__main { grid-row: auto !important; }
}
.nz-gallery__main { grid-row: 1 / 3; }
.nz-gallery__item { position: relative; overflow: hidden; }
.nz-gallery__item img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .5s ease;
}
.nz-gallery__item:hover img { transform: scale(1.04); }
.nz-gallery__caption {
  position: absolute; bottom: 0; right: 0; bottom: 0; left: 0;
  padding: 20px 18px 16px;
  background: linear-gradient(to top, rgba(11,31,82,.72), transparent);
  color: #fff; font-size: var(--text-sm); font-weight: 600; line-height: 1.35;
}
@media (max-width: 700px) {
  .nz-gallery__item, .nz-gallery__main { height: 220px; }
}


/* ── 7. «Связаться с нами» — блок со страницы /contacts/ ───────────────
   КАПИТАН 03.10.2026: «Поставь „Связаться“ как в контактах».
   Ниже — ПОБАЙТОВАЯ копия правил из inline-<style> страницы контактов
   (раздел «Контактный блок» + «Форма обратной связи»). Своих значений не
   добавлял: любые правки здесь надо сверять с /contacts/, иначе блоки
   разъедутся. Классы общие (.contact-card/.contact-row/.contact-form/
   .form-group), поэтому на нишевых страницах других таких элементов нет —
   коллизий нет. Форму обслуживает /assets/js/feedback.js. */

    .contacts-intro {
      margin-bottom: 32px;
    }
    .contacts-intro .section-lead {
      max-width: 600px;
    }
    .contacts-section {
      padding: 0 0 80px;
    }
    .contacts-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px;
      align-items: stretch;
    }
    @media (max-width: 860px) {
      .contacts-grid { grid-template-columns: 1fr; }
    }

    .contact-card {
      background: var(--color-surface);
      border: 1.5px solid var(--color-border);
      border-radius: var(--radius-xl);
      padding: 36px 32px;
      display: flex;
      flex-direction: column;
    }
    .contact-card__icon {
      width: 52px; height: 52px;
      border-radius: var(--radius-lg);
      background: #eff4ff;
      color: #1552d4;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 20px;
    }
    [data-theme="light"] .contact-card__icon { background: rgba(21,82,212,0.18); }
    .contact-card__title {
      font-family: var(--font-display);
      font-size: var(--text-xl);
      font-weight: 700;
      margin-bottom: 20px;
      color: var(--color-text);
    }
    .contact-row {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      padding: 14px 0;
      border-bottom: 1px solid var(--color-border);
      color: var(--color-text);
      font-size: var(--text-base);
    }
    .contact-row:last-child { border-bottom: none; padding-bottom: 0; }
    .contact-row:first-of-type { padding-top: 0; }
    .contact-row__icon {
      flex-shrink: 0;
      width: 36px; height: 36px;
      background: #f0f4ff;
      border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      color: #1552d4;
    }
    [data-theme="light"] .contact-row__icon { background: rgba(21,82,212,0.15); }
    .contact-row__label {
      font-size: var(--text-xs);
      color: var(--color-text-faint);
      margin-bottom: 4px;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      font-weight: 600;
    }
    .contact-row__value { font-weight: 500; }
    .contact-row__value a {
      color: var(--color-primary);
      text-decoration: none;
      font-weight: 600;
    }
    .contact-row__value a:hover { text-decoration: underline; }

    /* Форма обратной связи */
    .contact-form { display: flex; flex-direction: column; gap: 16px; }
    .form-group { display: flex; flex-direction: column; gap: 6px; }
    .form-group label {
      font-size: var(--text-sm);
      font-weight: 600;
      color: var(--color-text);
    }
    .form-group input,
    .form-group textarea,
    .form-group select {
      background: var(--color-bg);
      border: 1.5px solid var(--color-border);
      border-radius: var(--radius-md);
      padding: 11px 14px;
      font-size: var(--text-base);
      font-family: var(--font-body);
      color: var(--color-text);
      outline: none;
      transition: border-color .15s;
      width: 100%;
      box-sizing: border-box;
    }
    .form-group input:focus,
    .form-group textarea:focus,
    .form-group select:focus {
      border-color: var(--color-primary);
      box-shadow: 0 0 0 3px oklch(0.55 0.22 260 / 0.12);
    }
    .form-group textarea { resize: vertical; min-height: 110px; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    @media (max-width: 500px) { .form-row { grid-template-columns: 1fr; } }
    .form-consent { display: flex; align-items: flex-start; gap: 10px; }
.form-consent input { width: auto; flex-shrink: 0; margin-top: 3px; accent-color: var(--color-primary); }
.form-consent label { font-size: var(--text-xs); font-weight: 400; color: var(--color-text-faint); line-height: 1.6; }
.form-consent a { color: var(--color-primary); text-decoration: none; }
.form-consent a:hover { text-decoration: underline; }
.form-note {
      font-size: var(--text-xs);
      color: var(--color-text-faint);
    }
