/*
 * Header Libero — tách riêng khỏi home.css.
 *
 * Vì sao là file riêng: header dùng cho MỌI trang, còn home.css (44 KB) hầu hết
 * là CSS của 12 section trang chủ. Gộp chung thì 509 địa chỉ phải tải 44 KB để
 * dùng khoảng 6 KB.
 *
 * File này KHÔNG được phụ thuộc .lb-home: ở những trang không phải trang chủ,
 * header đứng ngoài khối đó.
 */

/* ============================================================
 * 1. Header — Figma dựng header nằm trong frame `hero`
 *
 * Header của Fusion Theme Builder bị ẩn trên trang này (xem .lb-has-own-header
 * ở cuối file). Chỉ trang dùng template redesign mới đổi; 56 trang còn lại giữ
 * nguyên header cũ.
 * ============================================================ */
.lb-header {
  position: relative;
  /*
   * 40 chu khong phai 20: khung Avada boc hero co z-index 30 (xem quy tac
   * .fusion-fullwidth:has(.lb-finder) trong tokens.css). Hai the la anh em
   * nen so nho hon se nam duoi, va chu hero de len menu con cua header.
   */
  z-index: 40;
  background: transparent;
}

/* ---- Thanh trên: hotline, email | social, ngôn ngữ, LiberoGo ---- */
.lb-header__top {
  border-bottom: 1px solid rgba(15, 15, 46, .07);
}

.lb-header__top-inner,
.lb-header__bar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

/* Figma: hang tren cao 24, cong dem thanh 34. */
.lb-header__top-inner { min-height: 34px; }

.lb-header__contact { display: flex; align-items: center; gap: 22px; }

.lb-header__c {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--lb-sans-xs);
  color: var(--lb-n6);
  text-decoration: none;
}

.lb-header__c:hover { color: var(--lb-nature); }
.lb-header__c svg { width: 15px; height: 15px; flex: 0 0 auto; }

/*
 * Cụm phải thanh trên — Figma Frame 11 (đo 15/09/2026, khung 1600):
 *   ba nhóm (mạng xã hội · ngôn ngữ · LiberoGo) cách nhau 32
 *   mạng xã hội: 3 vòng 24, nền #1B1B38 10%, hình 12 cao #1B1B38 80%, cách 9
 *   ngôn ngữ (Frame 9): 71 x 24, bo 24, viền #1B1B38 10%, đệm 2/5, gap 7
 *   LiberoGo (Frame 7): huy hiệu Go 24 #FF3251 · chữ 13.33 w400 · icon 16, gap 6
 * Ba vòng mạng xã hội là anh em trực tiếp của .lb-header__aux nên khe 9 giữa
 * chúng đặt bằng margin âm (9 - 32 = -23), không tách thêm div để khỏi đụng CSS
 * khổ điện thoại.
 */
.lb-header__aux { display: flex; align-items: center; gap: 32px; }
.lb-header__soc + .lb-header__soc { margin-left: -23px; }

.lb-header__soc {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(27, 27, 56, .1);
  color: rgba(27, 27, 56, .8);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  transition: background .2s ease, color .2s ease;
}

.lb-header__soc:hover { background: var(--lb-nature); color: var(--lb-white); }
.lb-header__soc svg { width: 12px; height: 12px; }

.lb-header__lang {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--lb-sans-xs);
  color: var(--lb-n6);
}

.lb-header__lang svg { width: 15px; height: 15px; }

.lb-header__caret {
  width: 6px;
  height: 6px;
  border-right: 1.4px solid currentColor;
  border-bottom: 1.4px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
}

.lb-header__go {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13.33px;
  font-weight: 400;
  color: var(--lb-nature);
  text-decoration: none;
  white-space: nowrap;
}

.lb-header__go svg { width: 16px; height: 16px; color: var(--lb-nature); }

