body {
  background-color: black;
  color: white;
  font-family: monospace;
  margin: 2rem;
  font-size: 16px;
}

main {
  margin-inline: auto;
  max-width: 80ch;
}

img {
  display: block;
  max-width: 100%;
}

li {
  margin-bottom: 0.5rem;
}

.button {
  padding: 8px 12px;
  background-color: black;
  border: 2px solid white;
  cursor: pointer;
  color: white;
  font-size: 16px;
  border-radius: 999px;

  &:focus:not([disabled]),
  &:hover:not([disabled]) {
    outline: 2px solid white;
    outline-offset: 3px;
  }

  &[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
  }
}

.headshot {
  width: 50vw;
  min-width: 10rem;
  max-width: 20rem;
  height: 40vw;
  min-height: calc(4 / 5 * 10rem);
  max-height: calc(4 / 5 * 20rem);
  object-fit: cover;
  object-position: top;
  border-radius: 0.5rem;
}

.contact-links {
  li {
    a {
      color: white;
      text-decoration: underline;
    }
  }
}
