/* ============================================================
   planetBLU — phần dùng chung cho MỌI trang
   Biến, khung 1240px, lưới 12 cột, ô vuông ■ và thanh điều hướng.
   Nhờ tách ra đây mà thanh ở trang chủ và các trang con là một, không phải
   dựng hai lần rồi lệch nhau.
   ============================================================ */

:root {
  --khung: 1240px;      /* bề rộng khối nội dung */
  --cot: 12;            /* số cột */
  --ranh: 24px;         /* khoảng hở giữa hai cột */
  --den: #000;
  --xam: #b3b3b3;
  --o: .74em;           /* cạnh ô vuông ■, tính theo cỡ chữ */

  /* Thanh điều hướng lấy LOGO làm gốc: cỡ chữ và chiều cao thanh đều tính từ
     nó, nên chỉ cần đổi --logo là cả thanh lớn nhỏ theo, không lệch tỉ lệ.
     Ô vuông khai bằng em nên tự lớn theo chữ. */
  --logo: 104px;
  --chu-menu: calc(var(--logo) * 0.17);
  --cao-thanh: calc(var(--logo) * 0.82);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  /* Safari iOS tự phóng to chữ ở khổ dọc, làm vỡ những cỡ đã tính bằng vw. */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: Inter, system-ui, sans-serif;
  font-variation-settings: "wght" 400;
  color: var(--den);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* Khối nội dung: luôn 1240px, tự co khi màn hẹp hơn */
.pb-khung {
  width: min(100% - 40px, var(--khung));
  margin-inline: auto;
}

/* Lưới 12 cột dùng chung cho mọi phần */
.pb-luoi {
  display: grid;
  grid-template-columns: repeat(var(--cot), 1fr);
  gap: var(--ranh);
}

/* Ô vuông ■ sau chữ — vẽ bằng CSS nên mọi chỗ cùng một cỡ và luôn thẳng cột.
   Dùng ::after để nó là một phần của dòng chữ, không phải khối rời phải căn tay. */
.pb-o::after {
  content: '';
  display: inline-block;
  width: var(--o);
  height: var(--o);
  margin-left: .34em;
  vertical-align: -0.02em;
  background: currentColor;
}

/* ---------- thanh điều hướng ---------- */
.pb-thanh {
  position: fixed;
  inset: 0 0 auto;
  z-index: 10002;
  background: #fff;
  height: var(--cao-thanh);
  display: flex;
  align-items: center;
}
.pb-thanh .pb-khung {
  display: flex;
  align-items: center;
  gap: 34px;
}
.pb-thanh .pb-logo {
  width: var(--logo);
  flex: none;
  /* Kéo lên cho ô vuông trong logo thẳng hàng với ô vuông của các mục menu.
     Ảnh logo có chữ "planet" nhỏ nằm trên nên tâm hình thấp hơn tâm dòng chữ —
     căn giữa theo hộp là logo tụt xuống 5,5px. Số 0,053 là tỉ lệ so với bề rộng
     logo nên đổi --logo vẫn khớp. */
  transform: translateY(calc(var(--logo) * -0.053));
}
.pb-thanh .pb-nav { display: flex; gap: 34px; }
.pb-thanh .pb-nav > li {
  position: relative;
  font-size: var(--chu-menu);
}
.pb-thanh .pb-nav > li:has(> .pb-con):hover::before {
  content: '';
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 0;
  width: var(--o);
  height: calc(50% + .5em);
  background: var(--xam);
  pointer-events: none;
}
.pb-thanh a {
  font-size: var(--chu-menu);
  font-variation-settings: "wght" 589;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  transition: color .18s ease;
}
.pb-thanh a:hover { color: var(--xam); }
.pb-thanh .pb-en { margin-left: auto; }
.pb-thanh .pb-language-nav {
  margin-left: auto;
  gap: 0;
}
.pb-thanh .pb-nav > li > .pb-o::after {
  width: var(--o);
  height: var(--o);
  min-width: var(--o);
  min-height: var(--o);
  flex: 0 0 var(--o);
  aspect-ratio: 1 / 1;
  background: #000;
}
.pb-thanh .pb-nav > li > .pb-o {
  position: relative;
  z-index: 3;
}
.pb-thanh .pb-nav > li:hover > .pb-o::after { background: var(--xam); }

/* Menu con: neo theo MÉP PHẢI của mục cha để cột ô vuông thẳng một dải,
   tên dài ngắn thế nào cũng vậy. */
.pb-thanh .pb-con {
  position: absolute;
  z-index: 2;
  isolation: isolate;
  font-size: var(--chu-menu);
  /* Ô của mục cha cao .74em và nằm giữa dòng 1em; kéo menu con lên .13em để
     ô đầu tiên chạm đúng mép dưới ô cha, tạo thành một dải đen liên tục. */
  top: calc(100% - .13em);
  right: 0;
  display: none;
  background: #fff;
  box-shadow: none;
  text-align: right;
  white-space: nowrap;
  padding: 0 0 0 6px;
}
.pb-thanh .pb-con::before {
  content: none;
}
.pb-thanh .pb-con::after {
  content: none;
}
.pb-thanh li:hover > .pb-con { display: block; }
.pb-thanh .pb-con a {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  line-height: 1;
}

/* Menu con dùng một dải ô đen liền mạch. Ô chung của giao diện cao .74em nên
   trong dòng cao 1em sẽ lộ khe trắng; riêng tại menu con kéo chiều cao ô bằng
   đúng chiều cao dòng để các ô chạm nhau. */
.pb-thanh .pb-con li { margin: 0; padding: 0; }
.pb-thanh .pb-con .pb-o::after {
  width: var(--o);
  min-width: var(--o);
  height: 1em;
  margin-left: .34em;
  flex: 0 0 var(--o);
  aspect-ratio: auto;
  background: #000;
}
.pb-thanh .pb-con li:hover > .pb-o,
.pb-thanh .pb-con li:focus-within > .pb-o {
  color: var(--xam);
}
.pb-thanh .pb-con li:hover > .pb-o::after,
.pb-thanh .pb-con li:focus-within > .pb-o::after {
  position: relative;
  z-index: 3;
  background-color: var(--xam) !important;
}

/* Breadcrumb/page marker duy nhất dùng cho tất cả trang cấp chính. */
.pb-breadcrumb {
  /* Các thông số breadcrumb có thể chỉnh tập trung tại đây. */
  --breadcrumb-top: calc(var(--cao-thanh) + 100px);
  --breadcrumb-indent: clamp(40px, 6.7vw, 96px);
  --breadcrumb-size: 60px;
  --breadcrumb-square: .74em;
  --breadcrumb-gap: .34em;
  --breadcrumb-bottom: 20px;

  position: absolute;
  z-index: 20;
  top: var(--breadcrumb-top);
  left: 0;
  width: 100%;
  pointer-events: none;
}
.pb-breadcrumb__inner {
  display: grid;
  grid-template-columns: repeat(var(--cot), minmax(0, 1fr));
  column-gap: var(--ranh);
}
.pb-breadcrumb__title {
  margin: 0;
  margin-bottom: var(--breadcrumb-bottom);
  grid-column: 1 / span 4;
  /* Khối thường chứ không phải flex: ô vuông vẽ bằng ::after là một ký tự
     trong dòng chữ nên khi tiêu đề xuống dòng nó đi theo TỪ CUỐI, nằm ở dòng
     dưới cùng. Để flex thì ô vuông là một ô riêng, luôn dính dòng đầu. */
  display: block;
  font-size: var(--breadcrumb-size);
  font-variation-settings: "wght" 589;
  font-weight: 400;
  line-height: 1.12;
  /* Một dòng là mặc định; js/thanh.js thu nhỏ cỡ chữ cho vừa cột, hết cỡ rồi
     mới cho xuống dòng. Để nowrap mà không thu nhỏ thì chữ tràn sang TRÁI (vì
     khối canh phải) rồi chạy hẳn ra ngoài màn hình — đo được có tên bắt đầu
     tận x-458, tức mất gần nửa dòng chữ. */
  white-space: nowrap;
  overflow-wrap: anywhere;
  justify-content: flex-end;
  text-align: right;
  max-width: 100%;
}
.pb-breadcrumb__title::after {
  content: '';
  display: inline-block;
  vertical-align: baseline;
  width: var(--breadcrumb-square);
  height: var(--breadcrumb-square);
  margin-left: var(--breadcrumb-gap);
  vertical-align: -.02em;
  background: currentColor;
}
.pb-breadcrumb__meta {
  grid-column: 5 / -1;
  align-self: end;
  margin-bottom: var(--breadcrumb-bottom);
  font-size: clamp(16px, 1.7vw, 24px);
  font-variation-settings: "wght" 400;
  line-height: 1.2;
  white-space: pre-line;
}

/* Chi tiết bài viết: meta ở 4 cột trái, ô vuông là mốc phân cột và tiêu đề ở
   8 cột phải. Breadcrumb tham gia luồng để tiêu đề dài tự đẩy nội dung xuống. */
body.single-post .pb-breadcrumb {
  /* Kích thước riêng cho tiêu đề bài viết, không ảnh hưởng breadcrumb khác. */
  --article-title-size: clamp(40px, 4vw, 50px);
  --article-square-size: .88em;
  position: relative;
  top: auto;
  margin-top: calc(var(--cao-thanh) + 100px);
}
body.single-post .pb-breadcrumb__title {
  grid-column: 5 / -1;
  grid-row: 1;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  font-size: var(--article-title-size);
  line-height: 1.08;
}
body.single-post .pb-breadcrumb__title::after { content: none; }
body.single-post .pb-breadcrumb__title::before {
  content: '';
  flex: 0 0 var(--article-square-size);
  width: var(--article-square-size);
  height: var(--article-square-size);
  margin-right: var(--ranh);
  background: currentColor;
}
body.single-post .pb-breadcrumb__title > span {
  display: block;
  position: relative;
  top: -.09em;
}
body.single-post .pb-breadcrumb__meta {
  grid-column: 1 / span 4;
  grid-row: 1;
  align-self: start;
  justify-self: end;
  padding-top: 0;
  text-align: right;
  font-size: 20px;
  line-height: 1;
  /* Căn quang học dòng chữ đầu tiên đúng mép trên ô vuông. */
  transform: translateY(-.9em);
}
/* Xếp cột bằng flex thay vì để hai thẻ block tự xuống dòng: cách kia sinh
   thêm một dòng trống bằng cả chiều cao dòng, hai dòng xa nhau 20px. */
body.single-post .pb-breadcrumb__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  row-gap: 8px;
}
body.single-post .pb-article-author,
body.single-post .pb-article-date {
  display: block;
}

