#footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 100vh;
  z-index: 5000;
  background: rgb(17,17,10);
  display: flex;
  justify-content: center;
  align-items: center;
  transition:
    transform 0.4s ease,
    opacity 0.4s ease,
    background 0.3s ease;
  overflow: hidden;
}

/* Background asymétrique */
.footer-bg-asym {
  position: absolute;
  top: 0;
  left: 0;
  width: 25%; /* 1er quart à droite */
  height: 100%;
  background: linear-gradient(
    135deg,
    rgba(30, 65, 32, 0.95) 0%,      /* Votre couleur de base */
    rgba(45, 85, 47, 0.9) 50%,      /* Version plus claire */
    rgba(20, 45, 22, 0.85) 100%     /* Version plus foncée */
  );
  clip-path: polygon(0 0, 100% 0, 0 100%);
  z-index: 1;
}

.footer-content {
  /*background: rgb(40,40,40);*/
  height: 50vh;
  position: relative;
  z-index: 2; /* Au-dessus du background asymétrique */
}

.left img {
  width: 30rem;
}
#footer h4 {
  font-size: 2.5rem;
  margin-bottom: 3.2rem !important;
}
#footer li{
  padding-bottom: .6rem;
}
#footer a {
  font-size: 1rem;
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  
}
#footer a .fab{
  font-size: 2.5rem;
  color: transparent; /* Rend le remplissage transparent */
  -webkit-text-stroke: 1.5px var(--yellow); /* Contour jaune (épaisseur: 1.5px) */
  text-stroke: 1.5px var(--yellow); 
  text-decoration: none;
  
}
#footer a:hover .fab{
  font-size: 2.5rem;
  color: white;
  -webkit-text-stroke: 0px var(--yellow); /* Contour jaune (épaisseur: 1.5px) */  
}
#footer a:hover{
  color: var(--yellow);
}
.left p {
  padding: 2rem 2rem 0rem 2rem;
}

#close-footer {
  z-index: 6000;
}

body.no-scroll,
html.no-scroll {
  overflow: hidden;
  height: 100%;
}

/* Responsive */
@media (max-width: 768px) {
  .footer-bg-asym {
    width: 40%;
  }
}

@media (max-width: 576px) {
  .footer-bg-asym {
    width: 60%;
  }
}