@font-face {
    font-family: "Opensans Light";
    src: url('../fonts/OpenSans-Light.ttf');
}

@font-face {
    font-family: "Opensans";
    src: url('../fonts/OpenSans-Regular.ttf');
}
@font-face {
    font-family: "Wedding";
    src: url('../fonts/UTM EdwardianB.ttf');
}
@font-face {
    font-family: "Opensans Semibold";
    src: url('../fonts/OpenSans-Semibold.ttf');
}

@font-face {
    font-family: "Opensans Semibold";
    src: url('../fonts/OpenSans-Semibold.ttf');
}
@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Regular.ttf');
}

/* ===========================================================================
 * Website tập đoàn (khung BRG Group) — trang chủ, cổ đông, liên hệ, lịch sử.
 *
 * CSS bám class section/row/col đặt trong UX Builder (td-…) và class do
 * shortcode in ra (bkns-…). Bố cục mẫu: bo-cuc-mau/*.txt.
 *
 * Màu chủ đạo: Tuỳ biến → Style → Colors → Primary Color (Flatsome in ra biến
 * --primary-color). --td-do lấy theo đó, --td-do-dam tự pha đậm hơn — không
 * sửa màu trong file này.
 *
 * Flatsome đặt id ngẫu nhiên cho section/row/col mỗi lần lưu — đừng bám id.
 */

:root {
    --td-do: var(--primary-color, #b3141b);
    --td-do-dam: color-mix(in srgb, var(--td-do) 68%, #000);
    --td-than: #2a2a2c;
    --td-xam: #a9a9ab;
    --td-xam-nhat: #efefef;
    --td-chu: #2b2b2d;
    --td-chu-phu: #66666a;
    --td-vien: #dcdcde;
    --td-font: "Be Vietnam Pro", "Segoe UI", Roboto, Arial, sans-serif;
    --td-soc: repeating-linear-gradient(
        -60deg,
        rgba(255, 255, 255, .07) 0 34px,
        transparent 34px 68px
    );
}

/* ---------------------------------------------------------------------------
 * Chung
 * ------------------------------------------------------------------------- */

/* Font chính chọn ở Tuỳ biến → Style → Typography (đang đặt Be
   Vietnam Pro); --td-font chỉ là dự phòng cho khối riêng của theme. */
.section[class*="td-"],
.bkns-chan-trang {
    font-family: var(--td-font);
}

.section[class*="td-"] h1,
.section[class*="td-"] h2,
.section[class*="td-"] h3,
.td-banner h2 {
    font-family: var(--td-font);
    letter-spacing: 0;
}

.section[class*="td-"] a:focus-visible,
.bkns-chan-trang a:focus-visible {
    outline: 2px solid var(--td-do);
    outline-offset: 3px;
}

/* Tiêu đề khối: chữ hoa, căn giữa */
.section .td-tieu-de {
    margin: 0 0 36px;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
}

.section .td-tieu-de--do,
.section .td-tieu-de--do a {
    font-size: 44px;
    font-weight: 700;
    color: var(--td-do);
}

.section .td-tieu-de--do a:hover {
    color: var(--td-do-dam);
}

/* Chữ nhỏ trên tiêu đề */
.section .td-nho {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--td-do);
}

/* ---------------------------------------------------------------------------
 * Header Flatsome: dải đỏ, menu chữ hoa trắng
 * (logo / menu / tìm kiếm chọn trong Tuỳ biến → Header)
 * ------------------------------------------------------------------------- */

#header .header-main,
#header .header-bottom {
    background-color: var(--td-do);
}

#header .header-main {
    border-bottom: 3px solid var(--td-do-dam);
}

/* Logo chữ (chưa chọn ảnh logo): Flatsome tô bằng màu chủ đạo — trùng nền đỏ */
#header #logo a {
    color: #fff;
    font-weight: 300;
    letter-spacing: .12em;
}

