/* ==============================
   СТАТЬИ БЛОГА СТРОЙКОНТУР
   ============================== */

/* Основной текст статьи */
.t-cms__page .t-redactor__text,
.t-cms__page .t-redactor__quote,
.t-cms__page figcaption,
.t-cms__page td,
.t-cms__page th,
.t-cms__page li {
    font-family: Arial, sans-serif !important;
    font-weight: 400 !important;
    color: #332b2d;
    line-height: 1.65;
}

/* Размер основного текста */
.t-cms__page .t-redactor__text {
    font-size: 18px;
    margin-bottom: 18px;
}

/* Заголовок статьи */
.t-cms__page .t-heading {
    font-family: Arial, sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.15;
}

/* H2 */
.t-cms__page .t-redactor__h2 {
    font-family: Arial, sans-serif !important;
    font-size: 32px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    color: #332b2d;
    margin-top: 55px !important;
    margin-bottom: 22px !important;
}

/* H3 */
.t-cms__page .t-redactor__h3 {
    font-family: Arial, sans-serif !important;
    font-size: 23px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #332b2d;
    margin-top: 35px !important;
    margin-bottom: 14px !important;
}


/* ==============================
   ССЫЛКИ
   ============================== */

.t-cms__page .t-redactor__text a,
.t-cms__page .t-redactor__embedcode a,
.t-cms__page .toc a {
    color: #494c8d !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    font-weight: 500 !important;
}

.t-cms__page a:hover {
    color: #343765 !important;
}


/* ==============================
   СОДЕРЖАНИЕ
   ============================== */

.t-cms__page .toc {
    background: #f6f6f8;
    border-left: 4px solid #494c8d;
    padding: 24px 30px;
    margin: 30px 0 45px;
    border-radius: 8px;
}

.t-cms__page .toc strong {
    display: block;
    font-family: Arial, sans-serif;
    font-size: 22px;
    margin-bottom: 12px;
}

.t-cms__page .toc ol {
    margin: 0;
    padding-left: 22px;
}

.t-cms__page .toc li {
    margin: 7px 0;
}


/* ==============================
   ЦИТАТЫ / КРАТКИЙ ОТВЕТ
   ============================== */

.t-cms__page .t-redactor__quote {
    background: #f6f6f8;
    border-left: 4px solid #494c8d !important;
    padding: 20px 25px !important;
    margin: 25px 0 35px !important;
    font-size: 18px;
}


/* ==============================
   ТАБЛИЦЫ
   ============================== */

.t-cms__page .t-redactor__embedcode {
    overflow-x: auto;
}

.t-cms__page table {
    width: 100%;
    border-collapse: collapse;
    margin: 30px 0 40px;
    font-family: Arial, sans-serif !important;
    font-size: 16px;
}

.t-cms__page table th {
    background: #494c8d;
    color: #ffffff !important;
    font-weight: 600 !important;
    text-align: left;
    padding: 14px 16px;
    border: 1px solid #dedee5;
}

.t-cms__page table td {
    padding: 14px 16px;
    border: 1px solid #dedee5;
    vertical-align: top;
}

.t-cms__page table tbody tr:nth-child(even) {
    background: #f7f7f9;
}


/* ==============================
   КАРТИНКИ
   ============================== */

.t-cms__page figure {
    margin: 35px 0 45px;
}

.t-cms__page figure img {
    width: 100%;
    height: auto;
    border-radius: 6px;
}

.t-cms__page figcaption {
    font-size: 14px;
    color: #777;
    margin-top: 10px;
    line-height: 1.45;
}


/* ==============================
   ЧЕК-ЛИСТ
   ============================== */

.t-cms__page ul.check {
    list-style: none;
    padding-left: 0;
    margin: 25px 0 35px;
}

.t-cms__page ul.check li {
    position: relative;
    padding-left: 32px;
    margin-bottom: 12px;
}

.t-cms__page ul.check li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #34a100;
    font-weight: 700;
}


/* ==============================
   CTA
   ============================== */

