/* Keep the fixed navigation clear of the people in the first view. */
.page-recruit main {
  padding-top: 60px;
}

.page-recruit .recruit-hero {
  height: max(680px, 56.25vw);
}

.page-recruit .recruit-hero__slide img {
  display: block;
  object-position: center top;
}

/* This source is a portrait; its face is in the upper third. */
.page-recruit .recruit-hero__slide--portrait img {
  object-position: center 17%;
}

.page-recruit .recruit-hero__content {
  bottom: clamp(36px, 4vh, 64px);
}

@media (min-width: 1024px) {
  .page-recruit main {
    padding-top: 120px;
  }
}

/* A landscape photo window keeps both colleagues visible on a narrow screen.
   Copy follows the photo so it never covers their faces. */
@media (max-width: 1023px) {
  .page-recruit .recruit-hero {
    height: auto;
    background: #111e2b;
  }

  .page-recruit .recruit-hero__slider {
    position: relative;
    aspect-ratio: 4 / 3;
  }

  .page-recruit .recruit-hero__slide--inspection img {
    object-position: 75% top;
  }

  .page-recruit .recruit-hero__slide--team img {
    object-position: 65% top;
  }

  .page-recruit .recruit-hero__overlay {
    display: none;
  }

  .page-recruit .recruit-hero__content {
    position: relative;
    inset: auto;
    padding: 30px 24px 34px;
  }

  .page-recruit .recruit-hero__catch {
    font-size: clamp(28px, 7.2vw, 40px);
    line-height: 1.55;
  }

  .page-recruit .recruit-hero__sub {
    max-width: none;
  }

  .page-recruit .recruit-hero__scroll {
    display: none;
  }
}