/* AgriConnect — landing design tokens. Dùng chung cho mọi trang marketing công khai
   (Trang chủ, Nguồn cung, Giải pháp, Bảng giá). Không đụng biến/scope của app đã đăng nhập.

   Bảng màu lấy từ chính bộ ảnh thương hiệu: xanh lá đậm của logo AgriConnect trên áo/thùng hàng,
   cam của pin bản đồ "vùng đang chọn", xanh navy của khối Chính quyền trong infographic, và nền
   giấy xanh nhạt thay cho trắng tinh để ảnh chụp ngoài trời không bị chói viền. */
:root {
    /* --- Xanh lá thương hiệu (đậm hơn emerald cũ để khớp logo in trên ảnh) --- */
    --ac-primary: #157A45;
    --ac-primary-dark: #0B4E2C;
    --ac-primary-light: #2FA060;
    --ac-primary-soft: #DCEEE2;

    /* --- Nền --- */
    --ac-bg-mint: #F2F7F2;
    --ac-bg-mint-2: #E4F0E7;
    --ac-white: #ffffff;

    /* --- Chữ --- */
    --ac-ink: #0E2A1E;
    --ac-ink-soft: #2C4739;
    --ac-muted: #5E7268;
    --ac-border: #DFE9E1;
    --ac-border-strong: #C4D8CB;

    /* --- Màu ngữ nghĩa --- */
    --ac-accent: #E07B15; /* cam thu hoạch — pin "vùng đang chọn", nhãn nổi bật */
    --ac-accent-soft: #FDF0E0;
    --ac-official: #1E3A6E; /* navy — chỉ dùng cho ngữ cảnh chính quyền/xác thực */
    --ac-official-soft: #E8EEF8;
    --ac-warn: #B7791F;
    --ac-info: #1E3A6E;
    --ac-danger: #B42318;

    /* --- Hình khối --- */
    --ac-radius-sm: 10px;
    --ac-radius: 16px;
    --ac-radius-lg: 24px;
    --ac-radius-pill: 999px;
    --ac-shadow-sm: 0 1px 2px rgba(14, 42, 30, .06), 0 2px 8px rgba(14, 42, 30, .04);
    --ac-shadow: 0 2px 4px rgba(14, 42, 30, .05), 0 8px 24px rgba(14, 42, 30, .07);
    --ac-shadow-md: 0 4px 8px rgba(14, 42, 30, .06), 0 18px 44px rgba(14, 42, 30, .12);
    --ac-shadow-lg: 0 8px 16px rgba(14, 42, 30, .08), 0 32px 72px rgba(14, 42, 30, .16);

    /* --- Khung --- */
    --ac-container: 1200px;
    --ac-gutter: 24px;

    /* --- Chữ: một họ Inter duy nhất, phân cấp bằng cỡ + trọng lượng.
           Inter phủ đủ dấu tiếng Việt (Blogger Sans thì không — ồ/ệ/ẩ bị rơi font). --- */
    --ac-font: 'InterAC', 'Segoe UI', Roboto, Arial, sans-serif;

    --ac-text-display: clamp(2.125rem, 1.35rem + 2.6vw, 3.5rem); /* 34 → 56 */
    --ac-text-h2: clamp(1.5rem, 1.15rem + 1.2vw, 2rem); /* 24 → 32 */
    --ac-text-h3: 1.1875rem; /* 19 */
    --ac-text-lead: 1.0625rem; /* 17 */
    --ac-text-body: 0.9375rem; /* 15 */
    --ac-text-meta: 0.8125rem; /* 13 */
    --ac-text-micro: 0.75rem; /* 12 */
}