/* SAJA_ARTICLE_CARDS_FIXED_V1 */
.card-grid,
.news-feature-card-grid,
.articles-card-grid {
    align-items: stretch !important;
}

.article-card,
.news-feature-card,
.project-card,
.service-card,
.card-grid > a,
.card-grid > article {
    min-height: 430px !important;
}

.article-card,
.news-feature-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    overflow: hidden !important;
}

.article-card img,
.news-feature-card img,
.article-card .card-image img,
.news-feature-card .news-feature-image img {
    width: 100% !important;
    height: 230px !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
}

.article-card .card-body,
.news-feature-card .card-body,
.news-feature-card .news-feature-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
}

.article-card h2,
.article-card h3,
.news-feature-card h2,
.news-feature-card h3,
.news-feature-title {
    min-height: 64px !important;
    max-height: 64px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    line-height: 1.35 !important;
}

.article-card p,
.news-feature-card p,
.news-feature-summary,
.card-summary {
    min-height: 78px !important;
    max-height: 78px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    line-height: 1.65 !important;
}

.article-card .button,
.news-feature-card .button,
.article-card .read-more,
.news-feature-card .read-more {
    margin-top: auto !important;
}

html[lang="ar"] .article-card,
html[lang="ar"] .news-feature-card {
    direction: rtl !important;
    text-align: right !important;
}

html[lang="en"] .article-card,
html[lang="en"] .news-feature-card {
    direction: ltr !important;
    text-align: left !important;
}

@media (max-width: 640px) {
    .article-card,
    .news-feature-card,
    .card-grid > a,
    .card-grid > article {
        min-height: 0 !important;
    }

    .article-card img,
    .news-feature-card img,
    .article-card .card-image img,
    .news-feature-card .news-feature-image img {
        height: 210px !important;
    }

    .article-card h2,
    .article-card h3,
    .news-feature-card h2,
    .news-feature-card h3,
    .news-feature-title {
        min-height: auto !important;
        max-height: 62px !important;
    }
}