.lb-header__go-badge {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #FF3251;
  color: var(--lb-white);
  font-size: 11px;
  font-weight: var(--lb-w-bold, 700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

/* ---- Thanh nav ---- */
/* 34 + 76 = 110, dung chieu cao frame `header` cua Figma. */
.lb-header__bar-inner { min-height: 76px; }

.lb-header__logo { display: inline-flex; align-items: center; flex: 0 0 auto; }

/*
 * Chiều cao logo — CỐ Ý LỚN HƠN FIGMA.
 *
 * Figma đặt logo header 55,53 x 39,4px. Bản dựng trước để 46px rồi 56px, và
 * theo yêu cầu ngày 07/09/2026 để 60px. Ghi rõ ở đây để lần sau đối chiếu Figma
 * không ai tưởng là dựng sai rồi "sửa" ngược về 39px.
 *
 * File logo đã được cắt sạch lề trong suốt (290 x 205, tỉ lệ 1,41 — đúng bằng
 * tỉ lệ Figma). Trước đó file có lề chiếm 8% nên ở cùng chiều cao ô, hình thật
 * nhỏ hơn con số ghi trong CSS; nay chiều cao ô = chiều cao hình.
 *
 * Giữ nguyên min-height 78px của thanh header nên bố cục không xê dịch: logo
 * 60px còn thừa 9px trên và dưới.
 */
/*
 * Độ đặc hiệu 0,2,1 — CÓ CHỦ Ý, không phải viết thừa.
 *
 * home.css có `.lb-home img { height: auto }` (0,1,1) và nạp SAU header.css.
 * Trên trang chủ, header nằm bên trong .lb-home nên hai rule cùng độ đặc hiệu,
 * rule nạp sau thắng — logo trở về chiều cao gốc 205px, tràn ra khỏi thanh.
 * Thêm một lớp nữa vào selector là đủ để thắng mà không phải dùng !important.
 */
.lb-header .lb-header__logo img { width: auto; height: 60px; display: block; }
.lb-header__logo-text {
  font-family: var(--lb-font-serif);
  font-weight: var(--lb-w-bold);
  font-size: 22px;
  letter-spacing: .04em;
  color: var(--lb-nature);
}

.lb-nav__list {
  display: flex;
  align-items: center;

  /* Figma Frame 15: gap radius/24. */
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lb-nav__item { position: relative; }

.lb-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 5px;

  /* Figma: 16 / 24, gian chu 0. */
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  color: var(--lb-nature);
  text-decoration: none;
  white-space: nowrap;
}

.lb-nav__link:hover { color: var(--lb-group-deep); }

/*
 * Muc dang mo — do trong Figma, khong phai tu nghi ra.
 *
 * Frame `Newsroom / chi tiet`, muc "Newsroom" dang mo:
 *   chu       #FF3251, Google Sans Flex 400 (THUONG, khong dam), 16/24
 *   gach chan Line 22 — 2px #FF3251, rong 100 trong khi chu rong 81
 *             (thua ~9px moi ben), nam thap hon day chu 11px
 *
 * --trail (dang o mot trang CON cua muc do, vi du /don-vi/lim/ thi to muc
 * "Don vi") khong co trong Figma. Giu mau do nhung KHONG gach chan, de phan
 * biet "dang o dung day" voi "dang o trong nhanh nay".
 */
.lb-nav__item--active > .lb-nav__link,
.lb-nav__item--trail > .lb-nav__link {
  color: var(--lb-group);
  font-weight: 400;
}

.lb-nav__item--active > .lb-nav__link {
  position: relative;
}

.lb-nav__item--active > .lb-nav__link::after {
  content: "";
  position: absolute;
  left: -9px;
  right: -9px;
  bottom: -11px;
  height: 2px;
  background: var(--lb-group);
}

/* Muc con dang mo trong bang xo xuong — Figma khong ve, giu nen nhat cho de thay. */
.lb-nav__sub .lb-nav__item--active > .lb-nav__link {
  background: var(--lb-bg-alt);
  color: var(--lb-group);
}

.lb-nav__sub .lb-nav__item--active > .lb-nav__link::after { content: none; }
.lb-nav__plus { color: var(--lb-n5); font-size: 14px; line-height: 1; }

/* Nút "Khám phá" — Figma đặt nút đỏ bo tròn chen giữa thanh nav */
.lb-nav__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 22px;
  border-radius: 999px;
  /* #FF3251, không phải #D20F12. Hiệu chuẩn bằng cách lấy mẫu cùng một ảnh
   * Figma: nút này và tiêu đề trang Khám phá cho ra cùng giá trị, mà tiêu đề đó
   * đo trên ảnh PNG gốc là #FF3251. */
  background: var(--lb-group);
  color: var(--lb-white);
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  font-weight: var(--lb-w-medium);
  text-decoration: none;
  white-space: nowrap;
}

.lb-nav__cta:hover,
.lb-nav__item--active > .lb-nav__cta { background: var(--lb-group-deep); }
.lb-nav__cta svg { width: 16px; height: 16px; }

/* Menu con của "Đơn vị" */
.lb-nav__sub {
  position: absolute;
  top: calc(100% + 14px);
  left: -18px;
  /*
   * Rộng theo nội dung: tên đơn vị dài ("Trung tâm Công nghiệp Văn hóa") trước
   * đây bị bẻ xuống hai dòng vì khung khoá 256px. max-content cho khung nở theo
   * mục dài nhất; vẫn giữ sàn 256 (Figma) và trần theo màn hình để không tràn.
   */
  width: max-content;
  min-width: 256px;
  max-width: min(480px, calc(100vw - 32px));
  list-style: none;
  margin: 0;
  padding: 8px;
  background: var(--lb-white);
  border: var(--lb-card-border-w) solid var(--lb-card-border);
  border-radius: var(--lb-radius-md);
  box-shadow: 0 18px 40px -20px rgba(15, 15, 46, .45);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
  z-index: 30;
}

/*
 * Nhip cau vo hinh bac qua 14px ho.
 *
 * Khong co no thi ro chuot di tu muc menu xuong menu con se roi khoi <li>
 * mot nhip, :hover tat va menu dong ngay. Nhip cau la con cua .lb-nav__sub
 * nen van nam trong <li>, cham vao no la hover van giu.
 */
.lb-nav__sub::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -14px;
  height: 14px;
}

