footer {

  width: 100%;
  z-index: 10;

  display: flex;
  flex-direction: row;
  justify-content: space-around;

  padding-top: 3vh;
  padding-bottom: 2vh;
  background-color: var(--back_header);
  height: auto;
  
}

footer div{
    display : flex;
    flex-direction: column;
    width : 33%;
    text-align: center;
    color : white;
    gap : 4%;
}

footer div h3{
    margin-bottom : 2vh;
    overflow: hidden;
    font-size: 2vw;
    
}

footer div p{
    overflow: hidden;
    font-size: 1.1vw;
    color : white;
    height : auto;
    
}

footer div p a {
    text-decoration: none;
     color : white;
}

@media (max-width: 768px) {
  footer {
    flex-direction: column;
    align-items: center;
    height: auto; /* corrige la faute "heihgt" et laisse le footer grandir selon contenu */
    padding: 4vw 2vw;
    gap: 4vw; /* espace régulier entre les sections */
  }

  footer div {
    width: 100%;
    max-width: 500px;
    margin-bottom: 4vw;
  }

  footer div h3 {
    font-size: 6vw;
    margin-bottom: 3vw;
  }

  footer div p {
    font-size: 3vw;
    line-height: 1.4;
  }

  footer div p a {
    font-size: 3.5vw;
    text-decoration: none;
    color: white;
  }
}