/* ==========================================================================
   binhminhsanmay.vn — website chính Bình Minh Săn Mây Bảo Lộc
   --------------------------------------------------------------------------
   CỐ Ý KHÁC HẲN 9 WEBSITE VỆ TINH. Vệ tinh dùng chữ Be Vietnam Pro + màu xanh
   dương #0b5fa5 + ô tìm kiếm 5 tab kiểu đại lý tour. Web chính dùng chữ
   Montserrat (phông của thegioigiay.net, anh Đạt chọn 01/11/2026) + bảng màu xanh rừng/vàng nắng.
   Lý do: giao diện giống nhau giữa các tên miền cùng chủ là dấu vết mạng site
   (xem wiki/thuc-the/he-thong-10-website-bao-loc.md, mục 5).

   BÀI HỌC CSS BẮT BUỘC ÁP DỤNG (rút từ sự cố 26/10): cột lưới `1fr` mặc định
   có min-width:auto, nên một bảng rộng bên trong sẽ phá vỡ cả trang và gây
   tràn ngang trên điện thoại. Mọi cột lưới dưới đây đều dùng minmax(0,1fr)
   và mọi khối chứa bảng đều có min-width:0.
   ========================================================================== */

:root{
  --rung:#1f4034;        /* xanh rừng — màu chủ đạo */
  --rung-dam:#152b23;
  --rung-nhat:#2f5d4b;
  --vang:#c8922a;        /* vàng nắng — màu nhấn */
  --vang-nhat:#e8bd62;
  --kem:#faf7f1;         /* nền kem */
  --kem-dam:#f0e9dc;
  --muc:#241f1a;         /* màu chữ */
  --muc-nhat:#5e564c;
  --vien:#e2d9c8;
  --trang:#fff;
  --do:#a8341f;

  --chu-hien:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --chu-de:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;   /* phông của thegioigiay.net, anh chọn 01/11/2026 */

  --bo:14px;
  --bo-nho:8px;
  --do-sau:0 1px 2px rgba(36,31,26,.05),0 8px 24px rgba(36,31,26,.07);
  --do-sau-cao:0 2px 4px rgba(36,31,26,.06),0 18px 48px rgba(36,31,26,.12);
  --rong:1180px;
  --le:20px;
}

*,*::before,*::after{box-sizing:border-box}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  /* Để nhảy tới neo (#id) không bị header dính che mất tiêu đề */
  scroll-padding-top:92px;
}

body{
  margin:0;
  font-family:var(--chu-hien);
  font-size:17px;
  line-height:1.68;
  color:var(--muc);
  background:var(--kem);
  /* Chốt chặn cuối: dù một khối con có rộng quá thì trang vẫn không trôi ngang */
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block}
a{color:var(--rung-nhat);text-decoration:none}
a:hover{text-decoration:underline}

h1,h2,h3,h4{
  font-family:var(--chu-de);
  font-weight:700;
  line-height:1.22;
  letter-spacing:-.01em;
  color:var(--rung-dam);
  margin:0 0 .5em;
  text-wrap:balance;
}
h1{font-size:clamp(1.95rem,1.25rem + 2.6vw,3.3rem)}
h2{font-size:clamp(1.5rem,1.15rem + 1.35vw,2.2rem);margin-top:2.2em}
h3{font-size:clamp(1.14rem,1.03rem + .45vw,1.38rem);margin-top:1.7em}
h4{font-size:1.04rem;font-family:var(--chu-hien);font-weight:700;margin-top:1.4em}
p{margin:0 0 1.05em}
strong{font-weight:700;color:var(--rung-dam)}

:focus-visible{outline:3px solid var(--vang);outline-offset:3px;border-radius:4px}

/* --- bộ khung chung ------------------------------------------------------ */
.wrap{width:100%;max-width:var(--rong);margin:0 auto;padding:0 var(--le);min-width:0}
.hep{max-width:760px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* --- header -------------------------------------------------------------- */
.dau{
  position:sticky;top:0;z-index:60;
  background:rgba(250,247,241,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--vien);
}
.dau-in{
  display:flex;align-items:center;gap:18px;
  min-height:70px;
}
.hieu{display:flex;align-items:center;gap:9px;flex-shrink:0;text-decoration:none}
.hieu:hover{text-decoration:none}
.hieu-dau{width:auto;height:36px;flex-shrink:0;display:block}   /* logo BM Luxury thật, ngang 274×96 */
.hieu-chu{display:flex;flex-direction:column;line-height:1.08}
.hieu-chu b{
  font-family:var(--chu-de);font-size:1.02rem;font-weight:800;
  color:var(--rung-dam);letter-spacing:.02em;white-space:nowrap;
}
.hieu-chu span{
  font-size:.665rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--vang);font-weight:600;white-space:nowrap;
}

.menu{display:flex;gap:2px;margin-left:auto;align-items:center}
.menu a{
  font-size:.885rem;font-weight:500;color:var(--muc-nhat);
  padding:9px 11px;border-radius:var(--bo-nho);white-space:nowrap;
}
.menu a:hover{color:var(--rung-dam);background:var(--kem-dam);text-decoration:none}
.menu a[aria-current=page]{color:var(--rung-dam);font-weight:700;background:var(--kem-dam)}
/* Menu xổ xuống (01/11/2026, theo mẫu anh gửi): rê chuột hoặc bấm Tab vào mục gốc là hiện mục con */
.menu-muc{position:relative}
.menu-mui{display:inline-block;width:6px;height:6px;margin:0 0 3px 6px;border:solid currentColor;
  border-width:0 1.6px 1.6px 0;transform:rotate(45deg);opacity:.6}
.menu-xo{
  position:absolute;top:100%;left:0;z-index:60;min-width:230px;padding:8px;margin-top:6px;
  background:var(--trang);border:1px solid var(--vien);border-radius:var(--bo);box-shadow:var(--do-sau-cao);
  display:flex;flex-direction:column;gap:1px;
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .15s,transform .15s,visibility .15s;
}
.menu-xo::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}   /* cầu nối để chuột không rớt */
.menu-muc:hover .menu-xo,.menu-muc:focus-within .menu-xo{opacity:1;visibility:visible;transform:none}
.menu-xo a{font-weight:500;color:var(--muc);padding:9px 12px}
.menu-muc:last-child .menu-xo,.menu-muc:nth-last-child(2) .menu-xo{left:auto;right:0}   /* mục sát mép phải xổ về bên trái */

.dau-nut{display:flex;align-items:center;gap:9px;flex-shrink:0}
.dau-sdt{font-size:.9rem;font-weight:700;color:var(--rung-dam);white-space:nowrap}
.dau-sdt:hover{text-decoration:none;color:var(--vang)}

.mo-menu{
  display:none;background:none;border:1px solid var(--vien);
  border-radius:var(--bo-nho);padding:8px 10px;cursor:pointer;
  margin-left:auto;color:var(--rung-dam);
}

/* Ngăn menu di động phải ẩn Ở MỌI CHIỀU RỘNG theo mặc định.
   Lỗi đã gặp 26/10: chỉ đặt display:none bên trong @media (max-width:1040px)
   nên trên màn hình rộng nó không có luật nào, hiện thành một dải chữ nằm
   ngay dưới header. Bắt được khi xem bằng mắt — phép kiểm tràn ngang không
   thấy, vì lỗi này không làm trang rộng ra. */
.menu-giay{display:none}
.mo-menu svg{width:22px;height:22px;display:block;stroke:currentColor;fill:none;stroke-width:1.9}

