/* ==========================================================================
   Bánh Ngọt Mộc Nhiên — tokens.css
   Lớp tuỳ biến thương hiệu. Sửa file này là đổi được toàn bộ diện mạo.
   Được nạp TRƯỚC khối <style> trong index.html.
   ========================================================================== */

:root {
  /* --- Bảng màu lõi ---------------------------------------------------- */
  --nen:            #FCFCFA;   /* nền trang — trắng lạnh, không ngả kem     */
  --muc:            #1B2220;   /* chữ chính — xanh đen                      */
  --muc-nhat:       #4A5754;   /* chữ phụ, mô tả (đạt AA trên nền)          */
  --xanh:           #2F6B5E;   /* ACCENT — nút, giá, số liệu                */
  --xanh-dam:       #24544A;   /* trạng thái hover của accent               */
  --xanh-rat-nhat:  #E4EDE9;   /* nền chip, viền nhấn nhẹ                   */
  --hong:           #E8C9CE;   /* màu phụ — badge, chi tiết trang trí       */
  --hong-dam:       #7A3A47;   /* chữ trên nền hồng (đạt AA)                */
  --the:            #F0F4F1;   /* nền thẻ / khối                            */
  --vien:           #DCE4E0;   /* đường viền mảnh                           */
  --do-km:          #C0392B;   /* giá khuyến mãi (dùng rất tiết chế)        */

  /* --- Nền tối (dải CTA, footer) --------------------------------------- */
  --toi:            #16211E;
  --toi-chu:        #E8EFEB;
  --toi-chu-nhat:   #A9BCB5;   /* ≥4.5:1 trên nền tối                       */
  --toi-vien:       rgba(232,239,235,.16);

  /* --- Kiểu chữ --------------------------------------------------------- */
  --font-tieu-de:   "Be Vietnam Pro", system-ui, sans-serif;
  --font-than:      "Inter", "Be Vietnam Pro", system-ui, sans-serif;
  --font-nhan:      "IBM Plex Mono", ui-monospace, monospace;

  --co-than:        1.0625rem;  /* 17px */
  --cao-dong:       1.62;       /* line-height thân bài — tối thiểu 1.5     */
  --cao-tieu-de:    1.12;       /* line-height tiêu đề — tối thiểu 1.05     */

  /* --- Bo góc (hệ b: 16px ảnh/thẻ, 999px chip) -------------------------- */
  --bo-the:         16px;
  --bo-nho:         10px;
  --bo-chip:        999px;

  /* --- Nhịp khoảng cách (thang tight/base — KHÔNG dùng airy) ------------ */
  --doc-chat:       clamp(2.5rem, 5vw, 3.25rem);   /* ~40–52px             */
  --doc-co-ban:     clamp(3.25rem, 6.5vw, 4.5rem); /* ~52–72px             */
  --le-trang:       clamp(1.125rem, 4vw, 3.75rem); /* gutter 18 → 28 → 60  */
  --rong-toi-da:    1240px;

  /* --- Đổ bóng ---------------------------------------------------------- */
  --bong-nhe:       0 1px 2px rgba(27,34,32,.05), 0 8px 24px rgba(27,34,32,.06);
  --bong-noi:       0 2px 4px rgba(27,34,32,.06), 0 18px 40px rgba(27,34,32,.10);

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