/* =========================================================
   footer.css
   Pied de page CEMID
   - design clair
   - réseaux sociaux uniquement
   ========================================================= */

footer{
  background:linear-gradient(180deg,#ffffff 0%,#f6f8ff 60%,#eef3ff 100%);
  color:#0f172a;
  padding:64px 0 28px;
  border-top:1px solid rgba(0,51,204,.08);
}

/* Contenu principal */
.footer-wrap{
  max-width:1280px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}

/* Bloc marque */
.footer-brand h3{
  font-size:26px;
  font-weight:900;
  color:#0033cc;
  margin-bottom:10px;
}

.footer-brand p{
  max-width:560px;
  opacity:.85;
  color:#0f172a;
}

/* Réseaux sociaux */
.footer-social{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.footer-social-title{
  font-weight:800;
  letter-spacing:.3px;
  color:#0f172a;
}

.social-links{
  display:flex;
  gap:14px;
}

.social-link{
  width:46px;
  height:46px;
  border-radius:50%;
  background:rgba(0,51,204,.08);
  border:1px solid rgba(0,51,204,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#0033cc;
  font-size:18px;
  text-decoration:none;
  transition:all .3s ease;
}

.social-link:hover{
  background:linear-gradient(135deg,#ffd700,#ffed4e);
  color:#0033cc;
  transform:translateY(-3px);
}

/* Bas du footer */
.footer-bottom{
  max-width:1280px;
  margin:28px auto 0;
  padding:16px 24px 0;
  border-top:1px solid rgba(0,51,204,.10);
  text-align:center;
  font-size:14px;
  opacity:.85;
  color:#0f172a;
}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){
  .footer-wrap{
    flex-direction:column;
    align-items:flex-start;
  }
}

/* =========================================================
   FIX FOOTER VISIBILITY (force affichage)
========================================================= */
footer{
  display: block !important;
  position: relative !important;
  z-index: 5 !important;
  width:100%;
}

/* =========================================================
   Correction couleurs texte
========================================================= */
footer,
footer p,
footer h3,
footer h4,
footer span,
footer div {
  color:#0f172a !important;
}

/* Titre */
.footer-brand h3 {
  color:#0033cc !important;
}

/* Icônes réseaux */
.social-link {
  color:#0033cc !important;
}

.social-link:hover {
  color:#0033cc !important;
}