@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Noto+Color+Emoji&family=Noto+Emoji:wght@300..700&family=Noto+Sans+Mono:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Outfit:wght@100..900&display=swap');

body, input, textarea, select, button {
  font-family: 'Noto Sans', 'Noto Color Emoji', 'Noto Emoji', sans-serif;
}

code, pre, kbd {
  font-family: 'Noto Sans Mono', 'Noto Color Emoji', 'Noto Emoji', sans-serif;
}

$headers: (
  h1: 1.95rem,
  h2: 1.5rem,
  h3: 1.25rem,
  h4: 140%,
  h5: 120%,
  h6: 110%
);

h1, h2, h3, h4, h5, h6 {
  font-family: 'Outfit', 'Noto Color Emoji', 'Noto Color Emoji', 'Noto Emoji', sans-serif;

  font-weight: 500;

  line-height: 1.7;
}

@each $tag, $size in $headers {
  #{$tag} {
    font-size: $size;

    margin-bottom: 1rem;
  }
}

p, ol, ul, label, a {
  font-size: 1rem;
  line-height: 1.7;
}

p:not(:last-child), ol:not(li > ol, li > ul, :last-child), ul:not(li > ol, li > ul, :last-child) {
  margin-bottom: 1rem;
}