/* =====================================================
   SANSAN BOOTH KIT — thư viện section dựng lại theo chicagobooth.edu
   -----------------------------------------------------
   Đo trực tiếp chicagobooth.edu (16-09-2026, viewport 1425px):
   - Lưới nội dung 150→1275px; cột chữ bắt đầu cách lề 225px (20%), rộng 675px.
   - Đường kẻ nhấn 163×3px nằm ở lề trái, ngang dòng đầu heading.
   - Ảnh luôn tỉ lệ 5:4. Heading section 37px, heading card 22px, so le 30px.
   - Chữ dẫn 19.2/33.6px; chữ card 17.8/26.6px.
   Khác Booth có chủ đích: màu maroon/teal/xám → đỏ SanSan và trắng; font
   Trade Gothic Condensed → Inter Tight (font toàn site); không nền đen.

   Cách dùng trong UX Builder: chèn template "SanSan Booth …" rồi chỉ sửa
   chữ, ảnh (Replace image) và link. Class trên Section/Col quyết định
   bố cục, không cần chỉnh CSS.
   ===================================================== */

.sbk {
	--sbk-red: var(--ss-red, #e30514);
	--sbk-red-deep: var(--ss-red-dark, #b00410);
	--sbk-ink: #38383b;
	--sbk-copy: #4a4a4e;
	--sbk-line: #e2e2e4;
	--sbk-offset: 20%;
	--sbk-rule-w: 14.5%;
	font-family: var(--ss-font);
	color: var(--sbk-copy);
}

.sbk h1,
.sbk h2,
.sbk h3,
.sbk h4 {
	margin: 0;
	color: var(--sbk-ink);
	font-family: var(--ss-font);
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
	/* Xuống dòng tự nhiên: balance/pretty cắt heading làm đôi dù dòng đầu còn chỗ. */
	text-wrap: wrap;
}

.sbk p {
	margin: 0;
	font-family: var(--ss-font);
}

.sbk p + p {
	margin-top: 1.1em;
}

/* Đoạn văn và danh sách liền nhau trong cùng khối chữ (thẻ hạng vé, lộ trình ngày, đoạn dẫn có câu hỏi). Đặt sớm để quy tắc riêng của từng khối ghi đè. */
.sbk p + ul,
.sbk p + ol,
.sbk ul + p,
.sbk ol + p {
	margin-top: 1.1em;
}

.sbk .col,
.sbk .col-inner {
	padding-bottom: 0;
}

/* Theme đẩy row sát lề trái; kit căn giữa theo custom_width của row. */
.sbk > .section-content > .row {
	margin-right: auto;
	margin-left: auto;
}

/* Link trong kit: một đường gạch khi hover, không cộng border của theme. */
.sbk a {
	color: inherit;
	text-decoration: none;
	border-bottom: 0;
	box-shadow: none;
	background-image: none;
}

.sbk a:hover,
.sbk a:focus-visible {
	color: var(--sbk-red);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .18em;
}

.sbk a:focus-visible {
	outline: 2px solid var(--sbk-red);
	outline-offset: 3px;
}

.sbk ::selection {
	background: var(--sbk-red);
	color: #fff;
}

/* Mũi tên cuối đoạn mô tả, giống Booth. Thuần trang trí; cả card bấm được. */
.sbk-arrow::after {
	content: "";
	display: inline-block;
	width: .95em;
	height: .7em;
	margin-left: .55em;
	background: var(--sbk-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 14'%3E%3Cpath d='M12.6 1 18.6 7l-6 6M18.3 7H1' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 14'%3E%3Cpath d='M12.6 1 18.6 7l-6 6M18.3 7H1' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .25s cubic-bezier(.16, 1, .3, 1);
}

.sbk-card:hover .sbk-arrow::after,
.sbk-item:hover .sbk-arrow::after {
	transform: translateX(4px);
}

/* Cả khối bấm được qua link ở tiêu đề. */
.sbk-card > .col-inner,
.sbk-item > .col-inner,
.sbk-card,
.sbk-item {
	position: relative;
}

.sbk-card h3 a::before,
.sbk-item h3 a::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Ảnh 5:4 phủ kín khung, không méo, không chữ đè. */
.sbk .img,
.sbk .img-inner {
	margin: 0;
}

.sbk .img-inner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Cột chữ lệch 20% + đường kẻ nhấn ---------- */

.sbk-copy-col > .col-inner {
	position: relative;
	padding-left: var(--sbk-offset);
}

/* Heading được chạy dài tới 920px; đoạn văn giữ độ dài dòng dễ đọc. */
.sbk-copy-col > .col-inner > *,
.sbk-copy-col .text {
	max-width: 920px;
}

.sbk-copy-col .text p,
.sbk-copy-col .accordion {
	max-width: 720px;
}

.sbk-copy-col .text .sbk-statement {
	max-width: 860px;
}

/* Đường kẻ nằm giữa dòng đầu của heading: top = nửa line-height của heading. */
.sbk {
	--sbk-title-size: clamp(30px, 2.6vw, 38px);
	--sbk-rule-top: calc(var(--sbk-title-size) * .6 - 1.5px);
}

.sbk-rule > .col-inner::before {
	content: "";
	position: absolute;
	top: var(--sbk-rule-top);
	left: 0;
	width: var(--sbk-rule-w);
	height: 3px;
	background: var(--sbk-red);
}

.sbk-rule:has(.sbk-statement) {
	--sbk-rule-top: calc(clamp(22px, 2.1vw, 30px) * .66 - 1.5px);
}

.sbk-rule--light > .col-inner::before {
	background: #fff;
}

.sbk-title {
	font-size: var(--sbk-title-size);
	line-height: 1.2;
}

/* Hàng tiêu đề đứng trên lưới/card trong cùng một section. */
.sbk-head {
	margin-bottom: clamp(28px, 3.2vw, 44px);
}

.sbk-hero .sbk-copy-col > .col-inner {
	padding-bottom: clamp(36px, 4vw, 56px);
}

.sbk-title + p,
.sbk-title + .sbk-lead {
	margin-top: 22px;
}

.sbk-lead {
	font-size: clamp(17px, 1.35vw, 19.5px);
	line-height: 1.75;
	font-weight: 400;
}

.sbk-statement {
	color: var(--sbk-ink);
	font-size: clamp(22px, 2.1vw, 30px);
	line-height: 1.32;
	font-weight: 500;
}

.sbk-statement + .sbk-lead {
	margin-top: 36px;
}

/* ---------- 01 Dải ảnh tràn, tiêu đề góc dưới ---------- */

.sbk-hero {
	display: flex;
	align-items: flex-end;
}

.sbk-hero .section-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	/* Lớp phủ đen để chữ trắng đọc rõ trên mọi ảnh. */
	background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, .5) 45%, rgba(0, 0, 0, .82) 100%);
	pointer-events: none;
}

.sbk-hero .section-content {
	width: 100%;
}

.sbk-hero {
	--sbk-title-size: clamp(34px, 3.4vw, 48px);
	--sbk-rule-top: calc(var(--sbk-title-size) * .59 - 1.5px);
}

.sbk-hero h2,
.sbk-hero h1 {
	color: #fff;
	font-size: var(--sbk-title-size);
	line-height: 1.18;
}

.sbk-hero p {
	margin-top: 10px;
	color: #fff;
	font-size: clamp(19px, 2.1vw, 30px);
	line-height: 1.22;
	font-weight: 400;
}

.sbk-hero .sbk-hero-link {
	margin-top: 20px;
	font-size: clamp(16px, 1.3vw, 19px);
	font-weight: 650;
}

.sbk-hero .sbk-hero-link a,
.sbk-hero .sbk-hero-link a:hover {
	color: #fff;
}

.sbk-hero .sbk-hero-link .sbk-arrow::after,
.sbk-hero .sbk-arrow::after {
	background: #fff;
}

/* ---------- 02 Ảnh–chữ so le ---------- */

.sbk-zigzag .row + .row {
	margin-top: clamp(40px, 5vw, 70px);
}

.sbk-zigzag h3 {
	font-size: clamp(24px, 2.1vw, 30px);
	line-height: 1.2;
}

