:root {
  --primary: #1a237e;
  --primary-light: #e8eaf6;
  --accent: #f9ab00;
  --hero-bg: #101638;
}

@media (min-width: 1024px) {
  .hero.has-image::after {
    top: 96px;
    right: max(40px, calc((100vw - var(--max)) / 2));
    bottom: 42px;
    left: auto;
    width: min(32vw, 440px);
    background-position: center;
    background-size: contain;
    opacity: 0.58;
  }

  .hero .hero-lead {
    max-width: 520px;
  }
}