.lb-nav__item--parent:hover .lb-nav__sub,
.lb-nav__item--parent:focus-within .lb-nav__sub {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.lb-nav__sub .lb-nav__link {
  display: block;
  padding: 9px 12px;
  border-radius: 9px;
  white-space: nowrap;
}

.lb-nav__sub .lb-nav__link:hover { background: var(--lb-bg-alt); }

.lb-header__search {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  background: var(--lb-bg-alt);
  color: var(--lb-nature);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: 0 0 auto;
}

.lb-header__search:hover { background: var(--lb-group-deep); color: var(--lb-white); }
.lb-header__search svg { width: 19px; height: 19px; }

/* ============================================================
 * Cuộn mượt cho liên kết trong trang
 *
 * Các nút trỏ tới neo trong cùng trang — "Đăng ký" ở Lịch khai giảng, "Đăng ký
 * tư vấn" ở trang Giải pháp — mặc định nhảy giật một phát. Cuộn mượt giữ được
 * mạch nhìn: người đọc thấy mình đi qua những gì để tới form.
 *
 * Chỉ khai cho phần tử cuộn của tài liệu. scroll-behavior KHÔNG kế thừa, nên
 * các khung cuộn ngang (dải thẻ giảng viên, khoá học) không bị ảnh hưởng —
 * chúng tự khai riêng trong home.css.
 *
 * Người đã tắt hiệu ứng chuyển động trong hệ điều hành thì trả về nhảy thẳng.
 * ============================================================ */
html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* ============================================================
 * Header của Theme Builder trên trang dùng template redesign
 *
 * Trang này tự dựng header riêng theo Figma, nên phải ẩn header cũ của Fusion
 * Theme Builder — nếu không sẽ hiện hai header chồng nhau. Rule đặt ở cấp body
 * chứ không trong .lb-home, vì .fusion-tb-header là phần tử ANH EM của .lb-home
 * chứ không nằm bên trong.
 * ============================================================ */
body.lb-has-own-header .fusion-tb-header { display: none !important; }

/* Header tự dựng: thu gọn ở màn hẹp */
@media (max-width: 1100px) {
  .lb-nav__list { gap: 18px; }
  .lb-nav__link, .lb-nav__cta { font-size: var(--lb-sans-xs); }
  .lb-nav__cta { padding: 9px 16px; }
}

/* ---- Bảng tìm kiếm ---- */
/*
 * Đóng/mở bằng grid-template-rows 0fr → 1fr: cách này không phải đoán trước
 * chiều cao như max-height, đoán thiếu là nội dung bị cắt.
 *
 * KHÔNG transition thuộc tính này. Đã thử và Chrome giữ nguyên giá trị dùng ở
 * 0px, bảng mở ra mà cao đúng 1px — kiểm chứng 07/09/2026: đặt tay 1fr thì ra
 * 42px, bật transition vào là kẹt. Chỉ làm mờ dần bằng opacity, chiều cao đổi
 * ngay lập tức; với một thanh tìm kiếm thì như vậy là đủ và luôn đúng.
 */
.lb-hsearch {
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  background: var(--lb-white);
  border-bottom: 0 solid var(--lb-n1);
  opacity: 0;
  transition: opacity .18s ease;
}

.lb-hsearch[data-open="true"] {
  grid-template-rows: 1fr;
  border-bottom-width: 1px;
  opacity: 1;
}

.lb-hsearch__inner {
  min-height: 0;   /* bắt buộc, nếu không ô con không co lại được về 0 */
  display: flex;
  align-items: center;
  gap: 12px;

  /*
   * Padding phải theo trạng thái, không để cố định.
   *
   * Hàng lưới đóng lại còn 0 nhưng padding của chính ô con thì KHÔNG nằm trong
   * phần bị co — để 18px cố định thì lúc đóng bảng vẫn chiếm 37px, thành một
   * dải trắng vô hình đẩy cả trang xuống. Đo được 37px trước khi sửa.
   */
  padding-block: 0;
}

.lb-hsearch[data-open="true"] .lb-hsearch__inner { padding-block: 18px; }

.lb-hsearch__inner > svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--lb-n5);
}

