body {
  --color-background: #f8f8ff;
  --color-text: #363636;

  --color-primary: #4c99fd;
  --color-secondary: #dc4d41;
  --color-tertiary: #0D1321;

  --color-background-secondary: #d8e9ff;
  
  --color-navbar-text: var(--color-primary);
  --color-ghost-background: var(--color-primary);
  --color-link-hover:var(--color-primary);

  --color-h1-title: var(--color-secondary);
  
  --color-link: var(--color-tertiary);
  --color-navbar-hover-text: var(--color-tertiary);
}

@media (prefers-color-scheme: dark) {
  body {
    --color-background: #080b22;
    --color-text: #dfdfdf;

    --color-primary: #457ec9;
    --color-secondary: #F7ECE1;
    --color-tertiary: #9BC4BC;

    --color-background-secondary: #14224e;
  }
}