body {
  display: flex;
  flex-direction: column;
  min-height: 98vh;
  justify-content: space-around;
}

header {
  width: min(100%, 24ch);
}

header,
footer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  width: 100%;
}

header > svg,
footer > svg {
  max-width: 30ch;
  height: auto;
  margin-inline: clamp(2rem, 12vw, 10rem);
  margin-block: 5rem;
}

footer > svg {
  max-width: 12ch;
  align-self: flex-end;
}

footer {
  justify-content: flex-end;
}

@media (max-width: 699px) {
  header {
    width: 100%;
    justify-content: center;
  }

  footer {
    justify-content: center;
  }

  header > svg,
  footer > svg {
    margin-inline: 3rem;
  }
}

header > svg path,
footer > svg path {
  fill: currentColor;
  stroke-width: 0px;
}

main.bwb-narrow-block {
  width: 60ch;
  max-width: 88vw;
  margin: 0;
  padding: 0.7rem;
}

a {
  color: var(--background-contrast-color);
}
