
/* ===== «Журнальный» вариант оформления статьи (Вариант 1, одобрен владельцем) =====
   Перенесено из макета /sketches/typography/magazine.html.

   Отличие от «Потока»: НЕТ бокового оглавления и вообще колонок — статья идёт
   по центру (max-width: 88rem из темы), картинки — во всю ширину разворота
   (выпуск −7rem в обе стороны, это поведение темы, трогать не нужно).

   Значения сняты замером макета при 1600px (root = 8.33333px):
     абзац: отбивка 2.6rem, 3.2rem/140%
     заголовок: 5.6rem сверху, 2rem снизу, БЕЗ линии сверху
     список: отбивка 3rem, отступ слева 1rem
     пункт: нумерация «1.» через ::before, отступ слева 3.6rem, отбивка .6rem
     картинка: ширина разворота (calc(100% + 14rem))

   🚨 Файл действует только на страницу статьи (single.php); другие шаблоны
   класс .post-content не используют. */

/* Точка привязки стилей статьи */
.post-content { min-width: 0; }

/* ── Абзацы ──
   🚨 В теме отбивки нет вовсе: post.css сбрасывает всё через all:unset.
   Задаём ТОЛЬКО margin-top/bottom — шорткат `margin` затёр бы центрирование
   темы (margin-left/right: auto) и текст съехал бы к левому краю. */
.post-content p {
    margin-top: 0;
    margin-bottom: 2.6rem;
}
.post-content p:has(+ ul) { margin-bottom: 1.2rem; }

/* ── Списки: нумерация «1.», как в макете ──
   В теме нумерация уже есть через ::before{counter(list)}, но отступы другие.
   🚨 Отбивку пункта задаём через :not(:last-child) — у темы правило такой же
   специфичности (.post-section__body ul li:not(:last-child){margin-bottom:.2rem}),
   и без этого она перебивала наши .6rem (замер: 1.67px вместо 5px). */
.post-content ul {
    margin-top: 0;
    margin-bottom: 3rem;
    padding-left: 1rem;
    list-style: none;
}
.post-content ul li {
    padding-left: 3.6rem;
}
.post-content ul li:not(:last-child) {
    margin-bottom: .6rem;
}
.post-content ul li:before {
    content: counter(list) ".";
    position: absolute;
    left: 0;
    font-weight: 400;
}

/* ── Заголовки разделов ──
   Создаются фильтром the_content из абзацев-strong.
   🚨 В журнальном варианте НЕТ линии сверху — убрана из «Потока».
   🚨 Центрируем сами: в макете заголовок лежит внутри центрированного .article
   и потому встаёт по центру, а здесь обёртка во всю ширину — без auto-отступов
   заголовок уезжает к левому краю (замер: 58…792 при абзацах 433…1167). */
.post-content .a-h {
    font-family: Arial, sans-serif;
    font-size: 3.2rem;
    line-height: 140%;
    color: #575757;
    font-weight: 700;
    margin: 5.6rem auto 2rem;
    max-width: 88rem;
    scroll-margin-top: 8rem;   /* чтобы переход по ссылке не прятал заголовок под панель */
}

/* ── Картинки: как в макете — ширина статьи + 7rem в каждую сторону ──
   Замер макета при 1600px: статья 733px, картинка 850px (88rem + 14rem),
   то есть по 7rem выпуска влево и вправо от текстовой колонки.
   🚨 В теме картинка растянута на ВСЮ ширину экрана (1600px): правило темы
   .post-section__body img{margin:-7rem; width:calc(100% + 14rem)} считается
   от полной ширины обёртки, а не от 88rem текста.
   Отступ слева = полуширина статьи минус выпуск, поэтому центрируем сами. */
@media (min-width: 768px) {
    .post-content img {
        display: block;
        width: calc(88rem + 14rem);
        max-width: none;
        margin-left: calc((100% - 88rem) / 2 - 7rem);
        margin-right: 0;
    }
}

@media (max-width: 767px) {
    /* 🚨 Тема на мобильном ставит абзацам line-height:100% — строки почти
       слипаются в блок (замер: 16.64px/16.64px, ×1.00 вместо ×1.5 из макета). */
    .post-content p {
        font-size: 1.6rem;
        line-height: 1.5;
        margin-bottom: 1.6rem;
    }
    .post-content .a-h {
        font-size: 1.6rem;
        line-height: 1.5;
        margin: 4rem 0 1.4rem;
    }
    .post-content ul { padding-left: 0; }
    .post-content ul li {
        font-size: 1.6rem;
        line-height: 1.5;
        padding-left: 2.4rem;
    }
    .post-content ul li:not(:last-child) { margin-bottom: .5rem; }
}

/* 🚨 Картинки НЕ трогаем: в теме они уже идут во всю ширину разворота
   (.post-section__body img{margin:-7rem; width:calc(100% + 14rem)}) — ровно так,
   как в макете журнального варианта (замер: статья 733px, картинка 850px). */
