/*
Template Css: Tên miền mới .on .ad .ap
 */

/* Landing "Tên miền quốc gia mới .on.vn / .ad.vn / .ap.vn — Mở bán từ 23/11/2026" — giao diện bản 2.
   Port từ mockup Tailwind (Gemini Canvas, template_assets/html/landing_ten_mien_moi_v2.html) sang CSS viết tay.
   Hai phần:
     1. .bk-tmm…  — element có dữ liệu ([bk_tmm_tra_cuu] ô tra cứu, [bk_tmm_uu_dai] 4 thẻ ưu đãi)
                    — add_shortcode/ten-mien-moi.php.
     2. .tmm-…    — trang dựng bằng element gốc Flatsome (section > row > col > chữ gõ thẳng),
                    bố cục mẫu: template_assets/html/ten-mien-moi-ux-builder.txt.
   Mọi class đều có tiền tố tmm- / bk-tmm, không đụng trang khác.
   Bảng màu mockup: tech 50 #F0F7FF · 100 #E0F0FE · 300 #7BBEFA · 500 #2389F7 · 700 #1158B0 · 900 #083370, nhấn cam #F97316.
   Bẫy của theme đã tính:
     - assets/css/responsive.css: `.row {max-width:1230px !important}` -> row của trang đặt lại !important.
     - Flatsome tô sẵn button/input/h1-h6 (uppercase, cao 2.5em, bóng trong) -> đặt lại trong scope.
   Chữ: Be Vietnam Pro (400–900) + JetBrains Mono tự host (template_assets/fonts/ten-mien-moi/, giấy phép OFL). */

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-400-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-400-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-400-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-500-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-500-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-500-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-600-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-600-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-600-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-700-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-700-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-700-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-800-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-800-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-800-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmMono";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/jetbrains-mono-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-900-vietnamese.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-900-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "TmmSans";
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/ten-mien-moi/be-vietnam-pro-900-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --tmm-50: #f0f7ff;
    --tmm-100: #e0f0fe;
    --tmm-300: #7bbefa;
    --tmm-500: #2389f7;
    --tmm-700: #1158b0;
    --tmm-900: #083370;
    --tmm-dark: #041836;
    --tmm-cam: #f97316;
    --tmm-cam-dam: #ea580c;
    --tmm-cam-sang: #fb923c;
    --tmm-cam-50: #fff7ed;
    --tmm-cam-100: #ffedd5;
    --tmm-cam-200: #fed7aa;
    --tmm-cam-300: #fdba74;
    --tmm-bong-glow: 0 0 20px -5px rgba(35, 137, 247, .5);
    --tmm-bong-card: 0 10px 30px -5px rgba(8, 51, 112, .08);
    --tmm-bong-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);
    --tmm-bong-cam: 0 10px 15px -3px rgba(249, 115, 22, .4), 0 4px 6px -4px rgba(249, 115, 22, .4);
    --tmm-font: "TmmSans", "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --tmm-mono: "TmmMono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --tmm-luoi: linear-gradient(to right, rgba(123, 190, 250, .15) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(123, 190, 250, .15) 1px, transparent 1px);

    /* Icon có màu sẵn (ảnh nền) */
    --tmm-b-tui: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath d='M8 7V6a4 4 0 018 0v1h3a1 1 0 011 1l-1 12a2 2 0 01-2 2H7a2 2 0 01-2-2L4 8a1 1 0 011-1h3zm2 0h4V6a2 2 0 00-4 0v1z'/%3E%3C/svg%3E");
    --tmm-b-khien: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232389F7'%3E%3Cpath fill-rule='evenodd' d='M12 2l8 3v6c0 5-3.4 9.4-8 11-4.6-1.6-8-6-8-11V5l8-3zm-1.2 13.6l5-5-1.4-1.4-3.6 3.6-1.8-1.8-1.4 1.4 3.2 3.2z'/%3E%3C/svg%3E");
    --tmm-b-qua: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FDBA74'%3E%3Cpath d='M20 7h-2.2A3 3 0 0012 3.8 3 3 0 006.2 7H4a1 1 0 00-1 1v3a1 1 0 001 1h7V7h2v5h7a1 1 0 001-1V8a1 1 0 00-1-1zM9 7a1 1 0 110-2 2 2 0 012 2H9zm6 0h-2a2 2 0 012-2 1 1 0 110 2zM5 13v7a1 1 0 001 1h5v-8H5zm8 8h5a1 1 0 001-1v-7h-6v8z'/%3E%3C/svg%3E");
    --tmm-b-cua-hang: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath d='M4 3h16l2 6a3 3 0 01-5 2.2A3 3 0 0112 12a3 3 0 01-5-.8A3 3 0 012 9l2-6zM4 13.4V21h6v-5h4v5h6v-7.6a4.8 4.8 0 01-3-.5 4.9 4.9 0 01-5 .9 4.9 4.9 0 01-5-.9 4.8 4.8 0 01-3 .5z'/%3E%3C/svg%3E");
    --tmm-b-loa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath d='M20 3v18l-6-3.6V18a2 2 0 01-2 2H9a2 2 0 01-2-2v-2.4l-1-.6H4a2 2 0 01-2-2v-2a2 2 0 012-2h2l14-8z'/%3E%3C/svg%3E");
    --tmm-b-dien-thoai: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath fill-rule='evenodd' d='M7 2h10a2 2 0 012 2v16a2 2 0 01-2 2H7a2 2 0 01-2-2V4a2 2 0 012-2zm0 3v13h10V5H7zm4 14.5h2v1h-2z'/%3E%3C/svg%3E");
}

/* =====================================================================
   0. NỀN CHUNG — mọi section của trang + element dữ liệu
   ===================================================================== */

.tmm-menu,
.tmm-hero,
.tmm-qua,
.tmm-khoi,
.tmm-cta,
.bk-tmm {
    font-family: var(--tmm-font);
    color: var(--tmm-900);
    -webkit-font-smoothing: antialiased;
}

.tmm-menu *,
.tmm-hero *,
.tmm-qua *,
.tmm-khoi *,
.tmm-cta *,
.bk-tmm *,
.tmm-hero *::before,
.tmm-hero *::after,
.tmm-qua *::before,
.tmm-khoi *::before,
.tmm-khoi *::after {
    box-sizing: border-box;
}

/* Col Flatsome có padding-bottom 30px -> khoảng cách do section lo */
.tmm-menu .col,
.tmm-hero .col,
.tmm-qua .col,
.tmm-khoi .col,
.tmm-cta .col {
    padding-bottom: 0;
}

.tmm-menu .col-inner > *,
.tmm-hero .col-inner > *,
.tmm-qua .col-inner > *,
.tmm-khoi .col-inner > *,
.tmm-cta .col-inner > * {
    margin-top: 0;
    margin-bottom: 0;
}

.tmm-hero ul,
.tmm-khoi ul,
.bk-tmm ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tmm-hero li,
.tmm-khoi li,
.bk-tmm li {
    margin: 0;
}

/* Flatsome: `.col-inner ul li {margin-left:1.3em}` */
.tmm-hero .col-inner li,
.tmm-khoi .col-inner li {
    margin-left: 0;
}

/* Flatsome ≥850px: `.col:first-child .col-inner {margin-right:0}` -> thẻ căn giữa phải ép lại */
.tmm-phi-the > .col-inner,
.tmm-dk-the > .col-inner,
.tmm-cta-chu > .col-inner {
    margin-left: auto !important;
    margin-right: auto !important;
}

.tmm-hero h1, .tmm-hero h2, .tmm-hero h3, .tmm-hero h4,
.tmm-qua h2,
.tmm-khoi h2, .tmm-khoi h3,
.tmm-cta h2,
.bk-tmm h3 {
    font-family: inherit;
    color: var(--tmm-900);
    text-transform: none;
    letter-spacing: 0;
    width: auto;
}

.tmm-hero em,
.tmm-khoi em,
.tmm-cta em,
.bk-tmm em {
    font-style: normal;
}

.tmm-menu a,
.tmm-hero a,
.tmm-qua a,
.tmm-khoi a,
.tmm-cta a,
.bk-tmm a {
    text-decoration: none;
    transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s, transform .2s;
}

.tmm-menu a:focus-visible,
.tmm-hero a:focus-visible,
.tmm-qua a:focus-visible,
.tmm-khoi a:focus-visible,
.tmm-cta a:focus-visible,
.bk-tmm a:focus-visible,
.bk-tmm button:focus-visible {
    outline: 3px solid rgba(35, 137, 247, .45);
    outline-offset: 2px;
}

.bk-tmm__icon {
    width: 1em;
    height: 1em;
    flex: none;
    vertical-align: -.125em;
}

.bk-tmm__mono {
    font-family: var(--tmm-mono);
    font-weight: 700;
    color: var(--tmm-cam-dam);
}

