:root {
  --font-primary: "Roboto", Arial, sans-serif;
  --font-heading: "Roboto", Arial, sans-serif;

  --navy-950: #153f78;
  --navy-900: #1d4f8f;
  --indigo: #315fa8;
  --blue: #2478b9;
  --cyan: #2aa9d6;
  --gold: #ffcc00;
  --gold-deep: #a96f00;
  --ink: #203451;
  --muted: #657991;
  --line: #d7e7f4;
  --soft: #f5faff;
  --white: #fff;
  --green: #138a5b;
  --danger: #b23b45;

  --brand-cyan: #22a6d5;

  --brand-gold: #ffc400;
  --brand-gold-hover: #eeb700;

  --surface-white: #ffffff;
  --surface-blue: #eef8fc;
  --surface-blue-strong: #dff2fa;

  --text-primary: #18365f;
  --text-secondary: #60758f;

  /* Màu thương hiệu chính */
  --brand-blue: #2387b3;

  /* Hover hoặc vùng cần xanh đậm hơn */
  --brand-blue-dark: #176b96;

  /* Tiêu đề */
  --brand-navy: #123d6b;

  /* Nền xanh nhạt duy nhất */
  --brand-surface: #f1f8fc;

  /* Chữ mô tả */
  --brand-muted: #60758a;

  /* Viền */
  --brand-border: #d4e5ee;

  /* CTA duy nhất */
  --brand-yellow: #f5c542;

  --brand-yellow-hover: #eab72f;

  --border-light: #cfe4ef;
  --shadow-soft: 0 18px 50px rgba(25, 76, 123, .09);
  --radius: 18px;
  --container-max-width: 1240px;
}