/* ══ RESPONSIVE ══ */

@media(max-width:1024px){
  .blog-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:900px){
  .nav-links{display:none!important}
  nav{height:64px;padding:0 3%}
  .logo{font-size:1.3rem;gap:8px}
  .logo-ring{width:32px;height:32px}
  .nav-tel{font-size:1rem;font-weight:800;padding:10px 14px;white-space:nowrap;letter-spacing:.02em}
  .burger-btn{display:flex;align-items:center}
  .hero-section{grid-template-columns:1fr}
  .hero-right{display:flex;padding:0 4% 40px;justify-content:center}
  .hero-section{margin-top:76px!important}
  .pourquoi-section{grid-template-columns:1fr}
  .contact-section{grid-template-columns:1fr}
  .srv-grid{grid-template-columns:1fr 1fr}
  .vs-grid{grid-template-columns:1fr 1fr!important}
}
@media(min-width:901px){
  .mobile-menu{display:none!important}
  .burger-btn{display:none!important}
}

@media(max-width:800px){
  .tarifs-grid{grid-template-columns:1fr}
  .av-grid3{grid-template-columns:1fr}
  .vs-grid{grid-template-columns:1fr 1fr}
  .blog-grid{grid-template-columns:1fr}
}

@media(max-width:768px){
  body{padding-bottom:70px}
  .hero-section{padding-top:64px;min-height:auto}
  .hero-left{padding:80px 5% 60px 5%}
  h1{font-size:clamp(2.2rem,8vw,3.2rem)}
  .hero-btns{flex-direction:column;gap:10px}
  .btn-r,.btn-o{width:100%;justify-content:center;text-align:center}
  #map{height:300px}
  .pourquoi-section{grid-template-columns:1fr;gap:40px;padding:60px 5%}
  .contact-section{grid-template-columns:1fr;gap:40px}
  .frow{grid-template-columns:1fr}
  .trust{gap:1rem;padding:10px 4%}
  .ti{font-size:.7rem}
  .ztag{font-size:.75rem;padding:6px 12px}
  .geo-cta{padding:14px 30px;font-size:1.1rem}
  .float-btn{bottom:74px!important;right:12px!important}
  .wa-float{bottom:185px!important;right:12px!important}
  .ig-float{bottom:134px!important;right:12px!important}
  .footer-grid{grid-template-columns:1fr}
  h1,h2,h3,h4,p,a,span,li,td,th,label{word-wrap:normal;overflow-wrap:normal;-webkit-hyphens:none;hyphens:none}
  form,.cform{width:100%!important;max-width:100%!important}
  .exit-box,.popup{max-width:95vw!important;max-height:90vh!important;overflow-y:auto!important}
  .breadcrumb{padding-top:80px}
}

@media(max-width:550px){
  .srv-grid{grid-template-columns:1fr}
}

@media(max-width:500px){
  .bsep,.bsub2{display:none}
  .bandeau a{font-size:1.2rem}
  .bandeau{height:62px}
  .wa-float{bottom:180px!important;right:12px!important}
  .ig-float{bottom:130px!important;right:12px!important}
  .vs-grid{grid-template-columns:1fr!important}
}

@media(max-width:480px){
  body{padding-bottom:66px!important}
  .wa-float a,.ig-float a{padding:9px 14px!important;font-size:.75rem!important}
  .wa-float svg,.ig-float svg{width:15px!important;height:15px!important}
  .wa-float{bottom:170px!important;right:10px!important}
  .ig-float{bottom:124px!important;right:10px!important}
  nav{height:58px!important;padding:0 3%!important}
  .logo{font-size:1rem!important}
  .logo-ring{width:30px!important;height:30px!important}
  .nav-tel{font-size:.82rem!important;padding:8px 10px!important;border-radius:6px!important}
  .hero-left{padding:66px 4% 40px!important}
  h1{font-size:1.8rem!important;line-height:1.12!important}
  .hero-p{font-size:.88rem!important}
  .eyebrow .ey-txt{font-size:.6rem!important}
  .btn-r{padding:14px 20px!important;font-size:.88rem!important}
  .btn-o{padding:14px 20px!important;font-size:.88rem!important}
  .google-badge{padding:7px 12px!important;gap:8px!important}
  .bandeau{height:56px!important}
  .bandeau a{font-size:1rem!important;gap:8px!important}
  .slbl{font-size:.62rem!important}
  h2.st{font-size:1.5rem!important}
  .svc{padding:24px 18px!important}
  .tarif-card{padding:24px 18px!important}
  .tarif-prix{font-size:1.6rem!important}
  .trust{padding:10px 3%!important;gap:.8rem!important}
  .ti{font-size:.65rem!important;gap:5px!important}
  .faq-list{max-width:100%!important}
  .faq-q{font-size:.88rem!important}
  .contact-section{padding:50px 3%!important;gap:30px!important}
  .cform{padding:22px 16px!important}
  .ztag{padding:8px 12px!important;font-size:.75rem!important}
  #map{height:260px!important}
  .ville-hero{padding:80px 4% 40px!important;min-height:auto!important}
  .ville-h1{font-size:1.7rem!important}
  .ville-desc{font-size:.88rem!important}
  .ville-services{padding:40px 3%!important}
  .ville-services h2{font-size:1.4rem!important}
  .vs-grid{grid-template-columns:1fr!important}
  .ville-avis{padding:40px 3%!important}
  .mentions-inner{padding:80px 3% 60px!important}
  .exit-box{padding:28px 20px!important;width:94%!important}
  .exit-box h3{font-size:1.4rem!important}
  footer{flex-direction:column;text-align:center;gap:8px}
  .blog-card img{height:160px}
  .article-content{padding:30px 4% 60px}
  .page-content{padding:30px 4% 60px}
}

@media(max-width:400px){
  .logo{font-size:1.1rem}
  .nav-tel{font-size:.95rem;padding:9px 11px}
}

@media(max-width:360px){
  h1{font-size:1.55rem!important}
  h2.st{font-size:1.3rem!important}
  .btn-r,.btn-o{padding:12px 16px!important;font-size:.82rem!important}
  .nav-tel{font-size:.75rem!important;padding:7px 8px!important}
  .tarif-prix{font-size:1.4rem!important}
  .ville-h1{font-size:1.4rem!important}
  .bandeau{height:52px!important}
  .bandeau a{font-size:.92rem!important}
}

@supports(padding-bottom:env(safe-area-inset-bottom)){
  .bandeau{padding-bottom:env(safe-area-inset-bottom)}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom))!important}
  nav{padding-top:env(safe-area-inset-top)}
}

@media(max-height:500px) and (orientation:landscape){
  .hero-section{min-height:auto!important}
  .hero-left{padding:70px 4% 30px!important}
  .ville-hero{min-height:auto!important;padding:70px 4% 30px!important}
  #map{height:220px!important}
}

@media print{
  .bandeau,.wa-float,.float-btn,nav,.exit-popup,.visitors-bar,.geoloc-bloc{display:none!important}
  body{padding-bottom:0!important}
  *{box-shadow:none!important}
}
