здесь пишется
как `.ed-body p.имя` — иначе тихо наберётся кеглем полосы.
Карточек, стекла, теней, скруглений, backdrop-filter и will-change в файле
нет ни одного — это запрет системы, а не недосмотр.
═══════════════════════════════════════════════════════════════════════════ */
/* ── Титул --map: восемнадцатый тип титула издания ──────────────────────────
Кадр стоит ПОЛОСОЙ ПОД текстом. У --band (гл. 07) текст лежит поверх кадра,
у --split (гл. 05) кадр стоит колонкой сбоку — здесь ни то, ни другое.
Полоса выровнена по сетке разворота, а не в край окна: так она читается
частью полосы набора, а не баннером, и держит кратность retina ×2
(показ 1052px при файле 2100px; в край экрана было бы ×1.46).
Бокс-модель полосы переносится на титул один в один — иначе 12 колонок
титула не лягут на 12 колонок .ed-body (комментарий editorial.css:367).
Тип --map в тамошний перечень не входит, поэтому обе части контракта
выписаны здесь явно. */
.slide--editorial.slide--toc .ed-hero--map {
min-height: 0;
display: block;
background: none;
color: var(--ink);
overflow: visible;
padding-inline: 0;
padding-top: var(--ed-space-xl); /* .slide--editorial обнуляет --chrome-top */
padding-bottom: var(--ed-space-m);
margin-bottom: var(--ed-space-xl);
border-bottom: 1px solid var(--ed-rule-strong);
}
.slide--editorial.slide--toc .ed-hero--map::after { content: none; }
.slide--editorial.slide--toc .ed-hero--map .ed-hero__inner {
max-width: var(--ed-page);
margin-inline: auto;
padding: 0 clamp(20px, 5vw, 64px);
display: grid;
grid-template-columns: repeat(var(--ed-cols), 1fr);
column-gap: var(--ed-gap);
align-items: start;
}
.slide--editorial.slide--toc .ed-hero--map .ed-hero__text { grid-column: 1 / 8; grid-row: 1; }
.slide--editorial.slide--toc .ed-hero--map .ed-title { font-size: clamp(40px, 6vw, 76px); }
.slide--editorial.slide--toc .ed-hero--map .ed-eyebrow { color: var(--ed-ink-margin); }
.slide--editorial.slide--toc .ed-hero--map .ed-standfirst {
color: var(--ed-ink-margin);
max-width: 44ch; /* ⚠ 38ch давали три строки вместо двух: +32px титулу */
}
.slide--editorial.slide--toc .ed-hero--map .ed-hero-meta {
grid-column: 1 / 13;
grid-row: 4;
margin-top: var(--ed-space-xs);
padding-top: var(--ed-space-s);
border-top: 1px solid var(--ed-rule);
color: var(--ed-ink-margin);
}
/* ── .toc-parts — сигнатурный блок страницы ─────────────────────────────────
Вертикальная рейка четырёх частей справа от заглавия. Это работающая
навигация, а не заставка: каждая строка — якорь на свою часть ниже,
их перехватывает smooth-scroll.js (a[href^="#"]).
Родственник .ed-alphabet слайда 20 — рейка-навигация в титуле, — но там
33 однобуквенные ячейки сеткой 11×3, здесь 4 длинных имени столбиком
со счётом разделов. Общего только принцип, не форма. */
.slide--editorial.slide--toc .toc-parts {
grid-column: 9 / 13;
grid-row: 1;
display: flex;
flex-direction: column;
border-top: 1px solid var(--ed-rule-strong);
}
.slide--editorial.slide--toc .toc-parts__row {
display: flex;
align-items: baseline;
gap: var(--ed-space-xs);
min-height: 48px; /* ≥44px — размер цели касания */
padding: 12px 0;
border-bottom: 1px solid var(--ed-rule);
color: var(--ink);
text-decoration: none;
transition: color 160ms ease-out;
}
.slide--editorial.slide--toc .toc-parts__no {
font-family: var(--font-sans);
font-size: var(--ed-small);
font-weight: 600;
font-variant-numeric: tabular-nums;
letter-spacing: .04em;
color: var(--ed-ink-margin);
transition: color 160ms ease-out;
}
.slide--editorial.slide--toc .toc-parts__name {
flex: 1 1 auto;
min-width: 0; /* иначе длинное имя раздувает flex-элемент */
font-family: var(--font-display);
font-size: 21px;
font-weight: 600;
line-height: 1.2;
letter-spacing: -.01em;
}
.slide--editorial.slide--toc .toc-parts__count {
font-family: var(--font-sans);
font-size: var(--ed-small);
font-variant-numeric: tabular-nums;
color: var(--ed-ink-margin);
}
/* ── .toc-strip — полоса-кадр под титулом ───────────────────────────────────
Пятый способ подачи изображения в издании после полосы, врезки, колонки
и плиты: кадр по всей ширине разворота, но НЕ в край окна.
Кадр обрезается до 4:1 вместо своих 21:9. Причина не эстетическая: первая
сборка дала титул 1290px при 735–783px у соседей по развороту — на экране
900 читатель не видел ни строки основного текста, а это ровно тот дефект,
на котором споткнулась глава 13 (881px). Обрезка снимает ~190px, ещё ~260px
ушло вместе с .ed-figures в полосу набора.
⚠ Правило 2: aspect-ratio ВСЕГДА с явной width: 100%. Без неё браузер
вправе считать ширину от высоты — и делает это, как только сработает
любой потолок высоты. */
.slide--editorial.slide--toc .toc-strip {
grid-column: 1 / 13;
grid-row: 3;
margin: var(--ed-space-s) 0 0;
}
.slide--editorial.slide--toc .toc-strip__frame {
width: 100%;
aspect-ratio: 4 / 1;
overflow: hidden;
}
.slide--editorial.slide--toc .toc-strip picture { display: block; height: 100%; }
.slide--editorial.slide--toc .toc-strip img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.slide--editorial.slide--toc .toc-strip .ed-caption { max-width: 58ch; }
/* ── Части ──────────────────────────────────────────────────────────────────
Секция части — элемент сетки .ed-body во всю ширину, внутри неё собственная
12-колоночная сетка: иначе абзац, маргиналия и реестр не легли бы на общие
колонки (элементами сетки .ed-body они быть перестали). */
.slide--editorial.slide--toc .toc-part {
grid-column: 1 / 13;
display: grid;
grid-template-columns: repeat(var(--ed-cols), 1fr);
column-gap: var(--ed-gap);
align-items: start;
margin-bottom: var(--ed-space-xl);
}
.slide--editorial.slide--toc .toc-part > * { grid-column: 1 / 10; }
.slide--editorial.slide--toc .toc-part > .ed-note,
.slide--editorial.slide--toc .toc-part > .ed-figure--margin { grid-column: 10 / 13; }
.slide--editorial.slide--toc .toc-part > .ed-figure--wide,
.slide--editorial.slide--toc .toc-part > .toc-list { grid-column: 1 / 13; }
.slide--editorial.slide--toc .toc-part > .ed-h2 { margin-top: 0; }
/* ── Часть 03: список в полосе, кадр рядом с ним ────────────────────────────
Единственная часть с модификатором, и повод не формальный: разделов в ней
восемь против трёх у остальных, и полноширинный список тут даёт дефект,
которого больше нигде нет.
Пока `.toc-list` стоял `1 / 13`, он по правилам сетки не мог начаться, пока
не кончится строка с маргинальным кадром: замер показывал 398px пустоты
в колонках 1–9 между низом абзаца (y=2435) и началом списка (y=2833),
а сам список оказывался «отжат» под фотографию вместо того, чтобы стоять
рядом с ней. Список в колонках 1–9 встаёт в одну строку сетки с кадром,
и страница укорачивается на 350px.
⚠ Без `!important`. Медиазапрос ≤860 ниже по файлу возвращает всё в `1 / 13`,
и форсированное правило его переломило бы: в прототипе список получил
на 375px ширину 247 вместо 335 и вынес переполнение на `.toc-row__title`. */
.slide--editorial.slide--toc .toc-part--split > .toc-list { grid-column: 1 / 10; }
/* Кадр обязан встать вровень со списком. У `.toc-list` есть margin-top 24px,
а `.ed-figure--margin` обнуляет свой верхний отступ — без этой строки
расхождение ровно 24px (замер: 2459 против 2483). */
.slide--editorial.slide--toc .toc-part--split > .ed-figure--margin {
margin-top: var(--ed-space-s);
}
/* Номер части — информация, а не декорация: частей ровно четыре и они
пронумерованы по существу. На уровне строк реестра номеров-маркеров нет. */
.slide--editorial.slide--toc .toc-part__no {
font-family: var(--font-sans);
font-size: 13px;
font-weight: 600;
font-variant-numeric: tabular-nums;
letter-spacing: .04em;
color: var(--accent);
vertical-align: .55em;
margin-right: var(--ed-space-xs);
}
/* ── Реестр разделов ────────────────────────────────────────────────────────
Строка — настоящая ссылка , а не onclick на