.sbk-zigzag p {
	margin-top: 12px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

/* ---------- 03 Lưới 2 cột: ảnh nhỏ trái + chữ ---------- */

.sbk-list2 .sbk-item {
	margin-bottom: clamp(32px, 4vw, 60px);
}

.sbk-list2 .sbk-item .row-inner,
.sbk-list2 .sbk-item .row {
	flex-wrap: nowrap;
}

.sbk-stack h3 {
	font-size: clamp(21px, 1.9vw, 27px);
	line-height: 1.22;
}

.sbk-list2 h3 {
	font-size: clamp(20px, 1.7vw, 25px);
	line-height: 1.22;
}

.sbk-list2 p,
.sbk-stack p {
	margin-top: 10px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

/* ---------- 04 Danh sách dọc ảnh nhỏ trái, lệch theo cột chữ ---------- */

.sbk-stack .sbk-stack-list > .col-inner {
	padding-left: var(--sbk-offset);
}

.sbk-stack .sbk-item + .sbk-item {
	margin-top: clamp(28px, 3.4vw, 48px);
}

/* ---------- 05/06 Card 3 và 4 cột ---------- */

.sbk-cards h3 {
	margin-top: 22px;
	font-size: clamp(20px, 1.6vw, 22.5px);
	line-height: 1.2;
}

.sbk-cards--4 h3 {
	margin-top: 18px;
	font-size: clamp(18px, 1.4vw, 20px);
}

.sbk-cards p {
	margin-top: 10px;
	font-size: clamp(15.5px, 1.2vw, 17.8px);
	line-height: 1.5;
}

.sbk-cards .sbk-card {
	margin-bottom: 36px;
}

/* ---------- 07 Chia đôi: chữ + ảnh ---------- */

.sbk-split h3 {
	font-size: clamp(24px, 2.1vw, 30px);
	line-height: 1.2;
}

.sbk-split p {
	margin-top: 12px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

.sbk-split .sbk-title + p,
.sbk-split .sbk-title + .sbk-split-name {
	margin-top: 22px;
}

.sbk-split .sbk-split-name {
	font-size: clamp(21px, 1.8vw, 26px);
	line-height: 1.25;
}

.sbk-split p strong {
	color: var(--sbk-ink);
}

/* ---------- 08 Số liệu lớn ---------- */

.sbk-stats .sbk-stat {
	text-align: center;
}

.sbk-stats .sbk-stat strong {
	display: block;
	color: var(--sbk-red);
	font-size: clamp(54px, 6.2vw, 89px);
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -.02em;
	font-variant-numeric: tabular-nums;
}

.sbk-stats .sbk-stat p > span {
	display: block;
	margin-top: 4px;
	font-size: clamp(15.5px, 1.2vw, 17.8px);
	line-height: 1.5;
}

/* ---------- 09 Dải đỏ kêu gọi ---------- */

.sbk-band {
	color: #fff;
}

.sbk-band h2,
.sbk-band h3,
.sbk-band p {
	color: #fff;
}

.sbk-band {
	--sbk-title-size: clamp(28px, 2.2vw, 32px);
}

.sbk-band .button,
.sbk .sbk-btn {
	margin: 34px 0 0;
	padding: 10px 40px;
	border: 2.4px solid currentColor;
	border-radius: 0;
	background: transparent !important;
	color: #fff;
	font-family: var(--ss-font);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.9;
	letter-spacing: .02em;
	text-transform: uppercase;
	box-shadow: none;
}

.sbk-band .button:hover,
.sbk-band .button:focus-visible {
	background: #fff !important;
	color: var(--sbk-red);
	text-decoration: none;
}

.sbk:not(.sbk-band) .sbk-btn {
	color: var(--sbk-red);
}

.sbk:not(.sbk-band) .sbk-btn:hover,
.sbk:not(.sbk-band) .sbk-btn:focus-visible {
	background: var(--sbk-red) !important;
	color: #fff;
	text-decoration: none;
}

/* ---------- 10 Lưới biểu tượng liên kết ---------- */

.sbk-icons .sbk-icon-link {
	display: flex;
	align-items: center;
	gap: clamp(18px, 2.4vw, 36px);
	margin-bottom: clamp(36px, 4.4vw, 64px);
	color: var(--sbk-ink);
	font-size: clamp(18px, 1.6vw, 22px);
	line-height: 1.3;
	font-weight: 650;
}

.sbk-icons .sbk-icon-link svg {
	flex: 0 0 auto;
	width: clamp(56px, 6vw, 86px);
	height: clamp(56px, 6vw, 86px);
	color: var(--sbk-red);
}

/* ---------- 11 Hỏi đáp ---------- */

.sbk-faq .accordion {
	border-top: 1px solid var(--sbk-line);
}

.sbk-faq .accordion-item {
	border-bottom: 1px solid var(--sbk-line);
}

.sbk-faq .accordion-title {
	padding: 22px 48px 22px 0;
	border: 0;
	color: var(--sbk-ink);
	font-size: clamp(17px, 1.4vw, 20px);
	line-height: 1.4;
	font-weight: 650;
}

.sbk-faq .accordion-title.active {
	color: var(--sbk-red);
	background: transparent;
}

.sbk-faq .accordion-title .toggle {
	right: 0;
	left: auto;
	color: var(--sbk-red);
}

.sbk-faq .accordion-inner {
	padding: 0 0 26px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

/* ---------- 12 Bảng so sánh ---------- */

.sbk-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: clamp(15px, 1.2vw, 17px);
	line-height: 1.55;
}

.sbk-table th,
.sbk-table td {
	color: var(--sbk-copy);
	font-size: inherit;
	letter-spacing: normal;
	text-transform: none;
	padding: 16px 18px 16px 0;
	border-bottom: 1px solid var(--sbk-line);
	vertical-align: top;
	text-align: left;
}

.sbk-table thead th {
	border-bottom: 3px solid var(--sbk-red);
	color: var(--sbk-ink);
	font-weight: 700;
}

.sbk-table tbody th {
	color: var(--sbk-ink);
	font-weight: 700;
}

/* ---------- 16 Lịch khai giảng ---------- */

.sbk-schedule table {
	width: 100%;
	border-collapse: collapse;
	font-size: clamp(15px, 1.15vw, 17px);
	line-height: 1.5;
}

.sbk-schedule th,
.sbk-schedule td {
	padding: 18px 16px 18px 0;
	border-bottom: 1px solid var(--sbk-line);
	color: var(--sbk-copy);
	font-size: inherit;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	vertical-align: middle;
}

.sbk-schedule thead th {
	padding-top: 0;
	border-bottom: 3px solid var(--sbk-red);
	color: var(--sbk-ink);
	font-weight: 700;
}

.sbk-schedule tbody td:first-child {
	color: var(--sbk-ink);
	font-weight: 700;
	white-space: nowrap;
}

.sbk-schedule .sbk-status {
	display: inline-block;
	color: var(--sbk-red);
	font-weight: 700;
}

.sbk-schedule .sbk-status--full {
	color: var(--sbk-copy);
	font-weight: 400;
}

.sbk-schedule td:last-child {
	padding-right: 0;
	text-align: right;
	white-space: nowrap;
}

.sbk-schedule td:last-child a {
	color: var(--sbk-red);
	font-weight: 700;
}

.sbk-schedule .sbk-note {
	margin-top: 18px;
	font-size: 15px;
	line-height: 1.6;
}

/* Dữ liệu giả định trên local: không đổi giao diện, chỉ để tìm và thay. */
.sbk-demo {
	font: inherit;
	color: inherit;
}

/* =====================================================
   MẪU BỔ SUNG — nhân rộng toàn site (rút từ cách Booth chọn layout theo loại trang)
   Nền xám nhạt chỉ dành cho nội dung phục vụ: đối tượng học, thông tin nhanh,
   liên hệ, form. Không nền tối.
   ===================================================== */

.sbk-tint {
	--sbk-tint: #f3f3f4;
}

/* ---------- Hàng link nhảy mục ---------- */

.sbk-jumpbar .sbk-lead + .sbk-jump {
	margin-top: 18px;
}

.sbk-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 36px;
	font-size: clamp(16px, 1.25vw, 18px);
	line-height: 1.5;
	font-weight: 650;
}

.sbk .sbk-jump a {
	color: var(--sbk-ink);
	text-decoration: underline;
	text-decoration-color: var(--sbk-red);
	text-decoration-thickness: 2px;
	text-underline-offset: .32em;
}

.sbk .sbk-jump a:hover,
.sbk .sbk-jump a:focus-visible {
	color: var(--sbk-red);
}

/* ---------- Card chữ không ảnh ---------- */

.sbk-tcard > .col-inner {
	height: 100%;
	padding-top: 22px;
	border-top: 1px solid var(--sbk-line);
}

.sbk-tcards .sbk-tcard {
	margin-bottom: clamp(28px, 3vw, 44px);
}

.sbk-tcard h3 {
	font-size: clamp(19px, 1.55vw, 22px);
	line-height: 1.25;
}

.sbk-tcard p {
	margin-top: 10px;
	font-size: clamp(15.5px, 1.2vw, 17.5px);
	line-height: 1.6;
}

.sbk-tint .sbk-tcard > .col-inner {
	border-top-color: #d9d9dc;
}

/* ---------- Dòng thông tin trên card, card giá trị không link ---------- */

.sbk-cards .sbk-meta {
	margin-top: 8px;
	color: var(--sbk-ink);
	font-size: 15px;
	line-height: 1.5;
	font-weight: 600;
}

.sbk-cards .sbk-meta + .sbk-arrow {
	margin-top: 8px;
}

.sbk-cards--values .sbk-value {
	margin-bottom: 36px;
}

.sbk-cards--values h3 {
	margin-top: 22px;
	font-size: clamp(20px, 1.6vw, 22.5px);
	line-height: 1.2;
}

.sbk-cards--values p {
	margin-top: 10px;
	font-size: clamp(15.5px, 1.2vw, 17.8px);
	line-height: 1.6;
}

/* ---------- Thanh thông tin nhanh ---------- */

.sbk-facts {
	border-bottom: 1px solid #e4e4e7;
}

.sbk-fact > span {
	display: block;
	color: var(--sbk-copy);
	font-size: 14px;
	line-height: 1.4;
	font-weight: 600;
}

.sbk-fact > strong {
	display: block;
	margin-top: 4px;
	color: var(--sbk-ink);
	font-size: clamp(17px, 1.35vw, 20px);
	line-height: 1.35;
	font-weight: 650;
}

.sbk-facts-actions > .col-inner {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.sbk-facts .sbk-btn {
	width: 100%;
	margin: 0;
	padding: 6px 16px;
	font-size: 15px;
	text-align: center;
}

.sbk .sbk-btn.sbk-btn--solid {
	border-color: var(--sbk-red);
	background: var(--sbk-red) !important;
	color: #fff;
}

.sbk .sbk-btn.sbk-btn--solid:hover,
.sbk .sbk-btn.sbk-btn--solid:focus-visible {
	border-color: var(--sbk-red-deep);
	background: var(--sbk-red-deep) !important;
	color: #fff;
}

/* ---------- Dải nền nhạt (đối tượng, tư vấn) ---------- */

.sbk-callout .text ul,
.sbk-intro .text ul,
.sbk-hlist .text ul {
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}

.sbk-intro .text ul {
	max-width: 720px;
	margin-top: 20px;
}

.sbk-callout .text ul li,
.sbk-intro .text ul li {
	position: relative;
	margin: 0;
	padding: 0 0 0 26px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.7;
}

.sbk-callout .text ul li + li,
.sbk-intro .text ul li + li {
	margin-top: 8px;
}

.sbk-callout .text ul li::before,
.sbk-intro .text ul li::before,
.sbk-hlist-items > li::before {
	content: "";
	position: absolute;
	left: 0;
	width: 9px;
	height: 9px;
	background: var(--sbk-red);
}

.sbk-callout .text ul li::before,
.sbk-intro .text ul li::before {
	top: .72em;
}

.sbk-intro .text ul li {
	color: var(--sbk-ink);
	font-weight: 500;
}

.sbk-callout .sbk-title + p,
.sbk-callout .sbk-title + ul {
	margin-top: 22px;
}

.sbk-callout p {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

.sbk-callout p a,
.sbk-hlist p a,
.sbk-sticky p a,
.sbk-form-copy p a,
.sbk-contacts p a,
.sbk-intro p a,
.sbk-split p a {
	color: var(--sbk-ink);
	text-decoration: underline;
	text-decoration-color: var(--sbk-red);
	text-decoration-thickness: 1.5px;
	text-underline-offset: .2em;
}

/* ---------- Giảng viên (thiết kế lại 17-09-2026, theo hồ sơ giảng viên chicagobooth.edu) ---------- */

.sbk-people .sbk-person-name {
	color: var(--sbk-ink);
	font-size: clamp(22px, 1.9vw, 28px);
	line-height: 1.2;
	font-weight: 600;
}

.sbk-people .sbk-role {
	margin-top: 8px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--sbk-line);
	color: var(--sbk-ink);
	font-size: clamp(14.5px, 1.1vw, 16px);
	line-height: 1.5;
	font-weight: 600;
}

.sbk-people .sbk-role + p {
	margin-top: 16px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.7;
}

.sbk-people .sbk-person-link {
	margin-top: 18px;
	font-weight: 700;
}

.sbk-people .sbk-person-link a {
	color: var(--sbk-ink);
}

.sbk-people .sbk-person-photo .img-inner {
	background: #eee;
}

/* Một giảng viên: chân dung lớn + cột chữ rộng. */
.sbk-people--single .sbk-person-name {
	font-size: clamp(26px, 2.4vw, 36px);
}

.sbk-people--single .sbk-person-copy .text {
	max-width: 620px;
}

/* Nhiều giảng viên: thẻ nền nhạt, cao bằng nhau. */
.sbk-people--grid .sbk-person {
	margin-bottom: 24px;
}

.sbk-people--grid .sbk-person > .col-inner {
	height: 100%;
	padding: clamp(16px, 1.6vw, 24px);
	background: #f3f3f4;
}

.sbk-people--grid .row-inner {
	margin: 0;
}

.sbk-people--grid .sbk-person-copy > .col-inner {
	padding-left: clamp(8px, 1.4vw, 20px);
}

.sbk-people--grid .sbk-person-name {
	font-size: clamp(20px, 1.6vw, 24px);
}

/* ---------- Ảnh liền nhau, chú thích đè ---------- */

.sbk-tiles .sbk-tiles-row {
	max-width: none !important;
}

.sbk-tile > .col-inner {
	position: relative;
	overflow: hidden;
}

.sbk-tile .img-inner::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .78) 100%);
	pointer-events: none;
}