/* Nút mở menu: chỉ dùng ở khổ điện thoại, khổ máy tính ẩn hẳn. */
.pb-thanh .pb-nut-menu {
  display: none;
  flex: none;
  width: 30px;
  height: 24px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  flex-direction: column;
  justify-content: space-between;
  /* Safari trên iOS tự tô nút theo kiểu hệ thống: nét vạch lấy currentColor
     mà màu chữ mặc định của <button> không phải màu thân trang, nên ba vạch
     hoá trắng, lẫn vào thanh. Tắt kiểu hệ thống và ép màu tường minh. */
  -webkit-appearance: none;
  appearance: none;
  color: var(--den);
  position: relative;
  /* Vẽ sẵn ba vạch bằng nền của chính nút, coi như lớp bảo hiểm: nếu vì lý do
     nào đó ba thẻ <span> bên trong không được tô, biểu tượng vẫn hiện. Khi mở
     thì tắt đi để nhường cho dấu ×. */
  background-image:
    linear-gradient(var(--den), var(--den)),
    linear-gradient(var(--den), var(--den)),
    linear-gradient(var(--den), var(--den));
  background-repeat: no-repeat;
  background-size: 100% 3px;
  background-position: 0 0, 0 50%, 0 100%;
}
.pb-thanh .pb-nut-menu[aria-expanded="true"] { background-image: none; }
/* Ba vạch neo bằng toạ độ tuyệt đối thay vì flex: WebKit vốn hay bỏ qua
   display:flex đặt trên chính thẻ <button>, đặt tuyệt đối thì chắc chắn đúng
   chỗ ở mọi trình duyệt. */
