/* Page color on the document itself, so any space outside the page
   wrappers (e.g. the room left for the mobile floating button) matches */
html {
  background-color: #f4fbfe; /* = --color-aliceblue */
}
body {
  margin: 0;
  line-height: normal;
  font-family: var(--Body);
}

:root {
  /* Figma Variables */

  /* Spacing */
  --4: 0.25rem;
  --12: 0.75rem;
  --14: 0.875rem;
  --16: 1rem;
  --20: 1.25rem;
  --22: 1.375rem;
  --32: 2rem;
  --36: 2.25rem;
  --48: 3rem;
  --60: 3.75rem;
  --120: 7.5rem;
  --208-16px: 1.3rem;
  --224-16px: 1.4rem;
  --26-20px: 1.625rem;
  --308-22px: 1.925rem;
  --breakdown: 90rem;
  --Gutter: 2rem;
  --Hero-pad-left: 12.937rem;
  --Hero-title: 2.875rem;
  --Margin: 6rem;
  --titles-md: 1.75rem;

  /* Font */
  /* System sans-serif fallbacks: shown while the web fonts load (never the browser's serif) */
  --Body: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --Headlines: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* Color */
  --Blue-dark: #0b5baa;
  --blue-grey: #57697c;
  --color-aliceblue: #f4fbfe;
  --color-slategray: rgba(87, 105, 124, 0.1);
  --mint: #0b9faa; /* About page banner */
  --white: #fff;

  /* Gap */
  --gap-10: 0.625rem;
  --gap-14: 0.875rem;
  --gap-20: 1.25rem;
  --gap-36: 2.25rem;
  --gap-40: 2.5rem;

  /* Padding */
  --padding-0: 0rem;
  --padding-4: 0.25rem;
  --padding-5: 0.312rem;
  --padding-10: 0.625rem;
  --padding-20: 1.25rem;
  --padding-26: 1.625rem;
  --padding-30: 1.875rem;
  --padding-40: 2.5rem;
  --padding-45: 2.812rem;
  --padding-60: 3.75rem;

  /* BorderRadius */
  --br-50: 50%;
  --br-100: 100px;

  /* Font */
  --font-inherit: inherit;

  /* FontSize */
  --fs-16: 1rem;
  --fs-19: 1.187rem;

  /* Shadows */
  --shadow-drop: 0px 0px 24px rgba(9, 128, 247, 0.1);
  --text-shadow-1: 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white), 0px 0px 24px var(--white);
  --text-shadow-2: 0px 0px 4px var(--white);
  --text-shadow-3: 0px 0px 10px var(--white);

  /* Gradients */
  --blue-cian: linear-gradient(90.35deg, var(--Blue-dark), #10a9ee);
  --gradient-1: linear-gradient(90.35deg, var(--Blue-dark), #10a9ee) border-box;

  /* WidthHeights */
  --height-18: 1.125rem;
  --height-21: 1.312rem;
  --height-34: 2.125rem;
  --height-11_7: 0.731rem;
  --width-19: 1.187rem;
  --width-34: 2.125rem;
  --width-170: 10.625rem;
  --width-11_7: 0.731rem;

  /* LineHeights */
  --lh-26: 1.625rem;
  --lh-20_8: 1.3rem;

  /* LetterSpacings */
  --ls--0_02: -0.02;
  --ls-0_2: 0.2;

  --left-48: 3rem;
  --left-calc50-9_5: calc(50% - 9.5px);
  --top-calc50-10_5: calc(50% - 10.5px);
}