@charset "UTF-8";
/* ============================================================================
   news_layout_guard.css — НОВОСТЬ-ВЁРСТКА-И-БАННЕР-1 (тег NEWS-LAYOUT-BANNER-1),
   04.10.2026. Задача _nb3_*.

   ЧТО ЭТО. Отдельный слой ПОВЕРХ файлов соседей:
     • news_afisha_style.css — НОВОСТЬ-В-СТИЛЕ-СТАРОЙ-АФИШИ-1 (_na1_*),
     • news_article_psd.css — НОВОСТЬ-И-СТАТЬЯ-ПО-PSD-1 (_ns2_*),
     • adv_slots.css        — БАННЕРЫ-СПРАВА-1 (_bn2_*).
   Чужие файлы не правятся (правила 14, 18, 24): свои три правила кладём своим
   файлом, подключённым ПОСЛЕ них (та же схема, что у _ns2_).

   ЗАЧЕМ (замеры — _clubber/_nb2_work/замеры_до_live.json, 04.10.2026).

   1. ТЕКСТ НИКОГДА НЕ СЖИМАЕТСЯ В ПОЛОСКУ.
      Раскладка верха — flex (.cb-nas-top): обложка .cb-nas-pic и текст
      .cb-nas-txt. У .cb-nas-txt стоит flex: 1 1 auto БЕЗ min-width, то есть
      при нехватке места колонка текста может сжаться до min-content — до
      ширины самого длинного слова («слова по одному», полоска ~100 px).
      Здесь: flex-wrap: wrap (мало места — текст уходит ПОД обложку во всю
      ширину) и min-width: 320px у колонки текста.

   2. ОБЛОЖКА НЕ «ВО ВСЮ ВЫСОТУ».
      news_article_psd.css:49-56 разрешает картинке до 671 px по высоте (число
      PSD-постера). Владелец 04.10.2026: «обложка огромная» — вертикальная
      обложка 800x1200 рисуется 475x671, то есть во всю высоту экрана.
      Здесь высота обложки ограничена 400 px; object-fit: cover — пропорции
      не искажаются, кадр обрезается по центру. Это осознанное отступление от
      числа макета по прямому замечанию владельца.

   3. ПУСТОЙ БОКОВОЙ БЛОК НИЧЕГО НЕ ЗАНИМАЕТ.
      .cb-nas-side без баннеров и без данных «Уже идут» — пустой прямоугольник
      467 px («справа пустая область»). Шаблон news_item_v2.tpl печатает этот
      блок только когда внутри что-то есть, поэтому :empty его убирает —
      раскладка не зависит от наличия баннеров.

   Файл в UTF-8, перевод строки LF. PHP/CSS 5.6-совместимо.
   ========================================================================= */

/* --- 1. колонки верхней части -------------------------------------------- */
.cb-nas .cb-nas-top { flex-wrap: wrap; }
.cb-nas .cb-nas-txt { flex: 1 1 320px; min-width: 320px; }

/* --- 2. обложка: не выше 400 px ------------------------------------------ */
.cb-nas .cb-nas-pic img { max-height: 400px; object-fit: cover; }

/* --- 3. пустой боковой блок не занимает место ---------------------------- */
.cb-nas-side:empty { display: none; }

/* --- 4. страница СТАТЬИ: у неё СВОИ имена обёрток ------------------------- */
/* Ряд статьи называется .cb-art-wrap, колонка текста — .cb-art-main
   (article_own.css:35-49), а обложка стоит СВЕРХУ контент-колонки, а не в ряду
   с текстом, как у новости. Механизм полоски тот же самый: если у .cb-art-main
   не применилось min-width (у владельца в браузере устаревшая копия CSS —
   правило 11а), узкий ряд сжимает текст до одного слова в строке. */
.cb-art-own .cb-art-wrap { flex-wrap: wrap; }
.cb-art-own .cb-art-main { flex: 1 1 320px; min-width: 320px; }
/* Обложка статьи — своя: её числа задаёт article_own.css:56-67, а правило
   «не выше 400 px» относится к ряду «обложка слева, текст справа», которого
   на странице статьи нет. Здесь сохраняем ТЕКУЩЕЕ поведение статьи
   (высоту ограничивает news_article_psd.css:49-56 числом 671 — иначе
   портретная обложка 800x1200 рисовалась бы 267x400 вместо 447x671). */