.bk-tmm__an {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Khung 1280px như max-w-7xl của mockup (row Flatsome có gutter 15px mỗi bên) */
.tmm-menu .row,
.tmm-hero .row,
.tmm-qua .row,
.tmm-khoi .row,
.tmm-cta .row {
    max-width: 1310px !important;
}

/* Đầu khối: nhãn viên + tiêu đề giữa */
.tmm-dau .col-inner {
    text-align: center;
    margin-bottom: 56px;
}

.tmm-dau p:first-child:not(:last-child) {
    display: inline-block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tmm-500);
    background: var(--tmm-50);
    border: 1px solid var(--tmm-100);
    border-radius: 999px;
    padding: 4px 12px;
    line-height: 16px;
}

.tmm-dau h2 {
    font-size: 36px;
    line-height: 1.11;
    font-weight: 900;
    margin-top: 16px !important;
}

.tmm-dau h2:first-child {
    margin-top: 0 !important;
}

.tmm-duoi .tmm-dau .col-inner {
    margin-bottom: 48px;
}

.tmm-duoi .tmm-dau h2 {
    font-size: 30px;
    line-height: 1.2;
}

/* =====================================================================
   1. MENU TRANG (section "tmm-menu") — thanh menu kính mờ của mockup, bỏ logo vì theme đã có
   ===================================================================== */

.tmm-menu {
    background: rgba(255, 255, 255, .85);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(123, 190, 250, .3);
    box-shadow: var(--tmm-bong-sm);
    position: relative;
    z-index: 5;
}

.tmm-menu .section-bg {
    background: transparent !important;
}

.tmm-menu .col-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
}

.tmm-menu p:first-child {
    flex: 1;
    display: flex;
    justify-content: center;
    gap: 32px;
}

.tmm-menu p:first-child a {
    font-size: 14px;
    font-weight: 700;
    color: var(--tmm-900);
}

.tmm-menu p:first-child a:hover {
    color: var(--tmm-500);
}

.tmm-menu p:last-child a {
    display: inline-block;
    background: var(--tmm-500);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    padding: 10px 20px;
    border-radius: 12px;
    box-shadow: var(--tmm-bong-glow);
}

.tmm-menu p:last-child a:hover {
    background: var(--tmm-700);
    color: #fff;
}

/* =====================================================================
   2. HERO (section "tmm-hero") — lưới công nghệ, chữ trái, 3 thẻ web nghiêng phải
   ===================================================================== */

.tmm-hero {
    position: relative;
    overflow: hidden;
    padding-bottom: 112px !important;
    border-bottom: 1px solid var(--tmm-100);
}

.tmm-hero .section-bg {
    background-color: #fff !important;
    background-image: linear-gradient(to bottom, rgba(240, 247, 255, .8), rgba(240, 247, 255, 0)), var(--tmm-luoi) !important;
    background-size: 100% 100%, 30px 30px, 30px 30px !important;
}

.tmm-hero-chu .col-inner > * + * {
    margin-top: 24px !important;
}

/* Viên "Mở bán từ…" */
.tmm-hero-chu .col-inner > p:first-child {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--tmm-300);
    border-radius: 999px;
    padding: 6px 16px;
    box-shadow: var(--tmm-bong-sm);
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--tmm-700);
}

.tmm-hero-chu .col-inner > p:first-child::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--tmm-500);
    animation: tmm-nhip 2s cubic-bezier(.4, 0, .6, 1) infinite;
}

@keyframes tmm-nhip {
    50% { opacity: .5; }
}

.tmm-hero h1 {
    font-size: 56px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.025em;
}

.tmm-hero h1 em {
    color: var(--tmm-cam);
}

.tmm-hero-chu .col-inner > h1 + p {
    max-width: 512px;
    font-size: 20px;
    line-height: 1.625;
    font-weight: 500;
    color: var(--tmm-700);
}

/* Dòng "Nhà đăng ký .VN chính thức từ VNNIC" */
.tmm-hero-chu .col-inner > p:last-child {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 584px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    color: var(--tmm-700);
    background: var(--tmm-50);
    border: 1px solid var(--tmm-100);
    border-radius: 8px;
    padding: 6px 12px;
}

.tmm-hero-chu .col-inner > p:last-child::before {
    content: "";
    width: 14px;
    height: 14px;
    flex: none;
    background: var(--tmm-b-khien) center / contain no-repeat;
}

/* ---------- 3 thẻ web mẫu (col "tmm-hero-the") ---------- */

.tmm-hero-the > .col-inner {
    max-width: 512px;
    margin-left: auto;
}

.tmm-hero-the .row {
    margin: 0 !important;
    max-width: none !important;
}

.tmm-the {
    padding: 0 !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
    position: relative;
    transition: transform .3s;
}

.tmm-the > .col-inner {
    border-radius: 16px;
    padding: 16px;
    background: #fff;
    border: 1px solid var(--tmm-100);
    box-shadow: var(--tmm-bong-card);
}

.tmm-the--on {
    z-index: 3;
    transform: rotate(-2deg);
}

.tmm-the--on > .col-inner {
    border-color: var(--tmm-300);
}

.tmm-the--ad {
    z-index: 2;
    transform: translate(32px, -32px) rotate(3deg);
}

.tmm-the--ad > .col-inner {
    background: rgba(8, 51, 112, .85);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-color: rgba(123, 190, 250, .2);
    box-shadow: var(--tmm-bong-glow);
}

.tmm-the--ap {
    z-index: 1;
    transform: translate(-16px, -48px) rotate(-3deg);
}

.tmm-the--on:hover { transform: translateY(-8px); }
.tmm-the--ad:hover { transform: translate(32px, -40px); }
.tmm-the--ap:hover { transform: translate(-16px, -56px); }

/* Dòng đầu thẻ: tên miền + nhãn */
.tmm-the .col-inner > p:first-child {
    display: flex;
    align-items: center;
    font-family: var(--tmm-mono);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    color: var(--tmm-900);
    border-bottom: 1px solid var(--tmm-100);
    padding-bottom: 8px;
    margin-bottom: 12px !important;
}

.tmm-the .col-inner > p:first-child strong {
    font-weight: 700;
    color: var(--tmm-cam);
    margin-right: auto;
}

.tmm-the .col-inner > p:first-child em {
    margin-left: 8px;
    font-family: var(--tmm-font);
    font-size: 10px;
    line-height: 15px;
    font-weight: 900;
    text-transform: uppercase;
    color: var(--tmm-cam-dam);
    background: var(--tmm-cam-50);
    padding: 2px 8px;
    border-radius: 4px;
}

/* .on: ô icon túi + 2 vạch + nút "Mua" */
.tmm-the--on .col-inner > p:nth-child(2) {
    display: flex;
    gap: 12px;
    min-height: 64px;
}

.tmm-the--on .col-inner > p:nth-child(2)::before {
    content: "";
    width: 64px;
    height: 64px;
    flex: none;
    border-radius: 12px;
    background: var(--tmm-cam-50) var(--tmm-b-tui) center / 20px no-repeat;
}

.tmm-the--on .col-inner > p:nth-child(2)::after {
    content: "";
    order: 1;
    width: 128px;
    height: 32px;
    align-self: center;
    background:
        linear-gradient(var(--tmm-100), var(--tmm-100)) 0 0 / 96px 12px no-repeat,
        linear-gradient(var(--tmm-300), var(--tmm-300)) 0 16px / 128px 16px no-repeat;
    border-radius: 4px;
}

.tmm-the--on .col-inner > p:nth-child(2) b {
    order: 2;
    margin-left: auto;
    align-self: flex-end;
    background: var(--tmm-cam);
    color: #fff;
    font-size: 10px;
    line-height: 15px;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 8px;
}

/* .ad: thẻ tối, ô form giả */
.tmm-the--ad .col-inner > p:first-child {
    color: #fff;
    border-bottom-color: var(--tmm-700);
}

.tmm-the--ad .col-inner > p:first-child strong {
    color: var(--tmm-cam-sang);
}

.tmm-the--ad .col-inner > p:first-child em {
    color: var(--tmm-cam-sang);
    background: rgba(249, 115, 22, .2);
}

.tmm-the--ad .col-inner > p:nth-child(2) {
    font-size: 10px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: .05em;
    color: var(--tmm-cam-sang);
}

.tmm-the--ad h4 {
    color: #fff !important;
    font-size: 18px;
    line-height: 28px;
    font-weight: 900;
    margin-top: 4px !important;
}

.tmm-the--ad h4::after {
    content: "";
    display: block;
    height: 32px;
    margin-top: 12px;
    background:
        linear-gradient(var(--tmm-cam), var(--tmm-cam)) right / 48px 100% no-repeat,
        linear-gradient(var(--tmm-900), var(--tmm-900)) left / calc(100% - 56px) 100% no-repeat;
    border-radius: 4px;
}

/* .ap: 2 bong bóng chat */
.tmm-the--ap .col-inner > p:first-child {
    border-bottom-color: var(--tmm-50);
}

