/* ==========================================================
   Viện Thẩm Mỹ Lụa — biến thương hiệu
   Đổi nhận diện chỉ bằng file này.
   ========================================================== */
:root {
  /* ---- Bảng màu: 5 màu + 1 accent ---- */
  --nen:        #F6F4EF;  /* nền trang — kem ấm */
  --muc:        #232720;  /* chữ chính */
  --reu:        #4A5D4E;  /* xanh rêu — accent chính, nút Đặt lịch */
  --dong:       #B08D6A;  /* đồng nhạt — đường kẻ, số liệu */
  --card:       #FCFBF8;  /* nền thẻ */

  /* ---- Màu dẫn xuất (đạt AA, không tính là màu mới) ---- */
  --muc-70:     #55594F;  /* chữ phụ trên nền sáng — 7.0:1 */
  --muc-55:     #666A60;  /* nhãn mono trên nền sáng — 5.03:1 đạt AA */
  --reu-dam:    #3A4A3E;  /* hover nút, chữ xanh trên nền sáng */
  --dong-dam:   #7A5C3E;  /* chữ đồng đủ tương phản trên nền sáng */
  --vien:       #E2DFD6;  /* đường kẻ mảnh */
  --vien-dam:   #CFCABD;
  --tren-toi:   #EDEAE2;  /* chữ trên nền xanh rêu đậm */

  /* ---- Chữ ---- */
  --font-display: "Be Vietnam Pro", system-ui, sans-serif;
  --font-body:    "Montserrat", system-ui, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, monospace;

  --co-chu:     17px;   /* cỡ chữ nội dung */
  --dong-cao:   1.65;   /* line-height ≥1.5 cho dấu tiếng Việt */
  --dong-cao-tieude: 1.14;  /* ≥1.05 — không cắt dấu Ầ / ỹ / ọ */
  --co-mono:    12px;
  --gian-mono:  .11em;

  /* ---- Hình khối: hệ (b) ---- */
  --bo-goc:     16px;   /* thẻ, ảnh */
  --bo-chip:    999px;  /* chip, nút tròn */
  --bo-nut:     12px;

  /* ---- Khoảng cách (thang tight/base — cấm airy) ---- */
  --le:         clamp(16px, 4vw, 40px);
  --rong-toi-da: 1240px;
  --khoang-tight: 40px;
  --khoang-base:  56px;
  --gap:        clamp(12px, 1.6vw, 20px);

  /* ---- Chuyển động ---- */
  --easing: cubic-bezier(.16, 1, .3, 1);
  --thoi-gian: .45s;

  /* ---- Bóng đổ ---- */
  --bong: 0 1px 2px rgba(35,39,32,.04), 0 8px 24px rgba(35,39,32,.06);
}