.pb-thanh .pb-nut-menu span {
  position: absolute;
  left: 0;
  right: 0;
  display: block;
  height: 3px;
  background: var(--den);
  transition: transform .25s ease, opacity .2s ease;
}
.pb-thanh .pb-nut-menu span:nth-child(1) { top: 0; }
.pb-thanh .pb-nut-menu span:nth-child(2) { top: 50%; margin-top: -1.5px; }
.pb-thanh .pb-nut-menu span:nth-child(3) { bottom: 0; }
/* Mở rồi thì ba vạch gập thành dấu ×, khỏi cần thêm nút đóng riêng. */
.pb-thanh .pb-nut-menu[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(10.5px) rotate(45deg);
}
.pb-thanh .pb-nut-menu[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.pb-thanh .pb-nut-menu[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-10.5px) rotate(-45deg);
}

/* Nút đóng: chỉ sống trong bảng menu phủ màn hình. */
.pb-thanh .pb-dong-menu {
  display: none;
  -webkit-appearance: none;
  appearance: none;
  color: var(--den);
  position: fixed;
  z-index: 10004;
  top: 14px;
  right: 18px;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.pb-thanh .pb-dong-menu::before,
.pb-thanh .pb-dong-menu::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 2px;
  right: 2px;
  height: 2px;
  background: var(--den);
}
.pb-thanh .pb-dong-menu::before { transform: rotate(45deg); }
.pb-thanh .pb-dong-menu::after  { transform: rotate(-45deg); }

