.news-block {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);

    @media screen and (max-width: 500px) {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .news-item {
        height: 450px;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        cursor: pointer;

        img {
            width: 100%;
            object-fit: cover;
            height: 240px;
            border-radius: 12px;
        }

        .news-text {
            display: -webkit-box;
            -webkit-line-clamp: 6;
            -webkit-box-orient: vertical;
            overflow: hidden;

            span:nth-child(1) {
                color: var(--primary-text-color);
                font-weight: 600;
                font-size: 16px;
            }

            span:nth-child(3) {
                color: var(--secondary-text-color);
                font-weight: 400;
                font-size: 14px;
            }
        }

        .date-text {
            font-weight: 400;
            font-size: 12px;
            color: rgba(0, 0, 0, 0.4);
        }
    }
}

.news-container {
    .news-page-show-more-button {
        display: flex;
        justify-content: center;
        margin-top: 10px;
        margin-bottom: 20px;
    }

    .date-details {
        font-weight: 400;
        font-size: 14px;
        color: var(--secondary-text-color);
    }

    .main-slider-container {
        position: relative;
        margin-bottom: 20px;
    }

    .counter {
        position: absolute;
        top: 15px;
        right: 15px;
        background: rgba(0, 0, 0, 0.3);
        color: white;
        padding: 2px 5px;
        border-radius: 4px;
        font-size: 14px;
        z-index: 10;
    }

    .main-swiper {
        border-radius: 12px;
        overflow: hidden;
        height: 460px;
        background: var(--card-background-color);
    }

    .main-swiper .swiper-slide {
        cursor: pointer;
        transition: transform 0.3s ease;
    }

    .main-swiper .swiper-slide:hover {
        transform: scale(1.02);
    }

    .main-swiper .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
    }

    .thumb-swiper-wrapper {
        display: flex;
        align-items: center;
    }

    .thumb-swiper-container {
        position: relative;
        width: 100%;
    }

    .thumb-swiper {
        height: 72px;
    }

    .thumb-swiper .swiper-slide {
        opacity: 0.6;
        transition: opacity 0.3s ease;
        cursor: pointer;
        padding: 2px;

    }

    .thumb-swiper .swiper-slide-thumb-active {
        opacity: 1;
        border: 2px solid var(--primary-color);
        border-radius: 8px;
    }

    .thumb-swiper .swiper-slide {
        width: 72px;
    }

    .thumb-swiper .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 6px;
    }

    /* Стрелки для основного и thumbnail слайдеров */

    .thumb-nav {
        position: unset;
        width: 24px;
        height: 100%;
        z-index: 10;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s ease;
        margin-top: -3px;
        background: transparent;
        box-shadow: unset;
    }

    .main-nav-prev, .thumb-nav-prev {
        left: 10px;
    }

    .main-nav-next, .thumb-nav-next {
        right: 10px;
    }

    .thumb-nav {
        width: 50px !important;
        height: 100% !important;
    }

    /*.thumb-nav::after {*/
    /*    width: 8px;*/
    /*    height: 8px;*/
    /*    border-width: 0 1px 1px 0;*/
    /*}*/

    /* Модальное окно */

    .modal {
        display: none;
        position: fixed;
        /*top: 0;*/
        /*left: 0;*/
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.95);
        z-index: 1000;
        justify-content: center;
        align-items: center;
    }

    #imageModal {
        border-radius: 0;
    }

    .modal.active {
        display: flex;
    }

    .modal-content {
        width: 100%;
        height: 100%;
        position: relative;
        padding: 0;
    }

    .modal-swiper {
        width: 100%;
        height: calc(100% - 100px);
    }

    .modal-swiper .swiper-slide {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .modal-swiper .swiper-slide img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .modal-thumb-swiper {
        height: 80px;
        padding: 0 100px;
    }

    .modal-thumb-swiper .swiper-slide {
        opacity: 0.6;
        transition: opacity 0.3s ease;
        cursor: pointer;
        padding: 2px;
    }

    .modal-thumb-swiper .swiper-slide-thumb-active {
        opacity: 1;
        border: 2px solid var(--primary-color);
        border-radius: 8px;
    }

    .modal-thumb-swiper .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        border-radius: 4px;
    }

    .modal-close {
        position: absolute;
        top: 20px;
        right: 50px;
        color: white;
        font-size: 30px;
        cursor: pointer;
        z-index: 1010;
        background: rgba(0, 0, 0, 0.5);
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;

        @media screen and (max-width: 500px) {
            right: 20px;
        }
    }

    .modal-nav {
        position: absolute;
        top: 0;
        height: 104%;
        width: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 1005;
        transition: background-color 0.3s ease;
        border-radius: 0;
        background: transparent;
    }

    .modal-nav:hover {
        @media screen and (min-width: 500px) {
            background: rgba(255, 255, 255, 0.1);
        }
    }

    .modal-nav-prev {
        left: 0;
    }

    .modal-nav-next {
        right: 0;
    }

    .modal-nav::after {
        color: white;
    }

    /*.modal-nav-prev::after {*/
    /*    transform: rotate(135deg);*/
    /*    margin-right: 5px;*/
    /*}*/

    /*.modal-nav-next::after {*/
    /*    transform: rotate(-45deg);*/
    /*    margin-left: 5px;*/
    /*}*/

    /* Адаптивность */
    @media (max-width: 500px) {
        .main-swiper {
            height: 200px;
        }

        .modal-nav {
            width: 50px;
        }

        .modal-thumb-swiper {
            height: 60px;
        }

        .main-nav, .thumb-nav {
            display: none;
        }
    }

}

