/* ==========================================================================
   buhgalteriya — блог (home.php), статья (single.php), служебная страница (page.php).
   Раскладка трёх шаблонов и то, чего нет в components.css:

   Обложка статьи ......... .bh-cover (--l)  > __top (№ + __type) + __body (__words + __art)
                            фотографий нет: лист книги с номером записи, словом темы и линейным рисунком рубрики
   Строка статьи .......... .bh-post--cover (с обложкой), .bh-post--lead (первая, крупная); __kind, __by
   Закладки-ссылки ........ .bh-tabs__tab[aria-current="page"] — рубрики блога ведут на свои страницы
   Постраничная навигация . .bh-pager (__info, __list)
   Лента блога ............ .bh-blog (__main, __aside), .bh-rubrics
   Короткий рейтинг ....... .bh-toplist (--wide) > .bh-toplist__row (__main __name __sub __acts)
   Лист документа ......... .bh-doc (__lead, __aside, __body) — статья и все служебные страницы;
                            __h — заголовок раздела, __h3 — подраздел; от 768px слева поле и красная линия,
                            номера списков .bh-ruled внутри листа выносятся в это поле
   Содержание ............. .bh-toc (__title, __list)
   Шапка статьи ........... .bh-art-head, .bh-art-meta, .bh-byline
   Карточка-врезка ........ .bh-card--inline
   Таблица в тексте ....... .bh-doc-table (--wide, --rules)
   ========================================================================== */

/* ---------- Обложка ---------- */
.bh-cover {
  display: grid; grid-template-rows: auto minmax(0, 1fr); flex: none;
  width: 72px; height: 72px; overflow: hidden;
  background: var(--bh-surface); border: var(--bh-border-ink); border-radius: var(--bh-r-0); color: var(--bh-text);
}
.bh-cover__top {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 6px;
  background: var(--bh-bg-2); border-bottom: var(--bh-rule);
  font-family: var(--bh-font-mono); font-weight: var(--bh-fw-bold); font-size: var(--bh-fs-label); line-height: var(--bh-lh-label);
  letter-spacing: var(--bh-ls-caps); text-transform: uppercase; color: var(--bh-text-muted); white-space: nowrap;
}
.bh-cover__type, .bh-cover__words { display: none; }
.bh-cover__body { position: relative; display: grid; place-items: center; min-height: 0; }
.bh-cover__art {
  width: 30px; height: 30px; fill: none; stroke: currentColor;
  stroke-width: var(--bh-icon-stroke); stroke-linecap: square; stroke-linejoin: miter;
}
.bh-cover__art path { vector-effect: non-scaling-stroke; }

/* ---------- Строка статьи с обложкой ---------- */
.bh-post--cover {
  position: relative; grid-template-columns: 72px minmax(0, 1fr);
  grid-template-areas: "cover meta" "title title" "lead lead" "by by";
  gap: 8px 12px; align-items: start;
}
.bh-post--cover > .bh-cover { grid-area: cover; }
.bh-post--cover .bh-post__meta { grid-area: meta; align-self: center; gap: 6px 10px; }
.bh-post--cover .bh-post__title { grid-area: title; text-wrap: pretty; }
.bh-post--cover .bh-post__lead { grid-area: lead; -webkit-line-clamp: 3; max-width: 84ch; }
.bh-post__by { grid-area: by; font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted); }
.bh-post__kind { font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted); }
.bh-post__title a::after { content: ""; position: absolute; inset: 0; }
.bh-post__title a:focus-visible { outline: none; }
.bh-post--cover:focus-within { outline: var(--bh-focus); outline-offset: -2px; }

/* список статей сразу под заголовком блока: линейка заголовка — верх списка */
.bh-block__head + .bh-posts { border-top: 0; margin-top: calc(var(--bh-block-gap) * -1); }
.bh-nowrap { white-space: nowrap; }

/* ---------- Рубрики: закладки-ссылки ---------- */
.bh-tabs__tab[aria-current="page"] { background: var(--bh-bg); color: var(--bh-text); border-top: 3px solid var(--bh-accent); border-bottom-color: var(--bh-bg); }

