:root {
  --primary-font: "Roboto", sans-serif;

  --font-regular: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 800;

  /* Global */
  --radius-4: 0.25rem;
  --radius-8: 0.5rem;
  --radius-12: 0.75rem;
  --radius-16: 1rem;

  --global-spacing: -0.0625rem; /* -1 */
  --global-shadow: 0 0.5rem 1.5rem #00000014;
  --global-transition: all 0.18s ease-in;
  --global-overlay: #00000050;
  --global-overlay--medium: #00000092;

  /* Colors - Brands */
  --primary-color: #DA0069;
  --primary-color-dark: #9A004A;
  --primary-blue: #8695CA;
  --primary-beige: #E6BCAA;

  /* Colors - Grayscale */
  --gray-100-color: #F2F2F2;
  --gray-200-color: #E6E6E6;
  --gray-600-color: #BFBFBF;
  --gray-800-color: #808080;
  --gray-900-color: #404040;
  --black-color: #000000;
}