*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:#102033;background:#fff}a{text-decoration:none;color:inherit}.container{max-width:1180px;margin:auto;padding:0 24px}.topbar{background:#07111a;color:#fff;display:flex;justify-content:center;gap:35%;padding:9px 20px;font-weight:700;font-size:14px}.navbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(0,0,0,.06);display:flex;justify-content:space-between;align-items:center;padding:18px max(24px,calc((100vw - 1180px)/2 + 24px))}.brand{display:flex;align-items:center;gap:14px}.brand span{background:linear-gradient(135deg,#0d74b8,#38c5df);color:white;border-radius:14px;padding:13px 12px;font-weight:900}.brand strong{font-size:24px;letter-spacing:3px}.navlinks{display:flex;align-items:center;gap:24px;font-weight:800}.navlinks a{color:#1a2a39}.nav-cta,.btn.primary{background:linear-gradient(135deg,#0865ad,#37c2dc);color:white!important;border-radius:16px;padding:15px 24px;box-shadow:0 14px 30px rgba(22,143,202,.25)}.mobile-menu{display:none;border:0;background:#eef6fb;border-radius:12px;padding:10px 13px;font-size:22px}.hero{position:relative;min-height:720px;background:linear-gradient(135deg,#07111a,#123c5d 65%,#1e7fb4);color:white;display:flex;align-items:center;overflow:hidden}.hero:after{content:"";position:absolute;right:-160px;top:-120px;width:620px;height:620px;border-radius:50%;background:rgba(54,194,220,.18);filter:blur(10px)}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .8fr;gap:70px;align-items:center}.badge,.mini-title,.section-head span{display:inline-block;color:#22bdec;letter-spacing:4px;text-transform:uppercase;font-weight:900;font-size:13px}.hero h1{font-size:72px;line-height:1.02;margin:24px 0}.hero p{font-size:21px;line-height:1.65;max-width:700px;opacity:.94}.hero-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;cursor:pointer;font-weight:900}.btn.light{background:white;color:#07111a;border-radius:16px;padding:15px 24px}.trust-row{display:flex;gap:34px;margin-top:48px}.trust-row strong{display:block;font-size:34px}.trust-row span{font-weight:700;opacity:.85}.hero-card{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.24);border-radius:30px;padding:38px;box-shadow:0 30px 80px rgba(0,0,0,.22);transform:translateY(18px)}.hero-card h2{font-size:32px}.hero-card li{margin:14px 0;font-weight:800}.process{margin-top:-70px;position:relative;z-index:4}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.process article,.service-card,.review,.quote-form,.review-summary,.zone-box{background:white;border-radius:24px;padding:28px;box-shadow:0 18px 50px rgba(16,32,51,.09);border:1px solid #e4eff6}.process span{color:#20b9e8;font-weight:900}.section{padding:95px 0}.soft,.zone,.contact{background:#f3f8fc}.section-head{max-width:780px;margin-bottom:45px}.section-head h2,.about h2,.zone h2,.contact h2{font-size:58px;line-height:1.04;margin:18px 0;color:#1c2b39}.section-head p{font-size:19px;color:#607284}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.service-card{min-height:220px;transition:.25s}.service-card:hover{transform:translateY(-8px);box-shadow:0 24px 65px rgba(16,32,51,.14)}.icon{font-size:34px}.service-card h3{font-size:24px}.service-card p,.about p,.zone p,.contact p{font-size:17px;line-height:1.55;color:#33485c}.about-grid{display:grid;grid-template-columns:.9fr 1fr;gap:70px;align-items:center}.about-visual{height:380px;position:relative}.floating{position:absolute;border-radius:28px;color:white;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:0 20px 55px rgba(0,0,0,.18)}.one{left:0;top:70px;width:320px;height:170px;background:linear-gradient(135deg,#0e76b7,#31c6dc)}.two{right:40px;top:20px;width:270px;height:150px;background:#123c5d}.three{left:180px;bottom:35px;width:300px;height:150px;background:#28abc4}.about-points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}.about-points div{background:#eef7fc;padding:16px;border-radius:16px;font-weight:800}.zone-box{display:grid;grid-template-columns:1fr .8fr;gap:40px;align-items:center;background:#eef6fb}.chips{display:flex;gap:14px;flex-wrap:wrap}.chips span{background:white;border:1px solid #cfe5f2;color:#0865ad;border-radius:999px;padding:12px 18px;font-weight:900}.stats{background:#07111a;color:white;padding:50px 0}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;gap:20px}.stats strong{display:block;color:#27c0e3;font-size:42px}.stats span{font-weight:800}.real-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.real-grid article{min-height:250px;border-radius:24px;background-size:cover;background-position:center;position:relative;overflow:hidden}.real-grid article:before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,.1))}.real-grid div{position:absolute;bottom:22px;left:22px;color:white}.real-grid span{color:#22c5ee;font-weight:900}.real-grid h3{font-size:26px;margin:8px 0}.cta-band{background:linear-gradient(135deg,#0b67aa,#07111a);color:white;padding:70px 0}.cta-grid{display:grid;grid-template-columns:1fr .9fr auto;gap:30px;align-items:center}.cta-grid h2{font-size:38px;margin:0}.review-summary{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px;gap:20px}.review-summary strong{font-size:22px}.review-carousel{position:relative}.review-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;overflow:hidden;scroll-behavior:smooth;padding:5px 0 10px}.review{min-height:230px}.review-top{display:flex;align-items:center;gap:14px}.avatar{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-weight:900;font-size:20px}.green{background:#80bd4d}.blue{background:#13a5b8}.brown{background:#865441}.teal{background:#089e94}.purple{background:#8e34b7}.orange{background:#d96c37}.review h3{font-size:16px;margin:0}.review b{color:#1b7dea}.review small{color:#64788a}.stars{color:#ffac00;margin:18px 0;font-size:18px}.review-arrow{position:absolute;top:42%;z-index:3;border:0;border-radius:50%;background:#0865ad;color:white;width:48px;height:48px;font-size:32px;box-shadow:0 12px 30px rgba(0,0,0,.2);cursor:pointer}.review-arrow.left{left:-24px}.review-arrow.right{right:-24px}.contact-grid{display:grid;grid-template-columns:1fr .9fr;gap:70px;align-items:start}.contact-list{display:grid;gap:14px;margin-top:28px;font-weight:800}.quote-form{display:grid;gap:16px}.quote-form label{font-weight:800}.quote-form input,.quote-form textarea,.quote-form select{width:100%;border:1px solid #cfe1ec;border-radius:14px;padding:14px;margin-top:8px;font-size:16px}.quote-form button{width:100%;padding:16px}.footer{background:#07111a;color:white;padding:26px 0}.footer-grid{display:flex;justify-content:space-between}.chatbot{position:fixed;right:22px;bottom:22px;z-index:90}.chatbot-button{border:0;background:linear-gradient(135deg,#0865ad,#37c2dc);color:white;border-radius:999px;padding:14px 18px;font-weight:900;box-shadow:0 18px 45px rgba(0,0,0,.22);cursor:pointer;display:flex;gap:10px;align-items:center}.chat-window{display:none;width:360px;max-width:calc(100vw - 35px);height:520px;background:white;border-radius:24px;overflow:hidden;box-shadow:0 25px 80px rgba(0,0,0,.25);border:1px solid #dbe9f2}.chat-window.open{display:flex;flex-direction:column}.chat-header{background:#07111a;color:white;padding:18px;display:flex;justify-content:space-between}.chat-header small{display:block;color:#9fdff0}.chat-header button{background:transparent;border:0;color:white;font-size:28px;cursor:pointer}.chat-messages{flex:1;padding:16px;overflow:auto;background:#f5f9fc}.msg{padding:12px 14px;border-radius:16px;margin:10px 0;line-height:1.4}.bot{background:white;border:1px solid #dbe9f2}.user{background:#dff3fb;margin-left:38px}.quick-questions{display:flex;gap:8px;flex-wrap:wrap;padding:10px;background:#fff}.quick-questions button{border:1px solid #cfe1ec;background:#eef7fc;border-radius:999px;padding:8px 10px;font-weight:800;cursor:pointer}.chat-input{display:flex;border-top:1px solid #e1edf4}.chat-input input{flex:1;border:0;padding:15px}.chat-input button{border:0;background:#0865ad;color:white;padding:0 14px;font-weight:900}@media(max-width:900px){.topbar{display:none}.navlinks{display:none;position:absolute;top:78px;left:18px;right:18px;background:white;border-radius:20px;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.15);flex-direction:column}.navlinks.open{display:flex}.mobile-menu{display:block}.hero{min-height:auto;padding:90px 0}.hero-grid,.about-grid,.zone-box,.contact-grid,.cta-grid{grid-template-columns:1fr}.hero h1,.section-head h2,.about h2,.zone h2,.contact h2{font-size:42px}.process{margin-top:0}.process-grid,.service-grid,.real-grid,.stats-grid{grid-template-columns:1fr}.review-track{grid-auto-columns:100%}.review-summary{flex-direction:column;align-items:flex-start}.footer-grid{flex-direction:column;gap:10px}.trust-row{flex-direction:column}.about-points{grid-template-columns:1fr}}
.site-logo{
width:72px;
height:72px;
object-fit:contain;
filter:drop-shadow(0 10px 20px rgba(0,0,0,.15));
}
.service-icon-img{
width:42px;
height:42px;
object-fit:contain;
display:block;
margin-bottom:12px;
}
/* === Amélioration logo + avis Google === */
.brand strong{display:none!important}
.site-logo.big-logo,
.site-logo{
width:160px!important;
height:86px!important;
object-fit:contain!important;
filter:none!important;
}
.brand{gap:0!important}
.navbar{min-height:96px}
.reviews{background:#fff}
.reviews .section-head h2{
font-size:56px;
letter-spacing:-1px;
}
.review-summary{
background:#fff;
border:1px solid #e5eaf0;
box-shadow:0 10px 30px rgba(0,0,0,.06);
border-radius:18px;
padding:24px 28px;
}
.review-summary strong{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
font-size:22px;
}
.google-word{
font-size:25px;
font-weight:800;
letter-spacing:-1px;
margin-right:2px;
}
.g-blue{color:#4285F4}.g-red{color:#DB4437}.g-yellow{color:#F4B400}.g-green{color:#0F9D58}
.rating-number{
font-size:24px;
color:#111827;
margin-left:8px;
}
.stars-inline{
color:#fbbc04;
letter-spacing:1px;
font-size:24px;
}
.review-track{
grid-auto-columns:calc((100% - 48px)/3);
align-items:stretch;
padding:8px 2px 18px;
}
.review{
border:1px solid #e7eaee;
border-radius:14px;
box-shadow:0 3px 12px rgba(0,0,0,.06);
background:#fff;
min-height:245px;
padding:22px;
}
.review-top{align-items:center}
.avatar{
width:45px;
height:45px;
font-size:20px;
}
.review h3{
font-size:15px;
font-weight:800;
color:#202124;
line-height:1.2;
}
.review small{
color:#5f6368;
font-size:13px;
}
.review small:before{
content:"G";
display:inline-flex;
align-items:center;
justify-content:center;
width:16px;
height:16px;
color:#4285F4;
background:#fff;
border-radius:50%;
font-weight:900;
font-size:13px;
margin-right:5px;
}
.verified{
background:#1a73e8;
color:white!important;
display:inline-flex;
align-items:center;
justify-content:center;
width:15px;
height:15px;
border-radius:50%;
font-size:10px;
margin-left:3px;
}
.stars{
color:#fbbc04!important;
font-size:19px;
letter-spacing:1px;
margin:18px 0 14px;
}
.review p{
color:#202124;
line-height:1.45;
font-size:16px;
}
.review-arrow{
background:#1a73e8!important;
width:44px;
height:44px;
font-size:30px;
}
.review-arrow.left{left:-22px}
.review-arrow.right{right:-22px}
@media(max-width:900px){
.site-logo.big-logo,.site-logo{
width:125px!important;
height:68px!important;
}
.navbar{min-height:82px}
.review-track{grid-auto-columns:100%}
}
/* ===== Logo plus visible ===== */
.site-logo,
.site-logo.big-logo{
width:220px !important;
height:95px !important;
object-fit:contain;
filter: drop-shadow(0 2px 8px rgba(0,0,0,.08));
}
.navbar{
padding: 10px 0;
}
.brand{
margin-right:20px;
}
/* ===== Bouton chatbot plus professionnel ===== */
.chat-toggle{
min-width:190px !important;
border-radius:18px !important;
font-weight:700 !important;
letter-spacing:.2px;
box-shadow:0 10px 30px rgba(0,0,0,.15);
}
/* === Corrections demandées === */
.site-logo,
.site-logo.big-logo{
width:185px!important;
height:78px!important;
object-fit:contain!important;
}
.review-summary{
padding:18px 26px!important;
min-height:auto!important;
display:flex!important;
align-items:center!important;
}
.review-summary p{
display:none!important;
}
.review-summary strong{
margin:0!important;
}
.google-word{
margin-right:8px!important;
}
.rating-number{
margin-left:4px!important;
}
.stars-inline{
font-size:22px!important;
}
.contact-list a[href*="amb-services77"]{
display:none!important;
}
.quote-form small{
display:none!important;
}
/* =========================================================
ANIMATIONS PREMIUM AMB SERVICES
========================================================= */
:root{
--amb-blue:#0865ad;
--amb-cyan:#37c2dc;
--amb-dark:#07111a;
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
/* Fond vivant léger */
.hero,.soft,.zone,.reviews{
position:relative;
overflow:hidden;
}
.hero:before,.soft:before,.zone:before,.reviews:before{
content:"";
position:absolute;
width:420px;
height:420px;
border-radius:999px;
background:radial-gradient(circle, rgba(55,194,220,.22), transparent 62%);
top:-160px;
right:-130px;
pointer-events:none;
animation:ambFloatBlob 9s ease-in-out infinite alternate;
}
.hero:after,.soft:after{
content:"";
position:absolute;
width:300px;
height:300px;
border-radius:999px;
background:radial-gradient(circle, rgba(8,101,173,.16), transparent 65%);
left:-120px;
bottom:-120px;
pointer-events:none;
animation:ambFloatBlob 11s ease-in-out infinite alternate-reverse;
}
@keyframes ambFloatBlob{
from{transform:translate3d(0,0,0) scale(1)}
to{transform:translate3d(-35px,28px,0) scale(1.12)}
}
/* Entrée haut de page */
.topbar{animation:ambDrop .65s ease both}
.navbar{
animation:ambDrop .75s ease .08s both;
transition:padding .28s ease, box-shadow .28s ease, background .28s ease, min-height .28s ease;
}
.navbar.nav-scrolled{
position:sticky;
top:0;
z-index:100;
background:rgba(255,255,255,.92);
backdrop-filter:blur(16px);
box-shadow:0 12px 34px rgba(7,17,26,.10);
min-height:78px;
}
.navbar.nav-scrolled .site-logo{height:62px!important;width:160px!important}
@keyframes ambDrop{
from{opacity:0;transform:translateY(-24px)}
to{opacity:1;transform:translateY(0)}
}
/* Logo vivant mais propre */
.brand .site-logo{
transform-origin:center;
transition:transform .35s ease, filter .35s ease;
}
.brand:hover .site-logo{
transform:scale(1.045) rotate(-1deg);
filter:drop-shadow(0 12px 22px rgba(8,101,173,.18));
}
/* Menu animé */
.navlinks a{
position:relative;
transition:color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.navlinks a:not(.nav-cta):after{
content:"";
position:absolute;
left:0;
right:100%;
bottom:-7px;
height:3px;
border-radius:20px;
background:linear-gradient(90deg,var(--amb-blue),var(--amb-cyan));
transition:right .28s ease;
}
.navlinks a:not(.nav-cta):hover{color:var(--amb-blue);transform:translateY(-2px)}
.navlinks a:not(.nav-cta):hover:after{right:0}
.nav-cta,.btn.primary,.chatbot-button{
background-size:180% 180%!important;
animation:ambGradientMove 4.5s ease infinite;
}
.nav-cta:hover,.btn:hover,.chatbot-button:hover{
transform:translateY(-3px) scale(1.02);
}
@keyframes ambGradientMove{
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
/* Hero plus vivant */
.hero-content .badge{animation:ambFadeUp .7s ease .15s both}
.hero-content h1{animation:ambFadeUp .75s ease .28s both}
.hero-content p{animation:ambFadeUp .75s ease .42s both}
.hero-actions{animation:ambFadeUp .75s ease .56s both}
.trust-row{animation:ambFadeUp .75s ease .7s both}
.hero-card{
animation:ambCardIn .9s cubic-bezier(.18,.89,.32,1.28) .42s both;
transition:transform .35s ease, box-shadow .35s ease;
}
.hero-card:hover{transform:translateY(-8px) rotate(.4deg);box-shadow:0 28px 70px rgba(7,17,26,.18)}
@keyframes ambFadeUp{
from{opacity:0;transform:translateY(26px)}
to{opacity:1;transform:translateY(0)}
}
@keyframes ambCardIn{
from{opacity:0;transform:translateY(35px) scale(.96)}
to{opacity:1;transform:translateY(0) scale(1)}
}
/* Révélations au scroll */
.reveal{
opacity:0;
transform:translateY(35px);
transition:opacity .75s ease, transform .75s cubic-bezier(.19,1,.22,1);
transition-delay:var(--delay,0ms);
}
.reveal.is-visible{
opacity:1;
transform:translateY(0);
}
.reveal-left{transform:translateX(-45px)}
.reveal-right{transform:translateX(45px)}
.reveal-left.is-visible,.reveal-right.is-visible{transform:translateX(0)}
/* Cartes avec effet premium */
.service-card,.process article,.review,.real-grid article,.stats-grid>div,.zone-box,.contact-card,.quote-form{
transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease, filter .35s ease;
will-change:transform;
}
.service-card:hover,.process article:hover,.review:hover,.stats-grid>div:hover,.contact-card:hover,.quote-form:hover{
transform:translateY(-10px);
box-shadow:0 24px 60px rgba(8,101,173,.14)!important;
border-color:rgba(55,194,220,.55)!important;
}
.service-card:hover .icon,.service-card:hover .service-icon-img{
animation:ambIconPop .55s ease both;
}
@keyframes ambIconPop{
0%{transform:scale(1) rotate(0)}
45%{transform:scale(1.16) rotate(-5deg)}
100%{transform:scale(1) rotate(0)}
}
/* Réalisations : zoom image + voile propre */
.real-grid article{
overflow:hidden;
position:relative;
background-size:105%!important;
background-position:center!important;
}
.real-grid article:before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(7,17,26,.04),rgba(7,17,26,.54));
opacity:.82;
transition:opacity .35s ease;
}
.real-grid article:hover{
transform:translateY(-9px) scale(1.015);
background-size:113%!important;
box-shadow:0 28px 70px rgba(7,17,26,.22)!important;
}
.real-grid article:hover:before{opacity:.62}
.real-grid article>div{position:relative;z-index:1;transition:transform .35s ease}
.real-grid article:hover>div{transform:translateY(-6px)}
/* Chiffres animés */
.stats-grid strong{display:inline-block;transition:transform .35s ease;color:var(--amb-blue)}
.stats-grid>div:hover strong{transform:scale(1.09)}
/* Avis : carrousel plus fluide */
.review-track{scroll-behavior:smooth;scroll-snap-type:x mandatory}
.review{scroll-snap-align:start}
.review-arrow{transition:transform .25s ease, box-shadow .25s ease}
.review-arrow:hover{transform:translateY(-50%) scale(1.08)!important;box-shadow:0 16px 35px rgba(26,115,232,.28)}
.stars,.stars-inline{animation:ambStarsGlow 2.4s ease-in-out infinite alternate}
@keyframes ambStarsGlow{
from{text-shadow:0 0 0 rgba(251,188,4,0)}
to{text-shadow:0 0 14px rgba(251,188,4,.45)}
}
/* Formulaire : focus moderne */
input,select,textarea{
transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
input:focus,select:focus,textarea:focus{
outline:none;
border-color:var(--amb-cyan)!important;
box-shadow:0 0 0 4px rgba(55,194,220,.16)!important;
transform:translateY(-1px);
}
/* Bouton assistance qui respire */
.chatbot-button:before{
content:"";
width:9px;height:9px;border-radius:50%;background:#40ffb0;
box-shadow:0 0 0 0 rgba(64,255,176,.65);
animation:ambPulse 1.8s infinite;
}
@keyframes ambPulse{
0%{box-shadow:0 0 0 0 rgba(64,255,176,.65)}
70%{box-shadow:0 0 0 12px rgba(64,255,176,0)}
100%{box-shadow:0 0 0 0 rgba(64,255,176,0)}
}
.chat-window.open{animation:ambChatIn .28s ease both}
@keyframes ambChatIn{
from{opacity:0;transform:translateY(20px) scale(.96)}
to{opacity:1;transform:translateY(0) scale(1)}
}
/* Mobile menu animé */
@media(max-width:900px){
.navlinks.open{animation:ambMobileMenu .28s ease both}
@keyframes ambMobileMenu{
from{opacity:0;transform:translateY(-14px) scale(.98)}
to{opacity:1;transform:translateY(0) scale(1)}
}
}
/* Respect accessibilité */
@media (prefers-reduced-motion: reduce){
*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.reveal{opacity:1!important;transform:none!important}
}
/* === Corrections finales : avis + formulaire contact === */
.hero-content{padding-bottom:35px!important;}
.trust-row{
position:relative!important;
z-index:8!important;
margin-top:38px!important;
margin-bottom:72px!important;
align-items:flex-start!important;
flex-wrap:wrap!important;
}
.trust-row>div{min-width:120px!important;}
.trust-row strong{line-height:1!important;}
.trust-row span{
display:block!important;
line-height:1.15!important;
margin-top:6px!important;
}
.process{margin-top:-42px!important;}
/* Retire toutes les animations/effets du formulaire de contact */
.quote-form,
.quote-form:hover,
.quote-form.reveal,
.quote-form.reveal.is-visible{
animation:none!important;
transition:none!important;
transform:none!important;
opacity:1!important;
will-change:auto!important;
}
.quote-form input,
.quote-form textarea,
.quote-form select,
.quote-form button{
animation:none!important;
}
@media(max-width:900px){
.trust-row{margin-bottom:35px!important;gap:18px!important;}
.process{margin-top:0!important;}
}
/* === Retouche finale avis + formulaire === */
.review small{
color:#5f6f80!important;
font-weight:700!important;
}
.quote-form,
.quote-form:hover,
.quote-form.reveal,
.quote-form.reveal.is-visible{
animation:none!important;
transition:none!important;
transform:none!important;
opacity:1!important;
will-change:auto!important;
}
.quote-form .btn,
.quote-form .btn.primary,
.quote-form button,
.quote-form input,
.quote-form textarea,
.quote-form select{
animation:none!important;
}
.quote-form:hover{
box-shadow:0 18px 50px rgba(16,32,51,.09)!important;
border-color:#e4eff6!important;
}
/* === AMB retouche pro : footer, services, couleurs, robot === */
:root{--amb-deep:#061521;--amb-blue2:#0a75b8;--amb-cyan2:#53d6ea;--amb-soft:#eef7fb;--amb-ink:#102033;}
body{background:linear-gradient(180deg,#ffffff 0%,#f3f9fd 42%,#eef6fb 100%)!important;}
.soft,.contact{background:linear-gradient(135deg,#eef7fb 0%,#f8fcff 48%,#eaf6fb 100%)!important;}
.section-head span,.mini-title,.badge{color:#0aa9d1!important;}
.navbar{background:rgba(255,255,255,.96)!important;border-bottom:1px solid rgba(10,117,184,.08)}
/* Présentation prestations plus explicite */
.enhanced-services{align-items:stretch;}
.enhanced-services .service-card{position:relative;overflow:hidden;min-height:330px;padding:30px 28px 26px;border:1px solid rgba(10,117,184,.12);background:linear-gradient(145deg,#ffffff 0%,#f8fcff 100%);}
.enhanced-services .service-card:before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:linear-gradient(90deg,var(--amb-blue2),var(--amb-cyan2));opacity:.9;}
.enhanced-services .service-card:after{content:"";position:absolute;right:-70px;top:-70px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(83,214,234,.22),transparent 68%);}
.service-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:14px;}
.service-top span{font-weight:900;color:#0a75b8;background:#eef9fd;border:1px solid #cceff7;padding:8px 12px;border-radius:999px;font-size:13px;}
.service-card .icon{width:58px;height:58px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#eef8fd,#ffffff);box-shadow:inset 0 0 0 1px #d9edf6;font-size:30px;}
.service-icon-img{max-width:42px;max-height:42px;object-fit:contain;filter:contrast(1.1);}
.enhanced-services .service-card h3{font-size:25px;line-height:1.15;margin:0 0 14px;color:#112235;}
.enhanced-services .service-card p{font-size:16.5px;line-height:1.55;margin:0 0 18px;color:#3b5065;}
.enhanced-services .service-card ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:9px;}
.enhanced-services .service-card li{font-weight:800;color:#24384d;background:#f0f8fc;border:1px solid #d8edf6;border-radius:12px;padding:10px 12px;}
.enhanced-services .service-card li:before{content:"✓";color:#0a9fc8;font-weight:900;margin-right:8px;}
.service-plomberie,.service-clim{box-shadow:0 24px 65px rgba(10,117,184,.12)!important;}
/* Retire le G en trop dans chaque avis */
.review small:before{content:none!important;display:none!important;}
.review small{padding-left:0!important;}
/* Footer restauré et lisible */
.footer{background:linear-gradient(135deg,#061521 0%,#09263b 55%,#073d5c 100%)!important;color:#fff!important;padding:34px 0!important;border-top:1px solid rgba(255,255,255,.08);}
.footer-pro{display:flex!important;justify-content:space-between!important;gap:24px!important;align-items:center!important;}
.footer-pro>div{display:grid;gap:7px;}
.footer-pro strong{font-size:22px;letter-spacing:.4px;}
.footer-pro span{color:#d9edf6;font-weight:800;}
/* Robot assistant plus sérieux */
.chatbot-button{display:grid!important;grid-template-columns:auto 1fr;grid-template-areas:"icon title" "icon sub";align-items:center;text-align:left;gap:0 10px!important;min-width:220px!important;padding:13px 18px!important;background:linear-gradient(135deg,#06395d,#0c83c6 60%,#35c7de)!important;border:1px solid rgba(255,255,255,.25)!important;}
.chatbot-button:before{display:none!important;}
.robot-face{grid-area:icon;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:white;color:#0b6fad;font-size:24px;box-shadow:0 8px 18px rgba(0,0,0,.16);}
.chatbot-button span:not(.robot-face){grid-area:title;font-size:15px;line-height:1.1;}
.chatbot-button em{grid-area:sub;font-style:normal;font-size:12px;opacity:.9;font-weight:800;}
.chat-window{border-radius:26px!important;border:1px solid rgba(10,117,184,.18)!important;box-shadow:0 30px 90px rgba(6,21,33,.28)!important;}
.chat-header{background:linear-gradient(135deg,#061521,#0b75b3)!important;}
.chat-title{display:flex;gap:12px;align-items:center;}
.robot-avatar{width:43px;height:43px;border-radius:50%;background:#fff;color:#0b6fad;display:flex;align-items:center;justify-content:center;font-size:24px;}
.bot.msg{border-color:#cfe9f5!important;background:#fff!important;}
.user.msg{background:linear-gradient(135deg,#dff6fd,#eef9fd)!important;}
.quick-questions button:hover{background:#dff6fd;border-color:#65cfe5;}
/* Formulaire sans animation mais visuel propre */
.quote-form{background:#fff!important;border:1px solid #dcecf5!important;box-shadow:0 18px 50px rgba(16,32,51,.08)!important;}
.quote-form,.quote-form *{animation:none!important;}
@media(max-width:900px){.enhanced-services .service-card{min-height:auto}.footer-pro{flex-direction:column!important;align-items:flex-start!important}.chatbot{right:14px;bottom:14px}.chatbot-button{min-width:190px!important}}
/* === Correctif demandé : assistance sans tête de robot + footer compact === */
.footer{
padding:18px 0!important;
min-height:72px!important;
}
.footer-pro{
min-height:0!important;
align-items:center!important;
}
.footer-pro strong{
font-size:18px!important;
}
.footer-pro span{
font-size:13px!important;
line-height:1.35!important;
}
.chatbot{
right:22px!important;
bottom:16px!important;
}
.chatbot-button{
display:flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:center!important;
gap:2px!important;
min-width:185px!important;
min-height:54px!important;
padding:9px 18px!important;
border-radius:999px!important;
text-align:left!important;
}
.chatbot-button span{
font-size:15px!important;
line-height:1.1!important;
}
.chatbot-button em{
font-size:12px!important;
line-height:1.1!important;
}
.robot-face,.robot-avatar{
display:none!important;
}
.assistant-badge{
width:44px;
height:44px;
border-radius:14px;
display:flex;
align-items:center;
justify-content:center;
background:#fff;
color:#0b75b3;
font-weight:900;
letter-spacing:.8px;
}
@media(max-width:900px){
.footer{padding:18px 0 86px!important;}
.chatbot-button{min-width:165px!important;min-height:50px!important;padding:8px 15px!important;}
}
/* === Retouche visuelle pro : fondus, icônes, animation stable === */
:root{
--amb-navy:#08263b;
--amb-blue-pro:#0b73b7;
--amb-cyan-pro:#42c7d9;
--amb-ice:#f4fbfe;
--amb-border:#d7edf7;
}
body{
background:linear-gradient(180deg,#ffffff 0%,#f7fbfe 45%,#eef7fc 100%)!important;
}
.hero{
background:
radial-gradient(circle at 80% 10%,rgba(66,199,217,.20) 0%,transparent 34%),
linear-gradient(135deg,#061521 0%,#0b314c 50%,#0b73b7 100%)!important;
}
.soft,.zone,.contact,.reviews{
background:
linear-gradient(180deg,#f8fcff 0%,#eef7fc 100%)!important;
}
.soft:before,.soft:after,.zone:before,.reviews:before,.hero:before,.hero:after{
opacity:.45!important;
filter:blur(18px)!important;
}
.cta-band,.footer,.stats{
background:linear-gradient(135deg,#061521 0%,#0a2840 58%,#0b5f92 100%)!important;
}
.nav-cta,.btn.primary,.chatbot-button{
background:linear-gradient(135deg,#0a64a6 0%,#1594c2 58%,#35bfd7 100%)!important;
}
/* Icônes dessinées propres, sans emoji ni anciennes images */
.service-card .icon{
width:58px!important;height:58px!important;border-radius:16px!important;
background:linear-gradient(145deg,#ffffff,#edf8fd)!important;
border:1px solid var(--amb-border)!important;
box-shadow:0 10px 28px rgba(8,38,59,.07)!important;
}
.line-icon{position:relative;display:block;width:32px;height:32px;color:var(--amb-navy)}
.line-icon:before,.line-icon:after{content:"";position:absolute;box-sizing:border-box}
.pipe-icon:before{left:4px;top:8px;width:21px;height:14px;border:3px solid currentColor;border-right:0;border-radius:7px 0 0 7px}
.pipe-icon:after{right:2px;top:3px;width:10px;height:24px;border:3px solid currentColor;border-radius:3px}
.heat-icon:before{left:4px;top:7px;width:24px;height:20px;border:3px solid currentColor;border-radius:4px;background:repeating-linear-gradient(90deg,transparent 0 5px,currentColor 5px 7px,transparent 7px 11px)}
.heat-icon:after{left:6px;top:0;width:20px;height:9px;border-top:3px solid currentColor;border-radius:50%}
.clim-icon:before{left:3px;top:6px;width:26px;height:13px;border:3px solid currentColor;border-radius:5px}
.clim-icon:after{left:8px;top:22px;width:16px;height:8px;border-bottom:3px dotted currentColor;border-radius:0 0 12px 12px}
.vent-icon:before{left:4px;top:4px;width:24px;height:24px;border:3px solid currentColor;border-radius:50%;background:radial-gradient(circle at 50% 50%, currentColor 0 3px, transparent 4px)}
.vent-icon:after{left:7px;top:7px;width:18px;height:18px;border-top:4px solid currentColor;border-right:4px solid transparent;border-bottom:4px solid currentColor;border-left:4px solid transparent;border-radius:50%;transform:rotate(25deg);opacity:.95}
.bath-icon:before{left:3px;top:13px;width:25px;height:11px;border:3px solid currentColor;border-top:0;border-radius:0 0 12px 12px}
.bath-icon:after{left:8px;top:5px;width:14px;height:11px;border-left:3px solid currentColor;border-top:3px solid currentColor;border-radius:10px 0 0 0}
.pvc-icon:before{left:5px;top:7px;width:22px;height:18px;border:3px solid currentColor;border-radius:4px;transform:rotate(45deg)}
.pvc-icon:after{left:13px;top:1px;width:6px;height:30px;background:currentColor;border-radius:999px;transform:rotate(45deg);opacity:.9}
.tool-icon:before{left:5px;top:4px;width:22px;height:22px;border-left:4px solid currentColor;border-bottom:4px solid currentColor;transform:rotate(-45deg);border-radius:3px}
.tool-icon:after{right:3px;bottom:4px;width:14px;height:5px;background:currentColor;border-radius:999px;transform:rotate(45deg)}
.enhanced-services .service-card{
background:linear-gradient(145deg,#ffffff 0%,#f6fbfe 100%)!important;
border-color:rgba(11,115,183,.13)!important;
box-shadow:0 18px 48px rgba(8,38,59,.08)!important;
}
.enhanced-services .service-card:before{
height:4px!important;
background:linear-gradient(90deg,#0a64a6,#42c7d9)!important;
}
.enhanced-services .service-card:hover{
transform:translateY(-6px)!important;
box-shadow:0 22px 58px rgba(8,38,59,.12)!important;
}
/* À propos : remplacement des 3 pavés par cartes/icônes plus explicites */
.about-visual-pro{height:410px;display:grid;place-items:center;position:relative}
.about-visual-pro:before{
content:"";position:absolute;width:420px;height:280px;border-radius:42px;
background:linear-gradient(135deg,rgba(11,115,183,.10),rgba(66,199,217,.12));
filter:blur(0);transform:rotate(-4deg);
}
.about-card{
position:absolute;display:grid;grid-template-columns:auto 1fr;gap:8px 14px;align-items:center;
width:330px;padding:22px;border-radius:24px;color:#102033;
background:rgba(255,255,255,.92);border:1px solid rgba(11,115,183,.14);
box-shadow:0 22px 55px rgba(8,38,59,.13);
}
.about-card .line-icon{grid-row:1/3;color:#0a64a6;width:42px;height:42px;transform:scale(1.25)}
.about-card strong{font-size:20px;color:#08263b}
.about-card small{font-size:14px;color:#526b80;font-weight:800;line-height:1.3}
.about-card-plomberie{left:0;top:84px}
.about-card-chauffage{right:25px;top:28px}
.about-card-clim{left:120px;bottom:42px}
.floating{display:none!important}
/* Correction bug de jonglage aux bords du carrousel */
.review,.review:hover,.review-arrow,.review-arrow:hover{
will-change:auto!important;
}
.review:hover{
transform:translateY(-4px)!important;
}
.review-arrow{top:50%!important;transform:translateY(-50%)!important;transition:background .2s ease, box-shadow .2s ease!important}
.review-arrow:hover{transform:translateY(-50%)!important;background:#0b73b7!important;box-shadow:0 12px 26px rgba(11,115,183,.22)!important}
.review-track{overflow-x:hidden!important;overscroll-behavior-x:contain!important}
@media(max-width:900px){
.about-visual-pro{height:auto;display:grid;gap:16px;place-items:stretch}
.about-visual-pro:before{display:none}
.about-card{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:100%}
}
/* === Corrections responsive demandées : sans icônes services, about stable, titres lisibles === */
/* 1) Suppression des icônes des cartes prestations */
.enhanced-services .service-card .icon,
.enhanced-services .service-card .line-icon{
display:none!important;
}
.enhanced-services .service-top{
justify-content:flex-end!important;
min-height:34px!important;
margin-bottom:20px!important;
}
.enhanced-services .service-card{
padding:34px 28px 26px!important;
}
.enhanced-services .service-card h3{
margin-top:0!important;
}
/* 2) Bloc À propos refait sans chevauchement */
.about-visual-pro{
height:auto!important;
min-height:420px!important;
display:grid!important;
grid-template-columns:1fr!important;
align-content:center!important;
gap:18px!important;
padding:28px!important;
border-radius:34px!important;
background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(232,247,253,.92))!important;
border:1px solid rgba(11,115,183,.13)!important;
box-shadow:0 24px 70px rgba(8,38,59,.10)!important;
}
.about-visual-pro:before{
display:none!important;
}
.about-card{
position:relative!important;
left:auto!important;
right:auto!important;
top:auto!important;
bottom:auto!important;
width:100%!important;
display:block!important;
padding:22px 24px!important;
border-radius:22px!important;
background:rgba(255,255,255,.96)!important;
box-shadow:0 14px 34px rgba(8,38,59,.08)!important;
transform:none!important;
}
.about-card .line-icon{
display:none!important;
}
.about-card strong{
display:block!important;
font-size:22px!important;
margin-bottom:6px!important;
}
.about-card small{
display:block!important;
font-size:15px!important;
line-height:1.35!important;
}
.about-card:hover{
transform:none!important;
}
/* 3) Titres sur une ligne en écran large */
#realisations .section-head h2,
#avis .section-head h2{
white-space:nowrap!important;
font-size:clamp(38px,4.2vw,56px)!important;
line-height:1.05!important;
}
#avis .section-head,
#realisations .section-head{
max-width:none!important;
}
/* 4) Compatibilité tablette / portable */
@media (min-width:901px) and (max-width:1180px){
.service-grid,
.enhanced-services{
grid-template-columns:repeat(2,1fr)!important;
}
.about-grid{
grid-template-columns:1fr!important;
gap:34px!important;
}
.about-visual-pro{
min-height:auto!important;
grid-template-columns:repeat(3,1fr)!important;
padding:22px!important;
}
.about-card{
min-height:135px!important;
}
#realisations .section-head h2,
#avis .section-head h2{
font-size:clamp(34px,4.5vw,46px)!important;
}
}
@media (max-width:900px){
.enhanced-services .service-card{
padding:26px 22px!important;
}
.enhanced-services .service-top{
justify-content:flex-start!important;
margin-bottom:16px!important;
}
.enhanced-services .service-card h3{
font-size:24px!important;
}
.about-visual-pro{
min-height:auto!important;
padding:18px!important;
gap:14px!important;
}
.about-card{
padding:18px!important;
}
#realisations .section-head h2,
#avis .section-head h2{
white-space:normal!important;
font-size:clamp(30px,8vw,42px)!important;
}
.section-head h2,
.about h2,
.zone h2,
.contact h2{
word-break:normal!important;
overflow-wrap:normal!important;
}
}
@media (max-width:520px){
.container{width:min(100% - 28px,1180px)!important;}
.enhanced-services .service-card h3{
font-size:22px!important;
}
.enhanced-services .service-card p,
.enhanced-services .service-card li{
font-size:15px!important;
}
.review-summary{
flex-direction:column!important;
align-items:flex-start!important;
}
.review-summary .btn{
width:100%!important;
text-align:center!important;
}
.chat-window{
width:calc(100vw - 24px)!important;
height:min(520px, calc(100vh - 120px))!important;
}
}
/* =========================================================
CORRECTION DEMANDÉE : animations sécurisées + logo navbar
- Désactive les effets qui pouvaient trembler / jongler au survol ou au scroll.
- Garde le design actuel, mais sans mouvement instable.
- Décale et agrandit légèrement le logo sans toucher la structure du menu.
========================================================= */
html{scroll-behavior:auto!important;}
*,*::before,*::after{
animation:none!important;
transition:none!important;
}
.reveal,
.reveal.is-visible,
.hero-content .badge,
.hero-content h1,
.hero-content p,
.hero-actions,
.trust-row,
.hero-card,
.service-card,
.process article,
.review,
.real-grid article,
.about-card,
.floating,
.about-visual-pro,
.chat-window.open{
opacity:1!important;
transform:none!important;
filter:none!important;
}
.service-card:hover,
.process article:hover,
.review:hover,
.real-grid article:hover,
.about-card:hover,
.navlinks a:hover,
.brand:hover .site-logo,
.hero-card:hover{
transform:none!important;
filter:none!important;
}
.navbar{
padding-left:max(44px,calc((100vw - 1180px)/2 + 44px))!important;
}
.brand{
margin-left:10px!important;
}
.site-logo,
.site-logo.big-logo{
height:76px!important;
width:auto!important;
max-width:210px!important;
object-fit:contain!important;
}
.navbar.nav-scrolled .site-logo,
.navbar.nav-scrolled .site-logo.big-logo{
height:76px!important;
width:auto!important;
max-width:210px!important;
}
.review-track{scroll-behavior:auto!important;}
.review-arrow{transform:translateY(-50%)!important;}
@media(max-width:900px){
.navbar{
padding-left:22px!important;
padding-right:18px!important;
}
.brand{margin-left:0!important;}
.site-logo,.site-logo.big-logo{
height:60px!important;
max-width:170px!important;
}
.navbar.nav-scrolled .site-logo,
.navbar.nav-scrolled .site-logo.big-logo{
height:60px!important;
max-width:170px!important;
}
}
@media(max-width:520px){
.site-logo,.site-logo.big-logo{
height:52px!important;
max-width:145px!important;
}
}
/* ===== Sécurité / stabilité globale ===== */
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}
img{max-width:100%;height:auto}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
input,textarea,select{font:inherit}
/* On neutralise les animations instables et les mouvements continus. */
*,*::before,*::after{animation:none!important;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease!important}
.service-card:hover,.process article:hover,.review:hover,.about-card:hover{transform:none!important}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:900px){.navbar{padding-left:18px!important;padding-right:18px!important}.site-logo,.site-logo.big-logo{width:145px!important;height:70px!important}.chatbot{right:12px;bottom:12px}.chatbot-button{padding:11px 14px}.hero h1{font-size:clamp(38px,10vw,56px)!important}.section-head h2,.about h2,.zone h2,.contact h2{font-size:clamp(32px,8vw,44px)!important}}
@media(max-width:520px){.container{padding:0 16px}.hero-actions .btn{width:100%}.trust-row{gap:18px}.chat-window{height:78vh}.review-arrow{display:none}.site-logo,.site-logo.big-logo{width:130px!important;height:62px!important}.navbar{min-height:76px!important}.navlinks{top:76px!important}}
/* =========================================================
Ajustements finaux demandés : logo, stats, étoile Google,
responsive tablette / mobile.
========================================================= */
@media (min-width:901px){
.navbar{
padding-left:64px!important;
padding-right:28px!important;
}
.brand{margin-left:0!important;}
.site-logo,.site-logo.big-logo{
height:82px!important;
max-width:230px!important;
}
.navbar.nav-scrolled .site-logo,.navbar.nav-scrolled .site-logo.big-logo{
height:82px!important;
max-width:230px!important;
}
}
/* Étoile Google plus naturelle : jaune/or comme les avis Google. */
.trust-row strong:first-letter{color:inherit}
.trust-row strong{line-height:1.05!important;}
.trust-row strong::first-letter{color:inherit!important;}
.trust-row div:first-child strong{
color:#fff!important;
}
.trust-row div:first-child strong::after{
color:#fbbc04!important;
}
/* Statistiques : chiffre au-dessus, texte lisible en dessous. */
.stats{
background:linear-gradient(135deg,#07111a 0%,#0b3149 55%,#0c5d86 100%)!important;
padding:42px 0!important;
}
.stats-grid{
align-items:stretch!important;
gap:18px!important;
}
.stats-grid>div{
background:rgba(255,255,255,.075)!important;
border:1px solid rgba(255,255,255,.14)!important;
border-radius:22px!important;
padding:22px 18px!important;
box-shadow:0 18px 45px rgba(0,0,0,.14)!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
min-height:128px!important;
}
.stats strong{
display:block!important;
color:#27c0e3!important;
font-size:clamp(34px,3.1vw,46px)!important;
line-height:1!important;
margin-bottom:10px!important;
letter-spacing:-.02em!important;
}
.stats span{
display:block!important;
color:#fff!important;
font-size:clamp(14px,1.1vw,17px)!important;
line-height:1.35!important;
font-weight:900!important;
opacity:.96!important;
max-width:180px!important;
}
/* Cartes engagements sous le hero : meilleure respiration responsive. */
.process-grid article{
min-height:170px!important;
}
.process-grid article p{
line-height:1.35!important;
}
/* Tablette */
@media (max-width:1100px){
.hero-grid{gap:38px!important;}
.hero h1{font-size:clamp(48px,6vw,66px)!important;}
.stats-grid{grid-template-columns:repeat(2,1fr)!important;}
.process-grid{grid-template-columns:repeat(2,1fr)!important;}
}
@media (max-width:900px){
.navbar{
padding-left:20px!important;
padding-right:18px!important;
}
.site-logo,.site-logo.big-logo{
width:auto!important;
height:62px!important;
max-width:176px!important;
}
.hero-grid{grid-template-columns:1fr!important;}
.hero-card{max-width:640px!important;}
.trust-row{
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:16px!important;
}
.trust-row strong{font-size:clamp(26px,6vw,34px)!important;}
}
/* Portable */
@media (max-width:620px){
.topbar{display:none!important;}
.navbar{min-height:78px!important;}
.site-logo,.site-logo.big-logo{
height:54px!important;
max-width:150px!important;
}
.hero{padding:58px 0 40px!important;}
.hero h1{font-size:clamp(38px,11vw,50px)!important;}
.hero p{font-size:17px!important;}
.hero-actions{gap:12px!important;}
.trust-row{
grid-template-columns:1fr!important;
gap:12px!important;
}
.trust-row div{
background:rgba(255,255,255,.08)!important;
border:1px solid rgba(255,255,255,.12)!important;
border-radius:16px!important;
padding:14px 16px!important;
}
.stats-grid,
.process-grid{
grid-template-columns:1fr!important;
}
.stats-grid>div{min-height:110px!important;}
}
.google-star{color:#fbbc04!important;}
/* === Avis Google : étoile + texte côte à côte === */
.trust-row .google-trust{
display:flex!important;
align-items:center!important;
gap:10px!important;
white-space:nowrap!important;
}
.trust-row .google-trust strong{
display:inline-flex!important;
align-items:center!important;
gap:3px!important;
margin:0!important;
}
.trust-row .google-trust span:not(.google-star){
display:inline-block!important;
margin:0!important;
line-height:1.1!important;
}
.google-star{
color:#fbbc04!important;
font-size:.95em!important;
text-shadow:0 1px 0 rgba(0,0,0,.08)!important;
}
@media(max-width:620px){
.trust-row .google-trust{
justify-content:flex-start!important;
}
}
/* === Corrections finales : zone, réalisations, navigation douce et animations stables === */
html{scroll-behavior:smooth;scroll-padding-top:120px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}}
.navlinks a:not(.nav-cta){position:relative;padding:10px 0;transition:color .18s ease}
.navlinks a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:3px;border-radius:99px;background:linear-gradient(90deg,#0b79bd,#38c5df);transform:scaleX(0);transform-origin:left;transition:transform .18s ease}
.navlinks a:hover:not(.nav-cta),.navlinks a.active:not(.nav-cta){color:#0865ad}
.navlinks a:hover:not(.nav-cta)::after,.navlinks a.active:not(.nav-cta)::after{transform:scaleX(1)}
.btn,.nav-cta,.chatbot-button,.quick-questions button,.review-arrow{transition:transform .16s ease, box-shadow .16s ease, background .16s ease!important;will-change:auto}
.btn:hover,.nav-cta:hover,.chatbot-button:hover,.quick-questions button:hover,.review-arrow:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(8,101,173,.22)}
.service-card,.process article,.review,.quote-form,.zone-showcase,.stats-grid>div,.real-photo-grid article{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease!important;will-change:auto}
.service-card:hover,.process article:hover,.review:hover,.stats-grid>div:hover{transform:translateY(-4px);box-shadow:0 20px 45px rgba(16,32,51,.12)}
.real-photo-grid article:hover{transform:translateY(-3px);box-shadow:0 22px 55px rgba(16,32,51,.18)}
.zone-pro{background:linear-gradient(180deg,#f4faff 0%,#eef7fc 100%)}
.zone-showcase{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:stretch;background:linear-gradient(135deg,#ffffff 0%,#edf8fe 100%);border:1px solid #d9edf7;border-radius:32px;padding:40px;box-shadow:0 24px 60px rgba(16,32,51,.09)}
.zone-content{display:flex;flex-direction:column;justify-content:center}.zone-content h2{font-size:48px;line-height:1.06;margin:16px 0 18px;color:#1c2b39}.zone-content p{max-width:620px}.zone-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}.zone-phone{background:#fff!important;border:1px solid #cfe5f2;color:#0865ad!important;box-shadow:none!important}.zone-panel{background:linear-gradient(145deg,#072034,#0e6695);border-radius:28px;padding:28px;color:#fff;display:grid;grid-template-columns:170px 1fr;gap:22px;align-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 18px 45px rgba(8,101,173,.18)}.zone-main{min-height:160px;border-radius:24px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.zone-main strong{font-size:66px;line-height:1;color:#38c5df}.zone-main span{font-weight:900;font-size:16px;margin-top:10px}.zone-tags{display:flex;gap:12px;flex-wrap:wrap}.zone-tags span{background:rgba(255,255,255,.96);color:#0865ad;border-radius:999px;padding:12px 16px;font-weight:900;border:1px solid rgba(255,255,255,.5);box-shadow:0 8px 18px rgba(0,0,0,.08)}
.stats{background:linear-gradient(135deg,#07111a,#0a4265 70%,#0d78ac)}.stats-grid>div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:22px;padding:22px 14px}.stats strong{color:#38c5df}.stats span{display:block;margin-top:8px;line-height:1.25}
.realisations-pro{background:#fff}.real-head p{max-width:720px}.real-photo-grid{grid-template-columns:repeat(3,1fr)}.real-photo-grid article{min-height:330px;border:1px solid #dceaf3;box-shadow:0 18px 45px rgba(16,32,51,.10);background-position:center;background-size:cover}.real-photo-grid article:before{background:linear-gradient(to top,rgba(5,20,32,.82),rgba(5,20,32,.22) 48%,rgba(255,255,255,.02))}.real-photo-grid div{right:22px}.real-photo-grid h3{font-size:23px;line-height:1.15}.real-photo-grid span{display:inline-block;background:rgba(34,197,238,.16);color:#70e6ff;border:1px solid rgba(112,230,255,.35);padding:7px 10px;border-radius:999px;margin-bottom:8px}
.google-trust strong{display:flex!important;align-items:center;gap:6px}.google-star{color:#fbbc04;text-shadow:0 1px 0 rgba(0,0,0,.15)}
@media(max-width:1100px){.zone-showcase{grid-template-columns:1fr}.zone-panel{grid-template-columns:1fr}.real-photo-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){html{scroll-padding-top:92px}.navbar{min-height:82px}.site-logo.big-logo,.site-logo{width:132px!important;height:70px!important}.zone-showcase{padding:26px;border-radius:24px}.zone-content h2{font-size:34px}.zone-panel{padding:20px}.zone-main{min-height:120px}.zone-main strong{font-size:50px}.real-photo-grid{grid-template-columns:1fr}.real-photo-grid article{min-height:300px}.chatbot{right:12px;bottom:12px}.chatbot-button{padding:12px 15px}.section{padding:70px 0}}
@media(max-width:560px){.container{padding:0 16px}.hero h1{font-size:38px}.hero p{font-size:17px}.hero-actions .btn{width:100%}.trust-row{gap:18px}.zone-actions .btn{width:100%}.zone-tags span{width:100%;text-align:center}.stats-grid{grid-template-columns:1fr!important}.section-head h2,.about h2,.zone h2,.contact h2{font-size:34px}.real-photo-grid article{min-height:260px}.footer-grid{font-size:14px}.chat-window{height:500px}}
/* --- Refonte propre : zone d'intervention + réalisations --- */
.zone-map-section{
background:linear-gradient(180deg,#f7fcff 0%,#eef8fd 100%);
position:relative;
overflow:hidden;
}
.zone-map-section:before{
content:"";
position:absolute;
inset:auto -18% 4% auto;
width:520px;
height:520px;
border-radius:999px;
background:radial-gradient(circle,rgba(48,190,220,.18),rgba(48,190,220,0) 68%);
pointer-events:none;
}
.zone-map-card{
position:relative;
display:grid;
grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);
gap:38px;
align-items:center;
background:rgba(255,255,255,.78);
border:1px solid #d7edf8;
border-radius:34px;
padding:44px;
box-shadow:0 28px 70px rgba(13,83,128,.10);
backdrop-filter:blur(10px);
}
.zone-copy h2{
font-size:clamp(34px,4vw,56px);
line-height:1.05;
margin:16px 0 20px;
max-width:680px;
color:#182838;
}
.zone-copy p{
font-size:18px;
line-height:1.72;
color:#3d5062;
max-width:660px;
}
.map-illustration{
position:relative;
min-height:440px;
border-radius:34px;
overflow:hidden;
background:linear-gradient(135deg,#e8f7fd 0%,#d9eff8 45%,#f9fdff 100%);
border:1px solid #cfe8f5;
box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 18px 55px rgba(11,64,102,.12);
}
.map-bg{
position:absolute;
inset:0;
background-image:
linear-gradient(rgba(8,101,173,.07) 1px,transparent 1px),
linear-gradient(90deg,rgba(8,101,173,.07) 1px,transparent 1px);
background-size:52px 52px;
opacity:.58;
}
.map-zone{
position:absolute;
left:20%;
top:12%;
width:54%;
height:74%;
border-radius:42% 58% 50% 45%;
transform:rotate(-9deg);
background:linear-gradient(145deg,rgba(12,111,177,.92),rgba(48,196,220,.78));
box-shadow:0 24px 60px rgba(8,101,173,.25);
opacity:.92;
}
.map-zone:after{
content:"";
position:absolute;
inset:22px;
border-radius:inherit;
border:2px dashed rgba(255,255,255,.42);
}
.map-road{
position:absolute;
left:8%;
right:8%;
height:8px;
border-radius:999px;
background:rgba(255,255,255,.72);
box-shadow:0 0 0 1px rgba(8,101,173,.12);
}
.road-a{top:32%;transform:rotate(-11deg)}
.road-b{top:55%;transform:rotate(12deg)}
.road-c{top:73%;transform:rotate(-4deg)}
.map-pin{
position:absolute;
left:43%;
top:42%;
transform:translate(-50%,-50%);
background:#071827;
color:#fff;
border-radius:20px;
padding:14px 18px;
box-shadow:0 16px 34px rgba(0,0,0,.25);
text-align:center;
z-index:4;
}
.map-pin:after{
content:"";
position:absolute;
left:50%;
bottom:-12px;
width:18px;
height:18px;
background:#071827;
transform:translateX(-50%) rotate(45deg);
border-radius:2px;
}
.map-pin b{display:block;font-size:24px;letter-spacing:1px}.map-pin small{display:block;font-weight:800;color:#aeeeff;margin-top:2px}
.map-label{
position:absolute;
right:9%;
top:10%;
background:rgba(255,255,255,.96);
color:#0865ad;
border-radius:22px;
padding:18px 22px;
font-size:38px;
font-weight:950;
text-align:center;
z-index:3;
box-shadow:0 16px 36px rgba(8,101,173,.12);
}
.map-label small{display:block;font-size:13px;color:#1c2b39;margin-top:2px}.map-city{position:absolute;z-index:4;background:#fff;color:#0865ad;border:1px solid #cde9f6;border-radius:999px;padding:10px 14px;font-weight:950;box-shadow:0 10px 24px rgba(8,101,173,.12)}
.city-a{right:16%;bottom:20%}.city-b{left:9%;top:21%}.city-c{right:8%;top:45%}.city-d{left:12%;bottom:15%}
.zone-list-clean{
margin:22px auto 0;
display:flex;
justify-content:center;
gap:12px;
flex-wrap:wrap;
}
.zone-list-clean span{
background:#fff;
color:#0865ad;
border:1px solid #cfe5f2;
border-radius:999px;
padding:12px 18px;
font-weight:900;
box-shadow:0 8px 24px rgba(8,101,173,.07);
}
.realisations-pro{
background:linear-gradient(180deg,#fff 0%,#f8fcff 100%);
}
.real-photo-grid{
grid-template-columns:repeat(4,1fr)!important;
gap:22px!important;
}
.real-photo-grid article{
min-height:360px!important;
border-radius:26px!important;
border:1px solid #dcecf5!important;
box-shadow:0 20px 48px rgba(16,32,51,.11)!important;
transform:none!important;
}
.real-photo-grid article:hover{
transform:translateY(-6px)!important;
box-shadow:0 28px 70px rgba(16,32,51,.16)!important;
}
.real-photo-grid article:before{
background:linear-gradient(to top,rgba(5,20,32,.82) 0%,rgba(5,20,32,.38) 42%,rgba(5,20,32,.04) 100%)!important;
}
.real-photo-grid div{
left:20px!important;
right:20px!important;
bottom:20px!important;
}
.real-photo-grid span{
background:#fff!important;
color:#0865ad!important;
border:1px solid rgba(255,255,255,.75)!important;
box-shadow:0 10px 24px rgba(0,0,0,.16)!important;
padding:7px 12px!important;
border-radius:999px!important;
font-size:13px!important;
letter-spacing:.2px!important;
}
.real-photo-grid h3{
font-size:22px!important;
line-height:1.12!important;
text-shadow:0 2px 12px rgba(0,0,0,.38)!important;
}
.real-photo-grid p{
margin:8px 0 0!important;
color:rgba(255,255,255,.92)!important;
font-weight:700!important;
line-height:1.35!important;
font-size:14px!important;
}
@media(max-width:1150px){
.zone-map-card{grid-template-columns:1fr;padding:32px}.map-illustration{min-height:380px}.real-photo-grid{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:700px){
.zone-map-card{padding:22px;border-radius:26px}.map-illustration{min-height:320px;border-radius:24px}.map-zone{left:12%;width:68%}.map-label{font-size:28px;right:5%;top:7%;padding:14px}.map-city{font-size:13px;padding:8px 10px}.map-pin{left:43%;top:48%;padding:11px 14px}.zone-list-clean span{width:100%;text-align:center}.real-photo-grid{grid-template-columns:1fr!important}.real-photo-grid article{min-height:300px!important}
}
/* === Corrections propres demandées : zone simple, réalisations lisibles, bot avec logo === */
.zone-simple-section{
background:linear-gradient(180deg,#f7fcff 0%,#eef8fd 100%)!important;
}
.zone-simple-card{
display:grid!important;
grid-template-columns:1fr .9fr!important;
gap:34px!important;
align-items:center!important;
background:#fff!important;
border:1px solid #d8edf7!important;
border-radius:32px!important;
padding:44px!important;
box-shadow:0 24px 65px rgba(16,32,51,.09)!important;
}
.zone-simple-copy h2{
font-size:clamp(34px,4.2vw,56px)!important;
line-height:1.04!important;
margin:14px 0 18px!important;
color:#182838!important;
}
.zone-simple-copy p{
max-width:640px!important;
font-size:18px!important;
line-height:1.72!important;
color:#3d5062!important;
margin-bottom:28px!important;
}
.zone-simple-list{
background:linear-gradient(135deg,#071827,#0b5f8e)!important;
border-radius:28px!important;
padding:30px!important;
color:#fff!important;
display:grid!important;
grid-template-columns:160px 1fr!important;
gap:24px!important;
align-items:center!important;
box-shadow:0 22px 55px rgba(8,101,173,.20)!important;
}
.zone-main-chip{
min-height:150px!important;
border-radius:22px!important;
border:1px solid rgba(255,255,255,.22)!important;
background:rgba(255,255,255,.10)!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
align-items:center!important;
text-align:center!important;
}
.zone-main-chip strong{font-size:64px!important;line-height:1!important;color:#38c5df!important;}
.zone-main-chip span{font-weight:900!important;margin-top:8px!important;}
.zone-simple-list ul{
list-style:none!important;
margin:0!important;
padding:0!important;
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:12px!important;
}
.zone-simple-list li{
background:#fff!important;
color:#0865ad!important;
border-radius:999px!important;
padding:12px 16px!important;
font-weight:900!important;
text-align:center!important;
box-shadow:0 10px 24px rgba(0,0,0,.10)!important;
}
/* Réalisations : suppression des pastilles bleues en haut, texte propre en bas */
.real-photo-grid{
align-items:stretch!important;
}
.real-photo-grid article{
position:relative!important;
overflow:hidden!important;
background-position:center!important;
}
.real-photo-grid article:before{
background:linear-gradient(to top,rgba(5,20,32,.78) 0%,rgba(5,20,32,.44) 34%,rgba(5,20,32,.08) 75%)!important;
}
.real-photo-grid article div{
position:absolute!important;
left:20px!important;
right:20px!important;
bottom:20px!important;
top:auto!important;
color:#fff!important;
z-index:2!important;
transform:none!important;
}
.real-photo-grid article:hover div{transform:none!important;}
.real-photo-grid span{
display:none!important;
}
.real-photo-grid h3{
margin:0 0 8px!important;
font-size:22px!important;
line-height:1.12!important;
color:#fff!important;
text-shadow:0 3px 14px rgba(0,0,0,.45)!important;
}
.real-photo-grid p{
margin:0!important;
color:rgba(255,255,255,.94)!important;
font-size:14px!important;
line-height:1.38!important;
font-weight:700!important;
max-height:none!important;
}
/* Assistant : logo AMB à la place du texte/icône */
.assistant-badge.logo-badge{
width:44px!important;
height:44px!important;
padding:0!important;
border-radius:14px!important;
background:#fff!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
overflow:hidden!important;
}
.assistant-badge.logo-badge img{
width:34px!important;
height:34px!important;
object-fit:contain!important;
display:block!important;
}
.chat-title{display:flex!important;align-items:center!important;gap:12px!important;}
@media(max-width:1050px){
.zone-simple-card{grid-template-columns:1fr!important;padding:32px!important;}
.zone-simple-list{grid-template-columns:1fr!important;}
.zone-main-chip{min-height:110px!important;}
.zone-simple-list ul{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:700px){
.zone-simple-card{padding:24px!important;border-radius:24px!important;}
.zone-simple-copy h2{font-size:34px!important;}
.zone-simple-list{padding:20px!important;border-radius:22px!important;}
.zone-simple-list ul{grid-template-columns:1fr!important;}
.zone-main-chip strong{font-size:50px!important;}
.real-photo-grid article{min-height:285px!important;}
}
/* === Corrections finales : secteur simple, galerie, SEO-friendly responsive === */
.sector-clean-section{
background:linear-gradient(180deg,#f4fbff 0%,#ffffff 100%);
padding-top:70px;
padding-bottom:70px;
}
.sector-clean-card{
background:rgba(255,255,255,.88);
border:1px solid #d8edf8;
border-radius:30px;
padding:46px 52px;
box-shadow:0 22px 60px rgba(12,44,64,.08);
}
.sector-clean-card h2{
max-width:850px;
font-size:clamp(34px,4.5vw,60px);
line-height:1.06;
letter-spacing:-1.8px;
margin:12px 0 22px;
}
.sector-clean-card p{
max-width:780px;
color:#34495f;
font-size:18px;
line-height:1.75;
}
.sector-tags{
display:flex;
flex-wrap:wrap;
gap:12px;
margin:28px 0 18px;
}
.sector-tags span{
display:inline-flex;
align-items:center;
min-height:42px;
padding:10px 18px;
border-radius:999px;
background:#eef9ff;
border:1px solid #bfe8f7;
color:#075d9b;
font-weight:800;
box-shadow:0 8px 22px rgba(8,112,163,.06);
}
.sector-note{
font-size:15px!important;
color:#607589!important;
margin-top:4px!important;
}
.zone-simple-section,.zone-simple-card,.zone-simple-list{animation:none!important;}
.real-photo-grid article{
overflow:hidden;
min-height:315px;
}
.real-photo-grid article:before{
background:linear-gradient(to top,rgba(2,15,28,.78),rgba(2,15,28,.32) 45%,rgba(2,15,28,.06))!important;
}
.real-photo-grid div{
left:22px!important;
right:22px!important;
bottom:22px!important;
top:auto!important;
}
.real-photo-grid span{display:none!important;}
.real-photo-grid h3{
text-shadow:0 2px 12px rgba(0,0,0,.45);
margin-bottom:8px;
}
.real-photo-grid p{
text-shadow:0 2px 10px rgba(0,0,0,.45);
max-width:95%;
}
.gallery-block{
margin-top:34px;
background:#f5fbff;
border:1px solid #d8edf8;
border-radius:28px;
padding:24px;
box-shadow:0 18px 45px rgba(16,32,51,.06);
}
.gallery-title{
display:flex;
align-items:end;
justify-content:space-between;
gap:18px;
margin-bottom:16px;
}
.gallery-title h3{
font-size:26px;
margin:0;
color:#142436;
}
.gallery-title p{
margin:0;
color:#53697f;
}
.gallery-strip{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:12px;
}
.gallery-thumb{
border:0;
padding:0;
border-radius:18px;
overflow:hidden;
background:#fff;
height:145px;
box-shadow:0 8px 22px rgba(16,32,51,.08);
cursor:pointer;
}
.gallery-thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .25s ease;
}
.gallery-thumb:hover img{transform:scale(1.04);}
@media (max-width: 980px){
.sector-clean-card{padding:34px 28px;border-radius:24px;}
.sector-tags span{font-size:14px;padding:9px 14px;}
.real-photo-grid{grid-template-columns:repeat(2,1fr)!important;}
.gallery-strip{grid-template-columns:repeat(4,1fr);}
.gallery-thumb{height:130px;}
}
@media (max-width: 640px){
.sector-clean-section{padding-top:42px;padding-bottom:42px;}
.sector-clean-card{padding:28px 20px;}
.sector-clean-card h2{letter-spacing:-1px;}
.sector-clean-card p{font-size:16px;}
.sector-tags{gap:9px;}
.sector-tags span{width:100%;justify-content:center;}
.real-photo-grid{grid-template-columns:1fr!important;}
.real-photo-grid article{min-height:300px;}
.gallery-title{display:block;}
.gallery-title p{margin-top:6px;}
.gallery-strip{grid-template-columns:repeat(2,1fr);gap:10px;}
.gallery-thumb{height:120px;border-radius:14px;}
}
/* === Corrections finales demandées : secteur simple, galerie sans doublons, zoom image, SEO propre === */
.sector-clean-section{padding:70px 0!important;background:linear-gradient(180deg,#f6fbff 0%,#eef8fd 100%)!important;}
.sector-simple-card{
max-width:1120px;margin:0 auto;padding:42px 48px;border-radius:30px;
display:grid;grid-template-columns:1.25fr .75fr;gap:34px;align-items:center;
background:rgba(255,255,255,.92);border:1px solid #cfeaf6;
box-shadow:0 24px 70px rgba(12,44,70,.10);
}
.sector-simple-card .mini-title{color:#009ed0;letter-spacing:5px;font-weight:900;text-transform:uppercase;font-size:13px;}
.sector-simple-card h2{margin:14px 0 18px;font-size:clamp(34px,4.2vw,58px);line-height:1.04;letter-spacing:-2px;color:#172638;}
.sector-simple-card p{max-width:650px;margin:0 0 14px;color:#34485e;font-size:18px;line-height:1.75;}
.sector-seo-text{font-size:16px!important;color:#52677b!important;}
.sector-simple-badges{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.sector-simple-badges span{min-height:150px;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(145deg,#083049,#116a94);color:#fff;box-shadow:0 18px 45px rgba(8,48,73,.18);border:1px solid rgba(255,255,255,.2);}
.sector-simple-badges strong{font-size:54px;line-height:1;color:#37d5ee;letter-spacing:-1px;}
.sector-simple-badges small{margin-top:10px;font-size:16px;font-weight:900;line-height:1.3;}
.sector-clean-card,.sector-tags,.sector-note{display:none!important;}
.realisations-pro{background:#fff!important;}
.real-photo-grid span{display:none!important;}
.real-photo-grid article,.gallery-thumb{cursor:zoom-in;}
.real-photo-grid article:focus-visible,.gallery-thumb:focus-visible{outline:4px solid rgba(34,183,221,.45);outline-offset:4px;}
.gallery-block{margin-top:34px!important;padding:26px!important;border-radius:28px!important;background:linear-gradient(180deg,#f7fcff,#eef8fd)!important;border:1px solid #cfeaf6!important;box-shadow:0 18px 50px rgba(12,44,70,.08)!important;}
.gallery-title{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:20px!important;margin-bottom:18px!important;}
.gallery-title h3{margin:0!important;color:#172638!important;font-size:28px!important;letter-spacing:-.5px!important;}
.gallery-title p{margin:0!important;color:#53697d!important;font-size:16px!important;}
.gallery-strip{display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:14px!important;}
.gallery-thumb{height:150px!important;border:0!important;padding:0!important;border-radius:18px!important;overflow:hidden!important;background:#e8f6fb!important;box-shadow:0 12px 28px rgba(12,44,70,.10)!important;}
.gallery-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;transition:transform .25s ease,filter .25s ease!important;}
.gallery-thumb:hover img{transform:scale(1.055)!important;filter:saturate(1.05) contrast(1.03)!important;}
.image-lightbox{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:24px;}
.image-lightbox.open{display:flex;}
.lightbox-backdrop{position:absolute;inset:0;border:0;background:rgba(2,15,25,.78);backdrop-filter:blur(8px);cursor:zoom-out;}
.image-lightbox figure{position:relative;z-index:1;margin:0;max-width:min(1100px,94vw);max-height:90vh;animation:lightboxPop .18s ease-out;}
.image-lightbox img{display:block;max-width:100%;max-height:82vh;border-radius:22px;object-fit:contain;box-shadow:0 28px 90px rgba(0,0,0,.45);background:#fff;}
.image-lightbox figcaption{color:#fff;text-align:center;font-weight:800;margin-top:12px;text-shadow:0 2px 12px rgba(0,0,0,.5);}
.lightbox-close{position:absolute;top:18px;right:18px;z-index:2;width:48px;height:48px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.15);color:#fff;font-size:34px;line-height:1;cursor:pointer;}
body.lightbox-open{overflow:hidden;}
@keyframes lightboxPop{from{transform:scale(.96);opacity:.4}to{transform:scale(1);opacity:1}}
/* petit bloc SEO visible mais propre pour Google et les visiteurs */
.local-seo-line{margin-top:18px;color:#52677b;font-size:15px;line-height:1.6;}
@media(max-width:1000px){
.sector-simple-card{grid-template-columns:1fr;padding:34px 28px;}
.sector-simple-badges{max-width:520px;}
.gallery-strip{grid-template-columns:repeat(3,1fr)!important;}
}
@media(max-width:620px){
.sector-clean-section{padding:48px 0!important;}
.sector-simple-card{padding:28px 20px;border-radius:24px;}
.sector-simple-card h2{font-size:34px;letter-spacing:-1px;}
.sector-simple-card p{font-size:16px;line-height:1.65;}
.sector-simple-badges{grid-template-columns:1fr;}
.sector-simple-badges span{min-height:120px;}
.gallery-title{display:block!important;}
.gallery-title p{margin-top:6px!important;}
.gallery-strip{grid-template-columns:repeat(2,1fr)!important;gap:10px!important;}
.gallery-thumb{height:118px!important;border-radius:14px!important;}
.image-lightbox{padding:12px;}
.lightbox-close{top:10px;right:10px;width:42px;height:42px;}
}
/* Correctif galerie : photos plus variées, rendu plus propre */
.gallery-block{overflow:hidden!important;}
.gallery-strip{
grid-template-columns:repeat(4,1fr)!important;
align-items:stretch!important;
}
.gallery-thumb{
height:165px!important;
border-radius:20px!important;
}
.gallery-thumb img{
object-fit:cover!important;
}
.real-photo-grid article{
background-position:center!important;
}
@media(max-width:1000px){
.gallery-strip{grid-template-columns:repeat(3,1fr)!important;}
.gallery-thumb{height:150px!important;}
}
@media(max-width:640px){
.gallery-strip{grid-template-columns:repeat(2,1fr)!important;}
.gallery-thumb{height:128px!important;}
}
/* === CORRECTION DEMANDEE : header fixe + zone simplifiée sans blocs bleus === */
.topbar{
display:none!important;
}
.navbar{
position:sticky!important;
top:0!important;
z-index:1000!important;
min-height:104px!important;
display:grid!important;
grid-template-columns:auto 1fr auto!important;
gap:24px!important;
align-items:center!important;
padding:16px max(34px,calc((100vw - 1280px)/2 + 34px))!important;
background:rgba(255,255,255,.96)!important;
}
.brand{
margin-left:0!important;
justify-self:start!important;
}
.site-logo.big-logo,
.site-logo{
width:190px!important;
height:76px!important;
object-fit:contain!important;
}
.nav-tagline{
justify-self:center!important;
color:#0aa8d8!important;
font-weight:950!important;
text-transform:uppercase!important;
letter-spacing:5px!important;
font-size:16px!important;
line-height:1.2!important;
white-space:nowrap!important;
text-align:center!important;
}
.navlinks{
justify-self:end!important;
}
.hero .badge{
display:none!important;
}
.hero{
padding-top:0!important;
}
.sector-simple-card{
grid-template-columns:1fr!important;
max-width:980px!important;
gap:22px!important;
padding:44px 50px!important;
text-align:left!important;
}
.sector-simple-badges{
display:none!important;
}
.sector-simple-list{
display:grid!important;
grid-template-columns:1fr 1fr auto!important;
gap:14px!important;
align-items:center!important;
margin-top:12px!important;
}
.sector-simple-list p{
margin:0!important;
padding:18px 20px!important;
border-radius:18px!important;
background:#f3f9fd!important;
border:1px solid #d5ebf7!important;
color:#24394d!important;
font-size:16px!important;
line-height:1.45!important;
}
.sector-simple-list strong{
color:#0865ad!important;
}
.sector-call{
min-height:58px!important;
white-space:nowrap!important;
}
@media(max-width:1150px){
.navbar{
grid-template-columns:auto 1fr auto!important;
gap:14px!important;
min-height:92px!important;
}
.site-logo.big-logo,.site-logo{width:165px!important;height:68px!important;}
.nav-tagline{font-size:13px!important;letter-spacing:3px!important;}
.navlinks{gap:14px!important;}
}
@media(max-width:900px){
.navbar{
grid-template-columns:auto auto!important;
grid-template-areas:"brand menu" "tag tag"!important;
min-height:102px!important;
padding:12px 18px!important;
}
.brand{grid-area:brand!important;}
.mobile-menu{grid-area:menu!important;justify-self:end!important;}
.nav-tagline{grid-area:tag!important;justify-self:center!important;font-size:12px!important;letter-spacing:2.5px!important;white-space:normal!important;}
.navlinks{top:102px!important;}
.site-logo.big-logo,.site-logo{width:142px!important;height:58px!important;}
.sector-simple-card{padding:32px 22px!important;}
.sector-simple-list{grid-template-columns:1fr!important;}
.sector-call{width:100%!important;}
}
@media(max-width:520px){
.navbar{min-height:96px!important;}
.navlinks{top:96px!important;}
.nav-tagline{font-size:11px!important;letter-spacing:1.8px!important;}
.site-logo.big-logo,.site-logo{width:132px!important;height:54px!important;}
}
/* === REPRISE HEADER + STATS : demandé === */
.topbar{
display:flex!important;
position:relative!important;
z-index:1001!important;
background:#07111a!important;
color:#fff!important;
justify-content:space-between!important;
align-items:center!important;
padding:8px max(24px,calc((100vw - 1280px)/2 + 24px))!important;
gap:20px!important;
font-size:13px!important;
font-weight:800!important;
line-height:1.2!important;
}
.navbar{
position:sticky!important;
top:0!important;
z-index:1000!important;
min-height:92px!important;
display:grid!important;
grid-template-columns:210px minmax(360px,1fr) auto!important;
gap:28px!important;
align-items:center!important;
padding:12px max(28px,calc((100vw - 1280px)/2 + 28px))!important;
background:rgba(255,255,255,.97)!important;
border-bottom:1px solid rgba(8,101,173,.09)!important;
box-shadow:0 12px 34px rgba(16,32,51,.08)!important;
backdrop-filter:blur(12px)!important;
}
.brand{
justify-self:start!important;
margin-left:0!important;
min-width:0!important;
}
.site-logo.big-logo,
.site-logo{
width:198px!important;
height:70px!important;
object-fit:contain!important;
display:block!important;
}
.nav-tagline{
justify-self:center!important;
align-self:center!important;
color:#069dcc!important;
font-size:17px!important;
font-weight:950!important;
line-height:1.15!important;
letter-spacing:4.8px!important;
text-transform:uppercase!important;
white-space:nowrap!important;
text-align:center!important;
padding:12px 22px!important;
border-radius:999px!important;
background:linear-gradient(90deg,rgba(10,168,216,.08),rgba(10,168,216,.02),rgba(10,168,216,.08))!important;
border:1px solid rgba(10,168,216,.14)!important;
}
.navlinks{
justify-self:end!important;
display:flex!important;
align-items:center!important;
gap:18px!important;
font-size:15px!important;
white-space:nowrap!important;
}
.navlinks a{
white-space:nowrap!important;
}
.nav-cta{
white-space:nowrap!important;
min-width:max-content!important;
padding:14px 22px!important;
border-radius:16px!important;
}
.trust-row{
align-items:flex-start!important;
gap:42px!important;
}
.trust-row>div{
min-width:max-content!important;
}
.trust-row strong{
display:flex!important;
align-items:center!important;
gap:6px!important;
font-size:34px!important;
line-height:1!important;
white-space:nowrap!important;
}
.trust-row span{
display:block!important;
margin-top:8px!important;
font-size:15px!important;
line-height:1.25!important;
}
.google-trust{
display:grid!important;
grid-template-columns:auto auto!important;
align-items:center!important;
column-gap:10px!important;
}
.google-trust strong{grid-row:1 / span 2!important;}
.google-trust span{margin-top:0!important;align-self:center!important;}
.google-star{color:#fbbc04!important;text-shadow:0 1px 0 rgba(0,0,0,.08)!important;}
.stats strong{
font-size:38px!important;
white-space:nowrap!important;
}
@media(max-width:1250px){
.navbar{grid-template-columns:190px minmax(280px,1fr) auto!important;gap:18px!important;}
.site-logo.big-logo,.site-logo{width:180px!important;height:64px!important;}
.nav-tagline{font-size:14px!important;letter-spacing:3.2px!important;padding:10px 14px!important;}
.navlinks{gap:13px!important;font-size:14px!important;}
.nav-cta{padding:13px 17px!important;}
}
@media(max-width:1050px){
.navbar{
grid-template-columns:auto auto!important;
grid-template-areas:"brand menu" "tag tag"!important;
min-height:108px!important;
padding:12px 20px!important;
}
.brand{grid-area:brand!important;}
.mobile-menu{display:block!important;grid-area:menu!important;justify-self:end!important;}
.nav-tagline{grid-area:tag!important;justify-self:center!important;font-size:13px!important;letter-spacing:2.8px!important;width:100%;max-width:720px!important;}
.navlinks{display:none!important;position:absolute!important;top:108px!important;left:18px!important;right:18px!important;flex-direction:column!important;background:white!important;border-radius:20px!important;padding:20px!important;box-shadow:0 20px 60px rgba(0,0,0,.15)!important;}
.navlinks.open{display:flex!important;}
.site-logo.big-logo,.site-logo{width:160px!important;height:60px!important;}
}
@media(max-width:700px){
.topbar{font-size:11px!important;padding:7px 14px!important;gap:12px!important;}
.topbar span:last-child{display:none!important;}
.nav-tagline{font-size:11px!important;letter-spacing:1.8px!important;white-space:normal!important;}
.trust-row{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;}
.google-trust{grid-template-columns:auto 1fr!important;}
}
@media(max-width:480px){
.site-logo.big-logo,.site-logo{width:140px!important;height:54px!important;}
.navbar{min-height:102px!important;}
.navlinks{top:102px!important;}
}
/* === FIX FINAL HEADER : plus de chevauchement, logo propre, tagline lisible === */
.topbar{
display:flex!important;
position:relative!important;
z-index:1100!important;
background:#061521!important;
color:#fff!important;
min-height:34px!important;
padding:7px max(22px,calc((100vw - 1280px)/2 + 22px))!important;
justify-content:space-between!important;
align-items:center!important;
gap:18px!important;
font-size:13px!important;
font-weight:800!important;
line-height:1.2!important;
}
.navbar{
position:sticky!important;
top:0!important;
z-index:1050!important;
min-height:98px!important;
display:grid!important;
grid-template-columns:220px minmax(360px,1fr) auto!important;
align-items:center!important;
gap:30px!important;
padding:12px max(34px,calc((100vw - 1280px)/2 + 34px))!important;
background:rgba(255,255,255,.98)!important;
border-bottom:1px solid rgba(9,115,174,.12)!important;
box-shadow:0 10px 34px rgba(10,31,48,.08)!important;
overflow:visible!important;
}
.brand{
display:flex!important;
align-items:center!important;
justify-self:start!important;
margin:0!important;
width:220px!important;
min-width:220px!important;
}
.brand .site-logo,
.site-logo.big-logo,
.site-logo{
width:205px!important;
height:76px!important;
max-width:205px!important;
object-fit:contain!important;
display:block!important;
}
.nav-tagline{
justify-self:center!important;
align-self:center!important;
max-width:100%!important;
color:#069dcc!important;
font-size:16px!important;
font-weight:950!important;
line-height:1.1!important;
letter-spacing:4.2px!important;
text-transform:uppercase!important;
white-space:nowrap!important;
text-align:center!important;
padding:0!important;
margin:0!important;
background:transparent!important;
border:0!important;
border-radius:0!important;
}
.navlinks{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
justify-self:end!important;
gap:18px!important;
white-space:nowrap!important;
min-width:max-content!important;
font-size:15px!important;
}
.navlinks a:not(.nav-cta){
padding:10px 0!important;
line-height:1.15!important;
}
.nav-cta{
padding:14px 22px!important;
min-width:max-content!important;
border-radius:16px!important;
line-height:1.15!important;
}
.hero{padding-top:0!important;}
.hero .badge{display:none!important;}
.trust-row .experience-trust strong{
font-size:30px!important;
letter-spacing:-.5px!important;
}
.trust-row .experience-trust strong::before{
content:"+";
order:2;
}
.trust-row .experience-trust strong{
font-size:0!important;
}
.trust-row .experience-trust strong::after{
content:"15 ans";
font-size:34px!important;
}
@media(max-width:1320px){
.navbar{grid-template-columns:200px minmax(280px,1fr) auto!important;gap:18px!important;padding-left:24px!important;padding-right:24px!important;}
.brand{width:200px!important;min-width:200px!important;}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:185px!important;height:70px!important;max-width:185px!important;}
.nav-tagline{font-size:13px!important;letter-spacing:3px!important;}
.navlinks{gap:12px!important;font-size:14px!important;}
.nav-cta{padding:13px 16px!important;}
}
@media(max-width:1100px){
.navbar{
grid-template-columns:auto auto!important;
grid-template-areas:"brand menu" "tag tag"!important;
min-height:108px!important;
gap:8px 16px!important;
padding:10px 18px!important;
}
.brand{grid-area:brand!important;width:auto!important;min-width:0!important;}
.mobile-menu{display:block!important;grid-area:menu!important;justify-self:end!important;}
.nav-tagline{grid-area:tag!important;width:100%!important;white-space:normal!important;font-size:12px!important;letter-spacing:2.2px!important;}
.navlinks{display:none!important;position:absolute!important;top:108px!important;left:16px!important;right:16px!important;min-width:0!important;flex-direction:column!important;align-items:stretch!important;background:#fff!important;border-radius:20px!important;padding:18px!important;box-shadow:0 20px 60px rgba(0,0,0,.15)!important;}
.navlinks.open{display:flex!important;}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:158px!important;height:62px!important;max-width:158px!important;}
}
@media(max-width:700px){
.topbar{font-size:11px!important;padding:7px 12px!important;justify-content:center!important;text-align:center!important;}
.topbar div:nth-child(2){display:none!important;}
.nav-tagline{font-size:10.5px!important;letter-spacing:1.4px!important;}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:138px!important;height:54px!important;max-width:138px!important;}
}
/* === VRAI CORRECTIF HEADER FINAL : logo à gauche + slogan sans chevauchement === */
.trust-row .experience-trust strong,
.trust-row .experience-trust strong::before,
.trust-row .experience-trust strong::after{
content:none!important;
}
.trust-row .experience-trust strong{
font-size:34px!important;
letter-spacing:-.5px!important;
}
.topbar{
display:flex!important;
position:sticky!important;
top:0!important;
z-index:1200!important;
min-height:32px!important;
padding:7px clamp(24px,4vw,70px)!important;
background:#061521!important;
color:#ffffff!important;
justify-content:space-between!important;
align-items:center!important;
gap:20px!important;
font-size:13px!important;
font-weight:850!important;
line-height:1.2!important;
}
.navbar{
position:sticky!important;
top:32px!important;
z-index:1190!important;
display:grid!important;
grid-template-columns:240px 1fr auto!important;
grid-template-areas:
"brand tagline links"!important;
align-items:center!important;
column-gap:32px!important;
min-height:92px!important;
padding:12px clamp(38px,5vw,82px)!important;
background:rgba(255,255,255,.985)!important;
border-bottom:1px solid rgba(8,101,173,.10)!important;
box-shadow:0 10px 30px rgba(6,21,33,.08)!important;
overflow:visible!important;
}
.brand{
grid-area:brand!important;
justify-self:start!important;
display:flex!important;
align-items:center!important;
width:auto!important;
min-width:0!important;
margin:0!important;
}
.brand .site-logo,
.site-logo.big-logo,
.site-logo{
width:210px!important;
height:72px!important;
max-width:210px!important;
object-fit:contain!important;
display:block!important;
}
.nav-tagline{
grid-area:tagline!important;
justify-self:center!important;
align-self:center!important;
max-width:680px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
text-align:center!important;
color:#069dcc!important;
background:linear-gradient(90deg,rgba(7,157,204,.06),rgba(56,197,223,.13),rgba(7,157,204,.06))!important;
border:1px solid rgba(7,157,204,.16)!important;
border-radius:999px!important;
padding:10px 24px!important;
margin:0!important;
font-size:15px!important;
font-weight:950!important;
line-height:1!important;
letter-spacing:4px!important;
text-transform:uppercase!important;
}
.navlinks{
grid-area:links!important;
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
justify-self:end!important;
gap:20px!important;
white-space:nowrap!important;
min-width:max-content!important;
font-size:15px!important;
font-weight:900!important;
}
.navlinks a:not(.nav-cta){
padding:10px 0!important;
line-height:1.1!important;
}
.nav-cta{
padding:15px 24px!important;
border-radius:17px!important;
line-height:1.1!important;
min-width:max-content!important;
}
.mobile-menu{display:none!important;}
.hero{padding-top:0!important;}
.hero .badge{display:none!important;}
@media(max-width:1450px){
.navbar{grid-template-columns:220px 1fr auto!important;column-gap:22px!important;padding-left:48px!important;padding-right:48px!important;}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:190px!important;height:68px!important;max-width:190px!important;}
.nav-tagline{max-width:580px!important;font-size:13px!important;letter-spacing:3px!important;padding:9px 18px!important;}
.navlinks{gap:14px!important;font-size:14px!important;}
.nav-cta{padding:14px 18px!important;}
}
@media(max-width:1220px){
.navbar{
grid-template-columns:200px 1fr auto!important;
grid-template-areas:
"brand tagline menu"!important;
min-height:88px!important;
padding:10px 28px!important;
}
.mobile-menu{display:block!important;grid-area:menu!important;justify-self:end!important;}
.navlinks{display:none!important;position:absolute!important;top:88px!important;left:18px!important;right:18px!important;min-width:0!important;flex-direction:column!important;align-items:stretch!important;background:#fff!important;border-radius:20px!important;padding:18px!important;box-shadow:0 20px 60px rgba(0,0,0,.15)!important;}
.navlinks.open{display:flex!important;}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:178px!important;height:64px!important;max-width:178px!important;}
.nav-tagline{font-size:12px!important;letter-spacing:2.4px!important;max-width:none!important;}
}
@media(max-width:760px){
.topbar{position:relative!important;top:auto!important;justify-content:center!important;text-align:center!important;font-size:11.5px!important;padding:7px 14px!important;}
.topbar div:nth-child(2){display:none!important;}
.navbar{
top:0!important;
grid-template-columns:1fr auto!important;
grid-template-areas:
"brand menu"
"tagline tagline"!important;
row-gap:8px!important;
min-height:104px!important;
padding:9px 18px 12px!important;
}
.brand .site-logo,.site-logo.big-logo,.site-logo{width:150px!important;height:56px!important;max-width:150px!important;}
.nav-tagline{width:100%!important;font-size:10.5px!important;letter-spacing:1.5px!important;padding:8px 12px!important;white-space:normal!important;line-height:1.25!important;}
.navlinks{top:104px!important;}
}
/* === FIX LARGEUR SECTION INTERVENTION : alignée avec les autres blocs === */
#secteur.sector-clean-section{
padding:80px 0!important;
}
#secteur .sector-simple-card{
width:min(1180px, calc(100% - 48px))!important;
max-width:1180px!important;
margin-left:auto!important;
margin-right:auto!important;
padding:54px 64px!important;
border-radius:30px!important;
}
#secteur .sector-simple-content{
max-width:900px!important;
}
#secteur .sector-simple-card h2{
max-width:900px!important;
}
#secteur .sector-simple-card p{
max-width:820px!important;
}
#secteur .sector-simple-list{
width:100%!important;
grid-template-columns:1fr 1fr auto!important;
}
@media(max-width:900px){
#secteur .sector-simple-card{
width:min(100% - 32px, 1180px)!important;
padding:34px 24px!important;
}
#secteur .sector-simple-list{
grid-template-columns:1fr!important;
}
}
/* === DERNIER CORRECTIF ZOOM NAVBAR : aucun chevauchement slogan/menu === */
@media (max-width: 1700px){
.navbar{
grid-template-columns:220px 1fr auto!important;
grid-template-areas:"brand tagline menu"!important;
column-gap:22px!important;
padding-left:clamp(24px,4vw,60px)!important;
padding-right:clamp(24px,4vw,60px)!important;
}
.mobile-menu{
display:block!important;
grid-area:menu!important;
justify-self:end!important;
}
.navlinks{
display:none!important;
position:absolute!important;
top:92px!important;
left:18px!important;
right:18px!important;
min-width:0!important;
width:auto!important;
flex-direction:column!important;
align-items:stretch!important;
background:#fff!important;
border-radius:20px!important;
padding:18px!important;
box-shadow:0 20px 60px rgba(0,0,0,.15)!important;
}
.navlinks.open{display:flex!important;}
.nav-tagline{
max-width:none!important;
width:100%!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
font-size:clamp(12px,1vw,15px)!important;
letter-spacing:clamp(2px,.24vw,4px)!important;
}
}
@media (min-width:1701px){
.mobile-menu{display:none!important;}
.navlinks{display:flex!important;}
}
/* =========================================================
AMB Services - couche dynamique premium stable
Réactivation propre des animations sans casser les corrections de zoom/menu.
========================================================= */
html{scroll-behavior:smooth!important;scroll-padding-top:120px!important;}
body{overflow-x:hidden;}
/* On réactive uniquement les éléments utiles, pas toute la page. */
.navbar,.topbar,.hero-content .badge,.hero-content h1,.hero-content p,.hero-actions,.trust-row,.hero-card,
.reveal,.service-card,.process article,.review,.real-photo-grid article,.stats-grid>div,.quote-form,.contact-grid>* ,
.btn,.nav-cta,.chatbot-button,.quick-questions button,.review-arrow,.navlinks a,.site-logo,.chat-window.open{
animation-duration:initial!important;
transition-property:transform,opacity,box-shadow,border-color,background-color,color,filter!important;
transition-duration:.24s!important;
transition-timing-function:ease!important;
}
/* Entrée propre haut de page */
.topbar{animation:ambDrop .55s ease both!important;}
.navbar{animation:ambDrop .65s ease .06s both!important;transition:box-shadow .25s ease,background-color .25s ease,min-height .25s ease,padding .25s ease!important;}
.navbar.nav-scrolled{background:rgba(255,255,255,.96)!important;box-shadow:0 14px 38px rgba(7,17,26,.12)!important;}
@keyframes ambDrop{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}
/* Hero vivant mais sobre */
.hero{isolation:isolate;}
.hero:before{content:"";position:absolute;width:480px;height:480px;right:-150px;top:-130px;border-radius:999px;background:radial-gradient(circle,rgba(55,194,220,.26),transparent 64%);pointer-events:none;animation:ambFloatBlob 10s ease-in-out infinite alternate!important;z-index:0;}
.hero:after{content:"";position:absolute;width:340px;height:340px;left:-130px;bottom:-150px;border-radius:999px;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 66%);pointer-events:none;animation:ambFloatBlob 12s ease-in-out infinite alternate-reverse!important;z-index:0;}
.hero-grid{position:relative;z-index:2;}
@keyframes ambFloatBlob{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-28px,22px,0) scale(1.10)}}
.hero-content .badge{animation:ambFadeUp .6s ease .12s both!important;}
.hero-content h1{animation:ambFadeUp .65s ease .22s both!important;}
.hero-content p{animation:ambFadeUp .65s ease .32s both!important;}
.hero-actions{animation:ambFadeUp .65s ease .42s both!important;}
.trust-row{animation:ambFadeUp .65s ease .52s both!important;}
.hero-card{animation:ambCardIn .8s cubic-bezier(.18,.89,.32,1.16) .28s both!important;}
.hero-card:hover{transform:translateY(-5px)!important;box-shadow:0 30px 78px rgba(0,0,0,.24)!important;}
@keyframes ambFadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes ambCardIn{from{opacity:0;transform:translateY(34px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
/* Révélation au scroll */
.reveal{opacity:0!important;transform:translateY(32px)!important;transition:opacity .7s ease var(--delay,0ms),transform .7s cubic-bezier(.19,1,.22,1) var(--delay,0ms)!important;}
.reveal.is-visible{opacity:1!important;transform:translateY(0)!important;}
/* Menu, boutons et cartes */
.navlinks a:not(.nav-cta)::after{transition:transform .2s ease!important;}
.navlinks a:hover:not(.nav-cta),.navlinks a.active:not(.nav-cta){color:#0865ad!important;}
.btn,.nav-cta,.chatbot-button{background-size:180% 180%!important;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;}
.btn:hover,.nav-cta:hover,.chatbot-button:hover{transform:translateY(-2px)!important;box-shadow:0 16px 34px rgba(8,101,173,.24)!important;filter:saturate(1.05)!important;}
.brand:hover .site-logo{transform:scale(1.025)!important;filter:drop-shadow(0 10px 20px rgba(8,101,173,.16))!important;}
.service-card,.process article,.review,.stats-grid>div,.quote-form{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;}
.service-card:hover,.process article:hover,.review:hover,.stats-grid>div:hover,.quote-form:hover{transform:translateY(-5px)!important;box-shadow:0 20px 48px rgba(8,101,173,.13)!important;border-color:rgba(55,194,220,.50)!important;}
/* Réalisations : effet photo premium */
.real-photo-grid article{cursor:pointer;overflow:hidden!important;transition:transform .24s ease,box-shadow .24s ease,background-size .32s ease!important;background-size:105%!important;}
.real-photo-grid article:hover{transform:translateY(-4px) scale(1.008)!important;box-shadow:0 24px 62px rgba(7,17,26,.22)!important;background-size:112%!important;}
.real-photo-grid article div{transition:transform .24s ease!important;}
.real-photo-grid article:hover div{transform:translateY(-5px)!important;}
/* Avis plus agréable */
.review-track{scroll-behavior:smooth!important;scroll-snap-type:x mandatory!important;}
.review{scroll-snap-align:start;}
.review-arrow{transition:transform .18s ease,box-shadow .18s ease!important;}
.review-arrow:hover{transform:translateY(-50%) scale(1.06)!important;}
.stars,.stars-inline{animation:ambStarsGlow 2.6s ease-in-out infinite alternate!important;}
@keyframes ambStarsGlow{from{text-shadow:0 0 0 rgba(251,188,4,0)}to{text-shadow:0 0 13px rgba(251,188,4,.38)}}
.chatbot-button:before{content:"";width:9px;height:9px;border-radius:50%;background:#40ffb0;box-shadow:0 0 0 0 rgba(64,255,176,.65);animation:ambPulse 1.9s infinite!important;}
@keyframes ambPulse{0%{box-shadow:0 0 0 0 rgba(64,255,176,.65)}70%{box-shadow:0 0 0 12px rgba(64,255,176,0)}100%{box-shadow:0 0 0 0 rgba(64,255,176,0)}}
.chat-window.open{animation:ambChatIn .25s ease both!important;}
@keyframes ambChatIn{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
/* Barre rapide mobile : appel + devis */
.mobile-action-bar{display:none;}
@media(max-width:760px){
.mobile-action-bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:85;display:grid;grid-template-columns:1fr 1fr;gap:10px;pointer-events:auto;}
.mobile-action-bar a{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:16px;font-weight:900;color:white;background:linear-gradient(135deg,#0865ad,#37c2dc);box-shadow:0 14px 35px rgba(7,17,26,.22);}
.mobile-action-bar a:first-child{background:linear-gradient(135deg,#07111a,#0b75b8);}
.chatbot{bottom:76px!important;}
.footer{padding-bottom:92px!important;}
}
@media(max-width:1700px){
.navlinks.open{animation:ambMobileMenu .22s ease both!important;}
@keyframes ambMobileMenu{from{opacity:0;transform:translateY(-10px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
.reveal{opacity:1!important;transform:none!important;}
}
/* =========================================================
AMB Services - upgrade premium header + marques + micro interactions
========================================================= */
.hero{
background:
radial-gradient(circle at 18% 18%,rgba(55,194,220,.24),transparent 28%),
radial-gradient(circle at 82% 28%,rgba(255,255,255,.13),transparent 26%),
linear-gradient(135deg,#06101a 0%,#0a2840 48%,#0f7bb7 100%)!important;
}
.hero-overlay{
position:absolute;inset:0;z-index:1;pointer-events:none;
background:
linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
background-size:56px 56px;
mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 82%);
animation:ambGridMove 18s linear infinite!important;
}
@keyframes ambGridMove{from{background-position:0 0,0 0}to{background-position:56px 56px,56px 56px}}
.premium-kicker{
display:inline-flex;align-items:center;gap:9px;margin-bottom:13px;padding:9px 13px;border-radius:999px;
background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);color:#dff8ff;
font-size:13px;font-weight:900;letter-spacing:.5px;backdrop-filter:blur(12px);
animation:ambFadeUp .55s ease .05s both!important;
}
.premium-kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:#40ffb0;box-shadow:0 0 0 7px rgba(64,255,176,.12)}
.hero h1{max-width:760px;text-wrap:balance;text-shadow:0 18px 50px rgba(0,0,0,.22)}
.premium-actions .btn{position:relative;overflow:hidden;isolation:isolate}
.premium-actions .btn:after{content:"";position:absolute;inset:-60% auto -60% -45%;width:42%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);animation:ambButtonLight 4.6s ease-in-out infinite;z-index:-1}
@keyframes ambButtonLight{0%,58%{left:-45%}78%,100%{left:120%}}
.premium-proof-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:34px;max-width:690px}
.premium-proof-row div{padding:15px 16px;border-radius:20px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px);box-shadow:0 16px 36px rgba(0,0,0,.12)}
.premium-proof-row strong{display:block;font-size:24px;line-height:1;color:#fff}.premium-proof-row span{display:block;margin-top:8px;color:rgba(255,255,255,.78);font-weight:800;font-size:13px}
.premium-hero-card{position:relative;overflow:hidden;transform-style:preserve-3d;background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.08))!important;backdrop-filter:blur(18px);box-shadow:0 35px 90px rgba(0,0,0,.28)!important}
.hero-card-shine{position:absolute;inset:-45%;background:radial-gradient(circle at var(--mx,50%) var(--my,45%),rgba(255,255,255,.34),transparent 28%);opacity:.28;pointer-events:none;transition:opacity .22s ease}
.premium-hero-card:hover .hero-card-shine{opacity:.42}
.card-status{position:relative;display:inline-flex;align-items:center;gap:9px;padding:9px 12px;margin-bottom:14px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);font-weight:900;color:#e8fbff;font-size:13px}
.card-status i{display:block;width:8px;height:8px;border-radius:50%;background:#40ffb0;box-shadow:0 0 0 0 rgba(64,255,176,.65);animation:ambPulse 1.9s infinite!important}
.hero-card-mini{position:relative;display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.hero-card-mini span{border-radius:999px;padding:9px 11px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);font-size:12px;font-weight:900;color:#e9f9ff}
.brand-strip{position:relative;padding:54px 0;background:#fff;overflow:hidden;border-bottom:1px solid #e4eff6}
.brand-strip:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff,rgba(243,248,252,.8),#fff);pointer-events:none}
.brand-strip .container{position:relative}.brand-strip-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.brand-strip-head span{color:#0b75b8;text-transform:uppercase;letter-spacing:4px;font-size:13px;font-weight:900}.brand-strip-head p{margin:0;color:#607284;font-weight:800}
.brand-marquee{overflow:hidden;border-radius:26px;border:1px solid #dcebf3;background:linear-gradient(180deg,#fff,#f5fbff);box-shadow:0 18px 48px rgba(16,32,51,.08)}
.brand-track{display:flex;width:max-content;gap:14px;padding:18px;animation:ambBrandScroll 28s linear infinite}.brand-track span{display:flex;align-items:center;justify-content:center;min-width:168px;height:62px;border-radius:18px;background:#fff;border:1px solid #e2eef6;color:#193044;font-size:18px;font-weight:950;box-shadow:0 10px 24px rgba(16,32,51,.06);letter-spacing:-.2px}.brand-track span:hover{transform:translateY(-3px);border-color:rgba(55,194,220,.65);box-shadow:0 16px 34px rgba(8,101,173,.12)}
.brand-marquee:hover .brand-track{animation-play-state:paused}@keyframes ambBrandScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tilt-card{will-change:transform}.magnetic-btn{will-change:transform}.service-card,.process article,.review,.real-photo-grid article,.premium-hero-card{will-change:transform}
@media(max-width:900px){.premium-proof-row{grid-template-columns:1fr}.brand-strip-head{display:block}.brand-strip-head p{margin-top:8px}.brand-track span{min-width:145px;height:56px;font-size:16px}.hero-card-mini span{width:100%;text-align:center}.premium-kicker{font-size:12px;letter-spacing:.2px}.trust-row{display:none!important}}
@media(prefers-reduced-motion:reduce){.hero-overlay,.brand-track,.premium-actions .btn:after{animation:none!important}.premium-hero-card,.magnetic-btn{transform:none!important}}
/* Correctif demandé : header premium plus sobre + chiffres uniques + marques propres */
.premium-kicker,
.premium-proof-row{display:none!important;}
.hero .trust-row{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px!important;
margin-top:38px!important;
max-width:690px!important;
}
.hero .trust-row>div{
padding:15px 16px!important;
border-radius:20px!important;
background:rgba(255,255,255,.10)!important;
border:1px solid rgba(255,255,255,.18)!important;
backdrop-filter:blur(10px)!important;
box-shadow:0 16px 36px rgba(0,0,0,.12)!important;
}
.hero .trust-row strong{
display:block!important;
font-size:24px!important;
line-height:1!important;
color:#fff!important;
}
.hero .trust-row span{
display:block!important;
margin-top:8px!important;
color:rgba(255,255,255,.78)!important;
font-weight:800!important;
font-size:13px!important;
opacity:1!important;
}
.brand-strip{padding:46px 0!important;background:linear-gradient(180deg,#fff,#f7fbfe)!important;}
.brand-strip:before{display:none!important;}
.refined-brand-head{margin-bottom:22px!important;}
.brand-logo-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:16px;
padding:18px;
border-radius:26px;
border:1px solid #dcebf3;
background:rgba(255,255,255,.78);
box-shadow:0 18px 48px rgba(16,32,51,.08);
}
.brand-logo{
min-height:74px;
border-radius:18px;
background:#fff;
border:1px solid #e2eef6;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding:12px 14px;
font-weight:950;
font-size:18px;
line-height:1.05;
color:#122b3f;
box-shadow:0 10px 24px rgba(16,32,51,.06);
transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.brand-logo:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(8,101,173,.12);border-color:rgba(55,194,220,.65);}
.logo-daikin{color:#0077bd;letter-spacing:.3px;}
.logo-mitsu{color:#d71920;font-size:16px;}
.logo-atlantic{color:#005da8;}
.logo-chaffoteaux{color:#e31b23;}
.logo-dedietrich{color:#202020;letter-spacing:.5px;}
.logo-saunier{color:#e1261c;}
.logo-grohe{color:#0a4e9b;letter-spacing:1px;}
.logo-geberit{color:#006bb6;}
@media(max-width:900px){
.hero .trust-row{grid-template-columns:1fr!important;display:grid!important;}
.brand-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:14px;gap:12px;}
.brand-logo{min-height:62px;font-size:15px;}
}
.cta-animated{
display:inline-block;
transition:all 0.3s ease;
}
button:hover .cta-animated,
a:hover .cta-animated{
transform:translateY(-2px) scale(1.03);
}
button, .btn, .cta-button{
transition:all 0.3s ease !important;
}
button:hover, .btn:hover, .cta-button:hover{
transform:translateY(-2px);
box-shadow:0 8px 24px rgba(0,0,0,0.18);
}
/* Correctif hero CTA + avis Google */
.hero-actions .btn.primary[href="#realisations"]{
background:linear-gradient(135deg,#ffffff,#eef8ff)!important;
color:#07111a!important;
border:1px solid rgba(255,255,255,.85)!important;
box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
.hero-actions .btn.primary[href="#realisations"]:hover{
transform:translateY(-3px) scale(1.02)!important;
box-shadow:0 18px 42px rgba(0,0,0,.24)!important;
}
.hero-actions .btn.light{
background:#ffffff!important;
color:#07111a!important;
}
.trust-row .google-trust{
display:flex!important;
flex-direction:column!important;
align-items:flex-start!important;
justify-content:center!important;
gap:8px!important;
}
.trust-row .google-score{
display:flex!important;
align-items:center!important;
gap:8px!important;
line-height:1!important;
}
.trust-row .google-score strong{
display:block!important;
font-size:34px!important;
line-height:1!important;
margin:0!important;
}
.trust-row .google-star{
display:inline-flex!important;
align-items:center!important;
margin:0!important;
color:#fbbc04!important;
font-size:21px!important;
line-height:1!important;
text-shadow:0 1px 0 rgba(0,0,0,.12)!important;
}
.trust-row .google-label{
display:block!important;
margin:0!important;
color:rgba(255,255,255,.88)!important;
font-size:15px!important;
font-weight:800!important;
line-height:1.1!important;
}
/* ===== GOOGLE RATING PREMIUM REDESIGN ===== */
.stats-card:first-child{
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-start !important;
padding:22px 26px !important;
}
.stats-card:first-child h3,
.stats-card:first-child .stat-number,
.stats-card:first-child .value{
font-size:3rem !important;
font-weight:800 !important;
color:#ffffff !important;
line-height:1 !important;
display:flex !important;
align-items:center !important;
gap:10px !important;
margin:0 !important;
}
.stats-card:first-child h3::after,
.stats-card:first-child .stat-number::after,
.stats-card:first-child .value::after{
content:"★";
color:#fbbc05 !important;
font-size:1.7rem !important;
position:relative;
top:-1px;
text-shadow:0 0 10px rgba(251,188,5,0.35);
}
.stats-card:first-child p,
.stats-card:first-child .stat-label{
margin-top:12px !important;
font-size:1rem !important;
font-weight:700 !important;
color:#ffffff !important;
opacity:0.95 !important;
letter-spacing:0.2px;
}
/* === CORRECTION FINALE VISIBLE : CARTE AVIS GOOGLE HERO === */
.hero .trust-row .google-trust-fixed,
.hero .trust-row .google-trust{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
justify-content:center !important;
gap:8px !important;
padding:15px 16px !important;
min-height:88px !important;
}
.hero .trust-row .google-score-fixed,
.hero .trust-row .google-score{
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:7px !important;
line-height:1 !important;
margin:0 !important;
width:100% !important;
}
.hero .trust-row .google-rating-number,
.hero .trust-row .google-score strong{
display:inline-block !important;
color:#ffffff !important;
font-size:30px !important;
font-weight:900 !important;
line-height:1 !important;
margin:0 !important;
padding:0 !important;
}
.hero .trust-row .google-star-fixed,
.hero .trust-row .google-star,
.hero .trust-row .google-score .google-star{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
color:#fbbc05 !important;
-webkit-text-fill-color:#fbbc05 !important;
font-size:20px !important;
font-weight:900 !important;
line-height:1 !important;
margin:0 !important;
padding:0 !important;
position:relative !important;
top:1px !important;
text-shadow:0 0 10px rgba(251,188,5,.35) !important;
}
.hero .trust-row .google-label-fixed,
.hero .trust-row .google-label{
display:block !important;
color:rgba(255,255,255,.90) !important;
font-size:13px !important;
font-weight:800 !important;
line-height:1.1 !important;
margin:0 !important;
padding-left:0 !important;
text-align:left !important;
}
/* ===== FIX FINAL : mêmes dimensions pour les 3 cartes stats ===== */
.hero-stats,
.stats-grid,
.hero .stats,
.hero-stats-grid{
display:flex !important;
align-items:stretch !important;
}
.hero-stats > *,
.stats-grid > *,
.hero .stats > *,
.hero-stats-grid > *,
.stats-card{
min-height:104px !important;
height:104px !important;
width:100% !important;
flex:1 1 0 !important;
box-sizing:border-box !important;
}
.stats-card:first-child{
min-height:104px !important;
height:104px !important;
flex:1 1 0 !important;
padding:20px 24px !important;
justify-content:center !important;
}
.stats-card:first-child .google-score,
.stats-card:first-child .google-rating-line{
display:flex !important;
align-items:center !important;
gap:7px !important;
line-height:1 !important;
margin:0 !important;
}
.stats-card:first-child .google-score strong,
.stats-card:first-child .google-number,
.stats-card:first-child h3{
font-size:2.25rem !important;
line-height:1 !important;
margin:0 !important;
}
.stats-card:first-child .google-star,
.stats-card:first-child .star{
color:#fbbc05 !important;
font-size:1.25rem !important;
line-height:1 !important;
position:relative !important;
top:0 !important;
}
.stats-card:first-child .google-label,
.stats-card:first-child p{
margin-top:10px !important;
font-size:0.95rem !important;
line-height:1.1 !important;
}
/* =========================================================
FIX FINAL GOOGLE CARD - même taille que les 2 autres
========================================================= */
/* Conteneur des 3 cartes */
.hero-stats,
.stats-grid,
.hero-stats-grid,
.hero .stats,
.stats{
align-items: stretch !important;
}
/* Les 3 cartes doivent avoir exactement la même base */
.stats-card{
height: 96px !important;
min-height: 96px !important;
max-height: 96px !important;
padding: 18px 24px !important;
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: flex-start !important;
}
/* La première carte ne doit plus avoir de traitement différent */
.stats-card:first-child{
height: 96px !important;
min-height: 96px !important;
max-height: 96px !important;
padding: 18px 24px !important;
box-sizing: border-box !important;
justify-content: center !important;
align-items: flex-start !important;
}
/* Ligne 5,0 + étoile */
.stats-card:first-child h3,
.stats-card:first-child .google-rating-line,
.stats-card:first-child .google-score,
.stats-card:first-child .stat-number,
.stats-card:first-child .value{
height: 34px !important;
min-height: 34px !important;
max-height: 34px !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 7px !important;
line-height: 34px !important;
font-size: 2.05rem !important;
font-weight: 800 !important;
}
/* Étoile Google */
.stats-card:first-child .star,
.stats-card:first-child .google-star,
.stats-card:first-child h3 span,
.stats-card:first-child .stat-number span,
.stats-card:first-child .value span{
color: #fbbc05 !important;
fill: #fbbc05 !important;
font-size: 1.15rem !important;
line-height: 1 !important;
display: inline-flex !important;
align-items: center !important;
position: relative !important;
top: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
/* Texte Avis Google : même position que les labels des autres cartes */
.stats-card:first-child p,
.stats-card:first-child .google-label,
.stats-card:first-child .stat-label{
margin: 6px 0 0 0 !important;
padding: 0 !important;
height: 18px !important;
min-height: 18px !important;
max-height: 18px !important;
line-height: 18px !important;
font-size: 0.9rem !important;
font-weight: 700 !important;
color: #ffffff !important;
opacity: 0.95 !important;
}
/* Sécurité : pas d'étoile ajoutée en double par un ancien CSS */
.stats-card:first-child h3::after,
.stats-card:first-child .stat-number::after,
.stats-card:first-child .value::after{
content: none !important;
}
/* =========================================================
CORRECTION RÉELLE - CARTES HERO TRUST ROW
Cible le vrai bloc : .trust-row / .trust-card
========================================================= */
.hero .trust-row{
display:grid !important;
grid-template-columns:repeat(3, 1fr) !important;
gap:18px !important;
margin-top:42px !important;
align-items:stretch !important;
max-width:690px !important;
}
.hero .trust-row > div,
.hero .trust-row .trust-card,
.hero .trust-row .google-trust-card{
width:100% !important;
height:88px !important;
min-height:88px !important;
max-height:88px !important;
padding:16px 20px !important;
box-sizing:border-box !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-start !important;
gap:7px !important;
background:rgba(255,255,255,.10) !important;
border:1px solid rgba(255,255,255,.20) !important;
border-radius:18px !important;
overflow:hidden !important;
}
.hero .trust-row > div strong,
.hero .trust-row .trust-card strong{
height:30px !important;
line-height:30px !important;
margin:0 !important;
padding:0 !important;
display:flex !important;
align-items:center !important;
justify-content:flex-start !important;
gap:6px !important;
font-size:28px !important;
font-weight:900 !important;
color:#ffffff !important;
letter-spacing:-.6px !important;
white-space:nowrap !important;
}
.hero .trust-row > div span,
.hero .trust-row .trust-card span{
margin:0 !important;
padding:0 !important;
height:18px !important;
line-height:18px !important;
display:block !important;
font-size:14px !important;
font-weight:800 !important;
color:rgba(255,255,255,.92) !important;
opacity:1 !important;
white-space:nowrap !important;
}
.hero .trust-row .google-star{
color:#fbbc05 !important;
-webkit-text-fill-color:#fbbc05 !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
height:18px !important;
line-height:18px !important;
font-size:17px !important;
font-weight:900 !important;
margin-left:1px !important;
position:relative !important;
top:0 !important;
text-shadow:0 0 8px rgba(251,188,5,.35) !important;
}
/* Neutralise les anciens styles qui ciblaient google-trust */
.hero .trust-row .google-trust,
.hero .trust-row .google-trust-fixed,
.hero .trust-row .google-score,
.hero .trust-row .google-score-fixed,
.hero .trust-row .google-label,
.hero .trust-row .google-label-fixed{
all:unset;
}
/* Mobile : cartes empilées, même taille */
@media(max-width:760px){
.hero .trust-row{
grid-template-columns:1fr !important;
max-width:100% !important;
}
}
/* =========================================================
CORRECTION ALIGNEMENT HERO - 22/05
Demande : remonter le cadre "Intervention rapide" pour que
le haut du cadre soit aligné avec le haut du gros titre de gauche.
========================================================= */
@media (min-width: 901px){
.hero-grid{
align-items:flex-start!important;
}
.hero-card,
.premium-hero-card,
.tilt-card{
margin-top:0!important;
top:0!important;
transform:none!important;
animation:none!important;
}
.hero-card:hover,
.premium-hero-card:hover,
.tilt-card:hover{
transform:none!important;
}
}
/* =========================================================
CORRECTION RÉELLE RESPONSIVE HERO - 22/05
Quand la fenêtre rétrécit, le cadre de droite passe sous le texte
au lieu de rester coincé/coupé sous la barre de navigation.
========================================================= */
@media (min-width: 1101px){
.hero-grid{
align-items:flex-start!important;
}
.hero-card,
.premium-hero-card,
.tilt-card{
margin-top:45px!important;
top:auto!important;
transform:none!important;
animation:none!important;
}
.hero-card:hover,
.premium-hero-card:hover,
.tilt-card:hover{
transform:none!important;
}
}
@media (max-width: 1100px){
.hero{
min-height:auto!important;
height:auto!important;
padding:48px 0 70px!important;
overflow:visible!important;
align-items:flex-start!important;
}
.hero-grid{
display:grid!important;
grid-template-columns:1fr!important;
gap:34px!important;
align-items:start!important;
}
.hero-content{
width:100%!important;
padding-bottom:0!important;
}
.hero-card,
.premium-hero-card,
.tilt-card{
width:100%!important;
max-width:650px!important;
margin:0 auto!important;
top:auto!important;
transform:none!important;
animation:none!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
overflow:visible!important;
}
.hero-card:hover,
.premium-hero-card:hover,
.tilt-card:hover{
transform:none!important;
}
}
@media (max-width: 760px){
.hero{
padding:36px 0 56px!important;
}
.hero-card,
.premium-hero-card,
.tilt-card{
padding:28px!important;
}
}
/* === Correctif final AMB : formulaire devis propre + anti-spam + responsive === */
#contact.section.contact{
padding:70px 0!important;
background:linear-gradient(180deg,#f6fbff 0%,#eef7fc 100%)!important;
}
#contact .contact-grid{
max-width:1120px!important;
display:grid!important;
grid-template-columns:minmax(360px,.95fr) minmax(420px,560px)!important;
gap:52px!important;
align-items:center!important;
}
#contact .mini-title{margin-bottom:10px!important;}
#contact h2{font-size:clamp(38px,4.2vw,58px)!important;margin:12px 0 18px!important;}
#contact p{max-width:580px!important;margin:0 0 24px!important;}
#contact .contact-list{gap:12px!important;margin-top:22px!important;}
#contact .quote-form.quote-form-pro{
width:100%!important;
max-width:560px!important;
padding:26px!important;
border-radius:26px!important;
border:1px solid rgba(32,185,232,.38)!important;
background:rgba(255,255,255,.96)!important;
box-shadow:0 24px 70px rgba(8,101,173,.12)!important;
display:grid!important;
gap:13px!important;
transform:none!important;
}
.quote-form-pro .form-intro{
display:grid!important;
gap:4px!important;
margin-bottom:2px!important;
padding-bottom:12px!important;
border-bottom:1px solid #e4eff6!important;
}
.quote-form-pro .form-intro strong{font-size:21px!important;color:#102033!important;}
.quote-form-pro .form-intro span{font-size:14px!important;color:#607284!important;font-weight:700!important;}
.quote-form-pro .form-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;}
.quote-form-pro label{font-size:14px!important;font-weight:900!important;color:#07111a!important;}
.quote-form-pro .optional{font-size:12px!important;color:#607284!important;font-weight:700!important;}
.quote-form-pro input,
.quote-form-pro textarea,
.quote-form-pro select{
margin-top:7px!important;
padding:13px 14px!important;
border-radius:14px!important;
border:1px solid #cce2ee!important;
background:#fff!important;
font-size:15px!important;
font-weight:700!important;
outline:none!important;
transition:border-color .18s ease,box-shadow .18s ease!important;
}
.quote-form-pro textarea{min-height:112px!important;resize:vertical!important;}
.quote-form-pro input:focus,
.quote-form-pro textarea:focus,
.quote-form-pro select:focus{
border-color:#20b9e8!important;
box-shadow:0 0 0 4px rgba(32,185,232,.14)!important;
}
.quote-form-pro .anti-spam{
background:#f5fbff!important;
border:1px dashed #9bd7ec!important;
border-radius:16px!important;
padding:12px!important;
}
.quote-form-pro .anti-spam input{margin-top:8px!important;}
.quote-form-pro .btn.primary,
.quote-form-pro button{
margin-top:4px!important;
min-height:52px!important;
border-radius:16px!important;
font-size:15px!important;
letter-spacing:.1px!important;
}
.quote-form-pro .form-note,
.quote-form small.form-note{
display:block!important;
text-align:center!important;
color:#5d7285!important;
font-size:12px!important;
line-height:1.35!important;
margin-top:0!important;
}
.hp-field{position:absolute!important;left:-9999px!important;opacity:0!important;height:0!important;overflow:hidden!important;}
@media (max-width:1050px){
#contact.section.contact{padding:52px 0!important;}
#contact .contact-grid{
grid-template-columns:1fr!important;
max-width:680px!important;
gap:28px!important;
align-items:start!important;
}
#contact .quote-form.quote-form-pro{max-width:680px!important;}
}
@media (max-width:620px){
#contact .container{padding:0 16px!important;}
#contact h2{font-size:36px!important;}
.quote-form-pro .form-row{grid-template-columns:1fr!important;gap:12px!important;}
#contact .quote-form.quote-form-pro{padding:20px!important;border-radius:22px!important;}
}
/* === Correctif final contact : alignement + formulaire devis propre === */
#contact.section.contact{
padding:80px 0!important;
}
#contact .contact-grid{
align-items:start!important;
grid-template-columns:minmax(360px,.9fr) minmax(460px,560px)!important;
gap:64px!important;
}
#contact .contact-info{
padding-top:0!important;
margin-top:0!important;
align-self:start!important;
}
#contact .quote-form.quote-form-pro{
align-self:start!important;
margin-top:0!important;
}
#contact .form-row{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:14px!important;
}
#contact .photo-field input[type="file"]{
background:#f7fbff!important;
border-style:dashed!important;
cursor:pointer!important;
}
#contact .photo-note,
#contact .form-note{
display:block!important;
color:#587086!important;
font-size:12px!important;
line-height:1.45!important;
margin-top:-6px!important;
}
#contact .anti-spam{
border:1px dashed rgba(8,101,173,.35)!important;
background:#f8fcff!important;
border-radius:18px!important;
padding:12px!important;
}
@media(max-width:900px){
#contact .contact-grid{
grid-template-columns:1fr!important;
gap:28px!important;
}
#contact .form-row{
grid-template-columns:1fr!important;
}
}
/* === Correctif REEL formulaire contact : alignement + retrait upload photo === */
#contact .contact-grid{
align-items:start!important;
}
#contact .contact-info{
align-self:start!important;
padding-top:0!important;
margin-top:0!important;
transform:none!important;
}
#contact .quote-form.quote-form-pro{
align-self:start!important;
margin-top:0!important;
transform:none!important;
}
#contact .photo-field,
#contact input[type="file"]{
display:none!important;
}
#contact .photo-note{
display:block!important;
background:#f4fbff!important;
border:1px solid #cdeafa!important;
border-radius:14px!important;
padding:11px 13px!important;
color:#38566d!important;
font-weight:700!important;
line-height:1.45!important;
margin-top:-2px!important;
}
@media(max-width:1050px){
#contact .contact-grid{grid-template-columns:1fr!important;}
}
/* Correctif formulaire photos : plusieurs images conservées */
.photo-upload-box{
border:1px dashed #9bd8ed;
background:#f5fbff;
border-radius:16px;
padding:14px;
margin:12px 0;
}
.photo-upload-box label{margin:0;}
.photo-upload-box input[type="file"]{
margin-top:8px;
width:100%;
border:1px solid #cbe5f1;
border-radius:12px;
padding:10px;
background:#fff;
}
.photo-list{margin-top:10px;display:grid;gap:8px;}
.photo-empty{font-size:13px;color:#5f7484;}
.photo-item{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid #dcecf4;border-radius:12px;padding:9px 10px;font-weight:700;font-size:13px;color:#0d2638;}
.photo-item small{font-weight:600;color:#6d7f8a;margin-left:6px;}
.photo-item button{border:0;background:#eef8fc;color:#0b76b7;border-radius:10px;font-weight:900;font-size:18px;line-height:1;width:30px;height:30px;cursor:pointer;}
.photo-note{display:block;margin-top:8px;color:#28485a;line-height:1.45;}
/* Correctif clair photos + upload mobile/desktop */
#contact .photo-upload-box{
border:1px dashed #8ed7ef!important;
background:#f5fbff!important;
border-radius:18px!important;
padding:16px!important;
margin:14px 0!important;
}
#contact .photo-upload-title{
font-weight:900!important;
color:#102033!important;
margin-bottom:6px!important;
}
#contact .photo-note{
display:block!important;
margin:0 0 12px!important;
background:#fff!important;
border:1px solid #d7edf7!important;
border-radius:14px!important;
padding:11px 13px!important;
color:#38566d!important;
font-weight:700!important;
line-height:1.45!important;
}
#contact #photoInput{
position:absolute!important;
left:-9999px!important;
width:1px!important;
height:1px!important;
opacity:0!important;
pointer-events:none!important;
}
#contact .photo-upload-button{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:100%!important;
min-height:48px!important;
margin:0!important;
border:2px dashed #21a7d1!important;
background:linear-gradient(135deg,#ffffff,#eaf8ff)!important;
color:#0865ad!important;
border-radius:15px!important;
font-weight:900!important;
cursor:pointer!important;
transition:.2s ease!important;
}
#contact .photo-upload-button:hover{
transform:translateY(-1px)!important;
box-shadow:0 10px 24px rgba(0,100,160,.14)!important;
}
#contact .photo-list{margin-top:12px!important;display:grid!important;gap:9px!important;}
#contact .photo-empty{font-size:13px!important;color:#5f7484!important;}
#contact .photo-item{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
background:#fff!important;
border:1px solid #dcecf4!important;
border-radius:14px!important;
padding:10px 11px!important;
font-weight:800!important;
font-size:13px!important;
color:#0d2638!important;
}
#contact .photo-item span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
#contact .photo-item small{font-weight:700!important;color:#6d7f8a!important;margin-left:6px!important;}
#contact .photo-item button{
flex:0 0 auto!important;
border:0!important;
background:#eef8fc!important;
color:#0b76b7!important;
border-radius:12px!important;
font-weight:900!important;
font-size:18px!important;
line-height:1!important;
width:34px!important;
height:34px!important;
cursor:pointer!important;
}
#contact .photo-error{
color:#b33a2e!important;
font-weight:800!important;
font-size:13px!important;
margin-top:8px!important;
}
#contact .anti-spam-note{
display:block!important;
margin-top:8px!important;
color:#5d7285!important;
font-size:12px!important;
line-height:1.35!important;
}
#antiSpamQuestion{
display:block!important;
font-weight:800!important;
margin-bottom:8px!important;
}
/* =========================================================
AMÉLIORATION DEMANDÉE : animation + rendu des 3 cartes
- Cartes chiffres du haut
- Cartes Plomberie / Chauffage / Climatisation
========================================================= */
.hero .trust-row > div,
.hero .trust-row .trust-card,
.hero .trust-row .google-trust-card{
position:relative !important;
isolation:isolate !important;
overflow:hidden !important;
background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.07)) !important;
border:1px solid rgba(194,233,255,.30) !important;
box-shadow:0 18px 42px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.14) !important;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease !important;
animation:ambCardSoftIn .70s ease both !important;
}
.hero .trust-row > div:nth-child(1){animation-delay:.08s !important;}
.hero .trust-row > div:nth-child(2){animation-delay:.18s !important;}
.hero .trust-row > div:nth-child(3){animation-delay:.28s !important;}
.hero .trust-row > div::before,
.hero .trust-row .trust-card::before{
content:"" !important;
position:absolute !important;
inset:-1px !important;
border-radius:inherit !important;
background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.20) 42%,transparent 62%) !important;
transform:translateX(-130%) !important;
transition:transform .65s ease !important;
z-index:-1 !important;
}
.hero .trust-row > div::after,
.hero .trust-row .trust-card::after{
content:"" !important;
position:absolute !important;
right:-28px !important;
top:-34px !important;
width:95px !important;
height:95px !important;
border-radius:50% !important;
background:rgba(55,194,220,.16) !important;
filter:blur(2px) !important;
z-index:-2 !important;
}
.hero .trust-row > div:hover,
.hero .trust-row .trust-card:hover{
transform:translateY(-6px) scale(1.015) !important;
border-color:rgba(87,218,244,.72) !important;
box-shadow:0 24px 56px rgba(0,0,0,.25), 0 0 0 1px rgba(55,194,220,.18) inset !important;
}
.hero .trust-row > div:hover::before,
.hero .trust-row .trust-card:hover::before{
transform:translateX(130%) !important;
}
.hero .trust-row strong{
text-shadow:0 8px 22px rgba(0,0,0,.22) !important;
}
.about-visual-pro{
position:relative !important;
overflow:hidden !important;
background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(230,248,255,.96)) !important;
border-color:rgba(55,194,220,.30) !important;
}
.about-visual-pro::after{
content:"" !important;
position:absolute !important;
inset:18px !important;
border-radius:28px !important;
border:1px solid rgba(255,255,255,.55) !important;
pointer-events:none !important;
}
.about-card{
position:relative !important;
overflow:hidden !important;
background:linear-gradient(135deg,#ffffff,#f7fcff) !important;
border:1px solid rgba(11,115,183,.16) !important;
box-shadow:0 16px 38px rgba(8,38,59,.09), inset 0 1px 0 rgba(255,255,255,.90) !important;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
animation:ambCardSoftIn .70s ease both, ambCardFloat 5.5s ease-in-out infinite !important;
}
.about-card:nth-child(1){animation-delay:.08s, .40s !important;}
.about-card:nth-child(2){animation-delay:.18s, .90s !important;}
.about-card:nth-child(3){animation-delay:.28s, 1.35s !important;}
.about-card:nth-child(4){animation-delay:.38s, 1.80s !important;}
.about-card::before{
content:"" !important;
position:absolute !important;
left:0 !important;
top:0 !important;
bottom:0 !important;
width:5px !important;
background:linear-gradient(180deg,#0b73b7,#37c2dc) !important;
opacity:.95 !important;
}
.about-card::after{
content:"" !important;
position:absolute !important;
inset:0 !important;
border-radius:inherit !important;
background:linear-gradient(120deg,transparent 0%,rgba(55,194,220,.13) 45%,transparent 64%) !important;
transform:translateX(-120%) !important;
transition:transform .65s ease !important;
pointer-events:none !important;
}
.about-card:hover{
transform:translateY(-7px) scale(1.012) !important;
border-color:rgba(11,115,183,.32) !important;
box-shadow:0 24px 58px rgba(8,38,59,.14) !important;
}
.about-card:hover::after{
transform:translateX(120%) !important;
}
.about-card strong{
color:#06243a !important;
letter-spacing:-.3px !important;
}
.about-card small{
color:#48657d !important;
}
@keyframes ambCardSoftIn{
from{opacity:0;transform:translateY(18px) scale(.98)}
to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes ambCardFloat{
0%,100%{translate:0 0}
50%{translate:0 -3px}
}
@media (prefers-reduced-motion:reduce){
.hero .trust-row > div,
.hero .trust-row .trust-card,
.about-card{
animation:none !important;
transition:none !important;
}
}
/* === CORRECTION AMB : anti-clignotement hover/zoom ===
Certains blocs bougeaient avec translate/scale au survol.
Quand la souris était sur le bord bas, le bloc sortait de la souris puis revenait,
ce qui relançait l'animation en boucle. On garde les effets propres (ombre/bordure)
mais on bloque le déplacement/zoom du conteneur sur les cartes cliquables. */
.service-card,
.process article,
.review,
.stats-grid > div,
.quote-form,
.zone-showcase,
.trust-card,
.google-trust-card,
.brand-logo,
.about-card,
.sector-simple-card,
.real-photo-grid article,
.gallery-thumb,
.real-grid article,
.btn,
.nav-cta,
.chatbot-button,
.quick-questions button,
.review-arrow,
.hero-card,
.premium-hero-card,
.tilt-card,
.magnetic-btn{
will-change:auto !important;
}
.service-card:hover,
.process article:hover,
.review:hover,
.stats-grid > div:hover,
.quote-form:hover,
.zone-showcase:hover,
.trust-card:hover,
.google-trust-card:hover,
.brand-logo:hover,
.about-card:hover,
.sector-simple-card:hover,
.real-photo-grid article:hover,
.gallery-thumb:hover,
.real-grid article:hover,
.hero-card:hover,
.premium-hero-card:hover,
.tilt-card:hover,
.magnetic-btn:hover{
transform:none !important;
}
.btn:hover,
.nav-cta:hover,
.chatbot-button:hover,
.quick-questions button:hover,
.review-arrow:hover{
transform:none !important;
}
.real-photo-grid article,
.real-photo-grid article:hover{
background-size:cover !important;
}
.real-photo-grid article div,
.real-photo-grid article:hover div,
.gallery-thumb,
.gallery-thumb:hover{
transform:none !important;
}
.gallery-thumb img,
.gallery-thumb:hover img{
transform:none !important;
}
.service-card:hover,
.process article:hover,
.review:hover,
.stats-grid > div:hover,
.quote-form:hover,
.trust-card:hover,
.google-trust-card:hover,
.brand-logo:hover,
.about-card:hover,
.sector-simple-card:hover,
.real-photo-grid article:hover,
.gallery-thumb:hover,
.real-grid article:hover{
box-shadow:0 20px 48px rgba(8,101,173,.13) !important;
border-color:rgba(55,194,220,.50) !important;
}
.real-photo-grid article *,
.gallery-thumb *,
.real-grid article *,
.service-card *,
.process article *,
.review *,
.stats-grid > div *,
.about-card *,
.sector-simple-card *{
pointer-events:none;
}
/* On stoppe l'animation de flottement des cartes about qui pouvait aussi créer un effet bizarre au bord. */
.about-card{
animation:ambCardSoftIn .70s ease both !important;
}
/* =========================================================
AMB Services - animations hover premium STABLES
Correction finale : plus de déplacement du conteneur sous la souris.
Le petit effet premium reste présent via ombre, bordure, glow et zoom interne.
========================================================= */
:root{
--amb-hover-shadow: 0 22px 58px rgba(8,101,173,.16);
--amb-hover-border: rgba(55,194,220,.58);
}
/* Les liens/boutons restent toujours cliquables */
a[href^="tel:"],
a[href^="mailto:"],
.btn,
.nav-cta,
.chatbot-button,
.mobile-action-bar a{
position:relative!important;
z-index:5!important;
pointer-events:auto!important;
}
.btn > *, .nav-cta > *{pointer-events:none!important;}
/* Base propre */
.service-card,
.process article,
.review,
.stats-grid > div,
.quote-form,
.zone-showcase,
.trust-card,
.google-trust-card,
.brand-logo,
.about-card,
.sector-simple-card,
.hero-card,
.premium-hero-card,
.tilt-card,
.real-grid article,
.real-photo-grid article,
.gallery-thumb,
.btn,
.nav-cta,
.chatbot-button,
.quick-questions button{
transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease, background-size .32s ease, opacity .22s ease!important;
will-change:auto!important;
backface-visibility:hidden!important;
}
/* Cartes texte : mini zoom stable, sans translateY */
.service-card:hover,
.process article:hover,
.review:hover,
.stats-grid > div:hover,
.quote-form:hover,
.zone-showcase:hover,
.trust-card:hover,
.google-trust-card:hover,
.brand-logo:hover,
.about-card:hover,
.sector-simple-card:hover,
.hero-card:hover,
.premium-hero-card:hover,
.tilt-card:hover{
transform:scale(1.012)!important;
box-shadow:var(--amb-hover-shadow)!important;
border-color:var(--amb-hover-border)!important;
filter:saturate(1.03)!important;
}
/* Boutons : effet agréable mais le bouton ne fuit plus la souris */
.btn:hover,
.nav-cta:hover,
.chatbot-button:hover,
.quick-questions button:hover{
transform:scale(1.018)!important;
box-shadow:0 18px 38px rgba(8,101,173,.24)!important;
filter:saturate(1.08)!important;
}
.btn:active,
.nav-cta:active,
.chatbot-button:active,
.quick-questions button:active{
transform:scale(.985)!important;
}
/* Photos réalisations : zoom interne uniquement, le cadre ne bouge plus */
.real-grid article,
.real-photo-grid article{
transform:none!important;
overflow:hidden!important;
background-size:106%!important;
}
.real-grid article:hover,
.real-photo-grid article:hover{
transform:none!important;
background-size:113%!important;
box-shadow:0 24px 62px rgba(7,17,26,.22)!important;
border-color:var(--amb-hover-border)!important;
}
.real-grid article>div,
.real-photo-grid article>div,
.real-grid article:hover>div,
.real-photo-grid article:hover>div{
transform:none!important;
}
.real-grid article::before,
.real-photo-grid article::before{
transition:opacity .22s ease!important;
}
.real-grid article:hover::before,
.real-photo-grid article:hover::before{
opacity:.72!important;
}
/* Galerie classique : zoom de l'image seulement, pas du bloc */
.gallery-thumb{
transform:none!important;
overflow:hidden!important;
}
.gallery-thumb:hover{
transform:none!important;
box-shadow:0 20px 50px rgba(7,17,26,.18)!important;
border-color:var(--amb-hover-border)!important;
}
.gallery-thumb img{
transition:transform .28s ease, filter .28s ease!important;
transform-origin:center center!important;
}
.gallery-thumb:hover img{
transform:scale(1.055)!important;
filter:saturate(1.06) contrast(1.04)!important;
}
/* Flèches avis : position verticale fixe */
.review-arrow,
.review-arrow:hover{
transform:translateY(-50%)!important;
}
.review-arrow:hover{
box-shadow:0 16px 34px rgba(8,101,173,.25)!important;
}
/* Logo : joli mais stable */
.brand:hover .site-logo{
transform:scale(1.025)!important;
filter:drop-shadow(0 10px 20px rgba(8,101,173,.16))!important;
}
/* Mobile / accessibilité */
@media (hover:none){
.service-card:hover,.process article:hover,.review:hover,.stats-grid>div:hover,.quote-form:hover,.zone-showcase:hover,.trust-card:hover,.google-trust-card:hover,.brand-logo:hover,.about-card:hover,.sector-simple-card:hover,.hero-card:hover,.premium-hero-card:hover,.tilt-card:hover,.btn:hover,.nav-cta:hover,.chatbot-button:hover,.quick-questions button:hover{transform:none!important;}
.real-grid article:hover,.real-photo-grid article:hover{background-size:106%!important;}
.gallery-thumb:hover img{transform:none!important;}
}
/* =========================================================
CORRECTION FINALE AMB - hover stable uniquement sur :
- les 3 cartes bleues du haut
- les 6 cartes services
Même rendu joli que les blocs qui fonctionnent, sans saut vertical.
========================================================= */
.trust-row > div,
.trust-row .trust-card,
.trust-row .google-trust-card,
.enhanced-services .service-card{
transform:none !important;
transform-origin:center center !important;
transition:box-shadow .22s ease, border-color .22s ease, filter .22s ease, background .22s ease, opacity .22s ease !important;
will-change:auto !important;
backface-visibility:hidden !important;
}
.trust-row > div:hover,
.trust-row .trust-card:hover,
.trust-row .google-trust-card:hover,
.enhanced-services .service-card:hover{
/* Pas de translateY et pas de déplacement : donc plus de clignotement au bord */
transform:none !important;
box-shadow:0 24px 60px rgba(8,101,173,.18) !important;
border-color:rgba(56,197,223,.72) !important;
filter:saturate(1.05) contrast(1.02) !important;
}
/* Effet visuel de petit zoom sur le contenu, mais le cadre ne bouge pas */
.trust-row > div > *,
.trust-row .trust-card > *,
.trust-row .google-trust-card > *,
.enhanced-services .service-card > *{
transition:transform .22s ease, filter .22s ease !important;
transform-origin:center center !important;
}
.trust-row > div:hover > *,
.trust-row .trust-card:hover > *,
.trust-row .google-trust-card:hover > *,
.enhanced-services .service-card:hover > *{
transform:scale(1.012) !important;
}
/* Correction affichage des coches si le navigateur affiche mal le symbole */
.enhanced-services .service-card li:before{
content:"✓" !important;
display:inline-block !important;
margin-right:8px !important;
color:#0a9fc8 !important;
font-weight:900 !important;
}
@media (hover:none){
.trust-row > div:hover > *,
.trust-row .trust-card:hover > *,
.trust-row .google-trust-card:hover > *,
.enhanced-services .service-card:hover > *{
transform:none !important;
}
}
/* =========================================================
CORRECTION FINALE 23/05 : navbar stable + zone sans zoom
- Le logo garde la même taille au scroll.
- La barre ne change plus de hauteur au scroll.
- La grande carte Zone d'intervention ne zoome plus : seul le bouton bleu réagit.
- Les 3 cartes bleues du haut gardent un hover doux sans déplacement.
========================================================= */
@media (min-width:901px){
.navbar,
.navbar.nav-scrolled{
min-height:104px!important;
padding-top:16px!important;
padding-bottom:16px!important;
padding-left:64px!important;
padding-right:28px!important;
background:rgba(255,255,255,.94)!important;
box-shadow:0 8px 30px rgba(0,0,0,.06)!important;
}
.site-logo,
.site-logo.big-logo,
.navbar.nav-scrolled .site-logo,
.navbar.nav-scrolled .site-logo.big-logo{
height:82px!important;
width:auto!important;
max-width:230px!important;
object-fit:contain!important;
transform:none!important;
}
}
.brand:hover .site-logo,
.navbar.nav-scrolled .brand:hover .site-logo{
transform:none!important;
filter:none!important;
}
.trust-row .trust-card,
.trust-row .google-trust-card{
transform:none!important;
transition:box-shadow .22s ease,border-color .22s ease,background .22s ease!important;
will-change:auto!important;
}
.trust-row .trust-card:hover,
.trust-row .google-trust-card:hover{
transform:none!important;
box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
border-color:rgba(83,214,234,.55)!important;
}
.zone-box,
.zone-box:hover,
.zone-box:focus-within{
transform:none!important;
scale:1!important;
filter:none!important;
}
.zone-box .btn,
.zone-box .btn.primary{
transition:box-shadow .22s ease,filter .22s ease,background .22s ease!important;
}
.zone-box .btn:hover,
.zone-box .btn.primary:hover{
transform:none!important;
filter:brightness(1.05)!important;
box-shadow:0 18px 38px rgba(22,143,202,.28)!important;
}
/* =========================================================
CORRECTION MOBILE UNIQUEMENT - 23/05
Objectif : supprimer le débordement horizontal sur téléphone
sans modifier le rendu PC.
+ Header mobile plus clair pour rendre le logo lisible.
========================================================= */
@media (max-width: 900px){
html,
body{
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
body{
position:relative!important;
}
.navbar,
.navbar.nav-scrolled{
left:0!important;
right:0!important;
width:100%!important;
max-width:100%!important;
padding:12px 18px!important;
background:rgba(247,251,253,.96)!important;
border-bottom:1px solid rgba(8,101,173,.10)!important;
box-shadow:0 10px 28px rgba(7,17,26,.10)!important;
backdrop-filter:blur(12px)!important;
overflow:visible!important;
}
.site-logo,
.site-logo.big-logo,
.navbar.nav-scrolled .site-logo,
.navbar.nav-scrolled .site-logo.big-logo{
height:56px!important;
width:auto!important;
max-width:155px!important;
object-fit:contain!important;
transform:none!important;
filter:none!important;
}
.mobile-menu{
flex:0 0 auto!important;
background:#eef3f7!important;
color:#26333d!important;
}
.container,
section,
.hero,
.section,
.stats,
.soft,
.zone,
.contact,
.footer,
.cta-band,
.realisations-pro{
width:100%!important;
max-width:100%!important;
overflow-x:hidden!important;
}
.hero-grid,
.contact-grid,
.zone-showcase,
.zone-box,
.review-summary,
.quote-form,
.real-photo-grid,
.gallery-block,
.sector-clean-section,
.footer-grid{
width:100%!important;
max-width:100%!important;
min-width:0!important;
}
img,
video,
iframe{
max-width:100%!important;
height:auto;
}
}
@media (max-width: 760px){
.stats{
display:block!important;
}
.stats .container{
padding-left:16px!important;
padding-right:16px!important;
}
.stats-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:12px!important;
width:100%!important;
max-width:100%!important;
min-width:0!important;
}
.stats-grid > div{
width:auto!important;
min-width:0!important;
max-width:100%!important;
height:auto!important;
min-height:112px!important;
max-height:none!important;
padding:18px 10px!important;
}
.stats strong{
font-size:clamp(30px,9vw,40px)!important;
line-height:1!important;
white-space:nowrap!important;
}
.stats span{
font-size:13px!important;
line-height:1.25!important;
max-width:130px!important;
}
.chatbot{
right:14px!important;
left:auto!important;
bottom:84px!important;
max-width:calc(100vw - 28px)!important;
}
.chatbot-button{
max-width:calc(100vw - 28px)!important;
white-space:normal!important;
}
.mobile-action-bar{
left:12px!important;
right:12px!important;
width:auto!important;
max-width:calc(100vw - 24px)!important;
}
}
@media (max-width: 420px){
.stats-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.hero h1{
font-size:clamp(36px,13vw,48px)!important;
}
.hero p{
font-size:17px!important;
}
}
/* =========================================================
PATCH FINAL - 23/05 - uniquement stabilité hover PC
- 3 cartes du haut : aucun déplacement, aucun zoom contenu
- Zone d'intervention : le grand cadre ne bouge plus
- Seul le bouton "Appeler AMB Services" réagit au passage souris
========================================================= */
.hero .trust-row,
.hero .trust-row *{
backface-visibility:hidden!important;
}
.hero .trust-row .trust-card,
.hero .trust-row .google-trust-card,
.hero .trust-row .trust-card:hover,
.hero .trust-row .google-trust-card:hover,
.hero .trust-row .trust-card:focus,
.hero .trust-row .google-trust-card:focus,
.hero .trust-row .trust-card:active,
.hero .trust-row .google-trust-card:active{
transform:none!important;
translate:0 0!important;
scale:1!important;
rotate:0deg!important;
filter:none!important;
will-change:auto!important;
}
.hero .trust-row .trust-card > *,
.hero .trust-row .google-trust-card > *,
.hero .trust-row .trust-card:hover > *,
.hero .trust-row .google-trust-card:hover > *{
transform:none!important;
translate:0 0!important;
scale:1!important;
}
.hero .trust-row .trust-card:hover,
.hero .trust-row .google-trust-card:hover{
border-color:rgba(83,214,234,.65)!important;
box-shadow:0 16px 38px rgba(8,101,173,.18)!important;
background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.10))!important;
}
#secteur .sector-simple-card,
#secteur .sector-simple-card:hover,
#secteur .sector-simple-card:focus-within,
#secteur .sector-simple-card:active,
#secteur .sector-simple-list,
#secteur .sector-simple-list:hover,
#secteur .sector-simple-list:focus-within{
transform:none!important;
translate:0 0!important;
scale:1!important;
rotate:0deg!important;
filter:none!important;
will-change:auto!important;
}
#secteur .sector-simple-card:hover{
box-shadow:0 18px 60px rgba(8,101,173,.08)!important;
}
#secteur .sector-call,
#secteur .sector-call:hover,
#secteur .sector-call:focus,
#secteur .sector-call:active{
transform:none!important;
translate:0 0!important;
scale:1!important;
}
#secteur .sector-call:hover,
#secteur .sector-call:focus-visible{
filter:brightness(1.06) saturate(1.05)!important;
box-shadow:0 18px 38px rgba(22,143,202,.28)!important;
}
/* =========================================================
CORRECTIF FINAL RÉEL - bouton "Voir nos réalisations"
On remet une animation visible uniquement sur CE bouton,
sans JS magnétique et sans mouvement du texte interne.
========================================================= */
.hero-actions .btn.primary[href="#realisations"],
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn{
position:relative!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
overflow:hidden!important;
transform:translateZ(0) scale(1)!important;
transform-origin:center center!important;
transition:transform .22s ease, box-shadow .22s ease, background .22s ease, filter .22s ease!important;
will-change:transform!important;
background:linear-gradient(135deg,#ffffff,#eef8ff)!important;
color:#07111a!important;
box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
.hero-actions .btn.primary[href="#realisations"] .cta-animated,
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn .cta-animated,
.hero-actions .btn.primary[href="#realisations"]:hover .cta-animated,
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn:hover .cta-animated{
transform:none!important;
pointer-events:none!important;
}
.hero-actions .btn.primary[href="#realisations"]:hover,
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn:hover,
.hero-actions .btn.primary[href="#realisations"]:focus-visible,
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn:focus-visible{
transform:translateY(-2px) scale(1.025)!important;
filter:brightness(1.03)!important;
box-shadow:0 20px 44px rgba(0,0,0,.26)!important;
}
.hero-actions .btn.primary[href="#realisations"]:active,
.hero-actions a.btn.primary[href="#realisations"].magnetic-btn:active{
transform:translateY(0) scale(.99)!important;
}
/* =========================================================
DERNIER CORRECTIF CIBLÉ - bouton Voir nos réalisations
Même comportement que le bouton Appeler, sans animation cassée.
========================================================= */
.hero-actions a.btn[href="#realisations"]{
background:#ffffff!important;
color:#07111a!important;
border-radius:16px!important;
padding:15px 24px!important;
box-shadow:none!important;
transform:none!important;
transition:transform .22s ease, box-shadow .22s ease, filter .22s ease!important;
}
.hero-actions a.btn[href="#realisations"]:hover,
.hero-actions a.btn[href="#realisations"]:focus-visible{
transform:scale(1.018)!important;
box-shadow:0 18px 38px rgba(8,101,173,.24)!important;
filter:saturate(1.08)!important;
}
.hero-actions a.btn[href="#realisations"]:active{
transform:scale(.985)!important;
}
.hero-actions a.btn[href="#realisations"] *,
.hero-actions a.btn[href="#realisations"]:hover *{
transform:none!important;
}
/* =========================================================
CORRECTION FINALE DEMANDÉE - 24/05
- Accueil : on garde seulement 2 cartes (Note Google + Intervention rapide)
- Stats : centrage identique pour 15 ans +, Gratuit, 48h et 77
========================================================= */
.hero .trust-row{
display:flex!important;
align-items:stretch!important;
gap:18px!important;
flex-wrap:wrap!important;
}
.hero .trust-row .trust-card{
min-height:78px!important;
display:flex!important;
flex-direction:column!important;
justify-content:center!important;
}
.stats .stats-grid > div{
min-height:116px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
padding-top:18px!important;
padding-bottom:18px!important;
}
.stats .stats-grid > div strong{
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:44px!important;
line-height:1!important;
margin:0 0 8px 0!important;
padding:0!important;
}
.stats .stats-grid > div span{
display:block!important;
margin:0!important;
line-height:1.22!important;
}
/* =========================================================
Bandeau cookies fonctionnel AMB Services
========================================================= */
.cookie-consent{
position:fixed!important;
left:0!important;
right:0!important;
bottom:0!important;
z-index:2147483000!important;
display:none;
padding:14px!important;
pointer-events:none!important;
}
.cookie-consent.is-visible{
display:block!important;
}
.cookie-consent__box{
width:min(980px, calc(100% - 10px));
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
background:rgba(255,255,255,.98);
color:#102230;
border:1px solid rgba(12,79,117,.18);
border-radius:20px;
box-shadow:0 18px 55px rgba(10,45,70,.25);
padding:16px;
pointer-events:auto!important;
}
.cookie-consent__text strong{
display:block;
color:#0b4f75;
font-size:1rem;
margin-bottom:4px;
}
.cookie-consent__text p{
margin:0;
line-height:1.45;
font-size:.95rem;
}
.cookie-consent__actions{
display:flex;
gap:10px;
flex-shrink:0;
}
.cookie-btn{
appearance:none;
border:0;
border-radius:12px;
padding:11px 15px;
font-weight:800;
cursor:pointer!important;
line-height:1;
transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.cookie-btn:hover,
.cookie-btn:focus-visible{
transform:translateY(-1px);
}
.cookie-btn--primary{
background:#0b4f75;
color:#fff;
box-shadow:0 10px 22px rgba(11,79,117,.25);
}
.cookie-btn--ghost{
background:#eef6fb;
color:#0b4f75;
border:1px solid rgba(11,79,117,.16);
}
@media (max-width:700px){
.cookie-consent{
padding:10px 10px calc(78px + env(safe-area-inset-bottom, 0px))!important;
}
.cookie-consent__box{
flex-direction:column;
align-items:stretch;
gap:12px;
border-radius:18px;
}
.cookie-consent__actions{
width:100%;
}
.cookie-btn{
flex:1;
min-height:44px;
}
}
/* Liens légaux footer */
.footer-links-cookies{
max-width:1180px;
margin:10px auto 0;
padding:0 20px;
display:flex;
justify-content:center;
align-items:center;
gap:12px;
flex-wrap:wrap;
font-size:13px;
}
.footer-links-cookies a,
.footer-links-cookies span{
color:#9fdcff;
}
.footer-links-cookies a{
text-decoration:none;
opacity:.95;
}
.footer-links-cookies a:hover,
.footer-links-cookies a:focus{
text-decoration:underline;
}
/* Bandeau horaires dynamique */
.topbar{
min-height:30px!important;
padding:6px 18px!important;
gap:24px!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
font-size:13px!important;
line-height:1.25!important;
}
.opening-status{
display:inline-flex;
align-items:center;
justify-content:center;
gap:7px;
white-space:normal;
}
.status-dot{
width:8px;
height:8px;
border-radius:999px;
display:inline-block;
flex:0 0 auto;
}
.status-dot.open{background:#2ee66b;box-shadow:0 0 8px rgba(46,230,107,.75);}
.status-dot.closed{background:#ffb13b;box-shadow:0 0 8px rgba(255,177,59,.75);}
.opening-status.is-open{color:#eafff0;}
.opening-status.is-closed{color:#fff4df;}
@media(max-width:900px){
.topbar{
display:flex!important;
font-size:11px!important;
padding:6px 10px!important;
}
.topbar div:nth-child(2){display:none!important;}
}
/* Correction gestion cookies footer : pas de saut de page, réouverture immédiate */
#manageCookiesLink{
cursor:pointer;
}
.cookie-consent.is-visible{
display:block!important;
visibility:visible!important;
opacity:1!important;
pointer-events:none!important;
}
.cookie-consent.is-visible .cookie-consent__box{
pointer-events:auto!important;
}
/* masque totalement la jonction */
.site-header::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:#fff;
z-index:5;
}
/* CORRECTION RÉELLE : aucune fuite visuelle entre .topbar et .navbar */
.topbar{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
height: 28px !important;
min-height: 28px !important;
padding: 0 18px !important;
margin: 0 !important;
line-height: 28px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
overflow: hidden !important;
background: #07111a !important;
color: #ffffff !important;
z-index: 10001 !important;
}
.navbar{
position: fixed !important;
top: 27px !important; /* chevauche de 1px le bandeau noir pour supprimer le jour */
left: 0 !important;
right: 0 !important;
width: 100% !important;
margin: 0 !important;
background: rgba(255,255,255,.98) !important;
z-index: 10000 !important;
box-sizing: border-box !important;
}
/* Le contenu commence sous les 2 barres fixes */
body{
padding-top: 132px !important;
}
/* Petit cache blanc interne au menu pour éviter toute transparence au raccord */
.navbar::before{
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
height: 2px;
background: #ffffff;
pointer-events: none;
z-index: 0;
}
/* Les éléments du menu restent au-dessus du cache */
.navbar > *{
position: relative;
z-index: 1;
}
@media(max-width:900px){
.topbar{
height: 34px !important;
min-height: 34px !important;
line-height: 1.25 !important;
padding: 4px 10px !important;
font-size: 11px !important;
text-align: center !important;
}
.topbar div:nth-child(2){
display: none !important;
}
.navbar{
top: 33px !important;
}
body{
padding-top: 116px !important;
}
}
/* === Ajustement cartes avis accueil === */
.trust-row{
display:flex !important;
gap:16px !important;
align-items:stretch !important;
}
.trust-card{
flex:0 1 230px !important;
min-width:0 !important;
padding:16px 18px !important;
border-radius:22px !important;
}
.trust-card strong{
display:block !important;
font-size:1.05rem !important;
line-height:1.15 !important;
white-space:nowrap !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
}
.trust-card span{
display:block !important;
margin-top:6px !important;
font-size:0.88rem !important;
line-height:1.1 !important;
}
.google-trust-card strong{
font-size:1.7rem !important;
}
@media (max-width:768px){
.trust-row{
flex-direction:column !important;
}
.trust-card{
width:100% !important;
flex:1 1 auto !important;
}
}
/* Galerie : 16 photos visibles + réalisations complémentaires déroulantes */
.gallery-extra{
display:none!important;
grid-template-columns:repeat(4,1fr)!important;
gap:14px!important;
margin-top:14px!important;
}
.gallery-extra.open{
display:grid!important;
}
.gallery-more-wrap{
display:flex!important;
justify-content:center!important;
margin-top:20px!important;
}
.gallery-more-btn{
border:0!important;
cursor:pointer!important;
border-radius:999px!important;
padding:13px 22px!important;
font-weight:900!important;
color:#fff!important;
background:linear-gradient(135deg,#0865ad,#37c2dc)!important;
box-shadow:0 16px 34px rgba(8,101,173,.22)!important;
}
.gallery-more-btn:hover{
filter:brightness(1.03)!important;
}
@media(max-width:1000px){
.gallery-extra{grid-template-columns:repeat(3,1fr)!important;}
}
@media(max-width:640px){
.gallery-extra{grid-template-columns:repeat(2,1fr)!important;gap:10px!important;}
.gallery-more-btn{width:100%!important;}
}
/* === AMB correction hero : texte du bloc de droite remonté === */
.premium-hero-card,
.hero-card{
padding-top:26px!important;
}
.premium-hero-card h2,
.hero-card h2{
margin-top:0!important;
}
/* =========================================================
CORRECTION SCROLL MOBILE - 27/05/2026
Objectif : éviter les blocages de défilement sur téléphone.
- On garde le rendu existant.
- On force le scroll vertical fluide.
- Les éléments fixes ne capturent plus toute la zone tactile.
- Les animations lourdes sont neutralisées uniquement sur mobile.
========================================================= */
@media (max-width: 900px){
html,
body{
height:auto!important;
min-height:100%!important;
overflow-y:auto!important;
overflow-x:hidden!important;
-webkit-overflow-scrolling:touch!important;
overscroll-behavior-y:auto!important;
touch-action:pan-y!important;
}
body{
position:relative!important;
}
/* Empêche les carrousels / zones horizontales de bloquer le geste vertical */
.review-track,
.brand-marquee,
.gallery-block,
.real-photo-grid,
.service-grid,
.process-grid,
.stats-grid{
touch-action:pan-y!important;
overscroll-behavior:auto!important;
}
/* Le menu mobile peut défiler si l'écran est petit */
.navlinks.open{
max-height:calc(100dvh - 95px)!important;
overflow-y:auto!important;
-webkit-overflow-scrolling:touch!important;
touch-action:pan-y!important;
}
/* Les barres fixes ne doivent pas créer une zone invisible qui bloque le scroll */
.mobile-action-bar,
.chatbot{
pointer-events:none!important;
}
.mobile-action-bar a,
.chatbot-button,
.chat-window,
.chat-window *{
pointer-events:auto!important;
}
/* Moins de saccades sur mobile : animations d'apparition déjà visibles, pas besoin de transform au scroll */
.reveal,
.reveal.is-visible{
opacity:1!important;
transform:none!important;
transition:none!important;
}
.service-card:hover,
.real-photo-grid article:hover,
.hero-actions .btn:hover,
.nav-cta:hover,
.btn:hover{
transform:none!important;
}
}
@media (max-width: 520px){
.chat-window.open{
height:min(78dvh, 560px)!important;
max-height:calc(100dvh - 110px)!important;
}
}
/* =========================================================
AMB Services - amélioration visuelle MOBILE uniquement
27/05/2026 : version portable moins sombre, plus proche du rendu ordinateur
========================================================= */
@media(max-width:900px){
.navbar,
.navbar.nav-scrolled{
background:#ffffff!important;
box-shadow:0 10px 28px rgba(7,17,26,.10)!important;
}
.mobile-menu{
background:linear-gradient(135deg,#eef8ff,#dff3fb)!important;
color:#173044!important;
box-shadow:0 10px 24px rgba(7,17,26,.10)!important;
}
.nav-cta{
background:linear-gradient(135deg,#0865ad,#2bbde0)!important;
color:#fff!important;
}
.hero{
background:
radial-gradient(circle at 18% 10%,rgba(70,205,232,.30),transparent 30%),
radial-gradient(circle at 92% 18%,rgba(255,255,255,.20),transparent 28%),
linear-gradient(135deg,#0b263b 0%,#0f5f91 55%,#19a1d4 100%)!important;
padding:46px 0 38px!important;
}
.hero-overlay{
opacity:.42!important;
background-size:44px 44px!important;
}
.hero:before{
opacity:.75!important;
background:radial-gradient(circle,rgba(74,211,235,.30),transparent 64%)!important;
}
.hero:after{
opacity:.55!important;
background:radial-gradient(circle,rgba(255,255,255,.18),transparent 66%)!important;
}
.hero h1{
text-shadow:0 10px 28px rgba(0,0,0,.20)!important;
}
.hero p{
color:rgba(255,255,255,.95)!important;
}
.hero-actions .btn,
.btn.light{
background:#ffffff!important;
color:#07111a!important;
box-shadow:0 12px 28px rgba(7,17,26,.16)!important;
}
.hero-actions .btn.primary,
.btn.primary{
background:linear-gradient(135deg,#0865ad,#37c2dc)!important;
color:#ffffff!important;
}
.hero-card,
.premium-hero-card{
background:rgba(255,255,255,.18)!important;
border-color:rgba(255,255,255,.30)!important;
box-shadow:0 22px 55px rgba(7,17,26,.20)!important;
}
.trust-card,
.hero .trust-row>div{
background:rgba(255,255,255,.16)!important;
border-color:rgba(255,255,255,.28)!important;
}
}
@media(max-width:520px){
.topbar{
background:#07111a!important;
}
.navbar{
min-height:82px!important;
}
.hero{
padding-top:42px!important;
}
.hero h1{
font-size:clamp(36px,10vw,46px)!important;
line-height:1.06!important;
}
}
/* MOBILE FIX FINAL : haut de page éclairci (pas de bande noire au départ) */
@media (max-width: 900px){
.topbar{
display:flex !important;
background:linear-gradient(135deg,#071c2c 0%,#0b3d5f 100%) !important;
color:#ffffff !important;
box-shadow:0 2px 10px rgba(7,17,26,.16) !important;
}
.navbar,
.navbar.nav-scrolled{
background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(239,248,253,.94)) !important;
backdrop-filter:blur(10px) !important;
-webkit-backdrop-filter:blur(10px) !important;
border-bottom:1px solid rgba(11,115,183,.12) !important;
box-shadow:0 8px 24px rgba(7,17,26,.08) !important;
}
.hero{
background:
radial-gradient(circle at 18% 6%,rgba(67,202,229,.26),transparent 34%),
linear-gradient(180deg,#0b2d49 0%,#0f5f91 58%,#1687bd 100%) !important;
}
.hero::before,
.hero::after{
opacity:.45 !important;
}
.nav-tagline{
display:none !important;
}
.mobile-menu{
background:linear-gradient(135deg,#eef8ff,#dceff8) !important;
color:#173044 !important;
border-radius:18px !important;
box-shadow:0 10px 24px rgba(7,17,26,.12) !important;
}
}
/* =========================================================
CORRECTION DEMANDEE 27/05 - Mobile haut blanc + assistant en pause
========================================================= */
/* Assistant client BÊTA mis en pause sur ordinateur et mobile */
.chatbot,
#chatbot,
.chatbot-button,
#chatOpen,
.chat-window,
#chatWindow{
display:none!important;
visibility:hidden!important;
pointer-events:none!important;
}
@media(max-width:900px){
/* Bandeau horaires mobile en blanc pour éviter l'effet noir en haut */
.topbar{
display:flex!important;
background:#ffffff!important;
color:#102033!important;
border-bottom:1px solid rgba(8,101,173,.12)!important;
box-shadow:0 2px 12px rgba(7,17,26,.08)!important;
}
.opening-status,
.opening-status.is-open,
.opening-status.is-closed{
color:#102033!important;
}
.status-dot.closed{
background:#e78a00!important;
box-shadow:0 0 7px rgba(231,138,0,.45)!important;
}
.status-dot.open{
background:#18b957!important;
box-shadow:0 0 7px rgba(24,185,87,.45)!important;
}
/* Barre logo/menu mobile blanche, propre et lisible */
.navbar,
.navbar.nav-scrolled{
background:#ffffff!important;
border-bottom:1px solid rgba(8,101,173,.10)!important;
box-shadow:0 8px 22px rgba(7,17,26,.08)!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
}
/* =========================================================
CORRECTION SCROLL MOBILE ANDROID / iPHONE - 27/05
Ne touche pas la version PC.
Objectif : supprimer les zones qui accrochent le doigt autour
des cartes "Note Google / Réactivité garantie".
========================================================= */
@media (max-width: 900px){
html{
scroll-behavior:auto!important;
overflow-x:hidden!important;
}
body{
overflow-x:hidden!important;
overflow-y:visible!important;
-webkit-overflow-scrolling:touch!important;
touch-action:auto!important;
}
main,
section,
.hero,
.hero-grid,
.hero-content,
.trust-row,
.trust-card,
.hero-card,
.premium-hero-card,
.process,
.process-grid,
.container{
touch-action:pan-y!important;
-webkit-user-select:auto!important;
user-select:auto!important;
}
/* Sur mobile, on supprime les effets qui peuvent créer des micro-blocages au scroll */
.hero-card,
.premium-hero-card,
.trust-card,
.process article,
.service-card,
.review,
.real-photo-grid article,
.tilt-card,
.magnetic-btn,
.reveal,
.reveal.is-visible{
transform:none!important;
transition:none!important;
animation:none!important;
}
.hero-card-shine,
.hero-overlay{
pointer-events:none!important;
}
/* Les boutons fixes du bas ne capturent que leurs boutons, pas toute la largeur de l'écran */
.mobile-action-bar{
pointer-events:none!important;
height:auto!important;
}
.mobile-action-bar a{
pointer-events:auto!important;
touch-action:manipulation!important;
}
/* Assistant déjà en pause : on s'assure qu'aucune couche invisible ne reste au-dessus du site */
.chatbot,
#chatbot,
.chat-window,
#chatWindow,
.chatbot-button,
#chatOpen{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
/* Plus de scroll horizontal caché qui accroche le geste vertical */
.review-track,
.brand-marquee{
scroll-snap-type:none!important;
scroll-behavior:auto!important;
overflow-x:hidden!important;
touch-action:pan-y!important;
}
}
@media (max-width: 760px){
body{
padding-bottom:82px!important;
}
.hero{
overflow:hidden!important;
}
}