/* ---------- Лента блога ---------- */
/* закладки рубрик стоят над всем листом: линейка под ними — верхний край ленты и боковой колонки */
.bh-blog-wrap { margin-top: 24px; }
.bh-blog { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--bh-section) var(--bh-gap); align-items: start; border-top: var(--bh-rule); }
.bh-blog .bh-posts { border-top: 0; }
.bh-blog > *, .bh-blog__aside > * { min-width: 0; }
.bh-blog__aside { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px var(--bh-gap); align-items: start; }
.bh-blog__stack { display: grid; gap: 32px; }
.bh-blog__aside .bh-block__head { margin-bottom: 0; }
.bh-blog__aside .bh-toplist, .bh-blog__aside .bh-rubrics { border-top: 0; }
.bh-blog__more { margin-top: 12px; }
.bh-blog__note { margin-top: 12px; font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted); }

.bh-rubrics { border-top: var(--bh-rule); }
.bh-rubrics__item {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: baseline;
  padding: 12px 8px 12px 0; border-bottom: var(--bh-border); transition: background-color var(--bh-t);
}
.bh-rubrics__item:hover { background: var(--bh-surface); }
.bh-rubrics__name { font-weight: var(--bh-fw-semibold); text-decoration: underline; text-decoration-color: var(--bh-line-strong); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.bh-rubrics__item:hover .bh-rubrics__name { color: var(--bh-accent); }
.bh-rubrics__n { font-family: var(--bh-font-mono); font-size: var(--bh-fs-num-s); line-height: var(--bh-lh-num-s); color: var(--bh-text-muted); white-space: nowrap; }
.bh-rubrics__what { grid-column: 1 / -1; font-size: var(--bh-fs-small); line-height: var(--bh-lh-small); color: var(--bh-text-muted); }

/* ---------- Постраничная навигация ---------- */
.bh-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-top: 20px; }
.bh-pager__info { font-family: var(--bh-font-mono); font-size: var(--bh-fs-num-s); line-height: var(--bh-lh-num-s); color: var(--bh-text-muted); }
.bh-pager__list { display: flex; flex-wrap: wrap; gap: 4px; }
.bh-pager .bh-btn { min-width: var(--bh-control-h); padding-inline: 12px; }
.bh-pager .bh-btn[aria-current="page"] { background: var(--bh-text); border-color: var(--bh-text); color: var(--bh-on-dark); font-family: var(--bh-font-mono); font-weight: var(--bh-fw-bold); }
.bh-pager__num { font-family: var(--bh-font-mono); font-weight: var(--bh-fw-bold); }
.bh-pager__prev .bh-icon { transform: rotate(180deg); }

/* ---------- Короткий рейтинг ---------- */
.bh-toplist__row { display: grid; grid-template-columns: var(--bh-logo-s) minmax(0, 1fr) auto; gap: 10px 12px; align-items: center; padding: 12px 4px 12px var(--bh-margin-gap); }
.bh-toplist__main { display: grid; gap: 2px; min-width: 0; }
.bh-toplist__name { font-weight: var(--bh-fw-bold); font-size: var(--bh-fs-body); line-height: 22px; text-decoration: underline; text-decoration-color: var(--bh-line-strong); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.bh-toplist__name:hover { color: var(--bh-accent); }
.bh-toplist__sub { font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted); }
.bh-toplist__acts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.bh-toplist .bh-ruled__margin { padding-top: 20px; }

