.news-box {
    width: 95%;
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;

    margin: 0 auto;

    padding-top: 2%;
    padding-bottom: 5%;
    margin-bottom: 2rem;
}

.news-block {
    width: 100%;
    margin: 0 auto;

    display: flex;
    flex-direction: column;

    background-color: var(--block-color-secondary);

    border-radius: var(--border-radius-primary);
}

.news-title {
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;

    border-radius: var(--border-radius-primary) var(--border-radius-primary) 0 0;

    padding: 2%;

    background-image: 
    linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.5)),
    url(https://th.bing.com/th/id/R.1c3684aff9b0ac40f531fe61f51e1fa2?rik=sV7eLMt%2b37Mu7w&pid=ImgRaw&r=0);
    background-size: cover; /* Масштабируем изображение на весь блок */
    background-position: center; /* Центрируем изображение */
    
    /* Маска для плавного исчезновения */
    mask-image: linear-gradient(to bottom, black 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 60%, transparent 100%); 
    /* Для поддержки в Safari */
}

.news-title h2 {
    margin: 0;
    color: var(--text-color-primary);
    text-align: center;
}

.news-title a {
    padding-top: 1.5%;
    padding-bottom: 2%;
    color: var(--text-color-secondary);
}

.news-description {
    padding: 1%;
    color: var(--text-color-primary);
}

@media (max-width: 768px) {

    .news-box {
        padding-bottom: 20%;
    }
    .news-description {
        padding: 5%;
    }

    .news-title {
        padding: 5%;
    }
}