.cb-art-own .cb-nas-pic img { max-height: 671px; }
@media (max-width: 768px) {
  .cb-art-own .cb-art-wrap { display: block; }
  .cb-art-own .cb-art-main { flex: none; min-width: 0; }
}

/* --- узкие экраны: те же числа колонок, что у соседей -------------------- */
@media (max-width: 1200px) {
  .cb-nas .cb-nas-pic { flex: 0 0 380px; max-width: 380px; }
}
@media (max-width: 900px) {
  .cb-nas .cb-nas-pic { flex: 0 0 300px; max-width: 300px; }
}
@media (max-width: 768px) {
  .cb-nas .cb-nas-top { display: block; }
  .cb-nas .cb-nas-txt { flex: none; min-width: 0; }
  .cb-nas .cb-nas-pic { flex: none; max-width: 100%; }
  .cb-nas .cb-nas-pic img { max-height: none; }
}

/* ===========================================================================
   5. МАКЕТ-vs-БОЕВОЙ-1 (тег LAYOUT-MAKET-COMPARE-1), 04.10.2026.
   (раздел 4 в этом файле занят страницей СТАТЬИ — работа соседа.)
   Приводим страницу НОВОСТИ к макету статьи (владелец, снимок 2014,
   «СТАТЬИ / САРУ ОКС РАЗДЕЛ МАХИМ»; рендер PSD
   _clubber/_dn1_work/макет_превью/stati_vnutr_full.png, 1440x1911).

   ЧИСЛА МАКЕТА (замер _clubber/_mk1_work/макет_числа.tsv, пиксельный скан;
   колонка контента — по плашке «Поделиться» #e0e0e0: x134..1003 = 870):
     обёртка контента .......... x 134..1302 = 1169 (у .wrapper 1170)
     колонка контента .......... x 134..1003 = 870  (74,4 % обёртки)
     зазор между колонками ..... 30 px              (2,6 %)
     колонка баннеров .......... x 1034..1302 = 269 (23,0 %) — картинки 240
     обложка ................... ВНУТРИ колонки контента, 669 x 423, слева
                                 (669 из 870 = 77 % ширины колонки)
     плашка «Поделиться» ....... y1020..1068 (h 49), во всю колонку 870
     колонка комментариев ...... 553
     заголовок ................. НАД обложкой (y220), обложка ниже (y289)
     баннер 1 .................. y220 — на уровне ЗАГОЛОВКА (три баннера)
   Доли контент : баннеры = 870 : 269 = 76 % : 24 % (владелец говорил «≈70/25»)

   ВТОРОЙ СТОРОЖ НЕ ЗАВОДИМ: это тот же слой поверх news_afisha_style.css
   (сосед _na1_*), news_article_psd.css (сосед _ns2_*) и adv_slots.css
   (сосед _bn2_*) — чужие файлы не правим (правила 14, 18, 24).

   ВАЖНО: селекторы ПРИВЯЗАНЫ К СТРАНИЦЕ НОВОСТИ (#news). Этот же сторож
   подключают ещё две страницы — СТАТЬЯ (articles/article_v2.tpl, корень
   #articles, класс .cb-art-own) и НОВОСТЬ ЗАВЕДЕНИЯ (place/blog_v2.tpl, корень
   #place-blog-card). Их раскладку ведёт сосед, и у статьи обложка уже стоит
   сверху, поэтому наши правила там НЕ действуют: без #news они бы переписали
   чужую работу (правила 14, 18, 24).

   Нумерация: раздел 4 в файле — статья (сосед), наш идёт ПОСЛЕ него, чтобы
   его правила не перебивать (правило 14: чужие правки сохраняем).
   ------------------------------------------------------------------------ */

/* --- 5.1 два столбца: [заголовок+обложка+текст] [баннеры] ----------------
   870 + 30 + 269 = 1169 <= 1170 (обёртка .wrapper) — переполнения нет. */
#news .cb-nas .cb-nas-cols { display: flex; align-items: flex-start; gap: 30px; }
#news .cb-nas .cb-nas-main { flex: 1 1 auto; min-width: 0; max-width: 870px; }

/* --- 5.2 заголовок НАД обложкой (макет: y220 -> обложка y289) ----------- */
#news .cb-nas .cb-nas-top { display: block; }
#news .cb-nas .cb-nas-txt { flex: none; max-width: none; min-width: 0; }