.tmm-the--ap ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tmm-the--ap li {
    font-size: 10px;
    line-height: 15px;
    padding: 8px;
    border-radius: 8px;
    max-width: max-content;
}

.tmm-the--ap li:first-child {
    align-self: flex-end;
    background: var(--tmm-50);
    color: var(--tmm-900);
    border: 1px solid var(--tmm-100);
    border-bottom-right-radius: 0;
}

.tmm-the--ap li:last-child {
    background: var(--tmm-cam);
    color: #fff;
    border-bottom-left-radius: 0;
    box-shadow: var(--tmm-bong-sm);
}

/* ---------- Ô tra cứu hero ([bk_tmm_tra_cuu kieu="hero"]) ---------- */

.bk-tmm-tc--hero {
    max-width: 576px;
    margin-bottom: 0;
}

.bk-tmm-tc__dong {
    display: flex;
    gap: 8px;
}

.bk-tmm-tc--hero .bk-tmm-tc__dong {
    background: #fff;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid var(--tmm-100);
    box-shadow: var(--tmm-bong-card);
}

.bk-tmm-tc__khung {
    position: relative;
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
}

.bk-tmm-tc__lenh {
    position: absolute;
    left: 16px;
    width: 18px;
    height: 18px;
    color: var(--tmm-300);
    pointer-events: none;
}

.bk-tmm .bk-tmm-tc__o {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 16px 0 48px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    box-shadow: none;
    font-family: var(--tmm-mono);
    font-size: 18px;
    font-weight: 700;
    color: var(--tmm-900);
    outline: none;
}

.bk-tmm .bk-tmm-tc__o::placeholder {
    color: var(--tmm-300);
    opacity: 1;
}

.bk-tmm .bk-tmm-tc__nut {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 48px;
    min-height: 0;
    margin: 0;
    padding: 0 32px;
    border: 0;
    border-radius: 12px;
    background: var(--tmm-500);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0;
    white-space: nowrap;
    box-shadow: var(--tmm-bong-glow);
    cursor: pointer;
    transition: background-color .2s, transform .1s;
}

.bk-tmm .bk-tmm-tc__nut:hover {
    background: var(--tmm-700);
    color: #fff;
}

.bk-tmm .bk-tmm-tc__nut:active {
    transform: scale(.95);
}

.bk-tmm .bk-tmm-tc__nut:disabled {
    opacity: .7;
    cursor: wait;
}

/* Khung 3 ô kết quả (hiện sau khi bấm Kiểm Tra) */
.bk-tmm-tc__kq[hidden] {
    display: none !important;
}

.bk-tmm-tc__kq {
    margin-top: 12px;
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 16px;
    box-shadow: var(--tmm-bong-card);
    padding: 8px 12px;
}

.bk-tmm-tc__tieu-de {
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    color: var(--tmm-700);
    margin: 4px 0 4px !important;
}

.bk-tmm-tc__chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--tmm-50);
}

.bk-tmm-tc__tieu-de + .bk-tmm-tc__chip,
.bk-tmm-tc__chip:first-child {
    border-top: 0;
}

.bk-tmm-tc__chip > div {
    min-width: 0;
}

.bk-tmm-tc__ten {
    display: block;
    font-family: var(--tmm-mono);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    color: var(--tmm-900);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bk-tmm-tc__tt {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: var(--tmm-300);
}

.bk-tmm-tc__chip[data-trang-thai="dang"] .bk-tmm-tc__tt { color: var(--tmm-700); }
.bk-tmm-tc__chip[data-trang-thai="trong"] .bk-tmm-tc__tt { color: var(--tmm-500); }
.bk-tmm-tc__chip[data-trang-thai="tang"] .bk-tmm-tc__tt { color: var(--tmm-cam); }
.bk-tmm-tc__chip[data-trang-thai="co_chu"] .bk-tmm-tc__tt { color: #b91c1c; }
.bk-tmm-tc__chip[data-trang-thai="loi"] .bk-tmm-tc__tt { color: var(--tmm-700); }

.bk-tmm-tc__chip[data-trang-thai="dang"] .bk-tmm-tc__tt .bk-tmm__icon {
    animation: tmm-nhip 1s ease-in-out infinite;
}

.bk-tmm-tc__giu {
    flex: none;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    color: #fff !important;
    background: var(--tmm-cam);
    padding: 8px 14px;
    border-radius: 8px;
}

.bk-tmm-tc__giu:hover {
    background: var(--tmm-cam-dam);
}

.bk-tmm-tc__chip[data-trang-thai="co_chu"] .bk-tmm-tc__giu {
    background: var(--tmm-100);
    color: var(--tmm-300) !important;
    cursor: not-allowed;
}

/* =====================================================================
   3. DẢI QUÀ .ap (section "tmm-qua") — đè lên mép dưới hero
   ===================================================================== */

.tmm-qua {
    position: relative;
    z-index: 4;
    margin-top: -32px;
    overflow: visible !important;
}

.tmm-qua .section-bg {
    background: transparent !important;
}

.tmm-qua .row {
    max-width: 1054px !important;
}

.tmm-qua-the > .col-inner {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    align-items: center;
    column-gap: 20px;
    padding: 32px;
    border-radius: 16px;
    background: linear-gradient(to right, var(--tmm-700), var(--tmm-900));
    border: 1px solid rgba(35, 137, 247, .3);
    box-shadow: var(--tmm-bong-card);
    color: #fff;
    transition: box-shadow .2s;
}

.tmm-qua-the > .col-inner:hover {
    box-shadow: var(--tmm-bong-glow);
}

.tmm-qua-the .col-inner > * {
    grid-column: 2;
}

/* Ô ".ap" */
.tmm-qua-the .col-inner > p:first-child {
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #fff;
    box-shadow: 0 6px 16px -4px rgba(4, 24, 54, .35);
    font-family: var(--tmm-mono);
    font-size: 24px;
    font-weight: 800;
    color: var(--tmm-cam-dam);
}

.tmm-qua-the .col-inner > p:nth-child(2) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--tmm-cam-300);
    margin-bottom: 4px !important;
}

.tmm-qua-the .col-inner > p:nth-child(2)::before {
    content: "";
    width: 10px;
    height: 10px;
    background: var(--tmm-b-qua) center / contain no-repeat;
}

.tmm-qua h2 {
    color: #fff;
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
}

.tmm-qua-the .col-inner > h2 + p {
    font-size: 14px;
    line-height: 20px;
    color: var(--tmm-100);
    margin-top: 4px !important;
}

/* Nút "Nhận Quà Ngay" */
.tmm-qua-the .col-inner > p:last-child {
    grid-column: 3;
    grid-row: 1 / span 3;
    margin-left: 4px !important;
}

.tmm-qua-the .col-inner > p:last-child a {
    display: inline-block;
    padding: 14px 32px;
    border-radius: 12px;
    background: #fff;
    color: var(--tmm-900);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
}

.tmm-qua-the .col-inner > p:last-child a:hover {
    background: var(--tmm-cam);
    color: #fff;
    transform: scale(1.05);
}

/* =====================================================================
   4. 4 THẺ ƯU ĐÃI ([bk_tmm_uu_dai]) — mockup bản 3: 4 thẻ trắng đồng đều, nút xanh
   ===================================================================== */

.bk-tmm-ud {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.bk-tmm-ud__the {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 16px;
    padding: 32px;
    transition: box-shadow .25s;
    scroll-margin-top: 120px;
}

.bk-tmm-ud__the:hover {
    box-shadow: 0 20px 40px -10px rgba(8, 51, 112, .15);
}

.bk-tmm-ud__goc {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    background: var(--tmm-cam);
    color: #fff;
    font-size: 10px;
    line-height: 15px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 4px 16px;
    border-bottom-left-radius: 12px;
}

.bk-tmm-ud__dau {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
}

.bk-tmm-ud__so {
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--tmm-900);
}

.bk-tmm-ud__nhan {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.bk-tmm-ud__vien {
    font-family: var(--tmm-mono);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    color: #fff;
    background: var(--tmm-cam);
    padding: 4px 12px;
    border-radius: 999px;
    white-space: nowrap;
}

.bk-tmm-ud__vien--nho {
    font-size: 13px;
    padding: 4px 10px;
}

.bk-tmm .bk-tmm-ud__ten {
    font-size: 22px;
    line-height: 1.375;
    font-weight: 700;
    color: var(--tmm-900);
    margin: 0 0 4px;
}

.bk-tmm-ud__phu {
    font-size: 15px;
    line-height: 22px;
    color: var(--tmm-700);
    margin: 0 0 8px !important;
}

.bk-tmm-ud__gia {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 8px;
    margin-bottom: 24px;
}

.bk-tmm-ud__gia strong {
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.025em;
    color: var(--tmm-900);
}

.bk-tmm-ud__gia span {
    font-size: 15px;
    font-weight: 500;
    color: var(--tmm-700);
}

.bk-tmm-ud__ds-tieu-de {
    font-size: 11px;
    line-height: 16px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tmm-500);
    margin: 0 0 16px !important;
}