.lb-hsearch input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: none;
  outline: none;
  font-family: inherit;
  font-size: var(--lb-sans-h6);
  color: var(--lb-nature);
}

.lb-hsearch input::placeholder { color: var(--lb-n2); }

.lb-hsearch__go {
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  padding: 9px 22px;
  background: var(--lb-group-deep);
  color: var(--lb-white);
  font: inherit;
  font-size: var(--lb-sans-sm);
  font-weight: var(--lb-w-medium);
  cursor: pointer;
}

.lb-hsearch__close {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 0;
  background: none;
  color: var(--lb-n5);
  cursor: pointer;
  padding: 0;
}

.lb-hsearch__close svg { width: 17px; height: 17px; }

/* ---- Bộ chuyển ngôn ngữ trên thanh trên ---- */
.lb-lang { position: relative; }

.lb-lang__btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 24px;
  padding: 2px 5px;
  border: 1px solid rgba(27, 27, 56, .1);
  border-radius: 24px;
  background: none;
  cursor: pointer;
  font: inherit;
  font-size: 13.33px;
  font-weight: 400;
  color: var(--lb-nature);
}

.lb-lang__btn svg { width: 16px; height: 16px; }

.lb-lang__list {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 60;
  min-width: 152px;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--lb-white);
  border: 1px solid var(--lb-n1);
  border-radius: 10px;
  box-shadow: 0 12px 28px -14px rgba(15, 15, 46, .35);
}

.lb-lang__list a {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: var(--lb-sans-xs);
  color: var(--lb-nature);
  text-decoration: none;
}

.lb-lang__list a:hover { background: var(--lb-bg-alt); }
.lb-lang__list a span { color: var(--lb-n5); }
.lb-lang__list a[aria-selected="true"] { font-weight: var(--lb-w-semibold); }

/* Ngôn ngữ chưa có bản dịch cho trang đang đọc — vẫn bấm được, chỉ mờ đi để
   người dùng biết trước là sẽ không tới đúng trang này. */
.lb-lang__list a[data-no-translation="true"] { opacity: .55; }

/* ============================================================
 * Menu điện thoại — Figma frame `menu mobile` (440 x 956)
 *
 * Nút mở luôn có trong HTML nhưng ẩn ở màn rộng, thay vì chèn bằng JS: JS có
 * thể lỗi hoặc bị chặn, mà mất nút này là mất toàn bộ đường điều hướng trên
 * điện thoại. Ẩn/hiện bằng CSS thì trường hợp xấu nhất vẫn còn một nút bấm được.
 * ============================================================ */
.lb-burger {
  display: none;            /* chỉ hiện dưới 900px, xem media query cuối file */
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: var(--lb-nature);
  color: var(--lb-white);
  cursor: pointer;
  padding: 0;
}

.lb-burger svg { width: 20px; height: 20px; }

/* Bảng menu phủ toàn màn hình. */
.lb-mmenu {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--lb-white);
  display: flex;
  flex-direction: column;
  padding: 24px;
  overflow-y: auto;
  overscroll-behavior: contain;

  /*
   * Dùng visibility chứ không display:none — display không chạy transition được,
   * mà visibility thì vừa ẩn khỏi trình đọc màn hình vừa vẫn mờ dần được.
   */
  visibility: hidden;
  opacity: 0;
  transition: opacity .18s ease, visibility .18s ease;
}

