
  .photo:hover img{
    box-shadow: 2px 2px 10px 0 rgba(0,0,0,.1);
  }
  
  .photo .glow-wrap{
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
  }
  
  .photo .glow{
    display: block;
    position:relative;
    width: 40%;
    height: 200%;
    background: rgba(255,255,255,.2);
    filter: blur(5px);
    transform: rotate(45deg) translate(-450%, 0);
    transition: all .5s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  
  .photo:hover .glow{
    transform: rotate(45deg) translate(450%, 0);
    transition: all 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  
  .photo:hover img,
  .photo:hover .glow-wrap{
    margin-top: 0;
  }

.header-container {
  position: relative;
  text-align: center;
  color: white;
  background-size:cover;/* S'assure que l'image de fond couvre tout l'espace */
  background-position: center 65%; /* Centre l'image de fond */
  padding-top: 18rem; /* Ajustez selon la hauteur désirée pour l'espace en haut */
}

.profile-image {
  position: absolute;
  bottom: 110px; /* La moitié de la hauteur de l'image de profil pour la déplacer vers le haut */
  left: 50%;
  transform: translateX(-50%);
  border: 3px solid white; /* Ajustez la taille et la couleur de la bordure */
  border-radius: 10%;
  overflow: hidden;
  background: white; /* Fournit un fond en cas de transparence dans l'image de profil */
}

.profile-image img {
  width: 200px; /* Ajustez selon les dimensions désirées */
  height: 240px; /* Ajustez selon les dimensions désirées */
  object-fit: cover; /* S'assure que l'image de profil garde ses proportions et remplit l'espace */
  object-position: center 15%;
}

/* .header-content {
  background-color: rgba(67, 67, 67, 0.5);
} */
.header-content h1 {
  margin-bottom: 0.5em; /* Espace sous le h1 */
  color: black;
}

.header-content h2 {
  margin-top: 0; /* Pas d'espace supplémentaire au-dessus du h2 */
  color: black;
}

@media (min-width: 2225px) and (max-width: 2900px){
  .header-container {
    background-position: center 66%;
    padding-top: 600px; 

  }
}

@media (min-width: 2900px){
  .header-container {
    background-position: center 68%;
    padding-top: 650px; 
  }
}

@media (min-width: 3800px){
  .header-container {
    background-position: center 70%;
    padding-top: 650px; 
  }
}