.bk-tmm .bk-tmm-ud__ds {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
    margin-bottom: 16px;
}

.bk-tmm .bk-tmm-ud__them {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.bk-tmm-ud__ds li,
.bk-tmm-ud__them li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    line-height: 22px;
    font-weight: 500;
    color: var(--tmm-900);
}

.bk-tmm-ud__ds .bk-tmm__icon,
.bk-tmm-ud__them .bk-tmm__icon {
    width: 16px;
    height: 16px;
    margin-top: 3px;
    color: var(--tmm-cam);
}

.bk-tmm-ud__the--tich_dam .bk-tmm-ud__ds .bk-tmm__icon,
.bk-tmm-ud__the--tich_dam .bk-tmm-ud__them .bk-tmm__icon {
    color: var(--tmm-900);
}

.bk-tmm-ud__them li.bk-tmm-ud__them--qua .bk-tmm__icon {
    color: var(--tmm-500);
}

.bk-tmm-ud__them--qua strong {
    color: var(--tmm-cam);
}

.bk-tmm-ud__ten-mien {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
}

.bk-tmm-ud__ten-mien span {
    font-family: var(--tmm-mono);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    color: var(--tmm-cam-dam);
    background: var(--tmm-cam-50);
    border: 1px solid var(--tmm-cam-100);
    padding: 6px 12px;
    border-radius: 8px;
}

.bk-tmm-ud__mo-ta {
    flex: 1;
    font-size: 14px;
    line-height: 21px;
    color: var(--tmm-700);
    margin: 0 0 24px !important;
}

.bk-tmm-ud__mo-ta strong {
    font-weight: 700;
}

.bk-tmm-ud__nut {
    display: block;
    width: 100%;
    margin-top: auto;
    text-align: center;
    padding: 14px 16px;
    border-radius: 12px;
    font-size: 15px;
    line-height: 20px;
    font-weight: 700;
    background: var(--tmm-500);
    color: #fff !important;
    box-shadow: var(--tmm-bong-glow);
}

.bk-tmm-ud__nut:hover {
    background: var(--tmm-700);
}

/* Kiểu thẻ cũ vẫn chọn được ở ACF */
.bk-tmm-ud__the--noi_bat {
    border: 2px solid var(--tmm-cam-300);
}

.bk-tmm-ud__the--noi_bat .bk-tmm-ud__nut {
    background: var(--tmm-cam);
}

.bk-tmm-ud__the--nhat {
    background: var(--tmm-50);
}

.bk-tmm-ud__the--toi {
    background: var(--tmm-900);
    border-color: var(--tmm-700);
}

.bk-tmm-ud__the--toi .bk-tmm-ud__so,
.bk-tmm .bk-tmm-ud__the--toi .bk-tmm-ud__ten,
.bk-tmm-ud__the--toi .bk-tmm-ud__gia strong,
.bk-tmm-ud__the--toi .bk-tmm-ud__ds li,
.bk-tmm-ud__the--toi .bk-tmm-ud__them li {
    color: #fff;
}

.bk-tmm-ud__the--toi .bk-tmm-ud__phu,
.bk-tmm-ud__the--toi .bk-tmm-ud__gia span,
.bk-tmm-ud__the--toi .bk-tmm-ud__mo-ta {
    color: var(--tmm-100);
}

@media (max-width: 639px) {
    .bk-tmm .bk-tmm-ud__ds {
        grid-template-columns: minmax(0, 1fr);
    }

    .bk-tmm-ud__gia strong {
        font-size: 34px;
    }
}

/* =====================================================================
   5. PHÍ SÀN (section "tmm-phi-san") — thẻ trắng giữa, 2 thanh so sánh
   ===================================================================== */

.tmm-phi-san {
    border-top: 1px solid var(--tmm-100);
    border-bottom: 1px solid var(--tmm-100);
}

.tmm-phi-the > .col-inner {
    max-width: 832px;
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 24px;
    padding: 40px;
    box-shadow: var(--tmm-bong-sm);
    text-align: center;
}

.tmm-phi-san h3 {
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
    margin-bottom: 8px !important;
}

.tmm-phi-san h3 em {
    font-family: var(--tmm-mono);
    color: var(--tmm-cam-dam);
    background: var(--tmm-cam-50);
    border: 1px solid var(--tmm-cam-100);
    padding: 2px 8px;
    border-radius: 4px;
}

/* Câu dẫn */
.tmm-phi-the .col-inner > p:nth-of-type(1) {
    max-width: none;
    margin: 0 auto 32px !important;
    font-size: 14px;
    line-height: 20px;
    color: var(--tmm-700);
}

/* Dòng nhãn trên mỗi thanh */
.tmm-phi-the .col-inner > p:nth-of-type(2),
.tmm-phi-the .col-inner > p:nth-of-type(4) {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    max-width: 512px;
    margin: 0 auto 8px !important;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    color: var(--tmm-700);
    text-align: left;
}

.tmm-phi-the .col-inner > p:nth-of-type(4) {
    margin-top: 24px !important;
}

.tmm-phi-the .col-inner > p:nth-of-type(2) strong,
.tmm-phi-the .col-inner > p:nth-of-type(4) strong {
    font-weight: 700;
}

.tmm-phi-the .col-inner > p:nth-of-type(4) strong b {
    font-family: var(--tmm-mono);
    color: var(--tmm-cam);
}

.tmm-phi-the .col-inner > p:nth-of-type(4) em {
    color: var(--tmm-500);
}

/* Thanh */
.tmm-phi-the .col-inner > p:nth-of-type(3),
.tmm-phi-the .col-inner > p:nth-of-type(5) {
    display: flex;
    max-width: 512px;
    height: 40px;
    margin: 0 auto !important;
    border-radius: 12px;
    overflow: hidden;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-align: left;
}

.tmm-phi-the .col-inner > p:nth-of-type(3) b,
.tmm-phi-the .col-inner > p:nth-of-type(5) b {
    display: flex;
    align-items: center;
    padding: 0 16px;
    font-weight: 700;
}

.tmm-phi-the .col-inner > p:nth-of-type(3) b:first-child {
    width: 75%;
    background: var(--tmm-300);
}

.tmm-phi-the .col-inner > p:nth-of-type(3) b:last-child {
    width: 25%;
    justify-content: center;
    background: var(--tmm-900);
}

.tmm-phi-the .col-inner > p:nth-of-type(5) {
    box-shadow: var(--tmm-bong-glow);
}

.tmm-phi-the .col-inner > p:nth-of-type(5) b {
    width: 100%;
    background: var(--tmm-500);
}

/* Câu chốt */
.tmm-phi-the .col-inner > p:nth-of-type(6) {
    display: inline-block;
    margin-top: 32px !important;
    background: var(--tmm-50);
    border: 1px solid var(--tmm-100);
    color: var(--tmm-900);
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    padding: 12px 24px;
    border-radius: 12px;
}

/* =====================================================================
   6. CHỌN ĐÚNG ĐUÔI (section "tmm-duoi") — 3 thẻ giữa, icon cam
   ===================================================================== */

.tmm-duoi-the > .col-inner {
    height: 100%;
    padding: 24px;
    border: 1px solid var(--tmm-100);
    border-radius: 16px;
    text-align: center;
    transition: border-color .2s;
}

.tmm-duoi-the > .col-inner:hover {
    border-color: var(--tmm-cam-300);
}

.tmm-duoi-the > .col-inner::before {
    content: "";
    display: block;
    width: 64px;
    height: 64px;
    margin: 0 auto 16px;
    border-radius: 16px;
    background: var(--tmm-cam-50) var(--tmm-b-cua-hang) center / 24px no-repeat;
    transition: transform .2s;
}

.tmm-duoi-the--ad > .col-inner::before { background-image: var(--tmm-b-loa); }
.tmm-duoi-the--ap > .col-inner::before { background-image: var(--tmm-b-dien-thoai); }

.tmm-duoi-the > .col-inner:hover::before {
    transform: scale(1.1);
}

.tmm-duoi-the .col-inner > p:first-child {
    font-family: var(--tmm-mono);
    font-size: 24px;
    line-height: 32px;
    font-weight: 800;
    color: var(--tmm-cam-dam);
    margin-bottom: 8px !important;
}

.tmm-duoi-the h3 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    margin-bottom: 8px !important;
}

.tmm-duoi-the .col-inner > p:last-child {
    font-size: 12px;
    line-height: 16px;
    color: var(--tmm-700);
}

/* =====================================================================
   7. 3 BƯỚC + UY TÍN (section "tmm-buoc")
   ===================================================================== */

.tmm-buoc {
    border-top: 1px solid var(--tmm-100);
}

.tmm-buoc h2 {
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
}

