:root {
  --color-red: #ed2939;
  --color-blue: #1d3c61;
  --color-blue-light: #679cdd;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray-light: #e0e0e0;
  --color-gray-medium: #c1c1c1;
  --color-gray-dark: #333333;
  --footer-bg-color: rgba(29, 60, 97, 0.7);
  --footer-border-color: rgba(255, 255, 255, 0.1);
  --footer-text-light: #c1c1c1;
}

body {
  margin: 0;
  color: var(--color-white); /* Default text color */
  background-color: var(--color-black); /* Default background */
  min-height: 100vh; /* Ensures body takes full viewport height */
  overflow-x: hidden; /* Prevents horizontal scroll */
  display: flex; /* Enables flexbox for overall layout */
  flex-direction: column; /* Stacks content vertically */
  font-family: 'Open Sans', 'Outfit', Arial, sans-serif; /* Prioritize Google Fonts with fallbacks */
  /* Added a gradient background for glassmorphism effect */
  background: linear-gradient(135deg, var(--color-black) 0%, var(--color-blue) 100%);
}