/* ==================================================
   Полосы серый/белый внутри статьи (.new-band)
   ==================================================
   Разметку ставит PHP-снипет «[Новый дизайн] Полосы серый/белый
   внутри статьи»: он оборачивает разделы <h2> в
   <section class="new-band">. Первая полоса белая, последняя серая.

   Заливка выходит за контейнер тем же приёмом, что и блок FAQ:
   box-shadow на 100vmax + clip-path, иначе появится горизонтальная
   прокрутка.
   ================================================== */

.new-article .new-band {
    position: relative;
    /* flow-root — плавающие картинки не выпадают из своей полосы */
    display: flow-root;
    padding: 60px 0;
    background-color: #fff;
    box-shadow: 0 0 0 100vmax #fff;
    clip-path: inset(0 -100vmax);
}

.new-article .new-band--grey {
    background-color: #f5f6f8;
    box-shadow: 0 0 0 100vmax #f5f6f8;
}

/*
 * Крайние элементы не добавляют отступ к padding полосы.
 * Якорь «Содержания» (span.elementor-menu-anchor) вставляет скрипт
 * виджета уже после загрузки, поэтому первым ребёнком может
 * оказаться он — второй селектор снимает отступ у заголовка за ним.
 */
.new-article .new-band > :first-child,
.new-article .new-band > .elementor-menu-anchor:first-child + * {
    margin-top: 0 !important;
}

.new-article .new-band > :last-child {
    margin-bottom: 0 !important;
}

/*
 * То же правило, что и для прямых детей .elementor-widget-container
 * в new_article.css: перед плавающей картинкой нужен отступ 40px.
 */
.new-article .new-band > *:has(+ figure.wp-block-image) {
    margin-bottom: 40px !important;
}

@media (max-width: 767px) {
    .new-article .new-band {
        padding: 40px 0;
    }
}