.tmm-buoc-cot h2 {
    margin-bottom: 32px !important;
}

.tmm-buoc-cot ul {
    counter-reset: tmm-buoc;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.tmm-buoc-cot li {
    counter-increment: tmm-buoc;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 16px;
    align-items: start;
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 16px;
    padding: 20px;
    box-shadow: var(--tmm-bong-sm);
    font-size: 14px;
    line-height: 20px;
    color: var(--tmm-700);
}

.tmm-buoc-cot li::before {
    content: counter(tmm-buoc, decimal-leading-zero);
    grid-row: 1 / span 2;
    font-family: var(--tmm-mono);
    font-size: 30px;
    line-height: 36px;
    font-weight: 800;
    color: var(--tmm-300);
}

.tmm-buoc-cot li strong {
    display: block;
    font-size: 18px;
    line-height: 28px;
    font-weight: 700;
    color: var(--tmm-900);
    margin-bottom: 4px;
}

.tmm-uy-tin > .col-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.tmm-uy-tin h2 {
    margin-bottom: 24px !important;
}

.tmm-uy-tin ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px !important;
}

.tmm-uy-tin li {
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 12px;
    padding: 16px;
    box-shadow: var(--tmm-bong-sm);
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: var(--tmm-700);
}

.tmm-uy-tin li strong {
    display: block;
    font-size: 20px;
    line-height: 28px;
    font-weight: 900;
    color: var(--tmm-500);
    margin-bottom: 4px;
}

.tmm-uy-tin .col-inner > p:last-child {
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    color: var(--tmm-700);
    background: rgba(224, 240, 254, .5);
    border: 1px solid var(--tmm-100);
    border-radius: 12px;
    padding: 16px;
}

.tmm-uy-tin .col-inner > p:last-child strong {
    font-weight: 700;
}

/* =====================================================================
   8. ĐIỀU KIỆN (section "tmm-dieu-kien")
   ===================================================================== */

.tmm-dieu-kien {
    border-top: 1px solid var(--tmm-100);
}

.tmm-dk-the > .col-inner {
    max-width: 960px;
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 24px;
    padding: 40px;
    box-shadow: var(--tmm-bong-sm);
}

.tmm-dk-the h2 {
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
    margin-bottom: 24px !important;
}

.tmm-khoi.tmm-dieu-kien .tmm-dk-the ul {
    list-style: disc;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tmm-dk-the li {
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: var(--tmm-700);
}

.tmm-dk-the li::marker {
    color: var(--tmm-500);
}

.tmm-dk-the li em {
    font-weight: 700;
    color: var(--tmm-cam-dam);
}

.tmm-dk-the .col-inner > p:last-child {
    margin-top: 32px !important;
    padding-top: 20px;
    border-top: 1px solid var(--tmm-50);
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    color: var(--tmm-500);
}

/* =====================================================================
   9. KÊU GỌI CUỐI TRANG (section "tmm-cta") — nền xanh sậm + lưới mờ
   ===================================================================== */

.tmm-cta {
    position: relative;
    overflow: hidden;
    color: #fff;
}

.tmm-cta .section-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--tmm-luoi);
    background-size: 30px 30px;
    opacity: .2;
}

.tmm-cta-chu > .col-inner {
    max-width: 640px;
    text-align: center;
}

.tmm-cta h2 {
    color: #fff;
    font-size: 36px;
    line-height: 40px;
    font-weight: 900;
    margin-bottom: 16px !important;
}

.tmm-cta-chu .col-inner > h2 + p {
    font-size: 16px;
    line-height: 24px;
    color: var(--tmm-100);
    margin-bottom: 32px !important;
}

.tmm-cta-chu em {
    font-weight: 700;
    color: var(--tmm-cam-sang);
}

.tmm-cta-chu .col-inner > p:last-child {
    margin-top: 24px !important;
    font-size: 14px;
    line-height: 20px;
    color: var(--tmm-100);
}

.tmm-cta-chu .col-inner > p:last-child a {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin-left: 4px;
}

/* Ô nhập cuối trang ([bk_tmm_tra_cuu kieu="cta"]) */
.bk-tmm-tc--cta {
    margin: 0;
}

.bk-tmm-tc--cta .bk-tmm-tc__dong {
    gap: 12px;
}

.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__o {
    height: 56px;
    padding: 0 48px 0 16px;
    background: #fff;
    border: 2px solid transparent;
    border-radius: 12px;
}

.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__o:focus {
    border-color: var(--tmm-cam);
}

.bk-tmm-tc__vn {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-family: var(--tmm-mono);
    font-size: 14px;
    color: var(--tmm-300);
    pointer-events: none;
}

.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__nut {
    height: 56px;
    font-size: 18px;
    background: var(--tmm-cam);
    box-shadow: var(--tmm-bong-cam);
}

.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__nut:hover {
    background: var(--tmm-cam-dam);
}

.bk-tmm-tc--cta .bk-tmm-tc__kq {
    text-align: left;
}

/* =====================================================================
   10. RESPONSIVE (mốc của mockup: md 768px, lg 1024px, sm 640px)
   ===================================================================== */

@media (max-width: 1023px) {
    .tmm-hero .tmm-hero-chu,
    .tmm-hero .tmm-hero-the {
        flex-basis: 100%;
        max-width: 100%;
    }

    .tmm-hero-the {
        margin-top: 48px;
    }

    .tmm-hero-the > .col-inner {
        margin: 0 auto;
    }

    .tmm-hero h1 {
        font-size: 48px;
    }

    .tmm-buoc-cot,
    .tmm-uy-tin {
        flex-basis: 100% !important;
        max-width: 100% !important;
    }

    .tmm-uy-tin {
        margin-top: 48px;
    }
}

@media (max-width: 767px) {
    .tmm-menu p:first-child {
        display: none;
    }

    .tmm-menu .col-inner {
        justify-content: flex-end;
    }

    .tmm-qua-the > .col-inner {
        grid-template-columns: 56px 1fr;
        row-gap: 0;
    }

    .tmm-qua-the .col-inner > p:last-child {
        grid-column: 1 / -1;
        grid-row: auto;
        margin: 24px 0 0 !important;
    }

    .tmm-qua-the .col-inner > p:last-child a {
        display: block;
        text-align: center;
    }

    .bk-tmm-ud {
        grid-template-columns: minmax(0, 1fr);
    }

    .tmm-duoi-the + .tmm-duoi-the {
        margin-top: 24px;
    }
}

