:root {

  --rgb-black: 0, 0, 0;
  --rgb-blue: 0, 100, 230;
  --rgb-blue-dark: 0, 55, 115;
  --rgb-blue-darker: 0, 40, 218;
  --rgb-blue-light: 194, 246, 255;
  --rgb-blue-lighter: 242, 247, 254;
  --rgb-green: 0, 177, 50;
  --rgb-green-dark: 0, 159, 18;
  --rgb-grey: 52, 70, 86;
  --rgb-grey-dark: 15, 33, 50;
  --rgb-grey-light: 100, 127, 148;
  --rgb-grey-lighter: 244, 246, 247;
  --rgb-white: 255, 255, 255;

  --color-black: rgb(var(--rgb-black));
  --color-blue: rgb(var(--rgb-blue));
  --color-blue-dark: rgb(var(--rgb-blue-dark));
  --color-blue-darker: rgb(var(--rgb-blue-darker));
  --color-blue-light: rgb(var(--rgb-blue-light));
  --color-blue-lighter: rgb(var(--rgb-blue-lighter));
  --color-green: rgb(var(--rgb-green));
  --color-green-dark: rgb(var(--rgb-green-dark));
  --color-grey: rgb(var(--rgb-grey));
  --color-grey-dark: rgb(var(--rgb-grey-dark));
  --color-grey-light: rgb(var(--rgb-grey-light));
  --color-grey-lighter: rgb(var(--rgb-grey-lighter));
  --color-white: rgb(var(--rgb-white));

  --font-family-family: 'Family', Serif;
  --font-family-inter: 'Inter', Sans-Serif;
  --font-family-inter-display: 'Inter Display', Sans-Serif;
  --font-family-cascadia: 'Cascadia Code', Monospace;

  --font-size: clamp(1.375rem, 2.225vw, 2rem);

  --letter-spacing: -0.0015em;

  --line-height: 1.3;

  --transition: 0.15s cubic-bezier(0.33, 1, 0.68, 1);

}