@media (min-width: 621px) {
  main {
    padding-top: 30px;
  }
}

.hero h1,
.game-hero h1,
.fun-hero h1 {
  font-size: 46px;
  letter-spacing: -.035em;
  line-height: 1.08;
  margin-bottom: 10px;
  margin-top: 8px;
}

.hero > p,
.game-hero > p,
.fun-hero > p {
  font-size: 17px;
  line-height: 1.55;
}

.hero-pills {
  margin-bottom: 26px;
  margin-top: 16px;
}

/* Keep the first item reachable when the series is wider than the screen. */
.series-track {
  justify-content: flex-start;
}

.series-track > :first-child { margin-left: auto; }
.series-track > :last-child { margin-right: auto; }

.layer .modal {
  max-width: 620px;
}

.layer .modal h2,
.layer .fun-modal h2 {
  font-size: 35px;
  line-height: 1.08;
}

.layer .modal > p,
.layer .fun-modal > p {
  font-size: 1rem;
  line-height: 1.55;
}

@media (max-width: 620px) {
  .hero h1,
  .game-hero h1,
  .fun-hero h1 {
    font-size: 35px;
    line-height: 1.06;
  }

  .hero > p,
  .game-hero > p,
  .fun-hero > p { font-size: 1rem; }
}