:root {
  /* ── Brand Colors ── */
  --primary: #002058;
  --primary-dark: #0d3a6e;
  --primary-light: #2a6bc4;
  --secondary: #39a653;
  --sun: #f7b500;

  /* ── Neutrals ── */
  --white: #ffffff;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-400: #9ca3af;
  --gray-600: #4b5563;

  /* ── Accent (gradient) ── */
  --blue-600: #2563eb;
  --purple-600: #9333ea;
  --gradient: linear-gradient(to right, var(--blue-600), var(--purple-600));

  /* ── Typography ── */
  --font-family: "Noto Sans", sans-serif;
  --font-size-base: 14px;
  --line-height-basez: 1.6;

  --color-text: var(--primary);
  --color-text-light: #000000cc;

  /* ── Layout ── */
  --max-width: 1390px;
  --px: 64px;
  --header-height: 80px;
  --radius: 10px;

  /* ── Shadows ── */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.3);

  /* ── Transitions ── */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
}