/* Stile generale del wrapper */
.imgbox-wrapper {
  display: flex;
  flex-wrap: wrap; /* permette di andare su più righe se serve */
  width: 100%;
  max-width: 1200px; /* opzionale, per non farlo diventare troppo grande */
  margin: 0 auto;
  box-sizing: border-box;
  padding: 20px;
}

/* Box immagine */
.imgbox-image-box {
  flex: 1 1 50%; /* prende metà spazio */
  /*background: url("https://www.crimilano.it/images/chi-siamo/head_mission.jpg") no-repeat center center;*/
  background-size: cover; /* 🔑 mantiene il rapporto! */
  /*min-height: 300px; */ /* altezza minima per quando non ci sono contenuti */
}

.imgbox-image-box img {
  width: 100%;
  height: auto; /* 🔑 mantiene il rapporto! */
  display: block;
}

.imgbox-text-box {
  flex: 1 1 50%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  margin-left: -20px;
  margin-top: 20px;
  margin-bottom: 20px;
  background-color: #DDD;
  /*box-shadow: 5px 5px 10px rgba(0,0,0,0.1);*/
  box-shadow: 5px 10px 8px #888888;
}

/* Responsive */
@media (max-width: 900px) {
  .imgbox-text-box {
    margin-top: 0; /* niente sormonto su mobile */
    margin-left: 0;
  }
}


/* Testo responsive */
.imgbox-text-box h1 {
  font-size: clamp(1.5rem, 2.5vw + 1rem, 2.5rem); /* 🔑 scala con lo schermo */
  margin-bottom: 20px;
}

.imgbox-text-box h2 {
  font-size: clamp(1.2rem, 2vw + 0.5rem, 2rem);
  margin-bottom: 16px;
}

.imgbox-text-box h2 strong {
  color: #C00000;	
}

.imgbox-text-box p {
  font-size: clamp(1rem, 1.5vw + 0.5rem, 1.2rem);
  margin-bottom: 20px;
}

/* Pulsante */
.imgbox-text-box a {
  display: inline-block;
  padding: 10px 20px;
  background-color: #C00000;
  color: white;
  text-decoration: none;
  border-radius: 8px;
  text-align: center;
  transition: background-color 0.3s;
}

.imgbox-text-box a:hover {
  background-color: #959595;
}

/* RESPONSIVE: su schermi stretti (max 900px) */
@media (max-width: 900px) {
  .imgbox-wrapper {
    flex-direction: column; /* 🔑 impila i due div */
  }
  .imgbox-image-box, .imgbox-text-box {
    flex: 1 1 100%;
  }
}