/* =====================================================================
   duhocnga.org — giao diện mới (Halo Media 2026)
   Token khai báo MỘT chỗ ở :root. Màu thương hiệu giữ #224DB7 / #1739A5.
   ===================================================================== */
:root {
	--dhn-primary: #224DB7;
	--dhn-primary-700: #1739A5;
	--dhn-primary-50: #EEF3FF;
	--dhn-primary-100: #DCE6FF;
	--dhn-navy: #0B1B3F;
	--dhn-navy-2: #14295C;
	--dhn-ink: #0F172A;
	--dhn-text: #334155;
	--dhn-muted: #64748B;
	--dhn-line: #E4E9F2;
	--dhn-bg: #F5F7FB;
	--dhn-white: #FFFFFF;
	--dhn-red: #D7263D;
	--dhn-gold: #F5B700;
	--dhn-green: #0E9F6E;
	--dhn-radius: 16px;
	--dhn-radius-sm: 10px;
	--dhn-shadow: 0 12px 32px -14px rgba(15, 23, 42, .22);
	--dhn-shadow-lg: 0 24px 60px -24px rgba(11, 27, 63, .38);
	--dhn-ff-head: 'Montserrat', 'MS Arial', 'MS Roboto', system-ui, sans-serif;
	--dhn-ff-body: 'Be Vietnam Pro', 'BVP Arial', 'BVP Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--dhn-w: 1200px;
	--dhn-header-h: 76px;
}

