.news-hero{padding:32px 0 0}
.news-hero__title{font-size:2rem;font-weight:800;color:var(--dark)}

.news-section{padding:24px 0 48px}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

.news-card{display:flex;flex-direction:column;background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);transition:var(--transition)}
.news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.news-card__img{height:200px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--bg)}
.news-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.news-card:hover .news-card__img img{transform:scale(1.05)}
.news-card__img--placeholder{color:var(--text-muted)}
.news-card__body{padding:20px;flex:1;display:flex;flex-direction:column}
.news-card__meta{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.news-card__date{font-size:.75rem;color:var(--text-muted)}
.news-card__comments{display:flex;align-items:center;gap:3px;font-size:.75rem;color:var(--text-muted)}
.news-card__title{font-size:1rem;font-weight:700;color:var(--dark);margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-card__excerpt{font-size:.85rem;color:var(--text-light);line-height:1.5;margin-bottom:12px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-card__read-more{font-size:.82rem;font-weight:600;color:var(--primary);margin-top:auto}

.news-empty{text-align:center;padding:64px 20px;color:var(--text-muted)}
.news-empty svg{margin-bottom:16px;opacity:.4}
.news-empty h3{font-size:1.2rem;color:var(--dark);margin-bottom:8px}

@media(max-width:919px){
    .news-grid{grid-template-columns:repeat(2,1fr);gap:20px}
}
@media(max-width:519px){
    .news-hero__title{font-size:1.5rem}
    .news-grid{grid-template-columns:1fr;gap:16px}
    .news-card__img{height:180px}
    .news-card__body{padding:14px}
}
@media(max-width:299px){
    .news-hero__title{font-size:1.2rem}
    .news-card__img{height:140px}
    .news-card__body{padding:10px}
    .news-card__title{font-size:.9rem}
}
