/**
 * ==========================================================================
 * SurLeFoot — Grille « À ne pas manquer »
 * ==========================================================================
 */

.slf-news-grid__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--slf-space-4, 16px);
}

/*
 * Variante compacte spécifique à la grille secondaire.
 * Cette règle ne touche pas aux cartes « Derniers articles ».
 */
.slf-news-grid__card.slf-article-card--compact {
    grid-template-columns: 108px minmax(0, 1fr);
    min-height: 112px;
}

.slf-news-grid__card .slf-article-card__media-link {
    height: 100%;
    min-height: 112px;

    border-radius:
        var(--slf-radius-large, 14px)
        0
        0
        var(--slf-radius-large, 14px);
}

.slf-news-grid__card .slf-editorial-media,
.slf-news-grid__card .slf-editorial-media__image,
.slf-news-grid__card .slf-editorial-media__placeholder {
    width: 100%;
    height: 100%;
    min-height: 112px;
    aspect-ratio: auto;

    border-radius:
        var(--slf-radius-large, 14px)
        0
        0
        var(--slf-radius-large, 14px);
}

.slf-news-grid__card .slf-article-card__body {
    justify-content: center;
    gap: var(--slf-space-2, 8px);
    padding: var(--slf-space-3, 12px);
}

.slf-news-grid__card .slf-article-card__title {
    display: -webkit-box;
    overflow: hidden;

    font-size: var(--slf-font-size-300, 0.95rem);
    line-height: 1.35;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.slf-news-grid__card .slf-article-meta {
    font-size: var(--slf-font-size-100, 0.78rem);
}

@media (max-width: 1100px) {
    .slf-news-grid__items {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .slf-news-grid__card.slf-article-card--compact {
        grid-template-columns: 96px minmax(0, 1fr);
        min-height: 100px;
    }

    .slf-news-grid__card .slf-article-card__media-link,
    .slf-news-grid__card .slf-editorial-media,
    .slf-news-grid__card .slf-editorial-media__image,
    .slf-news-grid__card .slf-editorial-media__placeholder {
        min-height: 100px;

        border-radius:
            var(--slf-radius-large, 14px)
            0
            0
            var(--slf-radius-large, 14px);

        aspect-ratio: auto;
    }
}