/* ═══ Статьи /blog/ (templates/v2/blog.php) ══════════════════════════════
   Поверх v2.css и v2-pages.css. Здесь же общие детали ленты и архивов:
   чипы рубрик, лента, группы рубрик (файл подключается
   и на шаблоне archive — inc/v2-pages/blog.php).
   Значения — только токены .v2 (DESIGN.md). От 375 px вверх. */

/* ── Шапка ленты и архива: чипы сразу под ней ───────────────────────── */
.v2 .phead.bhead,.v2 .phead.ahead{padding-bottom:var(--s-4)}

/* ── Чипы рубрик: на телефоне одна строка с прокруткой вбок ──────────── */
.v2 .bchips__list{display:flex;gap:var(--s-1);margin:calc(var(--s-1) * -1) calc(var(--gut) * -1);padding:var(--s-1) var(--gut);
  scroll-padding-inline:var(--gut);overflow-x:auto;scrollbar-width:none;list-style:none}
.v2 .bchips__list::-webkit-scrollbar{display:none}
/* Хвост ряда — распоркой ::after (WebKit не считает padding-inline-end у прокручиваемого flex-ряда), маска
   у правого края — общая (v2.css, «ряды навигации с прокруткой», 27.10). */
@media (max-width:599px){
  .v2 .bchips__list{padding-right:0}
  .v2 .bchips__list::after{content:'';flex:0 0 calc(var(--gut) - var(--s-1))}
}
.v2 .bchips__list>li{flex:0 0 auto}
.v2 .bchips__list a[href^="#"]{background:transparent;color:var(--acc);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:var(--ul-off-l)}
.v2 .bchips__list a[href^="#"]:hover{background:var(--linen);color:var(--acc-ink)}
@media (min-width:600px){
  .v2 .bchips__list{flex-wrap:wrap;margin:0;padding:0;overflow:visible}
}

/* ── Лента: главная статья и сетка ──────────────────────────────────── */
.v2 .bfeed{padding-top:var(--s-5)}
.v2 .bfeed .pfoot{margin-top:var(--s-6)}
.v2 .bfeed .pfoot+.pager{margin-top:var(--s-4)}
/* Телефон: после главной статьи — строки, кадр --read-thumb слева, текст справа.
   13 карточек во всю ширину давали стену в 4 800 px, и «Портрет по фотографии»
   уходил на 9-й экран. Строкой карточка ~100 px, ни одной статьи не пропадает.
   От 600 px — снова сетка с обложкой 3:2 (правила ниже возвращают её). */
