
/* === HOTFIX MOBILE (force override) === */
html, body { max-width:100% !important; overflow-x:hidden !important; }
main, .page, .content, .section { overflow-x:clip !important; padding-bottom:120px; }

/* Boutons flottants positionnés proprement */
.fab, .floating-cta { right:16px !important; bottom:24px !important; z-index:30 !important; }

@media (max-width: 768px){
  /* Masquer tout bouton téléphone "gros badge" dans l'en-tête */
  header a[href^="tel"],
  .header a[href^="tel"],
  .nav a[href^="tel"],
  .topbar a[href^="tel"],
  header [class*="call"], .header [class*="call"], .nav [class*="call"], .topbar [class*="call"],
  header [class*="phone"], .header [class*="phone"], .nav [class*="phone"], .topbar [class*="phone"],
  header .badge, .header .badge, .nav .badge, .topbar .badge {
    display:none !important;
  }

  /* Empiler les colonnes + neutraliser sticky/fixed de la sidebar */
  .sidebar, .right-col, .aside, .right, [class*="sidebar"], [class*="right-col"] {
    position:static !important;
    float:none !important;
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:24px 0 0 !important;
  }

  /* Listes de villes : sur plusieurs lignes et jamais en colonne infinie */
  .city-tags, .chips, .cities, .zones, .zones-list, .tags {
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    max-width:100% !important;
  }
  .city-tags a, .chips .chip, .cities a, .zones a, .zones-list a, .tags a {
    display:inline-flex !important;
    white-space:nowrap !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
}


/* === HOTFIX MOBILE v2 — Footer right column & chips === */
@media (max-width: 768px){
  footer, .site-footer { overflow-x:clip !important; }
  footer .grid, footer .row, footer .columns, footer [class*="grid"]{
    display:block !important; width:100% !important;
  }
  /* Forcer la colonne droite du footer à passer en pleine largeur */
  footer .sidebar, footer .right-col, footer .right, footer [class*="sidebar"], 
  footer [class*="right-col"], footer [class*="aside"] {
    position:static !important; float:none !important;
    width:100% !important; max-width:100% !important;
    margin:24px 0 0 !important; padding:0 !important;
  }
  /* Titres footer lisibles et à la ligne */
  footer h3, footer h4 { margin:0 0 10px !important; line-height:1.25 !important; word-break:break-word; }

  /* Pastilles/Chips de villes : wrap multi-ligne, pas de débordement */
  footer .city-tags, footer .chips, footer .cities, footer .zones, footer .zones-list, footer .tags {
    display:flex !important; flex-wrap:wrap !important; gap:8px !important; justify-content:flex-start !important;
    max-width:100% !important;
  }
  footer .city-tags a, footer .chips .chip, footer .cities a, footer .zones a, footer .zones-list a, footer .tags a {
    display:inline-flex !important; white-space:nowrap !important; max-width:100% !important;
    overflow:hidden !important; text-overflow:ellipsis !important;
  }

  /* Laisse un espace sous le contenu pour les boutons flottants */
  footer .container, footer, .site-footer { padding-bottom:96px !important; }
}


/* === Footer minimal (no cities served) === */
.site-footer { padding: 32px 0; }
@media (max-width:768px){
  .site-footer { padding-bottom: 120px; } /* leave space for floating CTAs */
}


/* === Reviews grid and CTA === */
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.review-card{border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:14px;background:#fff;color:#111}
.review-name{font-weight:700;margin-bottom:6px}
.review-stars{letter-spacing:1px}
.btn, .btn-primary{display:inline-block;padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:700}
.btn-review{background:#22c55e;color:#0b1a11;border:2px solid rgba(0,0,0,.06)}
.btn-review:hover{filter:brightness(1.05)}
.review-cta{margin-top:12px}

/* === Footer centered with inline SVG social icons === */
.site-footer{padding:32px 0;text-align:center}
.footer-social-title{font-weight:700;margin-bottom:8px}
.footer-social-icons{display:flex;gap:16px;justify-content:center;align-items:center;margin-bottom:10px}
.footer-social-icons a{display:inline-flex;line-height:0;transition:transform .18s ease}
.footer-social-icons a:hover{transform:scale(1.06)}

.icon-fb{width:32px;height:32px}
.icon-ig{width:32px;height:32px}

/* Facebook brand hover (slightly darker) */
.icon-fb svg .fb-fill{transition:fill .18s ease}
.icon-fb:hover svg .fb-fill{fill:#1558c0}

/* Instagram hover: subtle scale handled by link; gradient stays vivid */
.footer-mentions{opacity:.9}

/* Mobile adjustments */
@media(max-width:992px){.reviews-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){
  .reviews-grid{grid-template-columns:1fr}
  .site-footer{padding-bottom:120px} /* leave room for floating CTAs */
}


/* === Yellow Google star color === */
.review-stars, .stars, .rating-stars { color: #fbbc04; }
