/* ═══ СТАТЬИ ДОКТОРА НА СТРАНИЦЕ БЛОГА (24.09) ════════════════════════
   Страница /blog/ поверх home.css: оттуда приезжают шапка страницы,
   заголовки секций (.nx-head), счётчики, указатель прессы и колофон. Здесь —
   только карточки своих статей: они читаются на сайте, поэтому с фото, темой
   и временем чтения.

   Язык тот же, что у главной: белое, волосяные лавандовые линии, Arsenal в
   заголовках, Open Sans в подписях, радиус панели 18. Теней нет — карточку
   держит фото. Бежевого нет (правило 20.09). */

/* у страницы нет hero, и полный отступ секции давал 170 px пустоты между
   подзаголовком блога и первой выдачей */
body.blog-page .bown{padding-top:clamp(40px,5vw,64px)}
body.blog-page .bcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
body.blog-page .bcard{display:flex;flex-direction:column;gap:18px;
  color:inherit;text-decoration:none}
body.blog-page .bcard__img{display:block;aspect-ratio:4/3;overflow:hidden;
  border-radius:var(--r-panel);background:var(--lav-deep)}
body.blog-page .bcard__img img{display:block;width:100%;height:100%;object-fit:cover;
  transition:transform .8s var(--r-ease)}
body.blog-page .bcard:hover .bcard__img img{transform:scale(1.04)}
body.blog-page .bcard__b{display:flex;flex-direction:column;gap:8px}
body.blog-page .bcard__topic{font:700 var(--fs-tag)/1.3 'Open Sans',sans-serif;
  letter-spacing:.14em;text-transform:uppercase;color:var(--nx-violet)}
body.blog-page .bcard__t{font-family:'Arsenal',Georgia,serif;font-weight:700;
  font-size:var(--fs-h3);line-height:1.2;color:var(--nx-ink);transition:color .25s}
body.blog-page .bcard:hover .bcard__t{color:var(--nx-violet)}
body.blog-page .bcard .press-row__meta{font-size:var(--fs-fine)}
body.blog-page .bcard:focus-visible{outline:2px solid var(--nx-violet);outline-offset:6px;
  border-radius:var(--r-panel)}
@media(max-width:1100px){
  body.blog-page .bcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}
}
/* на телефоне четыре фото по ширине экрана — полторы тысячи пикселей
   прокрутки до прессы; строка с миниатюрой держит всё на экране */
@media(max-width:640px){
  body.blog-page .bcards{grid-template-columns:1fr;gap:0}
  body.blog-page .bcard{flex-direction:row;align-items:center;gap:16px;
    padding:16px 0;border-top:1px solid var(--hair-soft)}
  body.blog-page .bcard:last-child{border-bottom:1px solid var(--hair-soft)}
  body.blog-page .bcard__img{flex:0 0 96px;aspect-ratio:1;border-radius:var(--r-small)}
  body.blog-page .bcard__b{gap:6px}
  body.blog-page .bcard__t{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
  body.blog-page .bcard__img img{transition:none}
}