/* --- 5.3 обложка — ВНУТРИ колонки контента: 669 из 870 (как в макете) ---
   Высоту НЕ трогаем: её держит раздел 2 этого файла (max-height: 400 px) —
   это прямая просьба владельца «обложка огромная». */
#news .cb-nas .cb-nas-pic {
  flex: none;
  width: 669px;
  max-width: 100%;
  margin: 18px 0 16px;
}
#news .cb-nas .cb-nas-pic img { width: 100%; max-width: 100%; }

/* --- 5.4 колонка баннеров: 269 px, от САМОГО ВЕРХА материала ------------ */
#news .cb-nas-side { flex: 0 0 269px; max-width: 269px; min-width: 0; }
#news .cb-nas .cb-adv-rail { max-width: 269px; }

/* --- 5.5 комментарии — в левой колонке, 553 px (как в макете) ----------- */
#news .cb-nas .cb-nas-bottom { display: block; }
#news .cb-nas .cb-nas-cmt { max-width: 553px; }

/* --- 5.6 плашка «Поделиться» — во всю колонку контента (макет 870) ------
   У соседа (news_article_psd.css) ей задано 668 px — число другой раскладки. */
#news .cb-nas .cb-shr { width: 100%; max-width: 100%; }

/* --- 5.7 узкие экраны ---------------------------------------------------- */
@media (max-width: 1200px) {
  #news .cb-nas .cb-nas-cols { gap: 60px; }
  #news .cb-nas-side { flex: 0 0 270px; max-width: 270px; }
}
@media (max-width: 1000px) {
  #news .cb-nas .cb-nas-cols { display: block; }
  #news .cb-nas .cb-nas-main { max-width: none; }
  #news .cb-nas-side { max-width: 270px; margin: 28px 0 0; }
}
@media (max-width: 768px) {
  #news .cb-nas .cb-nas-cols { display: block; }
  #news .cb-nas .cb-nas-main { max-width: none; }
  /* на телефоне обложка — во всю колонку (669 px туда не влезает) */
  #news .cb-nas .cb-nas-pic { width: 100%; margin: 14px 0 12px; }
  #news .cb-nas-side { max-width: none; margin: 22px 0 0; }
  #news .cb-nas .cb-adv-rail { max-width: 270px; margin: 0 auto; }
}


/* ===========================================================================
   6. РАСКЛАДКА-НОВОСТИ-ЗАВЕДЕНИЯ-1 (тег PLACE-NEWS-LAYOUT-1), 04.10.2026.
   Приводим страницу НОВОСТИ ЗАВЕДЕНИЯ (/place/blog_v2.tpl ->
   /place/blog.php?q=..&blog=..) к ТОМУ ЖЕ макету ПСД «Статьи внутренняя»
   и ТЕМИ ЖЕ приёмами, что страницу новости сайта (раздел 5 выше):
     колонка контента 870, зазор 30, колонка баннеров 269 от самого верха,
     обложка 669 ВНУТРИ колонки, заголовок НАД обложкой.

   ПОЧЕМУ ОТДЕЛЬНЫЙ РАЗДЕЛ. У страницы заведения СВОЙ корень разметки —
   #place-blog-card (см. выше, комментарий к разделу 5, и
   news_afisha_style.css:210). Селекторы раздела 5 привязаны к корню страницы
   новости сайта и здесь НЕ действуют — это и правильно: без привязки они
   переписали бы чужую
   работу (правила 14, 18, 24). Второй файл-сторож не заводим: это тот же
   слой поверх news_afisha_style.css, news_article_psd.css и adv_slots.css.

   ЧИСЛА те же, что в разделе 5 (макет, _mk1_work/макет_числа.tsv):
      колонка контента 870 · зазор 30 · правая колонка 269 (креативы 240)
      обложка 669 внутри колонки · комментарии 553
   Сумма 870 + 30 + 269 = 1169 <= 1170 (обёртка .wrapper) — переполнения нет.
   Файл в UTF-8, перевод строки LF.
   ------------------------------------------------------------------------ */

/* --- 6.1 два столбца: [заголовок+обложка+текст] [баннеры] ---------------- */
#place-blog-card .cb-nas .cb-nas-cols { display: flex; align-items: flex-start; gap: 30px; }
#place-blog-card .cb-nas .cb-nas-main { flex: 1 1 auto; min-width: 0; max-width: 870px; }

