/* ============================================================
   BLANC' homepage — Design tokens (scope .bl-home)
   Mỗi task sẽ dùng các biến này. Chỉnh ở 1 nơi -> đổi toàn trang.
   ============================================================ */

.bl-home {
  /* -- Font -- */
  --bl-font: 'EuclidCircularAVN', 'Manrope', sans-serif;
  /* font nhấn (phụ đề hero…) Figma dùng Fahkwang italic; chưa có thì fallback Euclid */
  --bl-font-accent: 'Fahkwang', 'EuclidCircularAVN', 'Manrope', serif;

  /* -- Type scale (fluid) -- chốt chính xác theo Figma ở từng task */
  --bl-fs-display: clamp(2.75rem, 1.6rem + 5vw, 5.5rem);
  --bl-fs-h2: clamp(1.75rem, 1.2rem + 2.2vw, 2.5rem);
  --bl-fs-h3: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  --bl-fs-lead: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
  --bl-fs-body: 1rem;
  --bl-fs-sm: 0.875rem;
  --bl-fs-xs: 0.75rem;
  --bl-lh-tight: 1.1;
  --bl-lh-base: 1.5;

  /* -- Màu -- cập nhật mã chính xác khi bạn cấp từ Figma */
  --bl-text: #232734;
  --bl-ink: #3D271A;       /* nâu đậm thương hiệu (nav, nút, chữ) */
  --bl-muted: #4f525d;
  --bl-accent: #b18979;
  --bl-accent-2: #c09972;
  --bl-gold: #bf9f83;
  --bl-rust: #b5532a;
  --bl-sale: #e0322d;
  --bl-surface: #ffffff;
  --bl-surface-2: #f5f5f5;
  --bl-cream: #fdfaf4;
  --bl-line: #e9e7e3;
  --bl-wood: #5a3a23;
  --bl-on-dark: #ffffff;

  /* -- Layout -- */
  --bl-maxw: 1470px;
  --bl-gap: clamp(10px, 0.6vw + 6px, 16px);
  --bl-radius: 8px;
  --bl-radius-lg: 14px;

  /* -- Spacing dọc -- */
  --bl-section-y: clamp(48px, 3vw + 32px, 96px);
  --bl-block-y: clamp(28px, 2vw + 16px, 48px);

  /* -- Motion -- */
  --bl-dur: 320ms;
  --bl-dur-fast: 180ms;
  --bl-ease: cubic-bezier(0.16, 1, 0.3, 1);
}