/* ─────────────────────────────────────────────────────────────
   QUÁN NHẬU BẾN CŨ — bộ token thương hiệu
   Quán nhậu bia thủ công & hải sản nướng, ven sông Hàn, Đà Nẵng.
   Mở cửa từ 2017.

   Toàn bộ giá trị thương hiệu nằm trong một khối :root duy nhất.
   File này được nạp TRƯỚC thẻ <style> trong index.html, nên trang
   dùng lại qua var(). Muốn đổi nhận diện thì sửa ở đây — không
   cần đụng vào index.html để đổi màu hay đổi font.
   ───────────────────────────────────────────────────────────── */
:root{

  /* ── Nền & bề mặt ──────────────────────────────────────────
     Register tối. Không bao giờ dùng #000 thuần — nền là màu
     gần-đen ám nâu ấm, để vàng bia và khói than không bị chói. */
  --nen:#121110;          /* nền trang                                */
  --the:#1C1A18;          /* bề mặt nổi: thẻ bia, thẻ món, FAQ        */
  --the-2:#242120;        /* bề mặt thứ hai: hover, panel lồng nhau   */
  --the-3:#2C2926;        /* viền trong thẻ, nền chip                 */

  /* ── Màu chữ ───────────────────────────────────────────────
     --xam đã nâng theo R1: #9B948A trên #121110 = 7.16:1.
     Đừng hạ màu nhãn xuống dưới mức này trên nền tối.          */
  --chu:#EFEAE1;          /* chữ chính                                */
  --xam:#9B948A;          /* chữ phụ, nhãn mono, chú thích ảnh         */
  --xam-mo:#7E7871;       /* chữ hạng ba — chỉ dùng cho footer legal   */

  /* ── Màu nhấn ──────────────────────────────────────────────
     Một màu nhấn duy nhất: vàng bia. Dùng cho nút Đặt bàn, giá,
     số liệu lớn, hover. Không rải ra body copy.                */
  --vang:#E4A11B;         /* vàng bia — màu nhấn chính                */
  --vang-sang:#F5B942;    /* hover / focus                            */
  --do-than:#A63A21;      /* đỏ than — CHỈ dùng cho badge nướng       */

  /* ── Đường kẻ ──────────────────────────────────────────────── */
  --ke:rgba(239,234,225,.14);    /* kẻ mảnh trên nền                  */
  --ke-2:rgba(239,234,225,.08);  /* kẻ mảnh hơn trong thẻ             */

  /* ── Bộ font ───────────────────────────────────────────────
     Ba face, đều an toàn dấu tiếng Việt. Archivo dựng chữ lớn
     (đã render-test với Ầ/ỹ/ọ), Be Vietnam Pro cho body, Space
     Mono chỉ cho nhãn/giá/giờ.                                 */
  --display:'Archivo',system-ui,sans-serif;          /* tiêu đề, wordmark */
  --body:'Be Vietnam Pro',system-ui,sans-serif;      /* body + giao diện  */
  --mono:'Space Mono',ui-monospace,monospace;        /* nhãn, giá, giờ    */

  /* ── Bo góc ────────────────────────────────────────────────
     Hệ (a): 0px toàn bộ. Sắc cạnh — hợp quán nhậu, không mềm.
     Tuyệt đối không thêm 4px: đó là dấu hiệu template rẻ tiền.  */
  --bo:0px;

  /* ── Bố cục ────────────────────────────────────────────────
     Mật độ VN đến từ SỐ LƯỢNG band và nội dung mỗi band,
     không đến từ việc thổi phồng padding. Thang tight/base.     */
  --khung:1240px;                        /* bề ngang tối đa           */
  --le:clamp(18px,4vw,60px);             /* lề trang, bậc thang       */
  --doc-hep:clamp(40px,5vw,52px);        /* section-y tight           */
  --doc:clamp(52px,6.5vw,68px);          /* section-y base            */

  /* ── Chuyển động ───────────────────────────────────────────
     Một đường cong duy nhất cho toàn trang. Không dùng `ease`.  */
  --nhip:cubic-bezier(.16,1,.3,1);
}