/* --- 6.2 заголовок НАД обложкой (как в макете) -------------------------- */
#place-blog-card .cb-nas .cb-nas-top { display: block; }
#place-blog-card .cb-nas .cb-nas-txt { flex: none; max-width: none; min-width: 0; }

/* --- 6.3 обложка — ВНУТРИ колонки контента: 669 из 870 ------------------
   Высоту НЕ трогаем: её держит раздел 2 этого файла (max-height: 400 px). */
#place-blog-card .cb-nas .cb-nas-pic {
  flex: none;
  width: 669px;
  max-width: 100%;
  margin: 18px 0 16px;
}
#place-blog-card .cb-nas .cb-nas-pic img { width: 100%; max-width: 100%; }

/* --- 6.4 колонка баннеров: 269 px, от САМОГО ВЕРХА материала ------------ */
#place-blog-card .cb-nas-side { flex: 0 0 269px; max-width: 269px; min-width: 0; }
#place-blog-card .cb-nas .cb-adv-rail { max-width: 269px; }

/* --- 6.5 комментарии — в левой колонке, 553 px (как в макете) ----------- */
#place-blog-card .cb-nas .cb-nas-bottom { display: block; }
#place-blog-card .cb-nas .cb-nas-cmt { max-width: 553px; }

/* --- 6.6 плашка «Поделиться» — во всю колонку контента (макет 870) ------ */
#place-blog-card .cb-nas .cb-shr { width: 100%; max-width: 100%; }

/* --- 6.7 узкие экраны ---------------------------------------------------- */
@media (max-width: 1200px) {
  #place-blog-card .cb-nas .cb-nas-cols { gap: 60px; }
  #place-blog-card .cb-nas-side { flex: 0 0 270px; max-width: 270px; }
}
@media (max-width: 1000px) {
  #place-blog-card .cb-nas .cb-nas-cols { display: block; }
  #place-blog-card .cb-nas .cb-nas-main { max-width: none; }
  #place-blog-card .cb-nas-side { max-width: 270px; margin: 28px 0 0; }
}
@media (max-width: 768px) {
  #place-blog-card .cb-nas .cb-nas-cols { display: block; }
  #place-blog-card .cb-nas .cb-nas-main { max-width: none; }
  /* на телефоне обложка — во всю колонку (669 px туда не влезает) */
  #place-blog-card .cb-nas .cb-nas-pic { width: 100%; margin: 14px 0 12px; }
  #place-blog-card .cb-nas-side { max-width: none; margin: 22px 0 0; }
  #place-blog-card .cb-nas .cb-adv-rail { max-width: 270px; margin: 0 auto; }
}


/* ===========================================================================
   7. ПЕРЕНОСЫ-И-МЕЛКИЕ-ОБЛОЖКИ-1 (тег LINEBREAKS-AND-SMALL-COVERS-1),
   05.10.2026. СОХРАНЯЕМ ПЕРЕНОСЫ СТРОК ПОСТА.
   Текст новости заведения выводится СЫРЫМ: в разметке лежат «\n», тегов <br>
   нет (замер: blog 58 — LF=6, <br>=0; blog 60 — LF=13, <br>=0), и браузер их
   схлопывает в пробел — пост выглядит одной сплошной строкой.
   `white-space: pre-line` сохраняет переводы строки и по-прежнему схлопывает
   пробелы, поэтому абзацы, списки и заголовки ВНУТРИ текста не меняются:
   текстов с HTML в place_blog — 0 из 76 (разметку pre-line разъехать не может).
   Селектор привязан к контейнеру текста на странице новости заведения:
     #place-blog-card .text — и страница одной новости (place/blog_v2.tpl:339),
       и строка списка (place/blog_v2.tpl:484).
   Страницы новости сайта, статьи и события свой <br> уже получают в PHP
   (news/index.php:151, articles/index.php:139, poster/main.php:192), поэтому
   их НЕ трогаем: у статьи nl2br оставляет и «\n», и там pre-line удвоил бы
   переносы (207 -> 414, замер на стенде).
   Файл в UTF-8, перевод строки LF.
   ------------------------------------------------------------------------ */
#place-blog-card .text { white-space: pre-line; }