.t-cms__page .cta {
    background: #f4f4f7;
    border-radius: 10px;
    padding: 30px 35px;
    margin: 45px 0;
    border-left: 5px solid #494c8d;
}

.t-cms__page .cta h2 {
    font-family: Arial, sans-serif !important;
    font-size: 28px;
    margin: 0 0 12px;
}

.t-cms__page .cta p {
    font-family: Arial, sans-serif !important;
    font-size: 17px;
    font-weight: 400 !important;
    line-height: 1.6;
    margin: 0;
}


/* ==============================
   МОБИЛЬНАЯ
   ============================== */

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

    .t-cms__page .t-redactor__text,
    .t-cms__page .t-redactor__quote {
        font-size: 16px;
        line-height: 1.6;
    }

    .t-cms__page .t-redactor__h2 {
        font-size: 26px !important;
        margin-top: 40px !important;
    }

    .t-cms__page .t-redactor__h3 {
        font-size: 20px !important;
    }

    .t-cms__page table {
        min-width: 650px;
        font-size: 14px;
    }

    .t-cms__page .cta {
        padding: 22px;
    }

}

/* ==============================
   СПИСОК СТАТЕЙ /BLOG/
   ============================== */

/* Заголовок страницы "Советы экспертов" */
.t2823 .t-section__title {
    font-family: Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 42px !important;
    line-height: 1.2 !important;
    color: #332b2d !important;
}

/* Заголовки статей */
.t2823 .t-cms__card .t-name,
.t2823 .t-cms__card .t-cms__card__text {
    font-family: Arial, sans-serif !important;
}

/* Название статьи */
.t2823 .t-cms__card .t-name_md,
.t2823 .t-cms__card [data-style="title_typo"] {
    font-family: Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    line-height: 1.3 !important;
    color: #332b2d !important;
}

/* Дата */
.t2823 .t-cms__card .t-uptitle,
.t2823 .t-cms__card [data-style="text_typo"] {
    font-family: Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    color: #777 !important;
}

/* Расстояние между карточками */
.t2823 .t-cms__card {
    margin-bottom: 35px !important;
}

/* Картинка */
.t2823 .t-cms__card__image {
    border-radius: 8px;
    overflow: hidden;
}

/* Плавный hover заголовка */
.t2823 .t-cms__card:hover .t-name_md,
.t2823 .t-cms__card:hover [data-style="title_typo"] {
    color: #494c8d !important;
}

/* Немного воздуха между картинкой и текстом */
.t2823 .t-cms__card__cell_txt {
    padding-left: 25px !important;
}

/* Мобильная */
@media screen and (max-width: 640px) {

    .t2823 .t-section__title {
        font-size: 30px !important;
    }

    .t2823 .t-cms__card .t-name_md,
    .t2823 .t-cms__card [data-style="title_typo"] {
        font-size: 19px !important;
        line-height: 1.35 !important;
    }

    .t2823 .t-cms__card__cell_txt {
        padding-left: 0 !important;
        padding-top: 15px !important;
    }
}

/* ============================================
   СТРАНИЦА КЕЙСА / НАШИ РАБОТЫ
============================================ */

/* Расширяем область кейса.
   Tilda ставит t-width_8 = около 760px,
   поэтому обязательно переопределяем width */
.t-cms__page-wrapper {
    width: 100% !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 55px 30px 80px !important;
    box-sizing: border-box !important;
}

/* Сам article тоже имеет t-width_8 */
.t-cms__page-wrapper .t-cms__page {
    width: 100% !important;
    max-width: 100% !important;
}


/* ============================================
   ШРИФТЫ
============================================ */

/*
Главная причина "жирного" текста:
на сайте используется фирменный шрифт,
который даже при 400 выглядит тяжело.

Для кейсов используем Arial,
как уже сделали в статьях.
*/

.t-cms__page-wrapper .t-heading,
.t-cms__page-wrapper .t-text,
.t-cms__page-wrapper .t-cms__page__text {
    font-family: Arial, sans-serif !important;
}


