/* Online-training hero image sizing override.
   Kept separate so the main stylesheet remains untouched. */
.ot-trainer-plaeholder {
  width: min(100%, 520px);
  height: clamp(440px, 52vw, 620px);
  margin-inline: auto;
  overflow: hidden;
  border-radius: 28px 28px 96px 28px;
  background: var(--color-off-white);
}

.ot-trainer-plaeholder img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}

@media (max-width: 1024px) {
  .ot-trainer-plaeholder {
    width: min(100%, 620px);
    height: clamp(390px, 64vw, 520px);
  }
}

@media (max-width: 767px) {
  .ot-hero-visual {
    min-height: 0;
  }

  .ot-trainer-plaeholder {
    width: 100%;
    height: min(112vw, 470px);
    border-radius: 22px 22px 64px 22px;
  }
}