.sbk-tile .img-inner img {
	transition: transform .6s cubic-bezier(.16, 1, .3, 1);
}

.sbk-tile.sbk-card:hover .img-inner img {
	transform: scale(1.03);
}

.sbk .sbk-tile-cap {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	padding: 0 clamp(18px, 2vw, 30px) clamp(18px, 2vw, 28px);
}

.sbk-tile-cap h3,
.sbk-tile-cap h3 a,
.sbk-tile-cap p {
	color: #fff;
}

.sbk-tile-cap h3 {
	font-size: clamp(18px, 1.45vw, 21px);
	line-height: 1.25;
}

.sbk-tile-cap p {
	margin-top: 4px;
	font-size: 15px;
	line-height: 1.45;
}

/* ---------- Ảnh học viên liền nhau, rê/chạm phóng to (theo khối mạng xã hội chicagobooth.edu) ---------- */

.sbk-ltiles .sbk-ltiles-row {
	margin-right: auto;
	margin-left: auto;
}

.sbk-ltile {
	position: relative;
	z-index: 1;
}

.sbk-ltile > .col-inner {
	position: relative;
	overflow: hidden;
	transition: transform .4s cubic-bezier(.16, 1, .3, 1), box-shadow .4s cubic-bezier(.16, 1, .3, 1);
}

.sbk-ltile:hover,
.sbk-ltile:focus-within {
	z-index: 3;
}

.sbk-ltile:hover > .col-inner,
.sbk-ltile:focus-within > .col-inner,
.sbk-ltile:active > .col-inner {
	transform: scale(1.07);
	box-shadow: 0 20px 44px rgba(0, 0, 0, .34);
}

/* Flatsome thêm margin-bottom cho ảnh có phần tử theo sau, tạo khe trắng và đẩy chú thích ra khỏi ảnh. */
.sbk-ltiles .sbk-ltile > .col-inner > .img {
	margin-bottom: 0;
}

.sbk-ltile .img-inner img {
	object-position: 50% 22%;
}

/* Điện thoại, 2 cột ~160px: ô vuông không đủ chỗ cho tên + doanh nghiệp. Ô dọc, chú thích gọn, lớp tối đậm hơn
   để chữ trắng đọc được trên ảnh nền sáng. Ô lẻ cuối trải hết hàng thì hạ về tỉ lệ ngang. */
@media (max-width: 549px) {
	.sbk-ltiles .sbk-ltile .img-inner {
		padding-top: 128% !important;
	}

	.sbk-ltiles .sbk-ltile--wide .img-inner {
		padding-top: 62% !important;
	}

	.sbk-ltile .img-inner::after {
		background: linear-gradient(180deg, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, .5) 60%, rgba(0, 0, 0, .84) 100%);
	}

	.sbk .sbk-ltile .sbk-ltile-cap {
		padding: 0 12px 12px;
	}

	.sbk .sbk-ltile-cap h3 {
		font-size: 15px;
	}

	.sbk .sbk-ltile-cap p {
		margin-top: 2px;
		font-size: 13.5px;
		line-height: 1.35;
	}

	.sbk-ltile-fb {
		width: 13px;
		height: 13px;
	}
}

.sbk-ltile .img-inner::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 48%, rgba(0, 0, 0, .72) 100%);
	pointer-events: none;
}

.sbk .sbk-ltile-cap {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	padding: 0 clamp(16px, 1.8vw, 26px) clamp(16px, 1.8vw, 24px);
}

.sbk-ltile-cap h3,
.sbk-ltile-cap h3 a,
.sbk-ltile-cap p {
	color: #fff;
}

.sbk-ltile-cap h3 {
	font-size: clamp(17px, 1.4vw, 20px);
	line-height: 1.25;
}

.sbk .sbk-ltile-cap h3 a:hover,
.sbk .sbk-ltile-cap h3 a:focus-visible {
	color: #fff;
	text-decoration: none;
}

/* Cả ô bấm được khi có link Facebook. */
.sbk-ltile--link .sbk-ltile-cap h3 a::before {
	content: "";
	position: absolute;
	inset: -100vh 0 0 0;
}

.sbk-ltile-cap p {
	margin-top: 4px;
	font-size: clamp(14px, 1.05vw, 15.5px);
	line-height: 1.45;
}

/* Giữ biểu tượng Facebook cùng dòng với chữ cuối, không rơi xuống một mình. */
.sbk-ltile-nw {
	white-space: nowrap;
}

.sbk-ltile-fb {
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-left: 4px;
	vertical-align: -2px;
	fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
	.sbk-ltile > .col-inner {
		transition: none;
	}
}

/* ---------- Album ảnh lớp học: ô ảnh tràn ngang, chỉ tên khóa, dùng hiệu ứng của .sbk-ltile ---------- */

/* Ô ở mép màn hình phóng to sẽ lấn ra ngoài; cắt ngang để không sinh thanh cuộn ngang. */
.sbk-album {
	overflow-x: clip;
}

.sbk-album .sbk-album-tile > .col-inner > .img {
	margin-bottom: 0;
}

.sbk-album .sbk-ltile-cap h3 {
	margin-bottom: 0;
}

/* Điện thoại: ô vuông tràn sát hai mép (bỏ lề 30px của section) để tên khóa dài nhất vẫn nằm trên một dòng ở máy rộng 360px. */
@media (max-width: 549px) {
	/* Phải thắng .sbk > .section-content > .row (margin auto) và .row-full-width (max-width 100% !important). */
	.sbk-album > .section-content > .sbk-album-row {
		width: calc(100% + 60px);
		max-width: none !important;
		margin-right: -30px;
		margin-left: -30px;
	}

	.sbk-album .sbk-album-tile .img-inner {
		padding-top: 100% !important;
	}
}

/* ---------- Các bước / nhóm có nhãn, xếp ngang ---------- */

.sbk-step {
	margin-bottom: clamp(24px, 3vw, 40px);
}

.sbk-step > .col-inner {
	height: 100%;
	padding-top: 20px;
	border-top: 1px solid var(--sbk-line);
}

.sbk-steps--2 .sbk-step > .col-inner {
	padding-right: 4%;
}

.sbk-step h3 {
	color: var(--sbk-ink);
	font-size: clamp(18px, 1.45vw, 21px);
	line-height: 1.3;
}

.sbk-step p,
.sbk-step li {
	font-size: clamp(15.5px, 1.2vw, 17px);
	line-height: 1.65;
}

.sbk-step h3 + p,
.sbk-step h3 + ul {
	margin-top: 10px;
}

.sbk-step ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sbk-step ul li {
	position: relative;
	margin: 0;
	padding-left: 18px;
}

.sbk-step ul li + li {
	margin-top: 8px;
}

.sbk-step ul li::before {
	content: "";
	position: absolute;
	top: .68em;
	left: 0;
	width: 7px;
	height: 7px;
	background: var(--sbk-red);
}

.sbk-contacts .sbk-step p {
	font-size: clamp(16px, 1.25vw, 18px);
}

.sbk-contacts .sbk-step p + p {
	margin-top: 4px;
}

/* ---------- Danh sách có tiêu đề ---------- */

.sbk-hlist-items {
	margin-top: clamp(26px, 3vw, 38px) !important;
}

.sbk-hlist-items > li {
	position: relative;
	margin: 0;
	padding-left: 32px;
}

.sbk-hlist-items > li + li {
	margin-top: 30px;
}

.sbk-hlist-items > li::before {
	top: calc(clamp(19px, 1.5vw, 22px) * .62 - 4.5px);
}

.sbk-hlist-items h3 {
	font-size: clamp(19px, 1.5vw, 22px);
	line-height: 1.25;
}

.sbk-hlist-items p {
	margin-top: 8px;
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.7;
}

/* ---------- Ảnh đứng yên + chữ dài ---------- */

.sbk-sticky-media > .col-inner {
	position: sticky;
	top: 120px;
}

.sbk-sticky-copy .sbk-label {
	margin-top: 34px;
	padding-top: 22px;
	border-top: 1px solid var(--sbk-line);
	font-size: clamp(19px, 1.5vw, 22px);
	line-height: 1.3;
}

.sbk-sticky-copy .sbk-label + p {
	margin-top: 10px;
}

