/* NVE — Bảng màu theo logo thật: CAM chủ đạo (chữ NV), XANH LÁ phụ (khung logo), nền sáng tối giản. */
:root {
  /* Brand — Cam (logo NV) — MÀU CHỦ ĐẠO CHÍNH THỨC, KHÔNG tự ý đổi. */
  --orange-700: #b56d1c;
  --orange-600: #d07f24;
  --orange-500: #e79439; /* rgb(231 148 57) — màu logo */
  --orange-400: #eeab63;
  --orange-200: #fbe3c8;
  --orange-100: #fdf1e2;

  /* Secondary — XANH LÁ (màu phụ chính thức). Website chỉ dùng 2 màu: CAM + XANH LÁ.
     Trả về xanh lá sau khi thử xanh dương — người dùng chốt "thống nhất 2 màu thôi".
     Dùng cho: chữ phụ, viền, nền hero/form (section có ảnh, chữ trắng đè lên). */
  --forest-900: #0c3b22;  /* xanh lá đậm — nền hero/form (dưới ảnh) */
  --forest-800: #10502e;
  --forest-700: #14663a;  /* xanh lá đậm cho chữ/nhãn */
  --forest-600: #188148;
  --forest-500: #1c9c57;
  --forest-400: #3db878;

  /* ---- PANEL nền XANH LÁ NHẠT (gần như trắng) ----
     Dùng cho các section KHÔNG có ảnh: quy trình, tầm nhìn, CTA, dải footer-cta.
     Chữ trên nền này là XANH LÁ đậm (--panel-ink). Header/footer KHÔNG dùng bộ này. */
  --panel-grad:      linear-gradient(120deg, #ffffff 0%, #f2f9f4 45%, #dcefe3 100%); /* TRẮNG → xanh lá rất nhạt */
  --panel-grad-soft: linear-gradient(120deg, #ffffff 0%, #f2f9f4 100%);              /* nhạt hơn cho card */
  --panel-ink:       #14663a;  /* xanh lá đậm — tiêu đề trên nền nhạt */
  --panel-ink-soft:  #3a6b50;  /* xanh lá vừa — mô tả/phụ */
  --panel-eyebrow:   #c2751a;  /* cam đậm cho nhãn nhỏ trên nền nhạt (đọc rõ hơn cam sáng) */

  /* Dòng phụ dưới logo "An toàn · Sức khỏe · Môi trường" — xanh lá đậm. */
  --brand-tag-green: #14663a;

  /* Tương thích cũ — teal trỏ về xanh lá */
  --teal-700: #14663a;
  --teal-600: #188148;
  --teal-500: #1c9c57;
  --teal-400: #3db878;

  /* Accent nhạt — xanh lá mint nhạt */
  --mint-400: #6cd39c;
  --mint-300: #a8e6c3;
  --mint-200: #cdf2dd;
  --mint-100: #e7f9ee;

  /* Neutrals — trắng ám ấm nhẹ + mực */
  --bg-0: #ffffff;   /* trắng thật — section sáng */
  --bg-1: #f3f0e9;   /* kem rõ hơn — section xen kẽ, tương phản thấy được với bg-0 */
  --bg-2: #eae6dc;
  --ink-900: #201c14;
  --ink-700: #454034;
  --ink-500: #6e685a;
  --ink-300: #a29b8c;
  --line: #e6e2d8;

  /* Semantic */
  --success: #1c9c57;
  --warning: #d07f24;
  --danger: #b3402f;
  --info: #188148;

  /* Aliases */
  --brand-primary: var(--orange-500);
  --brand-primary-hover: var(--orange-600);
  --brand-primary-active: var(--orange-700);
  --brand-accent: var(--forest-600);
  --brand-mint: var(--mint-200);
  --surface-page: var(--bg-0);
  --surface-section: var(--bg-1);
  --surface-card: #ffffff;
  --surface-inverse: var(--forest-900);
  --text-heading: var(--ink-900);
  --text-body: var(--ink-700);
  --text-muted: var(--ink-500);
  --text-on-brand: #ffffff;
  --text-inverse: #e9f2ec;
  --border-default: var(--line);

  /* Glassmorphism (navbar, overlays) */
  --glass-bg: rgba(253, 252, 250, 0.72);
  --glass-border: rgba(32, 28, 20, 0.08);
  --glass-blur: 16px;

  --focus-ring: 0 0 0 3px rgba(231, 148, 57, 0.32);

  /* ---- Header & Footer (đổi được qua Cài đặt NVE → Màu sắc) ----
     Gom màu topbar/navbar/footer vào biến riêng để đổi một chỗ, đồng bộ cả
     nền lẫn chữ. Giá trị mặc định = bản phối "cam chủ đạo": topbar cam,
     footer nền sáng chữ tối. */
  /* ---- Header: TRẮNG SẠCH, cam chỉ làm điểm nhấn ----
     Mini-bar xám rất nhạt, navbar trắng mờ trôi trên hero. Không nền tối. */
  --topbar-bg: var(--orange-500);          /* nền cam — GIỮ NGUYÊN */
  --topbar-text: #ffffff;                  /* chữ TRẮNG trên nền cam cho nổi bật */

  --navbar-bg: rgba(255, 255, 255, 0.82);  /* trắng mờ, thấy hero mờ qua */
  --navbar-bg-solid: #ffffff;              /* khi cuộn xuống: trắng đặc */
  --navbar-text: #201c14;                  /* chữ gần đen ấm */
  --navbar-border: rgba(32, 28, 20, 0.08);

  /* ---- Footer: xám kem nhạt, cùng tông với thân trang (KHÔNG đen) ---- */
  --footer-bg: #f4f2ec;                 /* xám kem nhạt */
  --footer-text: #454034;               /* chữ xám đậm ấm, đọc rõ */
  --footer-heading: #201c14;            /* tiêu đề: gần đen ấm */
  --footer-muted: #8a8272;              /* chữ phụ */
  --footer-border: rgba(32, 28, 20, 0.1);
}