.lb-mmenu[data-open="true"] { visibility: visible; opacity: 1; }

.lb-mmenu__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 26px;
}

/* Figma node 154-403: 248 x 105. Cao 105 nên rộng 248 đúng bằng thiết kế. */
.lb-mmenu .lb-mmenu__logo img { width: auto; height: 105px; max-width: 100%; display: block; }

.lb-mmenu__close {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--lb-nature);
  color: var(--lb-white);
  cursor: pointer;
  padding: 0;
}

.lb-mmenu__close svg { width: 18px; height: 18px; }

/* Ô tìm kiếm trong bảng menu điện thoại — xem chú thích trong 01-header.php. */
.lb-mmenu__search {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
  padding: 11px 16px;
  border: 1px solid var(--lb-n1);
  border-radius: 999px;
  background: var(--lb-bg-alt);
}

.lb-mmenu__search svg { width: 18px; height: 18px; flex: 0 0 auto; color: var(--lb-n5); }

.lb-mmenu__search input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  background: none;
  outline: none;
  font-family: inherit;
  font-size: var(--lb-sans-base, 16px);
  color: var(--lb-nature);
}

.lb-mmenu__search input::placeholder { color: var(--lb-n2); }

.lb-mmenu__list { list-style: none; margin: 0; padding: 0; }

.lb-mmenu__item + .lb-mmenu__item { margin-top: 4px; }

.lb-mmenu__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.lb-mmenu__link {
  flex: 1 1 auto;
  display: block;
  padding: 12px 0;
  font-size: var(--lb-sans-h5);
  font-weight: var(--lb-w-medium);
  color: var(--lb-nature);
  text-decoration: none;
}

/* Nút mở mục con — Figma vẽ dấu + xám nhạt ở mép phải. */
.lb-mmenu__more {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 0;
  background: none;
  color: var(--lb-n5);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
}

.lb-mmenu__item[data-open="true"] > .lb-mmenu__row .lb-mmenu__more { transform: rotate(45deg); }

.lb-mmenu__sub {
  list-style: none;
  margin: 0 0 8px;
  padding: 0 0 0 16px;
  display: none;
}

.lb-mmenu__item[data-open="true"] > .lb-mmenu__sub { display: block; }

.lb-mmenu__sub a,
.lb-mmenu__sub .lb-mmenu__link--cho {
  display: block;
  padding: 9px 0;
  font-size: var(--lb-sans-sm);
  color: var(--lb-n8);
  text-decoration: none;
}

.lb-mmenu__lang {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  font-size: var(--lb-sans-sm);
  font-weight: var(--lb-w-medium);
}

.lb-mmenu__lang svg { width: 20px; height: 20px; color: var(--lb-n5); }
.lb-mmenu__lang a { color: var(--lb-n2); text-decoration: none; }
.lb-mmenu__lang a[aria-current="true"] { color: var(--lb-nature); }

/* Muc dang mo o bang menu dien thoai. */
.lb-mmenu__item--active > .lb-mmenu__row > .lb-mmenu__link,
.lb-mmenu__item--trail > .lb-mmenu__row > .lb-mmenu__link,
.lb-mmenu__sub a.is-active {
  color: var(--lb-group-deep);
  font-weight: var(--lb-w-medium);
}
.lb-mmenu__lang span { color: var(--lb-n2); }

/* Liên hệ nằm sát đáy bảng — margin-top:auto đẩy xuống, không cần position. */
.lb-mmenu__contact { margin-top: auto; padding-top: 32px; }

.lb-mmenu__c {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  font-size: var(--lb-sans-base, 16px);
  color: var(--lb-nature);
  text-decoration: none;
}

.lb-mmenu__c svg { width: 17px; height: 17px; flex: 0 0 auto; color: var(--lb-n5); }

/* Khoá cuộn trang nền khi bảng menu đang mở. */
body.lb-mmenu-open { overflow: hidden; }