.sbk-sticky-copy p {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

.sbk-sticky-copy .sbk-title + .sbk-lead {
	margin-top: 22px;
}

/* ---------- Form trong trang ---------- */

.sbk-form-copy > .col-inner {
	position: relative;
	padding-top: 30px;
}

.sbk-form-copy.sbk-rule > .col-inner::before {
	top: 0;
	width: 120px;
}

.sbk-form-copy p,
.sbk-form-copy li {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.7;
}

.sbk-form-copy .sbk-title + p,
.sbk-form-copy .sbk-title + ul {
	margin-top: 20px;
}

.sbk-form-copy ul {
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}

.sbk-form-copy ul li {
	position: relative;
	margin: 0;
	padding-left: 22px;
}

.sbk-form-copy ul li + li {
	margin-top: 10px;
}

.sbk-form-copy ul li::before {
	content: "";
	position: absolute;
	top: .7em;
	left: 0;
	width: 8px;
	height: 8px;
	background: var(--sbk-red);
}

/* Form CF7 dùng chung (legacy.css đặt !important bo tròn, bóng đổ): trong kit
   đè lại cho vuông góc, viền mảnh, nút đỏ chữ in hoa như nút Booth. */
.sbk-form .ss-cf7-form label {
	margin: 0 0 16px !important;
	color: var(--sbk-ink) !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	font-weight: 600 !important;
}

.sbk-form .ss-cf7-form input[type="text"],
.sbk-form .ss-cf7-form input[type="tel"],
.sbk-form .ss-cf7-form input[type="email"],
.sbk-form .ss-cf7-form select,
.sbk-form .ss-cf7-form textarea {
	min-height: 48px !important;
	margin-top: 6px !important;
	padding: 0 14px !important;
	border: 1px solid #c9c9ce !important;
	border-radius: 0 !important;
	background: #fff !important;
	box-shadow: none !important;
	color: var(--sbk-ink) !important;
	font-family: var(--ss-font) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
}

.sbk-form .ss-cf7-form textarea {
	min-height: 120px !important;
	padding-top: 12px !important;
}

.sbk-form .ss-cf7-form input:focus,
.sbk-form .ss-cf7-form select:focus,
.sbk-form .ss-cf7-form textarea:focus {
	border-color: var(--sbk-red) !important;
	box-shadow: 0 0 0 1px var(--sbk-red) !important;
}

.sbk-form .ss-cf7-form input::placeholder,
.sbk-form .ss-cf7-form textarea::placeholder {
	color: #6b6b70 !important;
	font-weight: 400 !important;
}

.sbk-form .ss-cf7-submit input[type="submit"] {
	width: auto !important;
	min-height: 52px !important;
	padding: 10px 40px !important;
	border: 2.4px solid var(--sbk-red) !important;
	border-radius: 0 !important;
	background: var(--sbk-red) !important;
	box-shadow: none !important;
	color: #fff !important;
	font-family: var(--ss-font) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	letter-spacing: .02em !important;
	text-transform: uppercase !important;
}

.sbk-form .ss-cf7-submit input[type="submit"]:hover,
.sbk-form .ss-cf7-submit input[type="submit"]:focus-visible {
	border-color: var(--sbk-red-deep) !important;
	background: var(--sbk-red-deep) !important;
	transform: none !important;
}

/* Dòng ghi chú đồng ý liên hệ dưới nút gửi (19-09-2026).
   Không scope theo .sbk-form vì form còn dùng ở khối khác. Cỡ chữ nhỏ và màu
   nhạt để nó đọc ra là ghi chú, không bị nhầm thành một câu nội dung. */
.ss-cf7-form .ss-cf7-note {
	margin: 14px 0 0;
	color: #6b6b70;
	font-size: 13px;
	line-height: 1.5;
}

@media (max-width: 549px) {
	.sbk-form .ss-cf7-row {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 0 !important;
	}

	.sbk-form .ss-cf7-submit input[type="submit"] {
		width: 100% !important;
	}
}

.sbk-callout .text ul + p,
.sbk-form-copy ul + p {
	margin-top: 18px;
}

/* ---------- Giảng viên trang chủ (bố cục hồ sơ) ---------- */

/* Trang chủ dùng cỡ heading section của trang chủ để đứng cùng nhịp các khối khác. */
.sbk-founder .sbk-title {
	font-size: clamp(34px, 3vw, 46px);
	line-height: 1.12;
	font-weight: 600;
	letter-spacing: -.015em;
}

.sbk-founder .sbk-title + .sbk-split-name {
	margin-top: 28px;
}

.sbk-founder .sbk-role {
	margin-top: 4px;
	color: var(--sbk-ink);
	font-size: 15px;
	line-height: 1.5;
	font-weight: 600;
}

.sbk-founder .sbk-role + p {
	margin-top: 18px;
}

.sbk-split .sbk-founder-note {
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--sbk-line);
	color: var(--sbk-ink);
	font-size: clamp(18px, 1.45vw, 21px);
	line-height: 1.5;
	font-weight: 600;
}

.sbk-split .sbk-founder-areas {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 0;
	margin-top: 18px;
	color: var(--sbk-ink);
	font-size: 15px;
	line-height: 1.5;
	font-weight: 600;
}

.sbk-founder-areas span + span::before {
	content: "·";
	margin: 0 12px;
	color: var(--sbk-red);
}

.sbk-split .sbk-founder-link {
	margin-top: 26px;
	font-weight: 700;
}

.sbk-split .sbk-founder-link a {
	color: var(--sbk-ink);
	text-decoration: none;
}

/* ---------- Khung video SanSan (ảnh bìa + nút phát đỏ, bấm mới nạp YouTube) ---------- */

.sbk-video {
	margin: 0;
}

.sbk-video-frame {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: #1c1c1f;
	color: #fff;
}

.sbk .sbk-video-frame,
.sbk .sbk-video-frame:hover {
	text-decoration: none;
}

.sbk-video-frame .sbk-video-poster,
.sbk-video-frame img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.16, 1, .3, 1);
}

/* Thumbnail giữ nguyên như một tấm ảnh (người dùng yêu cầu 17-09-2026): không lớp phủ,
   không nút lớn ở giữa. Chỉ có nhãn "▶ thời lượng" ở góc dưới. Muốn nút tròn đỏ ở giữa:
   thêm class sbk-video--button vào element. */
.sbk-video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	display: none;
	width: clamp(64px, 6.4vw, 96px);
	aspect-ratio: 1;
	place-items: center;
	border-radius: 50%;
	background: var(--sbk-red, #e30514);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .3);
	transform: translate(-50%, -50%);
	transition: transform .35s cubic-bezier(.16, 1, .3, 1), background-color .2s ease;
}

.sbk-video-play svg {
	width: 40%;
	height: 40%;
	margin-left: 7%;
	fill: #fff;
}

