/*!
 * ============================================================================
 *  NML TOKENS · nml-tokens.css
 *  SINGLE SOURCE OF TRUTH — design tokens (web)
 *  Think Right. Move Right. Grow Fast.
 * ----------------------------------------------------------------------------
 *  Mọi plugin enqueue file này (handle: nml-ds) làm dependency và KHÔNG tự khai
 *  :root/token nữa. Tên token theo nml-ds.css (tên ngắn).
 * ============================================================================ */
:root{
  /* ── COLOR ── */
  --nml-blue:#2F6BFF; --nml-blue-dark:#1A56E8; --nml-blue-soft:#EEF3FF;
  --nml-green:#22C55E; --nml-green-dark:#16A34A; --nml-green-soft:#EDFBF3;
  --nml-amber:#F59E0B; --nml-amber-dark:#92400E; --nml-danger:#DC2626;
  --nml-tx:#0F172A; --nml-tx2:#475569; --nml-tx3:#94A3B8;
  --nml-bg:#F8FAFC; --nml-surface:#FFFFFF; --nml-border:#E2E8F0; --nml-navy:#0E1A2F;

  /* ── SUB-BRAND (accent only: badge/icon/header/category border) ── */
  --nml-brand:#3B0764; --nml-trade:#1E2D40; --nml-sales:#0F766E; --nml-ecom:#A0522D;
  --nml-strat:#2F6BFF; --nml-ai:#2F6BFF;

  /* ── GLASS ── */
  --nml-glass-hero-bg:rgba(255,255,255,.60);
  --nml-glass-support-bg:rgba(255,255,255,.70);
  --nml-glass-tint-bg:rgba(47,107,255,.06);
  --nml-glass-tint-border:rgba(47,107,255,.12);
  --nml-glass-border:rgba(255,255,255,.80);
  --nml-glass-specular:rgba(255,255,255,.90);

  /* ── TYPOGRAPHY ── */
  --nml-font:'Plus Jakarta Sans',system-ui,sans-serif;
  --nml-mono:'JetBrains Mono',ui-monospace,monospace;   /* KPI numbers only */
  --nml-fw-regular:400; --nml-fw-medium:500; --nml-fw-semibold:600; --nml-fw-bold:700;

 /* ── TYPE SCALE (responsive, clamp tự co — khỏi media query) ── */
--nml-text-display: clamp(36px, 6vw, 56px);
--nml-text-h1:      clamp(28px, 5vw, 40px);
--nml-text-h2:      clamp(22px, 3.5vw, 28px);
--nml-text-h3:      clamp(18px, 2vw, 20px);
--nml-text-body:    clamp(15px, 1.5vw, 16px);
--nml-text-caption: 12px;
--nml-text-overline: 11px;   /* nhãn micro: sb-lbl, mo-grp, card-category, toc-label */
--nml-text-kpi:     clamp(34px, 5vw, 48px);

/* Giá trị mốc rời (nếu cần ép cứng ở component thay vì clamp) */
--nml-text-display-min: 36px; --nml-text-display-max: 56px;
--nml-text-h1-min: 28px;      --nml-text-h1-max: 40px;
--nml-text-h2-min: 22px;      --nml-text-h2-max: 28px;
--nml-text-h3-min: 18px;      --nml-text-h3-max: 20px;
--nml-text-body-min: 15px;    --nml-text-body-max: 16px;
  /* ── RADIUS ── */
  --nml-r-xs:6px; --nml-r-sm:10px; --nml-r-md:14px; --nml-r-lg:20px; --nml-r-xl:28px;
  --nml-r-pill:999px; --nml-r-full:50%;

  /* ── SPACING (8px base) ── */
  --nml-s1:4px; --nml-s2:8px; --nml-s3:12px; --nml-s4:16px; --nml-s5:24px; --nml-s6:32px; --nml-s7:48px; --nml-s8:64px;

  /* ── SHADOW ── */
  --nml-sh-sm:0 2px 8px rgba(15,23,42,.06);
  --nml-sh-md:0 10px 28px -16px rgba(15,23,42,.18);
  --nml-sh-lg:0 26px 56px -30px rgba(47,107,255,.3),0 8px 20px -14px rgba(15,23,42,.1);
  --nml-sh-glass:inset 0 1px 0 rgba(255,255,255,.95),0 26px 56px -30px rgba(47,107,255,.3),0 8px 20px -14px rgba(15,23,42,.1);

  /* ── MOTION ── */
  --nml-dur-fast:150ms; --nml-dur-base:250ms; --nml-dur-enter:400ms; --nml-dur-page:600ms;
  --nml-ease-out:cubic-bezier(0,0,.2,1);
  --nml-ease-in-out:cubic-bezier(.4,0,.2,1);
  --nml-ease-spring:cubic-bezier(.34,1.56,.64,1);
  --nml-ease-linear:linear;

  /* ── LAYOUT ── */
  --nml-max-width:1280px; --nml-grid-gutter:24px;
}