.news-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: var(--gap-xl); 
}

.news-card {
    background: var(--dda-surface, #ffffff);
    box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.04);
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid var(--dda-outline, #E4E2E6);
    flex: 1 1 100%;
    /* max-width: 382px;*/
    display: flex;
    flex-direction: column;
    max-width: 100%;
    flex: 0 1 calc(33.33% - var(--gap-xl));
}

    .news-card img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }
.news-link {
    height: 100%;
}

    .news-link:hover {
        background-color: var(--dda-primary);
    }

        .news-link:hover .news-title {
            color: var(--dda-primary-variant); /* highlight color on hover */
        }

.news-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.news-date {
    background: var(--dda-primary-variant, #DBF5FF);
    border-radius: 999px;
    border: 1px solid var(--dda-primary, #00677D);
    padding: 4px 12px;
    color: var(--dda-on-primary-variant, #004E5F);
    font-size: var(--font-caption);
    font-weight: 400;
    line-height: var(--line-height-caption);
    display: inline-block;
    width: fit-content;
}

.news-title {
    color: var(--dda-on-surface, #000000);
    font-size: var(--font-h5);
    font-weight: 400;
    line-height: var(--line-height-h5);
}
@media (max-width:1280px) {

    .news-container { 
        justify-content: center; 
    }
    .news-card {
        flex: 1 1 calc(50% - var(--gap-xl));
    }

}

@media (max-width:767px) {

    .news-card {
        flex: 1 1 100%;
    }
    .news-card img {
        width: 100%;
        height: 310px;
    }  
}