/* Colors */
:root {
    --color-primary-25: hsla(240, 100%, 99%, 1);
    --color-primary-50: hsla(240, 100%, 95%, 1);
    --color-primary-100: hsla(240, 100%, 91%, 1);
    --color-primary-200: hsla(240, 100%, 87%, 1);
    --color-primary-300: hsla(240, 100%, 83%, 1);
    --color-primary-400: hsla(240, 100%, 76%, 1);
    --color-primary-500: hsla(240, 100%, 68%, 1);
    --color-primary-600: hsla(240, 100%, 60%, 1);
    --color-primary-700: hsla(240, 75%, 52%, 1);
    --color-primary-800: hsla(240, 73%, 45%, 1);
    --color-primary-900: hsla(240, 86%, 29%, 1);
    --color-primary-950: hsla(240, 100%, 21%, 1);
  
    --color-warning-25: hsla(44, 100%, 98%, 1);
    --color-warning-50: hsla(44, 100%, 96%, 1);
    --color-warning-100: hsla(44, 98%, 89%, 1);
    --color-warning-200: hsla(44, 99%, 77%, 1);
    --color-warning-300: hsla(42, 99%, 65%, 1);
    --color-warning-400: hsla(39, 98%, 56%, 1);
    --color-warning-500: hsla(34, 94%, 50%, 1);
    --color-warning-600: hsla(28, 97%, 44%, 1);
    --color-warning-700: hsla(22, 92%, 37%, 1);
    --color-warning-800: hsla(19, 84%, 31%, 1);
    --color-warning-900: hsla(18, 80%, 26%, 1);
  
    --color-gray-25: hsla(0, 0%, 99%, 1);
    --color-gray-50: hsla(0, 0%, 98%, 1);
    --color-gray-100: hsla(0, 0%, 96%, 1);
    --color-gray-200: hsla(220, 5%, 92%, 1);
    --color-gray-300: hsla(220, 6%, 85%, 1);
    --color-gray-400: hsla(220, 6%, 66%, 1);
    --color-gray-500: hsla(220, 6%, 47%, 1);
    --color-gray-600: hsla(220, 8%, 35%, 1);
    --color-gray-700: hsla(220, 11%, 29%, 1);
    --color-gray-800: hsla(220, 20%, 18%, 1);
    --color-gray-900: hsla(220, 24%, 12%, 1);
  
    --color-white-100: hsla(0, 0%, 100%, 1);

    --color-success-25: hsla(144, 83%, 98%, 1);
    --color-success-50: hsla(144, 83%, 96%, 1);
    --color-success-100: hsla(140, 75%, 92%, 1);
    --color-success-200: hsla(144, 68%, 80%, 1);
    --color-success-300: hsla(148, 63%, 67%, 1);
    --color-success-400: hsla(150, 57%, 54%, 1);
    --color-success-500: hsla(152, 77%, 39%, 1);
    --color-success-600: hsla(153, 91%, 30%, 1);
    --color-success-700: hsla(154, 91%, 25%, 1);
    --color-success-800: hsla(155, 84%, 20%, 1);
    --color-success-900: hsla(156, 83%, 16%, 1);
  
    --color-red-25: hsla(4, 88%, 99%, 1);
    --color-red-50: hsla(4, 88%, 97%, 1);
    --color-red-100: hsla(4, 95%, 94%, 1);
    --color-red-200: hsla(4, 98%, 89%, 1);
    --color-red-300: hsla(4, 96%, 80%, 1);
    --color-red-400: hsla(4, 93%, 69%, 1);
    --color-red-500: hsla(4, 86%, 58%, 1);
    --color-red-600: hsla(4, 74%, 49%, 1);
    --color-red-700: hsla(4, 76%, 40%, 1);
    --color-red-800: hsla(4, 72%, 33%, 1);
    --color-red-900: hsla(8, 65%, 29%, 1);
  
    /* Weights */
    --font-weight-1: 400;
    --font-weight-2: 500;
    --font-weight-3: 600;
    --font-weight-4: 700;
  
    /* Sizes */
    --font-size-1: 0.75rem; /* 12px */
    --font-size-2: 0.875rem; /* 14px */
    --font-size-3: 1rem; /* 16px */
    --font-size-4: 1.125rem; /* 18px */
    --font-size-5: 1.25rem; /* 20px */
    --font-size-6: 1.5rem; /* 24px */
    --font-size-7: 1.875rem; /* 30px */
    --font-size-8: 2.25rem; /* 36px */
    --font-size-9: 3rem; /* 48px */
    --font-size-10: 3.75rem; /* 60px */
  }