/* Wide-screen correction for the homepage concept. */
@media (min-width: 1101px) {
  .hero-copy {
    width: 100%;
    padding: 6.25rem min(46%, 570px) 9rem 1.25rem;
  }

  .hero h1 {
    max-width: 650px;
    font-size: clamp(3rem, 4vw, 4.35rem);
    line-height: 1;
    letter-spacing: -0.05em;
  }

  .lede {
    max-width: 560px;
    margin: 1.55rem 0 1.8rem;
    font-size: 1.14rem;
  }

  .hero-art {
    top: 68px;
    right: max(1.5rem, calc((100vw - var(--max)) / 2 - 220px));
    width: min(43%, 720px);
    height: 410px;
  }
}

@media (min-width: 901px) and (max-width: 1100px) {
  .site-header nav {
    gap: 0.9rem;
    font-size: 0.82rem;
  }

  .hero-copy {
    width: 100%;
    padding-right: 47%;
  }

  .hero h1 {
    font-size: clamp(3rem, 5.7vw, 4rem);
  }

  .hero-art {
    right: 1rem;
    width: 46%;
  }
}