h1 { font-size: 2.986em; }
h2 { font-size: 2.4883em; }
h3 { font-size: 2.0736em; }
h4 { font-size: 1.728em; }
h5 { font-size: 1.44em; }
h6 { font-size: 1.2em; }
small { font-size: 0.8333em; }

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

html {
  font-family: "Inter";
  font-weight: 400;
  color-scheme: dark light;
}

/* @media (prefers-color-scheme: dark) {
  body {
    background-color: black;
    color: white;
  }

  .hero img {
    filter: invert(1);
  }
}

@media (prefers-color-scheme: light) {
  body {
    background-color: white;
    color: black;
  }

  .hero img {
    filter: invert(0);
  }
}

a {
  color: inherit;
}

.bg {
  background: url("background.jpg") center/cover no-repeat;
  opacity: 0.1;
  filter: grayscale(100%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

header {
  padding: 2em 0;
  text-align: center;
}

nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2em;
}

nav a {
  text-decoration: none;
}

main {
  height: 100%;
}

.hero {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100%;
}

.hero img {
  height: 10em;
}

footer {
  padding: 2em 0;
}

footer p {
  text-align: center;
} */