@media (max-width: 1279px) {
    .bl {
        padding-bottom: 24px;
    }

    .bl-grid {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        margin-top: 16px;
    }

    /* Таблица прокручивается внутри листа и не растягивает колонку */
    .bl-grid > * {
        min-width: 0;
    }

    .bl-text table {
        min-width: 520px;
    }

    .bl-head {
        padding: 16px;
        border-radius: 24px;
    }

    .bl-head::after {
        display: none;
    }

    .bl-h1 {
        font-size: var(--fs-24);
    }

    .bl-props {
        display: grid;
        grid-template-columns: 1fr 1fr;
        margin-top: 20px;
    }

    .bl-props > div {
        margin: 0;
        padding: 0;
        border: 0;
    }

    .bl-rail {
        position: static;
        width: 100%;
    }

    .bl-card {
        max-height: none;
    }

    .bl-sec {
        padding: 16px;
    }

    .bl-doc {
        border-radius: 24px;
    }

    .bl-block {
        margin-top: 48px;
    }

    .bl-h2 {
        margin-bottom: 16px;
        font-size: var(--fs-24);
    }

    .bl-chips {
        max-width: none;
    }

    .bl-feats {
        grid-template-columns: 1fr;
    }

    .bl-feat {
        min-height: 0;
    }

    .bl-list-head {
        display: none;
    }

    .bl-row {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 16px;
    }

    .bl-row-cat,
    .bl-row-date {
        display: none;
    }

    .bl-row-meta {
        text-align: left;
    }

    .bl-row-meta i {
        display: inline;
    }

    .bl-grid-index .bl-rail {
        margin-top: 8px;
    }

    /* На телефоне справа остаётся только содержание; действие есть в тексте статьи строкой */
    .bl[data-kind="article"] .bl-rail .bl-action {
        display: none;
    }

    .bl-doc {
        padding: 20px 16px;
    }

    .bl-text {
        padding-left: 0;
    }

    .bl-text h2:not(.similar-jobs-title) {
        font-size: var(--fs-20, 20px);
        scroll-margin-top: 140px;
    }

    .bl-text h2:not(.similar-jobs-title)::before {
        position: static;
        display: block;
        margin-bottom: 4px;
    }

    .bl-text h2:not(.similar-jobs-title)::after {
        right: -16px;
        left: -16px;
    }

    .bl-text .blog-recommended-jobs {
        margin-right: -16px;
        margin-left: -16px;
        padding-right: 16px;
        padding-left: 16px;
    }

    .bl-jobs-tail .similar-jobs-title,
    .bl-title {
        font-size: var(--fs-24);
    }

    .bl-jobs-tail .similar-jobs-title {
        margin-bottom: 16px;
    }
}

/* Содержание на телефоне — строка, закреплённая под шапкой сайта: номер и название текущего раздела, процент, полоса прогресса */
@media (max-width: 1279px) {
    /* 72px — нижний край подложки мобильной шапки сайта: строка прилегает к ней без щели */
    /* Статья без разделов: содержания нет, а действие на телефоне скрыто — карточка не нужна */
    .bl[data-kind="article"] .bl-rail:not(:has(.bl-toc)) { display: none; }

    .bl[data-kind="article"] .bl-rail { position: sticky; top: 72px; z-index: 30; }

    /* Заливка фоном страницы над строкой и под её скруглёнными углами: текст статьи там не просвечивает */
    .bl[data-kind="article"] .bl-rail::before { content: ""; position: absolute; z-index: -1; top: -8px; right: 0; left: 0; height: 36px; background: var(--bg-color); }

    .bl[data-kind="article"] .bl-card { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18); }

    .bl[data-kind="article"] .bl-toc { padding-top: 14px; padding-bottom: 14px; }

    .bl[data-kind="article"] .bl-toc .bl-toc-toggle { cursor: var(--cursor-pointer); color: var(--text-color); font-size: var(--fs-16); min-width: 0; }

    .bl[data-kind="article"] .bl-toc .bl-toc-word { display: flex; align-items: baseline; gap: 6px; }

    .bl[data-kind="article"] .bl-toc .bl-toc-word small { display: inline; color: var(--text-muted); font-size: var(--fs-14); }

    .bl[data-kind="article"] .bl-toc .bl-toc-toggle .bl-go { display: block; flex: none; transform: rotate(90deg); }

    .bl[data-kind="article"] .bl-toc .bl-read { margin-left: auto; color: var(--text-muted); font-size: var(--fs-14); }

    .bl[data-kind="article"] .bl-toc .bl-read::before { content: none; }

    .bl[data-kind="article"] .bl-toc:not(.is-reading) .bl-read { visibility: hidden; }

    .bl[data-kind="article"] .bl-toc.is-reading .bl-toc-word { display: none; }

    .bl[data-kind="article"] .bl-toc.is-reading .bl-now { display: block; }

    .bl[data-kind="article"] .bl-toc .bl-progress { margin: 12px 0 -4px; }

    .bl[data-kind="article"] .bl-toc:not(.is-reading) .bl-progress,
    .bl[data-kind="article"] .bl-toc:not(.is-open) .bl-toc-list { display: none; }

    .bl[data-kind="article"] .bl-toc.is-open .bl-toc-list { max-height: calc(100vh - 240px); margin-top: 16px; }

    .bl[data-kind="article"] .bl-toc.is-open .bl-toc-list span { white-space: normal; }

    .bl[data-kind="article"] .bl-toc.is-open .bl-toc-toggle .bl-go { transform: rotate(-90deg); }
}