/*
 * Nâng ngữ cảnh xếp chồng của CẢ header khi bảng menu mở.
 *
 * .lb-header có position:relative + z-index:20 nên nó tạo một ngữ cảnh xếp
 * chồng riêng. z-index:9999 của bảng menu vì thế chỉ có giá trị BÊN TRONG
 * header — so với cả trang thì toàn bộ header vẫn đứng ở mức 20, thấp hơn nút
 * nổi Messenger/Zalo (90) và nút cuộn-lên của Avada (100000). Kết quả: hai nút
 * đó đè lên bảng menu, che mất phần liên hệ ở đáy.
 *
 * Nâng chính header lên mới có tác dụng; sửa z-index của bảng menu thì vô ích.
 * Chỉ nâng khi đang mở, đóng lại trả về 20 để header không đè các lớp phủ khác.
 */
body.lb-mmenu-open .lb-header { z-index: 100001; }

/*
 * Chừa chỗ cho thanh quản trị WordPress.
 *
 * Bảng menu là position:fixed nên nó bỏ qua margin-top mà WordPress đặt lên
 * <html> để né thanh quản trị. Không chừa thì nút ✕ nằm lọt dưới thanh đó và
 * người đang đăng nhập không đóng được menu. Chỉ ảnh hưởng người đăng nhập,
 * khách vào không có thanh này.
 */
body.admin-bar .lb-mmenu { top: 32px; }

@media screen and (max-width: 782px) {
  /* Dưới 782px WordPress đổi thanh quản trị sang cao 46px. */
  body.admin-bar .lb-mmenu { top: 46px; }
}

/*
 * Bản nút đỏ dành riêng cho điện thoại — ẩn ở màn rộng, vì thanh nav ngang đã
 * có sẵn mục đó do walker dựng từ chính menu.
 *
 * PHẢI khai TRƯỚC khối @media bên dưới. Trước đây nó nằm sau, cùng độ ưu tiên
 * (0,1,0), nên thắng luôn quy tắc display:inline-flex của @media và nút đỏ
 * không bao giờ hiện trên điện thoại.
 */
.lb-header__cta-m { display: none; }

@media (max-width: 900px) {
  /*
   * Figma giữ lại một dòng mảnh phía trên, trong đó CHỈ có LiberoGo dồn phải.
   * Hotline, email, mạng xã hội và bộ ngôn ngữ chuyển hết vào bảng menu.
   */
  .lb-header__top-inner { justify-content: flex-end; min-height: 30px; }
  .lb-header__contact { display: none; }
  .lb-header__aux > *:not(.lb-header__go) { display: none; }
  .lb-header__aux { gap: 0; }
  .lb-nav { display: none; }
  .lb-header__search { display: none; }
  .lb-burger { display: inline-flex; }

  /* Nút đỏ "Khám phá" ở lại thanh thu gọn đúng như Figma. */
  .lb-header__cta-m { display: inline-flex; margin-left: auto; }
  .lb-header__bar-inner { min-height: 64px; gap: 12px; }

  /* Thanh header thu còn 64px nên logo phải nhỏ lại, nếu không chỉ còn 2px
     hở trên dưới và trông như bị kẹt sát mép. */
  .lb-header .lb-header__logo img { height: 48px; }

  /* --- Bảng menu --- */

  /* Figma không vẽ ô tìm kiếm trong bảng menu. */
  .lb-mmenu__search { display: none; }

  /* Logo trong bảng menu: Figma ~49, đang là 105. */
  .lb-mmenu .lb-mmenu__logo img { height: 49px; }

  /*
   * Mục menu: Figma để chữ thường cỡ 17, mỗi hàng cách nhau ~61.
   * Đang là 23px đậm 500, nhịp 68 — to và chen chúc hơn hẳn.
   */
  .lb-mmenu__link {
    font-size: 17px;
    line-height: 24px;
    font-weight: var(--lb-w-regular, 400);
    padding: 18px 0;
  }

  .lb-mmenu__item + .lb-mmenu__item { margin-top: 0; }
}

@media (min-width: 901px) {
  /* Trên máy tính bảng menu không bao giờ dùng tới — giữ nó ngoài luồng
     hoàn toàn để không ăn phím Tab. */
  .lb-mmenu { display: none; }
}

/*
 * Mục menu trỏ tới trang đơn vị khi trang đó chưa mở (libero_core_don_vi_mo()
 * = false): in <span>, kế thừa kiểu chữ của liên kết nhưng con trỏ mặc định và
 * mờ nhẹ để người dùng không tưởng nút hỏng.
 */
.lb-nav__link--cho,
.lb-mmenu__link--cho { cursor: default; opacity: .55; }

.lb-nav__link--cho:hover,
.lb-mmenu__link--cho:hover { color: inherit; }