/* =====================================================================================================
MIBRAND · CSS GOM CẢ WEB (ghep_css_ca_web.css) · bước ghép 05/10/2026
Trên WordPress: dán nguyên file vào Giao diện › Tùy biến › CSS bổ sung (hoặc Elementor › Cài đặt trang web › CSS tùy chỉnh).
Gồm CSS bổ sung của trang chủ + 5 nhóm (NCTT, Dịch vụ 1, Dịch vụ 2, Công ty, Tài nguyên), mỗi nhóm một phần, theo thứ tự ở các dòng
"NHÓM …" bên dưới. Lớp riêng có tiền tố nhóm (nctt- dv1- dv2- cty- tn-); lớp mb- chỉ ở thành phần dùng chung (form, nút, chân trang).
===================================================================================================== */
/* ===== MÀU NÚT CHÍNH – ĐỔI TAY Ở ĐÂY (chỉ cần sửa 5 dòng dưới, không phải sửa chỗ khác) =====
Đang dùng: Xanh (anh Kha chốt 04/10). Áp cho mọi nút chính, nút gửi form, nút nổi.
--mb-nut-1 / --mb-nut-2 : 2 đầu của nền chuyển màu nút (góc 135 độ), bình thường
--mb-nut-hover-1 / -hover-2 : 2 đầu của nền khi rê chuột / chọn nút
--mb-nut-chu : màu chữ và biểu tượng trên nút
Bảng màu thay thế (chép 5 giá trị tương ứng vào 5 dòng dưới):
Xanh (đang dùng) : 1 #2B47D1 · 2 #001489 · hover 1 #3654E0 · hover 2 #0A22A6 · chữ #FFFFFF
Cam sáng (bản B cũ): 1 #EE9A1A · 2 #EA7A1C · hover 1 #F5A623 · hover 2 #EE8A1F · chữ #001489
Cam đậm, chữ trắng : 1 #D35A12 · 2 #C2410C · hover 1 #E0661C · hover 2 #AE3A0A · chữ #FFFFFF
Xanh ngọc : 1 #0B7F8A · 2 #0A6F79 · hover 1 #0E93A0 · hover 2 #085C64 · chữ #FFFFFF
(Cam đậm, Xanh ngọc: màu hover do bước ghép đề xuất cho cùng độ đậm nhạt; bản B cũ chỉ có sẵn màu của Cam sáng.) */
:root{
--mb-nut-1:#2B47D1;
--mb-nut-2:#001489;
--mb-nut-hover-1:#3654E0;
--mb-nut-hover-2:#0A22A6;
--mb-nut-chu:#FFFFFF;
}
/* =====================================================================================================
NHÓM: TRANG CHỦ
===================================================================================================== */
/* Mibrand – 2 dải logo khách hàng (khối Khách hàng, mẫu "PA2 – H4"). Lớp riêng mb-logo-chay đặt ở Advanced › CSS Classes
của CẢ 2 widget Image Carousel. KHÔNG XOÁ.
1) trôi đều liên tục (kèm Autoplay Speed = 1, Animation Speed = 3200 trong widget); dải 1 Direction = Left (chạy sang trái),
dải 2 Direction = Right (chạy sang phải); Pause on hover = Yes – rê chuột vào dải nào thì dải đó dừng;
2) logo giữ nguyên file (không lọc, không làm mờ), mỗi logo nằm trên 1 thẻ kính trắng bo góc (cùng kiểu 4 thẻ số ở H1);
rê chuột thẻ nổi nhẹ; khung dải nới rộng trên/dưới để bóng thẻ không bị cắt; 2 mép dải mờ dần để thẻ trôi vào/ra mềm;
3) điện thoại: dải tràn hết bề ngang màn hình (Elementor tự giới hạn widget ở 100% nên cần dòng cuối).
Số logo mỗi màn (7 / 5 / 3), khoảng cách giữa thẻ (20 / 16 / 10px), chiều chạy và thứ tự logo đặt trong widget, không đặt ở đây. */
.mb-logo-chay .swiper-wrapper{transition-timing-function:linear!important}
.mb-logo-chay .swiper{padding:12px 0 52px;margin:-12px 0 -44px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 48px,#000 calc(100% - 48px),transparent 100%)}
.mb-logo-chay .swiper-slide-inner{margin:0;padding:14px 10px;background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.95);border-radius:20px;box-shadow:0 24px 48px -28px rgba(0,20,137,.28);transition:transform .35s ease,box-shadow .35s ease}
.mb-logo-chay .swiper-slide:hover .swiper-slide-inner{transform:translateY(-4px);box-shadow:0 32px 60px -30px rgba(0,20,137,.36)}
.mb-logo-chay .swiper-slide-image{display:block;width:100%;height:auto;filter:none;opacity:1}
@media (max-width:767px){.mb-logo-chay .swiper{padding:10px 0 44px;margin:-10px 0 -38px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%)}.mb-logo-chay .swiper-slide-inner{padding:8px 6px;border-radius:16px}.elementor.elementor .e-con>.elementor-widget.mb-logo-chay{max-width:calc(100% + 40px)}}
/* Mibrand – kiểu chung cho form Contact Form 7 "Gửi bài toán của bạn" (trang chủ, khối #lien-he) và "Tải hồ sơ năng lực" (trang /tai-ho-so-nang-luc/). KHÔNG XOÁ.
Chỉ tác động form có lớp mb-form (đặt trong shortcode: html_class="mb-form ..."). Tên ô, ô bắt buộc, email nhận, thông báo sửa trong Contact Form 7.
Sau khi gửi thành công, việc chuyển sang trang cảm ơn do đoạn mã nút nổi (mẫu Chân trang, mục 7) làm. */
.wpcf7 .mb-form{font-family:Mulish,sans-serif;color:#3A4460}
.wpcf7 .mb-form p{margin:0}
.wpcf7 .mb-form .mb-f-luoi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 20px}
.wpcf7 .mb-form .mb-f-rong{grid-column:1/-1}
.wpcf7 .mb-form .mb-f-nhan{display:block;margin:0 0 8px;font-size:14px;font-weight:700;line-height:1.35;color:#001489}
.wpcf7 .mb-form .mb-f-bb{color:#D93025}
.wpcf7 .mb-form .mb-f-tuy{font-weight:400;color:#6E7A93}
.wpcf7 .mb-form .wpcf7-form-control-wrap{display:block}
/* ô nhập */
.wpcf7 .mb-form input[type=text],.wpcf7 .mb-form input[type=tel],.wpcf7 .mb-form input[type=email],.wpcf7 .mb-form textarea{
display:block;width:100%;box-sizing:border-box;margin:0;padding:13px 16px;font:400 16px/1.45 Mulish,sans-serif;color:#1C2440;
background:rgba(255,255,255,.94);border:1px solid #D5DCEB;border-radius:14px;box-shadow:inset 0 1px 2px rgba(0,20,137,.05);
transition:border-color .2s,box-shadow .2s,background-color .2s}
.wpcf7 .mb-form textarea{height:auto;min-height:104px;resize:vertical}
.wpcf7 .mb-form input[type=text]:hover,.wpcf7 .mb-form input[type=tel]:hover,.wpcf7 .mb-form input[type=email]:hover,.wpcf7 .mb-form textarea:hover{border-color:#AFC0DE}
.wpcf7 .mb-form input[type=text]:focus,.wpcf7 .mb-form input[type=tel]:focus,.wpcf7 .mb-form input[type=email]:focus,.wpcf7 .mb-form textarea:focus{
outline:none;border-color:#0868B0;background:#fff;box-shadow:0 0 0 4px rgba(8,104,176,.14)}
.wpcf7 .mb-form .wpcf7-not-valid{border-color:#D93025!important}
.wpcf7 .mb-form .wpcf7-not-valid-tip{margin-top:6px;font-size:13px;line-height:1.4;color:#C5221F}
.wpcf7 .mb-form .mb-f-xac-minh:not(:has(*)){display:none}
/* nút gửi: cùng kiểu nút chính của trang */
.wpcf7 .mb-form .mb-f-gui p{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.wpcf7 .mb-form .wpcf7-submit,.wpcf7 .mb-form .wpcf7-submit:focus{appearance:none;-webkit-appearance:none;cursor:pointer;margin:0;padding:17px 32px 16px;
font:700 16px/1.2 Mulish,sans-serif;letter-spacing:.01em;color:var(--mb-nut-chu);text-transform:none;
background:linear-gradient(135deg, var(--mb-nut-1) 0%, var(--mb-nut-2) 100%);border:0;border-top:1px solid rgba(255,255,255,.45);border-radius:999px;
box-shadow:0 12px 28px -10px rgba(0,20,137,.5);transition:transform .3s,box-shadow .3s,opacity .2s}
.wpcf7 .mb-form .wpcf7-submit,.wpcf7 .mb-form .wpcf7-submit .elementor-button-text,.wpcf7 .mb-form .wpcf7-submit .elementor-button-icon,.wpcf7 .mb-form .wpcf7-submit .elementor-button-icon svg,.wpcf7 .mb-form .wpcf7-submit .e-n-tab-title-text,.wpcf7 .mb-form .wpcf7-submit:focus,.wpcf7 .mb-form .wpcf7-submit:focus .elementor-button-text,.wpcf7 .mb-form .wpcf7-submit:focus .elementor-button-icon,.wpcf7 .mb-form .wpcf7-submit:focus .elementor-button-icon svg,.wpcf7 .mb-form .wpcf7-submit:focus .e-n-tab-title-text{color:var(--mb-nut-chu)!important;fill:var(--mb-nut-chu)!important}
.wpcf7 .mb-form .wpcf7-submit:hover{color:var(--mb-nut-chu);transform:translateY(-2px);background:linear-gradient(135deg, var(--mb-nut-hover-1) 0%, var(--mb-nut-hover-2) 100%);box-shadow:0 18px 36px -12px rgba(0,20,137,.55)}
.wpcf7 .mb-form .wpcf7-submit:hover,.wpcf7 .mb-form .wpcf7-submit:hover .elementor-button-text,.wpcf7 .mb-form .wpcf7-submit:hover .elementor-button-icon,.wpcf7 .mb-form .wpcf7-submit:hover .elementor-button-icon svg,.wpcf7 .mb-form .wpcf7-submit:hover .e-n-tab-title-text{color:var(--mb-nut-chu)!important;fill:var(--mb-nut-chu)!important}
.wpcf7 .mb-form .wpcf7-spinner{margin:0}
/* thông báo sau khi bấm gửi */
.wpcf7 .mb-form .wpcf7-response-output{margin:18px 0 0!important;padding:12px 16px!important;border-radius:12px;font-size:14.5px;line-height:1.5;
border:1px solid #DDE3F0!important;background:rgba(255,255,255,.85);color:#3A4460}
.wpcf7 .mb-form.invalid .wpcf7-response-output,.wpcf7 .mb-form.unaccepted .wpcf7-response-output,.wpcf7 .mb-form.payment-required .wpcf7-response-output,
.wpcf7 .mb-form.failed .wpcf7-response-output,.wpcf7 .mb-form.aborted .wpcf7-response-output,.wpcf7 .mb-form.spam .wpcf7-response-output{border-color:#F2B8B5!important;background:#FDF1F0;color:#8C1D18}
.wpcf7 .mb-form.sent .wpcf7-response-output{border-color:#A8DFC9!important;background:#EEF9F4;color:#14684A}
@media (max-width:767px){
.wpcf7 .mb-form .mb-f-luoi{grid-template-columns:minmax(0,1fr);gap:16px}
.wpcf7 .mb-form .wpcf7-submit{width:100%}}
/* Mibrand – khối "Tin tức & góc nhìn": trình bày lại thẻ bài của shortcode
07-09-2026
Từ “du lịch hội nghị” đến Business Events: Vì sao MICE đang trở thành một câu chuyện chiến lược của du lịch Việt Nam?
28-08-2026
Tiếp thị điểm đến đang bước vào một kỷ nguyên cạnh tranh mới
26-08-2026
Cracker Barrel: Khi hiện đại hóa thương hiệu di sản trở thành bài toán quản trị
thành 3 thẻ kính (ảnh, ngày, tiêu đề). KHÔNG XOÁ.
Chỉ tác động widget Shortcode có lớp mb-tin-tuc (Advanced › CSS Classes). Bài hiện ở đây do shortcode chọn:
bài Tin tức có đánh dấu "Đây là bài viết nổi bật", mới nhất trước (limit = số bài, offset = bỏ qua bao nhiêu bài đầu). */
.mb-tin-tuc .elementor-shortcode{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.mb-tin-tuc a.tin-nho{display:flex;flex-direction:column;align-items:stretch;gap:0;height:100%;margin:0;overflow:hidden;
background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.95);border-radius:24px;
box-shadow:0 24px 48px -28px rgba(0,20,137,.28);transition:transform .35s,box-shadow .35s}
.mb-tin-tuc a.tin-nho:hover{transform:translateY(-4px);box-shadow:0 32px 60px -30px rgba(0,20,137,.36)}
.mb-tin-tuc a.tin-nho .tin-tuc-img{flex:none;width:100%;height:auto;aspect-ratio:1200/630;border-radius:0;
background-color:#E9EFF9;background-size:cover;background-position:center center}
.mb-tin-tuc a.tin-nho .tin-tuc-overlay{position:static;flex:1 1 auto;display:flex;flex-direction:column;gap:10px;padding:20px 24px 26px;background:none;color:#3A4460}
.mb-tin-tuc a.tin-nho .tin-tuc-date{display:block;margin:0;font:600 13px/1.4 Mulish,sans-serif;letter-spacing:.02em;color:#6E7A93;opacity:1}
.mb-tin-tuc a.tin-nho .tin-tuc-date .dashicons{display:none}
.mb-tin-tuc a.tin-nho .tin-tuc-title{margin:0;font:600 19px/1.4 Mulish,sans-serif;color:#001489;-webkit-line-clamp:3;transition:color .2s}
.mb-tin-tuc a.tin-nho:hover .tin-tuc-title{color:#0868B0}
@media (max-width:1024px){
.mb-tin-tuc .elementor-shortcode{gap:16px}
.mb-tin-tuc a.tin-nho .tin-tuc-overlay{padding:16px 18px 20px}
.mb-tin-tuc a.tin-nho .tin-tuc-title{font-size:16px}}
@media (max-width:767px){
.mb-tin-tuc .elementor-shortcode{grid-template-columns:minmax(0,1fr);gap:20px}
.mb-tin-tuc a.tin-nho .tin-tuc-overlay{padding:18px 20px 22px}
.mb-tin-tuc a.tin-nho .tin-tuc-title{font-size:18px}}
/* =====================================================================================================
NHÓM: NHÓM NGHIÊN CỨU THỊ TRƯỜNG
===================================================================================================== */
/* bản 2: chữ gợi ý trong ô nhập (placeholder) – nhạt hơn chữ khách gõ */
.wpcf7 .mb-form input::placeholder,.wpcf7 .mb-form textarea::placeholder{color:#8A94AD;opacity:1;font-size:15px;line-height:1.5}
/* ===== (2) Viên nhãn, đầu trang (riêng trang NCTT) ===== */
/* viên nhãn: widget Icon List xếp ngang có lớp nctt-nhan-vien (nctt-nhan-toi: trên nền xanh đậm) */
.nctt-nhan-vien .elementor-icon-list-items.elementor-inline-items{display:flex;flex-wrap:wrap;gap:8px;margin:0!important}
.nctt-nhan-vien .elementor-icon-list-items.elementor-inline-items>.elementor-icon-list-item{margin:0!important;padding:7px 14px 7px 12px;border:1px solid rgba(0,20,137,.13);border-radius:999px;background:rgba(255,255,255,.82);box-shadow:0 8px 18px -14px rgba(0,20,137,.45)}
.nctt-nhan-vien .elementor-icon-list-item:after{display:none!important}
.nctt-nhan-toi .elementor-icon-list-items.elementor-inline-items>.elementor-icon-list-item{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.07);box-shadow:none}
/* đầu trang: ảnh (container lớp nctt-hero-anh trong khung nctt-hero-khung) phóng chậm 1,08 → 1 khi mở trang */
.nctt-hero-anh{transform-origin:50% 42%;animation:ncttPhong 1.6s cubic-bezier(.2,.65,.2,1) both}
@keyframes ncttPhong{from{transform:scale(1.08)}to{transform:scale(1)}}
/* H1 (widget lớp nctt-h1-dong): mỗi dòng nằm trong 2 lớp – dòng trượt lên từ sau mặt nạ, lần lượt; cụm đậm có 1 vệt sáng quét qua 1 lần */
.nctt-h1-dong .elementor-heading-title>span{display:block;overflow:hidden;padding:.14em 0 .08em;margin:-.14em 0 -.08em}
.nctt-h1-dong .elementor-heading-title>span>span{display:block;animation:ncttDong .95s cubic-bezier(.2,.7,.15,1) .1s both}
.nctt-h1-dong .elementor-heading-title>span:nth-child(2)>span{animation-delay:.24s}
.nctt-h1-dong .elementor-heading-title>span:nth-child(3)>span{animation-delay:.38s}
@keyframes ncttDong{from{transform:translateY(115%)}to{transform:none}}
.nctt-h1-dong strong strong{position:relative;display:inline-block}
.nctt-h1-dong strong strong::after{content:"";position:absolute;top:-.12em;bottom:-.06em;left:0;width:38%;pointer-events:none;
background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.92) 50%,rgba(255,255,255,0) 100%);
transform:translateX(-110%) skewX(-14deg);opacity:0;animation:ncttQuet 1.1s cubic-bezier(.45,0,.2,1) 1.15s both}
.nctt-h1-dong .elementor-heading-title>span:nth-child(3) strong strong::after{animation-delay:1.4s}
@keyframes ncttQuet{0%{opacity:0;transform:translateX(-110%) skewX(-14deg)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(300%) skewX(-14deg)}}
@keyframes ncttBung{from{clip-path:circle(0% at 50% 50%);opacity:.35}to{clip-path:circle(75% at 50% 50%);opacity:1}}
@keyframes ncttBat{from{opacity:0;transform:translateY(12px) scale(.92)}to{opacity:1;transform:none}}
/* ===== (3) Các khối – phương án A · Kể chuyện khi cuộn (đã chốt 04/10) ===== */
/* N2 – hàng 4 tấm (nctt-n2-hang › nctt-n2-tam) – bản 5: bỏ phần nở rộng khi rê chuột (chỉ còn nhấc tấm – Elementor Transform khi rê chuột),
nhãn hạng mục (nctt-n2-nhan) hiện sẵn cùng thẻ; nội dung căn trên, tên nhóm cao tối thiểu 2 dòng, câu hỏi cao tối thiểu theo câu dài nhất (xem (3b)) */
/* N3 – Honda. Điện thoại, máy tính bảng: không ghim; mỗi lớp 1 màn (chữ của lớp → trường chấm của lớp), chấm bung từ tâm khi cuộn tới. */
.nctt-n3-cham-anh.animated img{animation:ncttBung 1.6s cubic-bezier(.2,.7,.2,1) .15s both}
@media (max-width:1024px){
.nctt-n3-trai,.nctt-n3-chu-lop,.nctt-n3-phai,.nctt-n3-cham{display:contents!important}
.nctt-n3-hoi{order:0!important}
.nctt-n3-lop.nctt-n3-l1{order:1!important}.nctt-n3-cham-anh.nctt-n3-l1{order:2!important}
.nctt-n3-lop.nctt-n3-l2{order:3!important}.nctt-n3-cham-anh.nctt-n3-l2{order:4!important}
.nctt-n3-lop.nctt-n3-l3{order:5!important}.nctt-n3-cham-anh.nctt-n3-l3{order:6!important}
.nctt-n3-ra{order:7!important}
.nctt-n3-lop{padding-top:20px!important}
.nctt-n3-cham-anh{padding:22px 14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:20px}
/* lượt 2 (04/10): khung 6 và 10 chấm cao theo nội dung (48px gồm viền) – chỉ 1 hàng chấm; chấm to hơn: ảnh 590 × 300 hiện ở cỡ cố định
708px (× 1,2 – chấm 7px, cách 12px) ở mọi bề ngang, lấy dải 24px giữa ảnh, căn giữa khung */
.nctt-n3-cham-anh.nctt-n3-l1,.nctt-n3-cham-anh.nctt-n3-l2{padding:11px 0!important;overflow:hidden}
.nctt-n3-cham-anh.nctt-n3-l1 img,.nctt-n3-cham-anh.nctt-n3-l2 img{display:block;width:708px!important;max-width:none!important;height:24px!important;
object-fit:cover;object-position:50% 50%;margin-left:calc(50% - 354px)}}
/* Máy tính: 3 lớp chấm chồng lên nhau trong 1 tấm (trình duyệt không hỗ trợ dòng thời gian cuộn hoặc giảm chuyển động: chỉ hiện trường 1.770 chấm, chữ 3 lớp xếp dọc) */
@media (min-width:1025px){
.nctt-n3-cham{display:grid!important;grid-template-columns:minmax(0,1fr);place-items:center;overflow:hidden;min-height:min(560px,calc(100vh - 220px))}
.nctt-n3-cham>.nctt-n3-cham-anh{grid-area:1/1;width:100%!important}
.nctt-n3-cham-anh img{width:100%!important;height:auto!important}
.nctt-n3-cham>.nctt-n3-cham-anh.nctt-n3-l1,.nctt-n3-cham>.nctt-n3-cham-anh.nctt-n3-l2{visibility:hidden}}
/* Máy tính + trình duyệt có dòng thời gian cuộn: khối ghim lại; 6 → 10 → 1.770 đổi theo cuộn, hết 3 lớp thì thẻ Đầu ra hiện */
@media (min-width:1025px) and (min-width:0px){
@supports (animation-timeline:view()){
.nctt-n3-ghim{view-timeline:--ncttN3 block;min-height:320vh!important;justify-content:flex-start!important}
.nctt-n3-khung{position:sticky;top:96px;height:calc(100vh - 120px);min-height:540px;align-items:center!important}
.nctt-n3-phai{align-self:center!important}
.nctt-n3-cham{min-height:min(440px,calc(100vh - 360px))!important}
.nctt-n3-cham>.nctt-n3-cham-anh.nctt-n3-l1:not(.elementor-invisible),.nctt-n3-cham>.nctt-n3-cham-anh.nctt-n3-l2:not(.elementor-invisible){visibility:visible}
.nctt-n3-chu-lop{display:grid!important}
.nctt-n3-chu-lop>.nctt-n3-lop{grid-area:1/1}
.nctt-n3-lop.nctt-n3-l1{animation:ncttL1 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-lop.nctt-n3-l2{animation:ncttL2 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-lop.nctt-n3-l3{animation:ncttL3 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-cham-anh.nctt-n3-l1 img{animation:ncttD1 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-cham-anh.nctt-n3-l2 img{animation:ncttD2 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-cham-anh.nctt-n3-l3 img{animation:ncttD3 linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-ra{animation:ncttRa linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}
.nctt-n3-tien-chay{transform-origin:left center;animation:ncttTien linear both;animation-timeline:--ncttN3;animation-range:contain 0% contain 100%}}}
@keyframes ncttL1{0%,22%{opacity:1;transform:none}27%,100%{opacity:0;transform:translateY(-32px)}}
@keyframes ncttL2{0%,27%{opacity:0;transform:translateY(32px)}32%,50%{opacity:1;transform:none}55%,100%{opacity:0;transform:translateY(-32px)}}
@keyframes ncttL3{0%,55%{opacity:0;transform:translateY(32px)}60%,100%{opacity:1;transform:none}}
@keyframes ncttD1{0%,22%{opacity:1;transform:none}28%,100%{opacity:0;transform:scale(1.8)}}
@keyframes ncttD2{0%,25%{opacity:0;transform:scale(.5)}31%,50%{opacity:1;transform:none}56%,100%{opacity:0;transform:scale(1.5)}}
@keyframes ncttD3{0%,55%{clip-path:circle(0% at 50% 50%);opacity:1}80%,100%{clip-path:circle(75% at 50% 50%);opacity:1}}
@keyframes ncttRa{0%,84%{opacity:0;transform:translateY(28px)}93%,100%{opacity:1;transform:none}}
@keyframes ncttTien{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* N4 – thẻ dự án (lớp nctt-nhan-bat): khi thẻ vào màn, nhãn cách làm bật lên lần lượt */
.nctt-nhan-bat.animated .nctt-nhan-vien .elementor-icon-list-item{animation:ncttBat .6s cubic-bezier(.2,.75,.25,1) .35s both}
.nctt-nhan-bat.animated .nctt-nhan-vien .elementor-icon-list-item:nth-child(2){animation-delay:.5s}
.nctt-nhan-bat.animated .nctt-nhan-vien .elementor-icon-list-item:nth-child(3){animation-delay:.65s}
/* N5 – bản đồ (nctt-ban-do): 8 điểm (nctt-diem-1…8) sáng lần lượt từ Bắc vào Nam, mỗi điểm có vòng sóng lan (nctt-diem-song) 2 lần rồi dừng */
.nctt-diem-song{opacity:0}
.nctt-ban-do.animated .nctt-diem{animation:ncttDiem .7s cubic-bezier(.2,.75,.25,1) both}
.nctt-ban-do.animated .nctt-diem-1{animation-delay:.3s}
.nctt-ban-do.animated .nctt-diem-2{animation-delay:.45s}
.nctt-ban-do.animated .nctt-diem-3{animation-delay:.6s}
.nctt-ban-do.animated .nctt-diem-4{animation-delay:.75s}
.nctt-ban-do.animated .nctt-diem-5{animation-delay:.9s}
.nctt-ban-do.animated .nctt-diem-6{animation-delay:1.05s}
.nctt-ban-do.animated .nctt-diem-7{animation-delay:1.2s}
.nctt-ban-do.animated .nctt-diem-8{animation-delay:1.35s}
.nctt-ban-do.animated .nctt-diem-song{animation:ncttSong 3.6s ease-out 2}
.nctt-ban-do.animated .nctt-diem-1 .nctt-diem-song{animation-delay:.6s}
.nctt-ban-do.animated .nctt-diem-2 .nctt-diem-song{animation-delay:.75s}
.nctt-ban-do.animated .nctt-diem-3 .nctt-diem-song{animation-delay:.9s}
.nctt-ban-do.animated .nctt-diem-4 .nctt-diem-song{animation-delay:1.05s}
.nctt-ban-do.animated .nctt-diem-5 .nctt-diem-song{animation-delay:1.2s}
.nctt-ban-do.animated .nctt-diem-6 .nctt-diem-song{animation-delay:1.35s}
.nctt-ban-do.animated .nctt-diem-7 .nctt-diem-song{animation-delay:1.5s}
.nctt-ban-do.animated .nctt-diem-8 .nctt-diem-song{animation-delay:1.65s}
@keyframes ncttDiem{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
@keyframes ncttSong{0%{opacity:.75;transform:scale(1)}55%,100%{opacity:0;transform:scale(3.4)}}
/* N5 – hàng công cụ (nctt-cong-cu): icon bật lần lượt; dải bìa (nctt-bia-truot › nctt-bia): trượt vào so le, rê chuột nghiêng nhẹ */
.nctt-cong-cu.animated>.elementor-widget{animation:ncttBat .6s cubic-bezier(.2,.75,.25,1) .2s both}
.nctt-cong-cu.animated>.elementor-widget:nth-child(2){animation-delay:.3s}
.nctt-cong-cu.animated>.elementor-widget:nth-child(3){animation-delay:.4s}
.nctt-cong-cu.animated>.elementor-widget:nth-child(4){animation-delay:.5s}
.nctt-cong-cu.animated>.elementor-widget:nth-child(5){animation-delay:.6s}
.nctt-cong-cu.animated>.elementor-widget:nth-child(6){animation-delay:.7s}
.nctt-bia-truot.animated>.nctt-bia{animation:ncttBia .95s cubic-bezier(.2,.7,.2,1) both}
.nctt-bia-truot.animated>.nctt-bia:nth-child(2){animation-delay:.15s}
.nctt-bia-truot.animated>.nctt-bia:nth-child(3){animation-delay:.3s}
@keyframes ncttBia{from{opacity:0;transform:translateY(64px)}to{opacity:1;transform:none}}
@media (hover:hover) and (pointer:fine){
.nctt-bia .elementor-widget-image img{transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}
.nctt-bia:hover .elementor-widget-image img{transform:perspective(900px) rotateX(5deg) rotateY(-7deg) translateY(-6px);box-shadow:0 34px 60px -30px rgba(11,27,63,.5)}}
/* ===== (3b) Bản 5 (04/10/2026) – chuẩn chung thiết kế + sửa lỗi ở cỡ 1100×620 (laptop 1366 phóng 125%) =====
Phạm vi: các khối có lớp nctt-khoi (6 khối trang NCTT) – gom CSS cả web không đụng trang khác. */
/* chữ không rơi 1 từ/ký hiệu một dòng: tiêu đề, nhãn, tên thẻ cân dòng; chữ link cân dòng nhưng không tự xuống dòng; đoạn chữ tránh dòng cuối 1 từ */
.nctt-khoi .elementor-heading-title,.nctt-khoi .elementor-icon-list-text,.nctt-khoi .elementor-icon-box-title{text-wrap:balance}
.nctt-khoi .elementor-button-text{text-wrap-style:balance}
.nctt-khoi .elementor-widget-text-editor p{text-wrap:pretty}
/* thẻ cùng hàng: vùng tiêu đề cao tối thiểu 2 dòng (lớp nctt-dong2) → câu hỏi, nhãn bắt đầu cùng độ cao */
@media (min-width:768px){.nctt-dong2 .elementor-heading-title{min-height:2lh}}
/* N2: câu hỏi nhỏ 1 bậc ở 1025–1280px; vùng câu hỏi cao tối thiểu theo câu dài nhất */
@media (min-width:1281px){.nctt-n2-cau .elementor-heading-title{min-height:3lh}}
@media (min-width:768px) and (max-width:1024px){.nctt-n2-cau .elementor-heading-title{min-height:2lh}}
@media (min-width:1025px) and (max-width:1280px){
.nctt-n2-hang>.nctt-n2-tam{--padding-left:22px!important;--padding-right:22px!important}
.nctt-n2-cau .elementor-heading-title{font-size:20px!important;min-height:3lh}}
/* N3: số "10", "1.770" thẳng mép trái với "6" (chữ số 1 của phông Mulish có khoảng trống bên trái) */
.nctt-so-1 .elementor-heading-title{margin-left:-0.075em}
/* ===== (4) Giảm chuyển động (prefers-reduced-motion): tắt chuyển động, hiện trạng thái cuối ===== */
@media (max-width:0px){
.nctt-hero-anh,.nctt-h1-dong .elementor-heading-title>span>span,.nctt-n3-cham-anh img,.nctt-nhan-bat .elementor-icon-list-item,
.nctt-ban-do .nctt-diem,.nctt-cong-cu>.elementor-widget,.nctt-bia-truot>.nctt-bia{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
.nctt-h1-dong strong strong::after,.nctt-diem-song{display:none!important}
.nctt-bia .elementor-widget-image img{transition:none!important}}
/* =====================================================================================================
NHÓM: NHÓM DỊCH VỤ 1 (trang tổng Dịch vụ, Tư vấn tăng trưởng, Chiến lược thương hiệu)
===================================================================================================== */
.wpcf7 .mb-form input::placeholder,.wpcf7 .mb-form textarea::placeholder{color:#8A94AD;opacity:1}
.wpcf7 .mb-form.invalid .wpcf7-response-output,.wpcf7 .mb-form.unaccepted .wpcf7-response-output,.wpcf7 .mb-form.failed .wpcf7-response-output,
.wpcf7 .mb-form.aborted .wpcf7-response-output,.wpcf7 .mb-form.spam .wpcf7-response-output{border-color:#F2B8B5!important;background:#FDF1F0;color:#8C1D18}
/* ---------- (2) BỐ CỤC PHỤ (luôn bật) ---------- */
/* H1 chia dòng: mỗi dòng là 1 thẻ không thuộc tính trong ô chữ của widget Heading (lớp dv1-h1) */
.dv1-h1 .elementor-heading-title>span{display:block}
/* T3 Tư vấn tăng trưởng: cột chùm câu hỏi ghim lại khi cuộn (máy tính) */
@media (min-width:1025px){.dv1-ghim{position:sticky!important;top:120px;align-self:flex-start}}
/* Trang tổng Dịch vụ: dòng mục lục – mũi tên trượt sang khi rê chuột */
.dv1-muc .elementor-widget-icon .elementor-icon{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.dv1-muc:hover .elementor-widget-icon .elementor-icon{transform:translateX(6px)}
.dv1-huong-dich{overflow:visible}
/* ---------- (2b) CHUẨN TRÌNH BÀY (sửa thiết kế 04/10) ---------- */
/* Tiêu đề, nhãn, link trong khối nhóm Dịch vụ 1 (khối gốc mang lớp dv1-khoi): chia dòng cân, không để 1 chữ / ký hiệu đứng riêng 1 dòng */
.dv1-khoi .elementor-heading-title,.dv1-khoi .elementor-button-text{text-wrap:balance}
/* Đầu mũi tên tam giác của nét nối 3px (màu #093C8C = màu nét; đổi màu nét trong Elementor thì đổi cả 3 màu ở đây):
dv1-mui-phai: nét ngang (đầu mũi tên ở mép phải, chạm đúng mép vòng / thẻ phía sau – nét chừa 10px lề phải cho đầu mũi tên);
dv1-mui-xuong: nét dọc (đầu mũi tên ở đáy – nét chừa 10px lề dưới); dv1-noi-mui: đoạn trên đường nối gấp khúc trang tổng (viền trên 3px). */
.dv1-mui-phai,.dv1-mui-xuong,.dv1-noi-mui{overflow:visible!important}
.dv1-mui-phai::after{content:"";position:absolute;right:-10px;top:50%;margin-top:-6px;border-left:10px solid #093C8C;border-top:6px solid transparent;border-bottom:6px solid transparent}
.dv1-mui-xuong::after{content:"";position:absolute;bottom:-10px;left:50%;margin-left:-6px;border-top:10px solid #093C8C;border-left:6px solid transparent;border-right:6px solid transparent}
.dv1-noi-mui::after{content:"";position:absolute;right:-10px;top:-7.5px;border-left:10px solid #093C8C;border-top:6px solid transparent;border-bottom:6px solid transparent}
/* Thẻ cùng hàng (lớp dv1-deu trên hàng thẻ): tiêu đề, nhãn, mô tả, link của các thẻ bắt đầu cùng độ cao – hàng thành lưới, mỗi thẻ dùng
lưới con (subgrid) theo hàng của lưới cha. dv1-deu-N: mỗi thẻ có N phần tử xếp dọc. Số cột: dv1-c3 = 3 cột từ 1025px;
dv1-c4 = 4 cột từ 1280px, 2 cột 768–1279px; dv1-c3t = 3 cột từ 768px. Ngoài các khoảng này hàng giữ cách xếp trong Elementor.
dv1-deu-con: khối con trong thẻ cũng thẳng hàng theo lưới (thẻ Dự án: 5 phần nhãn, tên, Bài toán, Mibrand làm, link – nên span 5). */
.dv1-deu-3{--dv1-n:3}
.dv1-deu-4{--dv1-n:4}
.dv1-deu-5{--dv1-n:5}
.dv1-deu-6{--dv1-n:6}
@media (min-width:1025px){
.dv1-deu.dv1-c3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))}
.dv1-deu.dv1-c3>.e-con{display:grid!important;grid-template-rows:subgrid;grid-row:span var(--dv1-n);--width:100%!important;align-content:start}
.dv1-deu.dv1-c3 .dv1-deu-con{display:grid!important;grid-template-rows:subgrid;grid-row:span 5;--width:100%!important}}
@media (min-width:768px){
.dv1-deu.dv1-c4{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))}
.dv1-deu.dv1-c3t{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))}
.dv1-deu.dv1-c4>.e-con,.dv1-deu.dv1-c3t>.e-con{display:grid!important;grid-template-rows:subgrid;grid-row:span var(--dv1-n);--width:100%!important;align-content:start}}
@media (min-width:1280px){.dv1-deu.dv1-c4{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Ô Sáu mảng: tên ô cao tối thiểu 2 dòng; Đội ngũ: chức danh cao cố định 3 dòng từ 768px (dòng đơn vị cùng một đáy) –
điện thoại không chừa sẵn: dòng đơn vị đi ngay dưới chức danh, cách 8px (như nhóm Công ty) */
@media (min-width:768px){.dv1-cao2 .elementor-heading-title{min-height:2lh}}
@media (min-width:768px){.dv1-cao3 .elementor-heading-title{min-height:3lh}}
/* Trang tổng D3: link 3 thẻ ghim cùng đáy thẻ, 1 dòng (1025–1279px chữ link co nhỏ cho vừa) */
.dv1-lk-day{margin-top:auto}
@media (min-width:1025px){.dv1-lk-day .elementor-button{white-space:nowrap}}
@media (min-width:1025px) and (max-width:1279px){.dv1-lk-day .elementor-button{font-size:clamp(13px,1.27vw,16px)!important}}
/* Dự án: ảnh khung tỉ lệ 2,15 : 1 (khớp ảnh dự án hiện có – chữ trong ảnh không bị cắt) */
.dv1-anh-da img{height:auto!important;aspect-ratio:43/20}
/* Link phụ xuống 2 dòng: chữ canh trái theo mép link */
.dv1-lk .elementor-button{text-align:left}
/* Khoảng 1025–1279px (máy tính nhỏ): Năng lực 6 số thành 3×2; Đội ngũ 3 cột × 2 hàng; Form CLTH thẻ người liên hệ lên trên form, ảnh trái – tên phải */
@media (min-width:1025px) and (max-width:1279px){
.dv1-so6{flex-wrap:wrap!important;row-gap:28px!important}
.dv1-so6>.e-con{--width:calc(100% / 3)!important}
.dv1-so6>.e-con:nth-child(3n+1){border-left-width:0!important;--padding-left:0px!important;padding-left:0!important}
.dv1-doi-hang{justify-content:center!important}
.dv1-doi-hang>.e-con{--width:calc((100% - 64px) / 3)!important}
.dv1-lh-hang{flex-direction:column!important;align-items:stretch!important}
.dv1-lh-hang{--width:min(880px,100%)!important}
.dv1-lh-hang>.e-con{--width:100%!important}
.dv1-nguoi-hang{flex-direction:row!important;align-items:center!important;gap:20px!important}}
/* ---------- (3) HIỆU ỨNG (tắt khi bật giảm chuyển động) ---------- */
@media (min-width:0px){
/* Đầu trang: H1 hiện từng dòng, trượt lên từ sau mặt nạ; cụm đậm có vệt sáng quét qua 1 lần */
.dv1-h1 .elementor-heading-title>span{animation:dv1Dong .95s cubic-bezier(.2,.7,.2,1) backwards}
.dv1-h1 .elementor-heading-title>span:nth-child(2){animation-delay:.12s}
.dv1-h1 .elementor-heading-title>span:nth-child(3){animation-delay:.24s}
.dv1-h1 strong strong{background:linear-gradient(100deg,currentColor 0 42%,#7C93FF 50%,currentColor 58% 100%) 100% 0/260% 100% no-repeat;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:dv1Quet 1.5s .75s ease-out backwards}
.dv1-len{animation:dv1Len .8s .35s cubic-bezier(.2,.7,.2,1) backwards}
.dv1-len2{animation:dv1Len .8s .5s cubic-bezier(.2,.7,.2,1) backwards}
/* TVTT đầu trang: 4 làn vẽ dần từ trái sang, khối lộ trình hiện sau cùng */
.dv1-lan .dv1-lan-thanh{transform-origin:left center;animation:dv1Ve 1.1s cubic-bezier(.3,.7,.2,1) backwards}
.dv1-lan .dv1-lan-hang:nth-child(1) .dv1-lan-thanh{animation-delay:.35s}
.dv1-lan .dv1-lan-hang:nth-child(2) .dv1-lan-thanh{animation-delay:.5s}
.dv1-lan .dv1-lan-hang:nth-child(3) .dv1-lan-thanh{animation-delay:.65s}
.dv1-lan .dv1-lan-hang:nth-child(4) .dv1-lan-thanh{animation-delay:.8s}
.dv1-lan .dv1-lan-hang .elementor-widget-heading{animation:dv1Hien .6s backwards}
.dv1-lan .dv1-lan-hang:nth-child(1) .elementor-widget-heading{animation-delay:.3s}
.dv1-lan .dv1-lan-hang:nth-child(2) .elementor-widget-heading{animation-delay:.45s}
.dv1-lan .dv1-lan-hang:nth-child(3) .elementor-widget-heading{animation-delay:.6s}
.dv1-lan .dv1-lan-hang:nth-child(4) .elementor-widget-heading{animation-delay:.75s}
.dv1-lan .dv1-lan-dich{animation:dv1Len .9s 1.25s cubic-bezier(.2,.7,.2,1) backwards}
/* CLTH đầu trang "một hướng": 6 mảng lần lượt tiến lên theo bậc chéo, đích hiện sau cùng với 1 vòng sáng lan rồi dừng */
.dv1-huong .dv1-huong-moc{animation:dv1Tien .7s cubic-bezier(.2,.7,.2,1) backwards}
.dv1-huong .dv1-m1{animation-delay:.4s}.dv1-huong .dv1-m2{animation-delay:.52s}.dv1-huong .dv1-m3{animation-delay:.64s}
.dv1-huong .dv1-m4{animation-delay:.76s}.dv1-huong .dv1-m5{animation-delay:.88s}.dv1-huong .dv1-m6{animation-delay:1s}
.dv1-huong .dv1-huong-dich{animation:dv1No .7s 1.25s cubic-bezier(.2,.8,.2,1.1) backwards}
.dv1-huong .dv1-huong-dich::after{content:"";position:absolute;inset:-2px;border-radius:999px;border:2px solid rgba(124,147,255,.6);pointer-events:none;
animation:dv1Song 1.8s 1.9s ease-out 1 both}
/* Trang tổng Dịch vụ: 5 dòng mục lục hiện lần lượt */
.dv1-muc-ds>.e-con{animation:dv1Len .7s cubic-bezier(.2,.7,.2,1) backwards}
.dv1-muc-ds>.e-con:nth-child(1){animation-delay:.35s}.dv1-muc-ds>.e-con:nth-child(2){animation-delay:.45s}
.dv1-muc-ds>.e-con:nth-child(3){animation-delay:.55s}.dv1-muc-ds>.e-con:nth-child(4){animation-delay:.65s}
.dv1-muc-ds>.e-con:nth-child(5){animation-delay:.75s}
/* Khi cuộn tới (Elementor thêm lớp "animated" cho container có Entrance Animation) */
/* Đường nối gấp khúc vẽ dần (trang tổng D2, CLTH C3) */
.dv1-noi .dv1-noi-net{opacity:0}
.dv1-noi.animated .dv1-noi-net{opacity:1;animation:dv1VeNoi 1s .2s cubic-bezier(.3,.7,.2,1) backwards}
.dv1-noi.animated .dv1-noi-net+.dv1-noi-net{animation-delay:.6s}
.dv1-noi.animated .dv1-mui-xuong{animation-name:dv1VeDoc;animation-delay:.7s}
/* TVTT T4: 4 tờ báo cáo chồng lên nhau rồi xòe ra */
.dv1-xep.animated>.e-con{animation:dv1Xoe .95s cubic-bezier(.2,.75,.2,1) backwards}
.dv1-xep.animated>.e-con:nth-child(1){--x:180%;animation-delay:.05s}.dv1-xep.animated>.e-con:nth-child(2){--x:60%;animation-delay:.15s}
.dv1-xep.animated>.e-con:nth-child(3){--x:-60%;animation-delay:.25s}.dv1-xep.animated>.e-con:nth-child(4){--x:-180%;animation-delay:.35s}
/* CLTH C3: 8 nhánh tỏa ra so le */
.dv1-cay.animated>.elementor-widget{animation:dv1No .6s cubic-bezier(.2,.8,.2,1.1) backwards}
.dv1-cay.animated>.elementor-widget:nth-child(1){animation-delay:.6s}.dv1-cay.animated>.elementor-widget:nth-child(2){animation-delay:.68s}
.dv1-cay.animated>.elementor-widget:nth-child(3){animation-delay:.76s}.dv1-cay.animated>.elementor-widget:nth-child(4){animation-delay:.84s}
.dv1-cay.animated>.elementor-widget:nth-child(5){animation-delay:.92s}.dv1-cay.animated>.elementor-widget:nth-child(6){animation-delay:1s}
.dv1-cay.animated>.elementor-widget:nth-child(7){animation-delay:1.08s}.dv1-cay.animated>.elementor-widget:nth-child(8){animation-delay:1.16s}
/* Ảnh dự án: rê chuột ảnh nghiêng nhẹ, nhấc lên */
.dv1-nghieng img{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.dv1-nghieng:hover img{transform:perspective(900px) rotateY(-5deg) rotateX(2deg) translateY(-6px);box-shadow:0 30px 60px -32px rgba(11,27,63,.55)}
/* TVTT T3: 4 bước hiện dần theo vị trí cuộn (trình duyệt hỗ trợ animation-timeline); không hỗ trợ thì hiện sẵn */
@supports (animation-timeline: view()){
.dv1-buoc{animation:dv1Buoc linear both;animation-timeline:view();animation-range:entry 0% entry 85%}
.dv1-buoc .dv1-buoc-so{animation:dv1SoTo linear both;animation-timeline:view();animation-range:entry 10% entry 100%}}}
@keyframes dv1Dong{from{clip-path:inset(0 0 100% 0);transform:translateY(.55em)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes dv1Quet{from{background-position:100% 0}to{background-position:0 0}}
@keyframes dv1Len{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes dv1Hien{from{opacity:0}to{opacity:1}}
@keyframes dv1Ve{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes dv1No{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes dv1Song{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
@keyframes dv1Tien{from{opacity:0;transform:translate(-22px,22px)}to{opacity:1;transform:none}}
@keyframes dv1VeNoi{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes dv1VeDoc{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes dv1Xoe{from{opacity:0;transform:translateX(var(--x,0)) rotate(-4deg) scale(.94)}to{opacity:1;transform:none}}
@keyframes dv1Buoc{from{opacity:.18;transform:translateY(46px) scale(.97)}to{opacity:1;transform:none}}
@keyframes dv1SoTo{from{transform:scale(.7);opacity:.3}to{transform:none;opacity:1}}
/* Giảm chuyển động: hiện ngay mọi phần tử có Entrance Animation của Elementor */
@media (max-width:0px){
.elementor-invisible{visibility:visible!important}
.elementor-element.animated{animation:none!important}}
/* =====================================================================================================
NHÓM: NHÓM DỊCH VỤ 2 (Phát triển thương hiệu, Giải thưởng & Chứng nhận)
===================================================================================================== */
/* ===== (2) Viên nhãn, tiêu đề H1 (riêng Dịch vụ 2) ===== */
/* viên nhãn: widget Icon List xếp ngang có lớp dv2-nhan-vien */
.dv2-nhan-vien .elementor-icon-list-items.elementor-inline-items{display:flex;flex-wrap:wrap;gap:8px;margin:0!important}
.dv2-nhan-vien .elementor-icon-list-items.elementor-inline-items>.elementor-icon-list-item{margin:0!important;padding:7px 14px 7px 12px;border:1px solid rgba(0,20,137,.13);border-radius:999px;background:rgba(255,255,255,.82);box-shadow:0 8px 18px -14px rgba(0,20,137,.45)}
.dv2-nhan-vien .elementor-icon-list-item:after{display:none!important}
/* H1 (widget lớp dv2-h1-dong): mỗi dòng nằm trong 2 lớp – dòng trượt lên từ sau mặt nạ, lần lượt; cụm đậm có 1 vệt sáng quét qua 1 lần */
.dv2-h1-dong .elementor-heading-title>span{display:block;overflow:hidden;padding:.14em 0 .08em;margin:-.14em 0 -.08em}
.dv2-h1-dong .elementor-heading-title>span>span{display:block;animation:dv2Dong .95s cubic-bezier(.2,.7,.15,1) .1s both}
.dv2-h1-dong .elementor-heading-title>span:nth-child(2)>span{animation-delay:.24s}
.dv2-h1-dong .elementor-heading-title>span:nth-child(3)>span{animation-delay:.38s}
@keyframes dv2Dong{from{transform:translateY(115%)}to{transform:none}}
.dv2-h1-dong strong strong{position:relative;display:inline-block}
.dv2-h1-dong strong strong::after{content:"";position:absolute;top:-.12em;bottom:-.06em;left:0;width:38%;pointer-events:none;
background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.92) 50%,rgba(255,255,255,0) 100%);
transform:translateX(-110%) skewX(-14deg);opacity:0;animation:dv2Quet 1.1s cubic-bezier(.45,0,.2,1) 1.15s both}
.dv2-h1-dong .elementor-heading-title>span:nth-child(3) strong strong::after{animation-delay:1.4s}
@keyframes dv2Quet{0%{opacity:0;transform:translateX(-110%) skewX(-14deg)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(300%) skewX(-14deg)}}
@keyframes dv2Bat{from{opacity:0;transform:translateY(12px) scale(.92)}to{opacity:1;transform:none}}
/* ===== (3) Riêng nhóm Dịch vụ 2 (Phát triển thương hiệu, Giải thưởng & Chứng nhận) – bản 2, 04/10/2026 (đầu trang đã chốt A; đã bỏ CSS 2 đầu trang B) =====
Không JS. Chỉ @keyframes, :hover, animation-timeline (bọc @supports – trình duyệt chưa hỗ trợ thì hiện trạng thái cuối). Chuyển động bằng transform, opacity, clip-path.
Lớp tiền tố dv2-, keyframes tiền tố dv2 để không trùng trang khác khi gom CSS. Bảng lớp: handoff Dịch vụ 2 mục 4. */
/* câu dẫn, hàng nút đầu trang (lớp dv2-hien-cham): hiện sau H1 */
.dv2-hien-cham{animation:dv2Len .8s cubic-bezier(.2,.7,.2,1) .55s both}
@keyframes dv2Len{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* PTTH đầu trang A – vòng thương hiệu: 4 nhãn chặng (dv2-vong-nhan + dv2-tre-1..4) hiện lần lượt khi cung tương ứng vẽ xong (cung vẽ bằng CSS trong chính file SVG); số 7 ở tâm (dv2-vong-tam) */
.dv2-vong-nhan{animation:dv2Nhan .55s cubic-bezier(.2,.8,.2,1) both}
.dv2-tre-1{animation-delay:.85s}
.dv2-tre-2{animation-delay:1.23s}
.dv2-tre-3{animation-delay:1.61s}
.dv2-tre-4{animation-delay:1.99s}
@keyframes dv2Nhan{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
.dv2-vong-tam{animation:dv2Len .9s ease .35s both}
/* PTTH Công cụ – tab bấm (widget Nested Tabs lớp dv2-tab-bam): công cụ là viên nhãn cỡ lớn (Icon List lớp dv2-nhan-vien dv2-nhan-lon);
khi tab vừa mở (và khối đã vào màn – lớp animated của Entrance Animation), các viên nhãn bật lên lần lượt (keyframes chung dv2Bat) */
.dv2-nhan-lon .elementor-icon-list-items.elementor-inline-items{gap:12px}
.dv2-nhan-lon .elementor-icon-list-items.elementor-inline-items>.elementor-icon-list-item{padding:11px 20px 11px 16px}
@media (max-width:767px){.dv2-nhan-lon .elementor-icon-list-items.elementor-inline-items{gap:8px}.dv2-nhan-lon .elementor-icon-list-items.elementor-inline-items>.elementor-icon-list-item{padding:8px 14px 8px 12px}}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item{animation:dv2Bat .45s cubic-bezier(.2,.8,.2,1) both}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(2){animation-delay:.05s}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(3){animation-delay:.1s}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(4){animation-delay:.15s}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(5){animation-delay:.2s}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(6){animation-delay:.25s}
.dv2-tab-bam.animated .e-n-tabs-content>.e-con.e-active .dv2-nhan-vien .elementor-icon-list-item:nth-child(7){animation-delay:.3s}
/* GTCN đầu trang A – sân khấu (khối dv2-san-khau): 3 luồng đèn (dv2-den dv2-den-1..3) quét vào giữa khi mở trang rồi đứng yên; quầng sáng sàn (dv2-san-san) */
.dv2-san-khau .dv2-den{transform-origin:50% 0;filter:blur(22px);mix-blend-mode:screen;-webkit-clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);pointer-events:none}
.dv2-san-khau .dv2-den-1{transform:rotate(-24deg);animation:dv2Den1 2.4s cubic-bezier(.2,.7,.2,1) .15s both}
.dv2-san-khau .dv2-den-2{transform:none;animation:dv2Den2 1.8s ease .05s both}
.dv2-san-khau .dv2-den-3{transform:rotate(24deg);animation:dv2Den3 2.4s cubic-bezier(.2,.7,.2,1) .15s both}
@keyframes dv2Den1{from{opacity:0;transform:rotate(28deg)}to{opacity:1;transform:rotate(-24deg)}}
@keyframes dv2Den2{from{opacity:0;transform:scaleY(.6)}to{opacity:1;transform:none}}
@keyframes dv2Den3{from{opacity:0;transform:rotate(-28deg)}to{opacity:1;transform:rotate(24deg)}}
.dv2-san-san{animation:dv2Len 1.6s ease .7s both;pointer-events:none}
/* thẻ có ảnh (dv2-the-anh) – rê chuột: ảnh trong khung (dv2-anh-khung) phóng nhẹ */
.dv2-the-anh .dv2-anh-khung img{transition:scale .7s cubic-bezier(.2,.7,.2,1)}
.dv2-the-anh:hover .dv2-anh-khung img{scale:1.05}
/* khi cuộn tới (trình duyệt hỗ trợ animation-timeline): đường nối tự vẽ từ trái sang (dv2-noi-ve); ảnh thu nhỏ về cỡ thật (widget Image lớp dv2-anh-vao) */
@supports (animation-timeline: view()){
.dv2-noi-ve{animation:dv2Ve linear both;animation-timeline:view();animation-range:entry 30% cover 42%}
.dv2-anh-vao img{animation:dv2AnhVao linear both;animation-timeline:view();animation-range:entry 0% cover 38%}}
@keyframes dv2Ve{from{-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0)}to{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0)}}
@keyframes dv2AnhVao{from{transform:scale(1.16)}to{transform:none}}
/* ===== (3b) Bản 3 (04/10/2026) – chuẩn chung thiết kế + sửa lỗi ở cỡ 1100×620 (laptop 1366 phóng 125%) =====
Phạm vi: chỉ các khối có lớp dv2-khoi (mọi khối của 2 trang Dịch vụ 2) – gom CSS cả web không đụng trang khác. */
/* chữ không rơi 1 từ/ký hiệu một dòng: tiêu đề, nhãn, tên thẻ, link cân dòng; đoạn chữ tránh dòng cuối 1 từ */
.dv2-khoi .elementor-heading-title,.dv2-khoi .elementor-icon-list-text,.dv2-khoi .elementor-icon-box-title{text-wrap:balance}
.dv2-khoi .elementor-button-text{text-wrap-style:balance}
.dv2-khoi .elementor-widget-text-editor p{text-wrap:pretty}
/* tiêu đề thẻ cùng hàng: vùng tiêu đề cao tối thiểu 2 dòng (lớp dv2-dong2) → mô tả bắt đầu cùng độ cao */
@media (min-width:768px){.dv2-dong2 .elementor-heading-title{min-height:2lh}}
/* "Chính sách bảo mật" (ô đồng ý của form) không bẻ đôi */
.dv2-khoi .wpcf7-acceptance a{white-space:nowrap}
/* form: "Hoặc gọi thẳng 0902 598 228" và "Nhắn Zalo →" xếp cột khi cột chữ hẹp (dv2-goi-hang), bỏ dấu chấm giữa */
@media (min-width:1025px) and (max-width:1280px){.dv2-goi-hang{flex-direction:column!important;align-items:flex-start!important}.dv2-goi-hang .dv2-goi-cham{display:none}}
/* PTTH đầu trang: 1025–1280px và máy tính bảng, điện thoại – 4 nhãn chặng ra 4 góc khung vòng, không đè cung (cách mép màn ≥ 20px nhờ lề trang) */
@media (max-width:1280px){
.dv2-vong-nhan{margin:0!important}
.dv2-vong-nhan.dv2-tre-1{top:0!important;bottom:auto!important;left:auto!important;right:0!important}
.dv2-vong-nhan.dv2-tre-2{top:auto!important;bottom:0!important;left:auto!important;right:0!important}
.dv2-vong-nhan.dv2-tre-3{top:auto!important;bottom:0!important;right:auto!important;left:0!important}
.dv2-vong-nhan.dv2-tre-4{top:0!important;bottom:auto!important;right:auto!important;left:0!important}}
/* PTTH Dịch vụ: link "Tham khảo báo cáo mẫu →" 1 dòng, gạch chân dài theo chữ */
.dv2-link-mau .elementor-button,.dv2-link-mau .elementor-button-text{white-space:nowrap}
@media (min-width:1025px) and (max-width:1280px){.dv2-link-mau .elementor-button{font-size:14px;letter-spacing:0}}
/* PTTH Công cụ: 1025–1280px 5 tab vừa 1 hàng (chữ, lề tab nhỏ 1 bậc) */
@media (min-width:1025px) and (max-width:1280px){
.dv2-tab-bam .e-n-tabs-heading{flex-wrap:nowrap!important;gap:8px!important}
.dv2-tab-bam .e-n-tab-title{padding:10px 13px!important;flex:0 1 auto}
.dv2-tab-bam .e-n-tab-title-text{font-size:13.5px!important;white-space:nowrap}}
/* tab vuốt ngang ở điện thoại (lớp dv2-tab-vuot): mờ dần ở 2 mép để thấy còn tab */
@media (max-width:767px){
.dv2-tab-vuot .e-n-tabs-heading{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 36px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 36px),transparent 100%);padding-inline:6px 28px!important}}
/* PTTH Dự án: 1025–1280px nhãn ngành · chặng xuống dòng dưới logo (không bị cắt) */
@media (min-width:1025px) and (max-width:1280px){
.dv2-da-nhan{flex-direction:column!important;align-items:flex-start!important;gap:8px!important}
.dv2-da-nhan .dv2-da-nganh{border-left-width:0!important;padding-left:0!important}}
/* KHỐI ĐỘI NGŨ (lượt 2 04/10 – đồng bộ đúng khối Đội ngũ trang Về chúng tôi, CSS mục 12 của nhóm Công ty): 1025–1279px 3 cột × 2 hàng;
chức danh cao cố định 3 dòng ở máy tính, máy tính bảng → dòng MIBRAND / MVV GROUP cùng một đáy; điện thoại: dòng đơn vị đi ngay dưới chức danh (cách 8px) */
@media (min-width:768px){.dv2-dn-chuc-danh .elementor-heading-title{min-height:calc(3 * 1.45em)}}
@media (min-width:1025px) and (max-width:1279px){.dv2-dn-hang>.dv2-dn-nguoi{--width:calc((100% - 96px) / 3)!important}}
/* KHỐI KHÁCH HÀNG THEO NGÀNH (lượt 2 04/10 – đồng bộ đúng khối Khách hàng trang Về chúng tôi bản chốt, CSS mục 8 + 14 của nhóm Công ty):
ô logo tỉ lệ 2:1 (file logo 300×120 nằm giữa ô) → logo nhỏ có chỗ phóng thêm bằng Transform › Scale mà không bị cắt */
.dv2-kh-o{aspect-ratio:2/1}
/* hàng tab:
7 tab 1 hàng ở ≥1440; 881–1439px chia 2 hàng 4 + 3 (không để 1 tab lẻ); ≤880px 1 hàng vuốt ngang, mờ mép phải. Thêm / bớt tab thì sửa số 5 trong :nth-child(n+5). */
.dv2-tab-nganh .e-n-tabs-heading{flex-wrap:wrap}
@media (min-width:881px) and (max-width:1439px){
.dv2-tab-nganh .e-n-tabs-heading::before{content:"";order:1;flex-basis:100%;height:0}
.dv2-tab-nganh .e-n-tabs-heading>.e-n-tab-title:nth-child(n+5){order:2}}
@media (max-width:880px){
.dv2-tab-nganh .e-n-tabs-heading{flex-wrap:nowrap!important;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 0 8px;
-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 28px),transparent 100%)}
.dv2-tab-nganh .e-n-tabs-heading::-webkit-scrollbar{display:none}
.dv2-tab-nganh .e-n-tab-title{flex:0 0 auto;white-space:nowrap}}
/* GTCN Dấu ấn: 1025–1280px 4 thẻ xếp 2 × 2 (nhãn dài vừa 1 dòng, tiêu đề cùng độ cao) */
@media (min-width:1025px) and (max-width:1280px){.dv2-the4{--width:calc(50% - 12px)!important}.dv2-the4 .dv2-dong2 .elementor-heading-title{min-height:0}}
/* lượt 2: 1281–1439px (4 thẻ 1 hàng, thẻ hẹp) nhãn dài "Chương trình của Bộ Công Thương" nhỏ 1 bậc để nằm gọn trong viên (không chạm viền) */
@media (min-width:1281px) and (max-width:1439px){.dv2-nhan-the .elementor-heading-title{font-size:11.5px!important;letter-spacing:.02em!important}}
/* PTTH Dự án: ảnh thẻ khung 16:9 ở mọi cỡ (ảnh ABIC 16:9 hiện đủ; ảnh Metfone vuông lấy phần giữa – không cắt dở chữ hay logo trên ảnh) */
.dv2-anh-169 img{aspect-ratio:16/9;height:auto!important}
/* GTCN Dự án: ≥ 1281px "Doanh nghiệp tiêu biểu" (dv2-gt-dn) nằm dưới cột chữ (dv2-gt-trai), cột ảnh (dv2-gt-phai) cao bằng 2 phần bên trái → 2 cột cân nhau */
@media (min-width:1281px){
.dv2-gt-case{display:grid!important;grid-template-columns:minmax(0,46fr) minmax(0,54fr);grid-template-areas:"trai phai" "dn phai";column-gap:56px;row-gap:28px;align-items:center}
.dv2-gt-case>.dv2-gt-trai{grid-area:trai;width:auto!important;align-self:end}
.dv2-gt-case>.dv2-gt-phai{grid-area:phai;width:auto!important}
.dv2-gt-case>.dv2-gt-dn{grid-area:dn;width:auto!important;align-self:start}}
/* GTCN Dự án: 4 ảnh lễ công bố giữ khung 3:2 (không cắt chữ trên phông) */
.dv2-anh-32 img{aspect-ratio:3/2;height:auto!important;object-fit:cover;object-position:center top}
.dv2-anh-32.dv2-anh-duoi img{object-position:center bottom}
/* ===== (4) Giảm chuyển động (prefers-reduced-motion): tắt chuyển động, hiện trạng thái cuối – gồm phần (2) và (3) ===== */
@media (max-width:0px){
.dv2-h1-dong .elementor-heading-title>span>span{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
.dv2-h1-dong strong strong::after{display:none!important}
.dv2-hien-cham,.dv2-vong-nhan,.dv2-vong-tam,.dv2-san-khau .dv2-den,.dv2-san-san,.dv2-noi-ve,.dv2-anh-vao img,.dv2-tab-bam .dv2-nhan-vien .elementor-icon-list-item{animation:none!important}
.dv2-the-anh .dv2-anh-khung img{transition:none}
.dv2-khoi .elementor-invisible,.dv2-khoi.elementor-invisible{visibility:visible!important}
.dv2-khoi .elementor-element.animated,.dv2-khoi.animated{animation:none!important}}
/* =====================================================================================================
NHÓM: NHÓM CÔNG TY (Về chúng tôi, Liên hệ, Tuyển dụng, Chính sách)
===================================================================================================== */
/* ===== Mibrand – NHÓM CÔNG TY (Về chúng tôi, Liên hệ, Tuyển dụng, Chính sách) – bản 2 đã chốt + sửa thiết kế 04/10/2026. KHÔNG XOÁ.
Dán NỐI TIẾP vào Giao diện › Tùy biến › CSS bổ sung (sau đoạn CSS form đang có). Chỉ tác động phần tử có các lớp dưới đây
(đặt ở Advanced › CSS Classes của widget / container trong Elementor), trừ mục 7 (lớp td-* có sẵn của giao diện) và mục 10 (theo trang).
Sửa chữ, ảnh trong Elementor không làm mất hiệu ứng, miễn là giữ nguyên lớp. Chuyển động chỉ dùng transform, opacity, clip-path;
người dùng bật giảm chuyển động thì tắt hết (cuối file).
Tên lớp (luật chung mục 4): lớp riêng của nhóm tiền tố cty-, tên @keyframes tiền tố cty. Lớp mb- chỉ còn ở thành phần dùng chung
(form mb-form…, nút mb-cta, chân trang mb-chan-trang-…).
Lớp: cty-khoi (mọi khối cấp đầu, mục 13) · cty-h1-hien (H1) · cty-hien-cham (câu dẫn, nút đầu trang) · cty-troi, cty-troi-1/2/3 (quầng sáng – Về chúng tôi)
cty-vong-vao (ảnh vòng 6 bước) · cty-hst-cham (chấm dịch vụ – Hệ sinh thái) · cty-muc-luc-dinh, cty-muc-luc, cty-dieu-chu (Chính sách)
cty-tab-nganh (tab ngành) · cty-kh-o (ô logo khách hàng, mục 14) · cty-dn-hang, cty-dn-nguoi, cty-dn-chuc-danh (khối Đội ngũ, mục 12) · cty-hst-ten (tên dịch vụ
Hệ sinh thái) · mb-chan-trang-ket-noi, mb-chan-trang-nen (2 container của chân trang chung, mục 10)
Đổi tên 04/10 (bản 1 → bản 2 chốt): mb-h1-hien → cty-h1-hien · mb-hien-cham → cty-hien-cham · mb-troi* → cty-troi* · mb-vong-vao → cty-vong-vao
· mb-hst-cham → cty-hst-cham · mb-tab-nganh → cty-tab-nganh · mb-muc-luc-dinh, mb-muc-luc, mb-dieu-chu → cty-…; keyframes mbMatNa… → ctyMatNa…
Bản 2 bỏ hẳn (không còn trên trang): mb-quay-cham, mb-noi, mb-nhip, mb-dinh, mb-td, mb-td-noi-bat. */
/* 1. Mở trang: H1 trượt lên từ sau mặt nạ, cụm đậm có 1 vệt sáng quét qua 1 lần; câu dẫn, nút hiện sau */
@keyframes ctyMatNa{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(28px)}to{opacity:1;clip-path:inset(-10% -5% -20% -5%);transform:none}}
@keyframes ctyHienLen{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes ctyVetSang{from{background-position:120% 0}to{background-position:-40% 0}}
.cty-h1-hien .elementor-heading-title{animation:ctyMatNa 1.05s cubic-bezier(.2,.75,.2,1) both}
.cty-h1-hien .elementor-heading-title strong strong{background:linear-gradient(100deg,#001489 0,#001489 42%,#5B7CFF 50%,#001489 58%,#001489 100%);background-size:260% 100%;background-position:-40% 0;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:ctyVetSang 1.6s .9s cubic-bezier(.4,0,.2,1) both}
.cty-hien-cham{animation:ctyHienLen .9s .35s cubic-bezier(.2,.75,.2,1) both}
/* 2. Quầng sáng đầu trang B (Về chúng tôi): trôi chậm, không nhấp nháy */
@keyframes ctyTroi{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(48px,-36px,0) scale(1.14)}}
.cty-troi{animation:ctyTroi 18s ease-in-out infinite alternate;will-change:transform;pointer-events:none}
.cty-troi-2{animation-duration:23s;animation-direction:alternate-reverse}
.cty-troi-3{animation-duration:27s}
/* 3. Vòng 6 bước (Vì sao chọn Mibrand): khi Elementor gắn lớp animated (vòng vào màn hình) thì vòng xoay nhẹ vào chỗ */
@keyframes ctyVongVao{from{opacity:0;transform:rotate(-55deg) scale(.9)}to{opacity:1;transform:none}}
.cty-vong-vao.animated img{animation:ctyVongVao 1.5s cubic-bezier(.2,.75,.2,1) both}
/* 4. Hệ sinh thái: máy tính bảng, điện thoại – chấm nhỏ không quầng, tên dịch vụ 1 dòng liền (ẩn chỗ ngắt dòng cố định của máy tính) */
@media (max-width:1024px){.cty-hst-cham{box-shadow:none!important}.cty-hst-ten br{display:none}}
/* 6. Ghim khi cuộn (máy tính): mục lục Chính sách */
@media (min-width:1025px){.cty-muc-luc-dinh{position:sticky;top:112px;align-self:flex-start}}
/* mục lục Chính sách (sửa 04/10): danh sách đánh số – số thẳng cột, dòng 2 thụt thẳng với chữ dòng 1 */
.cty-muc-luc ol{margin:0;padding-left:1.75em}
.cty-muc-luc li{margin:0;padding:0}
.cty-muc-luc li::marker{color:#6E7A93;font-variant-numeric:tabular-nums}
.cty-muc-luc li a{display:block;padding:6px 10px 6px 6px;border-radius:10px;color:inherit;text-decoration:none;text-wrap:balance;transition:background .2s,color .2s}
.cty-muc-luc li a:hover{background:rgba(8,104,176,.08);color:#001489}
.cty-dieu-chu ul{margin:0;padding-left:1.25em}
.cty-dieu-chu li{margin:.3em 0;padding-left:.2em}
.cty-dieu-chu li::marker{color:#0868B0}
/* 7. Tuyển dụng: trình bày lại danh sách việc của giao diện (shortcode trong trang /tuyen-dung/, id 2250).
Lớp td-* lấy từ mã HTML thật của trang (đọc 03/10/2026). Giao diện in khối