:root{--navy:#071b2f;--blue:#0875c9;--blue2:#1499e5;--pale:#f1f8fd;--white:#fff;--text:#17212b;--green:#18a05e}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);line-height:1.55;background:#fff}a{text-decoration:none;color:inherit}
.top{background:var(--navy);color:#fff;text-align:center;padding:8px 16px;font-weight:700;font-size:14px}
header{position:sticky;top:0;z-index:20;background:#fff;box-shadow:0 2px 15px #00000014}.nav{max-width:1180px;margin:auto;padding:9px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand img{width:265px;max-height:76px;object-fit:contain;object-position:left center}.navlinks{display:flex;align-items:center;gap:20px;font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:9px;font-weight:900;background:var(--blue);color:#fff;border:0}.btn.green{background:var(--green)}.btn.white{background:#fff;color:var(--navy)}
.hero{background:linear-gradient(115deg,#06182a 0%,#083f68 60%,#0875c9 150%);color:#fff;padding:72px 20px}.wrap{max-width:1180px;margin:auto}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:42px;align-items:center}
.kicker{font-weight:900;color:#67c9ff;text-transform:uppercase;letter-spacing:.8px}h1{font-size:52px;line-height:1.03;margin:8px 0 18px}h2{font-size:35px;line-height:1.1;color:var(--navy);margin:0 0 15px}.lead{font-size:20px;max-width:760px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.hero-card{background:#fff;color:var(--text);padding:27px;border-radius:16px;box-shadow:0 12px 40px #0003}.hero-card h3{font-size:25px;color:var(--navy);margin:0 0 14px}.check{padding:8px 0;border-bottom:1px solid #edf1f4}.check:last-child{border:0}.check:before{content:"✓";color:var(--green);font-weight:900;margin-right:9px}
section{padding:70px 20px}.soft{background:var(--pale)}.center{text-align:center}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}.service{background:#fff;border:1px solid #dbe8f1;border-radius:14px;padding:25px;box-shadow:0 4px 18px #08233a0b}.icon{font-size:30px}.service h3{font-size:20px;color:var(--navy);margin:8px 0}.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:28px}.trust div{background:#fff;border:1px solid #dbe8f1;padding:20px;border-radius:12px;text-align:center;font-weight:800}
.band{background:var(--blue);color:#fff}.band h2{color:#fff}.zones{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.zone{background:#fff;color:var(--navy);padding:11px 14px;border-radius:999px;font-weight:800}
.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:25px}.card{background:#fff;border-radius:15px;padding:27px;border:1px solid #dbe8f1;box-shadow:0 5px 25px #0000000d}form{display:grid;gap:12px}input,select,textarea{font:inherit;width:100%;padding:14px;border:1px solid #cbd8e2;border-radius:8px}textarea{min-height:120px}
footer{background:#051525;color:#dbe5ec;padding:38px 20px}.footer{display:grid;grid-template-columns:1.5fr 1fr;gap:25px}.footer img{width:280px;background:#fff;border-radius:10px;padding:4px}.small{font-size:13px;color:#778590}
.mobile-call{display:none}
@media(max-width:850px){.navlinks a:not(.btn){display:none}.brand img{width:205px}.hero-grid,.contact{grid-template-columns:1fr}.grid3{grid-template-columns:1fr}.trust{grid-template-columns:1fr 1fr}h1{font-size:39px}.hero{padding:50px 20px}.mobile-call{display:block;position:fixed;z-index:50;left:14px;right:14px;bottom:14px;background:var(--green);color:#fff;text-align:center;padding:15px;border-radius:10px;font-weight:900;box-shadow:0 5px 24px #0005}body{padding-bottom:66px}}

/* V3 — animations et rendu plus vivant */
body{overflow-x:hidden}
.top{background:linear-gradient(90deg,#06182a,#0875c9,#06182a);background-size:200% 100%;animation:topFlow 8s linear infinite}
@keyframes topFlow{to{background-position:200% 0}}
.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#06182a,#075286,#0b88d6);background-size:180% 180%;animation:heroFlow 10s ease infinite}
@keyframes heroFlow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;background:#ffffff10;pointer-events:none}
.hero:before{width:360px;height:360px;right:-80px;top:-130px;animation:float 6s ease-in-out infinite}
.hero:after{width:180px;height:180px;left:42%;bottom:-100px;animation:float 8s ease-in-out infinite reverse}
@keyframes float{50%{transform:translateY(22px) translateX(10px)}}
.hero-grid{position:relative;z-index:2}
.kicker{display:inline-block;padding:7px 12px;border:1px solid #ffffff30;border-radius:999px;background:#ffffff0e}
h1{animation:rise .7s ease both}.lead{animation:rise .8s .08s ease both}.actions{animation:rise .8s .16s ease both}.hero-card{animation:slideIn .8s .12s ease both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes slideIn{from{opacity:0;transform:translateX(35px)}to{opacity:1;transform:none}}
.btn{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;box-shadow:0 6px 18px #0000001c}
.btn:hover{transform:translateY(-3px);box-shadow:0 10px 25px #0000002a;filter:brightness(1.06)}
.btn.green{position:relative;overflow:hidden}
.btn.green:after{content:"";position:absolute;inset:-60% auto -60% -40%;width:30%;transform:rotate(20deg);background:#ffffff40;animation:shine 4s ease-in-out infinite}
@keyframes shine{0%,65%{left:-45%}85%,100%{left:130%}}
.service{position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.service:before{content:"";position:absolute;left:0;top:0;width:5px;height:0;background:linear-gradient(#1499e5,#0875c9);transition:height .25s ease}
.service:hover{transform:translateY(-7px);box-shadow:0 14px 32px #0875c922;border-color:#9dd8fa}.service:hover:before{height:100%}
.icon{display:inline-flex;width:55px;height:55px;align-items:center;justify-content:center;border-radius:15px;background:linear-gradient(145deg,#e9f8ff,#cceeff);transition:transform .25s ease}.service:hover .icon{transform:rotate(-5deg) scale(1.1)}
.trust div{transition:.25s ease}.trust div:hover{transform:translateY(-5px);border-color:#79c9f5;box-shadow:0 9px 24px #0875c91c}
.band{position:relative;background:linear-gradient(120deg,#0875c9,#075286);overflow:hidden}.band:after{content:"";position:absolute;width:500px;height:500px;border:80px solid #ffffff0a;border-radius:50%;right:-230px;top:-250px}
.zone{position:relative;z-index:2;transition:.2s ease}.zone:hover{transform:scale(1.06)}
.brand img{transition:transform .25s ease}.brand:hover img{transform:scale(1.025)}
.pulse-dot{display:inline-block;width:10px;height:10px;background:#38df83;border-radius:50%;margin-right:8px;box-shadow:0 0 0 0 #38df8380;animation:pulse 1.7s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px #38df8300}100%{box-shadow:0 0 0 0 #38df8300}}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}

/* V4 — univers canalisation + avis */
.pipe-bg{position:relative;overflow:hidden;background:linear-gradient(180deg,#f6fbff,#eaf6fd)}
.pipe-bg:before{content:"";position:absolute;width:420px;height:420px;border:28px solid #b9dced;border-radius:50%;right:-265px;top:-120px;opacity:.55}
.pipe-bg:after{content:"";position:absolute;width:310px;height:150px;border-left:28px solid #c5e3f2;border-bottom:28px solid #c5e3f2;border-radius:0 0 0 90px;left:-40px;bottom:-15px;opacity:.6}
.pipe-content{position:relative;z-index:2}
.pipe-line{height:16px;background:linear-gradient(90deg,#9bc8df,#e5f5fc,#8cbdd5);border:2px solid #79abc5;border-radius:20px;box-shadow:inset 0 2px 3px #fff,0 4px 10px #07528618;margin:28px 0;position:relative}
.pipe-line:before,.pipe-line:after{content:"";position:absolute;top:-8px;width:12px;height:28px;background:#9fcce1;border:2px solid #79abc5;border-radius:4px}.pipe-line:before{left:15%}.pipe-line:after{right:20%}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}.review{background:#fff;border-radius:16px;padding:25px;border:1px solid #d8e9f3;box-shadow:0 9px 25px #07528612;transition:.25s ease}.review:hover{transform:translateY(-6px)}.stars{font-size:22px;letter-spacing:2px;color:#f0aa00}.review-name{font-weight:900;color:#071b2f;margin-top:15px}
.guarantee{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:22px;background:linear-gradient(120deg,#071b2f,#075286);color:#fff;border-radius:18px;padding:30px;margin-top:35px;box-shadow:0 12px 35px #071b2f26}.seal{width:92px;height:92px;border-radius:50%;border:5px double #fff;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;line-height:1.05;transform:rotate(-6deg)}.guarantee h3{font-size:25px;margin:0 0 7px}.guarantee p{margin:0;color:#e6f5ff}
@media(max-width:850px){.reviews-grid{grid-template-columns:1fr}.guarantee{grid-template-columns:1fr}.seal{width:82px;height:82px}}

/* V5 — structure inspirée des meilleurs sites d'urgence assainissement */
.v5hero{padding:64px 20px;background:linear-gradient(110deg,#061727,#073d65 60%,#0877c9);color:white;position:relative;overflow:hidden}
.v5hero:after{content:"";position:absolute;right:-120px;top:-140px;width:500px;height:500px;border:80px solid #ffffff0a;border-radius:50%}
.v5hero h1{max-width:800px}.v5hero .accent{color:#65d1ff}.v5sub{font-size:19px;max-width:760px}
.promise-row{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}.promise{background:#ffffff12;border:1px solid #ffffff2a;border-radius:10px;padding:10px 13px;font-weight:800}
.price-strip{background:#fff;box-shadow:0 10px 30px #0001;position:relative;z-index:3}.price-strip-inner{display:grid;grid-template-columns:repeat(4,1fr);max-width:1180px;margin:auto}.mini-proof{padding:19px;text-align:center;border-right:1px solid #e4edf3}.mini-proof:last-child{border:0}.mini-proof b{display:block;color:#0875c9;font-size:18px}
.photo-card{overflow:hidden;padding:0}.service-photo{height:205px;background:linear-gradient(135deg,#0a76b9,#08233b);display:flex;align-items:center;justify-content:center;position:relative;color:white;font-size:70px}.service-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#06182a88,transparent)}
.service-photo span{position:relative;z-index:2;filter:drop-shadow(0 5px 8px #0005)}.photo-card .inside{padding:23px}.from{font-size:14px;color:#667784}.price{font-size:28px;font-weight:900;color:#0875c9}.features{padding-left:20px}.features li{margin:7px 0}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:180px;gap:12px;margin-top:28px}.gallery div{border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:54px;color:#fff;background:linear-gradient(135deg,#075286,#1499e5);box-shadow:inset 0 0 70px #0002}.gallery div:first-child{grid-row:span 2;font-size:90px}
.faq{max-width:850px;margin:auto}.faq details{background:#fff;border:1px solid #d9e8f1;border-radius:11px;padding:17px 20px;margin:10px 0}.faq summary{font-weight:900;color:#071b2f;cursor:pointer}
@media(max-width:850px){.price-strip-inner{grid-template-columns:1fr 1fr}.gallery{grid-template-columns:1fr 1fr}.gallery div:first-child{grid-row:auto;grid-column:span 2}.mini-proof:nth-child(2){border-right:0}}

/* V6 — photos professionnelles et pages plus riches */
.real-photo{height:240px;background-size:cover;background-position:center;position:relative}
.real-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#06182aaa 0%,transparent 65%)}
.real-photo-label{position:absolute;z-index:2;left:18px;bottom:15px;color:white;font-weight:900;font-size:18px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}.split img{width:100%;height:360px;object-fit:cover;border-radius:18px;box-shadow:0 15px 35px #071b2f22}
.long-copy p{font-size:17px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}.step{background:white;border:1px solid #dbe8f1;border-radius:14px;padding:22px}.num{font-size:34px;font-weight:900;color:#1499e5}
@media(max-width:850px){.split{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.split img{height:270px}}

/* V7 — cadrage photo propre */
.real-photo{height:225px!important;background-repeat:no-repeat!important;background-size:cover!important;background-position:center!important;overflow:hidden!important}
.gallery{grid-auto-rows:190px!important}
.gallery>div{background-repeat:no-repeat!important;background-size:cover!important;background-position:center!important;overflow:hidden!important}
.split img{display:block;width:100%!important;height:340px!important;object-fit:cover!important;object-position:center!important;overflow:hidden;border-radius:18px}
.photo-card{overflow:hidden!important}
@media(max-width:850px){.real-photo{height:210px!important}.split img{height:250px!important}.gallery{grid-auto-rows:150px!important}}

/* V8 — menu mobile + formulaire devis fonctionnel */
.menu-toggle{display:none;background:#0875c9;color:#fff;border:0;border-radius:9px;width:48px;height:44px;font-size:25px;font-weight:900;cursor:pointer}
.hidden-field{display:none}
form label{font-weight:700;color:#071b2f}
form label input,form label select,form label textarea{display:block;margin-top:6px;font-weight:400}
.consent{display:flex!important;align-items:flex-start;gap:9px;font-size:14px;font-weight:500!important}
.consent input{width:auto;margin:4px 0 0!important}
.quote-submit{width:100%;font-size:16px;cursor:pointer}
.success-page{max-width:700px}.success-page img{width:min(520px,100%);height:auto}
@media(max-width:850px){
 header .nav{position:relative;flex-wrap:wrap}
 .menu-toggle{display:flex;align-items:center;justify-content:center;margin-left:auto}
 .navlinks{display:none!important;position:absolute;left:12px;right:12px;top:100%;background:#fff;border-radius:0 0 14px 14px;padding:12px;box-shadow:0 15px 30px #0002;flex-direction:column;align-items:stretch;gap:4px}
 .navlinks.open{display:flex!important}
 .navlinks a:not(.btn){display:block!important;padding:13px 12px;border-bottom:1px solid #e8eef3;color:#071b2f}
 .navlinks .btn{margin-top:7px}
}