#header .header-nav-main > li > a,
#header .header-main .nav > li > a,
#header .header-main .icon-search,
#header .header-main .icon-menu {
    font-family: var(--td-font);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #fff;
}

#header .header-nav-main > li > a:hover,
#header .header-nav-main > li.active > a,
#header .header-nav-main > li.current-menu-item > a,
#header .header-nav-main > li.current-menu-ancestor > a {
    color: #fff;
    box-shadow: inset 0 -2px 0 #fff;
}

/* ---------------------------------------------------------------------------
 * Banner: ảnh trong khung container + nút "Xem thêm" góc dưới phải (như BRG)
 * ------------------------------------------------------------------------- */

body .section.td-banner-khung {
    padding-top: 30px !important;
    background: #fff;
}

.td-banner-khung .row > .col {
    padding-bottom: 0;
}

.td-banner .button.td-banner__xem {
    margin: 0 0 18px;
    border: 1px solid #fff;
    border-radius: 0;
    background: rgba(0, 0, 0, .35);
    font-weight: 500;
    letter-spacing: .04em;
    color: #fff;
    transition: background-color .2s, color .2s;
}

.td-banner .button.td-banner__xem:hover {
    background: #fff;
    color: var(--td-do-dam);
}

/* ---------------------------------------------------------------------------
 * Giới thiệu
 * ------------------------------------------------------------------------- */

body .section.td-gioi-thieu {
    position: relative;
    overflow: hidden;
    background: var(--td-than);
}

.section.td-gioi-thieu::before {
    content: "";
    position: absolute;
    top: 0;
    left: -6%;
    width: 42%;
    height: 100%;
    background: var(--td-soc);
    transform: skewX(-18deg);
    pointer-events: none;
}

.td-gioi-thieu .td-gioi-thieu__hang {
    justify-content: center;
}

.td-gioi-thieu .td-gioi-thieu__chu p {
    margin-bottom: 18px;
    font-size: 15px;
    line-height: 1.75;
    color: #e6e6e8;
    text-align: justify;
}

/* Gập: chỉ hiện đoạn đầu, bấm "Xem thêm" (tap-doan.js) để mở */
.td-gioi-thieu .td-gioi-thieu__chu.td-gap p:not(:first-child):not(.td-xem-them) {
    display: none;
}

.td-gioi-thieu .td-gioi-thieu__chu .td-xem-them {
    margin: 6px 0 0;
    text-align: center;
}

.td-gioi-thieu .td-xem-them a,
.td-gioi-thieu .td-xem-them button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: none;
    font: 500 14px/1 var(--td-font);
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #fff;
    cursor: pointer;
}

.td-gioi-thieu .td-xem-them a::after,
.td-gioi-thieu .td-xem-them button::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-top: -4px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s;
}

.td-gioi-thieu .td-xem-them [aria-expanded="true"]::after {
    margin-top: 4px;
    transform: rotate(225deg);
}

/* Ba chữ khẩu hiệu bên phải — điểm nhấn của khối */
.td-gioi-thieu .td-gioi-thieu__khau-hieu {
    align-self: center;
}

.td-gioi-thieu .td-gioi-thieu__khau-hieu p {
    margin: 0;
    padding-left: 22px;
    border-left: 3px solid var(--td-do);
    font-size: 30px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, .8);
}

/* ---------------------------------------------------------------------------
 * Lĩnh vực hoạt động
 * ------------------------------------------------------------------------- */

body .section.td-linh-vuc {
    background: #fff;
}

.td-linh-vuc .td-thanh-do {
    margin: 0;
    padding: 20px 16px;
    background: var(--td-do);
    font-size: 30px;
    font-weight: 400;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    scroll-margin-top: 120px;
}

.td-linh-vuc .row.td-linh-vuc__dau > .col {
    padding-bottom: 0;
}

