/* Design token sinh từ Figma "Foundation" (node 40:15) + Figma variables.
   Xem spec mục 3. Không sửa giá trị ở đây mà không cập nhật spec. */

@import url("/fonts/be-vietnam-pro.css");
@import url("/fonts/playfair-display.css");
@import url("/fonts/dfvn-migra.css");

:root {
    /* ---- Màu ---- */
    --brand-1: #B5935E;
    --brand-2: #F0E8D7;
    /* Đo trên bản present (node 4029:42782): chữ trong thẻ chủ đề và nhãn "Nội dung
       đặc biệt" là #BE6B62 — hồng đất, KHÔNG phải --status-error (#AF2234) đỏ gắt.
       Đây chính là mắt xích còn thiếu giải thích vì sao dãy brand nhảy từ 2 sang 4. */
    --brand-3: #BE6B62;
    --brand-4: #412E1E;
    --brand-alt: #AA8656;
    --bg-soft: #E5D9CB;
    --text-primary: #1C1C1C;
    --text-secondary: #3C3C3C;
    --border-default: #BFBFBF;
    --status-error: #AF2234;
    --status-success: #47CA00;

    --surface-paper: #FBF7EF;
    --on-dark: #F0E8D7;

    /* ---- Font ----
       Tiêu đề dùng "DFVN Migra" đúng như Figma — khách gửi file 04/09/2026, xem
       /fonts/dfvn-migra.css. Playfair Display giữ lại làm lớp đỡ phía sau cho tới
       khi trang chạy thật ổn định; nó là font tạm suốt quá trình dựng nên vẫn hữu
       ích nếu Migra tải lỗi. */
    --font-display: "DFVN Migra", "Playfair Display", Georgia, serif;
    --font-body: "Be Vietnam Pro", "Be Vietnam", system-ui, sans-serif;

    /* ---- Spacing scale ---- */
    --sp-4: 4px;
    --sp-8: 8px;
    --sp-12: 12px;
    --sp-16: 16px;
    --sp-20: 20px;
    --sp-40: 40px;
    --sp-80: 80px;
    --sp-120: 120px;

    /* ---- Radius ---- */
    --r-sm: 4px;
    --r-md: 8px;
    --r-lg: 16px;
    --r-full: 20px;

    /* ---- Icon ---- */
    --icon-sm: 16px;
    --icon-md: 20px;
    --icon-lg: 28px;
    --icon-stroke: 1.5px;

    /* ---- Bề rộng nội dung ---- */
    --container: 1440px;
    --gutter: var(--sp-80);
}