

/* Start:/bitrix/templates/leslab/components/bitrix/news.detail/facts_detail/style.css?17875214703222*/
/* ============================================================
   Раздел «Лесные факты» — детальная страница.
   Макета в Figma нет, значения согласованы с остальными разделами.
   ============================================================ */

.fact-detail {
    padding-block: 60px;

    /* Базовый размер основного текста вынесен в переменную:
       от него считается лид (110%), чтобы при правке шрифта
       не пришлось пересчитывать два места. */
    --fact-text-size: 18px;
}

/* Текст читается длинными строками плохо, поэтому колонку
   ограничиваем по ширине, а не растягиваем на весь контейнер. */
.fact-detail__inner {
    max-width: 800px;
}

/* Заголовок с латинским именем отбит от фото с запасом воздуха */
.fact-detail__head {
    margin-bottom: 40px;
}

.fact-detail__title {
    margin: 0 0 6px 0;
    font-family: var(--font-family-base);
    font-weight: 600;
    font-size: 32px;
    line-height: 1.1;
    color: #fff;
}

.fact-detail__latin {
    margin: 0;
    font-size: 16px;
    font-weight: 300;
    font-style: italic;
    line-height: 1.1;
    color: var(--color-surface-sage);
}

.fact-detail__media {
    margin-bottom: 25px;
}

.fact-detail__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* --- лид (анонс под фотографией) -------------------------- */

.fact-detail__lead {
    margin-bottom: 25px;
    padding-left: 10px;
    border-left: 3px solid var(--color-accent-orange);
    font-size: calc(var(--fact-text-size) * 1.1);
    font-weight: 300;
    font-style: italic;
    line-height: 1.3;
    color: #fff;
}

.fact-detail__lead p {
    margin: 0 0 0.6em 0;
}

.fact-detail__lead p:last-child {
    margin-bottom: 0;
}

/* --- основной текст --------------------------------------- */

.fact-detail__text {
    font-size: var(--fact-text-size);
    font-weight: 300;
    line-height: 1.35;
    color: #fff;
}

.fact-detail__text p {
    margin: 0 0 0.8em 0;
}

.fact-detail__text p:last-child {
    margin-bottom: 0;
}

.fact-detail__text img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

/* --- возврат к списку ------------------------------------- */

.fact-detail__back {
    margin: 35px 0 0 0;
}

.fact-detail__back-link {
    font-size: var(--fact-text-size);
    font-weight: 300;
    line-height: 1.1;
    color: var(--color-accent-yellow);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.fact-detail__back-link:hover {
    border-bottom-color: var(--color-accent-yellow);
}

@media (max-width: 767.98px) {
    .fact-detail {
        padding-block: 30px;
        --fact-text-size: 16px;
    }

    .fact-detail__inner {
        padding-inline: 20px;
    }

    .fact-detail__head {
        margin-bottom: 30px;
    }

    .fact-detail__title {
        font-size: 26px;
    }
}

/* End */


/* Start:/bitrix/templates/leslab/components/bitrix/news.list/facts_related/style.css?17875214551629*/
/* ============================================================
   Блок «Вам может быть интересно» — четыре других факта.
   Макета в Figma нет; размеры согласованы с остальными разделами.
   ============================================================ */

.facts-related {
    padding-bottom: 60px;
}

.facts-related__inner {
    max-width: 800px;
}

.facts-related__heading {
    margin: 0 0 20px 0;
    font-family: var(--font-family-base);
    font-weight: 500;
    font-size: 24px;
    line-height: 1.1;
    color: #fff;
}

.facts-related__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.fact-teaser__link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.fact-teaser__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
    margin-bottom: 8px;
}

.fact-teaser__title {
    display: block;
    /* 80% от базового шрифта сайта (16px) */
    font-size: 12.8px;
    font-weight: 300;
    line-height: 1.2;
    color: #fff;
}

.fact-teaser__link:hover .fact-teaser__title {
    color: var(--color-accent-yellow);
}

@media (max-width: 767.98px) {
    .facts-related {
        padding-bottom: 30px;
    }

    .facts-related__inner {
        padding-inline: 20px;
    }

    /* Четыре квадрата в ряд на телефоне превращаются в марки —
       ставим два. */
    .facts-related__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

/* End */
/* /bitrix/templates/leslab/components/bitrix/news.detail/facts_detail/style.css?17875214703222 */
/* /bitrix/templates/leslab/components/bitrix/news.list/facts_related/style.css?17875214551629 */
