:root {
  /* Colors */
  --color-white: #ffffff;
  --color-beige: #f7f6f2;
  --color-black-100: #1d1d1f;
  --color-black-200: #313131;
  --color-black-300: #838383;
  --color-blue-100: #7aaff0;
  --color-blue-200: #409ceb;
  --color-blue-300: #46bee2;
  --color-blue-400: #282e37;
  --color-gray-100: #f5f5f5;
  --color-gray-200: #ebebeb;

  /* Colors: rgb */
  --color-rgb-black-100: 29, 29, 31;

  /* Font colors */
  /* --color-text: var(--color-black-200); */
  --color-text: #191a1b;
  --color-link: var(--color-blue-200);
  --color-text-gray: var(--color-black-300);

  /* Font sizes */
  --font-h1: 4rem;
  --font-h1-mobile: 2.5rem;
  --font-h2: 1.75rem;
  --font-h3: 1.5rem;
  /*--font-text: 1.05rem;*/
  --font-text: 1.35rem;
  --font-small: 1rem;

  /* Font family */
  --font-family-system: -apple-system, BlinkMacSystemFont, Aptos, Roboto, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

  /* Spaces: for padding, margins, and gaps */
  --space-xxs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1.5rem;
  --space-md: 2.5rem;
  --space-lg: 3rem;
  --space-xl: 4rem;
  --space-xxl: 5rem;

  /* Borders */
  --border-color: var(--color-gray-200);
  --border-width: 1px;
  --border-radius-sm: 0.125rem;
  --border-radius: 0.25rem;
  --border-radius-lg: 2.25rem;

  /* Transitions */
  --transition-scale-up: 1.025;
  --transition-speed: 150ms;
  --transition-curve: ease-in;

  /* Specifics */
  --nav-height: 4.5em;
}