/* ============================================================
   Крошки — задача rp-1011-wp-niche-urls-crumbs (11.10.2026).
   Разметка: `template-parts/breadcrumbs.php` (nav.crumbs).
   ============================================================ */

/* Вид скопирован с крошек квиза (`.kviz-crumbs`, sections.css): кегль 14,
   вес 300, серый текст, перенос строк флексом, разделитель стрелкой. Квиз
   остаётся на своём классе — там правила те же, но живут в sections.css,
   потому что их читает гейт квиза. */
.crumbs {
  padding: 20px 0 0;
  font-size: 14px;
  font-weight: 300;
  line-height: 21px;
  color: #616161;
}

.crumbs .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.crumbs a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.crumbs a:hover,
.crumbs a:focus-visible {
  color: var(--red);
}

/* Текущая ступень — графит, как у квиза. */
.crumbs [aria-current="page"] {
  color: var(--graphite);
}

.crumbs span[aria-hidden="true"] {
  color: #C4C4C4;
}

/* Длинное имя ниши («Восстановление учёта») на 320px меры контейнера не
   имеет: без переноса по словам строка вылезала бы за край. Перенос
   `anywhere` — страховка от одного сверхдлинного слова, а не рабочий режим:
   подписи ниш короче строки. */
.crumbs a,
.crumbs [aria-current="page"] {
  overflow-wrap: anywhere;
}

/* Отступ. Крошки стоят над первым экраном и занимают его верхний отступ:
   высота полосы детерминирована (20px отступ + 21px строка = 41px), поэтому
   у hero верхний отступ уменьшается на ровно эту высоту (61 - 41 = 20).
   Так ритм страницы (и общая высота, которую сверяет гейт отраслевых,
   `idrift.cjs`) остаётся прежним: крошки приходят, высота — нет.

   Порог 981px — граница раскладки: ниже неё у hero другой верхний отступ
   (`sections.css`, `@media (max-width: 980px)`: 0 + `clamp()` из
   responsive.css), и вычитать нечего; там крошки просто добавляют свою
   полосу над первым экраном. */
@media (min-width: 981px) {
  .crumbs + .hero { padding-top: 20px; }
}

/* Страницы записи (`single.php`, `single-razbor.php`): hero нет — сразу за
   крошками идёт `.section` с шапкой записи, где первой стоит плашка-дата.
   На hero-страницах отступ крошек «впитан» первым экраном (правило выше),
   а здесь впитывать некуда — без этого правила дата прилипала к крошкам
   (зазор 0px, жалоба Павла 14.10.2026). */
.crumbs + .section { padding-top: 40px; }
@media (max-width: 980px) {
  .crumbs + .section { padding-top: 28px; }
}