/* Styles communs pour tous les breakpoints */
@media screen and (max-width: 1400px) {
  .main-container {
    left: calc(50% - 300px);
  }
}

/* Tablettes et petits écrans (768px à 1023px) */
@media screen and (max-width: 1023px) {

  /* Main titles */
  .main-container {
    left: calc(50% - 250px);
  }

  .titre_audiovisuel,
  .titre_web,
  .titre_graphisme,
  .titre_photographie {
    font-size: 60px;
  }
}

/* Mobile Large (425px à 767px) */
@media screen and (max-width: 767px) {

  /* Main titles */
  .main-container {
    position: static;
    padding: 40px 20px;
  }

  .titre_audiovisuel,
  .titre_web,
  .titre_graphisme,
  .titre_photographie {
    font-size: 54px;
    white-space: normal;
    margin-bottom: 20px;
  }  
}

/* Mobile Medium (375px à 424px) */
@media screen and (max-width: 424px) {
  .titre_audiovisuel,
  .titre_web,
  .titre_graphisme,
  .titre_photographie {
    font-size: 45px;
  }
}

/* Mobile Small (320px à 374px) */
@media screen and (max-width: 374px) {
  .titre_audiovisuel,
  .titre_web,
  .titre_graphisme,
  .titre_photographie {
    font-size: 40px;
  }


}


/* Ajustements pour la hauteur */
@media screen and (max-height: 600px) {
  .main-container {
    padding: 20px;
  }
}