.ai-assistant-btn,.whatsapp-widget .whatsapp-btn{position:fixed;left:16px;right:auto;display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-radius:999px;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.15);max-width:calc(100% - 32px);z-index:2147483646}.whatsapp-widget{position:fixed;left:16px;bottom:88px;z-index:2147483647}.ai-assistant-btn{bottom:16px;background:#007bff;color:#fff}@media (max-width:640px){main{padding-bottom:160px !important}}

/* === Overlap fix v2025-08-15 === */
:root{ --fab-gap:14px; --fab-size:48px; }
.whatsapp-widget{
  position:fixed; left:16px;
  bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 16px + var(--fab-gap));
  z-index:2147483646;
  pointer-events:none; /* le wrapper ne bloque pas les clics sous-jacents */
}
.whatsapp-widget .whatsapp-btn{
  pointer-events:auto; display:inline-flex; align-items:center; gap:.5rem;
  height: var(--fab-size); line-height: var(--fab-size); padding: 0 14px;
  white-space: nowrap;
}
.ai-assistant-btn{
  position:fixed; left:16px;
  bottom: calc(env(safe-area-inset-bottom,0px) + 16px);
  z-index:2147483647; /* IA au-dessus si recouvrement résiduel */
  height: var(--fab-size); line-height: var(--fab-size); padding: 0 14px;
  white-space: nowrap;
}
@media (max-width:380px){
  :root{ --fab-size:44px; }
  .ai-assistant-btn, .whatsapp-widget .whatsapp-btn{ font-size:14px; }
  .whatsapp-widget{ bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 18px + var(--fab-gap)); }
}
@media (min-width:992px){
  .ai-assistant-btn{ bottom: calc(env(safe-area-inset-bottom,0px) + 24px); }
  .whatsapp-widget{ bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 34px + var(--fab-gap)); }
}


/* === LEFT-LOCK fix v4 ===
   Force IA + WhatsApp dans la même colonne à GAUCHE, IA en-dessous.
   Neutralise tout 'right:' ou 'transform' hérités.
*/
.ai-assistant-btn,
.whatsapp-widget,
.whatsapp-widget .whatsapp-btn{
  position: fixed !important;
  left: calc(env(safe-area-inset-left,0px) + 16px) !important;
  right: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  max-width: calc(100% - 32px);
  white-space: nowrap;
}
.whatsapp-widget{
  bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 16px + var(--fab-gap)) !important;
  z-index: 2147483646 !important;
  pointer-events: none;
}
.whatsapp-widget .whatsapp-btn{ pointer-events:auto; }
.ai-assistant-btn{
  bottom: calc(env(safe-area-inset-bottom,0px) + 16px) !important;
  z-index: 2147483647 !important;
}
@media (max-width: 380px){
  .ai-assistant-btn, .whatsapp-widget .whatsapp-btn{ font-size:14px; }
}


/* === NAV MOBILE FIX v5 ===
   Objectif: éviter les items "coupés" dans la barre sur fond bleu sur mobile.
   - <640px : on autorise le retour à la ligne (wrap) et on centre.
   - 641–920px : ruban défilable horizontalement (scroll) avec inertie.
   Ces règles sont volontairement génériques et n'impactent pas le desktop.
*/
@media (max-width: 640px){
  header nav, header .nav, nav .menu{ overflow:visible !important; }
  header nav ul, header .nav ul, nav .menu ul{
    display:flex !important; flex-wrap:wrap !important; justify-content:center !important;
    gap:8px 12px !important; white-space:normal !important; padding:10px 12px !important;
  }
  header nav li, header .nav li, nav .menu li{ display:inline-flex !important; }
  header nav a, header .nav a, nav .menu a{ display:inline-flex !important; padding:8px 10px !important; }
}
@media (min-width: 641px) and (max-width: 920px){
  header nav ul, header .nav ul, nav .menu ul{
    display:flex !important; flex-wrap:nowrap !important; gap:16px !important;
    overflow-x:auto !important; white-space:nowrap !important; -webkit-overflow-scrolling:touch;
    padding:10px 16px 12px !important;
    scrollbar-width:thin;
  }
  header nav li, header .nav li, nav .menu li{ flex:0 0 auto !important; }
  /* Masque dégradé discret aux extrémités (indices de scroll) — optionnel */
  header nav ul::after{ content:''; flex:0 0 8px; }
}