.sbk-video-frame:hover .sbk-video-play,
.sbk-video-frame:focus-visible .sbk-video-play {
	background: var(--sbk-red-deep, #b00410);
	transform: translate(-50%, -50%) scale(1.08);
}

.sbk-video-frame:hover img {
	transform: scale(1.03);
}

.sbk-video-frame:focus-visible {
	outline: 3px solid var(--sbk-red, #e30514);
	outline-offset: 3px;
}

.sbk-video--button .sbk-video-play {
	display: grid;
}

.sbk-video-time {
	position: absolute;
	bottom: clamp(10px, 1.2vw, 16px);
	left: clamp(10px, 1.2vw, 16px);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 4px 10px 4px 9px;
	background: rgba(0, 0, 0, .72);
	color: #fff;
	font-family: var(--ss-font);
	font-size: 13px;
	line-height: 1.4;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	transition: background-color .2s ease;
}

.sbk-video-time::before {
	content: "";
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid currentColor;
}

.sbk-video-frame:hover .sbk-video-time,
.sbk-video-frame:focus-visible .sbk-video-time {
	background: var(--sbk-red, #e30514);
}

.sbk-video--button .sbk-video-time::before {
	content: none;
}

.sbk-video-frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.sbk-video-cap {
	margin-top: 14px;
}

.sbk-video .sbk-video-title {
	color: var(--sbk-ink, #38383b);
	font-size: clamp(17px, 1.3vw, 19px);
	line-height: 1.35;
	font-weight: 650;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.sbk-video .sbk-video-note {
	margin-top: 6px;
	color: var(--sbk-copy, #4a4a4e);
	font-size: 14px;
	line-height: 1.5;
}

/* Dải video lớn trong trang khóa học (theo khối video của chicagobooth.edu):
   khung rộng 2.4:1 nền đen, ảnh 16:9 nằm giữa; bấm là phát ngay trong khung. */
.sbk-vband .sbk-vband-row {
	max-width: 1600px !important;
}

.sbk-video--band .sbk-video-frame {
	aspect-ratio: 2.4 / 1;
	background: #000;
}

.sbk-video--band .sbk-video-frame img {
	object-fit: contain;
}

.sbk-video--band .sbk-video-frame:hover img {
	transform: none;
}

.sbk-video--band .sbk-video-time {
	bottom: clamp(14px, 1.6vw, 24px);
	left: clamp(14px, 1.6vw, 24px);
	padding: 6px 14px 6px 12px;
	font-size: clamp(14px, 1.1vw, 16px);
}

/* Thumbnail YouTube cũ có viền đen sẵn trong ảnh: phóng ảnh để cắt viền. */
.sbk-video--zoom .sbk-video-frame img {
	transform: scale(1.34);
}

.sbk-video--band.sbk-video--zoom .sbk-video-frame img {
	width: auto;
	max-width: none;
	height: 100%;
	margin: 0 auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transform: scale(1.34);
	transform-origin: center;
}

.sbk-video--band.sbk-video--zoom .sbk-video-frame {
	display: flex;
	justify-content: center;
}

.sbk-vband .sbk-vband-head {
	margin-bottom: clamp(24px, 2.6vw, 36px);
}

@media (max-width: 849px) {
	.sbk-video--band .sbk-video-frame {
		aspect-ratio: 16 / 9;
	}

	.sbk-video--band .sbk-video-frame img {
		object-fit: cover;
	}
}

/* Thẻ trong lưới thư viện: nút nhỏ hơn. */
/* Tên video luôn chiếm đúng 2 dòng để các thẻ trong một hàng thẳng nhau. */
.sbk-video--card .sbk-video-title {
	min-height: calc(2 * 1.35em);
}

.sbk-video--card .sbk-video-play {
	width: 52px;
}

.sbk-video--card .sbk-video-time {
	font-size: 12px;
}

/* Hàng video theo chủ đề + video nổi bật. */
.sbk-vrow .sbk-vcard {
	margin-bottom: 32px;
}

.sbk-vrow .sbk-more-link,
.sbk-vfeature .sbk-more-link {
	margin-top: 16px;
	font-weight: 700;
}

.sbk-vrow .sbk-more-link a,
.sbk-vfeature .sbk-more-link a {
	color: var(--sbk-ink);
}

.sbk-vfeature .sbk-vfeature-copy .sbk-title + p {
	margin-top: 14px;
}

/* Dòng chủ đề · thời lượng nằm DƯỚI tiêu đề (không làm nhãn trên tiêu đề). */
.sbk-vfeature .sbk-vfeature-meta {
	color: var(--sbk-ink);
	font-size: 15px;
	line-height: 1.4;
	font-weight: 700;
}

.sbk-vfeature .sbk-vfeature-copy p {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.7;
}

@media (max-width: 849px) {
	.sbk-vfeature .sbk-vfeature-copy {
		margin-top: 24px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbk-video-frame img,
	.sbk-video-play {
		transition: none;
	}
}

/* ---------- Bản đồ ---------- */

.sbk-map-frame iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 6;
	border: 0;
}

.sbk-map .sbk-title + p {
	margin-top: 22px;
}

.sbk-map p {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.75;
}

/* ---------- Accordion nội dung dài ---------- */

.sbk-acc .accordion-inner ul {
	margin: 0 0 0 1.1em;
}

.sbk-acc .accordion-inner li {
	margin-bottom: 6px;
}

.sbk-acc .accordion-inner p + ul,
.sbk-acc .accordion-inner ul + p {
	margin-top: 10px;
}

/* ---------- Nút "xem tất cả" ---------- */

.sbk-more .sbk-btn {
	margin-top: 0;
}

.sbk-more + .sbk {
	margin-top: 0;
}

/* ---------- Lịch theo nhóm ---------- */

.sbk-calendar .sbk-course a {
	color: var(--sbk-ink);
	font-weight: 700;
}

.sbk-calendar .sbk-course a:hover {
	color: var(--sbk-red);
}

.sbk-calendar .accordion-inner {
	padding-top: 6px;
}

.sbk-calendar tbody td:first-child {
	width: 118px;
}

/* ---------- Tablet ---------- */

@media (max-width: 849px) {
	.sbk-sticky-media > .col-inner {
		position: static;
	}

	.sbk-sticky-copy {
		margin-top: 28px;
	}

	.sbk-form-col {
		margin-top: 28px;
	}

	.sbk-facts-actions > .col-inner {
		flex-direction: row;
		margin-top: 16px;
	}

	.sbk-facts-list .col-inner {
		padding-bottom: 10px;
	}

	.sbk {
		--sbk-offset: 0%;
	}

	.sbk-rule > .col-inner {
		padding-top: 30px;
	}

	.sbk-rule > .col-inner::before {
		top: 0;
		width: 120px;
	}

	.sbk-zigzag .sbk-media-col {
		order: -1;
	}

	.sbk-zigzag .sbk-media-col + .col,
	.sbk-split .sbk-media-col + .col {
		margin-top: 24px;
	}
}

/* ---------- Mobile ---------- */

@media (max-width: 549px) {
	.sbk-list2 .sbk-item .row-inner,
	.sbk-list2 .sbk-item .row {
		flex-wrap: wrap;
	}

	.sbk-list2 .sbk-item .col + .col {
		margin-top: 18px;
	}

	.sbk-hero {
		min-height: 520px;
	}

	.sbk-band .button,
	.sbk .sbk-btn {
		width: 100%;
		padding: 10px 20px;
		text-align: center;
	}

	.sbk-icons .sbk-icon-link {
		margin-bottom: 28px;
	}

	/* Bảng so sánh: mỗi hàng thành một khối, tiêu đề hàng in đậm, ô có nhãn cột. */
	.sbk-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.sbk-table table,
	.sbk-table tbody,
	.sbk-table tr,
	.sbk-table tbody th {
		display: block;
		width: 100%;
	}

	.sbk-table tbody tr {
		padding: 18px 0;
		border-bottom: 1px solid var(--sbk-line);
	}

	.sbk-table tbody tr:first-child {
		border-top: 3px solid var(--sbk-red);
	}

	.sbk-table tbody th {
		padding: 0 0 8px;
		border: 0;
		color: var(--sbk-ink);
		font-size: 18px;
	}

	.sbk-table tbody td {
		display: grid;
		grid-template-columns: 120px 1fr;
		gap: 12px;
		padding: 6px 0;
		border: 0;
	}

	.sbk-table tbody td::before {
		content: attr(data-label);
		color: var(--sbk-ink);
		font-weight: 700;
	}

	/* Lịch khai giảng: mỗi lớp thành một khối có nhãn cột. */
	.sbk-schedule thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.sbk-schedule tbody tr {
		display: block;
		padding: 18px 0;
		border-bottom: 1px solid var(--sbk-line);
	}

	.sbk-schedule tbody tr:first-child {
		border-top: 3px solid var(--sbk-red);
	}

	.sbk-schedule tbody td {
		display: grid;
		grid-template-columns: 112px 1fr;
		gap: 12px;
		padding: 5px 0;
		border: 0;
		text-align: left;
		white-space: normal;
	}

	.sbk-schedule tbody td::before {
		content: attr(data-label);
		color: var(--sbk-ink);
		font-weight: 700;
	}

	.sbk-schedule td:last-child {
		display: block;
		padding-top: 10px;
		text-align: left;
	}

	.sbk-schedule td:last-child::before {
		content: none;
	}

	/* Bảng lịch theo nhóm có cột cuối là tình trạng: giữ nhãn cột. */
	.sbk-calendar td:last-child {
		display: grid;
		padding-top: 5px;
	}

	.sbk-calendar td:last-child::before {
		content: attr(data-label);
	}

	.sbk-calendar tbody td:first-child {
		width: auto;
	}

	.sbk-facts-actions > .col-inner {
		flex-direction: column;
	}

	.sbk-map-frame iframe {
		aspect-ratio: 4 / 3;
	}

	.sbk-people--single .sbk-person-copy {
		margin-top: 22px;
	}

	.sbk-people--grid .sbk-person-copy > .col-inner {
		padding: 18px 0 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbk-arrow::after {
		transition: none;
	}
}

/* ---------- Mốc hành trình (sbk_milestones): đường ray ngang, dưới 850px thành đường ray dọc ---------- */

.sbk-mile {
	--sbk-mile-dot: 14px;
	--sbk-mile-x: 15px; /* lề trong của cột Flatsome: điểm mốc canh theo đầu dòng chữ */
}

.sbk-mile-stop {
	position: relative;
}

/* Mỗi cột vẽ một đoạn ray tràn hết bề ngang cột, các đoạn nối liền; ray bắt đầu và kết thúc đúng tâm mốc đầu, mốc cuối. */
.sbk-mile-stop::before {
	content: "";
	position: absolute;
	top: calc(var(--sbk-mile-dot) / 2 - 1px);
	right: 0;
	left: 0;
	height: 2px;
	background: var(--sbk-line);
}

.sbk-mile-stop:first-child::before {
	left: calc(var(--sbk-mile-x) + var(--sbk-mile-dot) / 2);
}

.sbk-mile-stop:last-child::before {
	right: calc(100% - var(--sbk-mile-x) - var(--sbk-mile-dot) / 2);
}

.sbk-mile-stop > .col-inner {
	position: relative;
	padding-top: calc(var(--sbk-mile-dot) + 30px);
}

.sbk-mile-stop > .col-inner::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	box-sizing: border-box;
	width: var(--sbk-mile-dot);
	height: var(--sbk-mile-dot);
	border: 2px solid var(--sbk-red);
	border-radius: 50%;
	background: #fff;
}

/* Bước ngoặt: mốc đặc, lớn hơn, có vòng trắng tách khỏi ray; nhãn đỏ. */
.sbk-mile-stop--key > .col-inner::before {
	top: -5px;
	left: -5px;
	width: calc(var(--sbk-mile-dot) + 10px);
	height: calc(var(--sbk-mile-dot) + 10px);
	border: 0;
	background: var(--sbk-red);
	box-shadow: 0 0 0 6px #fff;
}

.sbk .sbk-mile-when {
	font-size: clamp(26px, 2.3vw, 34px);
	line-height: 1.1;
	white-space: nowrap;
}

.sbk .sbk-mile-stop--key .sbk-mile-when {
	color: var(--sbk-red);
}

.sbk-mile-stop p {
	margin-top: 14px;
	font-size: 16px;
	line-height: 1.6;
}

@media (max-width: 849px) {
	.sbk-mile-stop::before {
		top: 0;
		right: auto;
		bottom: 0;
		left: calc(var(--sbk-mile-x) + var(--sbk-mile-dot) / 2 - 1px);
		width: 2px;
		height: auto;
	}

	/* Mốc canh giữa dòng nhãn đầu tiên (nhãn 26px × 1.1). */
	.sbk-mile {
		--sbk-mile-top: 7px;
	}

	.sbk-mile-stop:first-child::before {
		top: calc(var(--sbk-mile-top) + var(--sbk-mile-dot) / 2);
		left: calc(var(--sbk-mile-x) + var(--sbk-mile-dot) / 2 - 1px);
	}

	.sbk-mile-stop:last-child::before {
		right: auto;
		bottom: auto;
		height: calc(var(--sbk-mile-top) + var(--sbk-mile-dot) / 2);
	}

	.sbk-mile-stop > .col-inner {
		padding: 0 0 34px calc(var(--sbk-mile-dot) + 26px);
	}

	.sbk-mile-stop:last-child > .col-inner {
		padding-bottom: 0;
	}

	.sbk-mile-stop > .col-inner::before {
		top: var(--sbk-mile-top);
	}

	.sbk-mile-stop--key > .col-inner::before {
		top: calc(var(--sbk-mile-top) - 5px);
	}

	.sbk .sbk-mile-when {
		font-size: 26px;
	}

	.sbk-mile-stop p {
		max-width: 560px;
		margin-top: 8px;
	}
}

/* ---------- Nguyên tắc giảng dạy (sbk_principle): chân dung + câu nguyên tắc + chuỗi bước ---------- */

.sbk-principle-copy .sbk-title + .sbk-statement {
	margin-top: 22px;
}

.sbk .sbk-path {
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
}

.sbk .sbk-path li {
	position: relative;
	margin: 0;
	padding: 0 0 20px 32px;
	color: var(--sbk-ink);
	font-size: clamp(16px, 1.25vw, 18px);
	font-weight: 600;
	line-height: 1.45;
}

/* Mốc vuông đỏ canh giữa dòng chữ; đoạn ray xám nối tới bước sau. */
.sbk .sbk-path li::before {
	content: "";
	position: absolute;
	top: calc(.725em - 5px);
	left: 0;
	width: 10px;
	height: 10px;
	background: var(--sbk-red);
}

.sbk .sbk-path li::after {
	content: "";
	position: absolute;
	top: calc(.725em + 5px);
	bottom: 0;
	left: 4px;
	width: 2px;
	background: #bdbdc2;
}

.sbk .sbk-path li:last-child {
	padding-bottom: 0;
}

.sbk .sbk-path li:last-child::after {
	display: none;
}

@media (max-width: 549px) {
	.sbk-principle-photo {
		margin-bottom: 32px;
	}
}

/* Câu nguyên tắc: tránh một chữ rơi xuống dòng cuối. */
.sbk-principle .sbk-statement {
	text-wrap: pretty;
}

/* ---------- Trang thương hiệu cá nhân (sbk_pb_intro, sbk_quote, sbk_brand_map) ---------- */

/* Link ngoài: mũi tên chéo lên phải, cùng nét với mũi tên của kit. */
.sbk-ext::after {
	content: "";
	display: inline-block;
	width: .62em;
	height: .62em;
	margin-left: .45em;
	background: var(--sbk-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 1.2h7.8V9M10.6 1.4 1.2 10.8' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 1.2h7.8V9M10.6 1.4 1.2 10.8' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .25s cubic-bezier(.16, 1, .3, 1);
}

.sbk-ext:hover::after,
.sbk-ext:focus-visible::after {
	transform: translate(2px, -2px);
}

/* Mở đầu: chân dung đứng sát đáy dải nền (bỏ đệm dưới của section), chữ vẫn giữ khoảng thở riêng. */
.sbk-pb.section {
	padding-bottom: 0 !important;
}

.sbk-pb .sbk-pb-photo .img-inner img {
	object-fit: contain;
	object-position: 50% 100%;
}

.sbk-pb .sbk-pb-photo .img {
	max-width: 440px;
	margin: 0 auto;
}

.sbk-pb-copy > .col-inner {
	padding-bottom: clamp(48px, 6vw, 88px);
}

.sbk-pb .sbk-title {
	font-size: clamp(32px, 3.2vw, 46px);
	line-height: 1.12;
}

.sbk-pb .sbk-title + .sbk-lead {
	margin-top: 20px;
	max-width: 640px;
}

.sbk .sbk-pb-numbers {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #d6d6d9;
}

.sbk .sbk-pb-numbers li {
	margin: 0;
	padding: 18px 16px 0 0;
}

.sbk-pb-numbers strong {
	display: block;
	color: var(--sbk-red);
	font-size: clamp(36px, 3.3vw, 48px);
	font-weight: 600;
	letter-spacing: -.015em;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* "gần" đứng cùng dòng với số, nhỏ và canh đáy. */
.sbk-pb-numbers strong small {
	margin-right: .2em;
	font-size: .4em;
	font-weight: 600;
}

.sbk-pb-numbers span {
	display: block;
	margin-top: 8px;
	color: var(--sbk-copy);
	font-size: 15px;
	line-height: 1.4;
}

.sbk-pb-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	margin-top: 34px;
}

.sbk .sbk-pb-links a {
	color: var(--sbk-ink);
	font-size: 16px;
	font-weight: 700;
}

/* Câu nói: chữ lớn trong cột lệch; dấu ngoặc đỏ đặt ở lề trái (chỗ đường kẻ nhấn của các section khác). */
.sbk-quote-fig {
	margin: 0;
}

.sbk-quote .sbk-copy-col > .col-inner {
	position: relative;
}

/* Dấu ngoặc kép vẽ bằng SVG (ký tự “ của Inter Tight ở cỡ lớn thành hai vạch xiên). */
.sbk-quote .sbk-copy-col > .col-inner::before {
	content: "";
	position: absolute;
	top: .3em;
	left: 0;
	width: clamp(46px, 4.4vw, 68px);
	aspect-ratio: 60 / 46;
	background: var(--sbk-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 46'%3E%3Cpath d='M0 46V29C0 13.5 8.6 3.8 23.4 0l2.9 5.6C18.5 8.4 14.6 13.6 14.1 21H26v25H0Zm33.7 0V29c0-15.5 8.6-25.2 23.4-29L60 5.6c-7.8 2.8-11.7 8-12.2 15.4h11.9v25H33.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 46'%3E%3Cpath d='M0 46V29C0 13.5 8.6 3.8 23.4 0l2.9 5.6C18.5 8.4 14.6 13.6 14.1 21H26v25H0Zm33.7 0V29c0-15.5 8.6-25.2 23.4-29L60 5.6c-7.8 2.8-11.7 8-12.2 15.4h11.9v25H33.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sbk-quote-fig blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.sbk .sbk-quote-fig blockquote p {
	color: var(--sbk-ink);
	font-style: normal;
	font-size: clamp(30px, 3.3vw, 48px);
	font-weight: 600;
	line-height: 1.2;
	text-wrap: balance;
}

.sbk-quote-fig figcaption {
	margin-top: 22px;
	color: var(--sbk-copy);
	font-size: 16px;
}

/* Bản đồ thương hiệu: mỗi lĩnh vực một hàng, tên thương hiệu là ô chữ vuông. */
.sbk-bmap {
	border-top: 1px solid var(--sbk-line);
}

.sbk-bmap-row {
	display: grid;
	grid-template-columns: minmax(150px, 20%) 1fr;
	gap: 14px 32px;
	align-items: start;
	padding: 24px 0;
	border-bottom: 1px solid var(--sbk-line);
}

.sbk .sbk-bmap-row h3 {
	padding-top: 7px;
	font-size: clamp(19px, 1.5vw, 22px);
	line-height: 1.3;
}

.sbk .sbk-bmap-row ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sbk .sbk-bmap-row li {
	margin: 0;
	padding: 9px 14px;
	border: 1px solid var(--sbk-line);
	background: #fff;
	color: var(--sbk-ink);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
}

.sbk .sbk-bmap-row li:has(> a) {
	padding: 0;
	border-color: #cfcfd3;
}

.sbk .sbk-bmap-row li > a {
	display: block;
	padding: 9px 14px;
}

.sbk .sbk-bmap-row li:has(> a:hover),
.sbk .sbk-bmap-row li:has(> a:focus-visible) {
	border-color: var(--sbk-red);
}

@media (max-width: 849px) {
	.sbk .sbk-pb-numbers {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sbk .sbk-pb-numbers li:nth-child(n + 3) {
		padding-top: 22px;
	}
}

@media (max-width: 549px) {
	.sbk-pb .sbk-pb-photo {
		order: 2;
	}

	.sbk-pb .sbk-pb-photo .img {
		max-width: 300px;
	}

	.sbk-pb-copy > .col-inner {
		padding-bottom: 36px;
	}

	.sbk-bmap-row {
		grid-template-columns: 1fr;
		padding: 20px 0;
	}

	.sbk .sbk-bmap-row h3 {
		padding-top: 0;
	}
}

/* ---------- Lưới logo thương hiệu (sbk_logo_wall) ---------- */

/* Khoảng dọc bằng rãnh ngang của Flatsome (2 × 15px lề cột). */
.sbk-logos-row {
	row-gap: 30px;
}

.sbk-logos .sbk-logo > .col-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 5 / 3;
	border: 1px solid var(--sbk-line);
	background: #fff;
	transition: border-color .25s ease, box-shadow .35s cubic-bezier(.16, 1, .3, 1);
}

.sbk-logos .sbk-logo .img {
	margin: 0;
}

.sbk-logos .sbk-logo .img-inner img {
	object-fit: contain;
}

/* Ô có website: viền đỏ và bóng mềm khi rê/tập trung. */
.sbk-logos .sbk-logo--link > .col-inner:hover,
.sbk-logos .sbk-logo--link > .col-inner:focus-within {
	border-color: var(--sbk-red);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .08);
}

.sbk-logos .sbk-logo--link .img a:focus-visible {
	outline: 2px solid var(--sbk-red);
	outline-offset: 6px;
}


/* Điện thoại: rãnh 12px thay vì 30px để ô rộng hơn; ô cao hơn và logo phóng 1.2 lần để chữ trong logo còn đọc được. */
@media (max-width: 549px) {
	.sbk-logos-row {
		row-gap: 12px;
	}

	.sbk-logos .sbk-logos-row > .sbk-logo {
		padding-right: 6px;
		padding-left: 6px;
	}

	.sbk-logos .sbk-logo > .col-inner {
		aspect-ratio: 4 / 3;
	}

	.sbk-logos .sbk-logo .img {
		transform: scale(1.2);
	}
}

/* ---------- Dòng thời gian dọc (sbk_timeline) ----------
   Máy tính: [năm cố định đầu mốc] | ray dọc + điểm mốc | nội dung. Tĩnh hoàn toàn (người dùng 17-09-2026: năm không chạy theo scroll). Ray vẽ theo từng hàng (các hàng liền nhau nên ray liền),
   hàng đầu bắt đầu và hàng cuối kết thúc đúng tâm điểm mốc. Dưới 850px năm nằm trên nội dung, ray chạy qua cả hai. */

.sbk-tl {
	--sbk-tl-x: 15px;          /* lề trong cột Flatsome: ray nằm ở mép chữ của cột nội dung */
	--sbk-tl-dot: 16px;
	--sbk-tl-dot-top: 8px;     /* canh giữa dòng đầu tiêu đề mốc */
	--sbk-tl-gap: 52px;        /* khoảng từ ray tới chữ */
}

.sbk-tl-item {
	position: relative;
}

.sbk-tl-item > .col {
	align-self: stretch;
}

.sbk-tl-body,
.sbk-tl-year {
	position: relative;
}

.sbk-tl-body::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: var(--sbk-tl-x);
	width: 2px;
	background: var(--sbk-red);
}

.sbk-tl-item--first .sbk-tl-body::before {
	top: calc(var(--sbk-tl-dot-top) + var(--sbk-tl-dot) / 2);
}

.sbk-tl-item--last .sbk-tl-body::before {
	bottom: auto;
	height: calc(var(--sbk-tl-dot-top) + var(--sbk-tl-dot) / 2);
}

.sbk-tl-body > .col-inner {
	position: relative;
	padding: 0 0 clamp(64px, 7.5vw, 112px) var(--sbk-tl-gap);
}

.sbk-tl-item--last .sbk-tl-body > .col-inner {
	padding-bottom: 0;
}

.sbk-tl-body > .col-inner::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: var(--sbk-tl-dot-top);
	left: calc(1px - var(--sbk-tl-dot) / 2);
	box-sizing: border-box;
	width: var(--sbk-tl-dot);
	height: var(--sbk-tl-dot);
	border: 2px solid var(--sbk-red);
	border-radius: 50%;
	background: var(--sbk-red);
}

/* Bước ngoặt: điểm mốc lớn, có vòng trắng tách khỏi ray. */
.sbk-tl-item--key .sbk-tl-body > .col-inner::before {
	top: calc(var(--sbk-tl-dot-top) - 5px);
	left: calc(1px - (var(--sbk-tl-dot) + 10px) / 2);
	width: calc(var(--sbk-tl-dot) + 10px);
	height: calc(var(--sbk-tl-dot) + 10px);
	border: 0;
	background: var(--sbk-red);
	box-shadow: 0 0 0 6px #fff;
}

/* Năm: chữ lớn canh phải sát ray, đứng yên ở đầu mốc. */
.sbk-tl-year > .col-inner {
	padding-right: 36px;
	text-align: right;
}

.sbk .sbk-tl-when {
	color: var(--sbk-ink);
	font-size: clamp(46px, 5.2vw, 84px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: .95;
	font-variant-numeric: lining-nums tabular-nums;
}

.sbk .sbk-tl-item--key .sbk-tl-when {
	color: var(--sbk-red);
}

.sbk .sbk-tl-title {
	font-size: clamp(22px, 2vw, 28px);
	line-height: 1.25;
}

.sbk-tl-body .sbk-tl-title + p {
	margin-top: 12px;
}

.sbk-tl-body p {
	max-width: 640px;
	font-size: clamp(16px, 1.2vw, 17.5px);
	line-height: 1.72;
}

.sbk-tl-body .sbk-tl-img {
	max-width: 640px;
	margin-top: 26px;
}

/* Câu nói trong mốc: khối nền nhạt, dấu ngoặc đỏ vẽ bằng SVG (cùng dấu của sbk-quote). */
.sbk-tl-quote {
	position: relative;
	max-width: 640px;
	margin: 26px 0 0;
	padding: 26px 28px 24px 82px;
	background: var(--sbk-tint, #f3f3f4);
}

.sbk-tl-quote::before {
	content: "";
	position: absolute;
	top: 30px;
	left: 28px;
	width: 34px;
	aspect-ratio: 60 / 46;
	background: var(--sbk-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 46'%3E%3Cpath d='M0 46V29C0 13.5 8.6 3.8 23.4 0l2.9 5.6C18.5 8.4 14.6 13.6 14.1 21H26v25H0Zm33.7 0V29c0-15.5 8.6-25.2 23.4-29L60 5.6c-7.8 2.8-11.7 8-12.2 15.4h11.9v25H33.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 46'%3E%3Cpath d='M0 46V29C0 13.5 8.6 3.8 23.4 0l2.9 5.6C18.5 8.4 14.6 13.6 14.1 21H26v25H0Zm33.7 0V29c0-15.5 8.6-25.2 23.4-29L60 5.6c-7.8 2.8-11.7 8-12.2 15.4h11.9v25H33.7Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sbk-tl-quote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.sbk .sbk-tl-quote blockquote p {
	color: var(--sbk-ink);
	font-size: clamp(20px, 1.9vw, 25px);
	font-style: normal;
	font-weight: 600;
	line-height: 1.35;
}

.sbk-tl-quote figcaption {
	margin-top: 10px;
	color: var(--sbk-copy);
	font-size: 14px;
}

@media (max-width: 849px) {
	.sbk-tl {
		--sbk-tl-dot-top: 11px; /* canh giữa dòng năm 38px */
		--sbk-tl-gap: 44px;
	}

	/* Ray chạy qua cả cột năm lẫn cột nội dung (xếp chồng). */
	.sbk-tl-year::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: var(--sbk-tl-x);
		width: 2px;
		background: var(--sbk-red);
	}

	.sbk-tl-item--first .sbk-tl-year::before {
		top: calc(var(--sbk-tl-dot-top) + var(--sbk-tl-dot) / 2);
	}

	.sbk-tl-item--first .sbk-tl-body::before {
		top: 0;
	}

	.sbk-tl-item--last .sbk-tl-year::before {
		bottom: auto;
		height: calc(var(--sbk-tl-dot-top) + var(--sbk-tl-dot) / 2);
	}

	.sbk-tl-item--last .sbk-tl-body::before {
		display: none;
	}

	.sbk-tl-year > .col-inner {
		position: relative;
		padding: 0 0 10px var(--sbk-tl-gap);
		text-align: left;
	}

	/* Điểm mốc chuyển sang cạnh năm. */
	.sbk-tl-body > .col-inner::before,
	.sbk-tl-item--key .sbk-tl-body > .col-inner::before {
		display: none;
	}

	.sbk-tl-year > .col-inner::before {
		content: "";
		position: absolute;
		z-index: 1;
		top: var(--sbk-tl-dot-top);
		left: calc(1px - var(--sbk-tl-dot) / 2);
		box-sizing: border-box;
		width: var(--sbk-tl-dot);
		height: var(--sbk-tl-dot);
		border: 2px solid var(--sbk-red);
		border-radius: 50%;
		background: var(--sbk-red);
	}

	.sbk-tl-item--key .sbk-tl-year > .col-inner::before {
		top: calc(var(--sbk-tl-dot-top) - 5px);
		left: calc(1px - (var(--sbk-tl-dot) + 10px) / 2);
		width: calc(var(--sbk-tl-dot) + 10px);
		height: calc(var(--sbk-tl-dot) + 10px);
		border: 0;
		background: var(--sbk-red);
		box-shadow: 0 0 0 6px #fff;
	}

	.sbk .sbk-tl-when {
		font-size: 38px;
		line-height: 1;
	}

	.sbk-tl-body > .col-inner {
		padding-bottom: 52px;
	}

	.sbk-tl-quote {
		padding: 20px 20px 18px 62px;
	}

	.sbk-tl-quote::before {
		top: 24px;
		left: 20px;
		width: 28px;
	}
}

/* ---------- Thẻ hạng vé / học phí (sbk_pricing) ---------- */

.sbk-pricing > .section-content > .row {
	row-gap: 24px;
}

.sbk-price > .col-inner {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: clamp(26px, 2.4vw, 38px);
	background: #fff;
	border: 1px solid var(--sbk-line);
	border-top: 3px solid var(--sbk-red);
}

.sbk .sbk-price-name {
	color: var(--sbk-ink);
	font-size: clamp(19px, 1.5vw, 22px);
	line-height: 1.3;
}

.sbk .sbk-price-amount {
	margin-top: 10px;
	color: var(--sbk-ink);
	font-size: clamp(32px, 2.8vw, 44px);
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: normal;
	font-variant-numeric: tabular-nums;
}

.sbk .sbk-price-note {
	margin-top: 10px;
	color: var(--sbk-copy);
	font-size: clamp(15px, 1.1vw, 16px);
	line-height: 1.55;
}

.sbk .sbk-price-list {
	margin: 22px 0 0;
	padding: 22px 0 0;
	border-top: 1px solid var(--sbk-line);
	list-style: none;
}

.sbk-price-list li {
	position: relative;
	margin: 0;
	padding-left: 18px;
	color: var(--sbk-copy);
	font-size: clamp(15.5px, 1.2vw, 17px);
	line-height: 1.6;
}

.sbk-price-list li + li {
	margin-top: 8px;
}

.sbk-price-list li::before {
	content: "";
	position: absolute;
	top: .66em;
	left: 0;
	width: 7px;
	height: 7px;
	background: var(--sbk-red);
}

@media (max-width: 549px) {
	.sbk-price > .col-inner {
		padding: 24px 20px;
	}
}

/* ---------- Hàng ảnh + chữ so le (sbk_media_rows) ---------- */

.sbk-mrows .sbk-mrows-list > .col-inner {
	padding: 0;
}

.sbk-mrows .sbk-mrow + .sbk-mrow {
	margin-top: clamp(40px, 4.4vw, 68px);
}

.sbk-mrow h3 {
	font-size: clamp(21px, 1.8vw, 26px);
	line-height: 1.25;
}

.sbk-mrow h3 + p,
.sbk-mrow h3 + ul {
	margin-top: 12px;
}

.sbk-mrow p,
.sbk-mrow li {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.72;
}

/* Danh sách dấu vuông đỏ trong các khối ảnh + chữ (chia đôi, hàng so le, danh sách dọc). */
.sbk-split .text ul,
.sbk-mrow .text ul,
.sbk-stack .text ul {
	margin-bottom: 0;
	padding: 0;
	list-style: none;
}

.sbk-split .text ul li,
.sbk-mrow .text ul li,
.sbk-stack .text ul li {
	position: relative;
	margin: 0;
	padding-left: 18px;
}

.sbk-split .text ul li {
	font-size: clamp(16px, 1.25vw, 17.8px);
	line-height: 1.72;
}

.sbk-split .text ul li + li,
.sbk-mrow .text ul li + li,
.sbk-stack .text ul li + li {
	margin-top: 8px;
}

.sbk-split .text ul li::before,
.sbk-mrow .text ul li::before,
.sbk-stack .text ul li::before {
	content: "";
	position: absolute;
	top: .68em;
	left: 0;
	width: 7px;
	height: 7px;
	background: var(--sbk-red);
}

@media (max-width: 549px) {
	.sbk-mrow .sbk-mrow-media {
		order: -1;
		margin-bottom: 18px;
	}
}

/* ---------- Dải ảnh lớp học không chữ (sbk_gallery) ---------- */

.sbk-gallery .sbk-head {
	margin-bottom: clamp(24px, 2.6vw, 36px);
}

.sbk-gallery > .section-content > .sbk-gallery-row {
	max-width: 1600px !important;
	margin-inline: auto;
}

.sbk-gallery-item > .col-inner {
	padding: 0;
}

.sbk-gallery-item .img {
	margin-bottom: 0 !important;
}

/* ---------- Cân chữ (17-09-2026, người dùng: "đừng để nội dung chữ bị sộc sệch") ---------- */

/* Đoạn văn và gạch đầu dòng tránh dòng cuối chỉ có một, hai chữ. Heading vẫn xuống dòng tự nhiên (xem .sbk h1–h4). */
.sbk p,
.sbk li {
	text-wrap: pretty;
}

/* Câu trích lớn: cỡ chữ vừa phải và dòng dài hơn để câu 120–160 ký tự nằm gọn trong 3–4 dòng. */
.sbk .sbk-quote-fig blockquote p {
	max-width: 920px;
	font-size: clamp(28px, 2.8vw, 40px);
	line-height: 1.24;
}

/* Dòng link sang trang hồ sơ, chỉ dùng ở khối chân dung trên trang chủ. */
.sbk-pb-more {
	margin-top: 22px;
}

.sbk .sbk-pb-more a {
	color: var(--sbk-ink);
	font-size: 16px;
	font-weight: 700;
}

/* Bản dùng ở trang chủ: ngay dưới là dải đỏ phản hồi học viên nên chân dung cần đệm đáy, không chạm mép. */
.sbk-pb--home.section {
	padding-bottom: clamp(36px, 3.4vw, 52px) !important;
}

/* ---------- Thẻ lớp đã diễn ra (sbk-ecard) — trang /khoa-hoc-da-dien-ra/ (29-09-2026) ----------
   Mỗi thẻ: ảnh bìa bài viết (bấm vào mở bài), tên lớp, ngày và nơi tổ chức. */

.sbk .row:has(> .sbk-ecard) {
	row-gap: 32px;
}

.sbk .sbk-ecard {
	margin-bottom: 0;
}

.sbk-ecard .img {
	margin-bottom: 14px !important;
	overflow: hidden;
}

.sbk-ecard .img img {
	transition: transform .5s cubic-bezier(.22, 1, .36, 1);
}

.sbk-ecard:hover .img img {
	transform: scale(1.04);
}

.sbk .sbk-ecard h3 {
	margin: 0 0 6px;
	font-size: clamp(19px, 1.5vw, 22px);
	line-height: 1.3;
}

.sbk .sbk-ecard h3 a {
	color: var(--sbk-ink);
	text-decoration: none;
}

.sbk .sbk-ecard h3 a:hover {
	color: var(--sbk-red);
}

.sbk .sbk-ecard .sbk-ecard-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 14px;
	margin: 0;
	color: var(--sbk-copy);
	font-size: 15px;
	line-height: 1.5;
}

.sbk .sbk-ecard .sbk-ecard-meta span + span {
	position: relative;
	padding-left: 14px;
}

.sbk .sbk-ecard .sbk-ecard-meta span + span::before {
	content: "";
	position: absolute;
	top: .55em;
	left: 0;
	width: 5px;
	height: 5px;
	background: var(--sbk-red);
}

/* ---------- Trích dẫn học viên trong khối chia đôi (trang Câu chuyện của học viên) ---------- */

.sbk .sbk-story-quote {
	margin: 22px 0 0;
	padding: 4px 0 4px 22px;
	border-left: 3px solid var(--sbk-red);
}

.sbk .sbk-story-quote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.sbk .sbk-story-quote blockquote p {
	margin: 0;
	color: var(--sbk-ink);
	font-size: clamp(18px, 1.45vw, 21px);
	font-style: normal;
	font-weight: 600;
	line-height: 1.45;
}

.sbk .sbk-story-quote figcaption {
	margin-top: 8px;
	color: var(--sbk-copy);
	font-size: 14px;
}

/* Lưới ảnh bài viết của học viên: ảnh chụp màn hình giữ nguyên tỉ lệ, viền mảnh cho khỏi lẫn nền. */
.sbk-feedback .gallery-col img {
	border: 1px solid #e4e4e7;
}

/* Lưới ảnh bài viết của học viên (trang Cảm nhận): bỏ lớp phủ tối của ô bộ ảnh để chữ trong ảnh đọc rõ. */
.sbk-feedback .gallery-box .overlay,
.sbk-feedback .gallery-box .box-text {
	display: none;
}

/* ---------- Video dọc 9:16 (YouTube Shorts) + khối feedback video học viên (30-09-2026) ----------
   [sansan_video variant="vertical"]: khung dọc, bấm mới nạp YouTube (giống khung ngang).
   Section .sbk-vshorts: máy tính 5 video một hàng; máy tính bảng và điện thoại vuốt ngang
   như Reels, mỗi lần dừng đúng mép một video, hé video kế tiếp để người xem biết còn nữa. */

.sbk-video--vertical .sbk-video-frame {
	aspect-ratio: 9 / 16;
	border-radius: 12px;
}

.sbk-video--vertical .sbk-video-play {
	display: grid;
	width: 56px;
	background: rgba(227, 5, 20, .92);
}

.sbk-video--vertical .sbk-video-time {
	font-size: 12px;
}

.sbk-video--vertical .sbk-video-time::before {
	content: none;
}

.sbk-video--vertical .sbk-video-cap {
	margin-top: 12px;
}

.sbk .sbk-video--vertical .sbk-video-title {
	min-height: 0;
	font-size: 17px;
	-webkit-line-clamp: 1;
}

.sbk .sbk-video--vertical .sbk-video-note {
	margin-top: 2px;
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sbk-vshorts .row:has(> .sbk-vshort) {
	row-gap: 28px;
}

.sbk-vshorts .row > .sbk-vshort {
	flex: 0 0 20%;
	max-width: 20%;
	margin-bottom: 0;
}

@media (max-width: 849px) {
	.sbk-vshorts .row:has(> .sbk-vshort) {
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 19px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.sbk-vshorts .row:has(> .sbk-vshort)::-webkit-scrollbar {
		display: none;
	}

	.sbk-vshorts .row > .sbk-vshort {
		flex: 0 0 34%;
		max-width: 34%;
		scroll-snap-align: start;
	}
}

@media (max-width: 549px) {
	.sbk-vshorts .row > .sbk-vshort {
		flex: 0 0 62%;
		max-width: 62%;
	}
}

/* Hàng video dài (16:9) nằm sau các Shorts trong khối feedback video. */
.sbk-vshorts .sbk-vlong-head {
	margin-top: clamp(36px, 4vw, 56px);
}

.sbk .sbk-vshorts .sbk-vlong-title {
	margin: 0 0 4px;
	font-size: clamp(20px, 1.7vw, 24px);
	line-height: 1.3;
}

.sbk-vshorts .row:has(> .sbk-vcard) {
	row-gap: 28px;
}

.sbk-vshorts .row > .sbk-vcard {
	margin-bottom: 0;
}

/* Tên người trong thẻ video feedback chỉ một dòng: bỏ chỗ chừa sẵn cho hai dòng của thẻ thư viện. */
.sbk-vshorts .sbk-video--card .sbk-video-title {
	min-height: 0;
	-webkit-line-clamp: 1;
}

.sbk-vshorts .sbk-video--card .sbk-video-note {
	margin-top: 2px;
}

/* ---------- Thẻ bài viết của học viên (dựng lại từ bài Facebook) — trang Cảm nhận (30-09-2026) ----------
   Thay lưới ảnh chụp màn hình: chữ thật, đọc được, tìm được. Xếp kiểu tường bài (CSS columns) nên thẻ
   dài ngắn khác nhau vẫn khít; bài dài gập lại sau vài đoạn, bấm "Đọc toàn bộ bài" để mở (details/summary,
   không cần JavaScript). */

.sbk-fbwall-grid {
	columns: 3 320px;
	column-gap: 20px;
}

.sbk-fbpost {
	display: inline-block;
	width: 100%;
	margin: 0 0 20px;
	padding: 20px 22px 18px;
	border: 1px solid #e4e4e7;
	border-radius: 12px;
	background: #fff;
	break-inside: avoid;
}

.sbk-fbpost-head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.sbk-fbpost-avatar {
	display: grid;
	flex: 0 0 42px;
	width: 42px;
	height: 42px;
	place-items: center;
	border-radius: 50%;
	background: var(--sbk-red, #e30514);
	color: #fff;
	font-size: 17px;
	font-weight: 700;
}

.sbk .sbk-fbpost-name {
	margin: 0;
	color: var(--sbk-ink, #38383b);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
}

.sbk .sbk-fbpost-with {
	margin: 1px 0 0;
	color: var(--sbk-copy, #4a4a4e);
	font-size: 13px;
	line-height: 1.4;
}

.sbk-fbpost-fb {
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	margin-left: auto;
	fill: #1877f2;
}

.sbk .sbk-fbpost-body p {
	margin: 0 0 8px;
	color: var(--sbk-ink, #38383b);
	font-size: 15px;
	line-height: 1.6;
}

.sbk .sbk-fbpost-more > summary {
	display: inline-block;
	margin-top: 2px;
	color: var(--sbk-red, #e30514);
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.sbk .sbk-fbpost-more > summary::-webkit-details-marker {
	display: none;
}

.sbk .sbk-fbpost-more[open] > summary {
	display: none;
}

.sbk .sbk-fbpost-tags {
	margin: 10px 0 0;
	color: #1d5bbf;
	font-size: 13px;
	line-height: 1.5;
	word-break: break-word;
}

.sbk .sbk-fbpost-src {
	margin: 12px 0 0;
	padding-top: 10px;
	border-top: 1px solid #efeff1;
	font-size: 13px;
}

.sbk .sbk-fbpost-src a {
	color: var(--sbk-copy, #4a4a4e);
}

@media (max-width: 549px) {
	.sbk-fbwall-grid {
		columns: 1;
	}

	.sbk-fbpost {
		padding: 18px 18px 16px;
	}
}

/* ---------- Lưới ảnh chụp bài Facebook của học viên (trang Cảm nhận, 30-09-2026) ----------
   Ô vuông bằng nhau nên các hàng thẳng đáy, không so le. Ảnh neo ở ĐẦU bài (tên + mấy dòng đầu),
   chân ô mờ dần kèm dòng "Bấm để đọc toàn bài"; bấm mở toàn bộ ảnh đã làm nét trong lightbox. */

.sbk-fbshots .gallery-col {
	padding-bottom: 20px !important;
}

.sbk-fbshots .gallery-box {
	overflow: hidden;
	border: 1px solid #2f3033;
	border-radius: 12px;
	background: #242526;
	transition: transform .35s cubic-bezier(.16, 1, .3, 1), box-shadow .35s ease;
}

.sbk-fbshots .gallery-box:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 30px rgba(0, 0, 0, .18);
}

.sbk-fbshots .gallery-box .box-image {
	position: relative;
	border-radius: 0;
}

.sbk-fbshots .gallery-box .box-image img {
	object-position: top center;
	border-radius: 0;
}

.sbk-fbshots .gallery-box .overlay,
.sbk-fbshots .gallery-box .box-text {
	display: none;
}

.sbk-fbshots .gallery-box .box-image::after {
	content: "Bấm để đọc toàn bài";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	padding: 56px 18px 14px;
	background: linear-gradient(to bottom, rgba(36, 37, 38, 0) 0%, rgba(36, 37, 38, .92) 55%, #242526 100%);
	color: #fff;
	font-family: var(--ss-font);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .01em;
	text-align: center;
}

.sbk-fbshots .gallery-box:hover .box-image::after {
	color: #ff5b66;
}

@media (max-width: 549px) {
	.sbk-fbshots .gallery-col {
		padding-bottom: 12px !important;
	}

	.sbk-fbshots .gallery-box .box-image::after {
		padding: 40px 8px 10px;
		font-size: 12px;
	}
}

/* Lightbox ảnh chụp bài Facebook: bài rất dài (cao gấp 2–2,5 lần bề ngang) mà ép vừa chiều cao màn hình
   thì chữ nhỏ không đọc được. Với riêng các ảnh này: hiện theo bề ngang dễ đọc, cuộn dọc để đọc hết. */
.mfp-wrap:has(.mfp-img[src*="cam-nhan-hoc-vien-map-camp"]) {
	overflow-y: auto !important;
}

.mfp-wrap:has(.mfp-img[src*="cam-nhan-hoc-vien-map-camp"]) .mfp-container {
	height: auto;
	min-height: 100%;
}

.mfp-img[src*="cam-nhan-hoc-vien-map-camp"] {
	width: min(640px, 94vw) !important;
	max-height: none !important;
	padding: 48px 0 !important;
}

/* Nền sau ảnh chụp bài tối hơn để khung bài nổi và dễ đọc. */
body:has(.mfp-img[src*="cam-nhan-hoc-vien-map-camp"]) .mfp-bg {
	opacity: .92;
}