/* ---------- Лист документа: статья и служебные страницы ---------- */
.bh-doc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px var(--bh-gap); align-items: start; margin-top: 20px; }
.bh-doc > * { min-width: 0; }
.bh-doc__body > * + * { margin-top: 20px; }
.bh-doc__body > .bh-doc__h { margin-top: 48px; padding-top: 16px; border-top: var(--bh-border-ink); scroll-margin-top: 16px; text-wrap: balance; }
.bh-doc__body > .bh-doc__h:first-child { margin-top: 0; }
.bh-doc__body > .bh-doc__h3 { margin-top: 32px; scroll-margin-top: 16px; }
.bh-doc__body > .bh-doc__h + *, .bh-doc__body > .bh-doc__h3 + * { margin-top: 12px; }
.bh-doc__body > .bh-mini-wrap + .bh-total, .bh-doc__body > .bh-ruled + .bh-total { margin-top: 0; }
.bh-doc__body .bh-total--text .bh-total__text { font-size: var(--bh-fs-body); line-height: var(--bh-lh-body); max-width: 84ch; }
.bh-doc__body .bh-legend { font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted); max-width: 84ch; }
.bh-doc__body .bh-steps .bh-ruled__body { padding-right: 4px; }
.bh-doc__body .bh-steps__text { color: var(--bh-text); font-size: var(--bh-fs-body); line-height: var(--bh-lh-body); }
.bh-doc__next { display: grid; gap: 8px; }
.bh-doc__next .bh-btn { width: 100%; white-space: normal; }
.bh-doc__cta { display: none; }
.bh-doc__sources { display: grid; gap: 6px; font-size: var(--bh-fs-small); line-height: var(--bh-lh-small); }
.bh-doc__sources li { display: flex; flex-wrap: wrap; gap: 2px 12px; padding: 8px 0; border-bottom: var(--bh-border); }
.bh-doc__sources a { overflow-wrap: anywhere; }
.bh-doc__sources span { color: var(--bh-text-muted); }

/* таблица в тексте: мини-ведомость с ограничением ширины, чтобы графы не сжимались на телефоне */
.bh-doc-table { min-width: 560px; }
.bh-doc-table--wide { min-width: 700px; }
.bh-doc-table--rules { min-width: 0; }
.bh-doc-table--rules th:first-child, .bh-doc-table--rules td:first-child { width: 116px; white-space: nowrap; }
.bh-doc-table b { font-weight: var(--bh-fw-semibold); }
.bh-doc-table--rules td:first-child b { display: inline-block; min-width: 66px; }
.bh-doc-table td .bh-cells { margin-left: 6px; vertical-align: middle; }
.bh-doc-table .bh-link { font-weight: var(--bh-fw-semibold); }
.bh-doc-formula { font-family: var(--bh-font-mono); font-size: var(--bh-fs-num); line-height: 26px; overflow-wrap: anywhere; }

/* ---------- Содержание ---------- */
.bh-toc { border-top: var(--bh-rule); border-bottom: var(--bh-border-ink); }
.bh-toc__title { padding: 10px 12px; background: var(--bh-bg-2); border-bottom: var(--bh-border); }
.bh-toc__list { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--bh-gap); counter-reset: bh-toc; }
.bh-toc__list li { counter-increment: bh-toc; border-bottom: var(--bh-border); }
.bh-toc__list li:last-child { border-bottom: 0; }
.bh-toc__list a {
  display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; align-items: baseline; min-height: 44px; padding: 11px 8px 11px 4px;
  font-size: var(--bh-fs-ui); line-height: 22px; transition: background-color var(--bh-t), color var(--bh-t);
}
.bh-toc__list a::before { content: counter(bh-toc); text-align: right; font-family: var(--bh-font-mono); font-size: var(--bh-fs-num-s); color: var(--bh-text-muted); }
.bh-toc__list a:hover { background: var(--bh-surface); color: var(--bh-accent); }

/* ---------- Шапка статьи ---------- */
.bh-art-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px var(--bh-gap); padding-top: 4px; }
.bh-art-head h1 { text-wrap: balance; }
.bh-art-meta { display: flex; align-items: center; gap: 12px; min-width: 0; }
.bh-byline { display: grid; gap: 4px; min-width: 0; font-size: var(--bh-fs-small); line-height: var(--bh-lh-small); }
.bh-byline > .bh-logo { display: none; }
.bh-byline b { font-weight: var(--bh-fw-semibold); }
.bh-byline__role { color: var(--bh-text-muted); }
.bh-byline__dates { display: flex; flex-wrap: wrap; gap: 2px 16px; font-family: var(--bh-font-mono); font-size: var(--bh-fs-num-s); line-height: var(--bh-lh-num-s); color: var(--bh-text-muted); }

