*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#172033;background:#f5f7fb;line-height:1.6}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1120px,calc(100% - 32px));margin:auto}.site-header{background:#fff;border-bottom:1px solid #e5e9f2;position:sticky;top:0;z-index:20}.header-row{min-height:70px;display:flex;align-items:center;gap:24px}.brand{font-size:26px;font-weight:800;color:#1769e0}.main-nav{display:flex;gap:16px;align-items:center;flex:1;overflow:auto;white-space:nowrap}.main-nav a:hover{color:#1769e0}.header-search{display:flex}.header-search input,.search input{border:1px solid #d8deea;border-radius:8px 0 0 8px;padding:10px 12px}.header-search button,.search button{border:0;background:#1769e0;color:#fff;padding:10px 14px;border-radius:0 8px 8px 0}.hero{padding:72px 0;background:linear-gradient(135deg,#eaf2ff,#fff6dd)}.hero h1{max-width:850px;font-size:clamp(34px,5vw,58px);line-height:1.12;margin:12px 0}.hero p{max-width:760px;font-size:18px;color:#536078}.pill{display:inline-block;background:#dfeaff;color:#1659b8;padding:7px 12px;border-radius:999px;font-weight:700;font-size:14px}.section{padding:48px 0}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.section-title h1,.section-title h2{margin:0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:#fff;border:1px solid #e5e9f2;border-radius:14px;overflow:hidden;box-shadow:0 5px 18px rgba(22,35,60,.05)}.card img{width:100%;height:210px;object-fit:cover}.card-body{padding:18px}.card h3{margin:8px 0;font-size:21px;line-height:1.35}.card p{margin:0;color:#5d687d}.meta{font-size:13px;color:#7a8598}.page-card{background:#fff;border:1px solid #e5e9f2;border-radius:14px;padding:28px}.empty{background:#fff;padding:25px;border-radius:12px;border:1px dashed #cbd3e1}.pagination{display:flex;gap:8px;justify-content:center;margin-top:28px}.pagination a,.pagination span{padding:8px 12px;background:#fff;border:1px solid #dfe4ed;border-radius:8px}.pagination .active{background:#1769e0;color:#fff}.list-item{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid #e8ebf1}.list-item img{width:180px;height:110px;object-fit:cover;border-radius:10px}.site-footer{background:#172033;color:#d9e0ec;margin-top:50px;padding:42px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}.footer-grid a{display:block;margin:7px 0}.copyright{border-top:1px solid #394257;margin-top:24px;padding-top:18px;font-size:14px}.article-cover{width:100%;max-height:520px;object-fit:cover;border-radius:14px;margin:20px 0}.article-content{font-size:18px}.article-content img{height:auto}.article-content h2,.article-content h3{line-height:1.3;margin-top:1.5em}@media(max-width:900px){.header-row{flex-wrap:wrap;padding:12px 0}.main-nav{order:3;width:100%}.header-search{margin-left:auto}.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.container{width:min(100% - 22px,1120px)}.hero{padding:46px 0}.grid{grid-template-columns:1fr}.card img{height:200px}.header-search{width:100%}.header-search input{flex:1}.list-item{grid-template-columns:1fr}.list-item img{width:100%;height:190px}.footer-grid{grid-template-columns:1fr}}
/* Trang chủ TIT.VN */
.home-intro{padding:54px 0;background:linear-gradient(135deg,#edf5ff 0%,#fff 48%,#f8efff 100%);border-bottom:1px solid #e8edf5}.home-intro-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:36px;align-items:center}.home-intro-copy h1{font-size:clamp(34px,4.6vw,56px);line-height:1.12;letter-spacing:-1.6px;margin:14px 0 16px;max-width:760px}.home-intro-copy p{font-size:18px;color:#59667d;max-width:690px;margin:0}.home-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.btn-primary,.btn-light{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 18px;border-radius:10px;font-weight:700}.btn-primary{background:#1769e0;color:#fff;box-shadow:0 8px 18px rgba(23,105,224,.2)}.btn-primary:hover{background:#0f58c5}.btn-light{background:#fff;border:1px solid #dbe3ef;color:#23314a}.home-feature-panels{display:grid;gap:12px}.feature-panel{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.9);border:1px solid #e2e8f2;border-radius:14px;padding:16px;box-shadow:0 8px 22px rgba(26,43,76,.06);transition:.2s ease}.feature-panel:hover{transform:translateY(-2px);border-color:#b9d1f5}.feature-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:#edf4ff;font-size:24px;flex:0 0 auto}.feature-panel span:nth-child(2){display:flex;flex-direction:column}.feature-panel strong{font-size:16px}.feature-panel small{color:#6d788c;margin-top:2px}.section-kicker{display:block;color:#1769e0;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}.section-link,.read-more{color:#1769e0;font-weight:700}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.category-tile{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid #e3e8f1;border-radius:13px;padding:17px;box-shadow:0 5px 16px rgba(20,35,62,.04);transition:.2s ease}.category-tile:hover{transform:translateY(-2px);border-color:#b9d1f5}.category-icon{display:grid;place-items:center;width:44px;height:44px;background:#f1f5ff;border-radius:11px;font-size:23px}.category-info{display:flex;flex-direction:column;min-width:0;flex:1}.category-info strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-info small{color:#7a8598}.category-arrow{color:#1769e0;font-size:20px}.home-posts{padding-top:28px}.home-post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.home-post-card{background:#fff;border:1px solid #e3e8f1;border-radius:14px;overflow:hidden;box-shadow:0 7px 20px rgba(20,35,62,.055);transition:.2s ease}.home-post-card:hover{transform:translateY(-3px);box-shadow:0 11px 28px rgba(20,35,62,.09)}.home-post-image{display:block;height:170px;background:linear-gradient(135deg,#eaf2ff,#f8efff)}.home-post-image img{width:100%;height:100%;object-fit:cover}.post-placeholder{display:grid;place-items:center;width:100%;height:100%;font-size:28px;font-weight:900;color:#1769e0;letter-spacing:.08em}.home-post-body{padding:17px}.post-topline{display:flex;justify-content:space-between;align-items:center;gap:8px}.post-category{display:inline-flex;background:#edf4ff;color:#1557b3;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700;max-width:58%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-post-card h3{font-size:19px;line-height:1.35;margin:11px 0 8px}.home-post-card p{color:#616d81;margin:0 0 14px}.read-more{font-size:14px}.home-cta-section{padding:8px 0 48px}.home-cta-card{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#172033;color:#fff;border-radius:17px;padding:28px 32px}.home-cta-card h2{margin:3px 0 6px}.home-cta-card p{margin:0;color:#cbd4e3}.home-cta-card .section-kicker{color:#8ebcff}
@media(max-width:900px){.home-intro-grid{grid-template-columns:1fr}.home-feature-panels{grid-template-columns:repeat(3,1fr)}.feature-panel{align-items:flex-start}.category-grid,.home-post-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.home-intro{padding:38px 0}.home-intro-copy h1{font-size:36px;letter-spacing:-.8px}.home-intro-copy p{font-size:16px}.home-feature-panels{grid-template-columns:1fr}.category-grid,.home-post-grid{grid-template-columns:1fr}.home-post-image{height:190px}.home-cta-card{align-items:flex-start;flex-direction:column;padding:23px}.home-cta-card .btn-primary{width:100%}}
/* Trang chi tiết bài viết - TIT.VN Pro */
.article-page-section{padding-top:32px}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}.article-main{background:#fff;border:1px solid #e4e9f2;border-radius:16px;padding:clamp(22px,4vw,42px);box-shadow:0 8px 28px rgba(25,40,70,.055);min-width:0}.article-main>h1{font-size:clamp(30px,4vw,46px);line-height:1.18;letter-spacing:-.7px;margin:13px 0}.article-category-row{display:flex;gap:7px;flex-wrap:wrap}.badge{display:inline-flex;padding:5px 10px;border-radius:999px;background:#edf4ff;color:#1557b3;font-size:13px;font-weight:700}.article-publish-meta{display:flex;gap:14px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid #edf0f5}.article-cover-wrap{margin:24px 0}.article-cover-wrap .article-cover{margin:0}.article-tools{margin:24px 0}.toc{background:#f7f9fd;border:1px solid #dfe6f1;border-radius:13px;padding:16px 18px}.toc-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.toc-heading button{border:0;background:transparent;color:#1769e0;font-weight:700;cursor:pointer}.toc ol{margin:12px 0 0;padding-left:22px}.toc li{margin:6px 0}.toc li.toc-sub{margin-left:18px}.toc a{color:#33415c}.toc a:hover{color:#1769e0}.share-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}.share-label{font-weight:700;margin-right:2px}.share-btn{border:1px solid #d8e0ed;background:#fff;color:#263650;border-radius:9px;padding:8px 12px;font:inherit;font-size:14px;font-weight:700;cursor:pointer}.share-btn:hover{border-color:#1769e0;color:#1769e0}.article-body{font-size:17px;line-height:1.82;color:#28354b}.article-body h2{font-size:29px;margin:1.65em 0 .55em;line-height:1.3}.article-body h3{font-size:22px;margin:1.4em 0 .45em}.article-body p{margin:0 0 1.15em}.article-body ul,.article-body ol{padding-left:24px}.article-body a{color:#1769e0;text-decoration:underline}.article-inline-image{margin:26px 0}.article-inline-image img{border-radius:12px;width:100%}.article-prev-next{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:34px 0}.prev-next-card{display:flex;flex-direction:column;gap:6px;padding:17px;border:1px solid #e1e7f0;border-radius:12px;background:#fafbfe}.prev-next-card:hover{border-color:#a9c8f6;background:#f4f8ff}.prev-next-card small{color:#6c788d}.prev-next-card strong{line-height:1.4}.prev-next-card.next{text-align:right}.related-section{margin-top:34px;padding-top:28px;border-top:1px solid #e9edf3}.section-title.compact{margin-bottom:16px}.section-title.compact h2{font-size:25px}.related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.related-card{display:grid;grid-template-columns:138px minmax(0,1fr);background:#fff;border:1px solid #e1e7f0;border-radius:13px;overflow:hidden;min-height:142px;transition:.2s ease}.related-card:hover{transform:translateY(-2px);box-shadow:0 9px 24px rgba(25,40,70,.08);border-color:#c5d8f4}.related-thumb{height:100%;min-height:142px;background:linear-gradient(135deg,#eaf2ff,#f7efff);overflow:hidden}.related-thumb img{width:100%;height:100%;object-fit:cover}.related-placeholder{width:100%;height:100%;place-items:center;font-weight:900;color:#1769e0;letter-spacing:.08em}.related-content{padding:13px 14px;min-width:0}.related-content h3{font-size:16px;line-height:1.4;margin:6px 0}.related-content h3 a:hover{color:#1769e0}.related-content p{font-size:14px;color:#68748a;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-sidebar{position:sticky;top:90px}.sidebar-box{background:#fff;border:1px solid #e3e8f1;border-radius:14px;padding:18px;box-shadow:0 6px 20px rgba(25,40,70,.045);margin-bottom:20px}.sidebar-box h3{margin:0 0 13px}.popular-list{display:grid}.popular-list a{display:grid;gap:3px;padding:12px 0;border-bottom:1px solid #edf0f5}.popular-list a:last-child{border-bottom:0}.popular-list a:hover span{color:#1769e0}.popular-list span{font-size:14px;font-weight:700;line-height:1.45}.popular-list small{color:#7b8799}.back-to-top{position:fixed;right:22px;bottom:22px;width:44px;height:44px;border:0;border-radius:50%;background:#1769e0;color:#fff;font-size:22px;box-shadow:0 8px 22px rgba(23,105,224,.28);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:30}.back-to-top.show{opacity:1;visibility:visible;transform:none}
@media(max-width:980px){.article-layout{grid-template-columns:1fr}.article-sidebar{position:static}.popular-box{display:none}.related-card{grid-template-columns:125px minmax(0,1fr)}}
@media(max-width:700px){.article-main{padding:20px 16px;border-radius:12px}.article-publish-meta{gap:8px 12px}.related-grid{grid-template-columns:1fr}.related-card{grid-template-columns:110px minmax(0,1fr);min-height:125px}.related-thumb{min-height:125px}.article-prev-next{grid-template-columns:1fr}.prev-next-card.next{text-align:left}.share-label{width:100%}.article-body{font-size:16px}.article-body h2{font-size:25px}.article-body h3{font-size:20px}}
/* PATCH: Bài viết liên quan đồng bộ trang chủ + footer */
.article-tools:empty{display:none}
.related-section{margin-top:36px;padding-top:30px}
.related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.home-style-related{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:145px;background:#fff;border:1px solid #dfe6f1;border-radius:13px;overflow:hidden;box-shadow:0 6px 18px rgba(25,40,70,.055);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.home-style-related:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(25,40,70,.09);border-color:#bfd2ef}
.home-style-related .related-thumb{display:block;min-height:145px;background:linear-gradient(135deg,#edf4ff,#f8efff)}
.home-style-related .related-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.home-style-related .related-placeholder{width:100%;height:100%;min-height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#1769e0;text-align:center;padding:12px}
.home-style-related .related-placeholder b{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#fff;font-size:18px;box-shadow:0 5px 15px rgba(23,105,224,.08)}
.home-style-related .related-placeholder small{color:#1d4f91;font-weight:800;line-height:1.25}
.home-style-related .related-content{padding:14px 15px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.related-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.related-category{color:#1769e0;font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
.home-style-related .related-content h3{font-size:16px;line-height:1.38;margin:0 0 8px}
.home-style-related .related-content p{font-size:13px;line-height:1.55;color:#68748a;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.article-page-section+footer,.article-page-section~footer{margin-top:42px}
@media(max-width:780px){.related-grid{grid-template-columns:1fr}.home-style-related{grid-template-columns:125px minmax(0,1fr);min-height:132px}.home-style-related .related-thumb,.home-style-related .related-placeholder{min-height:132px}}
@media(max-width:480px){.home-style-related{grid-template-columns:105px minmax(0,1fr)}.home-style-related .related-content{padding:12px}.home-style-related .related-content h3{font-size:15px}.home-style-related .related-content p{display:none}.related-topline{align-items:flex-start;flex-direction:column;gap:3px}.related-category{max-width:100%}}
/* PATCH 23-07-2026: cân đối trang chi tiết và bảo đảm footer */
.article-page-section{padding:30px 0 0;min-height:0}
.article-layout-single{display:block;max-width:1040px;margin:0 auto}
.article-layout-single .article-main{width:100%;max-width:none;margin:0}
.article-layout-single .related-section{max-width:none}
.article-layout-single .related-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.article-layout-single .home-style-related{grid-template-columns:145px minmax(0,1fr);min-height:148px}
.article-layout-single .home-style-related .related-thumb,
.article-layout-single .home-style-related .related-placeholder{min-height:148px}
.site-footer{display:block;clear:both;width:100%;margin-top:48px}
@media(max-width:760px){
.article-page-section{padding-top:18px}
.article-layout-single .related-grid{grid-template-columns:1fr}
.article-layout-single .home-style-related{grid-template-columns:120px minmax(0,1fr);min-height:132px}
.article-layout-single .home-style-related .related-thumb,
.article-layout-single .home-style-related .related-placeholder{min-height:132px}
}
/* =========================================================
PATCH TOÀN SITE 23-07-2026
Sửa header/footer bị rớt hàng ở mức zoom 100%
========================================================= */
/* Header: giữ một hàng trên màn hình rộng, không hiện thanh cuộn thô */
.site-header .header-row{
display:flex;
align-items:center;
flex-wrap:nowrap;
gap:14px;
min-width:0;
}
.site-header .brand{
flex:0 0 auto;
white-space:nowrap;
}
.site-header .main-nav{
flex:1 1 auto;
min-width:0;
overflow-x:auto;
overflow-y:hidden;
white-space:nowrap;
scrollbar-width:none;
-ms-overflow-style:none;
}
.site-header .main-nav::-webkit-scrollbar{display:none}
.site-header .main-nav a{flex:0 0 auto}
.site-header .header-search{
flex:0 0 250px;
min-width:220px;
}
.site-header .header-search input{
min-width:0;
width:100%;
}
/* Footer: source hiện có 4 nhóm nên phải dùng 4 cột ở desktop */
.site-footer .footer-grid{
display:grid;
grid-template-columns:minmax(280px,1.8fr) repeat(3,minmax(150px,1fr));
gap:34px;
align-items:start;
}
.site-footer .footer-grid > div{min-width:0}
.site-footer .footer-grid strong,
.site-footer .footer-grid h3,
.site-footer .footer-grid h4{
display:block;
margin:0 0 10px;
}
.site-footer .footer-grid p{margin:0;max-width:520px}
.site-footer .footer-grid a{line-height:1.45}
.site-footer .copyright{clear:both;width:100%}
/* Không để phần nội dung hoặc card làm tràn chiều ngang toàn trang */
main,.section,.article-page-section,.article-main,.page-card{min-width:0}
.grid,.home-post-grid,.related-grid,.category-grid{min-width:0}
.card,.home-post-card,.related-card,.home-style-related{min-width:0}
@media(max-width:1100px){
.site-header .header-row{gap:10px}
.site-header .main-nav{gap:12px}
.site-header .header-search{flex-basis:210px;min-width:190px}
.site-footer .footer-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:28px 38px;
}
}
@media(max-width:760px){
.site-header .header-row{
flex-wrap:wrap;
padding:10px 0;
}
.site-header .brand{order:1}
.site-header .header-search{
order:2;
margin-left:auto;
flex:1 1 220px;
min-width:0;
}
.site-header .main-nav{
order:3;
width:100%;
flex-basis:100%;
padding-bottom:3px;
}
.site-footer .footer-grid{grid-template-columns:1fr}
}