@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/ibm-plex-sans-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/source-sans-3-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/source-sans-3-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

:root {
  --font-heading: "IBM Plex Sans", Arial, sans-serif;
  --font-body: "Source Sans 3", Arial, sans-serif;

  --ink-950: #071321;
  --ink-900: #0b1b2d;
  --ink-800: #142b44;
  --ink-700: #29445e;
  --ink-600: #4a6277;
  --ink-500: #5d7285;
  --ink-300: #aab7c2;
  --ink-200: #ccd4db;
  --ink-150: #dde3e8;
  --ink-100: #e9edf0;
  --ink-050: #f5f7f8;
  --white: #ffffff;
  --accent-700: #075ed8;
  --accent-600: #0875ef;
  --accent-500: #1687ff;
  --accent-100: #dceeff;
  --accent-050: #eef7ff;
  --success-700: #23633e;
  --success-050: #eef8f1;
  --danger-700: #9d2b25;
  --danger-050: #fff1f0;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-28: 7rem;
  --space-32: 8rem;

  --container: 76rem;
  --container-narrow: 58rem;
  --page-gutter: clamp(1.25rem, 3.6vw, 4rem);
  --section-space: clamp(5rem, 10vw, 9rem);
  --radius-sm: 2px;
  --radius-md: 4px;
  --shadow-dialog: 0 32px 90px rgba(7, 19, 33, 0.22);
  --line: 1px solid var(--ink-150);
  --transition: 180ms ease;
}