body { margin: 0; }

:root {
  /* fonts */
  --font-inter: "Inter";
  --font-poppins: "Poppins";

  /* font sizes */
  --font-size-xs: 12px;
  --font-size-s: 14px;
  --font-size-m: 18px;
  --font-size-l: 20px;
  --font-size-xl: 24px;
  --font-size-2xl: 28px;
  --font-size-3xl: 32px;
  --font-size-4xl: 36px;
  --font-size-5xl: 40px;
  --font-size-6xl: 48px;
  --font-size-7xl: 56px;

  /* font weight */
  --font-regular: 200;
  --font-semibold: 400;
  --font-bold: 600;

  /* Colors */
  --color-white: #fff;
  --color-whitesmoke: #f3f3f3;
  --color-gray: #E1E1E1;
  --color-gray-800: #1A202C;
  --color-light-gray: #E2E8F0;
  --color-black: #222222;
  --color-purple: #F2F6FF;
  --color-navy: #2D699B;
  --color-dark-navy: #27447F;
  --color-red: #D93615;
  E2E8F0
}