:root {
  /* Brand Colors — extracted from logo */
  --navy:       #0d2a5e;
  --navy-dark:  #081a3d;
  --blue:       #1565c0;
  --blue-mid:   #1976d2;
  --blue-light: #2196f3;
  --blue-sky:   #42a5f5;
  --green:      #2e7d32;
  --green-light:#43a047;
  --white:      #ffffff;
  --off-white:  #f4f7fb;
  --gray-light: #e8eef6;
  --gray:       #94a3b8;
  --gray-dark:  #475569;
  --text:       #1e293b;
  --text-muted: #64748b;

  /* Gradients */
  --grad-hero:   linear-gradient(135deg, #0d2a5e 0%, #1565c0 50%, #2196f3 100%);
  --grad-card:   linear-gradient(145deg, #ffffff 0%, #f4f7fb 100%);
  --grad-green:  linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
  --grad-accent: linear-gradient(135deg, #1565c0 0%, #42a5f5 100%);
  --grad-navy:   linear-gradient(180deg, #0d2a5e 0%, #081a3d 100%);

  /* Shadows */
  --shadow-sm:  0 2px 8px rgba(13,42,94,0.08);
  --shadow-md:  0 4px 20px rgba(13,42,94,0.14);
  --shadow-lg:  0 8px 40px rgba(13,42,94,0.18);
  --shadow-xl:  0 16px 60px rgba(13,42,94,0.22);

  /* Spacing */
  --section-pad: 80px 0;
  --container:   1200px;

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;

  /* Transitions */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --trans: 0.3s var(--ease);
}