/**
 * Остаточное после миграции на <x-blocks.cards-grid> (см.
 * plan-block-constructor.md, Этап 2). Мёртвый CSS удалён при миграции:
 * `.box-head h3` и `.box-head .heading-img` — ни один селектор не
 * матчился ни в одном blade (нет `<h3>` в этом шаблоне вообще, класс
 * `heading-img` нигде не используется — `x-content-image` его не
 * проставляет).
 */
#programma-obucheniya-directions .cards-grid__col {
    margin-bottom: 20px;
}
/**
 * Сверено вживую 2026-09-19 (768px): общий .cards-grid .img-fluid
 * (cards-grid.css) даёт margin-bottom:30px — нужно head-style="image-marker"
 * (лого+заголовок в одну строку), но здесь (head-style="image-title",
 * картинка+h4 раздельно, .cards-grid__card-head--image-only уже держит
 * свои padding-bottom:22px) лишний — прод-версия .box-head даёт только
 * margin-top:28px от общего .tablet-img{margin-top} (general.css), без
 * нижнего отступа у картинки вообще.
 */
#programma-obucheniya-directions .cards-grid__card-head--image-only .img-fluid {
    margin-bottom: 0;
}
#programma-obucheniya-directions .cards-grid__page-cta {
    margin-top: 32px;
    width: auto;
    height: auto;
    padding: 10px 25px 10px 25px;
}

@media (max-width: 950px) {
    #programma-obucheniya-directions .cards-grid__col {
        width: 90%;
    }
    #programma-obucheniya-directions .desktop-img {
        display: none;
    }
    #programma-obucheniya-directions .tablet-img {
        display: inline-block;
    }
    #programma-obucheniya-directions .mobile-img {
        margin: 0;
        display: none;
    }
}

@media (max-width: 768px) {
    #programma-obucheniya-directions .cards-grid__col {
        width: 100%;
    }
}

@media (max-width: 414px) {
    #programma-obucheniya-directions .cards-grid__card {
        padding: 16px;
    }
}

@media (max-width: 400px) {
    #programma-obucheniya-directions .tablet-img {
        display: none;
    }
    #programma-obucheniya-directions .mobile-img {
        display: inline-block;
    }
}