/* ══ Nền khu Tin tức — bố cục, header, footer, danh sách ══
   Token --tn-* có giá trị mặc định trung tính; theme con ánh xạ sang màu/chữ thương hiệu (MTGS: --pub-* do website
   phát qua hợp đồng khung trang). Kiểu thân bài ở noi-dung.css (dùng chung cho trình soạn Gutenberg). */
:root {
  --tn-nen: #f8fafc; --tn-mat: #ffffff; --tn-mat-lom: #f1f5f9;
  --tn-chu: #1f2937; --tn-chu-phu: #4a5a72; --tn-chu-nhat: #55637a;
  --tn-vien: #e2e8f0; --tn-vien-dam: #cbd5e1;
  --tn-thuong-hieu: #2563eb; --tn-thuong-hieu-dam: #1d4ed8; --tn-thuong-hieu-nhat: #eff6ff; --tn-thuong-hieu-chu: #1e3a8a;
  --tn-chan-nen: #0f172a; --tn-chan-nen-2: #0b1324; --tn-chan-nen-day: #070d1a; --tn-chan-vach: #2563eb;
  --tn-chan-chu: #dce6f2; --tn-chan-chu-dam: #f8fafc; --tn-chan-chu-phu: #b7c8dc; --tn-chan-chu-nho: #9cb3cb; --tn-chan-vien: rgba(255,255,255,.12);
  --tn-chu-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --tn-rong: 1312px; --tn-chu-mono: ui-monospace, SFMono-Regular, Menlo, monospace; --tn-bo: 12px; --tn-bo-nho: 8px;
  --tn-focus: 0 0 0 3px color-mix(in srgb, var(--tn-thuong-hieu) 35%, transparent);
}
html { scrollbar-gutter: stable; }
body.tn { margin: 0; background: var(--tn-nen); color: var(--tn-chu); font-family: var(--tn-chu-font); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.tn *, body.tn *::before, body.tn *::after { box-sizing: border-box; }
:where(body.tn) a { color: inherit; }
/* :where() — độ ưu tiên 0 để mọi luật kích thước cụ thể (logo, ảnh thẻ) thắng, và không đè kiểu ảnh của plugin. */
:where(body.tn) img { max-width: 100%; height: auto; }
.tn-khung { width: 100%; max-width: var(--tn-rong); margin-inline: auto; padding-inline: 16px; }
@media (min-width: 768px) { .tn-khung { padding-inline: 24px; } }
.tn-an-chu { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tn-bo-qua { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--tn-thuong-hieu); color: #fff; padding: 8px 14px; border-radius: var(--tn-bo-nho); }
.tn-bo-qua:focus { top: 8px; }
.tn :focus-visible { outline: 2px solid var(--tn-thuong-hieu); outline-offset: 2px; }
.tn-ic { width: 20px; height: 20px; flex: none; }
.tn-ic--nho { width: 14px; height: 14px; }
.tn-chi-desktop { display: none !important; }
@media (min-width: 1024px) { .tn-chi-desktop { display: flex !important; } .tn-chi-mobile { display: none !important; } }

/* ── Header ── */
.tn-dau { position: relative; z-index: 40; }
.tn-dai-tren { display: none; background: var(--tn-mat-lom); border-bottom: 1px solid var(--tn-vien); font-size: 12px; color: var(--tn-chu-phu); }
@media (min-width: 768px) { .tn-dai-tren { display: block; } }
.tn-dai-tren__trong { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 36px; }
.tn-dai-tren__trai { display: flex; gap: 24px; min-width: 0; align-items: center; }
.tn-dai-tren__lk, .tn-dai-tren__gio, .tn-dai-tren__goi { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; text-decoration: none; font-weight: 600; white-space: nowrap; }
.tn-dai-tren__lk span { overflow: hidden; text-overflow: ellipsis; }
.tn-dai-tren__gio { display: none; font-weight: 400; }
@media (min-width: 1024px) { .tn-dai-tren__gio { display: inline-flex; } }
.tn-dai-tren__goi { color: var(--tn-chu); font-weight: 700; }
.tn-dai-tren__goi .tn-ic { color: var(--tn-thuong-hieu); }
.tn-dai-tren a:hover { color: var(--tn-thuong-hieu); }

.tn-thanh-chinh { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.95); backdrop-filter: blur(12px); border-bottom: 1px solid var(--tn-vien); box-shadow: 0 1px 2px rgba(15,23,41,.05); }
.tn-thanh-chinh__trong { display: flex; align-items: center; gap: 12px; height: 64px; }
@media (min-width: 1024px) { .tn-thanh-chinh__trong { height: 72px; gap: 24px; } }
.tn-logo { flex: none; display: inline-flex; align-items: center; text-decoration: none; }
.tn-logo img { height: 32px; width: auto; display: block; }
@media (min-width: 360px) { .tn-logo img { height: 36px; } }
@media (min-width: 1024px) { .tn-logo img { height: 44px; } }
.tn-logo__chu { font-weight: 800; font-size: 20px; color: var(--tn-thuong-hieu); }
.tn-nut-bieu-tuong { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: var(--tn-bo-nho); background: transparent; color: var(--tn-chu); cursor: pointer; text-decoration: none; }
.tn-nut-bieu-tuong:hover { background: var(--tn-thuong-hieu-nhat); color: var(--tn-thuong-hieu); }

.tn-danh-muc { position: relative; flex: none; }
.tn-danh-muc__nut { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px; border: 1px solid var(--tn-vien-dam); border-radius: var(--tn-bo); background: var(--tn-mat); color: var(--tn-chu); font: inherit; font-weight: 700; cursor: pointer; }
.tn-danh-muc__nut:hover, .tn-danh-muc__nut[aria-expanded="true"] { border-color: var(--tn-thuong-hieu); color: var(--tn-thuong-hieu); background: var(--tn-thuong-hieu-nhat); }
.tn-danh-muc__bang { position: absolute; left: 0; top: calc(100% + 10px); width: min(1120px, calc(100vw - 4rem)); max-height: min(76vh, 44rem); overflow: auto; background: var(--tn-mat); border: 1px solid var(--tn-vien); border-radius: 16px; box-shadow: 0 24px 60px -24px rgba(15,23,41,.45); padding: 20px 24px; }
.tn-danh-muc__luoi { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 18px 24px; }
.tn-danh-muc__tieu-de { display: block; font-weight: 700; text-decoration: none; padding: 6px 10px; border-left: 2px solid transparent; border-radius: 6px; }
.tn-danh-muc__tieu-de:hover { color: var(--tn-thuong-hieu); background: var(--tn-thuong-hieu-nhat); border-left-color: var(--tn-thuong-hieu); }
.tn-danh-muc__nhom ul { list-style: none; margin: 4px 0 0; padding: 0 0 0 12px; font-size: 14px; color: var(--tn-chu-phu); }
.tn-danh-muc__nhom ul a { display: block; padding: 3px 0; text-decoration: none; }
.tn-danh-muc__nhom ul a:hover { color: var(--tn-thuong-hieu); }

.tn-tim { flex: 1 1 auto; min-width: 0; display: flex; height: 44px; border: 1px solid var(--tn-vien-dam); border-radius: var(--tn-bo); overflow: hidden; background: var(--tn-mat); }
@media (min-width: 1024px) { .tn-tim { height: 48px; } }
.tn-tim:focus-within { border-color: var(--tn-thuong-hieu); box-shadow: var(--tn-focus); }
.tn-tim input { flex: 1; min-width: 0; border: 0; padding: 0 14px; font: inherit; font-size: 15px; background: transparent; color: var(--tn-chu); }
.tn-tim input:focus { outline: none; }
.tn-tim button { flex: none; width: 48px; border: 0; background: var(--tn-thuong-hieu); color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.tn-thanh-chinh__phai { display: flex; align-items: center; gap: 4px; flex: none; }
.tn-goi { align-items: center; gap: 10px; height: 48px; padding: 0 14px 0 8px; border-radius: var(--tn-bo); border: 1px solid var(--tn-vien); background: var(--tn-thuong-hieu-nhat); color: var(--tn-thuong-hieu); font-weight: 600; text-decoration: none; white-space: nowrap; }
.tn-goi__tron { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 999px; background: var(--tn-thuong-hieu); color: #fff; }
.tn-goi:hover { border-color: var(--tn-thuong-hieu); }
.tn-so { font-family: var(--tn-chu-mono); font-variant-numeric: tabular-nums; letter-spacing: .02em; font-size: 16px; }
.tn-nut-nhan { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 56px; height: 48px; padding: 0 6px; border-radius: var(--tn-bo-nho); font-size: 12px; font-weight: 600; color: var(--tn-chu-phu); text-decoration: none; }
.tn-nut-nhan:hover { color: var(--tn-thuong-hieu); background: var(--tn-thuong-hieu-nhat); }
@media (max-width: 1023px) { .tn-nut-nhan span { display: none; } .tn-nut-nhan { min-width: 44px; } }
/* 390px: ô tìm lên dòng riêng dưới logo để không bị bóp còn 80px. */
@media (max-width: 767px) {
  .tn-thanh-chinh__trong { flex-wrap: wrap; height: auto; padding-block: 8px; row-gap: 8px; }
  .tn-logo { margin-right: auto; }
  .tn-tim { order: 10; flex-basis: 100%; }
  /* Như website: logo trái, giỏ + nút menu (có viền) bên phải. */
  .tn-thanh-chinh__trong > [data-tn-mo="tn-ngan-keo"] { order: 5; border: 1px solid var(--tn-vien-dam); }
}

.tn-menu-chinh { background: var(--tn-mat); border-bottom: 1px solid var(--tn-vien); }
.tn-menu-chinh__trong { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.tn-menu-chinh ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; height: 44px; align-items: stretch; overflow-x: auto; scrollbar-width: none; }
.tn-nut-chinh { display: inline-flex; align-items: center; gap: 8px; flex: none; min-height: 36px; padding: 0 16px; border-radius: var(--tn-bo-nho); background: var(--tn-thuong-hieu); color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none; }
.tn-nut-chinh:hover { background: var(--tn-thuong-hieu-dam); }
.tn-menu-chinh a { display: inline-flex; align-items: center; padding: 0 12px; height: 100%; font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; color: var(--tn-chu); border-bottom: 2px solid transparent; }
.tn-menu-chinh a:hover { color: var(--tn-thuong-hieu); border-bottom-color: var(--tn-thuong-hieu); }

/* Ngăn kéo mobile */
.tn-ngan-keo { position: fixed; inset: 0; z-index: 90; }
.tn-ngan-keo[hidden] { display: none; }
.tn-ngan-keo__nen { position: absolute; inset: 0; background: rgba(15,23,41,.45); }
.tn-ngan-keo__than { position: absolute; inset: 0 auto 0 0; width: min(88vw, 360px); background: var(--tn-mat); overflow-y: auto; padding: 8px 16px 24px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 0 40px rgba(15,23,41,.25); }
.tn-ngan-keo__dau { display: flex; align-items: center; justify-content: space-between; min-height: 52px; border-bottom: 1px solid var(--tn-vien); }
.tn-ngan-keo__ten { font-weight: 800; color: var(--tn-thuong-hieu); }
.tn-ngan-keo__ds { list-style: none; margin: 0; padding: 0; }
.tn-ngan-keo__ds a, .tn-ngan-keo__ds summary { display: flex; align-items: center; min-height: 44px; padding: 0 4px; text-decoration: none; font-weight: 600; cursor: pointer; }
.tn-ngan-keo__ds details ul { list-style: none; padding: 0 0 6px 12px; margin: 0; }
.tn-ngan-keo__ds details a { font-weight: 400; min-height: 40px; color: var(--tn-chu-phu); }
.tn-ngan-keo__ds--phu { border-top: 1px solid var(--tn-vien); padding-top: 8px; }
.tn-ngan-keo__nhan { margin: 12px 4px 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--tn-chu-nhat); }
.tn-ngan-keo__goi { margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border-radius: var(--tn-bo); background: var(--tn-thuong-hieu); color: #fff !important; font-weight: 700; text-decoration: none; }
body.tn-khoa-cuon { overflow: hidden; }

/* ── Trang ── */
.tn-chinh { display: block; min-height: 60vh; }
.tn-trang { padding-block: 16px 48px; }
.tn-trang--hep { max-width: 860px; }
.tn-breadcrumb { font-size: 13px; color: var(--tn-chu-nhat); margin: 4px 0 16px; }
.tn-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.tn-breadcrumb li + li::before { content: "›"; margin-right: 4px; color: var(--tn-vien-dam); }
.tn-breadcrumb a { text-decoration: none; }
.tn-breadcrumb a:hover { color: var(--tn-thuong-hieu); text-decoration: underline; }
.tn-breadcrumb .separator { margin: 0 4px; color: var(--tn-vien-dam); }
.tn-dau-trang h1 { margin: 0 0 8px; font-size: clamp(26px, 3.2vw, 36px); line-height: 1.2; letter-spacing: -.02em; font-weight: 800; }
.tn-dau-trang__mo-ta { color: var(--tn-chu-phu); max-width: 72ch; margin: 0 0 8px; }
/* Thanh chuyên mục: khung cuộn ngang; nen.js bật nút ‹ › + mép mờ khi danh sách dài hơn khung (07/11/2026). */
.tn-thanh-cm { position: relative; display: flex; align-items: center; gap: 4px; margin: 16px 0 24px; }
.tn-thanh-cm__ds { list-style: none; margin: 0; padding: 2px 0 6px; display: flex; gap: 8px; flex: 1; min-width: 0; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; overscroll-behavior-x: contain; }
.tn-thanh-cm__ds li { flex: none; scroll-snap-align: start; }
.tn-thanh-cm--tran-phai .tn-thanh-cm__ds { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); }
.tn-thanh-cm--tran-trai .tn-thanh-cm__ds { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px); mask-image: linear-gradient(90deg, transparent, #000 48px); }
.tn-thanh-cm--tran-trai.tn-thanh-cm--tran-phai .tn-thanh-cm__ds { -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, transparent, #000 48px, #000 calc(100% - 48px), transparent); }
.tn-thanh-cm__nut { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin-bottom: 4px; border: 1px solid var(--tn-vien); border-radius: 999px; background: var(--tn-mat); color: var(--tn-chu); font-size: 20px; line-height: 1; cursor: pointer; }
.tn-thanh-cm__nut:hover { border-color: var(--tn-thuong-hieu); color: var(--tn-thuong-hieu); }
.tn-thanh-cm__nut:disabled { opacity: .35; cursor: default; }
.tn-thanh-cm__nut[hidden] { display: none; }
@media (max-width: 639px) { .tn-thanh-cm__nut { display: none; } }
.tn-thanh-cm a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--tn-vien); background: var(--tn-mat); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.tn-thanh-cm a:hover { border-color: var(--tn-thuong-hieu); color: var(--tn-thuong-hieu); }
.tn-thanh-cm a[aria-current="page"] { background: var(--tn-thuong-hieu); border-color: var(--tn-thuong-hieu); color: #fff; }
.tn-luoi { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .tn-luoi { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .tn-luoi { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
.tn-the { display: flex; flex-direction: column; background: var(--tn-mat); border: 1px solid var(--tn-vien); border-radius: var(--tn-bo); overflow: hidden; transition: border-color .15s ease, box-shadow .18s ease; }
.tn-the:hover { border-color: var(--tn-vien-dam); box-shadow: 0 8px 20px -12px rgba(15,23,41,.25); }
.tn-the__anh { display: block; aspect-ratio: 16 / 9; background: var(--tn-mat-lom); overflow: hidden; }
.tn-the__anh img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Bài thiếu ảnh: khung nhận diện (logo + chuyên mục) trên nền thương hiệu nhạt — không mảng màu trơn. */
.tn-the__anh-trong { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 100%; padding: 12px; text-align: center; background: linear-gradient(135deg, var(--tn-thuong-hieu-nhat), var(--tn-mat-lom)); color: var(--tn-thuong-hieu-chu); }
.tn-the__anh-trong img { width: auto !important; height: 28px !important; max-width: 70%; object-fit: contain !important; opacity: .75; }
.tn-the__anh-trong span { font-size: 13px; font-weight: 700; letter-spacing: .01em; }
.tn-the__than { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.tn-the__tieu-de { margin: 0; font-size: 17px; line-height: 1.4; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.tn-the__tieu-de a { text-decoration: none; }
.tn-the__tieu-de a:hover { color: var(--tn-thuong-hieu); }
.tn-the__tom-tat { margin: 0; color: var(--tn-chu-phu); font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tn-the__meta { margin: auto 0 0; font-size: 13px; color: var(--tn-chu-nhat); }
.tn-nhan { align-self: flex-start; display: inline-flex; padding: 2px 10px; border-radius: 999px; background: var(--tn-thuong-hieu-nhat); color: var(--tn-thuong-hieu-chu); font-size: 12px; font-weight: 700; text-decoration: none; }
.tn-nhan:hover { background: var(--tn-thuong-hieu); color: #fff; }
@media (max-width: 639px) {
  /* Điện thoại: thẻ ngang (ảnh 4:3 bên trái) — một màn thấy 5–6 bài thay vì 1,5 bài; tóm tắt nhường chỗ cho tiêu đề. */
  .tn-luoi { gap: 12px; }
  .tn-the { display: grid; grid-template-columns: 116px minmax(0, 1fr); }
  .tn-the__anh { aspect-ratio: auto; width: 116px; min-height: 87px; height: 100%; }
  .tn-the__anh img { position: static; width: 116px; height: 100%; min-height: 87px; }
  .tn-the__than { padding: 10px 12px; gap: 4px; }
  .tn-the__tieu-de { font-size: 15px; -webkit-line-clamp: 3; }
  .tn-the__tom-tat { display: none; }
  .tn-the .tn-nhan { font-size: 11px; padding: 1px 8px; }
  .tn-the__anh-trong img { height: 18px !important; }
  .tn-the__anh-trong span { display: none; }
}
.pagination, .navigation.pagination { margin-top: 32px; }
.nav-links { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.nav-links .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: var(--tn-bo-nho); border: 1px solid var(--tn-vien); background: var(--tn-mat); text-decoration: none; font-weight: 600; }
.nav-links .page-numbers.current { background: var(--tn-thuong-hieu); border-color: var(--tn-thuong-hieu); color: #fff; }
.nav-links a.page-numbers:hover { border-color: var(--tn-thuong-hieu); color: var(--tn-thuong-hieu); }
.tn-trong { padding: 40px 0; color: var(--tn-chu-phu); text-align: center; }
.tn-tim-tin { margin: 32px 0 0; padding: 16px; background: var(--tn-mat); border: 1px solid var(--tn-vien); border-radius: var(--tn-bo); }
.tn-tim-tin label { display: block; font-weight: 700; margin-bottom: 8px; }
.tn-tim-tin button .tn-ic { margin-right: 6px; }
/* Ô tìm ở đầu trang danh sách (07/11/2026): ngay dưới tiêu đề, trước chuyên mục và lưới bài. Desktop đứng bên phải
   tiêu đề; nhãn ẩn trực quan vì tiêu đề trang đã nói "Tin tức" (vẫn đọc được bằng trình đọc màn hình). */
.tn-dau-trang--co-tim { display: grid; gap: 12px; }
@media (min-width: 1024px) { .tn-dau-trang--co-tim { grid-template-columns: minmax(0, 1fr) minmax(320px, 400px); align-items: end; gap: 32px; } }
.tn-dau-trang--co-tim .tn-tim-tin { margin: 0; padding: 0; background: none; border: 0; }
.tn-dau-trang--co-tim .tn-tim-tin label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (min-width: 1024px) { .tn-dau-trang--co-tim .tn-tim-tin { margin-bottom: 8px; } }
.tn-tim-tin div { display: flex; gap: 8px; }
.tn-tim-tin input { flex: 1; min-width: 0; min-height: 44px; border: 1px solid var(--tn-vien-dam); border-radius: var(--tn-bo-nho); padding: 0 12px; font: inherit; }
.tn-tim-tin button, .tn-nut { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; border: 0; border-radius: var(--tn-bo-nho); background: var(--tn-thuong-hieu); color: #fff !important; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.tn-nut--phu { background: var(--tn-mat); color: var(--tn-chu) !important; border: 1px solid var(--tn-vien-dam); }
.tn-loi { padding-block: 48px; }

/* Bài */
.tn-bai__dau { margin-bottom: 16px; }
.tn-bai__tieu-de { margin: 10px 0 10px; font-size: clamp(28px, 3.6vw, 40px); line-height: 1.2; letter-spacing: -.025em; font-weight: 800; }
.tn-bai__meta { margin: 0; color: var(--tn-chu-nhat); font-size: 14px; }
.tn-bai__anh { margin: 0 0 24px; border-radius: var(--tn-bo); overflow: hidden; background: var(--tn-mat-lom); }
.tn-bai__anh img { display: block; width: 100%; }
.tn-the-bai { list-style: none; margin: 32px 0 0; padding: 16px 0 0; border-top: 1px solid var(--tn-vien); display: flex; flex-wrap: wrap; gap: 8px; }
.tn-the-bai a { display: inline-flex; min-height: 32px; align-items: center; padding: 0 12px; border-radius: 999px; background: var(--tn-mat-lom); font-size: 13px; text-decoration: none; }
.tn-the-bai a:hover { color: var(--tn-thuong-hieu); }
.tn-lien-quan { background: var(--tn-mat-lom); padding: 32px 0 48px; border-top: 1px solid var(--tn-vien); }
.tn-lien-quan h2 { margin: 0 0 20px; font-size: 24px; font-weight: 800; }
.tn-lien-quan .tn-the__tieu-de { font-size: 16px; }
/* Dịch vụ liên quan (11/11): nằm ngay dưới "Bài liên quan", cùng nền — một dải đọc tiếp; nút viên như trang bài website. */
.tn-dich-vu-lien-quan { background: var(--tn-mat-lom); padding: 0 0 48px; }
.tn-lien-quan + .tn-dich-vu-lien-quan { margin-top: -16px; }
.tn-dich-vu-lien-quan h2 { margin: 0 0 16px; font-size: 24px; font-weight: 800; }
.tn-dich-vu-lien-quan__ds { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.tn-dich-vu-lien-quan__ds a { display: inline-flex; min-height: 44px; align-items: center; padding: 0 16px; border: 1px solid var(--tn-vien); border-radius: 999px; background: var(--tn-mat, #fff); font-size: 14px; font-weight: 600; color: var(--tn-chu); text-decoration: none; }
.tn-dich-vu-lien-quan__ds a:hover, .tn-dich-vu-lien-quan__ds a:focus-visible { border-color: var(--tn-thuong-hieu); color: var(--tn-thuong-hieu); }

/* FAQ cuối bài */
.tn-faq { margin: 32px 0 0; }
.tn-faq h2 { font-size: 24px; font-weight: 800; margin: 0 0 12px; }
.tn-faq__muc { border: 1px solid var(--tn-vien); border-radius: var(--tn-bo-nho); background: var(--tn-mat); margin-bottom: 8px; }
.tn-faq__muc summary { cursor: pointer; padding: 12px 16px; font-weight: 700; min-height: 44px; list-style-position: inside; }
.tn-faq__dap { padding: 0 16px 12px; color: var(--tn-chu-phu); }
.tn-faq__dap p { margin: 0 0 .6em; }

/* ── Footer ── */
/* Chân trang — cùng bố cục SiteFooter Next (07/11/2026): 1 cột · 2 cột (≥768) · 4 cột (≥1024). */
.tn-chan { background: var(--tn-chan-nen); color: var(--tn-chan-chu); font-size: 14px; line-height: 1.45; }
.tn-chan p { margin: 0; }
.tn-chan a { color: var(--tn-chan-chu); text-decoration: none; transition: color .15s; }
.tn-chan a:hover { color: #fff; }
.tn-chan a:focus-visible, .tn-chan summary:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 4px; }
.tn-chan address { font-style: normal; }
.tn-chan__vach { height: 4px; background: var(--tn-chan-vach); }
.tn-chan__than { padding-block: 28px 20px; }
@media (min-width: 768px) { .tn-chan__than { padding-top: 36px; } }
.tn-chan__luoi { display: grid; grid-template-columns: 1fr; gap: 4px; }
@media (min-width: 768px) { .tn-chan__luoi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 40px; } }
@media (min-width: 1024px) { .tn-chan__luoi { grid-template-columns: 1.45fr 1fr 1fr 1fr; } }
@media (min-width: 1280px) { .tn-chan__luoi { grid-template-columns: minmax(0, 1.55fr) repeat(3, minmax(0, .8fr)) minmax(0, 1.1fr); column-gap: 32px; } }
/* Bản đồ showroom — cột 5 từ 1280px; dưới đó là nút gập trong cột liên hệ (cùng cách SiteFooter). */
.tn-chan__ban-do { display: none; }
.tn-chan__ban-do iframe, .tn-chan__ban-do-gap iframe { display: block; width: 100%; border: 1px solid var(--tn-chan-vien); border-radius: 12px; background: rgba(255,255,255,.04); }
.tn-chan__ban-do iframe { flex: 1; min-height: 200px; }
.tn-chan__ban-do .tn-chan__tieu-de { pointer-events: none; cursor: default; min-height: 0; margin-bottom: 16px; }
.tn-chan__ban-do .tn-chan__tieu-de::after { content: none; }
.tn-chan__ban-do .tn-chan__xem { margin-top: 8px; }
@media (min-width: 1280px) { .tn-chan__ban-do { display: flex; flex-direction: column; } .tn-chan__ban-do-gap { display: none; } }
.tn-chan__ban-do-gap { margin-top: 4px; padding-left: 26px; }
.tn-chan__ban-do-gap summary { cursor: pointer; list-style: none; }
.tn-chan__ban-do-gap summary::-webkit-details-marker { display: none; }
.tn-chan__ban-do-gap .tn-chan__dong, .tn-chan__ban-do-gap[open] .tn-chan__mo { display: none; }
.tn-chan__ban-do-gap[open] .tn-chan__dong { display: inline; }
.tn-chan__ban-do-gap iframe { height: 224px; margin-top: 8px; }
.tn-chan__lien-he { padding-bottom: 20px; }
@media (min-width: 768px) { .tn-chan__lien-he { padding-bottom: 0; } }
.tn-chan__dau { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.tn-chan__logo img { height: 40px; width: auto; max-width: 100%; display: block; }
.tn-chan__dia-chi { display: flex; gap: 10px; color: var(--tn-chan-chu-dam); font-weight: 600; }
.tn-chan__dia-chi .tn-ic { width: 16px; height: 16px; margin-top: 2px; color: var(--tn-chan-chu-phu); }
.tn-chan__gio { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin-top: 6px !important; padding-left: 26px; color: var(--tn-chan-chu-phu); }
.tn-chan__gio > span { display: inline-flex; align-items: center; gap: 8px; }
.tn-chan__cham { width: 6px; height: 6px; border-radius: 999px; background: var(--pub-footer-good, #4ade80); flex: none; }
.tn-chan__xem { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--tn-chan-chu-dam) !important; font-weight: 600; }
.tn-chan__xem:hover { text-decoration: underline; text-underline-offset: 4px; }
.tn-chan__phu { color: var(--tn-chan-chu-phu); }
.tn-chan__kenh { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 6px; }
.tn-chan__kenh li { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
/* Theme có lề container 24px (Next 16px) ⇒ cột hẹp hơn: số phụ 15px để chip Zalo không rơi xuống dòng ở 768px. */
.tn-chan__kenh li:not(.tn-chan__kenh--chinh) .tn-chan__so { font-size: 15px !important; }
.tn-chan__kenh .tn-ic { width: 16px; height: 16px; color: var(--tn-chan-chu-phu); }
.tn-chan__kenh a { display: inline-flex; align-items: center; min-height: 44px; }
.tn-chan__so { color: var(--tn-chan-chu-dam) !important; font-size: 16px !important; font-weight: 600; letter-spacing: 0; }
.tn-chan__kenh--chinh .tn-ic { color: var(--tn-chan-chu-dam); }
.tn-chan__kenh--chinh .tn-chan__so { font-size: 20px !important; font-weight: 700; }
.tn-chan__chip { min-height: 44px !important; padding: 0 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--tn-chan-chu-dam) !important; }
.tn-chan__mxh { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; }
.tn-chan__mxh a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--tn-chan-vien); border-radius: 10px; background: rgba(255,255,255,.04); }
@media (min-width: 768px) {
  .tn-chan__xem, .tn-chan__kenh a { min-height: 0; }
  .tn-chan__chip { min-height: 24px !important; }
  .tn-chan__mxh a { width: 40px; height: 40px; }
}
/* Nhóm liên kết: <details> gập được ở khổ hẹp, luôn mở từ 768px (nút gập ẩn). */
.tn-chan__cot { border-bottom: 1px solid rgba(255,255,255,.08); }
.tn-chan__tieu-de { display: flex; align-items: center; justify-content: space-between; min-height: 44px; margin: 0; font-size: 16px; font-weight: 700; color: var(--tn-chan-chu-dam); cursor: pointer; list-style: none; }
.tn-chan__tieu-de::-webkit-details-marker { display: none; }
.tn-chan__tieu-de::after { content: "+"; font-weight: 400; font-size: 18px; }
.tn-chan__cot[open] > .tn-chan__tieu-de::after { content: "−"; }
.tn-chan__cot ul { list-style: none; margin: 0; padding: 0 0 16px; }
.tn-chan__cot ul a { display: flex; align-items: center; min-height: 44px; }
@media (min-width: 768px) {
  .tn-chan__cot { border-bottom: 0; }
  .tn-chan__tieu-de { min-height: 0; cursor: default; pointer-events: none; margin-bottom: 16px; }
  .tn-chan__cot > .tn-chan__tieu-de::after, .tn-chan__cot[open] > .tn-chan__tieu-de::after { content: none; }
  .tn-chan__cot ul { padding: 0; }
  .tn-chan__cot ul a { display: inline-block; min-height: 0; padding-block: 3px; }
}
/* Dải "Bảng giá dịch vụ" (11/11): trên lưới chân trang, cùng cách gập với các cột; từ 768px nhóm đầu chia 3 cột chữ. */
.tn-chan__bang-gia { border-bottom: 1px solid rgba(255,255,255,.08); }
.tn-chan__bang-gia-luoi { display: grid; gap: 0 40px; padding-top: 20px; padding-bottom: 16px; }
@media (min-width: 768px) {
  .tn-chan__bang-gia-luoi { grid-template-columns: 1fr 1fr; gap: 24px 40px; padding-top: 28px; padding-bottom: 24px; }
  .tn-chan__bang-gia-nhom--0 { grid-column: 1 / -1; }
  .tn-chan__bang-gia-nhom--0 ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
  .tn-chan__bang-gia-nhom--1 ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
}
@media (min-width: 1024px) {
  .tn-chan__bang-gia-luoi { grid-template-columns: 2.1fr 1.3fr 1fr; }
  .tn-chan__bang-gia-nhom--0 { grid-column: auto; }
}
/* Ở khổ hẹp nhóm cuối đã có vạch dưới — không kẻ thêm vạch thứ hai. */
.tn-chan__cam-ket { display: flex; flex-direction: column; gap: 6px 24px; margin-top: 20px; }
.tn-chan__cam-ket ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px 24px; color: var(--pub-footer-text-box, var(--tn-chan-chu)); }
.tn-chan__cam-ket li { display: flex; align-items: center; gap: 8px; }
.tn-chan__cam-ket .tn-ic { color: var(--pub-footer-good, #4ade80); }
@media (min-width: 768px) { .tn-chan__cam-ket { margin-top: 28px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); } .tn-chan__cam-ket ul { flex-direction: row; flex-wrap: wrap; } }
@media (min-width: 1024px) { .tn-chan__cam-ket { flex-direction: row; align-items: center; } }
.tn-chan__dam { color: var(--tn-chan-chu-dam); font-weight: 600; }
.tn-chan__phap-nhan { background: var(--tn-chan-nen-2); color: var(--tn-chan-chu-nho); padding-block: 16px 112px; }
@media (min-width: 768px) { .tn-chan__phap-nhan { padding-bottom: 16px; } }
.tn-chan__phap-nhan .tn-chan__dam { color: var(--pub-footer-text-legal-strong, var(--tn-chan-chu)); }
.tn-chan__phap-nhan__luoi { display: grid; gap: 16px; }
@media (min-width: 1024px) { .tn-chan__phap-nhan__luoi { grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: start; } }
.tn-chan__phap-nhan__luoi p + p { margin-top: 4px !important; }
.tn-chan__ngan { display: none; }
.tn-chan__nguyen { white-space: nowrap; }
@media (min-width: 768px) { .tn-chan__ngan { display: inline; } .tn-chan__xuong { display: none; } }
.tn-chan__thanh-toan { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
@media (min-width: 1024px) { .tn-chan__thanh-toan { flex-direction: column; align-items: flex-end; } }
.tn-chan__chip-hang { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.tn-chan__chip-hang li { padding: 2px 8px; border: 1px solid var(--tn-chan-vien); border-radius: 6px; background: rgba(255,255,255,.04); color: var(--tn-chan-chu); font-size: 12px; font-weight: 500; }
.tn-chan__bct img { height: 40px; width: auto; background: #fff; border-radius: 8px; padding: 2px; display: block; }
.tn-chan__day { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); font-size: 12px; }
.tn-chan__day p + p { margin-top: 4px !important; }
@media (min-width: 1024px) { .tn-chan__day p:first-child { white-space: nowrap; } }
@media (min-width: 768px) { .tn-chan__day { display: flex; justify-content: space-between; gap: 24px; } .tn-chan__day p + p { margin-top: 0 !important; text-align: right; } }

@media (prefers-reduced-motion: reduce) { .tn-the, .tn-the:hover { transition: none; } }
@media print { .tn-dau, .tn-ngan-keo, .tn-chan, .tn-lien-quan, .tn-dich-vu-lien-quan, .tn-tim-tin { display: none !important; } }