.container {
  flex-direction: column;
}

section + section.container {
  padding-top: 2rem;
}

.hero {
  background-color: rgb(var(--pri));
  color: white;
  padding: .5em 0;
}

.hero h1 {
  text-align: center;
  text-transform: uppercase;
  font-weight: normal;
  font-size: 3em;
  line-height: 1.2em;
}

.container * + * {
  margin-top: 0.5rem;
}

@media (max-width: 995px) {
  .container {
    text-align: center;
  }

  .container > h2 {
    margin: 1rem auto;
  }
}