/*
 * THANG CHỮ + TƯƠNG PHẢN + VÙNG BẤM (13/10; THU GỌN 16/10 theo góp ý "chữ trên web to quá") — lớp chồng nạp SAU cùng, không đổi bố cục.
 * Mục tiêu: gọn, mật độ thông tin cao nhưng vẫn phân cấp rõ (to/nhỏ, đậm/nhạt khác nhau).
 *   h1 hiển thị 22–28 / 800 · tiêu đề khối (.h-sec) 17–20 / 800 · tiêu đề hộp (h2) 15 / 700 (cột phụ 14) · tên mục (card/hàng) 14 / 700
 *   thân bài 13 / 400 (dòng 1.6) · chú thích 12 / 400 nhạt · nhãn nhỏ tối thiểu 11 (không dùng 9–10px).
 *   Cỡ chữ cho phép: 11 · 12 · 13 · 14 · 15 · 16 · 17 · 18 … (không dùng nửa px). Điều khiển: nút/ô nhập 13, cao 34 (nhỏ 30).
 * Kiểm bằng:  node themes/dental/tools/ui-audit.js http://localhost:PORT  (xem docs/QUY-TRINH-KIEM-TRA-UI.md)
 */
:root{
  --t-display:clamp(21px,2vw,26px);
  --t-sec:clamp(16px,1.4vw,18px);
  --t-h2:14px;
  --t-title:14px;
  --t-body:13px;
  --t-meta:12px;
  --t-micro:11px;
  --fw-normal:400;--fw-medium:500;--fw-semi:600;--fw-bold:700;   /* GIẢM ĐẬM 17/10: thân 400 · nhãn/phụ 500 · tên mục/nút/chip 600 · h1, tiêu đề khối, số/giá nổi 700; KHÔNG 800/900 */
  --ink-3:#667086;            /* chữ phụ: đủ tương phản 4.5:1 trên nền trắng (trước #7b8496 ≈ 3.9:1) */
  --orange-ink:#b4540a;       /* cam dùng cho CHỮ trên nền sáng (≥ 4.5:1); --orange giữ cho nền/biểu tượng */
}
body{font-size:var(--t-body);line-height:1.5}

/* tiêu đề trang: lớn, đậm nhất, siết chữ */
.phead h1,.dhead h1,.atop h1,.hero h1{font-size:var(--t-display);font-weight:var(--fw-bold);letter-spacing:-.5px;line-height:1.2}
.p-qa .phead h1{font-size:var(--t-display)}
/* tiêu đề khối trong trang */
.h-sec{font-size:var(--t-sec);font-weight:var(--fw-bold);letter-spacing:-.4px;line-height:1.2}
.eyebrow{font-size:var(--t-micro);font-weight:var(--fw-medium);letter-spacing:.08em}
/* tiêu đề hộp: nhỏ hơn tiêu đề khối, nhẹ hơn một nấc (700) */
.box>.bh h2{font-size:var(--t-h2);font-weight:var(--fw-semi);letter-spacing:-.2px}
.side .box>.bh h2,.pside .box>.bh h2{font-size:14px}
/* tên mục trong thẻ/hàng: to hơn thân bài, đậm vừa */
.lr .nm,.dr .nm,.lab .nm,.cc .nm{font-size:var(--t-title);font-weight:var(--fw-semi);letter-spacing:-.2px}
.cc .nm{font-size:14px}
/* thân bài / mô tả: to hơn chú thích, nhạt hơn tiêu đề, dòng thoáng */
.bb p,.cb p,.box p,.ltx-c p,.ppc-b small,article p{font-size:var(--t-body);line-height:1.6}
.ppc-b small{font-size:12px}
/* chú thích / số liệu phụ */
small,.muted{font-size:var(--t-meta);font-weight:var(--fw-normal)}
b,strong{font-weight:var(--fw-medium)}   /* <b> trơn = nhấn nhẹ (500); tên mục/số liệu có lớp riêng 600/700 */
.nm b,.pr b,.stat b,.big b,th b{font-weight:var(--fw-bold)}

/* chữ nhỏ nhất: tối thiểu 11px */
.hot,.l1,.lb,.wl,.ftier,.adl,.ad-lb,.near .ad-lb,.bdg,.av,span.by{font-size:max(var(--t-micro),1em)}
.hot,.l1,.ftier,.adl,.ad-lb{font-size:var(--t-micro)}

