/* ============================================================
   Bếp Nhà Bảy Hiền — biến thương hiệu
   Sửa file này để đổi nhận diện. Xem README.md để biết
   từng biến điều khiển thứ gì.
   ============================================================ */

:root {
  /* ---- Bảng màu chính ---- */
  --nen:        #FFFDF7;  /* nền trang                          */
  --card:       #F6EFE3;  /* nền thẻ, dải phụ                   */
  --muc:        #1F1A15;  /* chữ chính, tiêu đề                 */
  --do-son:     #B32B23;  /* accent — nút, giá, badge bán chạy  */
  --vang-nghe:  #E0A32E;  /* màu phụ — sao, viền nhấn           */

  /* ---- Màu dẫn xuất đạt AA trên nền ---- */
  --do-dam:     #96201A;  /* đỏ đậm cho chữ nhỏ trên nền sáng   */
  --xam-chu:    #5A5148;  /* chữ phụ                            */
  --vien:       rgba(31, 26, 21, .12);
  --vien-dam:   rgba(31, 26, 21, .26);

  /* ---- Dải nền tối ---- */
  --nen-toi:    #241D17;
  --chu-toi:    #F7F1E6;
  --chu-toi-mo: #BDB3A5;

  /* ---- Chữ ---- */
  --font-tieu-de: "Montserrat", system-ui, -apple-system, sans-serif;
  --font-than:    "Be Vietnam Pro", system-ui, -apple-system, sans-serif;
  --font-so:      "IBM Plex Mono", ui-monospace, Menlo, monospace;

  /* Tiếng Việt xếp dấu trên và dưới cùng một chữ —
     line-height dưới 1.5 sẽ chồng dấu. Không giảm.        */
  --co-chu:     17px;
  --gian-dong:  1.6;

  /* ---- Bo góc: hệ (b) — 12px thẻ, 999px chip ---- */
  --bo:         12px;
  --bo-nho:     8px;
  --bo-tron:    999px;

  /* ---- Khoảng cách dải (thang tight/base — không dùng airy) ---- */
  --dai-tight:  40px;
  --dai-base:   56px;

  /* ---- Chuyển động ---- */
  --muot:       cubic-bezier(.16, 1, .3, 1);

  /* ---- Đổ bóng ---- */
  --bong:       0 1px 2px rgba(31,26,21,.05), 0 10px 28px -12px rgba(31,26,21,.16);
  --bong-noi:   0 2px 4px rgba(31,26,21,.06), 0 20px 44px -18px rgba(31,26,21,.24);
}