.content {
  margin: 10% auto; /* Marges haut et bas de 10%, centré horizontalement */
  display: flex;
  flex-wrap: wrap; /* Permet aux éléments de passer à la ligne si l'espace est réduit */
  align-items: center;
  justify-content: center;
  width: 70%;
  padding: 20px; /* Un peu d'espace intérieur */
  box-shadow: 0px 2px 30px -3px rgba(0, 0, 0, 0.75);
  border-radius: 30px;
  overflow: hidden; /* Empêche tout débordement */
}

.content img {
  width: 100%; /* L'image occupe 100% de la largeur disponible */
  max-width: 500px; /* Mais ne dépasse pas 500px */
  height: auto; /* Conserve ses proportions */
  border-radius: 10%;
  box-shadow: 0px 2px 30px -3px rgba(0, 0, 0, 0.75);
  margin: 20px 30px;
  flex-shrink: 0; /* Empêche l'image de rétrécir si l'espace est limité */
}

.content > div {
  flex: 1; /* Permet au bloc texte d'occuper l'espace restant */
  padding: 0 30px; /* Espace intérieur à gauche et à droite */
}

/* Titres responsives avec clamp() */
/* Taille minimale 1.5rem, idéale basée sur 4vw, maximum réduit à 2.5rem */
.content div h1 {
  text-align: center;
  font-family: "Teko", sans-serif;
  margin-bottom: 20px;
  font-size: clamp(1.5rem, 4vw, 2rem);
}

/* Paragraphes responsives avec clamp() */
/* Taille minimale 1rem, idéale basée sur 2.5vw, maximum réduit à 1.1em */
.content div p {
  font-family: "montserra", sans-serif;
  font-size: clamp(1rem, 2.5vw, 1.1em);
  text-align: center;
}