@media (max-width: 639px) {
    .tmm-hero h1 {
        font-size: 36px;
    }

    .tmm-hero-chu .col-inner > h1 + p {
        font-size: 18px;
    }

    .bk-tmm-tc__dong {
        flex-direction: column;
    }

    .bk-tmm .bk-tmm-tc__nut {
        width: 100%;
    }

    .tmm-the--ad { transform: translate(16px, -24px) rotate(3deg); }
    .tmm-the--ap { transform: translate(-8px, -40px) rotate(-3deg); }
    .tmm-the--ad:hover { transform: translate(16px, -32px); }
    .tmm-the--ap:hover { transform: translate(-8px, -48px); }

    .tmm-dau h2 {
        font-size: 30px;
        line-height: 1.2;
    }

    .tmm-qua-the > .col-inner,
    .bk-tmm-ud__the {
        padding: 24px;
    }

    .tmm-qua h2 {
        font-size: 20px;
        line-height: 28px;
    }

    .tmm-phi-the > .col-inner,
    .tmm-dk-the > .col-inner {
        padding: 32px;
    }

    .tmm-dk-the li {
        font-size: 14px;
        line-height: 20px;
    }

    .tmm-cta h2 {
        font-size: 30px;
        line-height: 36px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tmm-hero-chu .col-inner > p:first-child::before,
    .bk-tmm-tc__chip .bk-tmm__icon {
        animation: none;
    }

    .tmm-the,
    .tmm-duoi-the > .col-inner::before,
    .tmm-qua-the .col-inner > p:last-child a {
        transition: none;
    }
}

/* =====================================================================
   11. BẢN ĐỒ THẾ GIỚI — .VN nối ra thế giới (images/ten-mien-moi/ban-do-*.svg, chấm + đường bay tự chạy)
   ===================================================================== */

.tmm-hero .section-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../images/ten-mien-moi/ban-do-sang.svg") 62% 46% / max(1440px, 100%) auto no-repeat;
    /* mờ dần sang trái: chữ + ô tra cứu bên trái không bị chấm đè */
    -webkit-mask-image: linear-gradient(to right, transparent 18%, #000 52%);
    mask-image: linear-gradient(to right, transparent 18%, #000 52%);
    opacity: .85;
    pointer-events: none;
}

.tmm-hero .section-content {
    position: relative;
    z-index: 1;
}

.tmm-cta .section-bg::before {
    content: "";
    position: absolute;
    inset: 8% 0;
    background: url("../images/ten-mien-moi/ban-do-toi.svg") center / contain no-repeat;
    opacity: 1;
    pointer-events: none;
}

.tmm-cta .section-content {
    position: relative;
    z-index: 1;
}

@media (max-width: 1023px) {
    .tmm-hero .section-bg::after {
        top: auto;
        height: 560px;
        background-position: 78% bottom;
        background-size: 240% auto;
        -webkit-mask-image: none;
        mask-image: none;
        opacity: .7;
    }
}

/* =====================================================================
   12. HIỆU ỨNG — hero hiện dần lúc tải, 3 thẻ trôi nhẹ, các khối hiện khi cuộn tới
   (lớp tmm-an / tmm-hien do template_assets/js/ten-mien-moi.js gắn; tắt hết khi máy chọn giảm chuyển động)
   ===================================================================== */

@keyframes tmm-len {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: none; }
}

@keyframes tmm-troi {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@media (prefers-reduced-motion: no-preference) {
    .tmm-hero-chu .col-inner > * {
        animation: tmm-len .7s cubic-bezier(.2, .7, .2, 1) both;
    }

    .tmm-hero-chu .col-inner > :nth-child(2) { animation-delay: .08s; }
    .tmm-hero-chu .col-inner > :nth-child(3) { animation-delay: .16s; }
    .tmm-hero-chu .col-inner > :nth-child(4) { animation-delay: .24s; }
    .tmm-hero-chu .col-inner > :nth-child(5) { animation-delay: .32s; }

    .tmm-the > .col-inner {
        animation: tmm-len .8s cubic-bezier(.2, .7, .2, 1) both, tmm-troi 6s ease-in-out 1.4s infinite;
    }

    .tmm-the--on > .col-inner { animation-delay: .25s, 1.4s; }
    .tmm-the--ad > .col-inner { animation-delay: .4s, 2.4s; }
    .tmm-the--ap > .col-inner { animation-delay: .55s, 3.4s; }

    .tmm-qua-the > .col-inner {
        animation: tmm-len .8s cubic-bezier(.2, .7, .2, 1) .5s both;
    }

    /* Hiện khi cuộn tới */
    .tmm-an {
        opacity: 0;
        transform: translateY(28px);
    }

    .tmm-an.tmm-hien {
        opacity: 1;
        transform: none;
        transition: opacity .7s cubic-bezier(.2, .7, .2, 1) var(--tmm-tre, 0ms), transform .7s cubic-bezier(.2, .7, .2, 1) var(--tmm-tre, 0ms);
    }

    /* Thanh phí sàn chạy dài ra khi khối hiện */
    .tmm-phi-the > .col-inner.tmm-an > p:nth-of-type(3),
    .tmm-phi-the > .col-inner.tmm-an > p:nth-of-type(5) {
        clip-path: inset(0 100% 0 0 round 12px);
    }

    .tmm-phi-the > .col-inner.tmm-an.tmm-hien > p:nth-of-type(3),
    .tmm-phi-the > .col-inner.tmm-an.tmm-hien > p:nth-of-type(5) {
        clip-path: inset(0 0 0 0 round 12px);
        transition: clip-path 1.1s cubic-bezier(.2, .7, .2, 1) .35s;
    }

    .tmm-phi-the > .col-inner.tmm-an.tmm-hien > p:nth-of-type(5) {
        transition-delay: .6s;
    }

    /* Thẻ ưu đãi / thẻ đuôi nổi lên khi rê chuột */
    .tmm-duoi-the > .col-inner {
        transition: box-shadow .25s, border-color .25s, transform .25s;
    }

    .tmm-duoi-the > .col-inner:hover {
        transform: translateY(-4px);
    }
}

/* =====================================================================
   13. NÂNG CẤP CHI TIẾT — giữ bố cục mockup, làm kỹ chiều sâu / nhịp chữ / tương tác
   ===================================================================== */

/* Hero: quầng sáng sau 3 thẻ, "của bạn?" chuyển cam, bớt khoảng trống đáy */
.tmm-hero {
    padding-bottom: 96px !important;
}

.tmm-hero-the > .col-inner {
    position: relative;
}

.tmm-hero-the > .col-inner::before {
    content: "";
    position: absolute;
    inset: -12% -18% -20% -10%;
    background:
        radial-gradient(closest-side at 62% 42%, rgba(35, 137, 247, .18), transparent),
        radial-gradient(closest-side at 30% 78%, rgba(249, 115, 22, .12), transparent);
    filter: blur(8px);
    pointer-events: none;
    z-index: 0;
}

.tmm-hero h1 em {
    background: linear-gradient(100deg, var(--tmm-cam) 10%, #fb923c 55%, var(--tmm-cam-dam) 90%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tmm-dau h2,
.tmm-buoc h2,
.tmm-dk-the h2,
.tmm-cta h2,
.tmm-qua h2 {
    letter-spacing: -.02em;
}

.tmm-qua-the .col-inner > p:last-child a::after,
.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__nut::after {
    content: "→";
    display: inline-block;
    margin-left: 8px;
    transition: transform .2s;
}

.tmm-qua-the .col-inner > p:last-child a:hover::after,
.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__nut:hover::after {
    transform: translateX(4px);
}

/* Dải quà: viền sáng chạy chéo khi rê chuột */
.tmm-qua-the > .col-inner {
    position: relative;
    overflow: hidden;
}

.tmm-qua-the > .col-inner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, .12) 50%, transparent 65%);
    transform: translateX(-100%);
    transition: transform .9s ease;
    pointer-events: none;
}

.tmm-qua-the > .col-inner:hover::after {
    transform: translateX(100%);
}

/* 3 thẻ đuôi: chữ to dễ đọc, vạch màu đầu thẻ */
.tmm-duoi-the > .col-inner {
    position: relative;
    overflow: hidden;
    padding: 32px 24px 28px;
    background: linear-gradient(180deg, #fff 55%, var(--tmm-50));
}

.tmm-duoi-the > .col-inner::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--tmm-cam), #fdba74);
    transform: scaleX(.25);
    transition: transform .35s;
}

.tmm-duoi-the > .col-inner:hover::after {
    transform: scaleX(1);
}

.tmm-duoi-the > .col-inner::before {
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background-size: 28px;
    box-shadow: inset 0 0 0 1px var(--tmm-cam-100);
}

.tmm-duoi-the .col-inner > p:first-child {
    font-size: 28px;
    line-height: 36px;
}

.tmm-duoi-the h3 {
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
}

.tmm-duoi-the .col-inner > p:last-child {
    font-size: 14px;
    line-height: 22px;
    max-width: 300px;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 3 bước: đường nối 01 -> 02 -> 03 (đúng là một trình tự) */
.tmm-buoc-cot li {
    position: relative;
    transition: border-color .25s, box-shadow .25s;
}

.tmm-buoc-cot li:hover {
    border-color: var(--tmm-300);
    box-shadow: var(--tmm-bong-card);
}

.tmm-buoc-cot li:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 37px;
    top: 60px;
    bottom: -18px;
    border-left: 2px dashed var(--tmm-300);
    opacity: .7;
}