.v2 .bfeed .posts{row-gap:var(--s-4)}
.v2 .bfeed .posts>.read:not(.read--lead):not(.read--nocover) .read__a{grid-template-columns:var(--read-thumb) minmax(0,1fr);column-gap:var(--s-3);align-items:center}
.v2 .bfeed .posts>.read:not(.read--lead):not(.read--nocover) .read__cover{aspect-ratio:1}
@media (min-width:600px){
  .v2 .bfeed .posts{row-gap:var(--s-5)}
  .v2 .bfeed .posts>.read:not(.read--lead):not(.read--nocover) .read__a{grid-template-columns:minmax(0,1fr);column-gap:0;align-items:stretch}
  .v2 .bfeed .posts>.read:not(.read--lead):not(.read--nocover) .read__cover{aspect-ratio:3/2}
}
@media (min-width:900px){
  .v2 .bfeed{padding-top:var(--s-6)}
  .v2 .bfeed .posts{row-gap:var(--s-6)}
  /* Главная статья — сигнатура ленты: обложка шире, заголовок крупнее отрывка. */
  .v2 .bfeed .read--lead{padding-bottom:var(--s-4)}
  /* Обложка и текст поровну (6 / 6) — теперь у общего .read--lead (v2-pages.css). */

  /* Ритм ленты вместо четырёх одинаковых рядов по три: в каждой дюжине
     статей ряды «две широкие · три · две широкие · три · две широкие»
     (2 + 3 + 2 + 3 + 2 = 12 — дюжина закрывает ряды без одинокой карточки).
     Сетка 6 колонок: узкая карточка — 2, широкая — 3. Счёт идёт от главной
     статьи (первая страница, «Показать ещё» дописывает дюжинами) или от
     первой карточки (страницы /page/N/ без главной). */
  .v2 .bfeed .posts{grid-template-columns:repeat(6,minmax(0,1fr))}
  .v2 .bfeed .posts>.read{grid-column:span 2}
  .v2 .bfeed .posts>.read--lead{grid-column:1 / -1}
  .v2 .bfeed .posts>:is(
      .read--lead~.read:is(:nth-child(12n+2),:nth-child(12n+3),:nth-child(12n+7),:nth-child(12n+8),:nth-child(12n+12),:nth-child(12n+13)),
      .read:first-child:not(.read--lead),
      .read:first-child:not(.read--lead)~.read:is(:nth-child(12n+1),:nth-child(12n+2),:nth-child(12n+6),:nth-child(12n+7),:nth-child(12n+11),:nth-child(12n+12))
    ){grid-column:span 3}
  /* Широкая карточка — заголовок Jost 500 --t-h3, как у типографской карточки. */
  .v2 .bfeed .posts>:is(
      .read--lead~.read:is(:nth-child(12n+2),:nth-child(12n+3),:nth-child(12n+7),:nth-child(12n+8),:nth-child(12n+12),:nth-child(12n+13)),
      .read:first-child:not(.read--lead),
      .read:first-child:not(.read--lead)~.read:is(:nth-child(12n+1),:nth-child(12n+2),:nth-child(12n+6),:nth-child(12n+7),:nth-child(12n+11),:nth-child(12n+12))
    ):not(.read--nocover) .read__t{font:500 var(--t-h3)/1.25 var(--f-d);-webkit-line-clamp:2}
}
/* Статья без обложки и без картинок в тексте (10 статей 2026 года, вопрос 44):
   не серая плашка, а типографская карточка на льне. На телефоне — строка
   ленты по высоте текста (поля --s-3, заголовок как у соседних строк);
   от 600 px — пропорция 3:2 у пункта сетки (держит высоту обложки соседей,
   ссылка заполняет его целиком: height 100 % в v2-pages.css), заголовок
   крупнее, Jost 500 --t-h3, прижат к низу, как подпись на обложке. */
.v2 .bfeed .read--nocover .read__a{align-content:end;gap:var(--s-1);padding:var(--s-3)}
.v2 .bfeed .read--nocover .read__t{-webkit-line-clamp:4}
@media (min-width:600px){
  .v2 .bfeed .read--nocover{aspect-ratio:3/2}
  .v2 .bfeed .read--nocover .read__a{padding:var(--s-4)}
  .v2 .bfeed .read--nocover .read__t{font:500 var(--t-h3)/1.25 var(--f-d)}
}

/* Ряд предложения после ленты: верх — ритм секции, низ короче (дальше рубрики). */
.v2 .bfeed+.offer--row{padding-bottom:var(--band)}

/* ── Рубрики по группам ─────────────────────────────────────────────── */
.v2 .offer--row+.rgroups{padding-top:0}
.v2 .rgroups__grid{display:grid;gap:var(--s-5) var(--s-4)}
.v2 .rgroup{display:grid;gap:var(--s-2);align-content:start;min-width:0}
.v2 .rgroup__t{font:600 var(--t-h3)/1.25 var(--f-d)}
.v2 .rgroup__list{margin:0;padding:0;list-style:none}
.v2 .rgroup__sum{display:inline-flex;align-items:center;gap:var(--s-2);min-height:var(--tap);font-weight:600;color:var(--acc);
  list-style:none;cursor:pointer;border-radius:var(--r-btn)}
.v2 .rgroup__sum::-webkit-details-marker{display:none}
.v2 .rgroup__sum:hover{color:var(--acc-ink)}
.v2 .rgroup__more[open] .qa__pm::after{transform:rotate(0)}
.v2 .rgroup__more:not([open]) .rgroup__off,.v2 .rgroup__more[open] .rgroup__on{display:none}
.v2 .rgroup__more[open] .rgroup__list{margin-top:var(--s-1)}
@media (min-width:600px){
  .v2 .rgroups__grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--col-gap)}
}
@media (min-width:1000px){
  .v2 .rgroups__grid{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s-5)}
}