.breadcrumbs a,
.breadcrumbs a:visited {
    color: var(--secondary-text-color);
    text-decoration: none;
}

.breadcrumbs .active {
    color: var(--primary-text-color);
    font-weight: 600;
}
/* ровно размер из макета: 14px = 0.875rem при root 16px */
.news-container .breadcrumbs {
    font-size: 0.875rem;   /* 14px */
    line-height: 1.4;
    color: var(--secondary-text-color);
}

/* чтобы ссылки/спаны не подхватывали другие размеры из глобальных правил */
.news-container .breadcrumbs a,
.news-container .breadcrumbs span {
    font-size: inherit;
}

/* активная крошка */
.news-container .breadcrumbs .active {
    color: var(--primary-text-color);
    font-weight: 700;
}

/* (если используешь точки-разделители через ::before) подстроим отступы */
.news-container .breadcrumbs li + li::before {
    margin: 0 8px;
}


.news-container .entry-intro,
.news-container .entry-content {
    color: var(--primary-text-color);
    font-family: inherit;
    font-size: 16px;           /* базовый размер для текста */
    line-height: 1.6;
}

/* Гутенберг-списки не должны менять размер */
.news-container .entry-intro :where(.wp-block-list, ul, ol),
.news-container .entry-content :where(.wp-block-list, ul, ol) {
    font-size: inherit;
    line-height: inherit;
    margin: 0 0 1rem 1.25rem;  /* отступ слева под маркеры */
    padding: 0;
}

/* Элементы списка */
.news-container .entry-intro :where(li),
.news-container .entry-content :where(li) {
    font-size: inherit;
    line-height: inherit;
    margin: 0 0 .35rem 0;
}

/* Вложенные списки — более лёгкий маркер и меньший отступ */
.news-container .entry-intro :where(ul ul, ol ol),
.news-container .entry-content :where(ul ul, ol ol) {
    margin-left: 1rem;
    list-style-type: circle;
}

/* Абзацы, ссылки, жирный — наследуют размер */
.news-container .entry-intro :where(p, a, strong, b, em, i),
.news-container .entry-content :where(p, a, strong, b, em, i) {
    font-size: inherit;
    line-height: inherit;
}

/* Заголовки внутри контента */
.news-container .entry-intro :where(h2),
.news-container .entry-content :where(h2) { font-size: 24px; line-height: 1.35; margin: 1.25rem 0 .5rem; }
.news-container .entry-intro :where(h3),
.news-container .entry-content :where(h3) { font-size: 20px; line-height: 1.4;  margin: 1rem 0 .5rem; }

/* Убираем верхний отступ у первого элемента контента */
.news-container .entry-intro > *:first-child,
.news-container .entry-content > *:first-child { margin-top: 0; }

.button-wrapper[disabled] { opacity: .6; cursor: default; }