/* Trang gioi thieu tung san pham: gauux.com/ads · /hr · /chat
 *
 * Ba con AI tach o tang BAN, gop o tang DUNG. Xem ly do dai o dau
 * src/mien-shop.js: `*.gauux.com` la namespace CUA SHOP, khong phai cua mo-dun.
 *
 * File nay chi TIEU THU token cua thuong-hieu.css. Khong mot ma mau nao duoc
 * go thang o day — doi bo nhan dien phai la doi mot cho.
 */

*{box-sizing:border-box}
body{margin:0;background:var(--qt-paper);color:var(--qt-ink);
  font-family:var(--font-than);font-size:var(--tx-body);line-height:1.6;
  -webkit-font-smoothing:antialiased}
a{color:var(--qt-g700);text-decoration:none}
a:hover{text-decoration:underline}
/* 1180px — CUNG be rong voi trang chu. Truoc 28/08/2026 ba nhom trang cong
   khai co ba be rong khac nhau (trang chu 1180 · trang ban 940 · phap ly 760),
   nen bam qua lai la khoi noi dung nhay ngang. Trang phap ly GIU 760 cho cot
   chu: do la be rong doc duoc cua mot doan van dai, khong phai mot lua chon
   tuy tien. */
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* ---- thanh tren, giong trang phap ly de di lai khong thay doi tong ---- */
/* Thanh tren cao 68px, GIONG trang chu va trang phap ly. Ban ve khai duong ke
   chay het chieu ngang man hinh; o day no dung trong be rong noi dung, vi mot
   `width:100vw` se tran ngang khi co thanh cuon — va bo quet bat tran ngang. */
.top{display:flex;align-items:center;gap:14px;height:68px;padding:0;
  border-bottom:1px solid var(--qt-line);margin-bottom:8px;flex-wrap:nowrap}
.top .home{display:flex;align-items:center;gap:9px;font-weight:700;color:var(--qt-ink);font-size:17px}
.top .sp{flex:1}
.top nav{display:flex;gap:28px;flex-wrap:wrap;font-size:14px;font-weight:500}
.top nav a{color:var(--qt-ink3)}
.top nav a[aria-current]{color:var(--qt-g700);font-weight:600}

/* ---- hero ---- */
.hero{padding:44px 0 8px}
.hero .nhan{display:inline-flex;align-items:center;gap:8px;font-size:var(--tx-nho);
  font-weight:600;color:var(--qt-g700);background:var(--qt-g100);
  border:1px solid var(--qt-g100-vien);border-radius:99px;padding:5px 13px}
.hero h1{font-size:var(--tx-display);line-height:1.2;margin:16px 0 0;letter-spacing:-.01em}
.hero p{font-size:var(--tx-body-l);color:var(--qt-ink2);max-width:60ch;margin:14px 0 0}
.nut{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.nut a{display:inline-flex;align-items:center;border-radius:var(--qt-r);padding:11px 20px;
  font-weight:600;font-size:var(--tx-body)}
.nut a:hover{text-decoration:none}
.nut .chinh{background:var(--qt-g700);color:#fff}
.nut .chinh:hover{background:var(--qt-g800)}
.nut .phu{border:1px solid var(--qt-line);color:var(--qt-ink);background:var(--qt-white)}

/* ---- khoi noi dung ---- */
.khoi{padding:40px 0 8px}
.khoi h2{font-size:var(--tx-h2);margin:0 0 6px;letter-spacing:-.01em}
.khoi>p{color:var(--qt-ink2);max-width:66ch;margin:0}
.luoi{display:grid;gap:14px;margin-top:20px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.the{background:var(--qt-white);border:1px solid var(--qt-line);
  border-radius:var(--qt-r);padding:18px;box-shadow:var(--qt-sh)}
.the b{display:block;margin-bottom:5px}
.the p{margin:0;color:var(--qt-ink2);font-size:var(--tx-nho)}

/* Danh sach "doc gi" — dau cham don gian, khong icon trang tri */
.doc{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:9px}
.doc li{padding-left:22px;position:relative;color:var(--qt-ink2)}
.doc li::before{content:"";position:absolute;left:4px;top:.62em;width:7px;height:7px;
  border-radius:50%;background:var(--qt-g600)}
.doc b{color:var(--qt-ink)}

/* Khoi "khong lam gi" — day la thu phan biet gauux voi mot trang ban hang
   thong thuong, nen no duoc mot khoi rieng chu khong phai mot dong chan trang. */
.khong{background:var(--qt-white);border:1px solid var(--qt-line);
  border-left:3px solid var(--qt-amber);border-radius:var(--qt-r);
  padding:20px 22px;margin-top:22px}
.khong h3{margin:0 0 10px;font-size:var(--tx-h3)}
.khong ul{margin:0;padding-left:20px;color:var(--qt-ink2)}
.khong li{margin-bottom:7px}
.khong li:last-child{margin-bottom:0}

/* ---- ba san pham o chan moi trang: mot ung dung, khong phai ba ---- */
.bo{display:grid;gap:12px;margin-top:20px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.bo a{display:block;background:var(--qt-white);border:1px solid var(--qt-line);
  border-radius:var(--qt-r);padding:16px;color:var(--qt-ink)}
.bo a:hover{border-color:var(--qt-g600);text-decoration:none}
.bo a[aria-current]{border-color:var(--qt-g600);background:var(--qt-g100)}
.bo b{display:block;color:var(--qt-g800)}
.bo span{font-size:var(--tx-nho);color:var(--qt-ink3)}
/* The DANG MO co nen xanh nhat, nen chu mo tren do tut xuong 4,07:1 — truot AA.
   Dam len mot bac o dung the do: 6,49:1. */
.bo a[aria-current] span{color:var(--qt-ink2)}

.chan{border-top:1px solid var(--qt-line);margin-top:48px;padding:22px 0 40px;
  font-size:var(--tx-nho);color:var(--qt-ink3);display:flex;gap:18px;flex-wrap:wrap}
.chan a{color:var(--qt-ink3)}

@media(max-width:640px){
  .hero{padding:28px 0 4px}
  .wrap{padding:0 18px}
}

/* ---------------- vùng bấm trên điện thoại ----------------
   Cùng luật với phap-ly.css: liên kết đứng riêng thành 44px, liên kết giữa
   đoạn văn nới bằng đệm + lề âm. Đo 27/08/2026: /ads /chat /hr đều có liên kết
   thanh trên 22–27px ở khổ 390px.

   NGƯỠNG 900px, KHÔNG PHẢI 640px. Đo lại 04/09/2026 ở khổ 834px (iPad dọc —
   khổ máy tính bảng phổ biến nhất): mọi liên kết thanh trên vẫn 22px, logo
   27px. Ngón tay không bấm trúng ở cỡ đó, mà 834 nằm lọt giữa 640 và 960 nên
   không luật nào với tới. 900px là ngưỡng điện thoại DUY NHẤT của repo — cùng
   số với `style.css` và bản mẫu giao diện. */
@media(max-width:900px){
  .top a,.chan a{min-height:44px;display:inline-flex;align-items:center;padding:0 6px;margin:0 -6px}
  .top nav{display:flex;flex-wrap:wrap;align-items:center;gap:2px}
  .top nav a{margin-left:0}
  a:not(.top a):not(.chan a):not(.bo a):not(.nut){min-height:0;display:inline;padding:14px 2px;margin:-14px 0}
}