/* ---------- khổ điện thoại ----------
   Thanh xếp ngược với khổ máy tính: nút menu bên trái, logo bên phải, ô chọn
   ngôn ngữ sát bên trái logo. Đảo bằng order, DOM giữ nguyên.

   Bấm nút thì cả trang phủ trắng, các mục dồn về bên phải, ô vuông xếp liền
   nhau thành một dải đen dọc — giống bản mẫu. */
@media (max-width: 640px) {
  .pb-thanh .pb-khung { gap: 14px; }

  .pb-thanh .pb-nut-menu { display: block; order: 1; }
  .pb-thanh .pb-language-nav { order: 2; margin-left: auto; }
  .pb-thanh .pb-logo { order: 3; margin-left: 0; }

  .pb-thanh .pb-nav:not(.pb-language-nav) {
    position: fixed;
    inset: 0;
    z-index: 10003;
    display: none;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
    padding: 0 20px;
    background: #fff;
    overflow-y: auto;
    text-align: right;
  }
  .pb-thanh.pb-mo .pb-nav:not(.pb-language-nav) { display: flex; }
  .pb-thanh.pb-mo .pb-dong-menu { display: block; }

  /* Ô vuông cao đúng bằng một dòng và các dòng không có khoảng hở, nên các ô
     chồng khít thành dải liền — cùng cách làm với danh sách dự án ở trang chủ. */
  .pb-thanh .pb-nav:not(.pb-language-nav) > li {
    padding: 0;
    font-size: clamp(22px, 7.4vw, 30px);
    line-height: 1.16;
    text-transform: uppercase;
  }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li > a {
    font-size: inherit;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li > .pb-o::after {
    width: .58em;
    height: 1.16em;
    margin-left: .26em;
  }
  /* Gạch nối dọc khi rê chuột chỉ hợp với menu đổ xuống ở khổ máy tính. */
  .pb-thanh .pb-nav:not(.pb-language-nav) > li:has(> .pb-con):hover::before {
    content: none;
  }

  /* Menu con ở khổ điện thoại: thường thì ẩn, bấm vào mục cha mới bung ra ngay
     bên dưới. Không dùng khung đổ xuống như khổ máy tính — màn hình hẹp, bảng
     menu đã phủ kín nên xếp lồng vào là đủ rõ. */
  .pb-thanh .pb-nav:not(.pb-language-nav) .pb-con { display: none !important; }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > .pb-con {
    display: block !important;
    position: static;
    margin: 6px 0 2px;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    min-width: 0;
  }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > .pb-con::before,
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > .pb-con::after { content: none; }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > .pb-con a {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 4px 0;
    /* Nhỏ hơn mục cha để nhìn là biết đang ở tầng dưới. */
    font-size: .78em;
    text-transform: none;
    white-space: nowrap;
  }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > .pb-con .pb-o::after {
    width: .58em;
    height: 1.16em;
    margin-left: .26em;
  }
  /* Dấu + báo mục này còn mục con; đang bung thì đổi thành dấu trừ. */
  .pb-thanh .pb-nav:not(.pb-language-nav) > li:has(> .pb-con) > a::before {
    content: '+';
    margin-right: .3em;
    font-size: .8em;
    line-height: 1;
  }
  .pb-thanh .pb-nav:not(.pb-language-nav) > li.pb-bung > a::before { content: '–'; }


  /* Mở menu thì khoá cuộn nền, không thì trang dưới trôi sau lớp phủ. */
  body.pb-khoa-cuon { overflow: hidden; }
}

@media (max-width: 640px) {
  .pb-breadcrumb {
    --breadcrumb-indent: 20px;
  }

  /* Khổ máy tính đặt breadcrumb ở dạng tuyệt đối và các trang chừa sẵn một
     khoảng cố định 67.2px — vừa đúng tiêu đề MỘT dòng. Ở khổ dọc tiêu đề dài
     phải xuống dòng nên khoảng chừa đó hụt, chữ đè lên nội dung. Trả nó về
     dòng chảy bình thường để nó tự đẩy phần dưới xuống, cao bao nhiêu cũng vừa. */
  .pb-breadcrumb {
    /* position:static làm thuộc tính top mất tác dụng, nhưng trình duyệt vẫn
       giữ nó ở dạng lề trên — thành ra thừa gần 190px khoảng trắng. Dẹp hẳn
       rồi chừa lại đúng chiều cao thanh + 30px. */
    position: static;
    top: auto;
    margin-top: 0;
    padding-top: calc(var(--cao-thanh) + 30px);
  }
  .pb-breadcrumb__title {
    grid-column: 1 / -1;
    justify-content: flex-start;
    /* Cỡ 60px của bản máy tính quá rộng cho khổ dọc: tiêu đề dài bị đẩy ra
       ngoài màn hình vì quy tắc gốc đặt white-space: nowrap. Cho xuống dòng
       và co cỡ chữ theo bề ngang màn. */
    font-size: clamp(24px, 7.6vw, 34px);
    /* Bỏ flex ở khổ hẹp: để flex thì ô vuông là một ô riêng, chữ dài đẩy nó
       rớt hẳn xuống dòng mới một mình. Về dạng khối thì ô vuông là ký tự nằm
       trong dòng chữ, luôn đi liền sau từ cuối cùng. */
    display: block;
    white-space: normal;
    overflow-wrap: anywhere;
    max-width: 100%;
  }
  .pb-breadcrumb__title > span { display: inline; }
  .pb-breadcrumb__title::after {
    /* Ô vuông theo cỡ chữ mới, canh giữa dòng thay vì theo đường cơ sở. */
    vertical-align: -.08em;
  }
  .pb-breadcrumb__meta {
    grid-column: 1 / -1;
    margin-top: 10px;
  }

  /* Khổ điện thoại đảo lại thứ tự của bản máy tính: tiêu đề bài lên trước,
     tác giả và ngày tháng xuống dưới — đọc tên bài ngay, khỏi lướt qua hai
     dòng phụ. Tiêu đề cũng nhỏ lại để không chiếm gần trọn màn hình. */
  body.single-post .pb-breadcrumb__title {
    grid-column: 1 / -1;
    grid-row: 1;
    order: 1;
    font-size: clamp(21px, 6.2vw, 27px);
    line-height: 1.12;
  }
  body.single-post .pb-breadcrumb__meta {
    /* Xếp cột bằng flex để tự định được khoảng hở: để hai thẻ block nằm trong
       khối chữ thì giữa chúng sinh thêm một dòng trống 20px, xa nhau quá. */
    display: flex;
    flex-direction: column;
    row-gap: 6px;
    /* Bản máy tính canh phải; khổ dọc phải canh TRÁI cho thẳng mép tiêu đề. */
    align-items: flex-start;
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
    order: 2;
    /* 25px là khoảng cách tới phần nội dung ngay bên dưới. */
    margin: 14px 0 25px;
    padding: 0;
    text-align: left;
    transform: none;
  }
  /* Breadcrumb của bài viết không cần chừa thêm đáy: khoảng cách đã nằm ở
     margin dưới của khối tác giả / ngày tháng. */
  /* Trang bài viết có quy tắc riêng đặt lề trên 185px, độ ưu tiên cao hơn
     quy tắc .pb-breadcrumb ở trên nên phải viết lại đúng bộ chọn đó. */
  body.single-post .pb-breadcrumb {
    margin-top: 0;
    padding-top: calc(var(--cao-thanh) + 30px);
    padding-bottom: 0;
  }
  body.single-post .pb-breadcrumb__title { margin-bottom: 0; }
  body.single-post .pb-breadcrumb__title > span { top: 0; }
}



/* Các trang còn lại dựng bằng bộ toạ độ: đẩy nội dung xuống dưới thanh, vì
   thanh HTML nằm cố định ở trên và cao hơn thanh cũ của bố cục. */
body:not(.home) #stage { margin-top: var(--cao-thanh); }

/* Chân trang luôn nằm ở đáy.

   Trang ít nội dung (Visit, Event khi chưa nhập gì) thì phần thân rất ngắn,
   chân trang bị kéo lên sát ngay dưới thanh điều hướng — thậm chí nằm TRÊN cả
   tên trang, vì tên trang đặt tuyệt đối. Cho thân trang giãn ra chiếm hết chỗ
   thừa thì chân trang tự rơi xuống đáy màn hình. */
body {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
body > .pb-chan { margin-top: auto; }

/* Vùng chạm tối thiểu 44px, giữ nguyên nét biểu tượng menu. */
@media (max-width: 900px) {
 .pb-thanh .pb-language-nav a { min-width: 44px; min-height: 44px; justify-content: center; }
}
@media (max-width: 640px) {
 .pb-thanh .pb-nut-menu { width: 44px; height: 44px; background-size: 30px 3px; background-position: 0 10px, 0 21px, 0 32px; }
 .pb-thanh .pb-nut-menu span { left: 0; right: auto; width: 30px; }
 .pb-thanh .pb-nut-menu span:nth-child(1) { top: 10px; }
 .pb-thanh .pb-nut-menu span:nth-child(2) { top: 21px; }
 .pb-thanh .pb-nut-menu span:nth-child(3) { top: 32px; }
 .pb-thanh .pb-nav:not(.pb-language-nav) > li > a,
 .pb-thanh .pb-nav:not(.pb-language-nav) .pb-con a { min-height: 44px; align-items: center; }
 .pb-thanh .pb-dong-menu { min-width: 44px; min-height: 44px; }
}