main {
  padding-top: var(--space-8);
}

.hero__content {
  max-width: 36rem;
}

.hero__media {
  max-width: 30rem;
  justify-self: center;
}

.section__title {
  text-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.card h4 {
  font-size: 1.05rem;
  margin-bottom: 0.25rem;
}

@media (max-width: 767px) {
  main {
    padding-top: var(--space-6);
  }

  .hero__content {
    text-align: left;
  }

  .hero__actions {
    justify-content: flex-start;
  }
}