/* Bài tin tức tự viết (source/tin) + khối "Tin nổi bật". Gắn bởi tools/build-tin.mjs */

/* Trang bài: tiêu đề hiện ra là h1 duy nhất */
h1.title-main{font-size:inherit;line-height:1.35;margin:0 0 .75rem}
h1.title-main span{display:inline-block;max-width:900px}

/* Clip dọc ở đầu bài */
.tin-video{margin:0 auto 1.75rem;max-width:380px;text-align:center}
.tin-video video{display:block;width:100%;height:auto;aspect-ratio:9/16;background:#000;border-radius:12px;border:1px solid rgba(206,174,136,.45)}
.tin-video figcaption{margin-top:.6rem;font-size:13px;line-height:1.5;color:rgba(255,255,255,.75)}
.tin-body{max-width:760px;margin:0 auto;font-size:16px;line-height:1.75}
.tin-body h2{color:var(--maincolor);font-size:21px;line-height:1.35;margin:2rem 0 .75rem}
.tin-body h3{color:var(--maincolor);font-size:18px;margin:1.5rem 0 .5rem}
.tin-body p,.tin-body li{margin-bottom:.7rem}
.tin-body ul,.tin-body ol{padding-left:1.3rem}
.tin-body a{color:var(--maincolor);text-decoration:underline;text-underline-offset:3px}
.tin-faq details{border-top:1px solid rgba(206,174,136,.3);padding:.7rem 0}
.tin-faq details:last-child{border-bottom:1px solid rgba(206,174,136,.3)}
.tin-faq summary{cursor:pointer;font-weight:600;list-style-position:outside}
.tin-faq details p{margin:.5rem 0 0}
.tin-cta{margin:2rem 0 1rem;padding:1.1rem 1.25rem;border:1px solid var(--maincolor);border-radius:12px;text-align:center}
.tin-cta p{margin:0 0 .8rem}
.tin-cta .tin-btn{display:inline-block;padding:.6rem 1.4rem;border-radius:999px;background:var(--maincolor);color:#1b1b1b;font-weight:700;text-decoration:none}
.tin-btn:focus-visible,.tin-feat a:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* Nhãn "Nổi bật" trên thẻ ở /tin-tuc */
.newsWhyUs.tin-noibat-card .pic-news{position:relative}
.tin-badge{position:absolute;z-index:2;top:12px;left:12px;padding:3px 10px;border-radius:999px;background:var(--maincolor);color:#1b1b1b;font-size:12px;font-weight:700}

/* Khối "Tin nổi bật" trên trang chủ */
.tin-home{max-width:1190px;margin:0 auto;padding:40px 15px 10px}
.tin-home-head{text-align:center;margin-bottom:24px}
.tin-feat{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:center;color:#fff;text-decoration:none}
.tin-feat-pic{position:relative;margin:0;border-radius:14px;overflow:hidden}
.tin-feat-pic img{display:block;width:100%;height:auto}
.tin-play{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:rgba(0,0,0,.55);font-size:13px;color:#fff}
.tin-play i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--maincolor);color:#1b1b1b;font-size:12px;font-style:normal}
.tin-feat-txt time{font-size:13px;color:rgba(255,255,255,.7)}
.tin-feat-txt h3{margin:.4rem 0 .7rem;font-size:24px;line-height:1.3;color:var(--maincolor)}
.tin-feat-txt p{margin:0 0 1rem;font-size:15px;line-height:1.65;color:rgba(255,255,255,.88)}
.tin-feat-more{font-weight:700;color:var(--maincolor);border-bottom:1px solid currentColor}
.tin-feat:hover .tin-feat-more{color:#fff}
.tin-other{margin:22px 0 0;padding:16px 0 0;border-top:1px solid rgba(206,174,136,.3);list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px}
.tin-other a{color:rgba(255,255,255,.85);font-size:14px;text-decoration:none}
.tin-other a:hover{color:var(--maincolor)}
.tin-all{margin-left:auto}
.tin-all a{color:var(--maincolor);font-weight:700}
@media (max-width:767px){
  .tin-home{padding:28px 15px 0}
  .tin-feat{grid-template-columns:1fr;gap:16px}
  .tin-feat-txt h3{font-size:20px}
  .tin-body{font-size:15px}
  .tin-video{max-width:min(280px,72vw)}
  .tin-all{margin-left:0}
}