/*
 * =========================================================
 * MOBILE TOUR CARDS — SAFE GUTTERS
 *
 * Карточка больше не касается границ контейнера.
 *
 * Важно:
 * padding задаём mobile-list,
 * а не самой карточке.
 *
 * Поэтому:
 * - фото остаётся от края до края карточки;
 * - красная верхняя линия сохраняется;
 * - внутренняя верстка карточки не меняется.
 * =========================================================
 */

@media screen and (max-width:767px) {


    /*
     * Только новая архитектура.
     *
     * Старую главную "/" этим визуальным
     * изменением пока не затрагиваем.
     */

    body.ct-home-wide
    .ct-home-mobile-tours,

    body.ct-inner-redesign
    .ct-home-mobile-tours {

        display:
            block !important;

        width:
            100% !important;

        max-width:
            100% !important;

        margin-top:
            15px !important;

        margin-right:
            0 !important;

        margin-bottom:
            28px !important;

        margin-left:
            0 !important;

        padding-right:
            12px !important;

        padding-left:
            12px !important;

        box-sizing:
            border-box !important;
    }


    /*
     * Карточка всегда остаётся внутри
     * уменьшенной padding-области.
     */

    body.ct-home-wide
    .ct-home-mobile-card,

    body.ct-inner-redesign
    .ct-home-mobile-card {

        display:
            block;

        width:
            100% !important;

        max-width:
            100% !important;

        margin-right:
            0 !important;

        margin-left:
            0 !important;

        box-sizing:
            border-box !important;
    }


    /*
     * Защита от длинного текста,
     * цены, маршрута и меток.
     */

    body.ct-home-wide
    .ct-home-mobile-card
    > *,

    body.ct-inner-redesign
    .ct-home-mobile-card
    > * {

        max-width:
            100%;

        box-sizing:
            border-box;
    }

}


/*
 * На совсем узком экране сохраняем
 * полезную площадь карточки.
 */

@media screen and (max-width:360px) {

    body.ct-home-wide
    .ct-home-mobile-tours,

    body.ct-inner-redesign
    .ct-home-mobile-tours {

        padding-right:
            9px !important;

        padding-left:
            9px !important;
    }

}