/* ==========================================================================
   CSS trang BÀI VIẾT CHI TIẾT — copy NGUYÊN VĂN từ file design
   htmls-design/SHI-IP-Tam-Duong_Tin-tuc-chi-tiet.html (khối <style> cuối).
   ĐỪNG sửa file này (để còn diff với design). Mọi hoà giải WordPress ↔ design
   (output của block editor…) nằm ở khối "BÀI VIẾT" trong flatsome-native.css.
   ========================================================================== */

/* ===== Bài viết chi tiết ===== */
.art{padding:30px 0 0}
.art__head{max-width:928px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.art__crumb{font-size:14px;line-height:normal;letter-spacing:.5px;color:#767068;text-wrap:pretty}
.art__crumb a{color:#767068;transition:color .18s ease}
.art__crumb a:hover{color:var(--gold-deep)}
.art__crumb b{font-weight:700;color:var(--ink)}
.art__meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px}
.art__meta span{font-size:13.5px;line-height:normal;color:#6e6e6e}
.art__title{max-width:928px;margin:36px auto 0;font-family:var(--font-body);font-weight:600;font-size:38px;line-height:1.32;color:var(--ink);text-align:center;text-wrap:balance}

.art__body{max-width:780px;margin:30px auto 0;display:flex;flex-direction:column;gap:20px}
.art__body p{font-size:16px;line-height:1.6;color:var(--ink);text-wrap:pretty}
.art__body p b,.art__body p strong{font-weight:700}
.art__body a{color:var(--ink);text-decoration:underline;text-underline-position:from-font;transition:color .18s ease}
.art__body a:hover{color:var(--gold-deep)}
.art__lead{font-weight:700;font-style:italic}

.art__fig{display:flex;flex-direction:column;gap:12px;margin:0}
.art__fig img{width:100%;aspect-ratio:720/380;object-fit:cover;border-radius:16px;display:block}
.art__fig figcaption{font-size:12px;font-style:italic;line-height:1.6;color:#45423b;text-align:center;text-wrap:pretty}

/* ===== Tin tức khác ===== */
.art-more{padding:56px 0 96px}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px;align-items:stretch}
.rel-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e5e3de;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.05);transition:transform .18s ease,box-shadow .18s ease}
.rel-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.09)}
.rel-card__img{width:100%;height:260px;object-fit:cover;display:block}
.rel-card__body{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:22px}
.rel-card__title{font-weight:600;font-size:22px;line-height:1.35;color:var(--ink);text-wrap:pretty}
.rel-card__desc{font-size:14px;line-height:1.55;color:rgba(26,24,20,.68)}
.rel-card__read{margin-top:auto;font-weight:600;font-size:14px;color:var(--gold-link)}

@media(max-width:1024px){
  .art__title{font-size:32px}
  .rel-grid{grid-template-columns:1fr 1fr}
  .rel-card__img{height:220px}
}
@media(max-width:768px){
  .art{padding-top:24px}
  .art__title{font-size:28px;margin-top:28px}
  .art-more{padding:40px 0 72px}
}
@media(max-width:560px){
  .art__title{font-size:24px}
  .art__body{gap:18px}
  .art__body p{font-size:15.5px}
  .rel-grid{grid-template-columns:1fr;gap:20px}
  .rel-card__img{height:200px}
  .rel-card__title{font-size:20px}
}