/* Lưới tự chia theo số thẻ: 5 thẻ = 5 cột, bỏ qua "span" của UX Builder */
.td-linh-vuc .row.td-linh-vuc__luoi {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0;
    padding: 30px 0 60px;
}

/* clearfix ::before/::after của .row Flatsome thành ô lưới thừa — bỏ đi */
.td-linh-vuc .row.td-linh-vuc__luoi::before,
.td-linh-vuc .row.td-linh-vuc__luoi::after {
    display: none;
}

.td-linh-vuc .row.td-linh-vuc__luoi > .col.td-the {
    width: auto;
    max-width: none;
    flex-basis: auto;
    padding: 0 15px;
}

.td-the .col-inner {
    height: 100%;
}

.td-the .img,
.td-the .uxb-no-content.uxb-image {
    position: relative;
    overflow: hidden;
    margin: 0;
    aspect-ratio: 37 / 30;
    background: var(--td-xam-nhat);
}

/* Chưa chọn ảnh: Flatsome in chữ "Upload Image..." — đổi thành khung sọc */
.td-the .uxb-no-content.uxb-image {
    display: block;
    border: 0;
    font-size: 0;
    background:
        repeating-linear-gradient(-60deg, rgba(0, 0, 0, .04) 0 18px, transparent 18px 36px),
        var(--td-xam-nhat);
}

.td-the .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s;
}

.td-the:hover .img img {
    transform: scale(1.05);
}

.td-the h3 {
    margin: 18px 0 10px;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
}

.td-the h3 a {
    color: var(--td-do);
}

.td-the h3 a::after {
    /* Cả thẻ bấm được */
    content: "";
    position: absolute;
    inset: 0;
}

.td-the .col-inner {
    position: relative;
}

.td-the h3 a:hover {
    color: var(--td-do-dam);
}

.td-the p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--td-chu-phu);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

/* ---------------------------------------------------------------------------
 * Cổ đông ở trang chủ (khối "Tin hàng ngày" của BRG): 1 bài lớn trái + 3 bài nhỏ phải
 * ------------------------------------------------------------------------- */

body .section.td-tin {
    position: relative;
    overflow: hidden;
    background: var(--td-xam-nhat);
}

.section.td-tin::after {
    content: "";
    position: absolute;
    top: 0;
    right: -4%;
    width: 30%;
    height: 100%;
    background: repeating-linear-gradient(-60deg, color-mix(in srgb, var(--td-do) 5%, transparent) 0 34px, transparent 34px 68px);
    transform: skewX(-18deg);
    pointer-events: none;
}

.td-tin .section-content {
    position: relative;
    z-index: 1;
}

.td-tin .box-blog-post {
    background: #fff;
}

.td-tin .box-blog-post .box-text {
    padding: 16px 20px 20px;
}

.td-tin .box-blog-post .post-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.45;
    text-transform: uppercase;
    color: var(--td-chu);
}

.td-tin .box-blog-post:hover .post-title {
    color: var(--td-do);
}

.td-tin .box-blog-post .is-divider {
    display: none;
}

.td-tin .box-blog-post .post-meta {
    font-style: italic;
}

.td-tin .td-tin__nho .post-item {
    padding-bottom: 16px;
}

.td-tin .td-tin__nho .box-blog-post .post-title {
    font-size: 14px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

/* ---------------------------------------------------------------------------
 * Video ([ VID-EE-OH ]): 1 video lớn + 4 video nhỏ, ux_video của Flatsome
 * ------------------------------------------------------------------------- */

body .section.td-video {
    background: #fff;
}

.section .td-tieu-de--video {
    font-size: 44px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--td-chu);
}

.td-video .td-video__nho {
    margin-top: 6px;
}

/* ---------------------------------------------------------------------------
 * Trang Cổ đông (trang tin BRG): khung xám danh sách trái + ảnh cột phải
 * ------------------------------------------------------------------------- */

body .section.td-cd-trang {
    padding: 30px 0 40px !important;
    background: #fff;
}

