.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } .news-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 12px rgba(0,0,0,0.08); transition: 0.3s ease; } .news-card:hover { transform: translateY(-6px); } .news-image { width: 100%; height: 220px; object-fit: cover; } .news-content { padding: 16px; } .news-title { font-size: 18px; font-weight: 700; margin-bottom: 10px; line-height: 1.4; } .news-desc { font-size: 14px; color: #555; margin-bottom: 12px; } .news-date { font-size: 13px; color: #999; } /* Responsive */ @media (max-width: 1024px) { .news-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .news-grid { grid-template-columns: 1fr; } }