/* Правка типографской шкалы статьи.
   Основание — измерения: было 27,2 px при 42–50 знаках в строке, H1 85 px,
   подзаголовок 63 px. Комфортная длина строки 45–75 знаков (оптимум ~66),
   экранный кегль для чтения 16–20 px. Ниже — приведение к этим величинам
   без смены палитры: цвета сайта не трогаются. */

.reader-article > p,
.reader-article > .reader-opening,
.reader-article .reader-chapter p,
.reader-article li {
  font-size: 1.19rem;      /* ≈19 px вместо 27 */
  line-height: 1.68;
}
.reader-article > .reader-opening { font-size: 1.34rem; line-height: 1.6; }

/* Колонка шире, кегль меньше — вместе дают ~66 знаков в строке */
.reader-article { max-width: 50rem; }
.reader-article > p, .reader-article .reader-chapter p { max-width: 44rem; }

/* Иерархия: главный заголовок ведёт, подзаголовок подчиняется */
.article-hero h1 { font-size: clamp(2.4rem, 4.2vw, 3.4rem); line-height: 1.08; }
.reader-chapter h3 { font-size: clamp(1.45rem, 2.2vw, 1.85rem); line-height: 1.22; }
.reader-chapter-label { font-size: .78rem; letter-spacing: .13em; }

/* Навигация не спорит с текстом по весу */
.reader-layout { grid-template-columns: 15rem minmax(0, 1fr); gap: 4rem; }
.reader-toc a { font-size: .86rem; }
.reader-toc p { font-size: .72rem; letter-spacing: .12em; }

/* Воздух между главами вместо провалов */
.reader-chapter { margin-block: 3.4rem; }
.reader-figure { margin-block: 2.6rem; }
.reader-figure img { height: auto; }

/* Перечни внутри глав: тот же кегль, что у текста, с воздухом между пунктами */
.reader-article .reader-list {
  max-width: 44rem; margin-block: 1.4rem; padding-left: 1.1rem;
  list-style: none;
}
.reader-article .reader-list li {
  position: relative; margin-block: .7rem; padding-left: .2rem;
}
.reader-article .reader-list li::before {
  content: ""; position: absolute; left: -1.1rem; top: .68em;
  width: .42rem; height: 1px; background: #9f4937;
}

/* ── Шапка статьи ───────────────────────────────────────────────────────────
   Было: три колонки на разной высоте — рубрика слева, заголовок посередине,
   лид справа, и пустая полоса в пол-экрана под ними. Ничто не вело взгляд.
   Стало: одна колонка, порядок сверху вниз — рубрика, заголовок, лид, метка.
   Лид подчинён заголовку по кеглю и цвету, поэтому не спорит с ним. */

.article-hero { padding-block: 3.2rem 2.2rem; }

.article-hero .wrap.article-hero-grid {
  display: block;
  max-width: 52rem;
  margin-inline: auto;
}

.article-hero-kicker {
  margin: 0 0 .9rem;
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9f4937;
}

.article-hero h1 {
  margin: 0;
  max-width: 20ch;
  font-size: clamp(2.3rem, 4vw, 3.25rem);
  line-height: 1.06;
  letter-spacing: -.012em;
}

.article-hero-deck {
  margin: 1.3rem 0 0;
  max-width: 46ch;
  font-family: Literata, Georgia, serif;
  font-size: 1.18rem;
  line-height: 1.55;
  color: #4f4e49;
}

/* Рубрика и время — одна тихая строка под лидом, а не колонка сбоку */
.article-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .9rem;
  align-items: baseline;
  margin-top: 1.6rem;
  padding-top: .9rem;
  border-top: 1px solid #d9d2c6;
  font-size: .8rem;
  color: #6d6a63;
}
.article-hero-meta span { letter-spacing: .1em; text-transform: uppercase; }
.article-hero-meta b { font-weight: 500; }
.article-hero-meta span::after { content: " ·"; color: #b9ac9b; }

/* Обложка идёт сразу за шапкой, без провала */
.article-cover-band { padding-block: 0 .4rem; }
.article-cover-band .wrap { max-width: 62rem; }

/* ── Блок перехода к следующему материалу ───────────────────────────────────
   Было: подпись и текст ложились в одну узкую колонку и наезжали друг на друга
   (проверка вёрстки: 323 px текста в контейнере 128 px). Стало: подпись —
   отдельной строкой над текстом. */
.reader-next {
  display: block;
  max-width: 44rem;
  margin-block: 3rem 1.5rem;
  padding-top: 1.4rem;
  border-top: 1px solid #d9d2c6;
}
.reader-next .reader-chapter-label {
  display: block;
  width: auto;
  max-width: none;
  margin-bottom: .7rem;
}
.reader-next p { max-width: 44rem; }
.reader-next a {
  display: inline-block;
  margin-top: .6rem;
  border-bottom: 1px solid currentColor;
  color: #9f4937;
  text-decoration: none;
}

/* Вводный абзац чуть спокойнее — держим весь текст в читаемом диапазоне */
.reader-article > .reader-opening { font-size: 1.26rem; }

/* ── Мобильная вёрстка ──────────────────────────────────────────────────────
   Оглавление на узком экране складывалось в строку и уезжало за край
   (проверка: пункты уходили вправо на 800 px). Ставим его в колонку. */
@media (max-width: 900px) {
  .reader-layout { display: block; }
  .reader-toc {
    position: static;
    max-width: none;
    margin-bottom: 2rem;
    padding-bottom: 1.2rem;
    border-bottom: 1px solid #d9d2c6;
  }
  .reader-toc ol { display: block; }
  .reader-toc li { display: block; width: auto; margin-block: .55rem; }
  .reader-toc a { display: block; }
  .article-hero .wrap.article-hero-grid,
  .reader-article,
  .reader-article > p,
  .reader-article .reader-chapter p,
  .reader-article .reader-list,
  .reader-next { max-width: 100%; }
}

/* Обложка показывалась в почти квадратной рамке с object-fit: cover — кадр
   1536×1024 обрезался по краям, банки уезжали из вида. Показываем целиком. */
.article-cover img,
.reader-figure img {
  height: auto;
  object-fit: contain;
  aspect-ratio: auto;
}

/* На средних экранах колонка растягивалась и строка доходила до 80 знаков.
   Ограничение в ch держит длину строки в читаемом диапазоне на любой ширине. */
.reader-article > p,
.reader-article .reader-chapter p,
.reader-article .reader-list { max-width: min(44rem, 68ch); }

/* ── Паспорт сверки ─────────────────────────────────────────────────────────
   Блок был добавлен в разметку без единого правила и рендерился слипшимися
   элементами: «03челюсти», «60-100`зубчиков». Здесь он получает вид. */
.scap-passport {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 1px;
  margin: 0 0 2.6rem;
  background: #d9d2c6;
  border: 1px solid #d9d2c6;
}
.scap-passport-item {
  display: grid;
  gap: .35rem;
  padding: 1rem 1.1rem;
  background: #f6f1e8;
}
.scap-passport-item b {
  font-family: Literata, Georgia, serif;
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1;
  color: #9f4937;
  font-variant-numeric: tabular-nums;
}
.scap-passport-item span {
  font-size: .84rem;
  line-height: 1.4;
  color: #5f625e;
}