.td-cd-trang .td-cd-trang__ds > .col-inner {
    padding: 22px 64px 34px;
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 255, 255, .5) 0 1.5px, transparent 2px) 0 0 / 20px 20px,
        #d7d7d8;
}

.td-cd-trang .td-cd-trang__ben .img,
.td-cd-trang .td-cd-trang__ben .uxb-no-content.uxb-image {
    margin: 0;
}

/* Chưa chọn ảnh cột phải: khung xám thay chữ "Upload Image..." */
.td-cd-trang .td-cd-trang__ben .uxb-no-content.uxb-image {
    display: block;
    aspect-ratio: 3 / 4;
    border: 0;
    font-size: 0;
    background: var(--td-xam-nhat);
}

/* [bkns_co_dong] — một tin: ảnh 300x250 trái, chữ phải */
.bkns-cd .bkns-cd__bai {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 28px;
    padding: 22px 0;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
}

.bkns-cd .bkns-cd__bai:last-child {
    border-bottom: 0;
}

.bkns-cd .bkns-cd__anh {
    display: block;
    aspect-ratio: 300 / 250;
    overflow: hidden;
    background: #c9c9cb;
}

.bkns-cd .bkns-cd__anh img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s;
}

.bkns-cd .bkns-cd__bai:hover .bkns-cd__anh img {
    transform: scale(1.04);
}

.bkns-cd .bkns-cd__tieu-de {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.4;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.bkns-cd .bkns-cd__tieu-de a {
    color: var(--td-chu);
}

.bkns-cd .bkns-cd__tieu-de a:hover {
    color: var(--td-do);
}

.bkns-cd .bkns-cd__ngay {
    display: block;
    margin-bottom: 16px;
    font-size: 14px;
    font-style: italic;
    color: var(--td-chu-phu);
}

.bkns-cd .bkns-cd__tom-tat {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    text-align: justify;
    color: var(--td-chu);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.bkns-cd__trong {
    padding: 30px 0;
    color: var(--td-chu-phu);
    text-align: center;
}

/* Phân trang: số tròn, trang đang xem nền đỏ */
.bkns-cd__trang {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin-top: 28px;
}

.bkns-cd__trang .page-numbers {
    display: grid;
    place-items: center;
    min-width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 14px;
    color: var(--td-chu);
}

.bkns-cd__trang .page-numbers.current {
    background: var(--td-do);
    color: #fff;
}

.bkns-cd__trang a.page-numbers:hover {
    color: var(--td-do);
}

/* ---------------------------------------------------------------------------
 * Trang Lịch sử (khung trang giới thiệu thanhthaigroup): cột trái danh mục + tin mới, phải nội dung
 * ------------------------------------------------------------------------- */

body .section.td-lich-su {
    background: #fff;
}

.td-lich-su .td-lich-su__ben h3 {
    margin: 0 0 10px;
    padding: 10px 14px;
    background: var(--td-do);
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
}

.td-lich-su .td-lich-su__ben ul {
    margin: 0 0 26px;
    padding: 0;
    list-style: none;
}

.td-lich-su .td-lich-su__ben li {
    margin: 0;
    border-bottom: 1px dashed var(--td-vien);
}

.td-lich-su .td-lich-su__ben li a {
    display: block;
    padding: 8px 4px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--td-chu);
}

.td-lich-su .td-lich-su__ben li a:hover {
    color: var(--td-do);
}

.td-lich-su .td-lich-su__noi-dung h2 {
    margin: 0 0 18px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--td-do);
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--td-chu);
}

.td-lich-su .td-lich-su__noi-dung h3 {
    margin: 24px 0 10px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: underline;
    color: var(--td-chu);
}

.td-lich-su .td-lich-su__noi-dung p {
    margin: 0 0 10px;
    font-size: 15px;
    line-height: 1.7;
    text-align: justify;
    color: var(--td-chu);
}

