/* =========================================================
   CSS VARIABLES - COLORS & GRADIENTS
   ========================================================= */
:root {
  /* HEX Colors */
  --royal-blue-hex: #2563ebff;
  --ink-black-hex: #0b1220ff;
  --platinum-hex: #e5e7ebff;
  --prussian-blue-hex: #121a2bff;
  --electric-red-hex: #ff2d20ff;

  /* HSL Colors */
  --royal-blue-hsl: hsla(221, 83%, 53%, 1);
  --ink-black-hsl: hsla(220, 49%, 8%, 1);
  --platinum-hsl: hsla(220, 13%, 91%, 1);
  --prussian-blue-hsl: hsla(221, 41%, 12%, 1);
  --electric-red-hsl: hsla(3, 100%, 56%, 1);

  /* RGB Colors */
  --royal-blue-rgb: rgba(37, 99, 235, 1);
  --ink-black-rgb: rgba(11, 18, 32, 1);
  --platinum-rgb: rgba(229, 231, 235, 1);
  --prussian-blue-rgb: rgba(18, 26, 43, 1);
  --electric-red-rgb: rgba(255, 45, 32, 1);

  /* Gradients */
  --gradient-top: linear-gradient(0deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-right: linear-gradient(90deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-bottom: linear-gradient(180deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-left: linear-gradient(270deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-top-right: linear-gradient(45deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-bottom-right: linear-gradient(135deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-top-left: linear-gradient(225deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-bottom-left: linear-gradient(315deg, #2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
  --gradient-radial: radial-gradient(#2563ebff, #0b1220ff, #e5e7ebff, #121a2bff, #ff2d20ff);
}