/* ==========================================================================
   Trang con: đầu trang, Giới thiệu, Liên hệ, danh sách bài, bài chi tiết, tác giả, 404, chính sách.
   Dùng biến màu / bo góc / bóng của main.css. Breakpoint: ≥1100 · 640–1099 · <640.
   ========================================================================== */

.tsdn-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.tsdn-wrap { width: 100%; max-width: calc(1520px + 2 * var(--tsdn-pad)); margin: 0 auto; padding: 0 var(--tsdn-pad); }
.tsdn-wrap--read { max-width: calc(1240px + 2 * var(--tsdn-pad)); }
.tsdn-tag--soft { background: var(--tsdn-tint); color: var(--tsdn-link); text-decoration: none; }
.tsdn-tag--soft:hover { background: var(--tsdn-cta); color: #fff; }

/* ---------- Đầu trang con ---------- */
.tsdn .section.tsdn-sec-head { padding: 0 !important; }
.tsdn-phead { position: relative; overflow: hidden; background: linear-gradient(180deg, #fff 0%, #f3f7fd 100%); }
/* Vòng tròn viền đứt lớn ở góc phải — cùng hoạ tiết viền đứt quanh ảnh tròn "Vì sao chọn". */
.tsdn-phead::before { content: ''; position: absolute; top: -260px; right: -200px; width: 720px; height: 720px; border: 2px dashed #d5e0f2; border-radius: 50%; pointer-events: none; }
.tsdn-phead__in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: center; max-width: calc(1520px + 2 * var(--tsdn-pad)); margin: 0 auto; padding: clamp(124px, 10vw, 150px) var(--tsdn-pad) clamp(40px, 5vw, 72px); }
.tsdn-phead__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; min-width: 0; max-width: 700px; }
.tsdn .tsdn-phead__title { margin: 0; padding: 0; font-family: var(--tsdn-font); font-size: clamp(32px, 3.6vw, 50px); line-height: 1.12; font-weight: 800; letter-spacing: -.03em; color: var(--tsdn-navy); text-wrap: balance; }
.tsdn-phead__text { margin: 0; max-width: 600px; font-size: 16.5px; line-height: 1.65; color: var(--tsdn-text-2); text-wrap: pretty; }
.tsdn-phead__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; }
.tsdn-phead .tsdn-eyebrow a { color: inherit; text-decoration: none; }
.tsdn-phead .tsdn-eyebrow a:hover { color: var(--tsdn-blue); }
.tsdn-phead__aside { position: relative; display: flex; justify-content: center; min-width: 0; }
@media (min-width: 1100px) {
	.tsdn-phead--aside .tsdn-phead__in { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(40px, 5vw, 88px); }
}

/* Đường dẫn dạng viên thuốc */
.tsdn-crumbs { max-width: 100%; margin-bottom: 4px; }
.tsdn .tsdn-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; row-gap: 2px; list-style: none; margin: 0; padding: 7px 16px; border: 1px solid var(--tsdn-line); border-radius: 999px; background: rgba(255, 255, 255, .9); font-size: 13.5px; line-height: 1.4; }
.tsdn .tsdn-crumbs li { display: flex; align-items: center; min-width: 0; margin: 0; color: var(--tsdn-navy); font-weight: 600; }
.tsdn-crumbs li + li::before { content: ''; flex: none; width: 6px; height: 6px; margin: 0 11px 0 7px; border-top: 1.6px solid #8e9ab4; border-right: 1.6px solid #8e9ab4; transform: rotate(45deg); }
.tsdn-crumbs a { color: var(--tsdn-muted); font-weight: 500; text-decoration: none; }
.tsdn-crumbs a:hover { color: var(--tsdn-blue); }
.tsdn-crumbs li[aria-current] span { max-width: 38ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Bên phải: vòng biểu tượng */
.tsdn-phead__decor { position: relative; width: min(100%, 400px); aspect-ratio: 1; }
.tsdn-phead__disc { position: absolute; inset: 14%; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: radial-gradient(circle at 50% 35%, #fff 0%, var(--tsdn-tint) 100%); box-shadow: 0 0 0 10px #fff, 0 24px 60px -24px rgba(10, 42, 120, .45); outline: 2px dashed #b9cbeb; outline-offset: 22px; }
.tsdn-phead__disc > .tsdn-av { --av: 100%; box-shadow: none; font-size: clamp(48px, 5vw, 72px); }
.tsdn-phead__float { position: absolute; z-index: 2; }
.tsdn-phead__float--1 { top: 4%; right: 6%; }
.tsdn-phead__float--2 { bottom: 8%; left: 2%; }
.tsdn-phead__float--3 { top: 20%; left: -2%; }
.tsdn-phead__float .tsdn-orb { animation: tsdn-bob 6s ease-in-out infinite; }
.tsdn-phead__float--2 .tsdn-orb { animation-delay: -2s; }
.tsdn-phead__float--3 .tsdn-orb { animation-delay: -4s; }
@keyframes tsdn-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (prefers-reduced-motion: reduce) { .tsdn-phead__float .tsdn-orb { animation: none; } }

/* Bên phải: ảnh bo góc + huy hiệu */
.tsdn-phead__photo { position: relative; width: 100%; max-width: 680px; padding: 0 0 30px 30px; }
.tsdn-phead__img { aspect-ratio: 4 / 3; overflow: hidden; border-radius: 24px; background: var(--tsdn-img); box-shadow: 0 30px 60px -30px rgba(10, 42, 120, .5); }
.tsdn-phead__img img, .tsdn-phead__img .tsdn-ph { display: block; width: 100%; height: 100%; object-fit: cover; }
.tsdn-phead__badge { position: absolute; bottom: 0; z-index: 3; display: flex; align-items: center; gap: 14px; padding: 16px 24px 16px 16px; border-radius: 18px; background: #fff; box-shadow: 0 18px 40px -18px rgba(10, 42, 120, .4); }
.tsdn-phead__badge .tsdn-orb { padding: 3px; box-shadow: none; }
.tsdn-phead__badge-tx { display: flex; flex-direction: column; gap: 2px; line-height: 1.25; }
.tsdn-phead__badge-tx strong { font-size: 30px; font-weight: 800; line-height: 1.1; color: var(--tsdn-navy); white-space: nowrap; }
.tsdn-phead__badge-tx span { font-size: 13.5px; color: var(--tsdn-muted); }
.tsdn-phead__photo .tsdn-phead__badge { left: 0; }
.tsdn-phead__photo .tsdn-phead__float--1 { top: -24px; right: -14px; }

/* Bên phải: ảnh tách nền đứng trên đĩa tròn, đầu nhô khỏi đĩa */
.tsdn-phead__cut { position: relative; width: min(100%, 430px); margin: 0 auto; }
.tsdn-phead__cut::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; aspect-ratio: 1; border-radius: 50%; background: var(--tsdn-orb-grad); box-shadow: 0 0 0 10px #fff, 0 30px 60px -28px rgba(10, 42, 120, .6); }
.tsdn-phead__cut::after { content: ''; position: absolute; left: -26px; right: -26px; bottom: -26px; aspect-ratio: 1; border: 2px dashed #b9cbeb; border-radius: 50%; pointer-events: none; }
/* Khung cao 1.18 lần bề rộng: đáy bo đúng nửa dưới đĩa (bán kính dọc = 0.5 / 1.18 = 42.37%), phần trên để đầu người nhô ra. */
.tsdn-phead__clip { position: relative; z-index: 1; aspect-ratio: 1 / 1.18; overflow: hidden; border-radius: 0 0 50% 50% / 0 0 42.37% 42.37%; }
.tsdn-phead__clip img, .tsdn-phead__clip .tsdn-ph { position: absolute; left: 50%; bottom: 0; width: 100%; height: auto; transform: translateX(-50%); }
.tsdn-phead__clip .tsdn-ph { height: 80%; border-radius: 50% 50% 0 0; }
.tsdn-phead__cut .tsdn-phead__badge { z-index: 3; left: -34px; right: auto; bottom: 16%; }
.tsdn-phead__cut .tsdn-phead__float--1 { top: 16%; right: -8px; }
.tsdn-phead__cut .tsdn-phead__float--2 { top: 40%; right: -34px; bottom: auto; left: auto; }

/* Phần dưới đầu trang trong builder: hàng nội dung ngay sau đầu trang không cần khoảng đệm khối. */
.tsdn .section.tsdn-sec-head .tsdn-phead + .row { margin-top: 0; }

/* ---------- Dải số liệu ---------- */
.tsdn .tsdn-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; margin: 0; padding: 22px clamp(12px, 1.6vw, 24px); border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn .tsdn-stat { display: flex; align-items: center; gap: 16px; min-width: 0; margin: 0; padding: 6px clamp(12px, 1.8vw, 28px); }
.tsdn-stat + .tsdn-stat { border-left: 1px dashed var(--tsdn-dash); }
.tsdn-stat .tsdn-orb { padding: 3px; }
.tsdn-stat__tx { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tsdn-stat__tx strong { font-size: clamp(24px, 2.2vw, 32px); font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--tsdn-navy); white-space: nowrap; }
.tsdn-stat__tx span { font-size: 14px; line-height: 1.4; color: var(--tsdn-muted); }
@media (max-width: 1099px) {
	.tsdn .tsdn-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
	.tsdn-stat:nth-child(odd) { border-left: 0; }
}

/* ---------- Thẻ giá trị / cam kết ---------- */
.tsdn-rail:has(> .tsdn-value) { counter-reset: tsdn-value; }
.tsdn-value { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; height: 100%; padding: 28px 24px 26px; counter-increment: tsdn-value; border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; box-shadow: 0 18px 44px -30px rgba(10, 42, 120, .45); transition: transform .2s, box-shadow .2s; }
.tsdn-value::after { content: counter(tsdn-value, decimal-leading-zero); position: absolute; top: 24px; right: 24px; font: 500 13px 'JetBrains Mono', monospace; color: #6B7280; }
.tsdn-value:hover { transform: translateY(-4px); box-shadow: var(--tsdn-shadow-h); }
.tsdn-value .tsdn-orb { margin-bottom: 6px; }
.tsdn .tsdn-value h3 { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.3; color: var(--tsdn-navy); }
.tsdn .tsdn-value p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--tsdn-muted); text-wrap: pretty; }

/* ---------- Thẻ kênh liên hệ ---------- */
.tsdn-ccard { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; height: 100%; padding: 26px 24px 20px; border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; color: var(--tsdn-text); text-decoration: none; box-shadow: var(--tsdn-shadow); transition: transform .2s, box-shadow .2s, border-color .2s; }
a.tsdn-ccard:hover { transform: translateY(-4px); border-color: var(--tsdn-blue); box-shadow: var(--tsdn-shadow-h); text-decoration: none; }
.tsdn-ccard .tsdn-orb { margin-bottom: 8px; }
.tsdn-ccard__label { font-size: 13px; font-weight: 700; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; color: var(--tsdn-link); }
.tsdn-ccard__value { font-size: 20px; font-weight: 800; line-height: 1.3; color: var(--tsdn-navy); overflow-wrap: anywhere; }
/* Email, địa chỉ dài: chữ nhỏ hơn để không bẻ giữa chữ. */
.tsdn-ccard__value--sm { font-size: 16.5px; line-height: 1.4; }
.tsdn-ccard__note { font-size: 14px; line-height: 1.55; color: var(--tsdn-muted); text-wrap: pretty; }
.tsdn-ccard__go { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin-top: auto; padding-top: 14px; border-top: 1px solid #e6ecf5; font-size: 14.5px; font-weight: 700; color: var(--tsdn-navy); }
.tsdn-ccard--navy { border-color: var(--tsdn-navy); background: var(--tsdn-navy); box-shadow: 0 24px 50px -28px rgba(10, 42, 120, .8); }
.tsdn-ccard--navy .tsdn-ccard__label { color: #b9cdf5; }
.tsdn-ccard--navy .tsdn-ccard__value, .tsdn-ccard--navy .tsdn-ccard__go { color: #fff; }
.tsdn-ccard--navy .tsdn-ccard__value { font-size: 24px; }
.tsdn-ccard--navy .tsdn-ccard__note { color: #c9d6f2; }
.tsdn-ccard--navy .tsdn-ccard__go { border-top-color: rgba(255, 255, 255, .18); }
.tsdn-ccard--navy .tsdn-ring { background: var(--tsdn-yellow); color: var(--tsdn-navy); }
.tsdn-ccard--navy .tsdn-orb { background: rgba(255, 255, 255, .14); box-shadow: none; }
a.tsdn-ccard--navy:hover { border-color: var(--tsdn-navy-2); background: var(--tsdn-navy-2); }

/* ---------- Thẻ thông tin doanh nghiệp ---------- */
.tsdn-info { height: 100%; padding: clamp(24px, 3vw, 36px); border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn .tsdn-info__title { margin: 0 0 8px; padding: 0; font-size: clamp(22px, 2vw, 26px); font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--tsdn-navy); }
.tsdn-info__lead { margin: 0 0 10px; font-size: 15px; line-height: 1.6; color: var(--tsdn-muted); }
.tsdn .tsdn-info__list { list-style: none; margin: 0 0 22px; padding: 0; }
.tsdn .tsdn-info__list li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: center; margin: 0; padding: 14px 0; border-bottom: 1px dashed var(--tsdn-dash); }
.tsdn-info__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--tsdn-tint); color: var(--tsdn-blue); }
.tsdn-info__k { display: block; margin-bottom: 2px; font-size: 13px; color: var(--tsdn-muted); }
.tsdn-info__v { display: block; font-size: 15.5px; font-weight: 700; line-height: 1.45; color: var(--tsdn-navy); overflow-wrap: anywhere; }
.tsdn-info__social { display: flex; flex-direction: column; gap: 10px; }

/* ---------- Bản đồ ---------- */
.tsdn-map { position: relative; height: 100%; min-height: var(--map-h, var(--map-h-base, 420px)); overflow: hidden; border: 1px solid var(--tsdn-line); border-radius: 22px; background: var(--tsdn-img); box-shadow: var(--tsdn-shadow); }
.tsdn-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Ô tìm kiếm ---------- */
.tsdn-search { position: relative; display: flex; align-items: center; width: 100%; max-width: 520px; height: 56px; margin: 10px 0 0; padding: 6px 6px 6px 48px; border: 1.5px solid var(--tsdn-line-2); border-radius: 999px; background: #fff; box-shadow: 0 14px 30px -22px rgba(10, 42, 120, .45); transition: border-color .2s, box-shadow .2s; }
.tsdn-search:focus-within { border-color: var(--tsdn-blue); box-shadow: 0 0 0 4px rgba(21, 89, 214, .12); }
.tsdn-search__ic { position: absolute; left: 18px; top: 50%; color: var(--tsdn-blue); transform: translateY(-50%); }
.tsdn .tsdn-search__input { flex: 1; min-width: 0; height: 100%; margin: 0; padding: 0 8px 0 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font: 500 15.5px var(--tsdn-font); color: var(--tsdn-text); }
.tsdn .tsdn-search__input:focus { outline: 0; box-shadow: none; }
.tsdn .tsdn-search__input::placeholder { color: #6B7280; opacity: 1; }
.tsdn .tsdn-search__btn { flex: none; height: 44px; min-height: 0; margin: 0; padding: 0 22px; border: 0; border-radius: 999px; background: var(--tsdn-cta); color: #fff; font: 700 15px/1 var(--tsdn-font); letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color .2s; }
.tsdn .tsdn-search__btn:hover, .tsdn .tsdn-search__btn:focus-visible { background: var(--tsdn-cta-h); }

/* ---------- Danh sách bài viết ---------- */
.tsdn-blog { padding-top: 8px; }
.tsdn-blog-head { margin-bottom: 24px; }
.tsdn-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 clamp(24px, 3vw, 36px); }
.tsdn-chip { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 8px 0 18px; border: 1px solid var(--tsdn-line-2); border-radius: 999px; background: #fff; color: var(--tsdn-navy); font-size: 14.5px; font-weight: 700; white-space: nowrap; text-decoration: none; transition: background-color .2s, color .2s, border-color .2s; }
.tsdn-chip span { display: grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 999px; background: var(--tsdn-soft); color: var(--tsdn-link); font-size: 13px; }
.tsdn-chip:hover { border-color: var(--tsdn-blue); color: var(--tsdn-blue); text-decoration: none; }
.tsdn-chip.is-active { border-color: var(--tsdn-navy); background: var(--tsdn-navy); color: #fff; }
.tsdn-chip.is-active span { background: rgba(255, 255, 255, .16); color: #fff; }

/* Bài nổi bật */
.tsdn-feat { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 56px); align-items: center; margin-bottom: clamp(24px, 3vw, 36px); padding: 12px; border: 1px solid var(--tsdn-line-2); border-radius: 28px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn-feat__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 20px; background: var(--tsdn-img); }
.tsdn-feat__media img, .tsdn-feat__media .tsdn-ph { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.tsdn-feat:hover .tsdn-feat__media img { transform: scale(1.03); }
.tsdn-feat__body { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; min-width: 0; padding: 16px clamp(8px, 2.4vw, 36px) 16px 0; }
.tsdn-feat__tags { display: flex; flex-wrap: wrap; gap: 8px; }
/* Nhãn ở đây có link chuyên mục: cao đủ vùng bấm, không ăn cỡ chữ nhỏ của nhãn trên ảnh công trình (main.css). */
.tsdn .tsdn-feat__tags .tsdn-tag { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; font-size: 13px; }
.tsdn .tsdn-feat__title { margin: 0; padding: 0; font-size: clamp(24px, 2.3vw, 34px); font-weight: 800; line-height: 1.2; letter-spacing: -.02em; text-wrap: balance; }
.tsdn .tsdn-feat__title a { color: var(--tsdn-navy); text-decoration: none; }
.tsdn .tsdn-feat__title a:hover { color: var(--tsdn-blue); }
.tsdn-feat__text { margin: 0; font-size: 16px; line-height: 1.7; color: var(--tsdn-text-2); text-wrap: pretty; }
.tsdn-feat .tsdn-btn { margin-top: 6px; }

/* Dòng tác giả · ngày · thời gian đọc */
.tsdn-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; font-size: 14px; color: var(--tsdn-muted); }
.tsdn-meta__item { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.tsdn-meta__item .tsdn-icon { color: var(--tsdn-blue); }
.tsdn-meta__author { display: inline-flex; align-items: center; gap: 10px; color: var(--tsdn-navy); font-weight: 700; text-decoration: none; }
.tsdn-meta__author:hover { color: var(--tsdn-blue); }
.tsdn-av { display: grid; place-items: center; flex: none; width: var(--av, var(--av-base, 40px)); height: var(--av, var(--av-base, 40px)); overflow: hidden; border-radius: 50%; background: var(--tsdn-orb-grad); color: #fff; font-weight: 800; font-size: calc(var(--av, var(--av-base, 40px)) * .36); line-height: 1; box-shadow: 0 0 0 3px #fff, 0 0 0 4px #dbe5f5; }
.tsdn-av img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Lưới thẻ bài */
.tsdn-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; }
.tsdn-art__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 4px 6px 0; font-size: 13px; color: var(--tsdn-muted); }
.tsdn-art__meta > * + *::before { content: ''; display: inline-block; width: 4px; height: 4px; margin-right: 12px; border-radius: 50%; background: #b5c2db; vertical-align: middle; }
.tsdn .tsdn-art--post .tsdn-art__title { margin-top: 0; }
.tsdn-art--post .tsdn-art__media { background: var(--tsdn-img); }
.tsdn-art__media .tsdn-ph { min-height: 0; }
.tsdn-art--post:hover .tsdn-art__media img { transform: scale(1.04); }
.tsdn-art--post .tsdn-art__media img { transition: transform .5s ease; }

/* Phân trang */
.tsdn-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: clamp(32px, 4vw, 48px); }
.tsdn .tsdn-pager .page-numbers { display: inline-grid; place-items: center; min-width: 46px; height: 46px; margin: 0; padding: 0 14px; border: 1px solid var(--tsdn-line-2); border-radius: 999px; background: #fff; color: var(--tsdn-navy); font-size: 15px; font-weight: 700; line-height: 1; text-decoration: none; }
.tsdn .tsdn-pager a.page-numbers:hover { border-color: var(--tsdn-blue); color: var(--tsdn-blue); }
.tsdn .tsdn-pager .page-numbers.current { border-color: var(--tsdn-cta); background: var(--tsdn-cta); color: #fff; }
.tsdn .tsdn-pager .page-numbers.dots { border: 0; background: none; }

/* Trống */
.tsdn-empty { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: clamp(36px, 5vw, 64px) 24px; border: 1.5px dashed #c9d6ee; border-radius: 24px; background: #fff; text-align: center; }
.tsdn .tsdn-empty__title { margin: 6px 0 0; font-size: 22px; font-weight: 800; color: var(--tsdn-navy); }
.tsdn-empty p { margin: 0; max-width: 520px; font-size: 15.5px; line-height: 1.65; color: var(--tsdn-muted); }
.tsdn-empty__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }

/* ---------- Bài chi tiết ---------- */
.tsdn-phead--post .tsdn-phead__in { max-width: calc(1240px + 2 * var(--tsdn-pad)); padding-bottom: clamp(28px, 3.5vw, 44px); }
.tsdn-phead--post .tsdn-phead__copy { max-width: 900px; }
.tsdn .tsdn-phead--post .tsdn-phead__title { font-size: clamp(30px, 3.2vw, 46px); line-height: 1.16; }
.tsdn-phead--post .tsdn-meta { margin-top: 8px; }
.tsdn-article { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.tsdn-article__main { min-width: 0; }
.tsdn-article__cover { margin: 0 0 clamp(28px, 3vw, 40px); aspect-ratio: 16 / 9; overflow: hidden; border-radius: 24px; background: var(--tsdn-img); box-shadow: 0 30px 60px -36px rgba(10, 42, 120, .5); }
.tsdn-article__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tsdn-article__side { display: flex; flex-direction: column; gap: 20px; }
@media (min-width: 1100px) {
	.tsdn-article { grid-template-columns: minmax(0, 1fr) 330px; gap: clamp(40px, 4vw, 64px); align-items: start; }
	.tsdn-article__side { position: sticky; top: 110px; }
}

/* Nội dung bài. Flatsome tự cộng chiều cao header khi cuộn tới neo (bấm mục lục lẫn mở link có #), nên scroll-margin chỉ là khoảng thở. */
.tsdn-prose { font-size: 17px; line-height: 1.8; color: var(--tsdn-text); overflow-wrap: break-word; }
.tsdn .tsdn-prose > * { margin-top: 0; margin-bottom: 1.15em; }
.tsdn .tsdn-prose > :last-child { margin-bottom: 0; }
.tsdn .tsdn-prose h2 { margin: 1.9em 0 .65em; padding: 0; font-size: clamp(23px, 2vw, 28px); font-weight: 800; line-height: 1.3; letter-spacing: -.015em; color: var(--tsdn-navy); scroll-margin-top: 24px; }
.tsdn .tsdn-prose h2::before { content: ''; display: block; width: 36px; height: 4px; margin-bottom: 14px; border-radius: 999px; background: var(--tsdn-yellow); }
.tsdn .tsdn-prose h3 { margin: 1.5em 0 .5em; padding: 0; font-size: 20px; font-weight: 800; line-height: 1.35; color: var(--tsdn-navy); scroll-margin-top: 24px; }
.tsdn .tsdn-prose > h2:first-child, .tsdn .tsdn-prose > h3:first-child { margin-top: 0; }
.tsdn-prose a { color: var(--tsdn-link); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.tsdn-prose a:hover { color: var(--tsdn-navy); }
.tsdn-prose strong { font-weight: 700; color: var(--tsdn-navy); }
.tsdn .tsdn-prose ul, .tsdn .tsdn-prose ol { margin-left: 0; padding: 0; list-style: none; }
.tsdn .tsdn-prose li { position: relative; margin: 0 0 .6em; padding-left: 34px; }
.tsdn .tsdn-prose li > ul, .tsdn .tsdn-prose li > ol { margin: .6em 0 0; }
.tsdn-prose ul > li::before { content: ''; position: absolute; left: 9px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--tsdn-blue); box-shadow: 0 0 0 4px var(--tsdn-tint); }
.tsdn-prose ol { counter-reset: tsdn-ol; }
.tsdn-prose ol > li { counter-increment: tsdn-ol; }
.tsdn-prose ol > li::before { content: counter(tsdn-ol); position: absolute; left: 0; top: .28em; width: 24px; height: 24px; border-radius: 50%; background: var(--tsdn-navy); color: #fff; font-size: 13px; font-weight: 800; line-height: 24px; text-align: center; }
.tsdn .tsdn-prose blockquote { position: relative; margin: 1.6em 0; padding: 20px 24px 20px 64px; border: 0; border-radius: 18px; background: var(--tsdn-tint); font-size: 16.5px; font-style: normal; line-height: 1.7; color: var(--tsdn-text); }
.tsdn .tsdn-prose blockquote::before { content: '!'; position: absolute; left: 20px; top: 20px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--tsdn-yellow); color: var(--tsdn-navy); font-size: 16px; font-weight: 800; line-height: 1; }
.tsdn .tsdn-prose blockquote p { margin: 0 0 .6em; }
.tsdn .tsdn-prose blockquote > :last-child { margin-bottom: 0; }
.tsdn-prose img { height: auto; border-radius: 16px; }
.tsdn .tsdn-prose figure { margin: 1.6em 0; }
.tsdn-prose figcaption { margin-top: 8px; font-size: 14px; color: var(--tsdn-muted); text-align: center; }
.tsdn .tsdn-prose table { width: 100%; border: 1px solid var(--tsdn-line-2); border-collapse: separate; border-spacing: 0; border-radius: 16px; overflow: hidden; background: #fff; font-size: 15.5px; line-height: 1.5; }
.tsdn .tsdn-prose th, .tsdn .tsdn-prose td { padding: 12px 16px; border: 0; border-bottom: 1px solid var(--tsdn-line); text-align: left; vertical-align: top; }
.tsdn .tsdn-prose th { background: var(--tsdn-navy); color: #fff; font-size: 14.5px; font-weight: 700; text-transform: none; letter-spacing: 0; }
.tsdn .tsdn-prose tr:last-child td { border-bottom: 0; }
.tsdn .tsdn-prose tr:nth-child(even) td { background: #f8fafe; }
/* Mẫu văn bản (đơn từ) trong bài: khung giấy trắng, căn giữa quốc hiệu, căn phải chỗ ký. */
.tsdn .tsdn-prose .tsdn-sample { margin: 1.6em 0; padding: 28px 32px; border: 1px solid var(--tsdn-line-2); border-radius: 18px; background: #fff; box-shadow: var(--tsdn-shadow); font-size: 16px; line-height: 1.9; }
.tsdn .tsdn-prose .tsdn-sample p { margin: 0 0 .55em; }
.tsdn .tsdn-prose .tsdn-sample > :last-child { margin-bottom: 0; }
.tsdn-sample__c { text-align: center; }
.tsdn-sample__r { text-align: right; }

/* Mục lục */
.tsdn-toc { padding: 20px 18px 16px; border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn-toc__title { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 0 6px; font-size: 16px; font-weight: 800; color: var(--tsdn-navy); }
.tsdn-toc__title .tsdn-icon { color: var(--tsdn-blue); }
.tsdn .tsdn-toc ol { counter-reset: tsdn-toc; list-style: none; margin: 0; padding: 0; }
.tsdn .tsdn-toc li { counter-increment: tsdn-toc; margin: 0; padding: 0; }
.tsdn-toc a { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 4px; padding: 9px 10px; border-radius: 12px; color: var(--tsdn-text-2); font-size: 14.5px; line-height: 1.45; text-decoration: none; transition: background-color .2s, color .2s; }
.tsdn-toc a::before { content: counter(tsdn-toc, decimal-leading-zero); font: 500 12.5px/1.75 'JetBrains Mono', monospace; color: #6B7280; }
.tsdn-toc a:hover, .tsdn-toc a.is-current { background: var(--tsdn-tint); color: var(--tsdn-navy); }
.tsdn-toc a.is-current { font-weight: 700; }
.tsdn-toc a.is-current::before { color: var(--tsdn-link); }
.tsdn-toc-m { display: none; }

/* Gọi thợ ở cột bên */
.tsdn-help { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; overflow: hidden; padding: 28px 24px 24px; border-radius: 22px; background: var(--tsdn-navy); box-shadow: 0 24px 50px -28px rgba(10, 42, 120, .8); }
.tsdn-help::after { content: ''; position: absolute; top: -70px; right: -70px; width: 200px; height: 200px; border: 2px dashed rgba(255, 255, 255, .2); border-radius: 50%; pointer-events: none; }
.tsdn-help .tsdn-orb { box-shadow: 0 0 0 6px rgba(255, 255, 255, .12); }
.tsdn-help__title { font-size: 21px; font-weight: 800; line-height: 1.3; color: #fff; }
.tsdn-help p { margin: 0; font-size: 14.5px; line-height: 1.6; color: #c9d6f2; }
.tsdn-help__btns { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; width: 100%; margin-top: 6px; }

/* Thẻ, chia sẻ */
.tsdn-post-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: clamp(32px, 4vw, 44px); padding: 18px 0; border-top: 1px solid var(--tsdn-line-2); border-bottom: 1px solid var(--tsdn-line-2); }
.tsdn-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tsdn-tags a { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border: 1px solid var(--tsdn-line-2); border-radius: 999px; background: #fff; color: var(--tsdn-text-2); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.tsdn-tags a:hover { border-color: var(--tsdn-blue); color: var(--tsdn-blue); }
.tsdn-share { position: relative; display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: 14px; font-weight: 700; color: var(--tsdn-navy); }
.tsdn-share > span:first-child { margin-right: 4px; }
.tsdn-share a, .tsdn .tsdn-share__copy { display: grid; place-items: center; width: 44px; height: 44px; min-height: 0; margin: 0; padding: 0; border: 1px solid #d9e1ee; border-radius: 14px; background: #fff; color: var(--tsdn-navy); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.tsdn-share a:hover, .tsdn .tsdn-share__copy:hover, .tsdn .tsdn-share__copy.is-done { border-color: var(--tsdn-blue); background: var(--tsdn-blue); color: #fff; }
.tsdn-share__msg { position: absolute; right: 0; top: calc(100% + 8px); z-index: 2; padding: 6px 12px; border-radius: 10px; background: var(--tsdn-navy); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .2s; }
.tsdn-share__msg:not(:empty) { opacity: 1; }

/* Hộp tác giả */
.tsdn-abox { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 22px; align-items: start; margin-top: 32px; padding: clamp(22px, 2.6vw, 30px); border: 1px solid var(--tsdn-line); border-radius: 24px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn-abox__body { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.tsdn .tsdn-abox__name { margin: 4px 0 0; padding: 0; font-size: 21px; font-weight: 800; line-height: 1.3; }
.tsdn .tsdn-abox__name a { color: var(--tsdn-navy); text-decoration: none; }
.tsdn .tsdn-abox__name a:hover { color: var(--tsdn-blue); }
.tsdn-abox__role { font-size: 14px; font-weight: 600; color: var(--tsdn-link); }
.tsdn-abox__bio { margin: 8px 0 6px; font-size: 15px; line-height: 1.65; color: var(--tsdn-text-2); }
.tsdn-abox__more { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 14.5px; font-weight: 700; color: var(--tsdn-link); text-decoration: none; }
.tsdn-abox__more:hover { color: var(--tsdn-navy); }

.tsdn-related { margin-top: var(--tsdn-gap); }
.tsdn-comments { margin-top: 32px; }

/* ---------- Trang tác giả ---------- */
.tsdn-phead--author .tsdn-phead__title { display: flex; align-items: center; gap: 16px; }
.tsdn-phead--author .tsdn-phead__title > .tsdn-av { display: none; }
.tsdn .tsdn-facts { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 8px 0 0; padding: 0; }
.tsdn .tsdn-facts li { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 0 16px; border: 1px solid var(--tsdn-line); border-radius: 999px; background: #fff; font-size: 14.5px; color: var(--tsdn-text-2); }
.tsdn-facts .tsdn-icon { color: var(--tsdn-blue); }
.tsdn-facts strong { color: var(--tsdn-navy); }
.tsdn-facts a { font-weight: 700; color: var(--tsdn-link); }

/* ---------- 404 ---------- */
.tsdn-404 { position: relative; display: flex; align-items: center; justify-content: center; gap: clamp(8px, 1.2vw, 18px); padding: 40px 30px; }
.tsdn-404__d { font-size: clamp(120px, 12vw, 200px); font-weight: 800; line-height: .9; letter-spacing: -.05em; color: var(--tsdn-navy); }
.tsdn-404__o { position: relative; display: grid; place-items: center; }
.tsdn-404__o::after { content: ''; position: absolute; inset: -20px; border: 2px dashed #b9cbeb; border-radius: 50%; animation: tsdn-spin 24s linear infinite; }
.tsdn-404__o .tsdn-orb { box-shadow: 0 0 0 10px #fff, 0 24px 50px -18px rgba(13, 67, 176, .6); }
.tsdn-404 .tsdn-phead__float--1 { top: 2%; right: 12%; }
.tsdn-404 .tsdn-phead__float--2 { bottom: 4%; left: 14%; }
@keyframes tsdn-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .tsdn-404__o::after { animation: none; } }
.tsdn-phead--404 .tsdn-search { margin-top: 18px; }
.tsdn-qlinks__title { margin: 0 0 18px; font-size: 20px; font-weight: 800; color: var(--tsdn-navy); }
.tsdn-qlinks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.tsdn-qlink { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 18px 16px 18px 18px; border: 1px solid var(--tsdn-line); border-radius: 20px; background: #fff; color: var(--tsdn-text); text-decoration: none; box-shadow: var(--tsdn-shadow); transition: transform .2s, border-color .2s, box-shadow .2s; }
.tsdn-qlink:hover { transform: translateY(-3px); border-color: var(--tsdn-blue); box-shadow: var(--tsdn-shadow-h); text-decoration: none; }
.tsdn-qlink .tsdn-orb { padding: 3px; }
.tsdn-qlink__tx { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tsdn-qlink__tx strong { font-size: 16px; font-weight: 800; line-height: 1.3; color: var(--tsdn-navy); }
.tsdn-qlink__tx span { font-size: 13.5px; line-height: 1.45; color: var(--tsdn-muted); }
.tsdn-qlink .tsdn-ring { width: 36px; height: 36px; }

/* ---------- Chính sách ---------- */
.tsdn-phead--policy .tsdn-phead__in, .tsdn-wrap--policy { max-width: calc(1240px + 2 * var(--tsdn-pad)); }
.tsdn-phead--policy .tsdn-phead__decor { width: min(100%, 340px); }
.tsdn-policy { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.tsdn-policy__side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.tsdn-policy__main { min-width: 0; }
@media (min-width: 1100px) {
	.tsdn-policy { grid-template-columns: 290px minmax(0, 1fr); gap: clamp(40px, 4vw, 64px); align-items: start; }
	/* Cột bên dính khi cuộn, cao hơn màn hình thì cuộn trong cột; đệm + lề âm chừa chỗ để bóng thẻ không bị cắt. */
	.tsdn-policy__side { position: sticky; top: 100px; max-height: calc(100vh - 116px); margin: -10px -14px 0; padding: 10px 14px 28px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
	.tsdn-prose--policy { max-width: 840px; }
	/* Máy tính đã có menu chính sách dính ở cột bên. */
	.tsdn-policy__more { display: none; }
}

/* Menu các chính sách */
.tsdn-pnav { padding: 18px 12px 12px; border: 1px solid var(--tsdn-line); border-radius: 22px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn-pnav__title { display: block; margin: 0 0 8px; padding: 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; color: var(--tsdn-link); }
.tsdn .tsdn-pnav ul { display: flex; flex-direction: column; gap: 4px; list-style: none; margin: 0; padding: 0; }
.tsdn .tsdn-pnav li { margin: 0; padding: 0; }
.tsdn-pnav__all { display: none; }
.tsdn-pnav__link { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 7px 12px 7px 8px; border-radius: 14px; color: var(--tsdn-text-2); font-size: 15px; font-weight: 600; line-height: 1.35; text-decoration: none; transition: background-color .2s, color .2s, border-color .2s; }
.tsdn-pnav__ic { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 12px; background: var(--tsdn-tint); color: var(--tsdn-blue); transition: background-color .2s, color .2s; }
.tsdn-pnav__link:hover { background: var(--tsdn-bg); color: var(--tsdn-navy); text-decoration: none; }
.tsdn-pnav__link.is-current { background: var(--tsdn-navy); color: #fff; }
.tsdn-pnav__link.is-current .tsdn-pnav__ic { background: rgba(255, 255, 255, .14); color: var(--tsdn-yellow); }

/* Ô điểm chính đầu nội dung (danh sách class tsdn-keyfacts) */
.tsdn .tsdn-prose .tsdn-keyfacts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 0 2.2em; }
.tsdn .tsdn-prose .tsdn-keyfacts li { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 20px 20px 18px; border: 1px solid var(--tsdn-line); border-radius: 18px; background: #fff; box-shadow: var(--tsdn-shadow); }
.tsdn-prose .tsdn-keyfacts li::before { position: static; width: 28px; height: 4px; margin-bottom: 6px; border-radius: 999px; background: var(--tsdn-yellow); box-shadow: none; }
.tsdn-prose .tsdn-keyfacts strong { font-size: 25px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--tsdn-navy); }
.tsdn-prose .tsdn-keyfacts span { font-size: 14.5px; line-height: 1.5; color: var(--tsdn-muted); }
.tsdn .tsdn-prose--policy th + th, .tsdn .tsdn-prose--policy td + td { white-space: nowrap; }
.tsdn .tsdn-prose--policy td + td { font-weight: 700; color: var(--tsdn-navy); }

/* Chính sách khác + dải hỏi thêm */
.tsdn-policy__more { margin-top: clamp(36px, 4vw, 52px); }
.tsdn-qlinks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tsdn-policy__more .tsdn-qlink__tx span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* Nền sáng: ngay dưới là dải xanh kêu gọi của chân trang, để hai dải đậm liền nhau sẽ thành hai băng rôn chồng nhau. */
.tsdn-pask { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 22px; align-items: center; overflow: hidden; margin-top: clamp(36px, 4vw, 52px); padding: 26px 30px; border: 1px solid var(--tsdn-line); border-radius: 24px; background: linear-gradient(135deg, #fff 0%, #eef4fd 100%); box-shadow: var(--tsdn-shadow); }
.tsdn-pask::after { content: ''; position: absolute; top: -90px; right: -60px; width: 240px; height: 240px; border: 2px dashed #d5e0f2; border-radius: 50%; pointer-events: none; }
.tsdn-pask .tsdn-orb { box-shadow: 0 0 0 6px var(--tsdn-tint); }
.tsdn-pask__tx { position: relative; z-index: 1; min-width: 0; }
.tsdn-pask__title { display: block; font-size: 21px; font-weight: 800; line-height: 1.3; color: var(--tsdn-navy); }
.tsdn-pask p { margin: 6px 0 0; font-size: 15px; line-height: 1.6; color: var(--tsdn-text-2); }
.tsdn-pask p a { color: var(--tsdn-link); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.tsdn-pask__btns { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px; }

/* Trang danh sách chính sách */
.tsdn-policy-hub { display: flex; flex-direction: column; gap: clamp(32px, 4vw, 48px); }
.tsdn-policy-hub .tsdn-pask { margin-top: 0; }
.tsdn-pcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; counter-reset: tsdn-pcard; }
.tsdn-pcard { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 30px 26px 22px; counter-increment: tsdn-pcard; border: 1px solid var(--tsdn-line); border-radius: 24px; background: #fff; box-shadow: var(--tsdn-shadow); transition: transform .2s, box-shadow .2s, border-color .2s; }
.tsdn-pcard::after { content: counter(tsdn-pcard, decimal-leading-zero); position: absolute; top: 28px; right: 26px; font: 500 13px 'JetBrains Mono', monospace; color: #6B7280; }
.tsdn-pcard:hover, .tsdn-pcard:focus-within { transform: translateY(-4px); border-color: var(--tsdn-blue); box-shadow: var(--tsdn-shadow-h); }
.tsdn-pcard .tsdn-orb { margin-bottom: 6px; }
.tsdn .tsdn-pcard__title { margin: 0; padding: 0; font-size: 21px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; }
.tsdn-pcard__title a { color: var(--tsdn-navy); text-decoration: none; }
/* Cả thẻ bấm được qua link tiêu đề. */
.tsdn-pcard__title a::before { content: ''; position: absolute; inset: 0; z-index: 1; }
.tsdn-pcard__text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--tsdn-muted); text-wrap: pretty; }
.tsdn .tsdn-pcard__facts { display: flex; flex-direction: column; gap: 12px; width: 100%; list-style: none; margin: 6px 0 4px; padding: 16px 0 0; border-top: 1px dashed var(--tsdn-dash); }
.tsdn .tsdn-pcard__facts li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; margin: 0; font-size: 14px; line-height: 1.45; color: var(--tsdn-muted); }
.tsdn-pcard__tick { display: grid; place-items: center; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; background: var(--tsdn-tint); color: var(--tsdn-blue); }
.tsdn-pcard__facts strong { display: block; font-size: 15px; font-weight: 800; color: var(--tsdn-navy); }
.tsdn-pcard__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; margin-top: auto; padding-top: 16px; border-top: 1px solid #e6ecf5; font-size: 13.5px; color: var(--tsdn-muted); }
.tsdn-pcard__go { display: inline-flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 700; color: var(--tsdn-navy); }

/* ---------- Trang dịch vụ ---------- */
/* Trang bảng giá xếp nhiều cặp bảng liền nhau. */
.tsdn-prices--stack { margin-top: 24px; }
/* Ghi chú chỉ hiện trong UX Builder khi khối tự động chưa có dữ liệu. */
.tsdn-builder-note { margin: 0; padding: 14px 18px; border: 1px dashed #b9cbeb; border-radius: 14px; background: #fff; font-size: 14px; color: var(--tsdn-muted); }
.tsdn-svclinks .tsdn-art__meta span, .tsdn-svclinks .tsdn-art__cat { color: var(--tsdn-link); }

/* ==========================================================================
   Tablet (640–1099)
   ========================================================================== */
@media (max-width: 1099px) {
	.tsdn-phead::before { top: -320px; right: -360px; }
	.tsdn-phead--decor .tsdn-phead__aside, .tsdn-phead--blog .tsdn-phead__aside, .tsdn-phead--author .tsdn-phead__aside, .tsdn-phead--cutout .tsdn-phead__aside { display: none; }
	.tsdn-phead--photo .tsdn-phead__photo { max-width: 760px; }
	.tsdn-phead--404 .tsdn-phead__in { grid-template-columns: minmax(0, 1fr); }
	.tsdn-phead--404 .tsdn-phead__aside { order: -1; justify-content: flex-start; }
	.tsdn-phead--404 .tsdn-crumbs { display: none; }
	.tsdn-phead--404 .tsdn-404 { padding: 20px 0 0 18px; }
	.tsdn-phead--404 .tsdn-404__d { font-size: 110px; }
	.tsdn-phead--404 .tsdn-404 .tsdn-orb { --orb: 104px; }
	.tsdn-phead--404 .tsdn-404 .tsdn-orb .tsdn-icon { width: 44px; height: 44px; }
	.tsdn-phead--404 .tsdn-phead__in { padding-top: 104px; gap: 8px; }
	.tsdn-phead--author .tsdn-phead__title > .tsdn-av { display: grid; }
	.tsdn-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tsdn-feat { grid-template-columns: minmax(0, 1fr); gap: 4px; }
	.tsdn-feat__body { padding: 16px 12px 12px; }
	.tsdn-toc-m { display: block; margin: 0 0 28px; border: 1px solid var(--tsdn-line); border-radius: 18px; background: #fff; box-shadow: var(--tsdn-shadow); }
	.tsdn-toc-m summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 54px; padding: 0 18px; font-size: 15.5px; font-weight: 800; color: var(--tsdn-navy); list-style: none; cursor: pointer; }
	.tsdn-toc-m summary::-webkit-details-marker { display: none; }
	.tsdn-toc-m summary > span { display: inline-flex; align-items: center; gap: 10px; }
	.tsdn-toc-m summary .tsdn-icon { color: var(--tsdn-blue); transition: transform .2s; }
	.tsdn-toc-m[open] summary > .tsdn-icon { transform: rotate(180deg); }
	.tsdn-toc-m .tsdn-toc { padding: 0 8px 10px; border: 0; box-shadow: none; }
	.tsdn-toc--side { display: none; }
	.tsdn-qlinks { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	/* Chính sách: menu thành hàng chip, có thêm chip "Tất cả" về trang danh sách */
	.tsdn-phead--policy .tsdn-phead__aside { display: none; }
	.tsdn-pnav { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.tsdn-pnav__title { display: none; }
	.tsdn .tsdn-pnav ul { flex-direction: row; flex-wrap: wrap; gap: 10px; }
	.tsdn-pnav__all { display: block; }
	.tsdn-pnav__link { min-height: 0; height: 46px; gap: 10px; padding: 0 18px 0 6px; border: 1px solid var(--tsdn-line-2); border-radius: 999px; background: #fff; color: var(--tsdn-navy); font-size: 14.5px; font-weight: 700; white-space: nowrap; }
	.tsdn-pnav__ic { width: 34px; height: 34px; border-radius: 50%; }
	.tsdn-pnav__link.is-current { border-color: var(--tsdn-navy); }
	.tsdn-pcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tsdn-pask { grid-template-columns: auto minmax(0, 1fr); }
	.tsdn-pask__btns { grid-column: 1 / -1; }
}

/* ==========================================================================
   Điện thoại (<640) — kiểu app
   ========================================================================== */
@media (max-width: 639px) {
	.tsdn-phead::before { width: 420px; height: 420px; top: -150px; right: -230px; }
	.tsdn-phead__in { gap: 22px; padding: 86px 16px 26px; }
	.tsdn-phead__copy { gap: 10px; }
	.tsdn .tsdn-phead__title { font-size: 27px; line-height: 1.16; }
	.tsdn .tsdn-phead--post .tsdn-phead__title { font-size: 25px; line-height: 1.22; }
	.tsdn-phead__text { font-size: 14.5px; line-height: 1.6; }
	.tsdn .tsdn-crumbs ol { flex-wrap: nowrap; max-width: 100%; padding: 6px 12px; font-size: 13px; }
	.tsdn-crumbs li + li::before { margin: 0 8px 0 5px; }
	.tsdn-crumbs li:not(:first-child):not(:last-child) { display: none; }
	.tsdn-crumbs li:first-child { flex: none; white-space: nowrap; }
	.tsdn-crumbs li[aria-current] { min-width: 0; }
	.tsdn-crumbs li[aria-current] span { max-width: none; }
	.tsdn-phead__btns { width: 100%; gap: 8px; margin-top: 6px; }
	.tsdn-phead__btns .tsdn-btn { flex: 1 1 auto; height: 48px; padding-left: 18px; font-size: 14.5px; }
	.tsdn-phead__btns .tsdn-btn--ring { padding-right: 7px; }
	.tsdn-phead__btns .tsdn-btn__ring { width: 34px; height: 34px; }
	.tsdn-phead__photo { padding: 0 0 26px 0; }
	.tsdn-phead__img { border-radius: 18px; }
	.tsdn-phead__photo .tsdn-phead__badge { left: 12px; padding: 10px 14px; gap: 10px; }
	.tsdn-phead__badge-tx strong { font-size: 22px; }
	.tsdn-phead__badge-tx span { font-size: 12.5px; }
	.tsdn-phead__badge .tsdn-orb { --orb: 38px; }
	.tsdn-phead__badge .tsdn-orb .tsdn-icon { width: 18px; height: 18px; }
	.tsdn-phead__photo .tsdn-phead__float--1 { top: -18px; right: 8px; }
	.tsdn-phead__photo .tsdn-phead__float--1 .tsdn-orb { --orb: 42px; }
	.tsdn-phead--404 .tsdn-phead__in { padding-top: 78px; }
	.tsdn-phead--404 .tsdn-404 { gap: 6px; padding: 16px 0 0 8px; }
	.tsdn-phead--404 .tsdn-404__d { font-size: 84px; }
	.tsdn-phead--404 .tsdn-404 .tsdn-orb { --orb: 80px; }
	.tsdn-phead--404 .tsdn-404 .tsdn-orb .tsdn-icon { width: 34px; height: 34px; }
	.tsdn-phead--404 .tsdn-404__o::after { inset: -12px; }
	.tsdn-phead--404 .tsdn-404 .tsdn-phead__float { display: none; }
	.tsdn-search { height: 52px; margin-top: 8px; padding-left: 44px; }
	.tsdn-search__ic { left: 16px; }
	.tsdn .tsdn-search__input { font-size: 15px; }
	.tsdn .tsdn-search__btn { height: 40px; padding: 0 18px; font-size: 14.5px; }
	.tsdn-phead--author .tsdn-phead__title { gap: 12px; }
	.tsdn-phead--author .tsdn-phead__title > .tsdn-av { --av: 56px; }
	.tsdn .tsdn-facts li { min-height: 40px; padding: 0 14px; font-size: 13.5px; }

	/* Số liệu: 2 × 2 trong một thẻ */
	.tsdn .tsdn-stats { padding: 6px; row-gap: 0; border-radius: 18px; }
	.tsdn .tsdn-stat { flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px 12px; }
	.tsdn-stat:nth-child(n+3) { border-top: 1px dashed var(--tsdn-dash); }
	.tsdn-stat .tsdn-orb { --orb: 38px; }
	.tsdn-stat .tsdn-orb .tsdn-icon { width: 18px; height: 18px; }
	.tsdn-stat__tx strong { font-size: 22px; }
	.tsdn-stat__tx span { font-size: 13px; }

	/* Thẻ giá trị: lưới 2 cột như ô tính năng trong app */
	.tsdn-rail:has(> .tsdn-value), .tsdn-rail:has(> .tsdn-ccard) { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; overflow: visible; scroll-snap-type: none; }
	.tsdn-value { gap: 8px; padding: 16px 14px; border-radius: 16px; }
	.tsdn-value::after { top: 16px; right: 14px; font-size: 12px; }
	.tsdn-value .tsdn-orb { --orb: 44px; margin-bottom: 2px; }
	.tsdn-value .tsdn-orb .tsdn-icon { width: 18px; height: 18px; }
	.tsdn .tsdn-value h3 { font-size: 15px; }
	.tsdn .tsdn-value p { font-size: 13px; line-height: 1.5; }
	/* Thẻ kênh liên hệ: hàng ngang icon – chữ – nút như danh bạ trong app (email/địa chỉ dài không bị bẻ giữa chữ). */
	.tsdn .tsdn-rail:has(> .tsdn-ccard) { grid-template-columns: minmax(0, 1fr); }
	.tsdn-ccard { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: "orb label go" "orb value go" "orb note go"; align-items: center; column-gap: 12px; row-gap: 2px; padding: 14px; border-radius: 16px; }
	.tsdn-ccard .tsdn-orb { --orb: 44px; grid-area: orb; align-self: center; margin: 0; }
	.tsdn-ccard .tsdn-orb .tsdn-icon { width: 18px; height: 18px; }
	.tsdn-ccard__label { grid-area: label; font-size: 11.5px; letter-spacing: .06em; }
	.tsdn-ccard__value, .tsdn-ccard__value--sm { grid-area: value; font-size: 15.5px; line-height: 1.35; overflow-wrap: break-word; }
	.tsdn-ccard--navy .tsdn-ccard__value { font-size: 21px; }
	.tsdn-ccard__value--sm { font-size: 14.5px; }
	.tsdn-ccard__note { grid-area: note; font-size: 13px; line-height: 1.45; }
	.tsdn-ccard:not(.tsdn-ccard--navy) .tsdn-ccard__note { display: none; }
	.tsdn-ccard__go { grid-area: go; width: auto; margin: 0; padding: 0; border: 0; }
	.tsdn-ccard__act { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
	.tsdn-ccard .tsdn-ring { width: 36px; height: 36px; }
	.tsdn-info { padding: 20px 16px; border-radius: 18px; }
	.tsdn .tsdn-info__list li { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 12px 0; }
	.tsdn-info__ic { width: 40px; height: 40px; border-radius: 12px; }
	.tsdn-map { --map-h: 300px; border-radius: 18px; }

	/* Danh sách bài: hàng ngang ảnh trái – chữ phải như danh sách tin trong app */
	.tsdn-chips { flex-wrap: nowrap; gap: 8px; margin: 0 -16px 20px; padding: 2px 16px 4px; overflow-x: auto; scrollbar-width: none; }
	.tsdn-chips::-webkit-scrollbar { display: none; }
	.tsdn-chip { height: 40px; padding: 0 6px 0 14px; font-size: 14px; }
	.tsdn-chip span { min-width: 26px; height: 26px; font-size: 12.5px; }
	.tsdn-feat { padding: 8px; border-radius: 20px; }
	.tsdn-feat__media { border-radius: 14px; }
	.tsdn-feat__body { gap: 12px; padding: 12px 8px 8px; }
	.tsdn .tsdn-feat__title { font-size: 21px; }
	.tsdn-feat__text { font-size: 14.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
	.tsdn-feat .tsdn-btn { width: 100%; justify-content: space-between; }
	.tsdn-meta { gap: 8px 14px; font-size: 13px; }
	.tsdn-posts { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.tsdn-posts .tsdn-art { display: grid; grid-template-columns: 108px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 12px; row-gap: 4px; padding: 8px; border-radius: 16px; }
	.tsdn-posts .tsdn-art__media { grid-column: 1; grid-row: 1 / span 3; aspect-ratio: 1; border-radius: 12px; }
	.tsdn-posts .tsdn-art__meta { grid-column: 2; padding: 2px 0 0; font-size: 12px; }
	.tsdn-posts .tsdn-art__meta > * + *::before { margin-right: 8px; }
	.tsdn .tsdn-posts .tsdn-art__title { grid-column: 2; min-height: 0; padding: 0; font-size: 15px; }
	.tsdn-posts .tsdn-art__text { display: none; }
	.tsdn-posts .tsdn-art__foot { grid-column: 2; padding: 4px 0 0; border-top: 0; }
	.tsdn-posts .tsdn-art__cat { font-size: 11.5px; }
	.tsdn-posts .tsdn-ring { width: 28px; height: 28px; }

	/* Bài chi tiết */
	.tsdn-phead--post .tsdn-meta { gap: 8px 12px; }
	.tsdn-article__cover { margin: 0 -16px 22px; border-radius: 0; box-shadow: none; }
	.tsdn-prose { font-size: 16px; line-height: 1.75; }
	.tsdn .tsdn-prose h2 { font-size: 21px; }
	.tsdn .tsdn-prose h3 { font-size: 18px; }
	.tsdn .tsdn-prose li { padding-left: 30px; }
	.tsdn .tsdn-prose blockquote { padding: 16px 16px 16px 54px; font-size: 15.5px; }
	.tsdn .tsdn-prose blockquote::before { left: 14px; top: 16px; }
	.tsdn .tsdn-prose table { font-size: 14px; }
	.tsdn .tsdn-prose th, .tsdn .tsdn-prose td { padding: 10px 12px; }
	.tsdn .tsdn-prose .tsdn-sample { padding: 18px 16px; font-size: 15px; line-height: 1.8; }
	.tsdn-post-foot { flex-direction: column; align-items: flex-start; }
	.tsdn-share { margin-left: 0; }
	.tsdn-share__msg { left: 0; right: auto; }
	.tsdn-abox { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 20px 18px; border-radius: 20px; }
	.tsdn-help { padding: 22px 18px 18px; border-radius: 20px; }
	.tsdn-related .tsdn-rail { padding-top: 4px; }

	/* 404 */
	.tsdn-qlinks { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.tsdn-qlink { gap: 12px; padding: 12px 12px 12px 14px; border-radius: 16px; }
	.tsdn-qlink .tsdn-orb { --orb: 44px; }
	.tsdn-qlink .tsdn-orb .tsdn-icon { width: 18px; height: 18px; }
	.tsdn-qlink__tx strong { font-size: 15px; }
	.tsdn-qlink__tx span { font-size: 13px; }
	.tsdn-qlink .tsdn-ring { width: 32px; height: 32px; }

	/* Chính sách: chip vuốt ngang, điểm chính gộp một thẻ nhiều dòng như bảng thông số trong app */
	.tsdn-policy { gap: 18px; }
	.tsdn .tsdn-pnav ul { position: relative; flex-wrap: nowrap; gap: 8px; margin: 0 -16px; padding: 2px 16px 4px; overflow-x: auto; scrollbar-width: none; }
	.tsdn-pnav ul::-webkit-scrollbar { display: none; }
	.tsdn-pnav__link { height: 42px; gap: 8px; padding: 0 14px 0 5px; font-size: 14px; }
	.tsdn-pnav__ic { width: 32px; height: 32px; }
	.tsdn .tsdn-prose .tsdn-keyfacts { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 4px 16px; border: 1px solid var(--tsdn-line); border-radius: 18px; background: #fff; box-shadow: var(--tsdn-shadow); }
	.tsdn .tsdn-prose .tsdn-keyfacts li { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
	.tsdn .tsdn-prose .tsdn-keyfacts li + li { border-top: 1px dashed var(--tsdn-dash); }
	.tsdn-prose .tsdn-keyfacts li::before { display: none; }
	.tsdn-prose .tsdn-keyfacts strong { font-size: 17px; }
	.tsdn-prose .tsdn-keyfacts span { font-size: 13.5px; }
	.tsdn-pcards { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.tsdn-pcard { gap: 10px; padding: 20px 18px 16px; border-radius: 20px; }
	.tsdn-pcard::after { top: 20px; right: 18px; }
	.tsdn-pcard .tsdn-orb { --orb: 48px; margin-bottom: 2px; }
	.tsdn-pcard .tsdn-orb .tsdn-icon { width: 22px; height: 22px; }
	.tsdn .tsdn-pcard__title { font-size: 18.5px; }
	.tsdn-pcard__text { font-size: 14px; }
	.tsdn-pask { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 22px 18px 18px; border-radius: 20px; }
	.tsdn-pask::after { top: -140px; right: -140px; }
	.tsdn-pask .tsdn-orb { --orb: 48px; }
	.tsdn-pask .tsdn-orb .tsdn-icon { width: 22px; height: 22px; }
	.tsdn-pask__title { font-size: 19px; }
	.tsdn-pask p { font-size: 14.5px; }
	.tsdn-pask__btns { flex-direction: column; }
	.tsdn-pask__btns .tsdn-btn { width: 100%; justify-content: center; }
}