/* Home hero: complete editorial message in the initial viewport. */
@media (min-width: 801px) {
  .home-page .hero,
  .home-page .hero:has(.module-label) {
    height: 100svh;
    min-height: 650px;
    max-height: 820px;
    padding: 138px 4.8vw 38px;
    align-items: stretch;
  }

  .home-page .hero > .module-label {
    top: 124px;
  }

  .home-page .hero-copy {
    align-self: start;
    padding-top: 42px;
    max-width: 520px;
  }

  .home-page .hero h1 {
    max-width: 520px;
    font-size: clamp(50px, 4.7vw, 68px);
    line-height: .94;
  }

  .home-page .hero h1 em {
    white-space: nowrap;
  }

  .home-page .hero-text {
    max-width: 410px;
    margin: 20px 0 22px;
    font-size: 15px;
    line-height: 1.5;
  }

  .home-page .hero .button {
    padding: 12px 18px;
  }

  .home-page .hero-composition-image {
    max-height: min(500px, 64svh);
  }
}

@media (max-width: 800px) {
  .home-page .hero,
  .home-page .hero:has(.module-label) {
    min-height: 0;
    height: auto;
    padding: 96px 22px 30px;
  }

  .home-page .hero > .module-label {
    top: 78px;
  }

  .home-page .hero-copy {
    padding-top: 22px;
  }

  .home-page .hero h1 {
    font-size: clamp(36px, 11vw, 44px);
    line-height: .95;
  }

  .home-page .hero h1 em {
    white-space: nowrap;
  }

  .home-page .hero-text {
    max-width: 390px;
    margin: 18px 0 20px;
    font-size: 14px;
    line-height: 1.5;
  }

  .home-page .hero .button {
    padding: 12px 17px;
  }

  .home-page .hero-art-composition {
    margin-top: 18px;
  }

  .home-page .hero-composition-image {
    max-height: 300px;
  }
}