body {
  min-height: 100vh;
  display: flex;
  flex-flow: column;
}

main {
  flex: 1 0 auto;
  display: flex;
  flex-flow: column;
  justify-content: center;
  background: linear-gradient(200deg, #dee8f3, transparent);
  font-size: 1.1rem;
  @media (width > 40rem){
    background:
      bottom right / contain no-repeat url("/404/hero.svg?v=ZId7avbq7z"),
      linear-gradient(320deg, #6062c430, transparent 50%),
      linear-gradient(200deg, #dee8f3, transparent);
  }
}

section {
  padding-block: calc(var(--nav-height) + 4rem) 4rem;
  padding-inline: max((100% - 54.5rem) / 2 + 2rem, 2rem);
}

h1 {
  margin: .5rem 0 .75rem;
  font-weight: 700;
  font-size: clamp(2rem, 9vw + .2rem, 3rem);
}

p { margin: 0; }

.status {
  font-weight: 500;
  color: #637894;
}

.primary {
  display: inline-block;
  padding: .5rem 1.5rem;
  margin-block: 2rem;
  border-radius: .75rem;
  text-decoration: none;
  color: white;
  background-color: black;
  font-weight: 700;
  transition: background-color .2s;
  &:hover { background-color: #12324B; }
}

a:not(.primary) {
  color: #0c5df9;
  text-decoration: none;
  &:hover {
    text-decoration: underline;
  }
}

footer-menu:not(:defined){
  display: block;
  height: 25.85rem;
  background: white;
}