/* Fixe le viewport sur iOS */
html, body {
  margin: 0;
  padding: 0;
  box-sizing: border-box; /* Assure que tout est bien calculé */
  overflow-x: hidden; /* Évite les débordements latéraux */
  touch-action: manipulation; /* Réduit les glitchs de scroll */
}

/* Bloc du texte séparé */
.texte-box2 {
  z-index: 10;
  padding-left: 10rem; /* Garde le décalage sur grand écran */
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Style du texte */
.texte2 {
  z-index: 10;
  background: white;
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
  box-sizing: border-box; /* Fixe le modèle de boîte */
}

/* Ajustement spécifique pour les petits écrans */
@media (max-width: 768px) {
  /* Correctif pour iOS (min-height propre) */
  :root {
    --vh: 1vh; /* Variable pour fixer la hauteur dynamique */
  }

  .texte-box2 {
    padding-left: 0; /* Enlève le décalage */
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    min-height: calc(var(--vh, 1vh) * 100); /* Fix pour iOS */
  }

  .texte2 {
    padding: 1.5rem; /* Réduire l'espacement si nécessaire */
    max-width: 90%; /* Évite de dépasser l'écran */
    box-sizing: border-box; /* Inclus padding et bordure */
  }
}