/* ============================================
   ЗАГОЛОВОК КЕЙСА
============================================ */

.t-cms__page-wrapper [data-style="post_title_typo"],
.t-cms__page-wrapper .t-heading {
    font-family: Arial, sans-serif !important;

    font-size: 42px !important;
    line-height: 1.15 !important;

    font-weight: 700 !important;

    letter-spacing: -0.5px !important;

    color: #332b2d !important;

    margin-bottom: 25px !important;
}


/* ============================================
   ОПИСАНИЕ И ОБЫЧНЫЙ ТЕКСТ
============================================ */

.t-cms__page-wrapper [data-style="post_descr_typo"],
.t-cms__page-wrapper .t-text {
    font-family: Arial, sans-serif !important;

    font-size: 18px !important;
    line-height: 1.65 !important;

    font-weight: 400 !important;

    color: #332b2d !important;
}


/* На всякий случай сбрасываем жирность
   непосредственно у внутреннего span */
.t-cms__page-wrapper
[data-style="post_descr_typo"]
.t-cms__page__text {

    font-family: Arial, sans-serif !important;
    font-weight: 400 !important;
}


/* ============================================
   ПЕРВОЕ ОПИСАНИЕ ПОД H1
============================================ */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
[data-style="post_descr_typo"] {

    font-size: 20px !important;
    line-height: 1.55 !important;

    font-weight: 400 !important;

    color: #4a4546 !important;
}


/* ============================================
   ОТСТУПЫ ТЕКСТА
============================================ */

/* Между заголовком и описанием */
.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.t-cms__page__molecule_txt {

    margin-bottom: 22px !important;
}


/* Убираем лишний отступ у последнего элемента */
.t-cms__page-wrapper
.t-cms__page__cell_txt
.t-cms__page__molecule_txt:last-child {

    margin-bottom: 0 !important;
}


/* Первый текстовый блок */
.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child {

    margin-bottom: 40px !important;
}


/* ============================================
   ГАЛЕРЕЯ
============================================ */

.t-cms__page-wrapper
.t-cms__page__cell_media {

    margin-top: 0 !important;
    margin-bottom: 45px !important;
}


/* Галерея занимает всю ширину */
.t-cms__page-wrapper
.t-cms__page__molecule_media,

.t-cms__page-wrapper
.t-cms__page__atom_slds {

    width: 100% !important;
    max-width: 100% !important;
}


/* Скругление */
.t-cms__page-wrapper
.t-cms__page__slds-container {

    border-radius: 14px !important;
    overflow: hidden !important;
}


/* Сами изображения */
.t-cms__page-wrapper
.t-cms__page__slds-img {

    border-radius: 14px !important;
}


/* Аккуратная тень */
.t-cms__page-wrapper
.t-cms__page__atom_slds {

    border-radius: 14px !important;

    box-shadow:
        0 5px 20px rgba(0,0,0,0.06),
        0 15px 40px rgba(0,0,0,0.05);
}


/* ============================================
   СТРЕЛКИ
============================================ */

.t-cms__page-wrapper
.t-cms__page__slds-arrow svg {

    width: 44px !important;
    height: 44px !important;

    filter:
        drop-shadow(
            0 3px 7px rgba(0,0,0,0.18)
        );
}


.t-cms__page-wrapper
.t-cms__page__slds-arrow svg circle {

    fill: rgba(255,255,255,0.95) !important;
}


/* ============================================
   ТОЧКИ СЛАЙДЕРА
============================================ */

.t-cms__page-wrapper
.t-slds__bullet_wrapper {

    margin-top: 15px !important;
}


.t-cms__page-wrapper
.t-slds__bullet_body {

    width: 8px !important;
    height: 8px !important;
}


/* ============================================
   ТЕКСТ ПОСЛЕ ФОТОГРАФИЙ
============================================ */

.t-cms__page-wrapper
.t-cms__page__cell_media
+
.t-cms__page__cell_txt {

    margin-top: 10px !important;
}


