.people-in-motion {
  --people-surface: #f6f7f6;
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  min-height: 650px;
  overflow: hidden;
  border-radius: 30px;
  background: var(--people-surface);
}

.people-in-motion-image {
  position: relative;
  min-height: 650px;
  background: var(--people-surface);
}

.people-in-motion-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
}

.people-in-motion-image::after {
  position: absolute;
  inset: 0 0 0 auto;
  width: 16%;
  background: linear-gradient(90deg, transparent, var(--people-surface));
  content: '';
  pointer-events: none;
}

.people-in-motion-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 70px clamp(44px, 5vw, 96px) 70px clamp(32px, 4vw, 78px);
}

.people-in-motion-copy h2 {
  max-width: 640px;
  margin-bottom: 38px;
  font-size: clamp(46px, 4.7vw, 78px);
  line-height: 1.01;
  letter-spacing: -.05em;
}

.people-in-motion-copy h2 span {
  color: inherit;
}

.people-in-motion-copy p {
  max-width: 520px;
  color: #424242;
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.48;
}

.people-in-motion-copy p + p {
  margin-top: 20px;
  color: #686868;
}

.people-in-motion-copy .text-link {
  margin-top: 42px;
  font-size: 15px;
}

@media (max-width: 1000px) {
  .people-in-motion { min-height: 550px; }
  .people-in-motion-image { min-height: 550px; }
  .people-in-motion-copy { padding: 45px 40px 45px 30px; }
  .people-in-motion-copy h2 { margin-bottom: 26px; font-size: clamp(40px, 5vw, 56px); }
  .people-in-motion-copy p { font-size: 16px; }
  .people-in-motion-copy .text-link { margin-top: 30px; }
}

@media (max-width: 700px) {
  .people-in-motion {
    grid-template-columns: 1fr;
    border-radius: 22px;
  }

  .people-in-motion-image {
    min-height: 0;
    aspect-ratio: 1.05;
  }

  .people-in-motion-image img { object-position: center 46%; }
  .people-in-motion-image::after { display: none; }
  .people-in-motion-copy { padding: 42px 32px 48px; }
  .people-in-motion-copy h2 { max-width: 540px; font-size: clamp(42px, 8vw, 60px); }
  .people-in-motion-copy p { max-width: 560px; }
}

@media (max-width: 450px) {
  .people-in-motion-image { aspect-ratio: 1; }
  .people-in-motion-copy { padding: 38px 24px 44px; }
  .people-in-motion-copy h2 { margin-bottom: 27px; font-size: 43px; }
  .people-in-motion-copy p { font-size: 15px; }
  .people-in-motion-copy p + p { margin-top: 16px; }
  .people-in-motion-copy .text-link { margin-top: 32px; font-size: 14px; }
}