.tmm-buoc-cot li::before {
    background: linear-gradient(180deg, var(--tmm-500), var(--tmm-300));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Ô uy tín: số to, chuyển màu */
.tmm-uy-tin li {
    padding: 20px 16px;
    transition: transform .25s, box-shadow .25s;
}

.tmm-uy-tin li:hover {
    transform: translateY(-3px);
    box-shadow: var(--tmm-bong-card);
}

.tmm-uy-tin li strong {
    font-size: 24px;
    line-height: 32px;
    background: linear-gradient(100deg, var(--tmm-700), var(--tmm-500));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Điều kiện: tích cam thay chấm tròn */
.tmm-khoi.tmm-dieu-kien .tmm-dk-the ul {
    list-style: none;
    padding-left: 0;
}

.tmm-dk-the li {
    position: relative;
    padding-left: 30px;
}

.tmm-dk-the li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--tmm-cam-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath d='M9 16.2l-3.5-3.5L4 14.2l5 5 11-11-1.5-1.5z'/%3E%3C/svg%3E") center / 12px no-repeat;
}

/* CTA: ô nhập có vòng sáng khi gõ */
.bk-tmm.bk-tmm-tc--cta .bk-tmm-tc__o:focus {
    box-shadow: 0 0 0 4px rgba(249, 115, 22, .25);
}

.bk-tmm-tc--hero .bk-tmm-tc__dong:focus-within {
    border-color: var(--tmm-300);
    box-shadow: var(--tmm-bong-card), 0 0 0 4px rgba(35, 137, 247, .12);
}

/* Câu dẫn phí sàn nằm 1 hàng khi đủ chỗ */
@media (min-width: 850px) {
    .tmm-phi-the .col-inner > p:nth-of-type(1) {
        white-space: nowrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tmm-qua-the > .col-inner::after,
    .tmm-duoi-the > .col-inner::after,
    .tmm-uy-tin li {
        transition: none;
    }
}

/* =====================================================================
   14. CÂU HỎI THƯỜNG GẶP (section "tmm-faq") — Accordion gốc Flatsome "tmm-faq-ds", 2 cột
   ===================================================================== */

.tmm-dau--cam p:first-child:not(:last-child) {
    font-size: 10px;
    color: var(--tmm-cam);
    background: var(--tmm-cam-50);
    border-color: var(--tmm-cam-100);
    letter-spacing: .08em;
}

.tmm-faq .tmm-dau .col-inner {
    margin-bottom: 48px;
}

.tmm-faq .tmm-dau h2 {
    font-size: 30px;
    line-height: 1.2;
    margin-top: 12px !important;
}

.tmm-faq-ds {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
}

.tmm-faq-ds .accordion-item {
    border: 1px solid var(--tmm-100);
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
    box-shadow: var(--tmm-bong-sm);
    transition: border-color .2s, box-shadow .2s;
}

.tmm-faq-ds .accordion-item:hover,
.tmm-faq-ds .accordion-item:has(.accordion-title.active) {
    border-color: var(--tmm-300);
}

.tmm-faq-ds .accordion-item:has(.accordion-title.active) {
    box-shadow: var(--tmm-bong-card);
}

.tmm-khoi .tmm-faq-ds .accordion-item .accordion-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px;
    border: 0;
    background: transparent;
    font-family: var(--tmm-font);
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    color: var(--tmm-900);
    text-transform: none;
    text-wrap: pretty;
    transition: color .2s;
}

.tmm-faq-ds .accordion-item .accordion-title > span {
    order: 1;
    flex: 1 1 auto;
}

.tmm-khoi .tmm-faq-ds .accordion-item .accordion-title:hover,
.tmm-khoi .tmm-faq-ds .accordion-item .accordion-title.active {
    color: var(--tmm-cam);
}

.tmm-faq-ds .accordion-item .accordion-title .toggle {
    order: 2;
    position: static;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    opacity: 1;
    border: 0;
    background: none;
    box-shadow: none;
    color: var(--tmm-300);
    transition: transform .3s, color .2s;
}

.tmm-faq-ds .accordion-item .accordion-title .toggle i {
    display: none;
}

.tmm-faq-ds .accordion-item .accordion-title .toggle::before {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    margin: 3px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 16.4L4.3 8.7l1.4-1.4 6.3 6.3 6.3-6.3 1.4 1.4z'/%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 24 24'%3E%3Cpath d='M12 16.4L4.3 8.7l1.4-1.4 6.3 6.3 6.3-6.3 1.4 1.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.tmm-faq-ds .accordion-item .accordion-title.active .toggle {
    transform: rotate(180deg);
    color: var(--tmm-cam);
}

.tmm-faq-ds .accordion-inner {
    margin: 0 20px;
    padding: 16px 0 20px;
    border-top: 1px solid var(--tmm-50);
    font-size: 14px;
    line-height: 1.625;
    font-weight: 500;
    color: var(--tmm-700);
}

.tmm-faq-ds .accordion-inner p {
    margin: 0;
}

.tmm-faq-ds .accordion-inner strong {
    color: var(--tmm-900);
}

/* =====================================================================
   15. GIỮ CHỖ (section "tmm-giu-cho") — chữ + hotline trái, form trắng phải
   ===================================================================== */

.tmm-giu-cho .row {
    max-width: 1054px !important;
}

.tmm-gc-chu .col-inner > * + * {
    margin-top: 24px !important;
}

/* Nhãn "Giữ Chỗ Nhanh Chóng" */
.tmm-gc-chu .col-inner > p:first-child {
    display: inline-block;
    font-size: 10px;
    line-height: 15px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tmm-cam);
    background: rgba(249, 115, 22, .2);
    border: 1px solid rgba(249, 115, 22, .3);
    border-radius: 6px;
    padding: 4px 12px;
}

.tmm-gc-chu h2 {
    color: #fff;
    font-size: 36px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.02em;
    margin-top: 8px !important;
}

.tmm-gc-chu .col-inner > h2 + p {
    font-size: 14px;
    line-height: 1.625;
    font-weight: 500;
    color: var(--tmm-100);
}

.tmm-gc-chu em {
    font-weight: 700;
    color: var(--tmm-cam-sang);
}

/* Dòng tổng đài: icon tai nghe + nhãn nhỏ + số to */
.tmm-gc-chu .col-inner > p:last-child {
    display: grid;
    grid-template-columns: 40px 1fr;
    column-gap: 16px;
    align-items: center;
    padding-top: 24px;
    border-top: 1px solid var(--tmm-700);
}

.tmm-gc-chu .col-inner > p:last-child::before {
    content: "";
    grid-row: 1 / span 2;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--tmm-700);
    background: #0a3d82 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F97316'%3E%3Cpath d='M12 3a9 9 0 00-9 9v6a3 3 0 003 3h2v-8H5v-1a7 7 0 0114 0v1h-3v8h3v1h-6v2h6a2 2 0 002-2v-9a9 9 0 00-9-9z'/%3E%3C/svg%3E") center / 18px no-repeat;
}

.tmm-gc-chu .col-inner > p:last-child strong {
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--tmm-300);
}

.tmm-gc-chu .col-inner > p:last-child a {
    font-size: 20px;
    line-height: 28px;
    font-weight: 900;
    color: #fff;
}

.tmm-gc-chu .col-inner > p:last-child a:hover {
    color: var(--tmm-cam);
}

/* ---------- Form ([bk_tmm_form]) + ô nhập dùng chung với hộp thoại ---------- */

.bk-tmm-form {
    background: #fff;
    border: 1px solid var(--tmm-100);
    border-radius: 24px;
    padding: 32px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
    color: var(--tmm-900);
}

.bk-tmm .bk-tmm-form__tieu-de {
    font-size: 20px;
    line-height: 28px;
    font-weight: 900;
    margin: 0 0 4px;
    color: var(--tmm-900);
}

.bk-tmm-form__mo-ta {
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    color: var(--tmm-500);
    margin: 0 0 24px !important;
}

.bk-tmm-form__form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
}

.bk-tmm-form__luoi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.bk-tmm-form__truong label {
    display: block;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    color: var(--tmm-900);
    margin-bottom: 6px;
}

.bk-tmm-form__truong label span {
    color: var(--tmm-cam);
}

.bk-tmm .bk-tmm-form__o {
    display: block;
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid var(--tmm-300);
    border-radius: 12px;
    background: #fff;
    box-shadow: none;
    font-family: var(--tmm-font);
    font-size: 14px;
    font-weight: 500;
    color: var(--tmm-900);
    transition: border-color .2s, box-shadow .2s;
}

.bk-tmm select.bk-tmm-form__o {
    padding-right: 40px;
    font-weight: 600;
    text-overflow: ellipsis;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237BBEFA'%3E%3Cpath d='M12 16.4L4.3 8.7l1.4-1.4 6.3 6.3 6.3-6.3 1.4 1.4z'/%3E%3C/svg%3E") right 14px center / 14px no-repeat;
}

.bk-tmm .bk-tmm-form__o::placeholder {
    color: #94a3b8;
    opacity: 1;
}

.bk-tmm .bk-tmm-form__o:focus {
    outline: none;
    border-color: var(--tmm-cam);
    box-shadow: 0 0 0 1px var(--tmm-cam), 0 0 0 4px rgba(249, 115, 22, .15);
}

.bk-tmm .bk-tmm-form__o--mono {
    font-family: var(--tmm-mono);
    font-weight: 700;
}

.bk-tmm .bk-tmm-form__o--doc {
    background: var(--tmm-50);
    border-color: var(--tmm-100);
    font-weight: 700;
}

.bk-tmm .bk-tmm-form__o[aria-invalid="true"] {
    border-color: #dc2626;
}

