/* =================================================================
   News module — built on the shared design tokens (indigo/marigold/
   teal, Manrope display + Inter body), same as chat and profile.
   ================================================================= */

.news-page-head {
    margin-bottom: 1rem; padding: .9rem 1.1rem;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius, 5px);
}
.news-page-title { margin: 0; font-size: 1.05rem; }

.news-list { display: flex; flex-direction: column; gap: 1rem; }

.news-card {
    display: flex;
    gap: 1rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius, 5px);
    padding: 1rem;
    text-decoration: none;
    color: inherit;
    transition: transform .1s ease, box-shadow .15s ease;
}
.news-card:hover { transform: translateY(-1px); box-shadow: var(--shadow, 0 4px 14px -6px rgba(0,0,0,.15)); }

.news-card-thumb {
    width: 140px; height: 90px; flex-shrink: 0;
    border-radius: 8px; object-fit: cover; background: var(--paper);
}
.news-card-thumb-placeholder {
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; color: var(--ink-soft);
}

.news-card-body { min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.news-card-body h2 { font-size: 1.05rem; margin: 0; }
.news-card-excerpt { margin: 0; font-size: .88rem; color: var(--ink-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-card-meta { font-size: .78rem; color: var(--ink-soft); display: flex; gap: .4rem; margin-top: .2rem; }



.news-article-image { width: 100%; border-radius: var(--radius, 5px); object-fit: cover; max-height: 420px; margin-bottom: 1.25rem; }
.news-article h1 { margin-bottom: .35rem; }
.news-article-meta { font-size: .85rem; color: var(--ink-soft); display: flex; gap: .4rem; margin-bottom: 1.25rem; }
.news-article-body { font-size: .98rem; line-height: 1.65; margin-bottom: 1.5rem; }

@media (max-width: 600px) {
    .news-card { flex-direction: column; }
    .news-card-thumb { width: 100%; height: 160px; }
}