/* ==========================================================================
   Component: news card  (<x-site.article-card>) + the grid that holds it
   --------------------------------------------------------------------------
   .acard        white rounded card: cover well · date · title · summary ·
                 round arrow (turns lemon on hover)
   .acard--lead  the newest story on /news: cover beside the text, bigger title
   .agrid        3 → 2 → 1 columns
   ========================================================================== */

.agrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); }
.acard--lead + .agrid { margin-top: var(--gap); }
.agrid + .pagination { margin-top: var(--s-6); }

.acard {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--r-xl);
    background: var(--card);
    color: var(--ink);
}
.acard__media { display: block; aspect-ratio: 16 / 10; margin: var(--s-2); overflow: hidden; border-radius: var(--r-lg); background: var(--card-soft); }
.acard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--t) var(--ease); }
.acard:hover .acard__media img { transform: scale(1.04); }

.acard__body { position: relative; flex: 1; display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-3) var(--s-5) var(--s-5); }
.acard__date { display: inline-flex; align-items: center; gap: var(--s-2); color: var(--teal); font-size: var(--fs-xs); font-weight: 600; }
.acard__title { font-size: var(--fs-md); line-height: 1.45; }
.acard__excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--ink-soft); font-size: var(--fs-sm); }
.acard__go {
    display: grid;
    place-items: center;
    align-self: flex-end;
    width: 40px;
    height: 40px;
    margin-top: auto;
    border-radius: 50%;
    background: var(--page);
    transition: background-color var(--t-fast) var(--ease);
}
.acard:hover .acard__go { background: var(--lemon); }
.acard:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; }

/* Lead story */
.acard--lead { display: grid; grid-template-columns: 1.25fr 1fr; }
.acard--lead .acard__media { aspect-ratio: auto; min-height: 340px; }
.acard--lead .acard__body { justify-content: center; padding: clamp(1.5rem, 1rem + 2vw, 3rem); }
.acard--lead .acard__title { font-size: var(--fs-xl); line-height: 1.3; }
.acard--lead .acard__excerpt { -webkit-line-clamp: 4; font-size: var(--fs-md); }
.acard--lead .acard__go { margin-top: var(--s-4); align-self: flex-start; width: 48px; height: 48px; background: var(--navy); color: #fff; }
.acard--lead:hover .acard__go { background: var(--lemon); color: var(--navy); }

.news-empty { display: flex; align-items: center; gap: var(--s-3); color: var(--ink-soft); }
.news-empty .icon { width: 28px; height: 28px; color: var(--navy); }

@media (max-width: 991.98px) {
    .agrid { grid-template-columns: repeat(2, 1fr); }
    .acard--lead { grid-template-columns: 1fr; }
    .acard--lead .acard__media { aspect-ratio: 16 / 10; min-height: 0; }
}
@media (max-width: 575.98px) {
    .agrid { grid-template-columns: 1fr; }
}