.hero-character-wrap {
  width: min(76vw, 360px);
}

.work-character,
.contact-character {
  display: block;
}

.work-character img,
.contact-character img {
  width: 100%;
  height: auto;
}

@media (min-width: 700px) {
  .hero-character-wrap {
    width: min(47vw, 470px);
  }
}

@media (min-width: 1100px) {
  .hero-character-wrap {
    width: min(38vw, calc((100svh - 80px) * 0.6667), 510px);
  }

  .hero-copy {
    max-width: 560px;
  }

  .hero h1 {
    font-size: clamp(5rem, 7vw, 6.5rem);
  }
}