.bh-related__sub { margin: 28px 0 8px; }

/* ---------- Карточка-врезка в тексте ---------- */
.bh-card--inline { background: var(--bh-bg); }
.bh-card--inline .bh-card__params dd { font-weight: var(--bh-fw-semibold); }

@media (min-width: 768px) {
  .bh-cover { width: 176px; height: 124px; }
  .bh-cover__top { padding: 5px 10px; }
  .bh-cover__type { display: inline; }
  .bh-cover__body { display: block; place-items: normal; padding: 10px 12px; }
  .bh-cover__words {
    position: relative; z-index: 1; display: grid; justify-items: start;
    font-family: var(--bh-font-heading); font-weight: var(--bh-fw-bold); font-size: 24px; line-height: 26px; letter-spacing: var(--bh-ls-heading);
  }
  .bh-cover__words i { font-style: italic; font-weight: var(--bh-fw-regular); font-size: 18px; line-height: 20px; color: var(--bh-text-muted); }
  .bh-cover__art { position: absolute; right: 8px; bottom: 8px; width: 40px; height: 40px; color: var(--bh-line-strong); }
  .bh-cover--l { width: 100%; height: 188px; }
  .bh-cover--l .bh-cover__body { padding: 16px; }
  .bh-cover--l .bh-cover__words { font-size: 34px; line-height: 36px; }
  .bh-cover--l .bh-cover__words i { font-size: 22px; line-height: 26px; }
  .bh-cover--l .bh-cover__art { right: 12px; bottom: 12px; width: 64px; height: 64px; }

  .bh-post--cover {
    grid-template-columns: 176px minmax(0, 1fr); grid-template-rows: auto auto auto 1fr;
    grid-template-areas: "cover meta" "cover title" "cover lead" "cover by";
    gap: 6px 20px;
  }
  .bh-post--cover .bh-post__meta { justify-content: flex-start; align-self: start; }
  .bh-post--lead { grid-template-columns: 280px minmax(0, 1fr); padding-block: 20px; gap: 8px 24px; }
  .bh-post--lead .bh-post__title { font-size: var(--bh-fs-h2); line-height: var(--bh-lh-h2); }
  .bh-post--lead .bh-post__lead { font-size: var(--bh-fs-body); line-height: var(--bh-lh-body); -webkit-line-clamp: 4; max-width: var(--bh-measure); }

  .bh-blog__aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .bh-toplist--wide .bh-toplist__row { grid-template-columns: var(--bh-logo-s) minmax(0, 1fr) auto auto; gap: 8px 16px; padding-block: 10px; }
  .bh-toplist--wide .bh-toplist__acts { grid-column: auto; grid-template-columns: auto auto; }
  .bh-toplist--wide .bh-ruled__margin { padding-top: 18px; }

  /* поле и красная линия полей идут по всей высоте листа: ответ, содержание и текст — одна линия */
  .bh-doc { --bh-doc-pad: 24px; row-gap: 0; }
  .bh-doc > * { margin-left: var(--bh-margin-w); padding-left: var(--bh-doc-pad); padding-bottom: 24px; border-left: var(--bh-margin-line); }
  .bh-doc > .bh-doc__body { padding-bottom: 0; }
  /* номера шагов и критериев стоят в поле листа, своей линии у вложенных списков нет */
  .bh-doc__body .bh-ruled__row { display: block; position: relative; }
  .bh-doc__body .bh-ruled__margin {
    position: absolute; top: 0; left: calc((var(--bh-doc-pad) + 3px + var(--bh-margin-w)) * -1); width: var(--bh-margin-w);
    border-right: 0; padding-top: 14px;
  }
  .bh-doc__body .bh-ruled__body, .bh-doc__body .bh-toplist__row { padding-left: 0; }
  .bh-doc__body .bh-toplist .bh-ruled__margin { padding-top: 18px; }
  /* «запись на полях» примыкает к линии листа, второй красной линии в блоке нет */
  .bh-doc__body .bh-note--margin { border-left: 0; margin-left: calc(var(--bh-doc-pad) * -1); padding-left: var(--bh-doc-pad); }

  .bh-toc__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-toc__list a { min-height: 40px; padding-block: 9px; }
  .bh-toc__list li:nth-last-child(2):nth-child(odd) { border-bottom: 0; }

  .bh-art-head { grid-template-columns: minmax(0, 1fr) 208px; align-items: start; }
  .bh-art-head > * { grid-column: 1; }
  .bh-art-meta { display: contents; }
  .bh-art-meta > .bh-cover { grid-column: 2; grid-row: 1 / span 3; width: 208px; height: 148px; }
  .bh-art-meta > .bh-cover .bh-cover__words { font-size: 28px; line-height: 30px; }
  .bh-art-meta > .bh-cover .bh-cover__art { width: 48px; height: 48px; }
  .bh-byline { grid-column: 1; grid-template-columns: var(--bh-logo-m) minmax(0, 1fr); gap: 2px 12px; align-items: center; }
  .bh-byline > .bh-logo { display: inline-flex; grid-row: 1 / span 2; }

  .bh-card--inline { display: grid; grid-template-columns: minmax(0, 1fr) 196px; grid-template-areas: "place place" "head foot" "short foot" "params actions"; gap: 12px 24px; align-items: start; }
  .bh-card--inline .bh-card__place { grid-area: place; }
  .bh-card--inline .bh-card__head { grid-area: head; }
  .bh-card--inline .bh-card__short { grid-area: short; }
  .bh-card--inline .bh-card__params { grid-area: params; }
  .bh-card--inline .bh-card__foot { grid-area: foot; margin-top: 0; align-items: flex-start; }
  .bh-card--inline .bh-card__actions { grid-area: actions; grid-template-columns: minmax(0, 1fr); align-self: end; }

  .bh-doc__next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-doc-table--rules th:first-child, .bh-doc-table--rules td:first-child { width: 150px; }
}