.bk-tmm-form__bay {
    position: absolute !important;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.bk-tmm .bk-tmm-form__nut {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 48px;
    min-height: 0;
    margin: 8px 0 0;
    padding: 0 16px;
    border: 0;
    border-radius: 12px;
    background: var(--tmm-cam);
    color: #fff;
    font-family: var(--tmm-font);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-transform: none;
    letter-spacing: 0;
    box-shadow: 0 10px 15px -3px rgba(249, 115, 22, .3), 0 4px 6px -4px rgba(249, 115, 22, .3);
    cursor: pointer;
    transition: background-color .2s, transform .1s;
}

.bk-tmm .bk-tmm-form__nut:hover {
    background: var(--tmm-cam-dam);
}

.bk-tmm .bk-tmm-form__nut:active {
    transform: scale(.98);
}

.bk-tmm .bk-tmm-form__nut:disabled {
    opacity: .7;
    cursor: wait;
}

.bk-tmm-form__loi {
    margin: 0 !important;
    font-size: 13px;
    line-height: 18px;
    font-weight: 600;
    color: #dc2626;
}

.bk-tmm-form__loi[hidden] {
    display: none;
}

/* ---------- Hộp thoại giữ chỗ (<dialog>, in ở wp_footer) ---------- */

.bk-tmm-ht {
    width: min(448px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    margin: auto;
    padding: 32px;
    border: 0;
    border-radius: 24px;
    background: #fff;
    color: var(--tmm-900);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .35);
    font-family: var(--tmm-font);
}

.bk-tmm-ht::backdrop {
    background: rgba(8, 51, 112, .6);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.bk-tmm-ht[open] {
    animation: tmm-ht-mo .25s cubic-bezier(.2, .7, .2, 1);
}

@keyframes tmm-ht-mo {
    from { opacity: 0; transform: scale(.95); }
    to { opacity: 1; transform: none; }
}

.bk-tmm .bk-tmm-ht__dong {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--tmm-50);
    color: var(--tmm-500);
    cursor: pointer;
}

.bk-tmm .bk-tmm-ht__dong:hover {
    background: var(--tmm-100);
}

.bk-tmm-ht__dau {
    margin-bottom: 24px;
    padding-right: 32px;
}

.bk-tmm-ht__nhan {
    display: inline-block;
    font-size: 10px;
    line-height: 15px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tmm-cam);
    background: var(--tmm-cam-50);
    border-radius: 6px;
    padding: 4px 10px;
}

.bk-tmm .bk-tmm-ht h2 {
    font-family: var(--tmm-font);
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
    color: var(--tmm-900);
    text-transform: none;
    letter-spacing: -.02em;
    margin: 8px 0 4px;
}

.bk-tmm-ht p {
    font-size: 14px;
    line-height: 20px;
    color: var(--tmm-700);
    margin: 0;
}

.bk-tmm-ht--ok {
    text-align: center;
}

.bk-tmm-ht__ok-icon {
    display: inline-flex;
    width: 56px;
    height: 56px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--tmm-cam-50);
    color: var(--tmm-cam);
    font-size: 32px;
}

.bk-tmm-ht--ok p {
    margin-top: 8px;
}

.bk-tmm-ht__phu a {
    font-weight: 700;
    color: var(--tmm-500);
}

.bk-tmm-ht--ok .bk-tmm-form__nut {
    margin-top: 24px;
}

@media (max-width: 849px) {
    .tmm-gc-chu,
    .tmm-gc-form {
        flex-basis: 100% !important;
        max-width: 100% !important;
    }

    .tmm-gc-form {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .tmm-faq-ds {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

@media (max-width: 639px) {
    .bk-tmm-form__luoi {
        grid-template-columns: minmax(0, 1fr);
    }

    .bk-tmm-form,
    .bk-tmm-ht {
        padding: 24px;
    }

    .tmm-gc-chu h2 {
        font-size: 30px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bk-tmm-ht[open] {
        animation: none;
    }
}

/* =====================================================================
   16. NỔI BẬT — tăng tương phản + điểm nhấn ở chỗ khách cần bấm (giữ bố cục mockup)
   ===================================================================== */

/* Hero: tiêu đề to hơn, nét gạch cam dưới "của bạn?" */
@media (min-width: 1024px) {
    .tmm-hero h1 {
        font-size: 62px;
        line-height: 1.18;
    }
}

.tmm-hero h1 em {
    position: relative;
    display: inline-block;
}

.tmm-hero h1 em::after {
    content: "";
    position: absolute;
    left: 2%;
    right: 2%;
    bottom: -2px;
    height: 10px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 9C50 3 120 2 198 6' fill='none' stroke='%23F97316' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    opacity: .85;
    transform-origin: left;
}

/* Ô tra cứu hero: viền sáng xanh, nút có quầng */
.bk-tmm-tc--hero .bk-tmm-tc__dong {
    border: 1px solid transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(120deg, var(--tmm-300), var(--tmm-100) 40%, rgba(249, 115, 22, .45)) border-box;
    box-shadow: 0 18px 40px -12px rgba(35, 137, 247, .35);
}

.bk-tmm-tc--hero .bk-tmm-tc__nut {
    background: linear-gradient(135deg, #3b9bff, var(--tmm-500) 55%, var(--tmm-700));
}

/* Tiêu đề khối: gạch màu nhỏ bên dưới */
.tmm-dau h2::after {
    content: "";
    display: block;
    width: 56px;
    height: 4px;
    margin: 16px auto 0;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--tmm-500), var(--tmm-cam));
}

/* Dải quà .ap: viền sáng chạy quanh, ô .ap nhún, nút có vòng lan */
.tmm-qua-the > .col-inner {
    border: 1px solid transparent;
    background:
        linear-gradient(to right, var(--tmm-700), var(--tmm-900)) padding-box,
        linear-gradient(110deg, rgba(123, 190, 250, .2), rgba(251, 146, 60, .9), rgba(123, 190, 250, .2)) border-box;
    background-size: 100% 100%, 300% 100%;
    box-shadow: 0 24px 48px -16px rgba(8, 51, 112, .55);
}

.tmm-qua-the .col-inner > p:last-child a {
    position: relative;
}

@media (prefers-reduced-motion: no-preference) {
    .tmm-qua-the > .col-inner {
        animation: tmm-vien-chay 6s linear infinite;
    }

    .tmm-qua-the .col-inner > p:first-child {
        animation: tmm-nhun 3.2s ease-in-out infinite;
    }

    .tmm-qua-the .col-inner > p:last-child a::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
        animation: tmm-lan 2.4s ease-out infinite;
        pointer-events: none;
    }

    .tmm-hero h1 em::after {
        animation: tmm-gach .9s cubic-bezier(.2, .7, .2, 1) .5s both;
    }

    .bk-tmm-form__nut::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -40%;
        width: 30%;
        background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
        transform: skewX(-20deg);
        animation: tmm-luot 3.6s ease-in-out 1s infinite;
        pointer-events: none;
    }
}

@keyframes tmm-vien-chay {
    to { background-position: 0 0, 300% 0; }
}

@keyframes tmm-nhun {
    0%, 100% { transform: translateY(0) rotate(0); }
    50% { transform: translateY(-4px) rotate(-3deg); }
}

@keyframes tmm-lan {
    0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .55); }
    80%, 100% { box-shadow: 0 0 0 14px rgba(255, 255, 255, 0); }
}

@keyframes tmm-gach {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes tmm-luot {
    0% { left: -40%; }
    45%, 100% { left: 130%; }
}

/* Phí sàn: phần phí bị mất đỏ cam có sọc; câu chốt thành nhãn cam */
.tmm-phi-the .col-inner > p:nth-of-type(3) b:last-child {
    background:
        repeating-linear-gradient(135deg, rgba(255, 255, 255, .14) 0 6px, transparent 6px 12px),
        linear-gradient(90deg, #ef4444, var(--tmm-cam-dam));
}

.tmm-phi-the .col-inner > p:nth-of-type(5) b {
    background: linear-gradient(90deg, var(--tmm-500), #38bdf8);
}

.tmm-phi-the .col-inner > p:nth-of-type(6) {
    background: var(--tmm-cam-50);
    border-color: var(--tmm-cam-200);
    color: var(--tmm-cam-dam);
}

.tmm-phi-the .col-inner > p:nth-of-type(6)::before {
    content: "⚡ ";
}

/* 3 thẻ đuôi: icon nền chuyển màu */
.tmm-duoi-the > .col-inner::before {
    background-color: transparent;
    background-image: var(--tmm-b-cua-hang), linear-gradient(135deg, #fff7ed, #ffedd5);
    background-size: 28px, 100% 100%;
    background-position: center, center;
    background-repeat: no-repeat;
}

.tmm-duoi-the--ad > .col-inner::before { background-image: var(--tmm-b-loa), linear-gradient(135deg, #fff7ed, #ffedd5); }
.tmm-duoi-the--ap > .col-inner::before { background-image: var(--tmm-b-dien-thoai), linear-gradient(135deg, #fff7ed, #ffedd5); }

/* FAQ: câu đang mở có vạch cam bên trái */
.tmm-faq-ds .accordion-item {
    position: relative;
}

.tmm-faq-ds .accordion-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 16px;
    bottom: 16px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--tmm-cam);
    transform: scaleY(0);
    transition: transform .25s;
}

.tmm-faq-ds .accordion-item:has(.accordion-title.active)::before {
    transform: scaleY(1);
}

/* Form giữ chỗ: viền sáng, nút gửi có vệt sáng lướt */
.bk-tmm-form {
    border: 1px solid transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(140deg, var(--tmm-cam), rgba(255, 255, 255, .4) 35%, var(--tmm-300)) border-box;
    box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .45), 0 0 0 6px rgba(255, 255, 255, .06);
}

.bk-tmm .bk-tmm-form__nut {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #fb923c, var(--tmm-cam) 45%, var(--tmm-cam-dam));
}

