/**
 * Thẻ bài viết dùng chung (đồng bộ với mục "Kiến thức" ở trang chủ).
 * Dùng cho: trang danh mục/lưu trữ bài viết (archive.php) và trang Tin tức (page-news.php).
 * Độc lập với .hd-home nên dùng được ở mọi trang. Prefix hd-pc- để không đụng CSS theme.
 * @package hd
 */

.hd-pc-grid{
  --hdpc-surface:#ffffff;
  --hdpc-alt:#f2ece1;
  --hdpc-text:#20243a;
  --hdpc-text-2:#474c63;
  --hdpc-text-3:#6f7388;
  --hdpc-line:#e7dfd1;
  --hdpc-accent:#ecab14;
  --hdpc-accent-text:#8a5e00;
  --hdpc-r:10px;
  --hdpc-shadow:0 1px 2px rgba(31,35,58,.05), 0 16px 34px -16px rgba(31,35,58,.18);
  --hdpc-brand-blue:#1d3d6b;
  --hdpc-font:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI","Ubuntu",Arial,sans-serif;

  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;
  list-style:none;margin:0;padding:0;
}
.hd-pc-grid *,.hd-pc-grid *::before,.hd-pc-grid *::after{box-sizing:border-box}

.hd-pc-card{
  background:var(--hdpc-surface);border:1px solid var(--hdpc-line);border-radius:var(--hdpc-r);overflow:hidden;
  display:flex;flex-direction:column;font-family:var(--hdpc-font);
  transition:transform .2s ease, box-shadow .2s ease;
}
.hd-pc-card:hover{transform:translateY(-3px);box-shadow:var(--hdpc-shadow)}

.hd-pc-media{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--hdpc-alt)}
.hd-pc-media img{width:100%;height:100%;object-fit:cover;display:block;margin:0;transition:transform .35s ease}
.hd-pc-card:hover .hd-pc-media img{transform:scale(1.05)}

.hd-pc-body{padding:1.5rem 1.7rem 1.7rem;display:flex;flex-direction:column;gap:.65rem;flex:1}
.hd-pc-tag{font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--hdpc-accent-text)}

.hd-pc-card h2,.hd-pc-card h3{
  font-family:var(--hdpc-font);font-weight:600;font-size:1.2rem;line-height:1.35;margin:0;color:var(--hdpc-text);
}
.hd-pc-card h2 a,.hd-pc-card h3 a{color:inherit;text-decoration:none}
.hd-pc-card h2 a:hover,.hd-pc-card h3 a:hover{color:var(--hdpc-accent-text)}

.hd-pc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .9rem;font-size:.8rem;color:var(--hdpc-text-3)}

.hd-brand-name{color:var(--hdpc-brand-blue)}

.hd-pc-card p{
  color:var(--hdpc-text-2);font-size:.95rem;line-height:1.6;margin:0;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;
}

.hd-pc-more{
  margin-top:auto;padding-top:.2rem;font-size:.85rem;font-weight:600;color:var(--hdpc-accent-text);
  display:inline-flex;gap:.4rem;align-items:center;text-decoration:none;
}
.hd-pc-more svg{width:14px;height:14px;transition:transform .2s ease}
.hd-pc-card:hover .hd-pc-more svg{transform:translateX(4px)}

.hd-pc-empty{color:var(--hdpc-text-3);font-family:var(--hdpc-font);padding:2rem 0}