/* Base responsive */
* { box-sizing: border-box; }
img, video, svg, canvas { max-width: 100%; height: auto; }

/* Évite le scroll horizontal */
html, body, .mil-wrapper, .mil-content { overflow-x: hidden; }

/* Grille services: 4 → 2 → 1 */
.mil-services-grid .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
@media (max-width: 991.98px) {
  .mil-services-grid .col-lg-3 { flex: 0 0 50%; max-width: 50%; }
}
@media (max-width: 575.98px) {
  .mil-services-grid .col-lg-3 { flex: 0 0 100%; max-width: 100%; }
}

/* Cartes blog: ratio stable + image fluide */
.mil-blog-card .mil-cover-frame { position: relative; padding-bottom: 56.25%; overflow: hidden; }
.mil-blog-card .mil-cover-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Logos partenaires: pas de largeur fixe */
.mil-partner-frame { display: inline-flex; align-items: center; justify-content: center; width: clamp(80px, 28vw, 170px) !important; }
.mil-partner
/* Logos partenaires: pas de largeur fixe */
.mil-partner-frame { display: inline-flex; align-items: center; justify-content: center; width: clamp(80px, 28vw, 170px) !important; }
.mil-partner-frame img { max-height: 48px; height: auto; }

/* Tailles texte/paddings sur mobile */
@media (max-width: 575.98px) {
  .mil-banner h1 { font-size: 9vw; line-height: 1.1; }
  .mil-mb-60 { margin-bottom: 30px !important; }
  .mil-p-120-60 { padding: 60px 0 30px 0 !important; }
  .mil-p-120-30 { padding: 60px 0 15px 0 !important; }
  .mil-p-120-0  { padding: 60px 0 0 0 !important; }
}

/* Footer en pile sur mobile */
@media (max-width: 767.98px) {
  footer .row > [class*="col-"] { margin-bottom: 24px; }
}

/* Photo "about" plus carrée sur mobile */
.mil-about-photo .mil-img-frame { padding-bottom: 100% !important; }

/* Éléments décoratifs */
.mil-lines, .mil-dodecahedron { max-width: 100%; height: auto; }

/* --- Décentrage global vers la droite : reset propre --- */
html, body { margin: 0; padding: 0; }
body { padding-right: 0 !important; }           /* annule compensations */
.container { margin-left: auto; margin-right: auto; }

/* Fancybox / libs qui ajoutent une “compensation scrollbar” */
body.compensate-for-scrollbar,
html.compensate-for-scrollbar,
body.fancybox-active {
  padding-right: 0 !important;
}