/* Bảng ngành nghề: chỉ kẻ ngang như bản thanhthaigroup */
.td-lich-su .td-lich-su__noi-dung table {
    width: 100%;
    max-width: 640px;
    margin: 10px auto 0;
    border-collapse: collapse;
}

.td-lich-su .td-lich-su__noi-dung table td {
    padding: 8px 10px;
    border: 0;
    border-top: 1px solid var(--td-chu);
    border-bottom: 1px solid var(--td-chu);
    font-size: 14px;
    line-height: 1.5;
    vertical-align: top;
    color: var(--td-chu);
    background: transparent;
}

.td-lich-su .td-lich-su__noi-dung table td:first-child {
    width: 150px;
    white-space: nowrap;
}

/* ---------------------------------------------------------------------------
 * Liên hệ — khối trang chủ (nền xám) và trang Liên hệ (nền trắng)
 * ------------------------------------------------------------------------- */

body .section.td-lien-he-nha {
    position: relative;
    overflow: hidden;
    background: #9d9d9f;
}

.section.td-lien-he-nha::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, .18) 0 1.5px, transparent 2px) 0 0 / 22px 22px,
        var(--td-soc);
    pointer-events: none;
}

.td-lien-he-nha .section-content {
    position: relative;
    z-index: 1;
}

.td-lien-he-nha .td-tieu-de {
    margin-bottom: 10px;
}

.bkns-td-dong {
    margin: 0 0 32px;
    font-size: 14px;
    line-height: 1.7;
    text-align: center;
    color: #fff;
}

.bkns-td-dong a {
    color: #fff;
}

.bkns-td-dong a:hover {
    text-decoration: underline;
}

.bkns-td-dong__ngan {
    margin: 0 10px;
    opacity: .7;
}

/* Form liên hệ — Contact Form 7, form "Liên hệ" có khung .bkns-lh (form-lien-he.php) */
.bkns-lh {
    --lh-nen: #fff;
    --lh-vien: var(--td-vien);
    --lh-nhan: var(--td-chu);
    max-width: 560px;
    margin: 0 auto;
}

.bkns-lh .bkns-lh__luoi {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
}

.bkns-lh .bkns-lh__o {
    margin: 0;
}

.bkns-lh .bkns-lh__o--rong {
    grid-column: 1 / -1;
}

.bkns-lh label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
    color: var(--lh-nhan);
}

.bkns-lh label span {
    color: var(--td-do);
}

.bkns-lh input[type="text"],
.bkns-lh input[type="email"],
.bkns-lh textarea {
    width: 100%;
    margin: 0;
    padding: 11px 14px;
    border: 1px solid var(--lh-vien);
    border-radius: 0;
    background: var(--lh-nen);
    box-shadow: none;
    font: 400 15px/1.5 var(--td-font);
    color: var(--td-chu);
    transition: border-color .2s, box-shadow .2s;
}

.bkns-lh input[type="text"],
.bkns-lh input[type="email"] {
    height: 46px;
}

.bkns-lh textarea {
    min-height: 130px;
    resize: vertical;
}

.bkns-lh input::placeholder,
.bkns-lh textarea::placeholder {
    color: #9a9a9e;
}

.bkns-lh input:focus-visible,
.bkns-lh textarea:focus-visible {
    border-color: var(--td-do);
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--td-do) 18%, transparent);
}

.bkns-lh .bkns-lh__nut {
    width: 100%;
    min-height: 46px;
    margin: 18px 0 0;
    border: 0;
    border-radius: 0;
    background: var(--td-do);
    font: 500 16px/1 var(--td-font);
    letter-spacing: .04em;
    text-transform: none;
    color: #fff;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color .2s;
}

.bkns-lh .bkns-lh__nut:hover {
    background: var(--td-do-dam);
}

.bkns-lh .bkns-lh__nut:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -5px;
}

/* Phần CF7 tự in */
.bkns-lh .wpcf7-form-control-wrap {
    display: block;
}

