.about-page-container {
  margin: 0 auto;
  padding-top: var(--spacer);
}

.about-body {
  margin: 0 auto;
  font-size: 1.1rem;
  line-height: 1.35;
  font-family: var(--font-family-body);
}

.about-body h1 {
  margin: 0 0 1.2rem;
  font-size: 3rem;
  font-weight: 500;
}

.about-body h2 {
  margin: 0 0 2.8rem;
  font-size: 1.5rem;
  font-weight: 450;
  line-height: 1.3;
}

.about-body p {
  margin: 0 0 calc(var(--spacer) * 1.5);
}

.about-body p,
.about-body h1,
.about-body h2,
.about-body h3,
.about-body h4,
.about-body h5,
.about-body h6 {
  width: 70%;
  font-family: var(--font-family-body);
}

.about-body a {
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

@media (width <= 700px) {
  .about-page-container {
    padding-top: 40px;
  }
  .about-body h1 {
    font-size: clamp(3.2rem, 16vw, 6rem);
  }
  .about-body p,
  .about-body h1,
  .about-body h2,
  .about-body h3,
  .about-body h4,
  .about-body h5,
  .about-body h6 {
    width: 100%;
  }
}