/* ---------- nền chung ---------- */
body {
	font-family: var(--dhn-ff-body) !important;
	color: var(--dhn-text);
	font-size: 16px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	background: var(--dhn-white);
}
h1, h2, h3, h4, h5, h6,
.entry-title, .page-title, .ct-title {
	font-family: var(--dhn-ff-head) !important;
	color: var(--dhn-ink);
	letter-spacing: -.01em;
	line-height: 1.25;
}
a { color: var(--dhn-primary); text-underline-offset: 3px; }
a:hover { color: var(--dhn-primary-700); }
img { max-width: 100%; height: auto; }
::selection { background: var(--dhn-primary); color: #fff; }

.dhn-container { width: 100%; max-width: var(--dhn-w); margin: 0 auto; padding: 0 20px; }
.dhn-section { padding: 72px 0; }
.dhn-section--tight { padding: 48px 0; }
.dhn-section--alt { background: var(--dhn-bg); }
.dhn-section--navy { background: radial-gradient(1200px 500px at 85% -10%, #2a56c9 0%, transparent 60%), linear-gradient(160deg, var(--dhn-navy) 0%, var(--dhn-navy-2) 100%); color: #DCE4F7; }
.dhn-section--navy h2, .dhn-section--navy h3 { color: #fff; }
.dhn-eyebrow { display: inline-flex; align-items: center; gap: 8px; font: 600 13px/1 var(--dhn-ff-head); letter-spacing: .12em; text-transform: uppercase; color: var(--dhn-primary); margin-bottom: 14px; }
.dhn-eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--dhn-red); border-radius: 2px; }
.dhn-section--navy .dhn-eyebrow { color: #9DB6FF; }
.dhn-h2 { font-size: clamp(26px, 3.2vw, 38px); font-weight: 800; margin: 0 0 14px; }
.dhn-lead { font-size: 18px; color: var(--dhn-muted); max-width: 720px; }
.dhn-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 36px; flex-wrap: wrap; }
.dhn-section-head .dhn-lead { margin: 0; }

/* ---------- nút ---------- */
.dhn-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 24px; border-radius: 999px; font: 700 15px/1 var(--dhn-ff-head); text-decoration: none !important; border: 2px solid transparent; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease; white-space: nowrap; }
.dhn-btn--primary { background: var(--dhn-primary); color: #fff !important; box-shadow: 0 10px 24px -10px rgba(34, 77, 183, .7); }
.dhn-btn--primary:hover { background: var(--dhn-primary-700); transform: translateY(-2px); }
.dhn-btn--red { background: var(--dhn-red); color: #fff !important; box-shadow: 0 10px 24px -10px rgba(215, 38, 61, .6); }
.dhn-btn--red:hover { background: #b81e32; transform: translateY(-2px); }
.dhn-btn--ghost { border-color: currentColor; color: var(--dhn-primary) !important; background: transparent; }
.dhn-btn--ghost:hover { background: var(--dhn-primary); border-color: var(--dhn-primary); color: #fff !important; }
.dhn-btn--light { background: #fff; color: var(--dhn-navy) !important; }
.dhn-btn--light:hover { transform: translateY(-2px); box-shadow: var(--dhn-shadow); }
.dhn-btn--glass { background: rgba(255, 255, 255, .12); color: #fff !important; border-color: rgba(255, 255, 255, .35); backdrop-filter: blur(6px); }
.dhn-btn--glass:hover { background: rgba(255, 255, 255, .22); }
.dhn-btn svg { width: 18px; height: 18px; }

.dhn-chip svg, .dhn-result__meta svg, .dhn-topbar svg, .dhn-uni__img .dhn-chip svg { width: 14px; height: 14px; flex: none; }
.dhn-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--dhn-primary-50); color: var(--dhn-primary-700); font: 600 13px/1.2 var(--dhn-ff-body); text-decoration: none !important; }
.dhn-chip--glass { background: rgba(255, 255, 255, .14); color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
.dhn-chip--red { background: #FDE8EB; color: var(--dhn-red); }

.dhn-card { background: #fff; border: 1px solid var(--dhn-line); border-radius: var(--dhn-radius); box-shadow: 0 1px 2px rgba(15, 23, 42, .04); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
a.dhn-card, .dhn-card--hover { text-decoration: none; color: inherit; }
a.dhn-card:hover, .dhn-card--hover:hover { transform: translateY(-4px); box-shadow: var(--dhn-shadow); border-color: var(--dhn-primary-100); }

.dhn-grid { display: grid; gap: 24px; }
.dhn-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dhn-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dhn-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 999px) { .dhn-grid--3, .dhn-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .dhn-grid--2, .dhn-grid--3, .dhn-grid--4 { grid-template-columns: minmax(0, 1fr); } .dhn-section { padding: 52px 0; } }

/* ---------- HEADER ---------- */
.dhn-topbar { background: var(--dhn-navy); color: #B8C5E6; font-size: 13px; }
.dhn-topbar .dhn-container { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 38px; }
.dhn-topbar a { color: #DCE4F7; text-decoration: none; }
.dhn-topbar a:hover { color: #fff; }
.dhn-topbar__info { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.dhn-topbar__info span { display: inline-flex; gap: 7px; align-items: center; }
.dhn-topbar svg { width: 14px; height: 14px; opacity: .85; }
.dhn-social { display: flex; gap: 6px; }
.dhn-social a { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; transition: background .2s; }
.dhn-social a:hover { background: rgba(255, 255, 255, .12); }
.dhn-social svg { width: 15px; height: 15px; fill: currentColor; opacity: 1; }

.dhn-header { position: sticky; top: 0; z-index: 900; background: rgba(255, 255, 255, .96); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid transparent; transition: box-shadow .25s, border-color .25s; }
.admin-bar .dhn-header { top: 32px; }
.dhn-header.is-scrolled { box-shadow: 0 10px 30px -18px rgba(15, 23, 42, .35); border-color: var(--dhn-line); }
.dhn-header__bar { display: flex; align-items: center; gap: 24px; height: var(--dhn-header-h); }
.dhn-logo img { height: 42px; width: auto; display: block; }
.dhn-nav { margin-left: auto; }
.dhn-nav > ul { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.dhn-nav li { position: relative; list-style: none; }
.dhn-nav > ul > li > a { display: flex; align-items: center; gap: 4px; white-space: nowrap; height: var(--dhn-header-h); padding: 0 10px; font: 600 14px/1 var(--dhn-ff-head); color: var(--dhn-ink); text-decoration: none; position: relative; }
.dhn-nav > ul > li > a::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 18px; height: 2px; border-radius: 2px; background: var(--dhn-red); transform: scaleX(0); transition: transform .25s ease; }
.dhn-nav > ul > li:hover > a::after, .dhn-nav > ul > li.current-menu-item > a::after, .dhn-nav > ul > li.current-menu-ancestor > a::after { transform: scaleX(1); }
.dhn-nav > ul > li.menu-item-has-children > a::before { content: ""; order: 2; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px); margin-left: 6px; opacity: .55; }
.dhn-nav .sub-menu { position: absolute; top: calc(100% - 8px); left: -8px; min-width: 300px; padding: 10px; margin: 0; background: #fff; border: 1px solid var(--dhn-line); border-radius: 14px; box-shadow: var(--dhn-shadow-lg); opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .2s ease; }
.dhn-nav li:hover > .sub-menu, .dhn-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dhn-nav .sub-menu a { display: block; padding: 10px 14px; border-radius: 10px; font-size: 14.5px; line-height: 1.4; color: var(--dhn-text); text-decoration: none; }
.dhn-nav .sub-menu a:hover { background: var(--dhn-primary-50); color: var(--dhn-primary-700); }
.dhn-header__actions { display: flex; align-items: center; gap: 10px; }
.dhn-icon-btn { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--dhn-line); background: #fff; color: var(--dhn-ink); cursor: pointer; transition: all .2s; }
.dhn-icon-btn:hover { border-color: var(--dhn-primary); color: var(--dhn-primary); }
.dhn-icon-btn svg { width: 19px; height: 19px; }
.dhn-burger { display: none; }
.dhn-header .dhn-btn { min-height: 44px; padding: 0 20px; font-size: 14px; }

/* menu điện thoại */
.dhn-drawer { position: fixed; inset: 0; z-index: 1000; visibility: hidden; }
.dhn-drawer.is-open { visibility: visible; }
.dhn-drawer__bg { position: absolute; inset: 0; background: rgba(11, 27, 63, .55); opacity: 0; transition: opacity .3s; }
.dhn-drawer.is-open .dhn-drawer__bg { opacity: 1; }
.dhn-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(380px, 88vw); background: #fff; transform: translateX(100%); transition: transform .3s ease; display: flex; flex-direction: column; }
.dhn-drawer.is-open .dhn-drawer__panel { transform: none; }
.dhn-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--dhn-line); }
.dhn-drawer__body { overflow-y: auto; padding: 10px 18px 24px; flex: 1; }
.dhn-drawer ul { list-style: none; margin: 0; padding: 0; }
.dhn-drawer li { border-bottom: 1px solid var(--dhn-line); position: relative; }
.dhn-drawer li a { display: block; padding: 14px 44px 14px 0; font: 600 16px/1.35 var(--dhn-ff-head); color: var(--dhn-ink); text-decoration: none; }
.dhn-drawer .sub-menu { display: none; padding: 0 0 10px 14px; }
.dhn-drawer .sub-menu li { border: 0; }
.dhn-drawer .sub-menu a { font: 500 15px/1.4 var(--dhn-ff-body); padding: 9px 0; color: var(--dhn-text); }
.dhn-drawer li.is-open > .sub-menu { display: block; }
.dhn-drawer .dhn-sub-toggle { position: absolute; right: 0; top: 6px; width: 40px; height: 40px; border: 0; background: var(--dhn-primary-50); border-radius: 10px; color: var(--dhn-primary); cursor: pointer; }
.dhn-drawer li.is-open > .dhn-sub-toggle { transform: rotate(180deg); }
.dhn-drawer__cta { padding: 16px 18px 24px; border-top: 1px solid var(--dhn-line); display: grid; gap: 10px; }

/* ô tìm kiếm phủ */
.dhn-search-layer { position: fixed; inset: 0; z-index: 1001; background: rgba(11, 27, 63, .72); backdrop-filter: blur(6px); display: none; align-items: flex-start; justify-content: center; padding: 14vh 20px 20px; }
.dhn-search-layer.is-open { display: flex; }
.dhn-search-layer form { width: min(720px, 100%); display: flex; gap: 10px; background: #fff; padding: 10px; border-radius: 18px; box-shadow: var(--dhn-shadow-lg); }
.dhn-search-layer input { flex: 1; border: 0; font-size: 18px; padding: 0 14px; outline: none; background: transparent; }

@media (max-width: 1279px) { .dhn-header__actions .dhn-btn--cta { display: none; } }
@media (max-width: 1099px) {
	.dhn-nav { display: none; }
	.dhn-burger { display: grid; }
	.dhn-header__actions { margin-left: auto; }
	.dhn-topbar__info span.hide-sm { display: none; }
}
@media (max-width: 640px) {
	:root { --dhn-header-h: 64px; }
	.dhn-logo img { height: 34px; }
	.dhn-topbar .dhn-social { display: none; }
	.dhn-topbar__info { gap: 12px; }
}

/* ---------- breadcrumb ---------- */
.dhn-crumbs { font-size: 13.5px; color: rgba(255, 255, 255, .78); margin-bottom: 18px; }
.dhn-crumbs a { color: rgba(255, 255, 255, .9); text-decoration: none; }
.dhn-crumbs a:hover { color: #fff; text-decoration: underline; }
.dhn-crumbs .separator { margin: 0 6px; opacity: .6; }

/* ---------- HERO chi tiết ---------- */
.dhn-hero { position: relative; color: #fff; isolation: isolate; overflow: hidden; background: var(--dhn-navy); }
.dhn-hero__bg { position: absolute; inset: 0; z-index: -2; }
.dhn-hero__bg img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.03); }
.dhn-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11, 27, 63, .94) 0%, rgba(11, 27, 63, .78) 45%, rgba(11, 27, 63, .35) 100%), linear-gradient(0deg, rgba(11, 27, 63, .65) 0%, rgba(11, 27, 63, 0) 45%); }
.dhn-hero__inner { padding-top: 64px; padding-bottom: 56px; min-height: 460px; display: flex; flex-direction: column; justify-content: flex-end; }
.dhn-hero h1 { color: #fff; font-size: clamp(30px, 4.4vw, 52px); font-weight: 800; margin: 14px 0 14px; max-width: 900px; text-wrap: balance; }
.dhn-hero__sub { font-size: 16.5px; line-height: 1.65; color: #D7E1F7; max-width: 780px; margin: 0 0 26px; }
.dhn-hero__sub.is-long { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.dhn-hero__sub.is-long.is-open { -webkit-line-clamp: unset; }
.dhn-hero__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dhn-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }
.dhn-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 36px; border-top: 1px solid rgba(255, 255, 255, .18); }
.dhn-stat { padding: 20px 18px 0 0; }
.dhn-stat b { display: block; font: 800 clamp(22px, 2.6vw, 30px)/1.1 var(--dhn-ff-head); color: #fff; }
.dhn-stat span { font-size: 13.5px; color: #AFC0E8; }
@media (max-width: 760px) { .dhn-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dhn-hero__inner { min-height: 0; padding-top: 40px; padding-bottom: 36px; } }

/* ---------- thanh mục con dính ---------- */
.dhn-subnav { position: sticky; top: var(--dhn-header-h); z-index: 800; background: #fff; border-bottom: 1px solid var(--dhn-line); }
.admin-bar .dhn-subnav { top: calc(var(--dhn-header-h) + 32px); }
.dhn-subnav ul { display: flex; gap: 4px; list-style: none; margin: 0 auto; padding: 0 20px; max-width: var(--dhn-w); overflow-x: auto; scrollbar-width: none; }
.dhn-subnav ul::-webkit-scrollbar { display: none; }
.dhn-subnav a { display: block; padding: 16px 14px; white-space: nowrap; font: 600 14px/1 var(--dhn-ff-head); color: var(--dhn-muted); text-decoration: none; border-bottom: 2px solid transparent; }
.dhn-subnav a:hover { color: var(--dhn-ink); }
.dhn-subnav a.is-active { color: var(--dhn-primary); border-color: var(--dhn-primary); }

/* ---------- bố cục 2 cột ---------- */
.dhn-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.dhn-aside { position: sticky; top: calc(var(--dhn-header-h) + 72px); display: grid; gap: 20px; }
@media (max-width: 999px) { .dhn-layout { grid-template-columns: minmax(0, 1fr); } .dhn-aside { position: static; } }
.dhn-block { scroll-margin-top: calc(var(--dhn-header-h) + 70px); padding: 8px 0 48px; }
.dhn-block + .dhn-block { border-top: 1px solid var(--dhn-line); padding-top: 48px; }
.dhn-block__title { font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; margin: 0 0 20px; display: flex; gap: 12px; align-items: center; }
.dhn-block__title::before { content: ""; width: 6px; height: 28px; border-radius: 4px; background: linear-gradient(180deg, var(--dhn-primary), var(--dhn-red)); flex: none; }

/* thẻ thông tin nhanh */
.dhn-facts { padding: 22px; }
.dhn-facts h3 { font-size: 17px; margin: 0 0 14px; }
.dhn-facts dl { margin: 0; display: grid; gap: 12px; }
.dhn-facts dt { font: 600 12px/1.2 var(--dhn-ff-head); letter-spacing: .06em; text-transform: uppercase; color: var(--dhn-muted); }
.dhn-facts dd { margin: 3px 0 0; color: var(--dhn-ink); font-size: 14.5px; line-height: 1.5; word-break: break-word; }
.dhn-aside-cta { padding: 24px; background: linear-gradient(150deg, var(--dhn-primary) 0%, var(--dhn-navy-2) 100%); border: 0; color: #DCE4F7; }
.dhn-aside-cta h3 { color: #fff; font-size: 19px; margin: 0 0 8px; }
.dhn-aside-cta p { margin: 0 0 16px; font-size: 14.5px; }
.dhn-aside-cta .dhn-btn { width: 100%; }

/* ---------- nội dung soạn thảo ---------- */
.dhn-prose { font-size: 16.5px; line-height: 1.8; color: var(--dhn-text); }
.dhn-prose > *:first-child { margin-top: 0; }
.dhn-prose p { margin: 0 0 1.05em; }
.dhn-prose h2, .dhn-prose h3, .dhn-prose h4, .dhn-prose h5, .dhn-prose h6 { margin: 1.6em 0 .6em; }
.dhn-prose h2 { font-size: 26px; } .dhn-prose h3 { font-size: 22px; } .dhn-prose h4 { font-size: 19px; } .dhn-prose h5, .dhn-prose h6 { font-size: 17px; }
.dhn-prose ul, .dhn-prose ol { padding-left: 1.3em; margin: 0 0 1.1em; }
.dhn-prose li { margin: .35em 0; }
.dhn-prose ul li::marker { color: var(--dhn-primary); }
.dhn-prose figure { margin: 1.6em 0; }
.dhn-prose img { border-radius: 14px; }
.dhn-prose blockquote { margin: 1.6em 0; padding: 18px 22px; border-left: 4px solid var(--dhn-primary); background: var(--dhn-primary-50); border-radius: 0 12px 12px 0; color: var(--dhn-ink); }
.dhn-prose table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 15px; display: block; overflow-x: auto; }
.dhn-prose th { background: var(--dhn-primary); color: #fff; text-align: left; font-weight: 600; }
.dhn-prose th, .dhn-prose td { padding: 10px 14px; border-bottom: 1px solid var(--dhn-line); vertical-align: top; }
.dhn-prose tr:nth-child(even) td { background: #FAFBFE; }
.dhn-prose a { font-weight: 500; }

/* ---------- video ---------- */
.dhn-videos { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-top: 28px; }
.dhn-video { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; cursor: pointer; border: 0; padding: 0; display: block; width: 100%; }
.dhn-video img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: opacity .25s, transform .4s; }
.dhn-video:hover img { opacity: 1; transform: scale(1.04); }
.dhn-video__play { position: absolute; inset: 0; display: grid; place-items: center; }
.dhn-video__play i { width: 58px; height: 58px; border-radius: 50%; background: var(--dhn-red); display: grid; place-items: center; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.dhn-video__play i::after { content: ""; border-left: 16px solid #fff; border-top: 10px solid transparent; border-bottom: 10px solid transparent; margin-left: 4px; }
.dhn-video__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 10px; background: linear-gradient(transparent, rgba(0, 0, 0, .78)); color: #fff; font: 600 13.5px/1.35 var(--dhn-ff-body); text-align: left; }
.dhn-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- bảng ngành & học phí ---------- */
.dhn-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.dhn-tab { border: 1px solid var(--dhn-line); background: #fff; border-radius: 999px; padding: 10px 16px; font: 600 14px/1 var(--dhn-ff-head); color: var(--dhn-text); cursor: pointer; display: inline-flex; gap: 8px; align-items: center; transition: all .2s; }
.dhn-tab small { background: var(--dhn-bg); color: var(--dhn-muted); border-radius: 999px; padding: 3px 8px; font-size: 12px; }
.dhn-tab:hover { border-color: var(--dhn-primary); color: var(--dhn-primary); }
.dhn-tab.is-active { background: var(--dhn-primary); border-color: var(--dhn-primary); color: #fff; }
.dhn-tab.is-active small { background: rgba(255, 255, 255, .2); color: #fff; }
.dhn-table-tools { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.dhn-input { height: 46px; border: 1px solid var(--dhn-line); border-radius: 12px; padding: 0 14px 0 42px; font-size: 15px; width: 100%; max-width: 360px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%2364748B' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 14px center; outline: none; transition: border-color .2s, box-shadow .2s; }
.dhn-input:focus { border-color: var(--dhn-primary); box-shadow: 0 0 0 4px var(--dhn-primary-50); }
.dhn-fee-note { font-size: 13.5px; color: var(--dhn-muted); }
.dhn-fees { border: 1px solid var(--dhn-line); border-radius: var(--dhn-radius); overflow: hidden; background: #fff; }
.dhn-fees table { width: 100%; border-collapse: collapse; font-size: 15px; }
.dhn-fees thead th { position: sticky; top: 0; background: var(--dhn-navy); color: #fff; font: 600 13px/1 var(--dhn-ff-head); letter-spacing: .04em; text-transform: uppercase; padding: 14px 16px; text-align: left; }
.dhn-fees td { padding: 12px 16px; border-top: 1px solid var(--dhn-line); vertical-align: middle; }
.dhn-fees tr.dhn-khoi td { background: var(--dhn-primary-50); color: var(--dhn-primary-700); font: 700 13.5px/1.3 var(--dhn-ff-head); padding: 10px 16px; }
.dhn-fees td.ma { color: var(--dhn-muted); font-variant-numeric: tabular-nums; white-space: nowrap; width: 96px; font-size: 14px; }
.dhn-fees td.phi { text-align: right; white-space: nowrap; font-weight: 700; color: var(--dhn-ink); font-variant-numeric: tabular-nums; width: 170px; }
.dhn-fees td.phi small { display: block; font-weight: 400; color: var(--dhn-muted); font-size: 12px; }
.dhn-fees td.phi.lien-he { color: var(--dhn-muted); font-weight: 500; }
.dhn-fees td a { text-decoration: none; font-weight: 600; color: var(--dhn-ink); }
.dhn-fees td a:hover { color: var(--dhn-primary); text-decoration: underline; }
.dhn-fees td a::after { content: " →"; color: var(--dhn-primary); opacity: 0; transition: opacity .2s; }
.dhn-fees tr:hover td a::after { opacity: 1; }
.dhn-fees tbody tr:not(.dhn-khoi):hover td { background: #FAFBFE; }
.dhn-fees__wrap { max-height: 640px; overflow: auto; }
.dhn-fees__empty { padding: 28px; text-align: center; color: var(--dhn-muted); }
.dhn-fees__title { font: 700 15px/1.4 var(--dhn-ff-head); color: var(--dhn-ink); padding: 16px; border-bottom: 1px solid var(--dhn-line); background: #fff; margin: 0; }
@media (max-width: 640px) { .dhn-fees td.ma { display: none; } .dhn-fees td.phi { width: auto; } .dhn-fees thead th.ma { display: none; } }

/* ---------- chi nhánh / thẻ ảnh ---------- */
.dhn-branch { overflow: hidden; display: flex; flex-direction: column; }
.dhn-branch__img { aspect-ratio: 16 / 10; overflow: hidden; background: var(--dhn-bg); }
.dhn-branch__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.dhn-branch:hover .dhn-branch__img img { transform: scale(1.05); }
.dhn-branch__body { padding: 16px 18px 18px; font-size: 14px; line-height: 1.6; }
.dhn-branch__body h4 { font-size: 15.5px; margin: 0 0 8px; }
.dhn-branch__body p { margin: 0; }

/* ---------- xếp hạng ---------- */
.dhn-ranks { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; align-items: start; }
.dhn-rank { padding: 18px; display: flex; flex-direction: column; gap: 8px; position: relative; overflow: hidden; }
.dhn-rank__num { font: 800 30px/1 var(--dhn-ff-head); color: var(--dhn-primary); letter-spacing: -.02em; }
.dhn-rank__num small { font-size: 13px; font-weight: 600; color: var(--dhn-muted); letter-spacing: 0; margin-left: 4px; }
.dhn-rank__src { font: 700 13px/1.35 var(--dhn-ff-head); color: var(--dhn-ink); }
.dhn-rank__text { font-size: 13.5px; color: var(--dhn-muted); line-height: 1.55; }
.dhn-rank__text p { margin: 0; }
.dhn-rank::after { content: ""; position: absolute; right: -24px; top: -24px; width: 80px; height: 80px; border-radius: 50%; background: var(--dhn-primary-50); z-index: 0; }
.dhn-rank > * { position: relative; z-index: 1; }

/* ---------- callout ---------- */
.dhn-callout { display: grid; grid-template-columns: 56px 1fr; gap: 18px; padding: 24px; border-radius: var(--dhn-radius); background: linear-gradient(135deg, #FFF7E6 0%, #FFFDF7 100%); border: 1px solid #FBE3B5; margin-top: 28px; }
.dhn-callout__icon { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: #fff; box-shadow: var(--dhn-shadow); font-size: 28px; }
.dhn-callout h4 { margin: 0 0 6px; font-size: 18px; }

/* ---------- thư viện ảnh ---------- */
.dhn-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 170px; gap: 12px; }
.dhn-gallery a { display: block; border-radius: 12px; overflow: hidden; position: relative; }
.dhn-gallery a:nth-child(6n + 1) { grid-column: span 2; grid-row: span 2; }
.dhn-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.dhn-gallery a:hover img { transform: scale(1.06); }
@media (max-width: 760px) { .dhn-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 140px; } }
.dhn-lightbox { position: fixed; inset: 0; z-index: 1100; background: rgba(5, 10, 25, .94); display: none; align-items: center; justify-content: center; }
.dhn-lightbox.is-open { display: flex; }
.dhn-lightbox img { max-width: 92vw; max-height: 86vh; border-radius: 10px; }
.dhn-lightbox button { position: absolute; background: rgba(255, 255, 255, .12); border: 0; color: #fff; width: 52px; height: 52px; border-radius: 50%; font-size: 26px; cursor: pointer; }
.dhn-lightbox .x { top: 20px; right: 20px; } .dhn-lightbox .prev { left: 20px; } .dhn-lightbox .next { right: 20px; }

/* ---------- tin tức ---------- */
.dhn-post { overflow: hidden; display: flex; flex-direction: column; height: 100%; }
.dhn-post__img { aspect-ratio: 16 / 10; overflow: hidden; background: var(--dhn-bg); }
.dhn-post__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.dhn-post:hover .dhn-post__img img { transform: scale(1.05); }
.dhn-post__body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.dhn-post__meta { font-size: 12.5px; color: var(--dhn-muted); display: flex; gap: 10px; align-items: center; }
.dhn-post__meta .dhn-chip { padding: 4px 9px; font-size: 11.5px; }
.dhn-post h3 { font-size: 16.5px; line-height: 1.45; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.dhn-post p { margin: 0; font-size: 14px; color: var(--dhn-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- thẻ trường ---------- */
.dhn-uni { overflow: hidden; display: flex; flex-direction: column; height: 100%; }
.dhn-uni__img { aspect-ratio: 16 / 9; position: relative; overflow: hidden; background: var(--dhn-navy); }
.dhn-uni__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.dhn-uni:hover .dhn-uni__img img { transform: scale(1.05); }
.dhn-uni__img .dhn-chip { position: absolute; left: 12px; bottom: 12px; background: rgba(11, 27, 63, .78); color: #fff; backdrop-filter: blur(4px); }
.dhn-uni__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.dhn-uni h3 { font-size: 16px; line-height: 1.4; margin: 0; }
.dhn-uni__en { font-size: 13px; color: var(--dhn-muted); }
.dhn-uni__fee { margin-top: auto; padding-top: 10px; display: flex; justify-content: space-between; align-items: baseline; border-top: 1px dashed var(--dhn-line); font-size: 13px; color: var(--dhn-muted); }
.dhn-uni__fee b { font: 800 17px/1 var(--dhn-ff-head); color: var(--dhn-primary); }

/* ---------- bộ lọc ---------- */
.dhn-finder { background: #fff; border-radius: 22px; padding: 22px; box-shadow: var(--dhn-shadow-lg); color: var(--dhn-text); position: relative; }
.dhn-finder__title { font: 800 19px/1.3 var(--dhn-ff-head); color: var(--dhn-ink); margin: 0 0 4px; }
.dhn-finder__hint { font-size: 13.5px; color: var(--dhn-muted); margin: 0 0 16px; }
.dhn-finder__he { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.dhn-finder__he label { cursor: pointer; }
.dhn-finder__he input { position: absolute; opacity: 0; pointer-events: none; }
.dhn-finder__he span { display: inline-flex; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--dhn-line); font: 600 13.5px/1 var(--dhn-ff-head); color: var(--dhn-text); transition: all .2s; }
.dhn-finder__he input:checked + span { background: var(--dhn-primary); border-color: var(--dhn-primary); color: #fff; }
.dhn-finder__he input:focus-visible + span { box-shadow: 0 0 0 4px var(--dhn-primary-100); }
.dhn-finder__row { display: grid; grid-template-columns: 1.5fr 1fr auto; gap: 10px; }
@media (max-width: 760px) { .dhn-finder__row { grid-template-columns: 1fr; } }
.dhn-field { position: relative; }
.dhn-field label { display: block; font: 600 12px/1 var(--dhn-ff-head); letter-spacing: .06em; text-transform: uppercase; color: var(--dhn-muted); margin: 0 0 7px 2px; }
.dhn-field input { width: 100%; height: 52px; border: 1px solid var(--dhn-line); border-radius: 14px; padding: 0 16px; font-size: 16px; outline: none; transition: border-color .2s, box-shadow .2s; background: #fff; }
.dhn-field input:focus { border-color: var(--dhn-primary); box-shadow: 0 0 0 4px var(--dhn-primary-50); }
.dhn-field input[aria-invalid="true"] { border-color: var(--dhn-red); box-shadow: 0 0 0 4px #FDE8EB; }
.dhn-finder__row .dhn-btn { height: 52px; align-self: end; border-radius: 14px; }
.dhn-suggest { position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--dhn-line); border-radius: 14px; box-shadow: var(--dhn-shadow-lg); max-height: 320px; overflow-y: auto; z-index: 50; display: none; padding: 6px; margin: 0; list-style: none; }
.dhn-suggest.is-open { display: block; }
.dhn-suggest li { padding: 10px 12px; border-radius: 10px; cursor: pointer; display: flex; justify-content: space-between; gap: 12px; font-size: 15px; color: var(--dhn-ink); }
.dhn-suggest li small { color: var(--dhn-muted); white-space: nowrap; }
.dhn-suggest li[aria-selected="true"], .dhn-suggest li:hover { background: var(--dhn-primary-50); color: var(--dhn-primary-700); }
.dhn-suggest mark { background: none; color: var(--dhn-primary); font-weight: 700; }
.dhn-finder__err { color: var(--dhn-red); font-size: 13.5px; margin: 10px 0 0; display: none; }
.dhn-finder__err.is-on { display: block; }
.dhn-results__bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.dhn-results__count { font: 700 18px/1.3 var(--dhn-ff-head); color: var(--dhn-ink); }
.dhn-result { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 14px; }
.dhn-result__img { aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; background: var(--dhn-bg); }
.dhn-result__img img { width: 100%; height: 100%; object-fit: cover; }
.dhn-result h3 { font-size: 16.5px; margin: 0 0 4px; }
.dhn-result__meta { font-size: 13.5px; color: var(--dhn-muted); display: flex; gap: 12px; flex-wrap: wrap; }
.dhn-result__fee { text-align: right; }
.dhn-result__fee b { display: block; font: 800 20px/1.1 var(--dhn-ff-head); color: var(--dhn-primary); }
.dhn-result__fee small { color: var(--dhn-muted); font-size: 12.5px; }
.dhn-result__rank { position: absolute; top: -8px; left: -8px; width: 28px; height: 28px; border-radius: 50%; background: var(--dhn-red); color: #fff; display: grid; place-items: center; font: 800 12px/1 var(--dhn-ff-head); }
.dhn-result { position: relative; }
@media (max-width: 640px) { .dhn-result { grid-template-columns: 84px minmax(0, 1fr); } .dhn-result__fee { grid-column: 1 / -1; text-align: left; display: flex; gap: 8px; align-items: baseline; } }

/* ---------- CTA dải ---------- */
.dhn-cta { position: relative; overflow: hidden; border-radius: 26px; padding: 48px; background: radial-gradient(600px 300px at 90% 0%, rgba(215, 38, 61, .35), transparent 60%), linear-gradient(135deg, var(--dhn-primary) 0%, var(--dhn-navy) 100%); color: #DCE4F7; display: grid; grid-template-columns: 1fr auto; gap: 28px; align-items: center; }
.dhn-cta h2 { color: #fff; font-size: clamp(24px, 3vw, 34px); margin: 0 0 8px; }
.dhn-cta p { margin: 0; font-size: 16.5px; }
.dhn-cta__actions { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 860px) { .dhn-cta { grid-template-columns: 1fr; padding: 32px 24px; } }

/* ---------- FOOTER ---------- */
.dhn-footer { background: linear-gradient(170deg, var(--dhn-navy) 0%, #081430 100%); color: #A9B7DA; font-size: 14.5px; padding-top: 72px; position: relative; overflow: hidden; }
.dhn-footer::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #fff 0 33.3%, var(--dhn-primary) 33.3% 66.6%, var(--dhn-red) 66.6%); opacity: .9; }
.dhn-footer a { color: #DCE4F7; text-decoration: none; }
.dhn-footer a:hover { color: #fff; text-decoration: underline; }
.dhn-footer__grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1.25fr; gap: 40px; }
@media (max-width: 999px) { .dhn-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .dhn-footer__grid { grid-template-columns: 1fr; } }
.dhn-footer h4 { color: #fff; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 18px; }
.dhn-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dhn-footer__brand img { height: 44px; width: auto; background: #fff; padding: 8px 12px; border-radius: 12px; margin-bottom: 16px; }
.dhn-footer__contact { display: grid; gap: 10px; margin-top: 16px; }
.dhn-footer__contact div { display: grid; grid-template-columns: 22px 1fr; gap: 8px; }
.dhn-footer__contact svg { width: 18px; height: 18px; margin-top: 3px; color: #7F97D9; }
.dhn-footer__news li { display: grid; gap: 2px; }
.dhn-footer__news time { font-size: 12px; color: #7F8FB8; }
.dhn-footer .dhn-social { margin-top: 18px; gap: 8px; }
.dhn-footer .dhn-social a { width: 38px; height: 38px; background: rgba(255, 255, 255, .08); }
.dhn-footer .dhn-social a:hover { background: var(--dhn-primary); text-decoration: none; }
.dhn-footer__bottom { margin-top: 56px; padding: 20px 0; border-top: 1px solid rgba(255, 255, 255, .1); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13.5px; }

/* ---------- trang chủ ---------- */
.dhn-home-hero { position: relative; color: #fff; isolation: isolate; overflow: hidden; background: var(--dhn-navy); }
.dhn-home-hero__bg { position: absolute; inset: 0; z-index: -2; }
.dhn-home-hero__bg img, .dhn-home-hero__bg picture { display: block; width: 100%; height: 100%; object-fit: cover; }
.dhn-home-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(900px 500px at 15% 20%, rgba(34, 77, 183, .55), transparent 60%), linear-gradient(100deg, rgba(11, 27, 63, .96) 0%, rgba(11, 27, 63, .82) 50%, rgba(11, 27, 63, .55) 100%); }
.dhn-home-hero__inner { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; padding-top: 88px; padding-bottom: 96px; }
.dhn-home-hero h1 { color: #fff; font-size: clamp(34px, 5vw, 60px); font-weight: 800; line-height: 1.12; margin: 18px 0 18px; text-wrap: balance; }
.dhn-home-hero h1 em { font-style: normal; background: linear-gradient(90deg, #9DB6FF, #fff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dhn-home-hero p.lead { font-size: 18.5px; color: #CBD6F2; max-width: 560px; margin: 0 0 28px; }
.dhn-trust { display: flex; gap: 28px; flex-wrap: wrap; margin-top: 34px; }
.dhn-trust div b { display: block; font: 800 30px/1 var(--dhn-ff-head); color: #fff; }
.dhn-trust div span { font-size: 13.5px; color: #A9B9E2; }
@media (max-width: 999px) { .dhn-home-hero__inner { grid-template-columns: 1fr; padding-top: 56px; padding-bottom: 64px; } }

.dhn-feature { padding: 26px; height: 100%; }
.dhn-feature__icon { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: var(--dhn-primary-50); color: var(--dhn-primary); margin-bottom: 18px; }
.dhn-feature__icon svg { width: 26px; height: 26px; }
.dhn-feature h3 { font-size: 18.5px; margin: 0 0 8px; }
.dhn-feature p { margin: 0; font-size: 15px; color: var(--dhn-muted); }

.dhn-steps { counter-reset: step; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.dhn-step { padding: 24px 20px; position: relative; }
.dhn-step::before { counter-increment: step; content: "0" counter(step); font: 800 34px/1 var(--dhn-ff-head); color: var(--dhn-primary-100); display: block; margin-bottom: 14px; }
.dhn-step h3 { font-size: 16.5px; margin: 0; line-height: 1.4; }
.dhn-section--navy .dhn-step { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .1); }
.dhn-section--navy .dhn-step h3 { color: #fff; }
.dhn-section--navy .dhn-step::before { color: rgba(157, 182, 255, .45); }
@media (max-width: 999px) { .dhn-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .dhn-steps { grid-template-columns: 1fr; } }

.dhn-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.dhn-split__media { position: relative; }
.dhn-split__media img { border-radius: 22px; box-shadow: var(--dhn-shadow-lg); width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; }
.dhn-split__badge { position: absolute; right: -14px; bottom: -18px; background: #fff; border-radius: 18px; padding: 16px 20px; box-shadow: var(--dhn-shadow-lg); display: flex; gap: 12px; align-items: center; }
.dhn-split__badge b { font: 800 26px/1 var(--dhn-ff-head); color: var(--dhn-red); }
.dhn-split__badge span { font-size: 13px; color: var(--dhn-muted); line-height: 1.35; }
@media (max-width: 860px) { .dhn-split { grid-template-columns: 1fr; gap: 36px; } .dhn-split__badge { right: 12px; } }

.dhn-cities { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.dhn-city { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 3 / 4; display: block; color: #fff !important; text-decoration: none !important; isolation: isolate; }
.dhn-city img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .6s; }
.dhn-city::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(transparent 35%, rgba(11, 27, 63, .9)); }
.dhn-city:hover img { transform: scale(1.07); }
.dhn-city span { position: absolute; left: 14px; right: 14px; bottom: 12px; font: 700 15px/1.3 var(--dhn-ff-head); }
.dhn-city small { display: block; font: 500 12.5px/1.3 var(--dhn-ff-body); color: #C9D5F3; margin-top: 2px; }
@media (max-width: 999px) { .dhn-cities { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .dhn-cities { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- câu chuyện sinh viên ---------- */
.dhn-story { max-width: 780px; margin: 0 auto; }
.dhn-story .dhn-prose { font-size: 17.5px; }

/* ---------- trang danh sách / tin tức Blocksy ---------- */
.entry-card { border-radius: var(--dhn-radius) !important; }
.ct-pagination .page-numbers.current { background: var(--dhn-primary) !important; }

/* ---------- tiện ích ---------- */
.dhn-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dhn-js .dhn-reveal:not(.is-in) { opacity: 0; transform: translateY(18px); }
.dhn-reveal { transition: opacity .7s ease, transform .7s ease; }
@media (prefers-reduced-motion: reduce) { .dhn-reveal { opacity: 1; transform: none; transition: none; } * { scroll-behavior: auto !important; } }
/* QC-28: KHÔNG dùng scroll-behavior:smooth toàn trang — cú nhảy tới neo trên URL bị kéo dài, vị trí tính khi bố cục còn đổi và còn cuộn tiếp khi người dùng đã chạm */
.dhn-muted { color: var(--dhn-muted); }
.dhn-mt-0 { margin-top: 0 !important; }
.dhn-center { text-align: center; }
.dhn-more { margin-top: 32px; text-align: center; }

/* ô tìm trường đặt ở cột hẹp */
.dhn-aside .dhn-finder__row { grid-template-columns: 1fr; }
.dhn-aside .dhn-finder__row .dhn-btn { width: 100%; }
.dhn-more-list { margin-top: 22px; }
.dhn-more-list > summary { list-style: none; cursor: pointer; display: inline-flex; }
.dhn-more-list > summary::-webkit-details-marker { display: none; }
.dhn-more-list[open] > summary { display: none; }
.dhn-main .dhn-grid--3, .dhn-section .dhn-container[style*="920px"] .dhn-grid--3 { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* QC-10: ô tìm ở cột hẹp của trang chủ — ngành chiếm cả hàng, thành phố + nút hàng dưới */
.dhn-home-hero .dhn-finder__row { grid-template-columns: 1fr auto; }
.dhn-home-hero .dhn-finder__row .dhn-field:first-child { grid-column: 1 / -1; }
@media (max-width: 760px) { .dhn-home-hero .dhn-finder__row { grid-template-columns: 1fr; } }
.dhn-pages { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 28px; }
.dhn-pages .dhn-chip { min-width: 40px; justify-content: center; padding: 10px 12px; }

/* G-05: bảng trong 45 trang Elementor cũ cuộn ngang được trên điện thoại thay vì bị cắt */
@media (max-width: 760px) {
	.elementor-widget-container table, .entry-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---------- bảng xếp hạng (.bangxephang) — một diện mạo cho trang đã chuyển + 45 trang Elementor cũ ----------
   Nguồn lỗi (QC 10/10): theme cha có sẵn `.bangxephang .sub{#940e0f}` và `td,th{padding}` không tiền tố; khi chuyển sang
   template mới, bảng mất khung `.elementor-widget-container` nên rơi vào màu đỏ sẫm + chữ xám. Đặt lại bằng token thương hiệu. */
.dhn-prose table.bangxephang,
.dhn-rank__text table.bangxephang,
.elementor-widget-container table.bangxephang { width: 100%; border-collapse: collapse; margin: 0; font-size: 14px; line-height: 1.45; color: var(--dhn-text); }
.dhn-prose table.bangxephang thead,
.dhn-rank__text table.bangxephang thead,
.elementor-widget-container table.bangxephang thead { background: var(--dhn-primary); color: #fff; font-style: normal; border: 0; }
.dhn-prose table.bangxephang th,
.dhn-rank__text table.bangxephang th,
.elementor-widget-container table.bangxephang th { background: var(--dhn-primary); color: #fff; font: 600 13px/1.4 var(--dhn-ff-body); font-style: normal; text-align: left; padding: 9px 12px; border: 0; }
.dhn-prose table.bangxephang td,
.dhn-rank__text table.bangxephang td,
.elementor-widget-container table.bangxephang td { padding: 8px 12px; border-bottom: 1px solid var(--dhn-line); background: transparent; color: var(--dhn-text); white-space: normal; max-width: none; min-width: 0; overflow: visible; text-overflow: clip; vertical-align: top; }
.dhn-prose table.bangxephang tr.sub td,
.dhn-rank__text table.bangxephang tr.sub td,
.elementor-widget-container table.bangxephang tr.sub td,
.dhn-prose table.bangxephang .sub,
.dhn-rank__text table.bangxephang .sub,
.elementor-widget-container table.bangxephang .sub { background: var(--dhn-primary-100); color: var(--dhn-ink); font-weight: 700; }
.dhn-prose table.bangxephang tr:hover,
.dhn-rank__text table.bangxephang tr:hover,
.elementor-widget-container table.bangxephang tr:hover { background: transparent; color: inherit; }
.dhn-prose table.bangxephang tbody tr:hover td,
.dhn-rank__text table.bangxephang tbody tr:hover td,
.elementor-widget-container table.bangxephang tbody tr:hover td { background: var(--dhn-primary-50); color: var(--dhn-ink); }
.dhn-prose table.bangxephang tr:hover a,
.dhn-rank__text table.bangxephang tr:hover a,
.elementor-widget-container table.bangxephang tr:hover a { color: var(--dhn-primary-700); }

/* thẻ xếp hạng trên trang trường: tiêu đề nhỏ, bảng cuộn trong thẻ, không tràn */
.dhn-rank__text { min-width: 0; overflow-wrap: break-word; }
.dhn-rank__text h2, .dhn-rank__text h3, .dhn-rank__text h4, .dhn-rank__text h5, .dhn-rank__text h6 { font: 500 13.5px/1.5 var(--dhn-ff-body) !important; letter-spacing: 0; color: var(--dhn-text); margin: 0 0 12px; }
.dhn-rank__text h4 a { font-weight: 600; }
.dhn-tbl { max-height: 360px; overflow: auto; border: 1px solid var(--dhn-line); border-radius: 10px; -webkit-overflow-scrolling: touch; }
.dhn-tbl table { display: table; }
.dhn-tbl thead th { position: sticky; top: 0; z-index: 2; }

/* =====================================================================================================
   QC C2 + phản biện 10/10/2026 — chống luật KHÔNG tiền tố của CSS chính Blocksy.
   CSS chính của Blocksy nạp SAU dhn.css nên luật cùng độ ưu tiên của nó thắng; các luật dưới đây dùng
   `html body …` để thắng cả độ ưu tiên lẫn thứ tự nạp. (PB-10..12 · QC-15..19, 23)
   ===================================================================================================== */

/* QC-19: Blocksy khai --fontFamily = Roboto Slab nhưng không nạp phông → rơi về phông hệ thống */
html:root, html body { --fontFamily: var(--dhn-ff-body); --buttonFontFamily: var(--dhn-ff-head); }

/* R14: kit Elementor 24092 mang bộ mặc định của Elementor (xanh #6EC1E4 · lục #61CE70 · Roboto / Roboto Slab) → token thương hiệu */
html body.elementor-kit-24092 {
	--e-global-color-primary: var(--dhn-primary);
	--e-global-color-secondary: var(--dhn-ink);
	--e-global-color-text: var(--dhn-text);
	--e-global-color-accent: var(--dhn-red);
	--e-global-typography-primary-font-family: 'Montserrat';
	--e-global-typography-secondary-font-family: 'Montserrat';
	--e-global-typography-text-font-family: 'Be Vietnam Pro';
	--e-global-typography-accent-font-family: 'Be Vietnam Pro';
}

/* PB-10 (chặn): menu trong ngăn kéo — Blocksy có `.menu{display:flex}` + `.menu li.menu-item{display:flex}` */
html body .dhn-drawer ul, html body .dhn-drawer ul.menu { display: block; }
html body .dhn-drawer ul li, html body .dhn-drawer ul.menu li.menu-item, html body .dhn-drawer ul.menu li.page_item { display: block; }
html body .dhn-drawer li > a { display: block; }
html body .dhn-drawer .sub-menu { display: none; }
html body .dhn-drawer li.is-open > .sub-menu { display: block; }

/* PB-11: header dính — Blocksy có `#header{position:relative;z-index:50}` (1,0,0) */
html body #header.dhn-header { position: sticky !important; top: 0; z-index: 900; }
html body.admin-bar #header.dhn-header { top: 32px; }
@media (max-width: 782px) { html body.admin-bar #header.dhn-header { top: 46px; } }

/* PB-12 · QC-18: nút gửi + ô nhập — Blocksy có `[type=submit]{…}` và `input[type=text|search]{…}` */
html body .dhn-btn { font: 700 15px/1 var(--dhn-ff-head); min-height: 48px; padding: 0 24px; border-radius: 999px; text-transform: none; letter-spacing: 0; }
html body .dhn-header .dhn-btn { min-height: 44px; padding: 0 20px; font-size: 14px; }
html body .dhn-btn--primary { background: var(--dhn-primary); color: #fff !important; }
html body .dhn-btn--primary:hover { background: var(--dhn-primary-700); }
html body .dhn-btn--red { background: var(--dhn-red); color: #fff !important; }
html body .dhn-btn--red:hover { background: #b81e32; }
html body .dhn-finder__row .dhn-btn { height: 52px; border-radius: 14px; }
html body .dhn-field input[type="text"], html body .dhn-field input[type="search"] { height: 52px; padding: 0 16px; border: 1px solid var(--dhn-line); border-radius: 14px; background-color: #fff; color: var(--dhn-ink); font: 400 16px/1.4 var(--dhn-ff-body); box-shadow: none; }
html body .dhn-field input[type="text"]:focus, html body .dhn-field input[type="search"]:focus { border-color: var(--dhn-primary); box-shadow: 0 0 0 4px var(--dhn-primary-50); }
html body input.dhn-input[type="search"], html body input.dhn-input[type="text"] { height: 46px; padding: 0 14px 0 42px; border: 1px solid var(--dhn-line); border-radius: 12px; background-color: #fff; background-repeat: no-repeat; background-position: 14px center; color: var(--dhn-ink); font: 400 15px/1.4 var(--dhn-ff-body); box-shadow: none; }
html body input.dhn-input[type="search"]:focus, html body input.dhn-input[type="text"]:focus { border-color: var(--dhn-primary); box-shadow: 0 0 0 4px var(--dhn-primary-50); }
html body .dhn-search-layer input[type="search"] { flex: 1; min-height: 52px; padding: 0 14px; border: 0; border-radius: 0; background: transparent; font-size: 18px; box-shadow: none; }

/* QC-15 (chặn): tiêu đề bài trên ảnh hero phủ tối phải trắng — luật h1 { color: ink } phía trên đè màu của Blocksy */
html body .hero-section[data-type="type-2"] > figure + header .page-title,
html body .hero-section[data-type="type-2"] > figure + header .entry-title { color: #fff; }
/* 15/10 (Tình, điện thoại): trang Tin tức / chuyên mục — hero nền xanh không ảnh, tiêu đề bị luật .page-title tô màu mực */
html body .hero-section[data-type="type-2"] .page-title,
html body .hero-section[data-type="type-2"] .entry-title { color: #fff; }
html body .hero-section[data-type="type-2"] .page-description { color: rgba(255, 255, 255, .88); }

/* 15/10 (Tình, điện thoại): nút mở mục con trong menu điện thoại — mũi tên SVG rõ, đủ lớn */
html body .dhn-drawer .dhn-sub-toggle { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; min-height: 0; border: 0; border-radius: 10px; background: var(--dhn-primary-50); color: var(--dhn-primary); font-size: 0; line-height: 0; box-shadow: none; transition: transform .2s ease; }
html body .dhn-drawer .dhn-sub-toggle svg { width: 20px; height: 20px; display: block; }

/* QC-16 (chặn): hàng đầu bảng viết bằng <thead><tr><td> — luật `td { color }` đè chữ trắng của thead */
html body .dhn-prose table.bangxephang thead td,
html body .dhn-rank__text table.bangxephang thead td,
html body .elementor-widget-container table.bangxephang thead td { background: var(--dhn-primary); color: #fff; font-weight: 600; }

/* QC-23: khoảng hạng "51-100" không gãy dòng tại dấu gạch */
html body .dhn-prose table.bangxephang td:not(:first-child),
html body .dhn-rank__text table.bangxephang td:not(:first-child),
html body .elementor-widget-container table.bangxephang td:not(:first-child) { white-space: nowrap; }

/* G5: cột chữ trong callout không giãn khi ảnh hỏng */
.dhn-callout .dhn-prose { min-width: 0; }

/* QC-19 (còn sót): Blocksy đặt --fontFamily RIÊNG trên h1–h6 (=Roboto Slab); thẻ <span style="font-family:var(--fontFamily)"> bên trong
   tiêu đề (trang /hoc-tieng-nga/) đọc biến này → phải đặt lại ngay trên chính thẻ tiêu đề */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6 { --fontFamily: var(--dhn-ff-head); }
/* widget danh sách video của Elementor mặc định Roboto (trang 38195); chừa phông biểu tượng */
html body.dhn-legacy .elementor-widget-video-playlist :not(i):not([class*="eicon"]):not([class*="fa-"]) { font-family: var(--dhn-ff-body); }

/* Neo mục (QC 10/10 · lỗi "tiêu đề chui xuống dưới header + thanh mục con"): Blocksy có `:target{scroll-margin-top: var(--scroll-margin-top-offset,0)}`
   (cùng độ ưu tiên, nạp sau) nên khi nhảy tới neo lề cuộn về 0px. Đặt lại cho cả trạng thái :target. */
html body .dhn-block, html body .dhn-block:target,
html body .dhn-section[id], html body .dhn-section[id]:target { scroll-margin-top: calc(var(--dhn-header-h) + 70px); }

/* nhãn phiên bản — CHỈ staging; nằm TRONG thanh trên cùng (không phải lớp phủ cố định nên không che nội dung) — QC-25 */
.dhn-build-top { margin-left: auto; font: 600 11px/1 var(--dhn-ff-body); color: #fff; background: rgba(255, 255, 255, .16); padding: 5px 8px; border-radius: 6px; white-space: nowrap; letter-spacing: .02em; }
.dhn-topbar .dhn-container { flex-wrap: wrap; gap: 6px 14px; }
@media (max-width: 760px) { .dhn-build-top__x { display: none; } }


/* ===== Bộ lọc v2 (v1.0.6): ô có mũi tên ▾ mở cả danh sách + tìm nhanh (trường · ngành) ===== */
.dhn-combo { position: relative; }
html body .dhn-field .dhn-combo input[type="text"] { padding-right: 52px; text-overflow: ellipsis; }
html body .dhn-combo .dhn-combo__btn { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; min-height: 0; padding: 0; margin: 0; border: 0; border-radius: 10px; background: transparent; box-shadow: none; color: var(--dhn-muted); cursor: pointer; display: grid; place-items: center; }
html body .dhn-combo .dhn-combo__btn:hover, html body .dhn-combo .dhn-combo__btn:focus-visible { background: var(--dhn-primary-50); color: var(--dhn-primary); }
.dhn-combo__btn svg { transition: transform .2s; }
.dhn-field.is-open .dhn-combo__btn svg { transform: rotate(180deg); }
html body .dhn-suggest { max-height: min(340px, 46vh); overscroll-behavior: contain; }
html body .dhn-suggest li[role="option"] { min-height: 44px; align-items: center; }
html body .dhn-suggest li[role="option"] > span { min-width: 0; overflow-wrap: anywhere; }
html body .dhn-suggest li em { font-style: normal; font-size: 12px; font-weight: 600; line-height: 1; background: var(--dhn-primary-50); color: var(--dhn-primary-700); padding: 3px 8px; border-radius: 999px; margin-left: 6px; white-space: nowrap; vertical-align: 1px; }
html body .dhn-suggest .dhn-suggest__head { position: sticky; top: -6px; z-index: 1; display: block; min-height: 0; padding: 9px 12px 6px; margin: 0 -6px; background: #fff; border-radius: 0; font: 700 11.5px/1.2 var(--dhn-ff-head); letter-spacing: .06em; text-transform: uppercase; color: var(--dhn-muted); cursor: default; }
html body .dhn-suggest .dhn-suggest__head:hover { background: #fff; color: var(--dhn-muted); }
html body .dhn-suggest .dhn-suggest__none { display: block; padding: 14px 12px; color: var(--dhn-muted); font-size: 14px; line-height: 1.5; cursor: default; }
html body .dhn-suggest .dhn-suggest__none:hover { background: transparent; color: var(--dhn-muted); }
/* ô tìm trên đầu trang */
.dhn-search-layer form { position: relative; }
html body .dhn-search-layer .dhn-suggest { top: calc(100% + 8px); max-height: min(60vh, 460px); }
/* danh sách thả xuống dài hơn khung hero → hero không được cắt dọc (chỉ cắt ngang) và nằm trên khối phía dưới */
html body .dhn-home-hero { overflow: visible; overflow-x: clip; z-index: 3; }

/* 15/10 (Tình, điện thoại): 45 trang thông tin Elementor — trang chỉ có cỡ chữ/lề cho máy tính bảng (H1 50px, lề 180px)
   nên điện thoại dùng nguyên → tiêu đề chiếm cả màn hình, khoảng trắng lớn. Giới hạn chung, không sửa từng trang.
   Elementor để sẵn biến --bc-* để ghi đè lề/đệm của container; lề widget TIÊU ĐỀ đưa về 0.
   KHÔNG đụng lề khối chữ/ảnh: có trang dùng lề đó để chừa chỗ ảnh đè lên hero (đặt 0 → chữ đè ảnh, đo 15/10). */
@media (max-width: 767px) {
	/* khối có ảnh giữ nguyên lề/đệm: lề dưới lớn ở đó là chỗ chừa cho ảnh thò xuống (bỏ → chữ đè ảnh, đo 15/10) */
	html body.dhn-legacy .elementor .e-con:not(:has(.elementor-widget-image, .elementor-widget-image-box, .elementor-widget-video)) {
		--bc-margin-block-start: min(var(--margin-block-start, 0px), 24px);
		--bc-margin-block-end: min(var(--margin-block-end, 0px), 32px);
		--bc-padding-block-start: min(var(--padding-block-start, 0px), 36px);
		--bc-padding-block-end: min(var(--padding-block-end, 0px), 36px);
	}
	html body.dhn-legacy .elementor .elementor-widget-heading > .elementor-widget-container { margin-top: 0; margin-bottom: 0; }
	html body.dhn-legacy .elementor .elementor-widget-spacer .elementor-spacer-inner { height: min(var(--spacer-size, 24px), 24px); }
	html body.dhn-legacy .elementor .elementor-widget-heading h1.elementor-heading-title,
	html body.dhn-legacy .elementor .elementor-widget-text-editor h1 { font-size: 30px; line-height: 1.25; text-align: center; letter-spacing: 0; }
	html body.dhn-legacy .elementor .elementor-widget-heading h2.elementor-heading-title,
	html body.dhn-legacy .elementor .elementor-widget-text-editor h2 { font-size: 24px; line-height: 1.3; letter-spacing: 0; }
	html body.dhn-legacy .elementor .elementor-widget-heading h3.elementor-heading-title,
	html body.dhn-legacy .elementor .elementor-widget-text-editor h3 { font-size: 21px; line-height: 1.35; }
	html body.dhn-legacy .elementor .elementor-widget-heading h4.elementor-heading-title,
	html body.dhn-legacy .elementor .elementor-widget-text-editor h4 { font-size: 19px; line-height: 1.4; }
	html body.dhn-legacy .elementor .elementor-widget-heading h5.elementor-heading-title,
	html body.dhn-legacy .elementor .elementor-widget-text-editor h5 { font-size: 18px; line-height: 1.4; }
}
/* 15/10 (rà điện thoại): 4 nút liên hệ nổi (plugin Button contact có sẵn) che chữ ở mọi trang → bỏ vòng sáng nhấp nháy (vòng này làm nút to gấp đôi); thu nhỏ bằng scale làm nút < 44px, khó chạm — không dùng;
   tiêu đề hero trang Tin tức/chuyên mục 35px → 30px. Chỉ điện thoại. */
@media (max-width: 767px) {
	html body #button-contact-vr .phone-vr-circle-fill { display: none; }
	html body .hero-section[data-type="type-2"] .page-title { font-size: 30px; }
	/* tiêu đề trong nội dung có cỡ viết thẳng trong thẻ (style="font-size: 2.5em") — chỉ cách này ghi đè được */
	html body.dhn-legacy .elementor-widget-text-editor :is(h1, h2, h3, h4)[style*="font-size"] { font-size: 24px !important; line-height: 1.3; }
}

/* ===== Góp ý khách vòng 1 (16/10/2026) — feedback/gop-y-vong-1-16-10-2026.md ===== */
/* GY1-01/02: hero trang chủ bỏ khoảng cách giữa 2 khối; các nút hệ đào tạo nằm trên 1 dòng (máy tính) */
@media (min-width: 1000px) {
	html body .dhn-home-hero__inner { column-gap: 0; }
	html body .dhn-home-hero .dhn-finder__he { flex-wrap: nowrap; gap: 6px; }
	html body .dhn-home-hero .dhn-finder__he span { padding: 9px 12px; white-space: nowrap; }
}
/* GY1-07: thành phố ảnh ngang, 4 cột */
html body .dhn-cities { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html body .dhn-city { aspect-ratio: 4 / 3; }
@media (max-width: 999px) { html body .dhn-cities { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { html body .dhn-cities { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* GY1-08: thẻ sinh viên — trường · ngành */
.dhn-sv .dhn-sv__line { display: flex; gap: 8px; align-items: flex-start; margin: 6px 0 0; font-size: 14.5px; line-height: 1.45; color: var(--dhn-text); }
.dhn-sv .dhn-sv__line svg { width: 16px; height: 16px; flex: none; margin-top: 2px; color: var(--dhn-primary); }
/* GY1-19/24: tiêu đề + câu dưới tiêu đề ở hero trang trường/ngành/thành phố/sinh viên: không giới hạn bề rộng, không cân dòng */
html body .dhn-hero h1 { max-width: none; text-wrap: wrap; }
html body .dhn-hero__sub { max-width: none; }
/* GY1-20: thanh trang trí trước tiêu đề mục bám lên dòng đầu (tiêu đề nhiều dòng) */
html body .dhn-block__title { align-items: flex-start; }
html body .dhn-block__title::before { margin-top: .2em; height: 1.05em; }
/* GY1-21: khung "Sinh viên Việt Nam tại…" không còn icon */
html body .dhn-callout--plain { grid-template-columns: minmax(0, 1fr); }
/* GY1-16/29: danh sách ở cột bên (trường trong thành phố, thành phố khác, sinh viên cùng trường/ngành) */
.dhn-side-list { padding: 22px; margin-bottom: 20px; }
.dhn-side-list h3 { margin: 0 0 12px; font-size: 17px; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.dhn-side-list h3 small { font: 600 12.5px/1 var(--dhn-ff-body); color: var(--dhn-primary); background: var(--dhn-primary-50); padding: 4px 8px; border-radius: 999px; }
.dhn-side-list ul { list-style: none; margin: 0; padding: 0; max-height: 420px; overflow: auto; }
.dhn-side-list li { border-top: 1px solid var(--dhn-line); }
.dhn-side-list li:first-child { border-top: 0; }
.dhn-side-list a { display: block; padding: 9px 0; font-size: 14.5px; line-height: 1.4; color: var(--dhn-text); text-decoration: none; }
.dhn-side-list a:hover { color: var(--dhn-primary); }
.dhn-side-list--cols { columns: 2; column-gap: 16px; }
.dhn-side-list--cols li { break-inside: avoid; border-top: 0; }
.dhn-side-list--cols a { padding: 5px 0; }
.dhn-aside .dhn-side-list { margin: 0; }
.dhn-aside:has(.dhn-side-list) { position: static; } /* danh sách dài: không dính, tránh bị cắt khi cuộn */
/* GY1-10: bài viết tin tức có cột bên. Cấu hình gốc của theme tắt cột bên nên thiếu CSS bố cục → tự dựng lưới 2 cột */
html body.single-post [data-sidebar="right"] { max-width: var(--dhn-w, 1240px); margin-inline: auto; padding-inline: 20px; display: grid; grid-template-columns: minmax(0, 1fr) 320px; column-gap: 56px; align-items: start; }
html body.single-post [data-sidebar="right"] > article { min-width: 0; max-width: none; margin: 0; }
html body.single-post [data-sidebar="right"] > aside { position: sticky; top: calc(var(--dhn-header-h, 76px) + 24px); }
html body.single-post [data-sidebar="right"] > aside .ct-sidebar { padding: 24px; background: var(--dhn-bg-alt, #F5F7FB); border-radius: 18px; }
html body.single-post [data-sidebar="right"] > aside h2, html body.single-post [data-sidebar="right"] > aside .wp-block-heading { font-size: 18px; margin: 0 0 12px; }
html body.single-post [data-sidebar="right"] > aside li { margin: 0 0 8px; font-size: 14.5px; line-height: 1.45; }
@media (max-width: 999px) {
	html body.single-post [data-sidebar="right"] { grid-template-columns: minmax(0, 1fr); }
	html body.single-post [data-sidebar="right"] > aside { position: static; }
}

/* ===== Trang đặc biệt (GY1-13) ===== */
[data-dhn-list] [data-item][hidden], [data-dhn-list] [data-group][hidden], [data-dhn-list] .dhn-more[hidden], [data-dhn-tabs] [data-pane][hidden], [data-list-empty][hidden] { display: none !important; }
html body .dhn-hero--trang .dhn-hero__inner { min-height: 0; padding-top: 56px; padding-bottom: 56px; }
html body .dhn-hero--trang h1 { font-size: clamp(28px, 3.6vw, 46px); margin-bottom: 8px; }
.dhn-mo-dau { max-width: 920px; margin: 0 0 36px; }
.dhn-listbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 0 0 24px; }
html body .dhn-listbar input.dhn-input[type="search"] { flex: 1 1 320px; max-width: 460px; }
html body .dhn-select { height: 46px; border: 1px solid var(--dhn-line); border-radius: 12px; padding: 0 36px 0 14px; font: 400 15px/1.4 var(--dhn-ff-body); color: var(--dhn-ink); background-color: #fff; max-width: 260px; }
.dhn-listbar__count { margin-left: auto; font-size: 14px; color: var(--dhn-muted); }
.dhn-list__empty { padding: 28px; text-align: center; color: var(--dhn-muted); background: var(--dhn-bg); border-radius: 14px; }
html body .dhn-cities--all { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dhn-city--trong { background: linear-gradient(135deg, var(--dhn-primary), var(--dhn-navy-2, #0B1B3F)); }
.dhn-khoi-nhom { margin: 0 0 32px; }
.dhn-khoi-nhom h3 { font-size: 19px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 2px solid var(--dhn-primary-50); display: flex; align-items: baseline; gap: 10px; }
.dhn-khoi-nhom h3 small { font: 500 13px/1 var(--dhn-ff-body); color: var(--dhn-muted); }
.dhn-nganh-ds { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 20px; }
.dhn-nganh-ds a { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 9px 12px; border-radius: 10px; color: var(--dhn-text); text-decoration: none; font-size: 15px; line-height: 1.4; }
.dhn-nganh-ds a:hover { background: var(--dhn-primary-50); color: var(--dhn-primary-700); }
.dhn-nganh-ds small { flex: none; font-size: 12.5px; color: var(--dhn-primary); background: var(--dhn-primary-50); border-radius: 999px; padding: 3px 8px; }
@media (max-width: 999px) { .dhn-nganh-ds { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .dhn-nganh-ds { grid-template-columns: minmax(0, 1fr); } .dhn-listbar__count { margin-left: 0; } html body .dhn-select { max-width: none; flex: 1 1 140px; } }
.dhn-rank-card { display: block; overflow: hidden; text-decoration: none !important; color: var(--dhn-ink); }
.dhn-rank-card__img { aspect-ratio: 16 / 9; background: #fff; display: grid; place-items: center; border-bottom: 1px solid var(--dhn-line); }
.dhn-rank-card__img img { width: 100%; height: 100%; object-fit: contain; padding: 14px; }
.dhn-rank-card h3 { font-size: 15.5px; line-height: 1.4; margin: 0; padding: 14px 16px 18px; }
/* Giới thiệu, Liên hệ: nội dung Elementor nằm trong khung chuẩn; bỏ tiêu đề trùng với hero */

/* ===== Sửa sau QC C2 16/10 (qc/PHIEU-LOI-16-10-gop-y-1.md) ===== */
/* QC-46 (CHẶN): danh sách thành phố — luật 4 cột ở trên thắng luật điện thoại → thẻ 77px, chữ đè ảnh */
@media (max-width: 999px) { html body .dhn-cities--all { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { html body .dhn-cities--all { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* QC-47 (GY1-02 "đưa hết các option về 1 dòng"): máy tính bảng/điện thoại không đủ bề ngang cho 5 nút →
   giữ 1 dòng, vuốt ngang để xem nút cuối (nút bị cắt ở mép phải là dấu hiệu còn nữa) */
@media (max-width: 999px) {
	html body .dhn-finder__he { flex-wrap: nowrap; gap: 6px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; margin-right: -4px; padding-bottom: 2px; }
	html body .dhn-finder__he::-webkit-scrollbar { display: none; }
	html body .dhn-finder__he label { position: relative; flex: none; }
	html body .dhn-finder__he span { padding: 9px 12px; white-space: nowrap; }
}
/* QC-49: phân trang danh sách tin (home.php) */
html body .dhn-pagination { margin-top: 40px; }
html body .dhn-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
html body .dhn-pagination .page-numbers { min-width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--dhn-line); border-radius: 12px; background: #fff; color: var(--dhn-text); font: 600 14.5px/1 var(--dhn-ff-head); text-decoration: none; }
html body .dhn-pagination a.page-numbers:hover { border-color: var(--dhn-primary); color: var(--dhn-primary); }
html body .dhn-pagination .page-numbers.current { background: var(--dhn-primary); border-color: var(--dhn-primary); color: #fff; }
html body .dhn-pagination .page-numbers.dots { border: 0; background: none; min-width: 20px; padding: 0; }
/* QC-47 (lượt 2): ô bộ lọc nằm trong ô lưới → ô lưới mặc định min-width:auto, hàng nút đẩy rộng ra 474px và bị hero cắt
   thay vì vuốt được → cho ô lưới co lại theo màn hình */
html body .dhn-home-hero__inner > *, html body .dhn-layout > *, html body .dhn-finder { min-width: 0; }
html body .dhn-finder__he { max-width: 100%; }

/* ===== Giới thiệu + Liên hệ (GY2-13, 19/10/2026): khách muốn bố cục KHỐI như bản cũ (dải màu tràn hết bề ngang, ảnh đè lên dải, form + trích dẫn 2 cột).
   Bỏ khung bóp 17/10 (hero + container + CSS ép gọn): nội dung Elementor hiển thị rộng đúng thiết kế cũ, theme chỉ thêm dải breadcrumb mảnh phía trên và bản đồ phía dưới.
   Chữ vẫn sửa bằng Elementor; điện thoại giữ luật chung của trang cũ (body.dhn-legacy). ===== */
.dhn-crumbs-bar { background: var(--dhn-bg-alt, #F5F7FB); border-bottom: 1px solid var(--dhn-line); }
.dhn-crumbs-bar .dhn-crumbs { margin: 0; padding: 12px 0; color: var(--dhn-muted, #5B6785); font-size: 14px; }
.dhn-crumbs-bar .dhn-crumbs a { color: var(--dhn-primary); text-decoration: none; }
.dhn-crumbs-bar .dhn-crumbs .separator { margin: 0 8px; opacity: .6; }
.dhn-trang-nd--rong { padding: 0; }
.dhn-ban-do { line-height: 0; }
.dhn-ban-do iframe { width: 100%; height: 420px; border: 0; display: block; }
@media (max-width: 767px) { .dhn-ban-do iframe { height: 300px; } }
/* ===== Trang Elementor cũ — tiêu đề + breadcrumb thống nhất (Tình chọn 17/10). Cỡ H1 mỗi trang gõ tay 45–75px → một cỡ.
   Độ ưu tiên ≥ 4 class (CSS từng trang của Elementor có 4 class) — cùng cách luật điện thoại 15/10. ===== */
html body.dhn-legacy .elementor .elementor-widget-heading h1.elementor-heading-title { font-size: 48px; line-height: 1.15; letter-spacing: -.01em; text-wrap: balance; }
html body.dhn-legacy .elementor .dhn-crumbs--cu { display: block; margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, .78); } /* khối thường → tự căn theo H1 của trang (giữa/trái) */
html body.dhn-legacy .elementor .dhn-crumbs--cu a { color: #fff; text-decoration: none; }
html body.dhn-legacy .elementor .dhn-crumbs--cu a:hover { text-decoration: underline; }
html body.dhn-legacy .elementor .dhn-crumbs--cu .separator { opacity: .6; }
html body.dhn-legacy .elementor .dhn-crumbs--cu .separator { margin: 0 8px; }
@media (max-width: 1024px) { html body.dhn-legacy .elementor .elementor-widget-heading h1.elementor-heading-title { font-size: 40px; } }
@media (max-width: 767px) {
	html body.dhn-legacy .elementor .elementor-widget-heading h1.elementor-heading-title { font-size: 30px; }
	html body.dhn-legacy .elementor .dhn-crumbs--cu { font-size: 13px; margin-bottom: 10px; }
}
/* lượt 2: H1 của trang cũ có lề trên lớn (cách breadcrumb 72px) → 0; điện thoại H1 luôn căn giữa (luật 15/10) → breadcrumb căn giữa theo */
html body.dhn-legacy .elementor .dhn-crumbs--cu + .elementor-heading-title { margin-top: 0 !important; padding-top: 0 !important; }
@media (max-width: 767px) { html body.dhn-legacy .elementor .dhn-crumbs--cu { text-align: center; } }
@media (max-width: 767px) {
	/* điện thoại: breadcrumb bỏ mục cuối (= tên trang, đã có ở H1 ngay dưới) cho gọn 1 dòng; H1 cách ảnh đè bên dưới */
	html body.dhn-legacy .elementor .dhn-crumbs--cu > span:last-child, html body.dhn-legacy .elementor .dhn-crumbs--cu > .separator:nth-last-child(2) { display: none; }
	html body.dhn-legacy .elementor .dhn-crumbs--cu + .elementor-heading-title { margin-bottom: 20px !important; }
}

/* ===== Vòng 2 (19/10/2026) ===== */
/* GY2-09: phân trang rõ hơn — nút lớn, viền đậm, trang hiện tại nổi, Trước/Sau tách riêng */
html body .dhn-pagination { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--dhn-line); }
html body .dhn-pagination .nav-links { gap: 10px; }
html body .dhn-pagination .page-numbers { min-width: 48px; height: 48px; padding: 0 16px; border: 2px solid #C9D3EA; border-radius: 12px; color: var(--dhn-ink); font-size: 15.5px; box-shadow: 0 2px 6px rgba(11, 27, 63, .06); }
html body .dhn-pagination a.page-numbers:hover { background: #EEF3FF; border-color: var(--dhn-primary); color: var(--dhn-primary); }
html body .dhn-pagination .page-numbers.current { box-shadow: 0 8px 18px -6px rgba(34, 77, 183, .55); }
html body .dhn-pagination .page-numbers.prev, html body .dhn-pagination .page-numbers.next { padding: 0 20px; background: var(--dhn-bg-alt, #F5F7FB); }
html body .dhn-pagination .page-numbers.dots { box-shadow: none; }
/* GY2-05/06/07/08: bài tin trong khung chứa chung + bài liên quan trong cột bài */
.dhn-bai__anh { margin: 0 0 28px; border-radius: 18px; overflow: hidden; }
.dhn-bai__anh img { display: block; width: 100%; height: auto; }
.dhn-bai .dhn-prose img { max-width: 100%; height: auto; }
.dhn-bai__lq { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--dhn-line); }
.dhn-bai__lq .dhn-grid--3 { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.dhn-block--sv { margin-top: 28px; }
/* CLS: số liệu đầu trang chủ — flex-wrap quyết định 1 hay 2 dòng tuỳ bề rộng chữ (lệch 4px) → phông tải xong là đẩy cả khối bộ lọc xuống 83px. Điện thoại: lưới 2 cột cố định (2 dòng ở mọi phông). */
.dhn-trust div span { display: block; line-height: 1.4; }
@media (max-width: 767px) { .dhn-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 20px; } }

/* GY2-01 (19/10): logo đầu trang không bị thanh menu ép (trước: 74×42 ở ≥1280px khi hiện nút "Tìm trường").
   Logo máy tính riêng (picture.dhn-logo__may) cao 50px, trần 170px rộng — logo khách tải về sau có rộng hơn cũng không méo. */
html body .dhn-header .dhn-logo { flex: none; }
html body .dhn-header .dhn-logo img { max-width: none; }
html body .dhn-header__bar { gap: 16px; }
html body .dhn-nav > ul > li > a { padding: 0 6px; }
html body .dhn-nav > ul > li > a::after { left: 6px; right: 6px; }
@media (min-width: 1100px) {
	html body .dhn-header .dhn-logo__may img { height: 50px; width: auto; max-width: 170px; object-fit: contain; }
}