/* --- nút ----------------------------------------------------------------- */
.nut{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--chu-hien);font-size:.95rem;font-weight:700;
  padding:13px 24px;border-radius:999px;border:1.5px solid transparent;
  cursor:pointer;text-align:center;line-height:1.3;transition:.18s;
}
.nut:hover{text-decoration:none;transform:translateY(-1px)}
.nut svg{width:18px;height:18px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.8}
.nut-chinh{background:var(--rung);color:#fff}
.nut-chinh:hover{background:var(--rung-dam);color:#fff}
.nut-vang{background:var(--vang);color:#2b1d05}
.nut-vang:hover{background:var(--vang-nhat);color:#2b1d05}
.nut-vien{background:transparent;color:var(--rung-dam);border-color:var(--rung)}
.nut-vien:hover{background:var(--rung);color:#fff}
.nut-trang{background:#fff;color:var(--rung-dam);border-color:#fff}
.nut-trang:hover{background:var(--kem-dam);color:var(--rung-dam)}
.nut-nho{padding:9px 17px;font-size:.87rem}

/* --- hero ---------------------------------------------------------------- */
.hero{position:relative;background:var(--rung-dam);overflow:hidden}
.hero-anh{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 58%;
}
/* Lớp phủ thay cho opacity cũ: tối ở bên chữ, nhạt dần sang phải để trời bình
   minh giữ màu thật. Điện thoại: chữ phủ gần hết khung nên phủ từ trên xuống. */
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(21,43,35,.88) 0%,rgba(21,43,35,.72) 45%,rgba(21,43,35,.3) 70%,rgba(21,43,35,.08) 100%);
}
.hero-in{
  position:relative;z-index:2;
  padding:clamp(60px,9vw,118px) 0 clamp(48px,7vw,86px);
  max-width:760px;
}
.hero-nhan{
  display:inline-block;font-size:.72rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--vang-nhat);
  border:1px solid rgba(232,189,98,.42);border-radius:999px;
  padding:6px 15px;margin-bottom:20px;
}
.hero h1{color:#fff;margin-bottom:.46em;text-shadow:0 2px 24px rgba(0,0,0,.3)}
.hero-dan{
  font-size:clamp(1.03rem,.97rem + .35vw,1.21rem);
  color:rgba(255,255,255,.9);margin-bottom:1.6em;max-width:60ch;
  text-shadow:0 1px 12px rgba(0,0,0,.35);
}
.hero-nut{display:flex;flex-wrap:wrap;gap:12px}

/* dải 4 số liệu dưới hero — KHÔNG đè lên nội dung (lỗi đã gặp 26/10) */
.dai-so{
  position:relative;z-index:2;background:var(--rung);
  border-top:1px solid rgba(255,255,255,.1);
}
.dai-so-in{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:2px 18px;padding:24px 0;
}
.dai-so div{min-width:0;text-align:center}
.dai-so b{
  display:block;font-family:var(--chu-de);font-size:clamp(1.3rem,1.1rem + .7vw,1.75rem);
  font-weight:600;color:var(--vang-nhat);line-height:1.1;
}
.dai-so span{
  display:block;font-size:.775rem;color:rgba(255,255,255,.72);
  margin-top:5px;line-height:1.35;
}

/* --- đầu trang trong (mọi trang trừ trang chủ) --------------------------- */
.dau-trang{
  position:relative;overflow:hidden;
  background:var(--rung-dam);color:#fff;
  padding:clamp(30px,4.5vw,58px) 0 clamp(28px,4vw,50px);
}
.dau-trang-anh{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:.3;
}
.dau-trang .wrap{position:relative;z-index:2}
.dau-trang h1{color:#fff;margin:0 0 .4em;text-shadow:0 2px 20px rgba(0,0,0,.28)}
.dau-trang strong,.hero strong{color:#fff}   /* chữ đậm trên nền ảnh tối (lỗi 30/10: xanh đậm trên nền tối) */
.dau-trang-dan{
  font-size:clamp(1rem,.96rem + .26vw,1.14rem);
  color:rgba(255,255,255,.86);max-width:62ch;margin:0;
}
.dau-trang .duong-dan{padding:0 0 13px;color:rgba(255,255,255,.58)}
.dau-trang .duong-dan a{color:rgba(255,255,255,.74)}
.dau-trang .duong-dan li:not(:last-child)::after{color:rgba(255,255,255,.28)}

/* --- khối nội dung ------------------------------------------------------- */
.khoi{padding:clamp(44px,6vw,76px) 0}
.khoi-kem{background:var(--kem-dam)}
.khoi-trang{background:var(--trang)}
.khoi-rung{background:var(--rung-dam);color:rgba(255,255,255,.88)}
.khoi-rung h2,.khoi-rung h3,.khoi-rung strong{color:#fff}
.khoi-rung a:not(.nut){color:var(--vang-nhat)}   /* nút giữ màu riêng: lỗi 30/10 chữ vàng trên nút vàng */
/* Ô nền sáng (.hop, bảng) đặt trong khối tối: trả chữ, chữ đậm, link về màu thường.
   Lỗi đã gặp 30/10: thiếu ba dòng này thì chữ trắng nằm trên ô trắng — ô trông trống trơn. */
.khoi-rung .hop,.khoi-rung .bang-boc{color:var(--muc)}
.khoi-rung .hop strong,.khoi-rung .hop h3,.khoi-rung .bang-boc strong{color:var(--rung-dam)}
.khoi-rung .hop a:not(.nut),.khoi-rung .bang-boc a:not(.nut){color:var(--rung-nhat)}

.tieu-khoi{max-width:680px;margin-bottom:34px}
.tieu-khoi h2{margin-top:0}
h2.tieu-khoi{margin-top:0}   /* tiêu đề khối đứng riêng (trang ngủ lại săn mây) */
.tieu-khoi p{color:var(--muc-nhat);margin-bottom:0}
.khoi-rung .tieu-khoi p{color:rgba(255,255,255,.72)}
.giua{text-align:center;margin-left:auto;margin-right:auto}

/* --- lưới --------------------------------------------------------------- */
/* minmax(0,1fr) ở mọi nơi: xem ghi chú đầu file */
.luoi{display:grid;gap:22px}
.luoi-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.luoi-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.luoi-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.luoi>*{min-width:0}

/* --- thẻ ---------------------------------------------------------------- */
.the{
  background:var(--trang);border:1px solid var(--vien);border-radius:var(--bo);
  overflow:hidden;display:flex;flex-direction:column;min-width:0;
  transition:.2s;
}
.the:hover{box-shadow:var(--do-sau-cao);transform:translateY(-2px)}
.the-anh{position:relative;aspect-ratio:4/3;background:var(--kem-dam);overflow:hidden}
.the-anh img{width:100%;height:100%;object-fit:cover}
.the-nhan{
  position:absolute;top:11px;left:11px;z-index:2;
  background:rgba(31,64,52,.93);color:#fff;
  font-size:.705rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;
}
.the-than{padding:19px 20px 21px;display:flex;flex-direction:column;flex:1;min-width:0}
.the-than h3{margin:0 0 .45em;font-size:1.16rem}
.the-than p{color:var(--muc-nhat);font-size:.935rem;margin-bottom:1em}
.the-than .nut{margin-top:auto;align-self:flex-start}
.the-gach{
  list-style:none;padding:0;margin:0 0 1.1em;
  font-size:.9rem;color:var(--muc-nhat);
}
.the-gach li{padding:5px 0 5px 21px;position:relative}
.the-gach li::before{
  content:"";position:absolute;left:3px;top:13px;
  width:7px;height:7px;border-radius:50%;background:var(--vang);
}

/* --- hai cột chữ + ảnh --------------------------------------------------- */
.doi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,56px);align-items:center}
.doi>*{min-width:0}
.doi-anh img{border-radius:var(--bo);box-shadow:var(--do-sau)}
/* Ảnh dọc ở cột ảnh không cao quá 640px trên màn hình rộng: cắt theo tiêu điểm
   (object-position) để không thành một khoảng trời trống dài hơn cả cột chữ. */
.doi-anh img{width:100%;max-height:640px;object-fit:cover}
.doi h2{margin-top:0}

/* --- hộp ghi chú -------------------------------------------------------- */
.hop{
  border-radius:var(--bo);padding:20px 22px;margin:1.6em 0;
  border:1px solid var(--vien);background:var(--trang);min-width:0;
}
.hop>:first-child{margin-top:0}
.hop>:last-child{margin-bottom:0}
.hop h3,.hop h4{margin-top:0}
.hop-vang{background:#fdf7e8;border-color:#ecd9a4}
.hop-rung{background:#eef4f0;border-color:#c8ddd0}
.hop-canh{background:#fdf0ec;border-color:#f0c4b6}
.hop-canh h3,.hop-canh h4{color:var(--do)}

/* --- bảng --------------------------------------------------------------- */
/* Bọc ngoài cho cuộn ngang trong chính nó, không đẩy cả trang */
.bang-boc{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  margin:1.4em 0;border:1px solid var(--vien);border-radius:var(--bo);
  background:var(--trang);max-width:100%;
}
table{border-collapse:collapse;width:100%;font-size:.925rem;min-width:520px}
th,td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--vien);vertical-align:top}
th{background:var(--kem-dam);font-weight:700;color:var(--rung-dam);font-size:.875rem;white-space:nowrap}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:#fcfaf6}
td b{color:var(--rung-dam)}

/* --- câu hỏi hay gặp ---------------------------------------------------- */
.hoi{
  border:1px solid var(--vien);border-radius:var(--bo);
  background:var(--trang);margin-bottom:11px;overflow:hidden;
}
.hoi summary{
  padding:16px 19px;cursor:pointer;font-weight:700;color:var(--rung-dam);
  font-size:1.005rem;list-style:none;display:flex;gap:12px;align-items:flex-start;
}
.hoi summary::-webkit-details-marker{display:none}
.hoi summary::after{
  content:"+";margin-left:auto;font-size:1.4rem;line-height:1;
  color:var(--vang);font-weight:400;flex-shrink:0;
}
.hoi[open] summary::after{content:"\2013"}
.hoi summary:hover{background:var(--kem)}
.hoi-dap{padding:0 19px 18px;color:var(--muc-nhat);font-size:.955rem}
.hoi-dap>:first-child{margin-top:0}
.hoi-dap>:last-child{margin-bottom:0}

/* --- dải kêu gọi -------------------------------------------------------- */
.goi{
  background:var(--rung-dam);color:#fff;border-radius:var(--bo);
  padding:clamp(30px,4.5vw,52px) clamp(22px,4vw,48px);
  text-align:center;margin:0;
}
.goi h2,.goi h3{color:#fff;margin-top:0}
.goi p{color:rgba(255,255,255,.82);max-width:58ch;margin-left:auto;margin-right:auto}
.goi strong{color:#fff}
.goi-nut{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px}

/* --- phiếu hỏi giá ------------------------------------------------------ */
.phieu{
  background:var(--trang);border:1px solid var(--vien);border-radius:var(--bo);
  padding:clamp(22px,3vw,32px);box-shadow:var(--do-sau);min-width:0;
}
.phieu h3{margin-top:0}
.phieu-luoi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.phieu-luoi>*{min-width:0}
.phieu-o{display:flex;flex-direction:column;gap:6px}
.phieu-o.rong{grid-column:1/-1}
.phieu-o label{font-size:.855rem;font-weight:700;color:var(--rung-dam)}
.phieu-o input,.phieu-o select,.phieu-o textarea{
  font-family:inherit;font-size:.96rem;color:var(--muc);
  padding:11px 13px;border:1px solid var(--vien);border-radius:var(--bo-nho);
  background:var(--kem);width:100%;min-width:0;
}
.phieu-o input:focus,.phieu-o select:focus,.phieu-o textarea:focus{
  outline:none;border-color:var(--rung-nhat);background:#fff;
  box-shadow:0 0 0 3px rgba(47,93,75,.12);
}
.phieu-o textarea{resize:vertical;min-height:78px}
.phieu-ghi{font-size:.83rem;color:var(--muc-nhat);margin:14px 0 0}

/* --- thư viện ảnh ------------------------------------------------------- */
/* Ô 1 vuông 2×2, ô 6 nằm ngang 2×1: 8 ảnh lấp kín lưới 4 cột (12 ô), 3 cột (12 ô, nhờ dense) và 2 cột.
   Lỗi 30/10: ô 6 từng là 2×2 nên lưới 4 cột chừa 2 ô trống cạnh ảnh ban đêm. */
.vien-anh{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;grid-auto-flow:dense}
.vien-anh>*{min-width:0}
.vien-anh img{border-radius:var(--bo-nho);aspect-ratio:1/1;object-fit:cover;width:100%}
.vien-anh a{position:relative;display:block}
.vien-anh a:nth-child(1){grid-column:span 2;grid-row:span 2}
.vien-anh a:nth-child(1) img{aspect-ratio:1/1}
.vien-anh a:nth-child(6){grid-column:span 2}
/* ảnh ô ngang không góp chiều cao hàng: hàng cao bằng ô vuông bên cạnh */
.vien-anh a:nth-child(6) img{position:absolute;inset:0;height:100%;aspect-ratio:auto}

/* --- đường dẫn ---------------------------------------------------------- */
.duong-dan{font-size:.835rem;color:var(--muc-nhat);padding:16px 0 0}
.duong-dan ol{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0}
.duong-dan li:not(:last-child)::after{content:"/";margin-left:7px;color:var(--vien)}

/* --- chân trang --------------------------------------------------------- */
.chan{background:var(--rung-dam);color:rgba(255,255,255,.7);padding:52px 0 0;font-size:.92rem}
.chan a{color:rgba(255,255,255,.7)}
.chan a:hover{color:var(--vang-nhat)}
.chan-luoi{
  display:grid;grid-template-columns:1.6fr repeat(3,minmax(0,1fr));
  gap:34px 28px;padding-bottom:40px;
}
.chan-luoi>*{min-width:0}
.chan h4{color:#fff;font-family:var(--chu-hien);font-size:.78rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;margin:0 0 15px}
.chan ul{list-style:none;padding:0;margin:0}
.chan li{margin-bottom:9px}
.chan-hieu b{
  display:block;font-family:var(--chu-de);font-size:1.3rem;font-weight:600;
  color:#fff;margin-bottom:9px;
}
.chan-lh li{display:flex;gap:9px;align-items:flex-start}
.chan-lh svg{width:16px;height:16px;flex-shrink:0;margin-top:4px;
  stroke:var(--vang);fill:none;stroke-width:1.8}
.chan-day{
  border-top:1px solid rgba(255,255,255,.1);padding:19px 0;
  display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:space-between;
  font-size:.835rem;color:rgba(255,255,255,.52);
}
.chan-khai{
  background:rgba(0,0,0,.22);border-radius:var(--bo-nho);
  padding:13px 16px;margin-bottom:26px;font-size:.855rem;
  color:rgba(255,255,255,.62);
}

/* --- thanh liên hệ dính ở điện thoại ------------------------------------ */
.thanh-di-dong{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:70;
  background:rgba(250,247,241,.97);backdrop-filter:blur(10px);
  border-top:1px solid var(--vien);
  padding:9px 10px;padding-bottom:calc(9px + env(safe-area-inset-bottom));
  gap:8px;
}
.thanh-di-dong a{
  flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;
  font-size:.705rem;font-weight:700;color:var(--rung-dam);
  padding:7px 3px;border-radius:var(--bo-nho);text-align:center;
}
.thanh-di-dong a:hover{text-decoration:none}
.thanh-di-dong a.noi-bat{background:var(--rung);color:#fff}
.thanh-di-dong svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}

/* --- bài viết: khuôn phương án A (dung-trang.py dựng) -------------------- */
/* Thứ tự trong mã: tóm tắt → mục lục → thân bài. Màn hình rộng thì mục lục
   đứng thành cột phải, dính theo khi cuộn; màn hình hẹp thì nằm trên thân bài. */
.bai-nhan{
  display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--vang-nhat);margin:0 0 14px;
}
.bai-khung{
  display:grid;grid-template-columns:minmax(0,1fr);
  padding-top:clamp(30px,4.5vw,56px);padding-bottom:clamp(36px,5vw,64px);
}
.bai-khung>*{min-width:0}
.bai-tom{margin:0 0 26px}
.bai-muc{
  background:var(--trang);border:1px solid var(--vien);border-radius:var(--bo);
  padding:18px 20px 16px;margin:0 0 34px;
}
.bai-muc-tieu{
  font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--vang);margin:0 0 8px;
}
.bai-muc ol{margin:0;padding-left:1.25em;font-size:.93rem;line-height:1.45}
.bai-muc li{padding:5px 0}
.bai-muc a{color:var(--rung-dam)}
.bai-than>h2:first-child{margin-top:0}
.bai-than>p,.bai-than>ul,.bai-than>ol{max-width:72ch}
.anh-bai{margin:1.9em 0}
.anh-bai img{border-radius:var(--bo);box-shadow:var(--do-sau);width:100%}
.anh-bai figcaption{font-size:.86rem;color:var(--muc-nhat);margin-top:10px;line-height:1.5}
.ds-kiem{list-style:none;padding:0;margin:1.2em 0 1.5em;max-width:72ch}
.ds-kiem li{position:relative;padding:9px 0 9px 38px;border-bottom:1px dashed var(--vien)}
.ds-kiem li:last-child{border-bottom:none}
.ds-kiem li::before{
  content:"";position:absolute;left:0;top:11px;width:23px;height:23px;
  border-radius:7px;background:var(--rung);
}
.ds-kiem li::after{
  content:"";position:absolute;left:8.5px;top:15px;width:6px;height:11px;
  border:solid #fff;border-width:0 2.4px 2.4px 0;transform:rotate(45deg);
}
.bai-hoi-dap{margin-top:2.6em}
.bai-hoi-dap h2{margin:0 0 .7em}
.bai-nguon{
  font-size:.86rem;color:var(--muc-nhat);border-top:1px solid var(--vien);
  padding-top:15px;margin:2.4em 0 0;max-width:none;
}
.bai-nguon b{color:var(--rung-dam)}
.bai-than>p.bai-nguon{max-width:none}
.the-ngay{font-size:.8rem;color:var(--muc-nhat);margin:0 0 6px}
/* các bước đánh số (đường lên núi ở trang Liên hệ) */
.cac-buoc{padding-left:1.4em;margin:0 0 1.2em}
.cac-buoc li{padding:6px 0 6px 4px}
.cac-buoc li::marker{color:var(--vang);font-weight:700}
.the-than h3 a{color:var(--rung-dam)}

@media (min-width:1041px){
  .bai-khung{
    grid-template-columns:minmax(0,1fr) 272px;column-gap:56px;
    grid-template-areas:"tom muc" "than muc";
  }
  .bai-tom{grid-area:tom;margin-bottom:36px}
  .bai-muc{grid-area:muc;align-self:start;position:sticky;top:94px;margin:0}
  .bai-than{grid-area:than}
}

/* --- khối gợi ý lớp 1 cuối bài: 4 loại, mỗi loại một lớp riêng ----------- */
/* Tên lớp là của riêng web chính (goi-y-*), không dùng tên khối mẫu của kế
   hoạch 12 tháng. Mỗi loại dẫn về đúng một trang bán hàng. */
.goi-y-bm{
  display:grid;grid-template-columns:58px minmax(0,1fr);gap:20px;
  border-radius:var(--bo);padding:26px 26px 24px;margin:2.6em 0 0;
  border:1px solid var(--vien);border-left-width:6px;background:var(--trang);
}
.goi-y-bm>*{min-width:0}
.goi-y-dau{
  width:58px;height:58px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.goi-y-dau svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.8}
.goi-y-nhan{
  font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  margin:0 0 6px;
}
.goi-y-than h2{margin:0 0 .45em;font-size:clamp(1.3rem,1.12rem + .7vw,1.65rem)}
.goi-y-than p{margin-bottom:1em}
.goi-y-nut{display:flex;flex-wrap:wrap;gap:10px;margin:0!important}
.goi-y-chon-can{background:#eef4f0;border-color:#c8ddd0;border-left-color:var(--rung)}
.goi-y-chon-can .goi-y-dau{background:var(--rung);color:#fff}
.goi-y-chon-can .goi-y-nhan{color:var(--rung-nhat)}
.goi-y-sang-mai{background:#fdf7e8;border-color:#ecd9a4;border-left-color:var(--vang)}
.goi-y-sang-mai .goi-y-dau{background:var(--vang);color:#2b1d05}
.goi-y-sang-mai .goi-y-nhan{color:#7f5c12}
.goi-y-bua-an{background:#fdf0ec;border-color:#f0c4b6;border-left-color:var(--do)}
.goi-y-bua-an .goi-y-dau{background:var(--do);color:#fff}
.goi-y-bua-an .goi-y-nhan{color:var(--do)}
.goi-y-doan-cong-ty{background:var(--kem-dam);border-color:var(--vien);border-left-color:var(--rung-dam)}
.goi-y-doan-cong-ty .goi-y-dau{background:var(--rung-dam);color:var(--vang-nhat)}
.goi-y-doan-cong-ty .goi-y-nhan{color:var(--muc-nhat)}

@media (max-width:560px){
  .goi-y-bm{grid-template-columns:minmax(0,1fr);gap:14px;padding:22px 18px 20px}
  .goi-y-nut .nut{flex:1 1 100%}
}

/* ==========================================================================
   MÀN HÌNH NHỎ
   Kiểm thật ở 360 · 390 · 768 · 1024 · 1280 · 1440px bằng _cong-cu/quet-tran.py
   ========================================================================== */

/* 01/11/2026: 1040 → 1220px — menu 7 mục có mũi tên xổ xuống không vừa header ở 1041–1220px (đo cả thanh cuộn) */
/* 01/11/2026 (2): 1220 → 1000px — anh muốn thanh menu đủ 7 mục + ô tìm kiếm như thegioigiay.net ở laptop */
@media (max-width:1000px){
  .menu{display:none}
  .mo-menu{display:block}
  .dau-nut{display:none}
  .chan-luoi{grid-template-columns:repeat(2,minmax(0,1fr))}

  /* Menu mở ra khi bấm nút — chạy bằng :target, không cần JavaScript */
  .menu-giay{
    display:none;position:fixed;inset:0;z-index:90;
    background:rgba(21,43,35,.5);
  }
  .menu-giay:target{display:block}
  .menu-giay-in{
    position:absolute;top:0;right:0;bottom:0;width:min(320px,86vw);
    background:var(--kem);padding:22px 20px;overflow-y:auto;
    display:flex;flex-direction:column;gap:3px;
  }
  .menu-giay-in a{
    padding:13px 14px;border-radius:var(--bo-nho);font-weight:600;
    color:var(--rung-dam);font-size:1rem;
  }
  .menu-giay-in a:hover{background:var(--kem-dam);text-decoration:none}
  .menu-giay-in a.menu-giay-con{font-weight:500;font-size:.94rem;color:var(--muc-nhat);padding:9px 14px 9px 30px}
  .menu-dong{
    align-self:flex-end;font-size:1.6rem;line-height:1;padding:4px 12px;
    color:var(--muc-nhat);margin-bottom:8px;
  }
}

@media (max-width:860px){
  body{font-size:16.5px}
  .luoi-3,.luoi-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doi{grid-template-columns:minmax(0,1fr);gap:28px}
  .doi-anh{order:-1}
  .vien-anh{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vien-anh a:nth-child(6){grid-column:span 2;grid-row:span 1}
}

@media (max-width:720px){
  :root{--le:16px}            /* lề 16px ở điện thoại, không bao giờ 0 */
  html{scroll-padding-top:74px}
  .thanh-di-dong{display:flex}
  body{padding-bottom:70px}   /* chừa chỗ cho thanh dính, không che chân trang */
  .dai-so-in{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}
  .phieu-luoi{grid-template-columns:minmax(0,1fr)}
  /* nền 8.5em: hai nút chung hàng, nút thứ ba xuống hàng (lỗi 30/10: ba nút ép thành hình tròn) */
  .hero-nut .nut{flex:1 1 8.5em;min-width:0}
  /* ảnh bìa dùng khung dọc riêng (thẻ <source> ở trang chủ); giữ vầng sáng bên phải */
  .hero-anh{object-position:62% 50%}
  .hero::before{background:linear-gradient(180deg,rgba(21,43,35,.72) 0%,rgba(21,43,35,.56) 45%,rgba(21,43,35,.34) 100%)}
  h2{margin-top:1.8em}
}

@media (max-width:560px){
  .luoi-3,.luoi-4,.luoi-2{grid-template-columns:minmax(0,1fr)}
  .vien-anh{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vien-anh a:nth-child(1){grid-column:span 2;grid-row:span 1}
  .vien-anh a:nth-child(6) img{position:static;aspect-ratio:2/1;height:auto}   /* ô 6 đứng riêng một hàng */
  .chan-luoi{grid-template-columns:minmax(0,1fr);gap:28px}
  .hieu-chu span{display:none}
  table{min-width:440px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .the:hover,.nut:hover{transform:none}
}

@media print{
  .dau,.thanh-di-dong,.menu-giay,.goi,.hero-nut{display:none!important}
  body{background:#fff;padding-bottom:0}
  .the,.hop,.bang-boc{break-inside:avoid}
}

/* --- đầu trang chủ: 5–6 ảnh cảnh đẹp sạch, không chữ (01/11/2026) ---------------------------------
   Khung đúng tỉ lệ ảnh (16:9 máy tính, 4:5 điện thoại) → ảnh đúng khổ hiện TRỌN, không cắt mép.
   Khung thu hẹp để cao không quá màn hình (trừ thanh trên + menu + hàng nút). Nút, chấm nằm DƯỚI ảnh,
   không đè lên ảnh. Ảnh chồng lên nhau (chuyển mờ) nên không có phần tử nào tràn ngang. */
.bia{background:var(--kem);padding:14px 0 6px;outline:0}
.bia:focus-visible .bia-khung{outline:3px solid var(--vang);outline-offset:3px}
.bia-khung{position:relative;width:min(calc(100% - 2 * var(--le, 24px)), var(--rong, 1180px), calc((100vh - 200px) * 16 / 9));
  aspect-ratio:16/9;margin:0 auto;overflow:hidden;border-radius:14px;background:var(--kem-dam)}
.bia-o{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.2s ease;pointer-events:none}
.bia-o.dang{opacity:1;pointer-events:auto}
.bia-o img{display:block;width:100%;height:100%;object-fit:cover}
.bia-o a{display:block;height:100%}
.bia-dieu-khien{display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 0 4px}
.bia-nut{width:40px;height:40px;border-radius:50%;border:1px solid var(--vien);background:var(--trang);color:var(--rung-dam);
  font-size:24px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.bia-nut:hover{background:var(--rung);color:#fff;border-color:var(--rung)}
.bia-nut:focus-visible,.bia-cham button:focus-visible{outline:3px solid var(--vang);outline-offset:2px}
.bia-dung{font-size:12px;letter-spacing:-1px}
.bia-cham{display:flex;gap:9px}
.bia-cham button{width:11px;height:11px;border-radius:50%;border:2px solid var(--rung);background:transparent;padding:0;cursor:pointer}
.bia-cham button[aria-current]{background:var(--rung)}
@media (max-width:720px){
  .bia{padding-top:10px}
  .bia-khung{aspect-ratio:4/5;width:calc(100% - 2 * var(--le, 16px));border-radius:10px}
  .bia-dieu-khien{gap:10px}
  .bia-nut{width:36px;height:36px;font-size:21px}
}
/* Slider poster (anh chê khung nhỏ có viền kem, 01/11/2026): làm như Thế Giới Giấy, băng rôn TRÀN HẾT BỀ NGANG,
   sát dưới menu, không bo góc, không lề. Poster giữ 16:9 nên thấy trọn chữ. Hàng nút mảnh nằm dưới ảnh. */
.bia-poster{padding:0;background:var(--trang)}
.bia-poster .bia-khung{width:100%;max-width:none;aspect-ratio:16/9;border-radius:0;margin:0}
.bia-poster .bia-dieu-khien{padding:8px 0;gap:12px;border-bottom:1px solid var(--vien)}
.bia-poster .bia-nut{width:32px;height:32px;font-size:20px}
.bia-poster .bia-dung{font-size:10px}
@media (max-width:720px){
  .bia-poster{padding:0}
  .bia-poster .bia-khung{width:100%;aspect-ratio:16/9;border-radius:0}
}
.hero-chu::before{display:none}   /* khối chữ dưới ảnh bìa: nền xanh trơn */
.hero-chu .hero-in{padding:clamp(34px,5vw,60px) 0 clamp(30px,4.5vw,52px)}
/* 1041–1380px: menu 7 mục có mũi tên xổ xuống làm header tràn ~23px ở 1280 (quét 01/11/2026) → thu khoảng đệm */
@media (min-width:1221px) and (max-width:1380px){
  .menu a{padding:9px 7px;font-size:.86rem}
  .menu-mui{margin-left:4px}
  .dau-nut{gap:7px}
}
/* 1041–1240px: vẫn thiếu chỗ (đo 1060px tràn 108px) → ẩn số điện thoại ở header; số vẫn có ở nút gọi, chân trang, trang Liên hệ */
@media (min-width:1221px) and (max-width:1240px){
  .dau-sdt{display:none}
}

/* === Bố cục theo thegioigiay.net (01/11/2026) ============================ */
/* thanh trên cùng: tên công ty · email · số điện thoại */
.dau-tren{background:var(--rung-dam);color:rgba(255,255,255,.82);font-size:.78rem}
.dau-tren-in{display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:34px}
.dau-tren-ten{font-weight:700;letter-spacing:.06em}
.dau-tren-lh{display:flex;gap:18px}
.dau-tren a{color:rgba(255,255,255,.82);display:inline-flex;align-items:center;gap:6px}
.dau-tren a:hover{color:var(--vang-nhat);text-decoration:none}
.dau-tren svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8}
/* menu chữ in hoa như mẫu */
.menu{margin-left:auto;margin-right:auto}
.menu>a,.menu-muc>a{text-transform:uppercase;font-weight:600;letter-spacing:.02em}
/* menu lớn chia cột (mục SẢN PHẨM) */
.menu-muc-lon{position:static}
.dau-in{position:relative}
.menu-xo.menu-lon{left:0;right:0;flex-direction:row;gap:26px;padding:22px 26px;min-width:0}
.menu-cot{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.menu-cot b{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--rung-dam);padding:4px 12px 8px;border-bottom:2px solid var(--vang);margin-bottom:6px}
/* ô tìm kiếm */
.tim{position:relative;flex-shrink:0}
.tim-o{width:190px;padding:8px 12px;border:1px solid var(--vien);border-radius:999px;background:var(--trang);font:inherit;font-size:.86rem}
.tim-o:focus{outline:2px solid var(--vang);outline-offset:1px}
.tim-kq{position:absolute;right:0;top:calc(100% + 6px);z-index:70;width:280px;max-width:86vw;background:var(--trang);
  border:1px solid var(--vien);border-radius:var(--bo-nho);box-shadow:var(--do-sau-cao);padding:6px;display:flex;flex-direction:column}
.tim-kq[hidden]{display:none}
.tim-kq a{padding:8px 10px;border-radius:6px;color:var(--muc);font-size:.9rem}
.tim-kq a:hover{background:var(--kem-dam);text-decoration:none}
.tim-kq span{padding:8px 10px;font-size:.86rem;color:var(--muc-nhat)}
.tim-giay{margin:4px 0 10px}
.tim-giay .tim-o{width:100%}
.tim-giay .tim-kq{position:static;width:auto;box-shadow:none;margin-top:6px}
/* chân trang 3 cột + dải bản quyền */
.chan-luoi{grid-template-columns:1.5fr 1fr 1fr}
.chan-hieu p{margin-bottom:14px}
.chan-day{display:block;border-top:0;background:rgba(0,0,0,.25);text-align:center;margin:0;padding:16px 0}
/* nút gọi + Zalo nổi bên phải (máy tính) */
.noi{position:fixed;right:18px;bottom:22px;z-index:65;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.noi a{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;color:#fff;font-weight:700;
  box-shadow:0 6px 18px rgba(0,0,0,.22)}
.noi a:hover{text-decoration:none;transform:translateY(-1px)}
.noi-sdt{background:var(--vang);padding:11px 18px;font-size:.95rem}
.noi-sdt svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.noi-zalo{width:52px;height:52px;background:#0068ff;font-size:.82rem}
@media (max-width:1000px){
  .tim{display:none}
  .tim.tim-giay{display:block}
}
@media (max-width:720px){
  .noi{display:none}
  .dau-tren-ten{display:none}
  .dau-tren-lh{width:100%;justify-content:space-between}
  .chan-luoi{grid-template-columns:minmax(0,1fr)}
}

/* ===== Facebook (01/11/2026) ===== */
.noi-fb{width:52px;height:52px;background:#1877f2;font-size:1.5rem;font-family:Arial,sans-serif}
.chan-fb{width:16px;height:16px;flex-shrink:0;margin-top:4px;border-radius:3px;background:var(--vang);color:#2b1d05;
  font:700 12px/16px Arial,sans-serif;text-align:center}

/* ===== Trang chủ theo khối thegioigiay.net (01/11/2026) ===== */
.tieu-giua{text-align:center;text-transform:uppercase;letter-spacing:.04em;margin:0 0 30px;position:relative;padding-bottom:14px}
.tieu-giua::after{content:"";position:absolute;left:50%;bottom:0;width:64px;height:3px;margin-left:-32px;background:var(--vang);border-radius:2px}
.la-ai{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.la-ai h1{margin-top:0;text-transform:uppercase;font-size:clamp(1.6rem,3vw,2.2rem)}
.la-ai-anh img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;box-shadow:0 14px 34px rgba(0,0,0,.14)}
.la-ai-them{margin:28px 0 0;padding:20px 24px;border-left:4px solid var(--vang);background:var(--kem-dam);border-radius:0 10px 10px 0}
.sp-tab{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:28px}
.sp-tab button{border:2px solid var(--rung);background:#fff;color:var(--rung);font:inherit;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;padding:10px 20px;border-radius:999px;cursor:pointer}
.sp-tab button[aria-selected=true]{background:var(--rung);color:#fff}
.sp-o{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:36px;align-items:center}
.sp-o[hidden]{display:none}
.sp-anh img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;display:block}
.sp-chu h2{margin-top:0;text-align:center}
.sp-chu .nut{display:table;margin:18px auto}
.sp-nho{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sp-nho img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:8px}
.blcg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.blcg-anh img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;display:block}
.blcg-ds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.blcg-ds .nut{grid-column:1/-1;justify-self:start}
.diem{display:block;padding:14px 16px;background:#fff;border:1px solid rgba(0,0,0,.08);border-left:4px solid var(--rung);border-radius:8px;color:inherit}
.diem:hover{text-decoration:none;border-left-color:var(--vang);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.diem b{display:block;color:var(--rung)}
.diem span{display:block;font-size:.92rem;opacity:.85;margin-top:3px}
.khach,.tin{display:block;background:#fff;border-radius:12px;overflow:hidden;color:inherit;box-shadow:0 6px 20px rgba(0,0,0,.07)}
.khach:hover,.tin:hover{text-decoration:none;transform:translateY(-2px)}
.khach img,.tin img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}
.khach b,.tin b{display:block;padding:14px 16px 4px;color:var(--rung);line-height:1.35}
.khach b{text-align:center;text-transform:uppercase}
.khach span,.tin span{display:block;padding:0 16px 16px;font-size:.93rem;opacity:.85}
.khach span{text-align:center}
@media (max-width:900px){
  .la-ai,.sp-o,.blcg{grid-template-columns:minmax(0,1fr);gap:22px}
}
@media (max-width:520px){
  .blcg-ds{grid-template-columns:minmax(0,1fr)}
  .sp-tab button{padding:8px 13px;font-size:.85rem}
}
@media (max-width:420px){.dau-tren-lh a[href*="facebook"]{display:none}}
.la-ai h1,.tieu-giua,.sp-chu h2{text-wrap:balance}

/* ===== Thanh menu dính theo khi cuộn, đủ 7 mục + tìm kiếm từ 1001px (01/11/2026) ===== */
.dau{transition:box-shadow .2s}
.dau.dang-cuon{box-shadow:0 4px 18px rgba(0,0,0,.12)}
@media (min-width:1001px) and (max-width:1220px){
  .chan-luoi{grid-template-columns:1.5fr 1fr 1fr}
  .dau-in{gap:10px}
  .menu{gap:0}
  .menu a{padding:8px 6px;font-size:.78rem;letter-spacing:0}
  .menu-mui{margin-left:3px;width:5px;height:5px}
  .hieu-chu span{display:none}
  .hieu-chu b{font-size:1rem}
  .tim-o{width:132px;font-size:.8rem;padding:7px 10px}
}
/* Montserrat rộng chữ hơn phông cũ → thu menu cho vừa một hàng (đo 1005–1440px, 01/11/2026) */
.menu a{white-space:nowrap}
@media (min-width:1221px) and (max-width:1380px){
  .menu a{font-size:.8rem;padding:9px 7px}
}
@media (min-width:1001px) and (max-width:1220px){
  .hieu-chu b{font-size:.9rem;letter-spacing:0}
  .hieu-dau{width:auto;height:32px}
  .menu a{font-size:.75rem;padding:8px 6px}
  .tim-o{width:118px}
}

/* ===== Trang Liên hệ kiểu thegioigiay.net: bản đồ trên, địa chỉ dưới (01/11/2026) ===== */
.lh-ban-do-khoi{padding-top:22px;padding-bottom:0}
.lh-ban-do-khoi .duong-dan{margin-bottom:12px}
.lh-ban-do{position:relative;border-radius:14px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.1);background:var(--kem-dam)}
.lh-ban-do iframe{display:block;width:100%;height:clamp(320px,48vw,480px);border:0}
.lh-mo-maps{position:absolute;left:12px;top:12px;background:#fff;color:var(--rung-dam);font-weight:600;font-size:.85rem;
  padding:8px 12px;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.lh-mo-maps:hover{text-decoration:none;color:var(--rung)}
.lh-luoi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start}
.lh-thong-tin h1,.lh-tieu{font-size:clamp(1.25rem,1.05rem + .8vw,1.6rem);text-transform:uppercase;margin:0 0 18px}
.lh-ds{list-style:none;margin:0;padding:0}
.lh-ds li{padding:7px 0;border-bottom:1px solid var(--vien)}
.lh-ds b{color:var(--rung-dam)}
.lh-nut{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
@media (max-width:860px){.lh-luoi{grid-template-columns:minmax(0,1fr);gap:28px}}
.dau-tren a{white-space:nowrap}
@media (max-width:420px){.dau-tren{font-size:.72rem}.dau-tren-lh{gap:10px}}
.noi{transition:opacity .25s}
.noi.an{opacity:0;pointer-events:none}

/* Logo BM Luxury ngang rộng hơn biểu tượng núi cũ → thu cho vừa (quét 01/11/2026) */
@media (min-width:1381px) and (max-width:1500px){ .tim-o{width:150px} }
@media (max-width:480px){
  .hieu{gap:7px}
  .hieu-dau{height:28px}
  .hieu-chu b{font-size:.86rem;letter-spacing:0}
}
@media (max-width:370px){ .hieu-dau{height:24px} .hieu-chu b{font-size:.78rem} }

/* === Thanh đầu trang kiểu Thế Giới Giấy (anh Đạt 01/11/2026: "thanh trang chủ giống vầy, chữ bố cục";
   "đang ở đâu thì in đậm"). Đo thegioigiay.net ở 1440px: thanh trên nền trắng cao ~29px, chữ 11–12px;
   thanh chính: logo lớn bên trái, menu IN HOA đậm 16,7px xám, mục đang mở màu đậm tối, không nền, không mũi tên;
   ô tìm viền vuông có kính lúp bên phải. === */
.dau-tren{background:var(--trang);color:#272525;font-size:.74rem;border-bottom:1px solid #eee}
.dau-tren-in{min-height:30px}
.dau-tren-ten{font-weight:600;letter-spacing:.02em;color:#272525}
.dau-tren a{color:var(--rung);font-weight:600}
.dau-tren a:hover{color:var(--rung-dam)}
.dau-tren-lh{gap:22px}
.dau{background:var(--trang);backdrop-filter:none}
.dau .wrap.dau-in{max-width:1340px}
.dau-in{min-height:90px;gap:24px}
.hieu-dau{height:62px}
.menu{margin:0 auto;gap:24px}
.menu a,.menu a:hover,.menu a[aria-current=page]{background:none;border-radius:0;padding:10px 0}
.menu a{font-size:1.045rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:rgba(102,102,102,.85)}
.menu a:hover{color:#111}
.menu a[aria-current=page]{color:#111;font-weight:800}
.menu-mui{display:none}
.tim-o{width:175px;border-radius:3px;border:1px solid #d5d5d5;padding:9px 36px 9px 12px;font-size:.88rem;
  box-shadow:0 2px 6px rgba(0,0,0,.06);
  background:var(--trang) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23222' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m20 20-4.6-4.6'/%3E%3C/svg%3E") no-repeat right 10px center/18px}
.tim-giay .tim-o{width:100%}
@media (min-width:1001px){ .hieu-chu{display:none} }   /* như mẫu: chỉ logo, tên công ty ở thanh trên */
@media (min-width:1221px) and (max-width:1380px){
  .menu{gap:16px} .menu a{font-size:.9rem;padding:10px 0} .hieu-dau{height:54px} .tim-o{width:150px}
}
@media (min-width:1001px) and (max-width:1220px){
  .dau-in{gap:14px;min-height:76px} .menu{gap:11px} .menu a{font-size:.76rem;padding:9px 0;letter-spacing:0}
  .hieu-dau{height:44px} .tim-o{width:128px}
}
@media (max-width:1000px){ .dau-in{min-height:64px} .hieu-dau{height:40px} }
@media (max-width:480px){ .hieu-dau{height:30px} }
@media (max-width:370px){ .hieu-dau{height:26px} }
.menu-muc{display:flex;align-items:center}
.menu > a,.menu-muc > a{display:inline-flex;align-items:center;line-height:1.2}
/* Anh chê "chữ còn bị nhỏ" (01/11/2026): giữ menu 16,7px như mẫu tới 1160px, chỉ thu khoảng cách, logo, ô tìm;
   1001–1159px vẫn 15px. Thanh trên chữ 13px (máy tính). */
@media (min-width:768px){ .dau-tren{font-size:.82rem} }
@media (min-width:1221px) and (max-width:1380px){
  .menu{gap:20px} .menu a{font-size:1.045rem} .hieu-dau{height:54px} .tim-o{width:150px}
}
@media (min-width:1160px) and (max-width:1220px){
  .dau-in{gap:16px;min-height:80px} .menu{gap:16px} .menu a{font-size:1.045rem;letter-spacing:0}
  .hieu-dau{height:48px} .tim-o{width:132px}
}
@media (min-width:1001px) and (max-width:1159px){
  .dau-in{gap:14px;min-height:76px} .menu{gap:12px} .menu a{font-size:.94rem;letter-spacing:0}
  .hieu-dau{height:42px} .tim-o{width:118px}
}
/* Bảo Lộc có gì: Bình Minh đứng đầu, nổi bật (anh Đạt 01/11/2026 "ưu tiên nhất là bình minh") */
.diem.diem-dau{background:var(--rung-dam);border-color:var(--rung-dam)}
.diem.diem-dau b{color:#fff}
.diem.diem-dau span{color:rgba(255,255,255,.86)}
.diem.diem-dau:hover{background:var(--rung)}
/* === Chạy ảnh bìa kiểu thegioigiay.net (01/11/2026): ảnh trượt ngang, nút tròn trắng mờ hai bên ảnh (hiện khi rê chuột,
   luôn hiện trên điện thoại), chấm tròn nằm mép dưới ảnh. === */
.bia-poster .bia-khung{position:relative;overflow:hidden;touch-action:pan-y}
.bia-poster .bia-ray{display:flex;height:100%;transition:transform .7s cubic-bezier(.25,.8,.25,1);will-change:transform}
.bia-poster .bia-o{position:relative;inset:auto;flex:0 0 100%;height:100%;opacity:1;pointer-events:auto;transition:none}
.bia-poster .bia-o img{user-select:none;-webkit-user-drag:none}
.bia-poster .bia-nut{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;font-size:30px;
  border:0;background:rgba(255,255,255,.82);color:#222;box-shadow:0 2px 10px rgba(0,0,0,.18);opacity:0;transition:opacity .25s}
.bia-poster .bia-lui{left:22px}
.bia-poster .bia-toi{right:22px}
.bia-poster .bia-khung:hover .bia-nut,.bia-poster .bia-nut:focus-visible{opacity:1}
.bia-poster .bia-nut:hover{background:#fff;color:#111}
.bia-poster .bia-dieu-khien{position:absolute;left:0;right:0;bottom:12px;z-index:3;padding:0;border:0;gap:10px;pointer-events:none}
.bia-poster .bia-cham,.bia-poster .bia-dung{pointer-events:auto}
.bia-poster .bia-cham button{width:11px;height:11px;border:0;background:rgba(255,255,255,.55);box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.bia-poster .bia-cham button[aria-current]{background:#fff}
.bia-poster .bia-dung{width:24px;height:24px;border-radius:50%;border:0;background:rgba(255,255,255,.55);color:#222;font-size:9px;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;letter-spacing:-1px}
@media (hover:none){ .bia-poster .bia-nut{opacity:.85} }
@media (max-width:720px){
  .bia-poster .bia-nut{width:32px;height:32px;font-size:20px}
  .bia-poster .bia-lui{left:8px} .bia-poster .bia-toi{right:8px}
  .bia-poster .bia-dieu-khien{bottom:6px} .bia-poster .bia-cham button{width:8px;height:8px} .bia-poster .bia-dung{width:20px;height:20px}
}
@media (prefers-reduced-motion:reduce){ .bia-poster .bia-ray{transition:none} }

/* === Trang giới thiệu dạng landing page (lp-, 01/11/2026) ============================================ */
.lp-nhan{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--vang);margin:0 0 10px}
.lp-hero{background:var(--kem);padding:clamp(26px,4vw,56px) 0 clamp(34px,5vw,70px)}
.lp-hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,4vw,60px);align-items:center}
.lp-hero h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.4rem);line-height:1.08;margin:0 0 18px;color:var(--rung-dam);text-transform:uppercase;letter-spacing:.01em}
.lp-dan{font-size:clamp(1.02rem,.95rem + .3vw,1.18rem);line-height:1.7;color:var(--muc);margin:0 0 26px;max-width:36em}
.lp-nut{display:flex;flex-wrap:wrap;gap:12px}
.lp-nut-vien{border:2px solid var(--rung);color:var(--rung-dam);background:transparent}
.lp-nut-vien:hover{background:var(--rung);color:#fff;text-decoration:none}
.lp-nut-sang{border-color:rgba(255,255,255,.8);color:#fff}
.lp-nut-sang:hover{background:#fff;color:var(--rung-dam)}
.lp-hero-anh{position:relative;margin:0}
.lp-hero-anh img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;box-shadow:var(--do-sau-cao)}
.lp-trich{margin:14px 0 0;font-style:italic;color:var(--rung);font-weight:600;text-align:right}
.lp-so{background:var(--rung-dam);color:#fff}
.lp-so-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:clamp(22px,3vw,34px) 0;text-align:center}
.lp-so b{display:block;font-family:var(--chu-de);font-size:clamp(1.6rem,1.1rem + 1.8vw,2.6rem);font-weight:800;color:var(--vang-nhat,#e8bd62);line-height:1.1}
.lp-so span{display:block;margin-top:6px;font-size:.9rem;color:rgba(255,255,255,.82)}
.lp-tieu{text-align:center;max-width:720px;margin:0 auto clamp(28px,4vw,46px)}
.lp-tieu h2{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.4rem);margin:0 0 12px;text-transform:uppercase}
.lp-tieu p:last-child{margin:0;color:var(--muc-nhat)}
.lp-tieu-sang p:last-child{color:rgba(255,255,255,.82)}
.lp-moc{list-style:none;margin:0;padding:0;display:grid;gap:clamp(26px,4vw,48px)}
.lp-moc-o{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(20px,3.5vw,48px);align-items:center}
.lp-moc-o:nth-child(even) .lp-moc-anh{order:2}
.lp-moc-anh img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px;box-shadow:var(--do-sau)}
.lp-nam{display:inline-block;background:var(--vang);color:var(--rung-dam);font-weight:800;font-size:.85rem;padding:5px 12px;border-radius:999px;margin-bottom:10px}
.lp-moc-chu h3{font-size:clamp(1.25rem,1.05rem + .7vw,1.6rem);margin:0 0 10px}
.lp-moc-chu p:last-child{margin-bottom:0}
.lp-loi{margin:clamp(34px,5vw,56px) auto 0;max-width:820px;padding:clamp(20px,3vw,30px) clamp(22px,3.5vw,38px);background:var(--kem-dam);
  border-left:5px solid var(--vang);border-radius:0 14px 14px 0;font-size:1.05rem;line-height:1.7}
.lp-loi p{margin:0}
.lp-nguoi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.5vw,28px)}
.lp-nguoi-o{background:var(--trang);border:1px solid var(--vien);border-radius:16px;padding:clamp(22px,3vw,32px);box-shadow:var(--do-sau)}
.lp-chu-cai{display:inline-flex;width:58px;height:58px;border-radius:50%;background:var(--rung);color:#fff;font-weight:800;font-size:1.5rem;
  align-items:center;justify-content:center;margin-bottom:14px}
.lp-nguoi-o h3{margin:0 0 4px;font-size:1.3rem}
.lp-vai{margin:0 0 12px;color:var(--vang);font-weight:700;font-size:.92rem}
.lp-nguoi-o p:last-child{margin-bottom:0}
.lp-ghi{max-width:820px;margin:clamp(22px,3vw,32px) auto 0;text-align:center;color:var(--muc-nhat)}
.lp-ghi-sang{color:rgba(255,255,255,.78)}
.lp-gt{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.lp-gt-o{background:var(--trang);border:1px solid var(--vien);border-top:4px solid var(--rung);border-radius:14px;padding:22px 18px}
.lp-so-tt{display:block;font-family:var(--chu-de);font-weight:800;font-size:1.6rem;color:var(--vang);line-height:1;margin-bottom:10px}
.lp-gt-o h3{margin:0 0 8px;font-size:1.12rem}
.lp-gt-o p{margin:0;font-size:.95rem}
.lp-luoi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lp-the{position:relative;display:block;border-radius:14px;overflow:hidden;color:#fff;text-decoration:none}
.lp-the img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s}
.lp-the:hover img{transform:scale(1.04)}
.lp-the span{display:block;padding:12px 14px;background:var(--rung);font-weight:700;letter-spacing:.02em}
.lp-the:hover{text-decoration:none}
.lp-phap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(20px,3.5vw,44px);align-items:start}
.lp-phap h2{margin-top:0;text-transform:uppercase}
.lp-phap-canh h3{margin-top:0}
.lp-cuoi{background:var(--rung-dam);color:#fff;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
.lp-cuoi img{display:block;width:100%;height:100%;min-height:320px;object-fit:cover}
.lp-cuoi-in{padding:clamp(30px,5vw,64px) clamp(20px,5vw,64px);max-width:640px}
.lp-cuoi h2{color:#fff;margin:0 0 12px;text-transform:uppercase;font-size:clamp(1.6rem,1.2rem + 1.5vw,2.4rem)}
.lp-cuoi p{color:rgba(255,255,255,.85);margin:0 0 24px}
@media (max-width:1000px){
  .lp-gt{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lp-so-in{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}
}
@media (max-width:860px){
  .lp-hero-in,.lp-moc-o,.lp-phap,.lp-cuoi,.lp-nguoi{grid-template-columns:minmax(0,1fr)}
  .lp-moc-o:nth-child(even) .lp-moc-anh{order:0}
  .lp-luoi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lp-cuoi img{min-height:0;aspect-ratio:16/9}
}
@media (max-width:480px){
  .lp-gt{grid-template-columns:minmax(0,1fr)}
  .lp-luoi{gap:10px}
  .lp-the span{padding:9px 10px;font-size:.9rem}
}
@media (max-width:560px){
  .lp-phap table,.lp-phap tbody,.lp-phap tr,.lp-phap th,.lp-phap td{display:block;width:100%}
  .lp-phap table{min-width:0}
  .lp-phap th{padding-bottom:2px;border-bottom:0}
  .lp-phap td{padding-top:2px;word-break:break-word}
}