/* ============================================================================
 * Landing "Du học Hàn Quốc" — styled after edugo.vn/du-hoc-nghe-duc/
 * Theme palette inherits cenedu colors (#0c2e5c blue, #e02b2b red, #f5f7fb soft).
 * ============================================================================ */

:root {
	--land-blue:        #0c2e5c;
	--land-blue-dark:   #07193a;
	--land-blue-soft:   #1a4380;
	--land-red:         #c11e2d; /* WCAG AA: 5.05:1 vs white (was #e02b2b → 4.27:1, failed) */
	--land-red-dark:    #9a1923;
	--land-soft:        #f5f7fb;
	--land-text:        #1f2937;
	--land-muted:       #5b6471;
	--land-border:      #e3e7ee;
	--land-shadow:      0 12px 32px rgba(15, 31, 60, .08);
	--land-radius:      14px;
}

.land-container { max-width: 1180px; margin: 0 auto; padding: 0 20px; }

/* Screen-reader-only label (matches WP/Bootstrap convention) */
.land-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Sections */
.land-section { padding: 64px 0; background: #fff; color: var(--land-text); }
.land-section--soft { background: var(--land-soft); }
.land-heading {
	font-size: clamp(22px, 2.6vw, 32px);
	font-weight: 800;
	text-align: center;
	margin: 0 0 36px;
	color: var(--land-blue);
	letter-spacing: .3px;
	text-transform: uppercase;
}
.land-sub {
	text-align: center;
	color: var(--land-muted);
	margin: -22px auto 32px;
	max-width: 720px;
}

/* Grids */
.land-grid { display: grid; gap: 22px; }
.land-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.land-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.land-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Buttons */
.land-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 12px 26px; font-weight: 700; letter-spacing: .4px;
	border-radius: 999px; border: 0; cursor: pointer; text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
/* Stronger specificity — Flatsome overrides plain .land-btn--red for buttons[type="submit"] */
button.land-btn.land-btn--red,
a.land-btn.land-btn--red,
.land-btn.land-btn--red { background: var(--land-red) !important; color: #fff !important; }
button.land-btn.land-btn--red:hover,
a.land-btn.land-btn--red:hover,
.land-btn.land-btn--red:hover { background: var(--land-red-dark) !important; transform: translateY(-1px); box-shadow: 0 10px 22px rgba(154, 25, 35, .35); }

/* ============================================================================
 * Hero
 * ============================================================================ */
.land-hero {
	background: linear-gradient(135deg, var(--land-blue-dark) 0%, var(--land-blue) 55%, var(--land-blue-soft) 100%);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.land-hero::before {
	content: ''; position: absolute; inset: 0;
	background: radial-gradient(circle at 80% 20%, rgba(255, 255, 255, .12) 0, transparent 45%),
	            radial-gradient(circle at 10% 90%, rgba(224, 43, 43, .22) 0, transparent 50%);
	pointer-events: none;
}
.land-hero__inner {
	position: relative;
	display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 40px;
	padding: 72px 20px 56px;
}
.land-hero__eyebrow { text-transform: uppercase; letter-spacing: 3px; font-size: 13px; opacity: .85; margin: 0 0 14px; }
.land-hero__title {
	font-size: clamp(36px, 5.4vw, 64px);
	font-weight: 900;
	line-height: 1.05;
	margin: 0 0 24px;
	text-shadow: 0 6px 24px rgba(0, 0, 0, .25);
}
.land-hero__bullets { list-style: none; padding: 0; margin: 0 0 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
.land-hero__bullets li { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.land-hero__check {
	display: inline-flex; align-items: center; justify-content: center;
	width: 22px; height: 22px; border-radius: 50%;
	background: var(--land-red); color: #fff; font-size: 13px; font-weight: 800;
}
.land-hero__visual { display: flex; align-items: center; justify-content: center; }
.land-hero__visual img { max-width: 100%; height: auto; border-radius: 18px; box-shadow: 0 25px 60px rgba(0, 0, 0, .35); }
.land-hero__visual-fallback { width: min(100%, 420px); aspect-ratio: 1 / 1; }
.land-hero__visual-fallback svg { width: 100%; height: 100%; }

/* Hero stats band */
.land-hero__stats { position: relative; background: rgba(255, 255, 255, .06); border-top: 1px solid rgba(255, 255, 255, .08); }
.land-hero__stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 28px 20px; }
.land-stat { text-align: center; }
.land-stat__value { font-size: clamp(24px, 2.6vw, 34px); font-weight: 900; color: #fff; }
.land-stat__label { font-size: 14px; opacity: .95; margin-top: 2px; }
.land-stat__sub { font-size: 12px; opacity: .7; margin-top: 4px; }

/* ============================================================================
 * Feature grid (Why Top / Language / etc.)
 * ============================================================================ */
.land-feature {
	background: #fff; border: 1px solid var(--land-border); border-radius: var(--land-radius);
	padding: 26px 22px; text-align: center; box-shadow: var(--land-shadow);
	transition: transform .25s ease, box-shadow .25s ease;
}
.land-feature:hover { transform: translateY(-4px); box-shadow: 0 22px 44px rgba(15, 31, 60, .12); }
.land-feature__icon {
	width: 64px; height: 64px; margin: 0 auto 14px;
	border-radius: 18px;
	background: linear-gradient(135deg, var(--land-blue) 0%, var(--land-blue-soft) 100%);
	color: #fff; display: flex; align-items: center; justify-content: center;
}
.land-feature__icon svg { width: 30px; height: 30px; }
.land-feature__title { font-size: 16px; font-weight: 800; color: var(--land-blue); margin: 0 0 10px; text-transform: uppercase; letter-spacing: .3px; }
.land-feature__text { font-size: 14px; color: var(--land-muted); line-height: 1.55; margin: 0; }

/* ============================================================================
 * Programs
 * ============================================================================ */
.land-program {
	background: #fff; border-radius: var(--land-radius); padding: 26px 24px;
	display: flex; flex-direction: column; gap: 10px; text-decoration: none; text-align: left;
	color: var(--land-text); border: 1px solid var(--land-border);
	box-shadow: var(--land-shadow); transition: transform .25s ease, border-color .25s ease;
	position: relative; overflow: hidden;
	font: inherit; cursor: pointer; width: 100%;
}
.land-program::before {
	content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
	background: var(--land-red); transform: scaleY(0); transform-origin: top; transition: transform .25s ease;
}
.land-program:hover { transform: translateY(-4px); border-color: rgba(224, 43, 43, .35); }
.land-program:hover::before { transform: scaleY(1); }
.land-program h3 { color: var(--land-blue); font-size: 18px; margin: 0; font-weight: 800; }
.land-program p { color: var(--land-muted); font-size: 14px; line-height: 1.55; margin: 0; flex-grow: 1; }
.land-program__arrow { color: var(--land-red); font-weight: 700; font-size: 13px; margin-top: 4px; }

/* ============================================================================
 * Benefits — bullet list with checkmarks
 * ============================================================================ */
.land-benefit-list {
	list-style: none; padding: 0; margin: 0;
	display: grid; grid-template-columns: 1fr 1fr; gap: 14px 30px;
	max-width: 980px; margin: 0 auto;
}
.land-benefit-list li {
	display: flex; align-items: flex-start; gap: 12px;
	background: #fff; border: 1px solid var(--land-border); border-radius: 12px;
	padding: 14px 18px;
	font-size: 15px; color: var(--land-text); line-height: 1.5;
}
.land-benefit-list__check {
	width: 24px; height: 24px; flex: 0 0 24px;
	background: var(--land-red); color: #fff; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 800; font-size: 14px;
}

/* ============================================================================
 * Requirements
 * ============================================================================ */
.land-requirement {
	background: #fff; border-radius: var(--land-radius); padding: 24px 22px;
	text-align: center; border: 1px solid var(--land-border);
}
.land-requirement__icon {
	width: 56px; height: 56px; margin: 0 auto 14px;
	border-radius: 50%; background: rgba(224, 43, 43, .1);
	color: var(--land-red);
	display: flex; align-items: center; justify-content: center;
}
.land-requirement__icon svg { width: 28px; height: 28px; }
.land-requirement h3 { color: var(--land-blue); font-size: 17px; font-weight: 800; margin: 0 0 8px; text-transform: uppercase; letter-spacing: .3px; }
.land-requirement p { color: var(--land-muted); font-size: 14px; line-height: 1.55; margin: 0; }

/* ============================================================================
 * CTA Form (with countdown)
 * ============================================================================ */
.land-cta {
	background: linear-gradient(135deg, var(--land-red) 0%, var(--land-red-dark) 100%);
	color: #fff;
	padding: 70px 0;
}
.land-cta__inner {
	display: grid; grid-template-columns: 1.05fr .95fr; gap: 30px; align-items: stretch;
}
.land-cta__form-card {
	background: #fff; border-radius: var(--land-radius);
	padding: 28px; color: var(--land-text); box-shadow: 0 30px 60px rgba(0, 0, 0, .25);
}
.land-cta__form-card h2 { color: var(--land-blue); font-size: 22px; font-weight: 900; margin: 0 0 18px; text-transform: uppercase; line-height: 1.25; text-align: center; }
.land-cta__form { display: grid; gap: 12px; }
.land-cta__form input,
.land-cta__form select {
	padding: 12px 14px; border: 1px solid var(--land-border); border-radius: 10px;
	font: inherit; font-size: 15px; background: #fff; color: var(--land-text);
}
.land-cta__form input.is-invalid,
.land-cta__form select.is-invalid { border-color: var(--land-red); box-shadow: 0 0 0 3px rgba(224, 43, 43, .15); }
.land-cta__note { color: var(--land-blue); font-size: 13px; margin: 14px 0 0; text-align: center; font-weight: 600; }
.land-cta__countdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 14px; }
.land-cta__countdown span {
	background: var(--land-blue); color: #fff; border-radius: 10px; padding: 10px 0;
	display: flex; flex-direction: column; align-items: center;
}
.land-cta__countdown strong { font-size: 22px; font-weight: 900; }
.land-cta__countdown em { font-size: 11px; opacity: .85; font-style: normal; text-transform: uppercase; letter-spacing: .8px; }

.land-cta__offers { color: #fff; padding: 10px 0; }
.land-cta__offers h3 { font-size: 20px; font-weight: 900; margin: 0 0 18px; text-transform: uppercase; }
.land-offer {
	display: flex; align-items: center; gap: 14px;
	background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .25);
	border-radius: 12px; padding: 14px 16px; margin-bottom: 12px;
}
.land-offer__icon { font-size: 24px; flex: 0 0 36px; }
.land-offer div { font-size: 15px; }
.land-offer strong { display: block; margin-top: 4px; color: #ffe5a8; font-size: 18px; font-weight: 900; }

/* ============================================================================
 * Why-choose pills (numbered)
 * ============================================================================ */
.land-pill {
	background: #fff; border: 1px solid var(--land-border); border-radius: var(--land-radius);
	padding: 26px 22px; position: relative; padding-top: 46px;
}
.land-pill__num {
	position: absolute; top: -22px; left: 22px;
	width: 44px; height: 44px; border-radius: 50%;
	background: var(--land-red); color: #fff; font-weight: 900; font-size: 20px;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 10px 24px rgba(224, 43, 43, .35);
}
.land-pill h3 { color: var(--land-blue); font-size: 17px; font-weight: 800; margin: 0 0 10px; }
.land-pill p { color: var(--land-muted); font-size: 14px; line-height: 1.55; margin: 0; }

/* ============================================================================
 * Stats band (mid page)
 * ============================================================================ */
.land-stats-band {
	background: linear-gradient(135deg, var(--land-blue) 0%, var(--land-blue-soft) 100%);
	color: #fff; padding: 50px 0;
}
.land-stats-band__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center; }
.land-stat-big__value { font-size: clamp(32px, 4.4vw, 52px); font-weight: 900; color: #fff; }
.land-stat-big__label { font-size: 14px; opacity: .9; letter-spacing: .5px; text-transform: uppercase; }

/* ============================================================================
 * Testimonial intro
 * ============================================================================ */
.land-testimonial-intro { text-align: center; }
.land-testimonial-intro__small { font-size: 13px; letter-spacing: 3px; text-transform: uppercase; color: var(--land-red); margin: 0 0 8px; font-weight: 700; }
.land-testimonial-intro__text { max-width: 760px; margin: 0 auto; color: var(--land-muted); line-height: 1.7; font-size: 15px; }

/* ============================================================================
 * Testimonials (quote cards)
 * ============================================================================ */
.land-quote {
	background: #fff; border-radius: var(--land-radius); padding: 26px 24px;
	border: 1px solid var(--land-border); box-shadow: var(--land-shadow);
	margin: 0; position: relative;
}
.land-quote::before {
	content: '"'; position: absolute; top: -8px; left: 22px;
	font-size: 80px; color: var(--land-red); line-height: 1; font-family: Georgia, serif; opacity: .25;
}
.land-quote blockquote { margin: 0 0 16px; font-size: 15px; line-height: 1.65; color: var(--land-text); font-style: italic; }
.land-quote figcaption { padding-top: 12px; border-top: 1px solid var(--land-border); }
.land-quote figcaption strong { display: block; color: var(--land-blue); font-size: 15px; }
.land-quote figcaption span { color: var(--land-muted); font-size: 13px; }

/* ============================================================================
 * Gallery
 * ============================================================================ */
.land-gallery__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.land-gallery__cell { aspect-ratio: 4 / 3; overflow: hidden; border-radius: 12px; box-shadow: var(--land-shadow); }
.land-gallery__cell img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.land-gallery__cell:hover img { transform: scale(1.06); }

/* ============================================================================
 * Partners
 * ============================================================================ */
.land-partners__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.land-partner {
	background: #fff; border: 1px solid var(--land-border); border-radius: 12px;
	padding: 22px 14px; text-align: center; color: var(--land-blue);
	font-weight: 700; font-size: 14px; min-height: 70px;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 6px 18px rgba(15, 31, 60, .04);
}

/* ============================================================================
 * Newsletter
 * ============================================================================ */
.land-newsletter { background: var(--land-blue); color: #fff; padding: 48px 0; }
.land-newsletter__inner { display: grid; grid-template-columns: 1.2fr .8fr; gap: 28px; align-items: center; }
.land-newsletter h3 { margin: 0 0 6px; font-size: 22px; font-weight: 800; color: #fff; }
.land-newsletter p { margin: 0; opacity: .9; font-size: 14px; color: #fff; }
.land-newsletter__form { display: flex; gap: 10px; }
.land-newsletter__form input {
	flex-grow: 1; padding: 14px 16px; border-radius: 999px; border: 0;
	font: inherit; font-size: 15px; color: var(--land-text);
}

/* ============================================================================
 * FAQ — using native <details>
 * ============================================================================ */
.land-faq__list { max-width: 880px; margin: 0 auto; display: grid; gap: 12px; }
.land-faq__item {
	background: #fff; border: 1px solid var(--land-border); border-radius: 12px;
	padding: 16px 22px;
}
.land-faq__item summary {
	font-weight: 700; color: var(--land-blue); cursor: pointer; list-style: none;
	font-size: 15px; padding-right: 28px; position: relative;
}
.land-faq__item summary::-webkit-details-marker { display: none; }
.land-faq__item summary::after {
	content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
	color: var(--land-red); font-weight: 900; font-size: 22px; transition: transform .2s ease;
}
.land-faq__item[open] summary::after { content: '−'; }
.land-faq__item p { margin: 12px 0 0; color: var(--land-muted); line-height: 1.65; font-size: 14px; }

/* ============================================================================
 * News
 * ============================================================================ */
.land-news-card {
	background: #fff; border-radius: var(--land-radius); overflow: hidden;
	border: 1px solid var(--land-border); box-shadow: var(--land-shadow);
	transition: transform .25s ease;
}
.land-news-card:hover { transform: translateY(-4px); }
.land-news-card__media { aspect-ratio: 16 / 9; overflow: hidden; }
.land-news-card__media img { width: 100%; height: 100%; object-fit: cover; }
.land-news-card__body { padding: 18px 20px; }
.land-news-card__body time { font-size: 12px; color: var(--land-red); font-weight: 700; letter-spacing: .8px; }
.land-news-card__body h3 { font-size: 16px; font-weight: 800; color: var(--land-blue); margin: 6px 0 0; line-height: 1.4; }

/* ============================================================================
 * Responsive
 * ============================================================================ */
@media (max-width: 1100px) {
	.land-grid--4 { grid-template-columns: repeat(2, 1fr); }
	.land-partners__grid { grid-template-columns: repeat(3, 1fr); }
	.land-hero__stats-row { grid-template-columns: repeat(2, 1fr); }
	.land-stats-band__inner { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 820px) {
	.land-section { padding: 48px 0; }
	.land-heading { margin-bottom: 24px; }
	.land-hero__inner { grid-template-columns: 1fr; padding: 56px 20px 36px; text-align: center; }
	.land-hero__visual { order: -1; max-width: 320px; margin: 0 auto; }
	.land-hero__bullets { grid-template-columns: 1fr; text-align: left; }
	.land-grid--3 { grid-template-columns: 1fr; }
	.land-grid--2 { grid-template-columns: 1fr; }
	.land-benefit-list { grid-template-columns: 1fr; }
	.land-cta__inner { grid-template-columns: 1fr; }
	.land-gallery__grid { grid-template-columns: repeat(2, 1fr); }
	.land-newsletter__inner { grid-template-columns: 1fr; }
	.land-newsletter__form { flex-direction: column; }
}

@media (max-width: 520px) {
	.land-grid--4 { grid-template-columns: 1fr; }
	.land-partners__grid { grid-template-columns: repeat(2, 1fr); }
	.land-hero__stats-row { grid-template-columns: 1fr; }
	.land-stats-band__inner { grid-template-columns: 1fr; }
	.land-gallery__grid { grid-template-columns: 1fr; }
	.land-cta__countdown { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================================
 * Detail program pages (han-* classes used inside post_content via shortcode-free HTML)
 * ============================================================================ */
.han-container { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.han-hero {
	background: linear-gradient(135deg, #07193a 0%, #0c2e5c 60%, #1a4380 100%);
	color: #fff; padding: 64px 0; text-align: center;
}
.han-hero__eyebrow { text-transform: uppercase; letter-spacing: 3px; font-size: 13px; opacity: .85; margin: 0 0 12px; }
.han-hero__title { font-size: clamp(28px, 4vw, 44px); font-weight: 900; line-height: 1.15; margin: 0 0 18px; color: #fff; }
.han-hero .han-lead { font-size: 16px; line-height: 1.65; max-width: 800px; margin: 0 auto 24px; opacity: .92; }
.han-btn { display: inline-flex; align-items: center; justify-content: center; padding: 13px 30px; font-weight: 700; border-radius: 999px; text-decoration: none; cursor: pointer; border: 0; }
.han-btn--red { background: #c11e2d !important; color: #fff !important; }
.han-btn--red:hover { background: #9a1923 !important; transform: translateY(-1px); }

.han-section { padding: 56px 0; background: #fff; }
.han-section--soft { background: #f5f7fb; }
.han-h2 { font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; color: #0c2e5c; text-align: center; margin: 0 0 32px; text-transform: uppercase; letter-spacing: .3px; }
.han-note { text-align: center; color: #5b6471; font-size: 13px; font-style: italic; margin-top: 18px; }

.han-grid { display: grid; gap: 22px; }
.han-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.han-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.han-card { background: #fff; border: 1px solid #e3e7ee; border-radius: 14px; padding: 26px 22px; box-shadow: 0 12px 32px rgba(15, 31, 60, .06); }
.han-card h3 { color: #0c2e5c; font-size: 18px; font-weight: 800; margin: 0 0 14px; }
.han-card--gold { border-top: 5px solid #d6a51c; }
.han-card--silver { border-top: 5px solid #8c9ab2; }
.han-card--bronze { border-top: 5px solid #b87333; }
.han-price { font-size: 26px; font-weight: 900; color: #c11e2d; margin: 0 0 14px; line-height: 1.1; }
.han-price span { display: block; font-size: 13px; font-weight: 600; color: #5b6471; margin-top: 4px; }

.han-bullets { list-style: none; padding: 0; margin: 0; }
.han-bullets li { position: relative; padding: 6px 0 6px 26px; font-size: 14.5px; line-height: 1.6; color: #1f2937; }
.han-bullets li::before { content: '✓'; position: absolute; left: 0; top: 6px; color: #c11e2d; font-weight: 900; }

.han-steps { padding-left: 22px; margin: 0; }
.han-steps li { padding: 10px 0; line-height: 1.65; font-size: 15px; color: #1f2937; }
.han-steps li strong { color: #0c2e5c; }

.han-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 20px rgba(15, 31, 60, .06); }
.han-table th, .han-table td { padding: 14px 18px !important; text-align: left; border-bottom: 1px solid #e3e7ee; font-size: 14.5px; vertical-align: middle; }
.han-table th:first-child, .han-table td:first-child { padding-left: 22px !important; }
.han-table th:last-child, .han-table td:last-child { padding-right: 22px !important; }
.han-table thead th { background: #0c2e5c; color: #fff; font-weight: 700; }
.han-table tbody tr:last-child td { border-bottom: 0; }

.han-cta-band { background: #c11e2d; color: #fff; padding: 46px 0; }
.han-cta-band__inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 24px; }
.han-cta-band h3 { margin: 0 0 6px; color: #fff; font-weight: 800; font-size: 22px; }
.han-cta-band p { margin: 0; opacity: .95; }
.han-cta-band .han-btn--red { background: #fff !important; color: #c11e2d !important; }
.han-cta-band .han-btn--red:hover { background: #0c2e5c !important; color: #fff !important; }

@media (max-width: 820px) {
	.han-grid--2, .han-grid--3 { grid-template-columns: 1fr; }
	.han-cta-band__inner { grid-template-columns: 1fr; text-align: center; }
	.han-section, .han-hero { padding: 40px 0; }
}

/* ============================================================================
 * About page — mirrors edugo /gioi-thieu/ layout, adapted for Hanna.
 * ============================================================================ */

/* Hero banner with brand illustration */
.about-hero {
	position: relative;
	overflow: hidden;
	color: #fff;
	background:
		linear-gradient(120deg, rgba(7, 25, 58, .85) 0%, rgba(12, 46, 92, .82) 55%, rgba(193, 30, 45, .75) 100%);
	padding: 100px 0 88px;
}
.about-hero::before {
	content: ''; position: absolute; inset: 0;
	background:
		radial-gradient(ellipse at top right, rgba(255, 255, 255, .12), transparent 55%),
		radial-gradient(ellipse at bottom left, rgba(193, 30, 45, .25), transparent 60%);
	pointer-events: none;
}
.about-hero__inner { position: relative; display: grid; grid-template-columns: 1fr; gap: 24px; text-align: center; max-width: 980px; margin: 0 auto; }
.about-hero__sub { text-transform: uppercase; letter-spacing: 4px; font-size: 13px; opacity: .9; margin: 0; }
.about-hero__title { font-size: clamp(32px, 5vw, 56px); font-weight: 900; line-height: 1.1; margin: 14px 0 18px; color: #fff; }
.about-hero__title em { font-style: normal; color: #ffc54a; }
.about-hero__lead { font-size: 16px; line-height: 1.65; opacity: .92; max-width: 720px; margin: 0 auto 22px; }
.about-hero__cta { display: inline-flex; gap: 12px; justify-content: center; }

/* Intro split (text + media placeholder) */
.about-split { display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
.about-split__media {
	border-radius: 16px;
	aspect-ratio: 16 / 10;
	background: linear-gradient(135deg, #0c2e5c, #c11e2d);
	display: flex; align-items: center; justify-content: center;
	color: #fff; font-weight: 800; font-size: 18px; text-align: center; padding: 20px;
	box-shadow: 0 28px 60px rgba(15, 31, 60, .18);
}
.about-split__media .about-split__placeholder { opacity: .8; font-size: 14px; letter-spacing: 1px; }
.about-split h2 { color: #0c2e5c; font-size: clamp(22px, 2.6vw, 30px); font-weight: 800; text-transform: uppercase; margin: 0 0 18px; line-height: 1.2; }
.about-split p { font-size: 15.5px; line-height: 1.75; color: #1f2937; margin: 0 0 14px; }

/* Vision/Mission/Core values — 3 cards with vertical accent */
.about-vmc { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.about-vmc__card {
	background: #fff; border-radius: 14px; padding: 28px 24px;
	box-shadow: 0 12px 30px rgba(15, 31, 60, .06);
	border-top: 5px solid #c11e2d;
}
.about-vmc__card:nth-child(2) { border-top-color: #0c2e5c; }
.about-vmc__card:nth-child(3) { border-top-color: #d6a51c; }
.about-vmc__card h3 { color: #c11e2d; font-size: 17px; font-weight: 800; margin: 0 0 14px; text-transform: uppercase; letter-spacing: .3px; }
.about-vmc__card:nth-child(2) h3 { color: #0c2e5c; }
.about-vmc__card:nth-child(3) h3 { color: #d6a51c; }
.about-vmc__card ul { margin: 0; padding: 0; list-style: none; }
.about-vmc__card li { position: relative; padding: 6px 0 6px 26px; font-size: 14.5px; line-height: 1.65; color: #1f2937; }
.about-vmc__card li::before { content: '✓'; position: absolute; left: 0; top: 6px; color: inherit; font-weight: 900; }
.about-vmc__card:nth-child(1) li::before { color: #c11e2d; }
.about-vmc__card:nth-child(2) li::before { color: #0c2e5c; }
.about-vmc__card:nth-child(3) li::before { color: #d6a51c; }

/* Timeline of milestones */
.about-timeline { position: relative; max-width: 880px; margin: 0 auto; padding: 16px 0 0 0; }
.about-timeline::before { content: ''; position: absolute; top: 0; bottom: 0; left: 130px; width: 2px; background: linear-gradient(#c11e2d, #0c2e5c); }
.about-mile { display: grid; grid-template-columns: 130px 32px 1fr; align-items: start; gap: 18px; padding: 10px 0 22px; }
.about-mile__year { font-weight: 900; font-size: 22px; color: #c11e2d; text-align: right; padding-top: 6px; padding-right: 20px; }
.about-mile__dot { width: 18px; height: 18px; border-radius: 50%; background: #c11e2d; box-shadow: 0 0 0 4px #fff, 0 0 0 6px rgba(193, 30, 45, .25); margin: 12px auto; }
.about-mile__body h3 { color: #0c2e5c; font-size: 17px; font-weight: 800; margin: 0 0 6px; }
.about-mile__body p { margin: 0; font-size: 14.5px; line-height: 1.65; color: #1f2937; }

/* Stat strip */
.about-stats-strip {
	background: linear-gradient(135deg, #07193a 0%, #0c2e5c 100%);
	color: #fff; padding: 56px 0;
}
.about-stats-strip__inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; text-align: center; }
.about-stat__num { font-size: clamp(34px, 4vw, 50px); font-weight: 900; color: #ffc54a; line-height: 1; }
.about-stat__label { margin-top: 8px; font-size: 14px; text-transform: uppercase; letter-spacing: 1px; opacity: .92; }

/* Partner logos placeholder grid */
.about-partners { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.about-partner {
	background: #fff; border: 1px solid #e3e7ee; border-radius: 12px; min-height: 80px;
	display: flex; align-items: center; justify-content: center; text-align: center;
	color: #0c2e5c; font-weight: 700; font-size: 13px; padding: 12px;
	box-shadow: 0 6px 18px rgba(15, 31, 60, .04);
}

/* Award cards */
.about-awards { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.about-award {
	background: #fff; border-radius: 14px; padding: 22px 24px;
	border-left: 5px solid #d6a51c;
	box-shadow: 0 12px 30px rgba(15, 31, 60, .06);
}
.about-award__date { color: #c11e2d; font-weight: 800; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; }
.about-award h3 { color: #0c2e5c; font-weight: 800; font-size: 17px; margin: 6px 0 8px; }
.about-award p { color: #1f2937; font-size: 14.5px; line-height: 1.65; margin: 0; }

/* Office system — large cards with header band */
.about-offices { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.about-office {
	background: #fff; border-radius: 14px; overflow: hidden;
	box-shadow: 0 14px 36px rgba(15, 31, 60, .08); border: 1px solid #e3e7ee;
}
.about-office__head { background: #0c2e5c; color: #fff; padding: 16px 20px; font-weight: 800; font-size: 16px; letter-spacing: .3px; }
.about-office__body { padding: 18px 22px 22px; }
.about-office__body p { margin: 0 0 8px; font-size: 14.5px; line-height: 1.65; color: #1f2937; }
.about-office__body p strong { color: #c11e2d; }
.about-office__hours { margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e3e7ee; color: #5b6471; font-size: 13px; }

/* ============================================================================
 * Schedule table (matches edugo /lich-khai-giang-tieng-duc/ — dark navy theme)
 * ============================================================================ */
.site-schedule-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.site-schedule-title {
	text-align: center;
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 800;
	color: #0c2e5c;
	text-transform: uppercase;
	letter-spacing: .3px;
	margin: 0 0 28px;
}
table.site-schedule {
	width: 100%;
	border-collapse: collapse;
	background: #0c2e5c;
	color: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 14px 36px rgba(15, 31, 60, .18);
	font-size: 14px;
}
table.site-schedule thead th {
	background: #07193a;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	padding: 14px 12px;
	text-align: left;
	font-size: 13px;
	border-bottom: 2px solid #1a4380;
}
table.site-schedule tbody td {
	padding: 14px 12px;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
	color: #fff;
	vertical-align: middle;
}
table.site-schedule tbody tr:nth-child(odd)  td { background: #122a4f; }
table.site-schedule tbody tr:nth-child(even) td { background: #0c2e5c; }
table.site-schedule tbody tr:hover td { background: #1a4380; }
table.site-schedule tbody td a:not(.site-schedule__btn) {
	color: #fff;
	text-decoration: none;
	transition: color .2s ease;
}
table.site-schedule tbody td a:not(.site-schedule__btn):hover { color: #ffc54a; }
table.site-schedule tbody td.site-schedule__noidung a { display: inline-block; }

/* Register pill button — dark navy with white text */
.site-schedule__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 80px;
	padding: 6px 18px;
	border-radius: 999px;
	background: #07193a;
	color: #fff !important;
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none;
	border: 1px solid #1a4380;
	transition: background .2s ease, transform .2s ease;
	white-space: nowrap;
	cursor: pointer;
}
.site-schedule__btn:hover {
	background: #c11e2d;
	border-color: #c11e2d;
	transform: translateY(-1px);
}

/* Column widths matching edugo (Ngày 10% / Giờ 10% / VP 12% / QG 10% / Nội dung 48% / ĐK 10%) */
table.site-schedule col.col-ngay { width: 10%; }
table.site-schedule col.col-gio { width: 8%; }
table.site-schedule col.col-vp { width: 12%; }
table.site-schedule col.col-qg { width: 10%; }
table.site-schedule col.col-nd { width: 50%; }
table.site-schedule col.col-dk { width: 10%; }

/* Pagination */
.site-schedule-pag {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin-top: 22px;
	flex-wrap: wrap;
}
.site-schedule-pag button {
	min-width: 36px;
	height: 36px;
	padding: 0 12px;
	border: 1px solid #d3d8e0;
	border-radius: 6px;
	background: #fff;
	color: #0c2e5c;
	font-weight: 700;
	font-size: 13px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.site-schedule-pag button:hover { background: #f5f7fb; }
.site-schedule-pag button.is-active {
	background: #c11e2d;
	color: #fff;
	border-color: #c11e2d;
}
.site-schedule-pag button:disabled {
	opacity: .4;
	cursor: not-allowed;
}

/* Responsive: hide low-priority columns on mobile, stack content */
@media (max-width: 820px) {
	table.site-schedule thead th:nth-child(2),
	table.site-schedule tbody td:nth-child(2),
	table.site-schedule thead th:nth-child(4),
	table.site-schedule tbody td:nth-child(4) { display: none; }
	table.site-schedule { font-size: 13px; }
	table.site-schedule thead th, table.site-schedule tbody td { padding: 10px 8px; }
	.site-schedule__btn { min-width: 60px; padding: 5px 12px; font-size: 11.5px; }
}

/* ============================================================================
 * News grid — used by [han_news_grid] shortcode on /tin-tuc-du-hoc-han/ etc.
 * ============================================================================ */
.han-news-grid { display: grid; gap: 24px; }
.han-news-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.han-news-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.han-news-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.han-news-item {
	background: #fff;
	border: 1px solid #e3e7ee;
	border-radius: 14px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: 0 8px 20px rgba(15, 31, 60, .06);
	transition: transform .25s ease, box-shadow .25s ease;
}
.han-news-item:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgba(15, 31, 60, .12); }

.han-news-item__media {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #f5f7fb;
	line-height: 0;
}
.han-news-item__media img,
.han-news-item__media svg {
	width: 100%; height: 100%; object-fit: cover; display: block;
	transition: transform .4s ease;
}
.han-news-item:hover .han-news-item__media img,
.han-news-item:hover .han-news-item__media svg { transform: scale(1.04); }

.han-news-item__body { padding: 18px 22px 22px; display: flex; flex-direction: column; flex-grow: 1; }
.han-news-item__cat {
	align-self: flex-start;
	background: rgba(193, 30, 45, .1);
	color: #c11e2d;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .8px;
	text-transform: uppercase;
	text-decoration: none;
	padding: 4px 10px;
	border-radius: 999px;
	margin-bottom: 10px;
}
.han-news-item__cat:hover { background: rgba(193, 30, 45, .2); }
.han-news-item__title { margin: 0 0 8px; font-size: 17px; font-weight: 800; line-height: 1.4; }
.han-news-item__title a { color: #0c2e5c; text-decoration: none; }
.han-news-item__title a:hover { color: #c11e2d; }
.han-news-item__date { font-size: 12.5px; color: #5b6471; font-weight: 600; margin-bottom: 10px; display: block; }
.han-news-item__excerpt { margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: #1f2937; flex-grow: 1; }
.han-news-item__more { color: #c11e2d; font-weight: 700; font-size: 13.5px; text-decoration: none; align-self: flex-start; }
.han-news-item__more:hover { color: #9a1923; }

.han-news-pag {
	display: flex; justify-content: center; gap: 6px;
	margin-top: 28px; flex-wrap: wrap;
}
.han-news-pag a {
	min-width: 38px; height: 38px; padding: 0 14px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid #d3d8e0; border-radius: 8px;
	color: #0c2e5c; font-weight: 700; font-size: 13.5px;
	text-decoration: none;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.han-news-pag a:hover { background: #f5f7fb; }
.han-news-pag a.is-active { background: #c11e2d; color: #fff; border-color: #c11e2d; }

.han-news-empty { text-align: center; padding: 40px 20px; color: #5b6471; font-size: 15px; }

@media (max-width: 1024px) {
	.han-news-grid--3, .han-news-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.han-news-grid--2, .han-news-grid--3, .han-news-grid--4 { grid-template-columns: 1fr; }
}

/* Branch chips for "phủ sóng các tỉnh" */
.about-branches { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-width: 880px; margin: 18px auto 0; }
.about-branch { background: #fff; color: #0c2e5c; border: 1px solid #c11e2d; border-radius: 999px; padding: 6px 16px; font-size: 13px; font-weight: 700; }

@media (max-width: 1024px) {
	.about-partners { grid-template-columns: repeat(3, 1fr); }
	.about-offices { grid-template-columns: 1fr; }
	.about-awards { grid-template-columns: 1fr; }
	.about-stats-strip__inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 820px) {
	.about-split { grid-template-columns: 1fr; }
	.about-vmc { grid-template-columns: 1fr; }
	.about-timeline::before { left: 90px; }
	.about-mile { grid-template-columns: 90px 28px 1fr; gap: 12px; }
	.about-mile__year { font-size: 18px; }
	.about-partners { grid-template-columns: repeat(2, 1fr); }
	.about-stats-strip__inner { grid-template-columns: 1fr; }
}