/* ==========================================================================
   NAM NGUYỄN TECH — Design Tokens
   Toàn bộ màu sắc, khoảng cách, bo góc, đổ bóng phải khai báo tại đây.
   Không hard-code giá trị màu ở các file CSS khác.
   ========================================================================== */

:root {
  /* Colors */
  --primary: #1F4E79;        /* Navy Blue — thương hiệu chính */
  --primary-dark: #0F2747;   /* Navy tối — hero, footer, dark sections */
  --primary-soft: #E8EFF6;   /* Navy rất nhạt — nền badge, hover nhẹ */
  --accent: #2E6FA3;         /* Accent tiết chế — link hover, focus */

  --text: #172033;           /* Chữ chính */
  --text-muted: #64748B;     /* Chữ phụ / mô tả */
  --text-inverse: #F7F9FC;   /* Chữ trên nền tối */

  --background: #F7F9FC;     /* Nền trang */
  --surface: #FFFFFF;        /* Nền card / block */
  --border: #E2E8F0;         /* Đường viền nhẹ */

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  /* Shadow */
  --shadow-sm: 0 1px 2px rgba(15, 39, 71, 0.06), 0 1px 1px rgba(15, 39, 71, 0.04);
  --shadow-md: 0 8px 24px rgba(15, 39, 71, 0.08);

  /* Layout */
  --container-width: 1180px;
  --section-spacing: 104px;
  --section-spacing-sm: 64px;

  /* Typography */
  --font-base: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Motion */
  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
}