@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

html {
  font-family: "Source Serif 4", serif;
  font-optical-sizing: auto;
  font-weight: 350;
  font-style: normal;
  background-color:  hsl(40, 90%, 94%);
  color: hsl(40, 100%, 7%);
}

a {
  color: hsl(40, 40%, 35%);
  text-decoration: none;
}

a:hover {
  background-color: hsl(40, 40%, 35%);
  color: #fff;
}

body {
  padding: 1.5rem;
  font-size: 18px;
  max-width: 80ch;
  line-height: 1.5;
}

@media (min-width: 600px) {
  body {
    padding: 3rem;
    font-size: 20px;
  }
}

h1 {
  font-size: 2.222rem;
  font-weight: 400;
}

footer {
  opacity: 0.5;
  font-size: .8em;
  margin-top: 3rem;
}