/* iOS safe area, sans créer de décalage visuel */
body {
  padding-left: env(safe-area-inset-left, 0);
  padding

  /* --- Padding latéral agréable en mobile --- */
@media (max-width: 768px) {
  body, .mil-content, #swupMain {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* Les conteneurs Bootstrap */
  .container, .row {
    padding-left: 0;
    padding-right: 0;
  }

  /* Les titres/paragraphes principaux ne collent plus aux bords */
  h1, h2, h3, h4, h5, h6, p {
    padding-left: 0;
    padding-right: 0;
  }

  /* Images en pleine largeur, sans dépasser */
  img, video {
    width: 100%;
    height: auto;
    display: block;
  }
}

  @supports (padding: max(0px)) {
  @media (max-width: 768px) {
    body {
      padding-left: max(16px, env(safe-area-inset-left));
      padding-right: max(16px, env(safe-area-inset-right));
    }
  }
}

/* ----- Gouttières mobiles globales (16 px) ----- */
@media (max-width: 768px) {
  /* Conteneurs principaux */
  .container,
  .mi-invert-fix .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }


  /* ----- BLOG ----- */
  /* Texte de la carte avec padding interne */
  .mil-blog-card .mil-post-descr {
    padding-left: 16px;
    padding-right: 16px;
  }
  /* Image en pleine largeur (bord à bord) : on neutralise les gouttières uniquement pour la cover */
  .mil-blog-card .mil-cover-frame {
    margin-left: -16px;
    margin-right: -16px;
  }

  /* ----- SERVICES (grille noire) ----- */
  /* Les items ont p-0 : rajoutons un padding dans la carte */
  .mil-service-card-sm {
    padding: 24px 16px;
  }

  /* ----- TEAM / REVIEWS / PARTENAIRES ----- */
  .mil-team-list,
  .mil-reviews-slider,
  .mil-infinite-show {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* ----- SECTIONS GLOBALES EN FOND PLEIN ----- */
  /* Ajoute des gouttières sans casser le fond plein */
  section.mil-dark-bg .container,
  section .container.mil-p-120-60,
  section .container.mil-p-120-30,
  section .container.mil-p-120-0 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Footer */
  footer .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* iPhone avec encoche : utilise la zone sûre si > 16px */
@supports (padding: max(0px)) {
  @media (max-width: 768px) {
    body {
      padding-left: max(16px, env(safe-area-inset-left));
      padding-right: max(16px, env(safe-area-inset-right));
    }
  }
}
  
/* ===========================
   FOOTER MOBILE
   =========================== */
@media (max-width: 768px) {
  /* conteneur : ajoute du padding latéral */
  footer .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* titre/nom de l’agence */
  footer .mil-logo,
  footer .mil-muted {
    text-align: left !important;
    margin-left: 0 !important;
  }

  /* navigation (Home, Galerie, Contact) */
  footer nav ul,
  footer nav li,
  footer nav a {
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    display: block;
  }

  /* liens légaux (politiques) */
  footer .mil-menu-list {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
  }

  /* titre contact + infos */
  footer h6,
  footer p {
    text-align: left !important;
    margin-left: 0 !important;
  }

  /* icônes réseaux sociaux */
  footer .mil-social-icons {
    justify-content: flex-start !important;
    gap: 16px;
  }

  /* copyright */
  footer p.mil-light-soft {
    text-align: left !important;
    margin-top: 16px;
  }
}
  
  /* ===========================
   FOOTER DESKTOP (≥992 px)
   =========================== */
/* Ligne verticale + alignements desktop */
@media (min-width: 992px) {
  .footer-mid {
    position: relative;
    padding-left: 32px;   /* espace entre ligne et texte */
  }
  .footer-mid::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #333333;  /* ou ta couleur accent */
    opacity: 0.9;
  }

  /* textes bien à gauche */
  .footer-mid h6,
  .footer-mid p,
  .mil-footer-menu ul,
  .mil-footer-menu li,
  .mil-footer-menu a,
  .mil-menu-list,
  .mil-menu-list li,
  .mil-menu-list a {
    text-align: left;
    margin-left: 0;
    padding-left: 0;
  }

  /* espacements uniformes */
  .mil-footer-menu ul li + li,
  .mil-menu-list li + li { margin-top: 12px; }
}

/* ==== PARTENAIRES / LOGOS ==== */

/* 1) Le wrapper Swiper est bien en flex et centré verticalement */
.mil-infinite-show .swiper-wrapper {
  display: flex;          /* apaise le linter */
  align-items: center;
}

/* 2) Chaque slide : largeur auto (pour slidesPerView:'auto') */
.mil-infinite-show .swiper-slide {
  width: auto !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 3) Cadre du logo : petit tampon interne (ajouté à spaceBetween) */
.mil-partner-frame {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
}

/* 4) Image du logo : jamais étirée, hauteur uniforme */
.mil-infinite-show .mil-partner-frame img {
  height: clamp(28px, 3.2vw, 56px);
  width: auto !important;         /* annule les globales type img{width:100%} */
  max-width: none !important;
  object-fit: contain;
  display: block;
}

/* (Option) si un logo monstrueusement large dépasse visuellement :
.mil-infinite-show .mil-partner-frame img { max-width: 220px; }
*/

  /* Taille par défaut (tablette/desktop) – tu l’as déjà */
.mil-infinite-show .mil-partner-frame img {
  height: clamp(28px, 3.2vw, 56px);
  width: auto !important;
  object-fit: contain;
  display: block;
}


/* Logos par défaut (desktop inclus) */
.mil-infinite-show .mil-partner-frame img {
  height: clamp(36px, 4vw, 90px); /* avant max 72px → maintenant max 90px */
  width: auto !important;
  object-fit: contain;
  display: block;
}

/* Mobile : toujours lisibles mais plus grands */
@media (max-width: 768px) {
  .mil-infinite-show .mil-partner-frame img {
    height: clamp(42px, 14vw, 80px);
  }
}

/* === Team : texte fixe sous la photo === */
.mil-team-bio{
  text-align:center;
  margin-top:10px;
}
.mil-team-bio .mil-role-static{
  font-size:14px;
  line-height:1.5;
  color:#555;
  letter-spacing:0.02em;
  margin:0;
}
.mil-team-card:hover + .mil-team-bio .mil-role-static{
  color:#333; /* léger focus quand on survole la carte */
}

  /* État de base : éléments discrets */
.mil-service-card-sm p,
.mil-service-card-sm .mil-button {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
}

/* Au hover OU quand on ajoute .is-active */
.mil-service-card-sm:hover p,
.mil-service-card-sm:hover .mil-button,
.mil-service-card-sm.is-active p,
.mil-service-card-sm.is-active .mil-button {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
  
/* Espacement spécifique pour les rôles sous les photos en mobile */
@media (max-width: 768px) {
  .mil-team-bio {
    margin-top: 15px;   /* espace entre image et rôle */
    margin-bottom: 30px; /* espace après le rôle */
  }

  .mil-team-bio .mil-role-static {
    font-size: 15px;
    font-weight: 500;
    display: inline-block;
    padding: 6px 0;
  }
}

#cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(34, 34, 34, 0.85); /* noir à 85% de transparence */
  color: #fff;
  display: none;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  font-size: 14px;
  z-index: 9999;
  backdrop-filter: blur(6px); /* ajoute un effet flou derrière */
}

#cookie-banner p {
  margin: 0;
}

#cookie-banner a {
  color: #fff;
  text-decoration: underline;
}

#cookie-banner button {
  background: rgba(234, 224, 213, 0.61); /* bouton légèrement transparent aussi */
  color: #000;
  border: none;
  padding: 8px 15px;
  cursor: pointer;
  border-radius: 4px;
  font-weight: bold;
}