.bkns-lh .wpcf7-not-valid-tip {
    margin-top: 5px;
    font-size: 13px;
    color: var(--td-do);
}

.bkns-lh input.wpcf7-not-valid,
.bkns-lh textarea.wpcf7-not-valid {
    border-color: var(--td-do);
}

.bkns-lh .wpcf7-spinner {
    display: block;
    margin: 12px auto 0;
}

.wpcf7 form:has(.bkns-lh) .wpcf7-response-output {
    max-width: 560px;
    margin: 18px auto 0;
    padding: 12px 16px;
    border: 0;
    border-left: 4px solid var(--td-do);
    background: #fff;
    font-size: 14px;
    color: var(--td-do-dam);
}

.wpcf7 form.sent:has(.bkns-lh) .wpcf7-response-output {
    border-left-color: #1f8a4c;
    color: #145c33;
}

.bkns-lh .bkns-lh__nut:disabled {
    opacity: .6;
    cursor: wait;
}

/* Trên nền xám trang chủ: nhãn trắng, ô xám rất nhạt như BRG */
.td-lien-he-nha .bkns-lh {
    --lh-nen: #f2f2f2;
    --lh-vien: transparent;
    --lh-nhan: #fff;
}

/* Trang Liên hệ: chữ trang trí hai bên như trang contact của BRG */
.td-lien-he-nha--trang .section-content::before,
.td-lien-he-nha--trang .section-content::after {
    position: absolute;
    top: 46%;
    font-size: 40px;
    font-style: italic;
    font-weight: 700;
    line-height: 1.15;
    white-space: pre;
    pointer-events: none;
}

.td-lien-he-nha--trang .section-content::before {
    content: "booking\A        find us";
    left: 4%;
    color: #3a3a3c;
}

.td-lien-he-nha--trang .section-content::after {
    content: "opportunities\A      jobs";
    right: 4%;
    top: 18%;
    color: #2a2a2c;
}

/* ---------------------------------------------------------------------------
 * Bản đồ: khung đỏ hai bên + nhãn xám như BRG
 * ------------------------------------------------------------------------- */

body .section.td-ban-do {
    background:
        linear-gradient(90deg, var(--td-do) 0 50%, var(--td-do-dam) 50% 100%);
}

.td-ban-do .row > .col {
    padding-bottom: 0;
}

.bkns-ban-do {
    position: relative;
    height: var(--bkns-ban-do-cao, 460px);
    background: #fff;
}

.bkns-ban-do iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.bkns-ban-do .bkns-ban-do__nhan {
    position: absolute;
    right: 0;
    top: 50%;
    padding: 12px 22px;
    background: rgba(90, 90, 92, .92);
    font-size: clamp(22px, 3vw, 40px);
    font-style: italic;
    font-weight: 500;
    line-height: 1.1;
    color: #fff;
    transform: translateY(-50%);
    pointer-events: none;
}

/* ---------------------------------------------------------------------------
 * Chân trang
 * ------------------------------------------------------------------------- */

/* Chân trang Flatsome (dòng "Copyright … Flatsome Theme") — đã có dòng bản
   quyền riêng ở Website Options → Chân trang */
#footer .absolute-footer {
    display: none;
}

.bkns-chan-trang {
    border-top: 6px solid var(--td-do);
    box-shadow: inset 0 3px 0 #fff;
    background: var(--td-xam);
    color: #fff;
}

.bkns-chan-trang .bkns-chan-trang__trong {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 30px;
    align-items: center;
    padding-top: 26px;
    padding-bottom: 24px;
}

.bkns-chan-trang .bkns-chan-trang__logo {
    justify-self: center;
    color: #fff;
}

.bkns-chan-trang .bkns-chan-trang__logo img {
    width: auto;
    max-height: 64px;
}

