.h1,
h1 {
  font-size: var(--text-lg);
  line-height: 1.25;
  font-weight: 200;
}

.h2,
h2 {
  font-size: var(--text-lead);
  line-height: 1.2;
  font-weight: 200;
}

.h3,
h3 {
  font-size: var(--text-base);
  line-height: var(--leading-snug);
  font-weight: 200;
}

.h4,
h4,
h4 p {
  font-size: var(--text-sm);
  line-height: var(--leading-tight);
}

.h5,
h5 {
  font-size: var(--text-sm);
}

.h6,
h6 {
  font-size: var(--text-xs);
}

/*
  Mobile
  ========================================================================== */

@media screen and (max-width: 45em) {
  .h1,
  h1 {
    font-size: 1.8rem;
  }
  .h2,
  h2 {
    font-size: var(--text-base);
  }
  .h3,
  h3 {
    font-size: var(--text-base);
    line-height: var(--leading-tight);
  }
  .h4,
  h4 {
    font-size: var(--text-sm);
    line-height: var(--leading-snug);
  }
  .h5,
  h5 {
    font-size: var(--text-xs);
  }
  .h6,
  h6 {
    font-size: var(--text-xm);
  }
}