@media (min-width: 1200px) {
  .bh-blog { grid-template-columns: minmax(0, 1fr) var(--bh-aside-w); column-gap: 40px; }
  .bh-blog__aside { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-top: 24px; }
  .bh-blog__stack { gap: 40px; }

  .bh-doc { grid-template-columns: minmax(0, 1fr) var(--bh-aside-w); grid-template-areas: "lead aside" "body aside"; column-gap: 48px; }
  .bh-doc__lead { grid-area: lead; }
  .bh-doc__body { grid-area: body; }
  .bh-doc > .bh-doc__aside { grid-area: aside; position: sticky; top: 16px; display: grid; gap: 24px; margin-left: 0; padding-left: 0; padding-bottom: 0; border-left: 0; }
  .bh-doc__cta { display: grid; }
  .bh-toc__list { grid-template-columns: minmax(0, 1fr); }
  .bh-toc__list li:nth-last-child(2):nth-child(odd) { border-bottom: var(--bh-border); }

  .bh-art-head { grid-template-columns: minmax(0, 1fr) var(--bh-aside-w); column-gap: 48px; }
  .bh-art-meta > .bh-cover { width: 100%; height: 168px; }
  .bh-art-meta > .bh-cover .bh-cover__words { font-size: 34px; line-height: 36px; }
  .bh-art-meta > .bh-cover .bh-cover__art { width: 64px; height: 64px; }
}

/* ---------- 17.10.2026: обложка-картинка статьи (картинка записи) и картинки в теле [bh_img] ---------- */
.bh-cover--img { display: block; padding: 0; background: var(--bh-bg-2); }
.bh-cover__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bh-art-cover, .bh-art-fig { margin: 0 0 24px; }
.bh-art-cover__img, .bh-art-fig__img {
  display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover;
  background: var(--bh-bg-2); border: var(--bh-border-ink); border-radius: var(--bh-r-0);
}
.bh-art-fig { margin-top: 24px; }
.bh-art-fig__cap {
  margin-top: 8px; font-size: var(--bh-fs-micro); line-height: var(--bh-lh-micro); color: var(--bh-text-muted);
}
@media (min-width: 768px) {
  .bh-art-head--img { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1200px) {
  .bh-art-head--img { grid-template-columns: minmax(0, 1fr) var(--bh-aside-w); }
}