.hero {
  color: #fff;
  background: radial-gradient(120% 140% at 85% 0%, rgba(56, 96, 178, .55), rgba(56, 96, 178, 0) 60%), linear-gradient(120deg, var(--brand-deep), var(--brand) 72%, var(--brand-dark));
}

.hero-inner {
  width: min(1160px, calc(100% - 40px));
  min-height: 260px;
  margin: 0 auto;
  padding: 48px 0 72px;
  display: grid;
  align-content: center;
}

h1 {
  margin: 0;
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.12;
}

.hero p {
  max-width: 760px;
  margin: 18px 0 0;
  color: rgba(255, 255, 255, .88);
  font-size: 19px;
}