/* Wrapper (garde ton style) */
.main-image-wrap{
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  border-radius: 12px;
  overflow: hidden;
  background: #f3f4f6;
}

/* Image remplit le wrapper */
.main-image{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

/* ✅ MOBILE uniquement : hauteur plafonnée plus basse */
@media (max-width: 639px){
  .main-image-wrap{
    height: 360px;     /* <-- ajuste : 200 / 220 / 240 / 260 */
  }
}

/* Tablette et + : tu gardes ton rendu */
@media (min-width: 768px){
  .main-image-wrap{
    height: 600px;     /* ton rendu actuel */
    max-width: 900px;  /* ta limite */
  }
}