/* tương phản: chữ cam trên nền sáng */
.bdg.spon,.cat[style*="orange"],.or,.eyebrow[style*="orange"],[style*="color:var(--orange)"],[style*="color:#e89f00"]{color:var(--orange-ink)!important}
.btn-or{color:var(--orange-ink);border-color:#f2c79a}
.btn-or:hover{background:var(--orange-ink);color:#fff}
.f5 .by,.f5 .r .by{color:var(--ink-3)}

/* vùng bấm đủ lớn trên điện thoại (≥ 36px) */
@media (max-width:760px){
  a.c-ns,.c-ns{min-height:36px;display:inline-flex;align-items:center}
  .crumb a{display:inline-flex;align-items:center;min-height:32px;padding:0 3px}
  select,input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.inp input{min-height:40px}
  .phead h1,.dhead h1,.atop h1,.hero h1{letter-spacing:-.6px}
}
.bdg,.bdg.spon,.bdg.vip,.bdg.hot-b,span.av{font-size:var(--t-micro)}
@media (max-width:760px){.pid .tt a,.near a{min-height:28px}.crumb a{min-height:32px}}

/* liên kết tiêu đề/tên mục trên điện thoại: dòng đủ cao để vùng bấm không < 20px khi dòng chữ thu gọn (13–14px) */
h3{line-height:1.45}
.nm a,.cp-nm a,.nm>a{line-height:1.5}
@media (max-width:760px){h3>a,.cp-nm>a,.nm>a{display:inline-block;max-width:100%;vertical-align:top}}
.cp-nm>a{line-height:1.7}

/* ===== THANG CHỮ ĐIỆN THOẠI (≤ 760px, 16/10): chữ VỪA VÀ NHỎ như app, mật độ nhiều — h1 22 · tiêu đề khối 16 · h2 hộp 14 · tên mục 14 (thẻ lưới 13) · thân 13 · phụ 12 · nhãn 11.
   Ô nhập GIỮ 13px (chủ không muốn 16px; rủi ro iOS tự phóng to khi chạm — xem docs/CHUAN-GIAO-DIEN.md §14). Vùng bấm ≥ 40–44 giữ bằng min-height/đệm, không bằng cỡ chữ. ===== */
@media (max-width:760px){
  :root{--t-display:22px;--t-sec:16px;--t-h2:14px;--t-title:14px}
  .wrap h1:not(.keep),main h1:not(.keep){font-size:22px!important;line-height:1.2;letter-spacing:-.5px}
  .nhero h1,.nhero h1 *{font-size:inherit}
  .h-sec{font-size:var(--t-sec)}
  .box>.bh h2,.side .box>.bh h2{font-size:14px}
  .lead,p.lead,.hero p,.hero-main p,.phead p,.dhead p,.ab-lead,.bgh-l p,.ct-head p,.lp-hd p,.hc-hero p{font-size:13px;line-height:1.55}
  .ti,.pin-hd b,.ask b,.ask-tx b,.askbox b{font-size:14px}
  .ab-h,.ab-h.ab-center{font-size:20px!important}
  .ab-quote{font-size:16px}
  .ab-pl,.bx.big h3,.abc-form h3{font-size:18px}
  .lp-up-l h3{font-size:16px}
  .plan .pr,.pk .pr,.bgh .pr,.sb-r .pr{font-size:22px}
  .amt{font-size:18px}
  .sec{padding-top:18px}
  .sec-hd{margin-bottom:8px}
  .box{margin-bottom:10px}
  .box>.bb{padding:10px}
  .box>.bh{padding:8px 10px}
  .phead{padding:6px 0 10px}
  .bgh-l h1{font-size:22px!important}
  .hero .finder .v select{font-size:14px}
}

/* ===== GIẢM ĐẬM (17/10, chủ: "font cần giảm kích thước và giảm bold, bạn đã quá lạm dụng") — token --fw-*; mọi font-weight rải rác đã quy về token ===== */
/* 700 CHỈ cho: h1, tiêu đề khối, số liệu/giá cần nổi */
.stat b,.kpi b,.acct .kpi b,.dstat b,.ab-stats b,.big,.amt,.pr,.plan .pr,.pk .pr,.price,.xd-pr b,.hot-n{font-weight:var(--fw-bold)}
.stat b{font-size:18px}.acct .kpi b{font-size:20px}
/* 600: tên mục, nút, chip/nhãn trạng thái */
.btn,.chip,.pill,.tab,.bdg,.tg,.tag,.lvb,.xd-tag,.pin-tag,.hc-tag,.pb-tag{font-weight:var(--fw-semi)}
/* 500: nhãn, tiêu đề cột, menu, thanh trên, chú thích nhấn */
label,.form-label,.fl label,th,nav.menu a,.util,.crumb,.sec-hd .more,.fapp-eyebrow,.eyebrow.soft,.fb label{font-weight:var(--fw-medium)}
nav.menu a.on,.tab.on,.pill.on{font-weight:var(--fw-semi)}
th{font-size:var(--t-micro)}
@media (max-width:760px){.stat b{font-size:16px}.acct .kpi b{font-size:18px}}
h1,.h-sec{font-weight:var(--fw-bold)!important}
.faq-a,.faq-a *{font-weight:var(--fw-normal)}
h2,h3,h4,h5{font-weight:var(--fw-semi)}   /* tiêu đề thẻ/phần = 600 (UA mặc định 700); h1 + .h-sec = 700 ở trên */
label.form-label,.fl>label,.form-label{font-weight:var(--fw-medium)!important}