.t-cms__page-wrapper
.t-cms__page__cell_media
+
.t-cms__page__cell_txt
.t-cms__page__molecule_txt {

    margin-bottom: 18px !important;
}


/* ============================================
   МОБИЛЬНАЯ
============================================ */

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

    .t-cms__page-wrapper {

        width: 100% !important;

        padding:
            40px 25px
            60px !important;
    }


    .t-cms__page-wrapper
    [data-style="post_title_typo"],
    .t-cms__page-wrapper
    .t-heading {

        font-size: 35px !important;
    }


    .t-cms__page-wrapper
    [data-style="post_descr_typo"],
    .t-cms__page-wrapper
    .t-text {

        font-size: 18px !important;
    }

}


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

    .t-cms__page-wrapper {

        padding:
            28px 18px
            50px !important;
    }


    .t-cms__page-wrapper
    [data-style="post_title_typo"],
    .t-cms__page-wrapper
    .t-heading {

        font-size: 29px !important;
        line-height: 1.2 !important;

        letter-spacing: -0.2px !important;
    }


    .t-cms__page-wrapper
    [data-style="post_descr_typo"],
    .t-cms__page-wrapper
    .t-text {

        font-size: 17px !important;
        line-height: 1.6 !important;
    }


    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child
    [data-style="post_descr_typo"] {

        font-size: 18px !important;
    }


    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child {

        margin-bottom: 30px !important;
    }


    .t-cms__page-wrapper
    .t-cms__page__slds-container,

    .t-cms__page-wrapper
    .t-cms__page__slds-img,

    .t-cms__page-wrapper
    .t-cms__page__atom_slds {

        border-radius: 10px !important;
    }

}

/* ==========================================================
   ВЕРХ КЕЙСА: ОПИСАНИЕ + ССЫЛКА НА УСЛУГУ + ХАРАКТЕРИСТИКИ
   ========================================================== */


/* ----------------------------------------------------------
   1. ОСНОВНАЯ СЕТКА ВЕРХНЕГО БЛОКА
   ---------------------------------------------------------- */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child {

    display: grid !important;

    /* 3 характеристики в один ряд */
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    column-gap: 12px !important;
    row-gap: 10px !important;

    margin-bottom: 28px !important;
}


/* ----------------------------------------------------------
   2. ЗАГОЛОВОК H1
   ---------------------------------------------------------- */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.t-cms__page__molecule_txt:first-child {

    grid-column: 1 / -1 !important;

    width: 100% !important;

    margin:
        0 0 8px !important;
}


/* ----------------------------------------------------------
   3. ВВОДНОЕ ОПИСАНИЕ
   ---------------------------------------------------------- */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.t-cms__page__molecule_txt:nth-child(2) {

    grid-column: 1 / -1 !important;

    width: 100% !important;

    margin:
        0 0 8px !important;
}


/* ==========================================================
   4. БЛОК "ПОДРОБНЕЕ ОБ УСЛУГЕ"
   ========================================================== */


/* Контейнер HTML-блока */
.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.t-cms__page__molecule_txt:has(
    [data-fe-post-control="code"]
) {

    grid-column: 1 / -1 !important;

    width: 100% !important;

    margin:
        0 0 8px !important;

    padding: 0 !important;
}


/* Сам HTML */
.t-cms__page-wrapper
[data-fe-post-control="code"] {

    display: flex !important;

    align-items: center !important;

    flex-wrap: wrap !important;

    gap:
        6px 8px !important;

    font-family:
        Arial,
        sans-serif !important;

    font-size: 13px !important;

    line-height: 1.4 !important;

    font-weight: 400 !important;

    color: #777274 !important;
}