/* === v6 FAB & NAV ALIGN === */
/* 1) Boutons flottants (gauche, empilés, sans chevauchement) */
:root{ --fab-gap:18px; --fab-size:46px; }
.ai-assistant-btn,
.whatsapp-widget,
.whatsapp-widget .whatsapp-btn{
  position: fixed !important;
  left: calc(env(safe-area-inset-left,0px) + 16px) !important;
  right: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  max-width: calc(100% - 32px);
  white-space: nowrap;
}
.ai-assistant-btn{
  bottom: calc(env(safe-area-inset-bottom,0px) + 14px) !important;
  height: var(--fab-size); line-height: var(--fab-size); padding: 0 14px;
  z-index: 2147483647; pointer-events:auto;
}
.whatsapp-widget{
  bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 14px + var(--fab-gap)) !important;
  z-index: 2147483646; pointer-events:none;
}
.whatsapp-widget .whatsapp-btn{
  height: var(--fab-size); line-height: var(--fab-size); padding: 0 14px;
  pointer-events:auto;
}
@media (max-width: 380px){
  :root{ --fab-size:42px; --fab-gap:16px; }
  .ai-assistant-btn, .whatsapp-widget .whatsapp-btn{ font-size:14px; }
  .ai-assistant-btn{ bottom: calc(env(safe-area-inset-bottom,0px) + 16px) !important; }
  .whatsapp-widget{ bottom: calc(env(safe-area-inset-bottom,0px) + var(--fab-size) + 18px + var(--fab-gap)) !important; }
}

/* 2) NAV mobile : grille 2 colonnes centrée (aucun item coupé) */
@media (max-width: 640px){
  header nav, header .nav, nav .menu{ overflow:visible !important; }
  header nav ul, header .nav ul, nav .menu ul{
    display:grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 14px 28px !important;
    justify-items: center !important;
    align-items: center !important;
    white-space: normal !important;
    margin: 0 !important; padding: 12px 16px !important; list-style: none !important;
  }
  header nav li, header .nav li, nav .menu li{
    width:100% !important; display:flex !important; justify-content:center !important;
  }
  header nav a, header .nav a, nav .menu a{
    display:block !important; text-align:center !important;
    line-height:1.2 !important; letter-spacing:.2px !important;
    padding: 8px 6px !important;
  }
}


/* === v9 Split FABs (Left IA / Right WhatsApp) === */
:root{ --fab-gap:16px; --fab-size:46px; }
.ai-assistant-btn,
.whatsapp-widget .whatsapp-btn{
  position: fixed !important;
  bottom: calc(env(safe-area-inset-bottom,0px) + 16px) !important;
  height: var(--fab-size); line-height: var(--fab-size);
  padding: 0 14px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: .5rem;
  white-space: nowrap; box-shadow: 0 8px 24px rgba(0,0,0,.18);
  z-index: 2147483647;
  max-width: 46vw; overflow: hidden; text-overflow: ellipsis;
}
.ai-assistant-btn{
  left: calc(env(safe-area-inset-left,0px) + 16px) !important;
  right: auto !important; transform: none !important;
}
.whatsapp-widget{ position: fixed !important; right: calc(env(safe-area-inset-right,0px) + 16px) !important; left: auto !important; bottom: 0 !important; z-index: 2147483646; }
.whatsapp-widget .whatsapp-btn{
  right: calc(env(safe-area-inset-right,0px) + 16px) !important;
  left: auto !important; transform: none !important;
  bottom: calc(env(safe-area-inset-bottom,0px) + 16px) !important;
}
/* Tiny phones: shrink text to avoid center collision */
@media (max-width:380px){
  :root{ --fab-size:42px; }
  .ai-assistant-btn, .whatsapp-widget .whatsapp-btn{ font-size:14px; max-width: 44vw; }
}


/* v15 service-hero adjustments */
@media (min-width: 768px){
  .service-hero{ margin:28px auto 18px; max-width:1024px; padding:32px 28px; }
  .service-hero .navgrid{ grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px 18px; }
}
@media (min-width: 1100px){
  .service-hero{ max-width:1160px; }
}


/* v17 service-hero layout */
@media (min-width: 768px){ .service-hero{ margin:28px auto 18px; max-width:1024px; padding:32px 28px;}
.service-hero .navgrid{ grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px 18px;} }
@media (min-width: 1100px){ .service-hero{ max-width:1160px; } }
