:root {
  scroll-behavior: smooth;
  font-size: 16px;
}

@media (min-width: 45rem) {
  :root {
    font-size: 18px;
  }
}

body {
  font-family:
    var(--font-agave-nerd),
    sans serif;

  background-color: var(--color-midnight-900);
  color: var(--color-periwinkle-100);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-agave-nerd);
  line-height: 1.15;
}

h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

h1 {
  font-size: var(--heading-h1-size);
  margin-bottom: var(--space-8);
  font-weight: bold;
  /*font-variant: small-caps;*/
  text-transform: capitalize;
}

h2 {
  font-size: var(--heading-h2-size);
  margin-bottom: var(--space-5);
}

h3 {
  font-size: var(--heading-h3-size);
  margin-bottom: var(--space-4);
}

h4 {
  font-size: var(--heading-h4-size);
  margin-bottom: var(--space-3);
}

h5 {
  font-size: var(--heading-h5-size);
  margin-bottom: var(--space-2);
}

h6 {
  font-size: var(--heading-h6-size);
}

code {
  font-family: var(--font-agave-nerd-monospace), monospace !important;
}

strong {
  background-color: var(--color-blue-sky);
  border-bottom-left-radius: var(--space-1);
  border-top-right-radius: var(--space-1);
  box-decoration-break: clone;
  color: var(--color-midnight-950);
  font-family: var(--font-agave-nerd-monospace);
  font-weight: bold;
  margin-bottom: var(--space-1);
  padding: var(--space-1);
}

em {
  margin-bottom: var(--space-1);
  font-style: italic;
  font-weight: lighter;
  color: var(--color-green-moss);
}

li {
  margin: var(--space-1) 0;
}