.dfp-promo {
    background: #fff;
    border-radius: 5px;
    bottom: 20px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    left: 90px;
    max-width: 100%;
    overflow: hidden;
    position: fixed;
    width: 541px;
    z-index: 999999;
}

.dfp-promo__link {
    display: block;
    line-height: 0;
    text-decoration: none;
}

.dfp-promo__img {
    display: block;
    height: auto;
    width: 100%;
}

.dfp-promo__close {
    backdrop-filter: saturate(180%) blur(6px);
    background: rgba(255, 255, 255, .88);
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 2px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .18);
    cursor: pointer;
    height: 28px;
    padding: 0;
    position: absolute;
    right: 2px;
    top: 2px;
    width: 28px;
    z-index: 2;
}

.dfp-promo__close::before,
.dfp-promo__close::after {
    background: #111827;
    content: "";
    height: 2px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    transform-origin: center;
    width: 18px;
}
.dfp-promo__close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.dfp-promo__close:hover,
.dfp-promo__close:focus-visible {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(0, 0, 0, 0.28);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
    outline: none;
}
.dfp-promo__close:hover::before,
.dfp-promo__close:hover::after,
.dfp-promo__close:focus-visible::before,
.dfp-promo__close:focus-visible::after {
    background: #0b1220;
}

@media (prefers-color-scheme: dark) {
    .dfp-promo__close {
        background: rgba(255, 255, 255, 0.9);
        border: 1px solid rgba(0, 0, 0, 0.3);
    }
}

@media (max-width: 768px) {
    .dfp-promo {
        border-radius: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
    }

    .dfp-promo__close {
        right: 12px;
        top: 12px;
    }
}
/* ============ ШАПКА УРОКА — ЕДИНЫЙ БАННЕР (26.07.2026) ============
   БЫЛО: шапка склеивалась из ДВУХ картинок — верх через ::after, низ фоном,
   каждая растягивалась ровно на половину высоты (background-size: 100% 50%).
   У нижней картинки нижние ~45% занимала светлая кремовая волна, а GetCourse
   кладёт на это место белые подписи «Предыдущий урок» / «Следующий урок» /
   «Недоступен до…» — белым по белому, читать невозможно. Плюс верхняя картинка
   1584x372 сжималась почти вчетверо по высоте и мылила.
   СТАЛО: один цельный баннер 2280x394 (2x от реального размера блока 1140x197)
   с намеренно затемнённым низом — подписи читаются гарантированно.
   ПОЧЕМУ ЗДЕСЬ, а не в фирменном CSS школы (d459e5db….css): тот подключается
   статическим файлом из хранилища, а этот макет грузится на ВСЕХ страницах школы
   и ПОСЛЕ него — поэтому переопределение срабатывает и откатывается одним движением.
   ОТКАТ: удалить этот блок целиком. Исходные картинки остаются в хранилище:
     верх — dbfafb41066e393d17b414c763d295c8.png
     низ  — 5311fe0a0e506b7b161261e5fd94cde6.png
*/
.mze6 .lesson-header-block.row-section {
        /* Два слоя: сверху затемнение к низу, под ним сам баннер.
           Затемнение живёт в CSS, а не внутри картинки, потому что высота шапки
           у разных уроков разная (94-197px) и cover подрезает картинку по-разному —
           а подписи всегда стоят у НИЖНЕГО края блока. Так они читаются везде. */
        background-image:
                linear-gradient(180deg, rgba(13,27,42,0) 44%, rgba(13,27,42,0.74) 100%),
                url(https://fs.getcourse.ru/fileservice/file/download/a/20019/sc/211/h/8f8bbec935683cc109dc970a68f283d2.png) !important;
        background-size: cover, cover !important;
        background-position: center center, center center !important;
        background-repeat: no-repeat, no-repeat !important;
}

/* верхняя половина больше не нужна — картинка одна */
.mze6 .lesson-header-block.row-section:after {
        display: none !important;
}

/* на телефоне подписи прижимались к самому нижнему краю */
@media (max-width: 767px) {
        .mze6 .lesson-header-block.row-section {
                padding-bottom: 12px !important;
        }
}