/* Ссылки на услуги */
.t-cms__page-wrapper
[data-fe-post-control="code"] a {

    display: inline-flex !important;

    align-items: center !important;

    box-sizing: border-box !important;

    padding:
        5px 10px !important;

    margin: 0 !important;

    background:
        #f5f5f6 !important;

    border:
        1px solid #e4e4e6 !important;

    border-radius:
        20px !important;

    font-family:
        Arial,
        sans-serif !important;

    font-size:
        12px !important;

    line-height:
        1.25 !important;

    font-weight:
        500 !important;

    color:
        #494c8d !important;

    text-decoration:
        none !important;

    white-space:
        nowrap !important;

    transition:
        background 0.2s ease,
        border-color 0.2s ease !important;
}


.t-cms__page-wrapper
[data-fe-post-control="code"] a:hover {

    background:
        #ececef !important;

    border-color:
        #d8d8dc !important;

    color:
        #343765 !important;
}


/* ==========================================================
   5. ХАРАКТЕРИСТИКИ КЕЙСА
   ========================================================== */


/*
Выбираем ТОЛЬКО элементы,
у которых есть data-text-before:

Тип объекта
Площадь
Регион
*/

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.t-cms__page__molecule_txt:has(
    .js-cms-text-container[data-text-before]
) {

    width:
        auto !important;

    min-width:
        0 !important;

    min-height:
        65px !important;

    box-sizing:
        border-box !important;

    display:
        flex !important;

    align-items:
        center !important;

    background:
        #f6f6f7 !important;

    border:
        1px solid #e6e6e8 !important;

    border-radius:
        9px !important;

    padding:
        11px 14px !important;

    margin:
        0 !important;
}


/* Сам span характеристики */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.js-cms-text-container[data-text-before] {

    display:
        block !important;

    width:
        100% !important;

    font-family:
        Arial,
        sans-serif !important;

    font-size:
        16px !important;

    line-height:
        1.25 !important;

    font-weight:
        600 !important;

    color:
        #332b2d !important;
}


/* Название характеристики */

.t-cms__page-wrapper
.t-cms__page__cell_txt:first-child
.js-cms-text-container[data-text-before]::before {

    content:
        attr(data-text-before);

    display:
        block !important;

    margin:
        0 0 5px !important;

    font-family:
        Arial,
        sans-serif !important;

    font-size:
        10px !important;

    line-height:
        1.2 !important;

    font-weight:
        400 !important;

    text-transform:
        uppercase !important;

    letter-spacing:
        0.05em !important;

    color:
        #969193 !important;
}


/* ==========================================================
   6. УМЕНЬШАЕМ РАССТОЯНИЕ ДО ФОТОГАЛЕРЕИ
   ========================================================== */

.t-cms__page-wrapper
.t-cms__page__cell_media {

    margin-top:
        0 !important;
}


/* ==========================================================
   ПЛАНШЕТ
   ========================================================== */

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

    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child {

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }


    /*
    Последняя характеристика,
    если их 3, растягивается на всю строку
    */

    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child
    .t-cms__page__molecule_txt:has(
        .js-cms-text-container[data-text-before]
    ):last-child {

        grid-column:
            1 / -1 !important;
    }

}


/* ==========================================================
   МОБИЛЬНАЯ
   ========================================================== */

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

    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child {

        grid-template-columns:
            1fr !important;

        row-gap:
            8px !important;

        margin-bottom:
            22px !important;
    }


    /* Все элементы на всю ширину */

    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child
    .t-cms__page__molecule_txt {

        grid-column:
            1 / -1 !important;
    }


    /* Характеристики ещё компактнее */

    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child
    .t-cms__page__molecule_txt:has(
        .js-cms-text-container[data-text-before]
    ) {

        min-height:
            auto !important;

        padding:
            11px 13px !important;
    }


    .t-cms__page-wrapper
    .t-cms__page__cell_txt:first-child
    .js-cms-text-container[data-text-before] {

        font-size:
            15px !important;
    }


    /* Ссылки */

    .t-cms__page-wrapper
    [data-fe-post-control="code"] {

        display:
            block !important;

        font-size:
            13px !important;
    }


    .t-cms__page-wrapper
    [data-fe-post-control="code"] a {

        display:
            inline-block !important;

        margin:
            5px 4px
            0 0 !important;
    }

}