/* Thẻ bài blog trong trang cổng của một họ đề.
   Tách ra file riêng thay vì nhét <style> vào từng trang: 4 trang cổng dùng
   chung, mà sat.css không có sẵn .bl-* (khu SAT cũng phải tự mang style, xem
   khối <style> trong sat8020/blog.html — bản này chép từ đó, chỉ đổi tên lưới
   .bl-luoi thành .bl-grid cho khớp mã do blogbuild.py sinh). */
.bl-grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  margin-top:16px; }
.bl-card { display:block; background:var(--card,#fff); border:1px solid var(--line,#e5e7eb);
  border-radius:var(--radius,14px); padding:20px; text-decoration:none; color:inherit;
  box-shadow:var(--shadow,0 1px 4px rgba(16,32,60,.06));
  transition:box-shadow .15s, transform .15s; }
.bl-card:hover { box-shadow:0 6px 20px rgba(16,32,60,.14); transform:translateY(-2px); }
.bl-emo { font-size:26px; }
.bl-tag { display:inline-block; background:var(--acc-soft); color:var(--acc);
  font-weight:800; font-size:11.5px; letter-spacing:.04em; padding:3px 10px;
  border-radius:999px; margin:6px 0 4px; }
.bl-card h2 { color:var(--navy,#1C355F); font-size:16.5px; line-height:1.35; margin:4px 0 6px; }
.bl-card p { color:#5a6b82; font-size:13.5px; line-height:1.5; margin:0; }
.bl-foot { display:flex; gap:12px; align-items:center; color:#8291a6; font-size:12.5px;
  margin-top:12px; }
.bl-more { margin-left:auto; color:var(--acc); font-weight:700; }

/* Chưa có bài nào thì nói thẳng, đừng để một khoảng trắng không giải thích. */
.bl-empty { grid-column:1/-1; background:#F8FAFC; border:1px dashed var(--line-2);
  border-radius:var(--radius); padding:16px 18px; font-size:13.5px; color:var(--muted); }