/* * :where(body) уводит правило из-под самого . * * WordPress вешает на body класс с тем же именем, что у секции внутри * страницы (blog, single-post, search-results), и без этой обёртки * получал flex-колонку, вертикальный ритм и --gutter — * то есть разъезжалась вся страница. :where даёт нулевую специфичность, * поэтому каскад не меняется, а body не совпадает: он не свой потомок. */ :where(body) .single-post{ display:flex; flex-direction:column; align-items:center; gap:24px; width:100%; margin-block-start:24px; padding-inline: var(--gutter); } .single-post__head{ display:flex; flex-direction:column; align-items:center; gap:16px; width:100%; text-align:center; } .single-post__head h1{ font-size: var(--fs-h1); font-weight:700; line-height:1.1; color: var(--color-dark); } .single-post__date{ font-size: var(--fs-name); line-height:1.2; color: var(--color-brown); } .single-post__cover{ width:100%; aspect-ratio: 343 / 232; object-fit:cover; border-radius:16px; } /* ============================================================ SINGLE POST — ≥ 992px ============================================================ */ @media (min-width: 992px){ :where(body) .single-post{ gap:40px; } .single-post__head{ gap:24px; } .single-post__cover{ aspect-ratio: 1524 / 600; } }