.bkns-chan-trang .bkns-chan-trang__chu-logo {
    font-size: 40px;
    font-weight: 300;
    letter-spacing: .12em;
}

.bkns-chan-trang h3 {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
}

.bkns-chan-trang p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: #fff;
}

.bkns-chan-trang p span {
    margin: 0 6px;
    opacity: .7;
}

.bkns-chan-trang a {
    color: #fff;
}

.bkns-chan-trang a:hover {
    text-decoration: underline;
}

.bkns-chan-trang .bkns-chan-trang__ban-quyen {
    margin-top: 14px;
    opacity: .9;
}

.bkns-chan-trang .bkns-chan-trang__mxh {
    /* Nổi bên phải màn hình như BRG (không nằm trong dải chân trang) */
    position: fixed;
    right: 14px;
    top: 50%;
    z-index: 30;
    flex-direction: column;
    transform: translateY(-50%);
    display: flex;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.bkns-chan-trang .bkns-chan-trang__mxh li {
    margin: 0;
}

.bkns-chan-trang .bkns-chan-trang__mxh a {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #8e8e90;
    transition: background-color .2s;
}

.bkns-chan-trang .bkns-chan-trang__mxh a:hover {
    background: var(--td-do);
}

.bkns-chan-trang .bkns-chan-trang__mxh a::before {
    content: "";
    width: 16px;
    height: 16px;
    background: #fff;
    -webkit-mask: var(--mxh) center / contain no-repeat;
    mask: var(--mxh) center / contain no-repeat;
}

.bkns-chan-trang__mxh-facebook {
    --mxh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 8h3V4h-3c-2.8 0-4 1.7-4 4.3V10H7v4h3v8h4v-8h3l1-4h-4V8.6c0-.4.3-.6.6-.6z'/%3E%3C/svg%3E");
}

.bkns-chan-trang__mxh-youtube {
    --mxh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M23 7.2a3 3 0 0 0-2.1-2.1C19 4.6 12 4.6 12 4.6s-7 0-8.9.5A3 3 0 0 0 1 7.2 31 31 0 0 0 .5 12a31 31 0 0 0 .5 4.8 3 3 0 0 0 2.1 2.1c1.9.5 8.9.5 8.9.5s7 0 8.9-.5a3 3 0 0 0 2.1-2.1 31 31 0 0 0 .5-4.8 31 31 0 0 0-.5-4.8zM9.8 15V9l5.7 3z'/%3E%3C/svg%3E");
}

.bkns-chan-trang__mxh-tiktok {
    --mxh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.6 2h-3.4v13.2a2.9 2.9 0 1 1-2.9-2.9c.3 0 .6 0 .9.1V8.9a6.4 6.4 0 1 0 5.4 6.3V8.6a8 8 0 0 0 4.6 1.5V6.7a4.6 4.6 0 0 1-4.6-4.7z'/%3E%3C/svg%3E");
}

.bkns-chan-trang__mxh-instagram {
    --mxh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm0 8.2a3.2 3.2 0 1 1 0-6.4 3.2 3.2 0 0 1 0 6.4zM17.3 5.5a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4zM12 1C9 1 8.6 1 7.5 1.1 3.4 1.2 1.2 3.4 1.1 7.5 1 8.6 1 9 1 12s0 3.4.1 4.5c.1 4.1 2.3 6.3 6.4 6.4 1.1.1 1.5.1 4.5.1s3.4 0 4.5-.1c4.1-.1 6.3-2.3 6.4-6.4.1-1.1.1-1.5.1-4.5s0-3.4-.1-4.5C22.8 3.4 20.6 1.2 16.5 1.1 15.4 1 15 1 12 1zm0 2c2.9 0 3.3 0 4.4.1 3 .1 4.4 1.6 4.5 4.5.1 1.1.1 1.5.1 4.4s0 3.3-.1 4.4c-.1 3-1.5 4.4-4.5 4.5-1.1.1-1.5.1-4.4.1s-3.3 0-4.4-.1c-3-.1-4.4-1.5-4.5-4.5C3 15.3 3 14.9 3 12s0-3.3.1-4.4C3.2 4.6 4.6 3.2 7.6 3.1 8.7 3 9.1 3 12 3z'/%3E%3C/svg%3E");
}

.bkns-chan-trang__mxh-linkedin {
    --mxh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5zM3 9.5h4V21H3zM9.5 9.5h3.8v1.6h.1c.5-1 1.8-2 3.8-2 4 0 4.8 2.6 4.8 6V21h-4v-5.1c0-1.2 0-2.8-1.7-2.8s-2 1.3-2 2.7V21h-4z'/%3E%3C/svg%3E");
}

/* Zalo: in chữ thay icon */
.bkns-chan-trang .bkns-chan-trang__mxh a.bkns-chan-trang__mxh-zalo::before {
    content: "Zalo";
    width: auto;
    height: auto;
    background: none;
    -webkit-mask: none;
    mask: none;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
}

/* Nội dung soạn ở ACF: đoạn liền nhau như các dòng thông tin */
.bkns-chan-trang .bkns-chan-trang__noi-dung p {
    margin: 0;
}

/* ---------------------------------------------------------------------------
 * Màn hình nhỏ
 * ------------------------------------------------------------------------- */

@media (max-width: 849px) {
    .section .td-tieu-de--do,
    .section .td-tieu-de--do a,
    .section .td-tieu-de--video {
        font-size: 32px;
    }

    .td-gioi-thieu .td-gioi-thieu__khau-hieu p {
        margin-top: 10px;
        font-size: 24px;
    }

    /* Lĩnh vực: vuốt ngang, thẻ sau ló ra một chút để biết còn */
    .td-linh-vuc .row.td-linh-vuc__luoi {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 72%;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        overscroll-behavior-x: contain;
        padding: 24px 5px 40px;
        scrollbar-width: thin;
    }

    .td-linh-vuc .row.td-linh-vuc__luoi > .col.td-the {
        scroll-snap-align: start;
    }

    .td-linh-vuc .td-thanh-do {
        font-size: 22px;
    }

    .td-cd-trang .td-cd-trang__ds > .col-inner {
        padding: 10px 20px 24px;
    }

    .bkns-cd .bkns-cd__bai {
        grid-template-columns: 200px 1fr;
        gap: 18px;
    }

    .td-lien-he-nha--trang .section-content::before,
    .td-lien-he-nha--trang .section-content::after {
        display: none;
    }

    .bkns-chan-trang .bkns-chan-trang__trong {
        grid-template-columns: 1fr;
        gap: 18px;
        text-align: center;
    }

    .bkns-chan-trang .bkns-chan-trang__mxh {
        right: 8px;
    }

    body .section.td-ban-do {
        background: var(--td-do);
    }
}

@media (max-width: 549px) {
    .td-gioi-thieu .td-gioi-thieu__chu p {
        text-align: left;
    }

    .bkns-lh .bkns-lh__luoi {
        grid-template-columns: 1fr;
    }

    .bkns-cd .bkns-cd__bai {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .bkns-cd .bkns-cd__tieu-de {
        font-size: 17px;
    }

    .td-lich-su .td-lich-su__noi-dung table td:first-child {
        width: auto;
        white-space: normal;
    }

    .bkns-ban-do .bkns-ban-do__nhan {
        top: auto;
        bottom: 0;
        transform: none;
    }

    .bkns-td-dong__ngan {
        display: none;
    }

    .bkns-td-dong a:first-child::after {
        content: "";
        display: block;
    }
}

@media (prefers-reduced-motion: reduce) {
    .td-the .img img,
    .bkns-cd .bkns-cd__anh img {
        transition: none;
    }

    .td-the:hover .img img,
    .bkns-cd .bkns-cd__bai:hover .bkns-cd__anh img {
        transform: none;
    }
}