/* Plombier Urgent Namur — feuille de style du thème (issue de la maquette) */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-0.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-0.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-0.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/plus-jakarta-sans-1.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/plus-jakarta-sans-1.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/plus-jakarta-sans-1.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ============ Jetons de design ============ */
:root{
  --ink:#0B1B33; --ink-2:#12284A; --ink-3:#1B3A66;
  --blue:#1F6FEB; --blue-soft:#E8F1FF; --cyan:#22B8CF;
  --teal:#0E9F8E; --teal-soft:#E3F6F3;
  --amber:#FFC21A; --amber-2:#FFB000; --amber-ink:#4A3500;
  --green:#22C55E;
  --bg:#F5F7FB; --surface:#FFFFFF; --text:#0B1B33; --muted:#566781; --line:#E2E8F0;
  --r-sm:10px; --r:16px; --r-lg:24px; --r-xl:32px;
  --sh-1:0 1px 2px rgba(11,27,51,.06),0 4px 14px rgba(11,27,51,.06);
  --sh-2:0 18px 40px -12px rgba(11,27,51,.22);
  --sh-cta:0 10px 24px -8px rgba(255,176,0,.55);
  --ease:cubic-bezier(.22,1,.36,1); --ease-in-out:cubic-bezier(.65,0,.35,1);
  --f-head:"Plus Jakarta Sans",system-ui,sans-serif; --f-body:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1180px; --gutter:clamp(16px,4vw,32px);
  --bar-h:0px;
}
*,*::before,*::after{box-sizing:border-box}
@view-transition{navigation:auto}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;padding-bottom:var(--bar-h)}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-head);line-height:1.12;letter-spacing:-.02em;margin:0;color:inherit}
p{margin:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--amber);color:var(--ink);padding:10px 14px;border-radius:10px;font-weight:600;z-index:100;transition:top .2s}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:6px}
.ico{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ============ Boutons ============ */
.btn{--h:52px;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:var(--h);padding:0 22px;border-radius:999px;font:700 16px/1 var(--f-head);text-decoration:none;border:0;cursor:pointer;transition:transform .18s var(--ease),box-shadow .25s var(--ease),background-color .2s;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.97)}
.btn-call{background:var(--amber);color:var(--ink);box-shadow:var(--sh-cta)}
.btn-call:hover{background:var(--amber-2);transform:translateY(-2px);box-shadow:0 16px 30px -10px rgba(255,176,0,.65)}
.btn-call .ico{font-size:20px}
.btn-call .ring{animation:ring 4.5s var(--ease) 1;transform-origin:50% 50%}
@keyframes ring{0%,86%,100%{transform:rotate(0)}88%{transform:rotate(-14deg)}90%{transform:rotate(12deg)}92%{transform:rotate(-10deg)}94%{transform:rotate(6deg)}96%{transform:rotate(0)}}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.btn-ghost:hover{background:rgba(255,255,255,.16);transform:translateY(-2px)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:var(--ink-3);transform:translateY(-2px)}
.btn-line{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn-line:hover{box-shadow:inset 0 0 0 1.5px var(--ink);transform:translateY(-2px)}
.btn .arr{transition:transform .25s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn-lg{--h:60px;font-size:18px;padding:0 28px}

/* ============ En-tête ============ */
.hdr{position:sticky;top:0;z-index:50;background:rgba(11,27,51,.0);transition:background-color .3s,box-shadow .3s,backdrop-filter .3s}
.hdr.solid{background:rgba(11,27,51,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 rgba(255,255,255,.06),0 8px 30px -12px rgba(0,0,0,.4)}
.hdr-in{display:flex;align-items:center;gap:20px;height:72px;transition:height .3s var(--ease)}
.hdr.solid .hdr-in{height:62px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.logo-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(140deg,var(--blue),var(--cyan));display:grid;place-items:center;box-shadow:0 6px 16px -6px rgba(34,184,207,.7)}
.logo-mark svg{width:22px;height:22px;stroke:#fff}
.logo-txt{display:flex;flex-direction:column;line-height:1}
.logo-txt b{font:800 17px/1 var(--f-head);letter-spacing:-.01em}
.logo-txt small{font:700 10.5px/1 var(--f-head);letter-spacing:.32em;color:var(--amber);margin-top:5px}
.nav{display:none;gap:4px;margin-left:auto}
.nav a{color:#dbe5f3;text-decoration:none;font-weight:500;font-size:15px;padding:9px 13px;border-radius:999px;transition:background-color .2s,color .2s}
.nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.hdr-cta{display:none}
.hdr-phone{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:var(--amber);color:var(--ink)}
.hdr-phone .ico{font-size:20px}
.burger{width:44px;height:44px;border-radius:999px;border:0;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer}
.burger .ico{font-size:22px}
@media (min-width:1040px){
  .nav{display:flex}
  .hdr-phone,.burger{display:none}
  .hdr-cta{display:inline-flex;--h:46px;font-size:15px;padding:0 18px}
}

/* ============ Hero ============ */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden;margin-top:-72px;padding-top:72px;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-20%;z-index:-2;background:
  radial-gradient(40% 50% at 78% 30%,rgba(31,111,235,.55),transparent 70%),
  radial-gradient(35% 40% at 15% 85%,rgba(34,184,207,.35),transparent 70%),
  radial-gradient(30% 30% at 60% 95%,rgba(14,159,142,.25),transparent 70%);
  transform:translate3d(0,var(--par,0px),0)}

.hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(80% 70% at 50% 30%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(80% 70% at 50% 30%,#000 30%,transparent 80%)}
.hero-in{display:grid;gap:36px;padding-block:28px 72px}
@media (min-width:960px){.hero-in{grid-template-columns:1.12fr .88fr;align-items:center;gap:56px;padding-block:64px 110px}}
.pill{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 10px;border-radius:999px;background:rgba(34,197,94,.12);box-shadow:inset 0 0 0 1px rgba(34,197,94,.35);font-size:14px;font-weight:500;color:#d6f5e1}
.dot{position:relative;width:9px;height:9px;border-radius:50%;background:var(--green)}
.dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--green);animation:pulse 1.6s var(--ease) 3}
@keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.2);opacity:0}}
.hero h1{font-size:clamp(34px,6.2vw,62px);font-weight:800;margin-top:18px;letter-spacing:-.03em}
.hero h1 .hl{background:linear-gradient(92deg,var(--amber),#FFE08A);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:#c9d6ea;font-size:clamp(17px,1.6vw,19.5px);margin-top:18px;max-width:36em}
.lead strong{color:#fff;font-weight:600}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
@media (max-width:520px){.cta-row .btn{width:100%}}
.proof{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:26px;color:#c9d6ea;font-size:14.5px}
.proof span{display:inline-flex;align-items:center;gap:8px}
.proof .stars{color:var(--amber);letter-spacing:1px;font-size:15px}
.proof .g{width:18px;height:18px}
.proof b{color:#fff}

/* carte de triage */
.triage{position:relative;background:#fff;color:var(--text);border-radius:var(--r-lg);padding:22px;box-shadow:0 40px 80px -30px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06)}

.triage h2{font-size:20px;font-weight:800}
.triage .sub{color:var(--muted);font-size:14.5px;margin-top:4px}
.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}
.chip{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;border:1.5px solid var(--line);background:#fff;font:600 14.5px/1.25 var(--f-body);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .2s,background-color .2s,transform .18s var(--ease),box-shadow .25s}
.chip:hover{border-color:#b9c7dc;transform:translateY(-1px)}
.chip .ci{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--blue-soft);color:var(--blue);transition:transform .35s var(--ease)}
.chip[data-axe="deb"] .ci{background:var(--teal-soft);color:var(--teal)}
.chip .ci .ico{font-size:19px}
@media (max-width:420px){.chip{padding:10px;gap:8px;font-size:14px}.chip .ci{width:32px;height:32px}}
.chip[aria-pressed="true"]{border-color:var(--ink);background:#F8FAFD;box-shadow:0 0 0 3px rgba(31,111,235,.12)}
.chip[aria-pressed="true"] .ci{transform:scale(1.08) rotate(-6deg)}
.answer{margin-top:16px;border-radius:16px;background:var(--bg);padding:16px;display:grid;gap:10px;min-height:150px}
.answer .a-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.answer .a-name{font:800 17px/1.2 var(--f-head)}
.answer .a-tag{font-size:12px;font-weight:600;padding:4px 9px;border-radius:999px;background:var(--blue-soft);color:var(--blue);white-space:nowrap}
.answer .a-tag.deb{background:var(--teal-soft);color:var(--teal)}
.answer .a-price{font:800 26px/1 var(--f-head);letter-spacing:-.02em}
.answer .a-price small{font:500 13.5px/1.4 var(--f-body);color:var(--muted);letter-spacing:0;display:block;margin-top:6px}
.answer .a-act{display:flex;gap:8px;flex-wrap:wrap}
.answer .btn{--h:46px;font-size:15px;padding:0 16px}
.swap{animation:swapIn .45s var(--ease)}
@keyframes swapIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.wave{position:absolute;left:0;right:0;bottom:-1px;height:70px;color:var(--bg)}
.wave svg{width:100%;height:100%}

/* ============ Sections ============ */
section{scroll-margin-top:80px}
.sec{padding-block:clamp(64px,9vw,112px)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 13px/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.eyebrow::before{content:"";width:18px;height:2px;border-radius:2px;background:currentColor}
.h2{font-size:clamp(28px,4vw,44px);font-weight:800;margin-top:14px;max-width:18em}
.intro{color:var(--muted);font-size:clamp(16.5px,1.4vw,18.5px);margin-top:14px;max-width:40em}
.head-c{text-align:center;display:flex;flex-direction:column;align-items:center}
.head-c .h2,.head-c .intro{margin-inline:auto}

/* bandeau confiance */
.trust{margin-top:-34px;position:relative;z-index:2}
.trust-in{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-2)}
@media (min-width:860px){.trust-in{grid-template-columns:repeat(4,1fr)}}
.t-item{background:#fff;padding:20px 18px;display:flex;gap:14px;align-items:center}
.t-item .ti{width:44px;height:44px;border-radius:12px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;flex:none}
.t-item .ti .ico{font-size:22px}
.t-item b{display:block;font:800 18px/1.15 var(--f-head)}
.t-item span{display:block;color:var(--muted);font-size:13.5px;line-height:1.35;margin-top:3px}
@media (max-width:560px){.t-item{flex-direction:column;align-items:flex-start;gap:10px;padding:16px}.t-item b{font-size:16.5px}.t-item .ti{width:38px;height:38px}}

/* deux métiers */
.trades{display:grid;gap:22px;margin-top:44px}
@media (min-width:900px){.trades{grid-template-columns:1fr 1fr}}
.trade{--acc:var(--blue);--soft:var(--blue-soft);position:relative;background:#fff;border-radius:var(--r-xl);padding:clamp(22px,3vw,34px);box-shadow:var(--sh-1);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.trade.deb{--acc:var(--teal);--soft:var(--teal-soft)}
.trade::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:var(--soft);transition:transform .6s var(--ease)}
.trade:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.trade:hover::before{transform:scale(1.25)}
.trade-h{position:relative;display:flex;gap:16px;align-items:center}
.trade-ic{width:58px;height:58px;border-radius:18px;background:var(--acc);color:#fff;display:grid;place-items:center;box-shadow:0 12px 24px -10px var(--acc)}
.trade-ic .ico{font-size:28px}
.trade h3{font-size:clamp(24px,2.6vw,30px);font-weight:800}
.trade .t-sub{color:var(--muted);font-size:15px;margin-top:3px}
.svc{list-style:none;margin:22px 0 0;padding:0;position:relative;display:grid}
.svc a{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line);text-decoration:none;font-weight:600;font-size:16px}
.svc li:last-child a{border-bottom:0}
.svc .si{width:34px;height:34px;border-radius:10px;background:var(--soft);color:var(--acc);display:grid;place-items:center;flex:none}
.svc .si .ico{font-size:18px}
.svc .pr{margin-left:auto;margin-right:-2px;font:700 14px/1 var(--f-head);color:var(--acc);white-space:nowrap}
.svc .go{margin-left:auto;color:#9fb0c7;transition:transform .25s var(--ease),color .2s}
.svc .pr+.go{margin-left:12px}
.svc a:hover .go{transform:translateX(4px);color:var(--acc)}
.trade-f{position:relative;margin-top:18px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding-top:18px;border-top:1px dashed var(--line);font-size:14.5px;color:var(--muted)}
.trade-f a{font-weight:700;color:var(--acc);text-decoration:none;display:inline-flex;align-items:center;gap:6px}

/* réflexes */
.reflex{background:linear-gradient(180deg,#EAF2FF,#F5F7FB)}
.steps4{display:grid;gap:16px;margin-top:40px;counter-reset:s}
@media (min-width:720px){.steps4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.steps4{grid-template-columns:repeat(4,1fr)}}
.rf{background:#fff;border-radius:var(--r-lg);padding:22px;box-shadow:var(--sh-1);position:relative}
.rf .n{font:800 13px/1 var(--f-head);color:var(--blue);letter-spacing:.1em}
.rf .ri{width:46px;height:46px;border-radius:14px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;margin-top:14px}
.rf .ri .ico{font-size:22px}
.rf.warn .ri{background:#FFF4D6;color:#B07800}
.rf h3{font-size:18.5px;font-weight:800;margin-top:14px}
.rf p{color:var(--muted);font-size:15px;margin-top:8px}

/* tarifs */
.price-wrap{display:grid;gap:28px;margin-top:40px;align-items:start}
@media (min-width:980px){.price-wrap{grid-template-columns:1.25fr .75fr}}
.ptable{background:#fff;border-radius:var(--r-xl);box-shadow:var(--sh-1);padding:clamp(18px,2.6vw,30px)}
.seg{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;background:var(--bg);border-radius:999px;padding:5px;box-shadow:inset 0 0 0 1px var(--line);width:100%;max-width:460px}
.seg button{position:relative;z-index:1;border:0;background:none;font:600 14.5px/1.2 var(--f-body);color:var(--muted);padding:11px 10px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:color .25s}
.seg button[aria-pressed="true"]{color:#fff}
.seg .thumb{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:var(--ink);transition:transform .45s var(--ease),background-color .45s}
.seg.night .thumb{transform:translateX(100%);background:#2B2F7E}
.rows{margin-top:18px}
.row{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 4px;border-bottom:1px solid var(--line)}
.row:last-child{border-bottom:0}
.row .ri{width:40px;height:40px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center}
.row .ri .ico{font-size:20px}
.row b{display:block;font:700 16.5px/1.25 var(--f-head)}
.row span{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.amt{font:800 24px/1 var(--f-head);letter-spacing:-.02em;text-align:right;font-variant-numeric:tabular-nums;min-width:4.2ch}
.amt small{font:500 12px/1 var(--f-body);color:var(--muted);display:block;margin-top:5px;letter-spacing:0}
.amt.flip{animation:flip .5s var(--ease)}
@keyframes flip{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
.pnote{margin-top:16px;font-size:14px;color:var(--muted);display:flex;gap:10px;align-items:flex-start;background:var(--bg);border-radius:12px;padding:12px 14px}
.pnote .ico{font-size:18px;color:var(--blue);margin-top:2px}
.pside{display:grid;gap:16px}
.pcard{background:var(--ink);color:#fff;border-radius:var(--r-xl);padding:26px;position:relative;overflow:hidden}
.pcard::after{content:"";position:absolute;right:-40px;bottom:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(34,184,207,.45),transparent 70%)}
.pcard h3{font-size:22px;font-weight:800}
.pcard ul{list-style:none;padding:0;margin:16px 0 22px;display:grid;gap:10px;color:#c9d6ea;font-size:15px}
.pcard li{display:flex;gap:10px}
.pcard li .ico{color:var(--amber);font-size:18px;margin-top:3px}
.pcard .btn{width:100%;position:relative;z-index:1}

/* étapes avec tuyau */
.how{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.how .eyebrow{color:var(--cyan)}
.how .intro{color:#b9c8de}
.flow{position:relative;margin-top:56px;display:grid;gap:30px}
@media (min-width:960px){.flow{grid-template-columns:repeat(4,1fr);gap:24px}}
.pipe{position:absolute;pointer-events:none}
.pipe-h{display:none;left:6%;right:6%;top:36px;height:24px}
.pipe-v{left:35px;top:20px;bottom:20px;width:24px}
@media (min-width:960px){.pipe-h{display:block}.pipe-v{display:none}}
.pipe svg{width:100%;height:100%;overflow:visible}
.pipe .base{stroke:rgba(255,255,255,.12);stroke-width:8;fill:none;stroke-linecap:round}
.pipe .water{stroke:url(#gw);stroke-width:8;fill:none;stroke-linecap:round;stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.8s var(--ease)}
.flow.on .pipe .water{stroke-dashoffset:0}
.stp{position:relative;display:grid;grid-template-columns:70px 1fr;gap:16px;align-items:start}
@media (min-width:960px){.stp{grid-template-columns:1fr;text-align:center;justify-items:center}}
.stp .bub{width:70px;height:70px;border-radius:50%;background:var(--ink-2);box-shadow:inset 0 0 0 2px rgba(255,255,255,.12);display:grid;place-items:center;position:relative;z-index:1;transition:background-color .5s,box-shadow .5s,transform .5s var(--ease)}
.stp .bub .ico{font-size:28px;color:#9fc3ff;transition:color .5s}
.flow.on .stp .bub{background:linear-gradient(140deg,var(--blue),var(--cyan));box-shadow:0 12px 30px -10px rgba(34,184,207,.7);transform:scale(1.04)}
.flow.on .stp .bub .ico{color:#fff}
.flow.on .stp:nth-child(3) .bub{transition-delay:.35s}.flow.on .stp:nth-child(4) .bub{transition-delay:.8s}.flow.on .stp:nth-child(5) .bub{transition-delay:1.25s}.flow.on .stp:nth-child(6) .bub{transition-delay:1.7s}
.stp h3{font-size:19px;font-weight:800;margin-top:4px}
@media (min-width:960px){.stp h3{margin-top:18px}}
.stp p{color:#b9c8de;font-size:15px;margin-top:8px;max-width:22em}

/* zones */
.zones-in{display:grid;gap:36px;align-items:center}
@media (min-width:980px){.zones-in{grid-template-columns:1fr 1fr;gap:56px}}
.map{position:relative;background:linear-gradient(160deg,#0E2342,#0B1B33);border-radius:var(--r-xl);padding:10px;box-shadow:var(--sh-2);aspect-ratio:1/1;overflow:hidden}
.map svg{width:100%;height:100%}
.map .river{fill:none;stroke:#2A6FD6;stroke-width:5;stroke-linecap:round;opacity:.8}
.map .river-l{fill:#6FA6F5;font:600 9px var(--f-body);letter-spacing:.18em;opacity:.8}
.map .ring{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1;stroke-dasharray:3 5}
.map .ring-l{fill:rgba(255,255,255,.55);font:600 8.5px var(--f-body)}
.map .ripple{fill:none;stroke:var(--cyan);stroke-width:1.5;transform-origin:195px 198px;opacity:0}
.map.in .ripple{animation:rip 2.8s var(--ease) 1}
.map .ripple:nth-of-type(5){animation-delay:.7s}.map .ripple:nth-of-type(6){animation-delay:1.4s}
@keyframes rip{0%{transform:scale(.1);opacity:.9}100%{transform:scale(1);opacity:0}}
.map .c{fill:#9fc3ff}
.map .cl{fill:#dbe7f8;font:500 9.5px var(--f-body)}
.map .base{fill:var(--amber)}
.map .base-l{fill:#fff;font:700 10.5px var(--f-head)}
.map .note{fill:rgba(255,255,255,.45);font:400 8px var(--f-body)}
.ztable{margin-top:24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:8px}
.zt{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#fff;border-radius:12px;padding:11px 14px;text-decoration:none;font-weight:600;font-size:15px;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .2s,transform .2s var(--ease)}
.zt:hover{box-shadow:inset 0 0 0 1.5px var(--blue);transform:translateY(-1px)}
@media (max-width:560px){.ztable{grid-template-columns:repeat(2,1fr)}.zt{flex-direction:column;align-items:flex-start;gap:6px}}
.zt em{white-space:nowrap;font-style:normal;font-size:12.5px;font-weight:600;color:var(--teal);background:var(--teal-soft);padding:3px 7px;border-radius:999px}
.marq{margin-top:56px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marq-t{display:flex;gap:12px;width:max-content;will-change:transform}


.marq span{font:700 15px/1 var(--f-head);color:#8094b0;padding:10px 16px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}

/* avis + réalisations */
.rev-head{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:end}
.score{display:flex;align-items:center;gap:14px;background:#fff;border-radius:18px;padding:14px 18px;box-shadow:var(--sh-1)}
.score .big{font:800 34px/1 var(--f-head)}
.score .stars{color:var(--amber);font-size:18px;letter-spacing:2px}
.score small{display:block;color:var(--muted);font-size:13px}
.gal{display:grid;gap:14px;margin-top:36px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.gal{grid-template-columns:repeat(4,1fr);grid-auto-rows:170px}.gal .tall{grid-row:span 2}.gal .wide{grid-column:span 2}}
.ph{position:relative;border-radius:20px;overflow:hidden;min-height:150px;background:linear-gradient(140deg,#D9E6F7,#EEF3FA);display:flex;align-items:flex-end;padding:14px;color:var(--ink)}
.ph::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(11,27,51,.035) 0 12px,transparent 12px 24px)}
.ph .phi{position:absolute;top:14px;left:14px;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.75);display:grid;place-items:center;color:var(--blue)}
.ph .phi .ico{font-size:20px}
.ph figcaption{position:relative;font-size:13.5px;font-weight:600;background:rgba(255,255,255,.85);backdrop-filter:blur(6px);padding:7px 11px;border-radius:10px}
.ph.rev{background:#fff;box-shadow:var(--sh-1);display:block;padding:20px}
.ph.rev::before{display:none}
.ph.rev .who{display:flex;align-items:center;gap:10px;font-weight:600}
.ph.rev .av{width:38px;height:38px;border-radius:50%;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font:800 15px var(--f-head)}
.ph.rev .stars{color:var(--amber);letter-spacing:1px;margin-top:12px}
.ph.rev p{color:var(--muted);font-size:14.5px;margin-top:6px}
.ph.rev .gsrc{position:absolute;right:16px;top:18px;width:18px;height:18px}

/* équipement */
.gear{display:grid;gap:14px;margin-top:40px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.gr{background:#fff;border-radius:var(--r-lg);padding:22px;box-shadow:var(--sh-1);transition:transform .3s var(--ease),box-shadow .3s}
.gr:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.gr .gi{width:50px;height:50px;border-radius:14px;background:var(--ink);color:var(--amber);display:grid;place-items:center}
.gr .gi .ico{font-size:24px}
.gr h3{font-size:18px;font-weight:800;margin-top:16px}
.gr p{color:var(--muted);font-size:15px;margin-top:6px}

/* FAQ */
.faq-in{display:grid;gap:36px}
@media (min-width:980px){.faq-in{grid-template-columns:.8fr 1.2fr;gap:56px}}
.qa{border-radius:18px;background:#fff;box-shadow:var(--sh-1);margin-bottom:12px;overflow:hidden}
.qa button{all:unset;box-sizing:border-box;width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;cursor:pointer;font:700 17px/1.35 var(--f-head)}
.qa button:focus-visible{outline:3px solid var(--cyan);outline-offset:-3px;border-radius:18px}
.qa .pm{width:30px;height:30px;border-radius:50%;background:var(--bg);display:grid;place-items:center;flex:none;transition:transform .35s var(--ease),background-color .3s}
.qa .pm .ico{font-size:16px}
.qa[data-open="true"] .pm{transform:rotate(45deg);background:var(--amber)}
.qa .ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}
.qa[data-open="true"] .ans{grid-template-rows:1fr}
.qa .ans>div{overflow:hidden}
.qa .ans p{padding:0 22px 20px;color:var(--muted);font-size:16px}

/* devis */
.quote{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.quote::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 85% 20%,rgba(31,111,235,.45),transparent 70%),radial-gradient(40% 50% at 10% 90%,rgba(14,159,142,.3),transparent 70%)}
.quote-in{position:relative;display:grid;gap:36px;align-items:center}
@media (min-width:980px){.quote-in{grid-template-columns:.9fr 1.1fr;gap:56px}}
.quote .eyebrow{color:var(--cyan)}
.quote .intro{color:#b9c8de}
.bigtel{display:inline-flex;align-items:center;gap:14px;margin-top:26px;font:800 clamp(28px,4vw,40px)/1 var(--f-head);color:var(--amber);text-decoration:none;letter-spacing:-.01em}
.bigtel .ico{font-size:.9em}
.form{background:#fff;color:var(--text);border-radius:var(--r-xl);padding:clamp(20px,3vw,32px);box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.prog{display:flex;gap:6px}
.prog i{flex:1;height:5px;border-radius:5px;background:var(--line);overflow:hidden;position:relative}
.prog i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.prog i.done::after{transform:scaleX(1)}
.fstep{display:none;margin-top:20px}
.fstep.on{display:block;animation:swapIn .45s var(--ease)}
.fstep h3{font-size:21px;font-weight:800}
.fstep .hint{color:var(--muted);font-size:14.5px;margin-top:4px}
.opts{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt label{display:flex;align-items:center;gap:10px;padding:13px;border-radius:14px;border:1.5px solid var(--line);font-weight:600;font-size:15px;cursor:pointer;transition:border-color .2s,background-color .2s,box-shadow .2s}
.opt label .ico{font-size:19px;color:var(--blue)}
.opt input:checked+label{border-color:var(--ink);background:#F8FAFD;box-shadow:0 0 0 3px rgba(31,111,235,.12)}
.opt input:focus-visible+label{outline:3px solid var(--cyan);outline-offset:2px}
.fld{display:grid;gap:6px;margin-top:14px}
.fld label{font-weight:600;font-size:14.5px}
.fld input,.fld select,.fld textarea{font:400 16px/1.4 var(--f-body);padding:13px 14px;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:var(--text);transition:border-color .2s,box-shadow .2s;width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,111,235,.14)}
.two{display:grid;gap:0 12px}
@media (min-width:560px){.two{grid-template-columns:1fr 1fr}}
.drop{margin-top:14px;border:1.5px dashed #b9c7dc;border-radius:14px;padding:16px;display:flex;gap:12px;align-items:center;color:var(--muted);font-size:14.5px;cursor:pointer;transition:border-color .2s,background-color .2s}
.drop:hover{border-color:var(--blue);background:var(--blue-soft)}
.drop .ico{font-size:22px;color:var(--blue)}
.fnav{display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.fnav .btn{--h:50px}
.ok{text-align:center;padding:20px 0}
.ok .tick{width:72px;height:72px;margin:0 auto;border-radius:50%;background:var(--teal-soft);display:grid;place-items:center}
.ok .tick svg{width:38px;height:38px;stroke:var(--teal);stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:30}
.fstep.on .tick svg{animation:draw .7s .2s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.legal{font-size:12.5px;color:var(--muted);margin-top:12px}

/* pied de page */
.ftr{background:#07111F;color:#9fb0c7;padding-block:64px 40px;font-size:15px}
.ftr-in{display:grid;gap:36px}
@media (min-width:900px){.ftr-in{grid-template-columns:1.3fr 1fr 1fr 1fr}}
.ftr h4{color:#fff;font-size:15px;font-weight:700;letter-spacing:.02em;margin-bottom:14px}
.ftr ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.ftr a{text-decoration:none;color:#9fb0c7;transition:color .2s}
.ftr a:hover{color:#fff}
.nap{display:grid;gap:10px;margin-top:18px}
.nap div{display:flex;gap:10px;align-items:flex-start}
.nap .ico{color:var(--amber);font-size:18px;margin-top:3px}
.ftr-b{border-top:1px solid rgba(255,255,255,.08);margin-top:44px;padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13.5px}

/* barre d'appel mobile */
.callbar.off{transform:translateY(110%)!important;transition:transform .35s var(--ease)}
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 -10px 30px -12px rgba(11,27,51,.25);display:grid;grid-template-columns:1.6fr 1fr;gap:10px;transform:translateY(110%);animation:barIn .6s .4s var(--ease) forwards}
@keyframes barIn{to{transform:none}}
.callbar .btn{--h:54px;font-size:16.5px;padding:0 12px}
.callbar .btn-call{box-shadow:none}
.callbar small{display:block;font:500 11.5px/1 var(--f-body);opacity:.75;margin-top:3px}
.callbar .two-l{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
@media (min-width:1040px){.callbar{display:none}}
@media (max-width:1039px){:root{--bar-h:78px}}

/* révélation au défilement */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
  .marq-t{animation:none}
  .callbar{transform:none}
}
/* menu mobile */
.drawer{position:fixed;inset:0;z-index:80;background:rgba(7,17,31,.55);opacity:0;pointer-events:none;transition:opacity .3s}
.drawer.open{opacity:1;pointer-events:auto}
.drawer nav{position:absolute;right:0;top:0;bottom:0;width:min(86vw,360px);background:#fff;padding:22px;transform:translateX(100%);transition:transform .45s var(--ease);display:flex;flex-direction:column;gap:4px}
.drawer.open nav{transform:none}
.drawer nav a{padding:14px 10px;border-radius:12px;text-decoration:none;font:700 18px var(--f-head)}
.drawer nav a:hover{background:var(--bg)}
.drawer .close{align-self:flex-end;width:44px;height:44px;border-radius:50%;border:0;background:var(--bg);display:grid;place-items:center;cursor:pointer;margin-bottom:8px}
.drawer .close .ico{font-size:22px}
.drawer .btn{margin-top:auto}

/* ===================================================================
   Gabarit « page de service »
   =================================================================== */
.hero.sm .hero-in{padding-block:22px 84px}
@media (min-width:960px){.hero.sm .hero-in{padding-block:40px 110px;grid-template-columns:1.15fr .85fr}}
.hero.sm h1{font-size:clamp(32px,5.2vw,54px)}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:14px;color:#9fb3cf;margin:0;padding:0;list-style:none}
.crumbs a{color:#c9d6ea;text-decoration:none}
.crumbs a:hover{color:#fff;text-decoration:underline}
.crumbs li+li::before{content:"›";margin-right:6px;color:#6f86a6}
.crumbs [aria-current]{color:#fff;font-weight:600}
.promise{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none;color:#dbe5f3;font-size:16px}
.promise li{display:flex;gap:10px;align-items:flex-start}
.promise .ico{color:var(--amber);font-size:19px;margin-top:3px}
.promise b{color:#fff}
.offer{background:#fff;color:var(--text);border-radius:var(--r-lg);padding:24px;box-shadow:0 40px 80px -30px rgba(0,0,0,.55)}
.offer .tag{display:inline-flex;gap:6px;align-items:center;font:700 12.5px/1 var(--f-head);letter-spacing:.08em;text-transform:uppercase;color:var(--teal);background:var(--teal-soft);padding:6px 10px;border-radius:999px}
.offer .big{display:flex;align-items:baseline;gap:10px;margin-top:14px}
.offer .big b{font:800 54px/1 var(--f-head);letter-spacing:-.03em}
.offer .big span{color:var(--muted);font-size:15px}
.offer ul{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px;font-size:15px}
.offer li{display:flex;gap:10px;justify-content:space-between;border-top:1px dashed var(--line);padding-top:9px}
.offer li span{color:var(--muted)}
.offer li b{font-family:var(--f-head);white-space:nowrap}
.offer .btn{width:100%;margin-top:18px}
.offer small{display:block;color:var(--muted);font-size:13px;margin-top:10px;text-align:center}

.signs{display:grid;gap:12px;margin-top:36px}
@media (min-width:720px){.signs{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.signs{grid-template-columns:repeat(3,1fr)}}
.sign{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:18px;padding:18px;box-shadow:var(--sh-1)}
.sign .si{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--teal-soft);color:var(--teal)}
.sign .si .ico{font-size:21px}
.sign.alert .si{background:#FFE9E3;color:#C2410C}
.sign h3{font-size:16.5px;font-weight:800}
.sign p{color:var(--muted);font-size:14.5px;margin-top:4px}
.callout{margin-top:18px;display:flex;gap:14px;align-items:flex-start;background:var(--ink);color:#dbe5f3;border-radius:18px;padding:18px 20px;font-size:15.5px}
.callout .ico{font-size:22px;color:var(--amber);flex:none;margin-top:2px}
.callout a{color:var(--amber);font-weight:700}

.method{display:grid;gap:36px;margin-top:40px;align-items:center}
@media (min-width:980px){.method{grid-template-columns:1fr 1fr;gap:56px}}
.mlist{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:m}
.mlist li{position:relative;background:#fff;border-radius:18px;padding:18px 18px 18px 66px;box-shadow:var(--sh-1);counter-increment:m}
.mlist li::before{content:counter(m);position:absolute;left:18px;top:18px;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--amber);display:grid;place-items:center;font:800 15px/1 var(--f-head)}
.mlist h3{font-size:17px;font-weight:800}
.mlist p{color:var(--muted);font-size:15px;margin-top:4px}
.mlist .when{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:600;color:var(--blue);background:var(--blue-soft);padding:4px 9px;border-radius:999px}

/* comparateur avant / après (piloté par l'utilisateur) */
.ba{--pos:50%;position:relative;border-radius:var(--r-xl);overflow:hidden;background:#0E2342;aspect-ratio:4/3;box-shadow:var(--sh-2);user-select:none}
.ba svg{position:absolute;inset:0;width:100%;height:100%}
.ba .after{clip-path:inset(0 0 0 var(--pos))}
.ba .bar{position:absolute;top:0;bottom:0;left:var(--pos);width:3px;margin-left:-1.5px;background:#fff;pointer-events:none}
.ba .knob{position:absolute;top:50%;left:var(--pos);width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#fff;box-shadow:0 8px 20px rgba(0,0,0,.35);display:grid;place-items:center;pointer-events:none;color:var(--ink);font:800 16px var(--f-head)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba input:focus-visible~.knob{outline:3px solid var(--cyan);outline-offset:3px}
.ba .lbl{position:absolute;top:14px;font:700 12px/1 var(--f-head);letter-spacing:.12em;text-transform:uppercase;padding:7px 10px;border-radius:999px;background:rgba(7,17,31,.6);color:#fff;pointer-events:none}
.ba .lbl.l{left:14px}.ba .lbl.r{right:14px}
.ba-cap{font-size:13.5px;color:var(--muted);margin-top:10px;text-align:center}

.causes{display:grid;gap:12px;margin-top:32px}
@media (min-width:860px){.causes{grid-template-columns:repeat(2,1fr)}}
.cause{display:grid;grid-template-columns:auto 1fr;gap:14px;background:#fff;border-radius:18px;padding:18px;box-shadow:var(--sh-1)}
.cause .pct{font:800 22px/1 var(--f-head);color:var(--teal);min-width:2.2ch}
.cause h3{font-size:16.5px;font-weight:800}
.cause p{color:var(--muted);font-size:15px;margin-top:4px}

.related{display:grid;gap:14px;margin-top:32px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.rel{display:flex;flex-direction:column;gap:10px;background:#fff;border-radius:20px;padding:20px;text-decoration:none;box-shadow:var(--sh-1);transition:transform .3s var(--ease),box-shadow .3s}
.rel:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.rel .ri{width:44px;height:44px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:grid;place-items:center}
.rel .ri .ico{font-size:21px}
.rel b{font:800 17px/1.2 var(--f-head)}
.rel span{color:var(--muted);font-size:14.5px}
.rel em{font-style:normal;margin-top:auto;font:700 15px var(--f-head);color:var(--teal);display:flex;align-items:center;gap:6px}
.rel em .ico{transition:transform .25s var(--ease)}
.rel:hover em .ico{transform:translateX(4px)}
.zchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.zchips a{padding:9px 14px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);text-decoration:none;font-weight:600;font-size:14.5px;transition:box-shadow .2s}
.zchips a:hover{box-shadow:inset 0 0 0 1.5px var(--teal)}
.split{display:grid;gap:36px}
@media (min-width:980px){.split{grid-template-columns:1fr 1fr;gap:56px}}

/* ===================================================================
   Gabarit « page localité »
   =================================================================== */
.facts{display:grid;gap:12px;margin-top:36px;grid-template-columns:repeat(2,1fr)}
@media (min-width:980px){.facts{grid-template-columns:repeat(4,1fr)}}
.fact{background:#fff;border-radius:20px;padding:20px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:6px}
.fact .num{font:800 clamp(28px,3.4vw,38px)/1 var(--f-head);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.fact .num small{font-size:.5em;font-weight:700;color:var(--muted);margin-left:4px;letter-spacing:0}
.fact b{font:700 15px/1.3 var(--f-head)}
.fact span{color:var(--muted);font-size:13.5px;line-height:1.4}
.fact .src{font-size:11.5px;color:#8a9ab1;margin-top:auto}
.local{display:grid;gap:36px;margin-top:40px;align-items:start}
@media (min-width:980px){.local{grid-template-columns:1.1fr .9fr;gap:56px}}
.local-txt h3{font-size:20px;font-weight:800;margin-top:26px}
.local-txt h3:first-child{margin-top:0}
.local-txt p{color:#33445e;margin-top:8px}
.local-txt .srcs{font-size:12.5px;color:#8a9ab1;margin-top:18px}
.route{position:sticky;top:90px;background:linear-gradient(160deg,#0E2342,#0B1B33);border-radius:var(--r-xl);padding:10px;box-shadow:var(--sh-2);aspect-ratio:1/1}
.route svg{width:100%;height:100%}
.route .rv-path{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.6s var(--ease)}
.route.in .rv-path{stroke-dashoffset:0}
.route .car{opacity:0;transition:opacity .3s 1.5s}
.route.in .car{opacity:1}
.jobs{display:grid;gap:14px;margin-top:32px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.job{background:#fff;border-radius:20px;padding:20px;box-shadow:var(--sh-1);border:1.5px dashed #c9d5e6}
.job .meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12.5px;font-weight:600}
.job .meta span{background:var(--bg);padding:4px 9px;border-radius:999px;color:var(--muted)}
.job h3{font-size:17px;font-weight:800;margin-top:12px}
.job p{color:var(--muted);font-size:14.5px;margin-top:6px}
.quart{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.quart span{padding:7px 12px;border-radius:999px;background:var(--blue-soft);color:var(--ink-3);font-size:14px;font-weight:600}
.local-txt > .rv{margin-top:22px}

/* ===== Photos réelles ===== */
.ph.real{padding:0;background:#0E2342}
.ph.real::before{display:none}
.ph.real img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.ph.real:hover img{transform:scale(1.04)}
.ph.real figcaption{position:absolute;left:12px;bottom:12px;right:12px;width:auto}
.ph.duo{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:0;background:#fff}
.ph.duo::before{display:none}
.ph.duo .half{position:relative;overflow:hidden;min-height:150px}
.ph.duo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph.duo .tag{position:absolute;top:10px;left:10px;font:700 11px/1 var(--f-head);letter-spacing:.12em;text-transform:uppercase;padding:6px 9px;border-radius:999px;background:rgba(7,17,31,.7);color:#fff}
.ph.duo .half:last-child .tag{background:var(--teal)}
.ph.duo figcaption{position:absolute;left:12px;bottom:12px}
.ba.photo{aspect-ratio:3/4;max-width:460px;margin-inline:auto;width:100%}
.ba.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba.photo img.after{clip-path:inset(0 0 0 var(--pos))}
.cause-photo{margin:24px 0 0;display:grid;gap:16px;align-items:center}
@media (min-width:860px){.cause-photo{grid-template-columns:300px 1fr}}
.cause-photo .pic{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:3/4;box-shadow:var(--sh-2);max-width:300px}
.cause-photo .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cause-photo p{color:var(--muted);font-size:15.5px}
.cause-photo b{color:var(--text)}
.gal figure,.ph{margin:0}
.ph.duo{align-items:stretch}
@media (max-width:899px){.gal .wide{grid-column:span 2;min-height:240px}.gal .tall{grid-row:span 2}.ph figcaption{font-size:12.5px}.ph.rev .who{font-size:14px}}
.ph.rev .who{padding-right:24px}
@media (max-width:899px){.gal>:nth-child(5){order:9;grid-column:span 2}}

/* ===================================================================
   Compléments WordPress (thème Plombier Urgent Namur)
   =================================================================== */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.ferr{color:#B4441A;font-size:14.5px;font-weight:600;margin-top:10px}
body.admin-bar .hdr{top:32px}
@media (max-width:782px){body.admin-bar .hdr{top:46px}}
main#contenu{display:block}

/* Menu déroulant */
.nav .has-sub{position:relative}
.nav .has-sub>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-3px) rotate(45deg);opacity:.7}
.nav .sub{position:absolute;left:0;top:100%;min-width:260px;padding:8px;margin-top:6px;background:#fff;border-radius:16px;box-shadow:0 24px 48px -16px rgba(11,27,51,.35);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s var(--ease),transform .25s var(--ease),visibility .2s}
.nav .has-sub:hover .sub,.nav .has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.nav .sub a{display:flex;justify-content:space-between;gap:12px;color:var(--ink);padding:10px 12px;border-radius:10px;font-size:14.5px}
.nav .sub a:hover{background:var(--bg);color:var(--ink)}
.nav .sub a span{color:var(--muted);font-size:13px;font-weight:600}
.drawer nav .grp{font:700 12px/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:14px 10px 4px}
.drawer nav a.s{font:600 16px var(--f-body);padding:10px}
.drawer nav{overflow-y:auto}

/* Blocs natifs : sections de texte */
.prose-sec .wrap>*{margin:0}
.prose-sec .wrap{display:block}
.prose-sec .eyebrow{display:inline-flex}
.prose-sec h2.h2{margin-top:14px}
.prose-sec .lede{color:var(--muted);font-size:clamp(16.5px,1.4vw,18.5px);margin-top:14px;max-width:44em}
.prose-sec .prose{max-width:46em;margin-top:28px}
.prose-sec .prose>*+*{margin-top:14px}
.prose-sec .prose h3{font-size:clamp(19px,2vw,22px);font-weight:800;margin-top:30px}
.prose-sec .prose h3:first-child{margin-top:0}
.prose-sec .prose p,.prose-sec .prose li{color:#33445e;font-size:17px}
.prose-sec .prose ul{padding-left:0;list-style:none;display:grid;gap:8px}
.prose-sec .prose ul li{position:relative;padding-left:22px}
.prose-sec .prose ul li::before{content:"";position:absolute;left:4px;top:.65em;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.prose-sec .prose a,.local-txt a,.callout a,.pnote a,.qa a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose-sec .prose b,.prose-sec .prose strong{color:var(--text)}
.prose-sec.alt{background:linear-gradient(180deg,#EAF2FF,#F5F7FB)}
.prose-cols{display:grid;gap:36px;margin-top:28px;align-items:start}
@media (min-width:980px){.prose-cols{grid-template-columns:1.2fr .8fr;gap:56px}.prose-cols .prose{margin-top:0}}
.prose-fig{margin:0;position:sticky;top:96px}
.prose-fig .pic{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:3/4;box-shadow:var(--sh-2);background:#0E2342}
.prose-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prose-fig figcaption{font-size:13.5px;color:var(--muted);margin-top:10px}

/* Tableaux natifs */
.pun-table{margin:24px 0 0;overflow-x:auto;background:#fff;border-radius:18px;box-shadow:var(--sh-1)}
.pun-table table{width:100%;border-collapse:collapse;font-size:15.5px;min-width:520px}
.pun-table th,.pun-table td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}
.pun-table thead th{font:700 12.5px/1.3 var(--f-head);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--bg)}
.pun-table tr:last-child td{border-bottom:0}
.pun-table td:last-child{font-variant-numeric:tabular-nums}

/* FAQ native (bloc Détails) */
details.qa{border-radius:18px;background:#fff;box-shadow:var(--sh-1);margin:0 0 12px;overflow:hidden}
details.qa>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;font:700 17px/1.35 var(--f-head);color:var(--ink)}
details.qa>summary::-webkit-details-marker{display:none}
details.qa>summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font:600 20px/1 var(--f-body);transition:transform .35s var(--ease),background-color .3s}
details.qa[open]>summary::after{transform:rotate(45deg);background:var(--amber)}
details.qa>summary:focus-visible{outline:3px solid var(--cyan);outline-offset:-3px;border-radius:18px}
details.qa>*:not(summary){padding:0 22px;margin:0;color:var(--muted);font-size:16px}
details.qa>*:not(summary):last-child{padding-bottom:20px}
@supports (interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}details.qa::details-content{height:0;overflow:hidden;transition:height .35s var(--ease),content-visibility .35s allow-discrete}details.qa[open]::details-content{height:auto}}
.faq-sec .faq-in>div>*{margin:0}
.faq-sec .faq-in .h2{margin-top:14px}
.faq-sec .faq-in .intro{margin-top:14px}

/* Héros de page simple (pages légales, contact) */
.hero.xs .hero-in{padding-block:22px 76px}
@media (min-width:960px){.hero.xs .hero-in{grid-template-columns:1fr;padding-block:36px 96px}}
.hero.xs h1{font-size:clamp(30px,4.4vw,46px)}
.legal-body{max-width:46em}

/* Cartes de services (hubs) */
.svcgrid{display:grid;gap:14px;margin-top:36px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.svccard{--acc:var(--blue);--soft:var(--blue-soft);display:flex;flex-direction:column;gap:10px;background:#fff;border-radius:22px;padding:22px;text-decoration:none;box-shadow:var(--sh-1);transition:transform .3s var(--ease),box-shadow .3s}
.svccard.deb{--acc:var(--teal);--soft:var(--teal-soft)}
.svccard:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.svccard .si{width:48px;height:48px;border-radius:14px;background:var(--soft);color:var(--acc);display:grid;place-items:center}
.svccard .si .ico{font-size:23px}
.svccard b{font:800 18.5px/1.2 var(--f-head)}
.svccard span{color:var(--muted);font-size:15px}
.svccard em{font-style:normal;margin-top:auto;display:flex;justify-content:space-between;align-items:center;font:800 17px var(--f-head);color:var(--acc)}
.svccard em .ico{transition:transform .25s var(--ease)}
.svccard:hover em .ico{transform:translateX(4px)}

/* Articles */
.article{max-width:46em;margin-inline:auto}
.article>*+*{margin-top:16px}
.article h2{font-size:clamp(23px,2.6vw,29px);font-weight:800;margin-top:36px}
.article h3{font-size:20px;font-weight:800;margin-top:26px}
.article p,.article li{color:#33445e;font-size:17.5px}
.article img{border-radius:16px;height:auto}
.postmeta{color:#b9c8de;font-size:14.5px;margin-top:14px}
.posts{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:32px}
.posts a{display:block;background:#fff;border-radius:20px;padding:22px;text-decoration:none;box-shadow:var(--sh-1)}
.posts b{display:block;font:800 18px/1.25 var(--f-head)}
.posts span{display:block;color:var(--muted);font-size:14.5px;margin-top:8px}
.ftr h4 a{color:#fff}
.ftr h4 a:hover{color:var(--amber)}
.hero.solo .hero-in{grid-template-columns:1fr}
.hero .lead+.promise{margin-top:18px}
.faq-l>*{margin:0}
.nav{align-items:center}
.nav .has-sub{display:flex;align-items:center}
/* WordPress ajoute .wp-block-group__inner-container dans les groupes (thèmes classiques) : on le rend transparent pour les grilles */
.wp-block-group>.wp-block-group__inner-container{display:contents}
.prose-fig .pic{max-height:620px}
@media (max-width:560px){.pun-table table{min-width:0}.pun-table th,.pun-table td{padding:10px 12px;font-size:14.5px}}
/* v1.0.2 : accessibilité (contrastes, titres du pied de page) */
.eyebrow{color:#1A5FD0}
.marq span{color:#56677F}
.ftr .ftr-h{color:#fff;font:700 15px/1.3 var(--f-head);letter-spacing:.02em;margin:0 0 14px}
.ftr .ftr-h a{color:#fff}
.ftr .ftr-h a:hover{color:var(--amber)}
/* v1.0.3 : bouton « Gérer les cookies » du pied de page, même aspect que les liens */
.ftr-cookies{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.ftr-cookies:hover{color:var(--amber)}
/* v1.0.4 : bandeau de consentement Complianz aux couleurs du site ; « Accepter » et « Refuser » au même niveau */
.cmplz-cookiebanner{--cmplz_button_accept_background_color:#0B1B33;--cmplz_button_accept_border_color:#0B1B33;--cmplz_button_accept_text_color:#fff;--cmplz_button_deny_background_color:#0B1B33;--cmplz_button_deny_border_color:#0B1B33;--cmplz_button_deny_text_color:#fff;--cmplz_button_settings_background_color:#fff;--cmplz_button_settings_border_color:#C9D4E5;--cmplz_button_settings_text_color:#0B1B33;--cmplz_hyperlink_color:#1A5FD0;--cmplz_slider_active_color:#1A5FD0;--cmplz_text_color:#33445e;--cmplz_text_font_size:14px;--cmplz_title_font_size:16px;--cmplz_button_border_radius:999px;--cmplz_banner_border_radius:18px;font-family:inherit}
.cmplz-cookiebanner .cmplz-btn{font-weight:700}
/* v1.0.5 : page Zones, localités par temps de trajet ; v1.0.8 : carte sur fond OpenStreetMap, vues « autour de Namur » et « province » animées */
.zgrid{display:grid;gap:28px;margin-top:36px}
@media (min-width:980px){.zgrid{grid-template-columns:minmax(340px,440px) 1fr;gap:48px;align-items:start}.zradar{position:sticky;top:96px}}
.zradar{background:#0B1B33;border-radius:var(--r-xl);padding:14px;box-shadow:var(--sh-2);max-width:480px;width:100%;justify-self:center}
.zradar.zhome{position:static;max-width:none}
.zcadre{position:relative;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#0A1830}
.carte svg{display:block;width:100%;height:100%}
.zimg{opacity:0;transition:opacity .9s ease}
.zimg.ok{opacity:1}
.carte[data-vue=p] .zimg-r{opacity:0}
.zv{transition:opacity .45s ease}
.carte[data-vue=r] .zv-p,.carte[data-vue=p] .zv-r{opacity:0;pointer-events:none}
.zr{fill:none;stroke:#7FE0EE;stroke-opacity:.55;stroke-width:1.3;stroke-dasharray:4 5;vector-effect:non-scaling-stroke;opacity:0;transition:opacity .9s ease calc(.3s + var(--i) * 200ms)}
.carte.in .zr{opacity:1}
.zrl{fill:#BFEFF6;font-family:var(--f-body);font-weight:700;letter-spacing:.04em;stroke:#0A1830;stroke-width:.32em;paint-order:stroke;stroke-linejoin:round;opacity:0;transition:opacity .6s ease calc(.6s + var(--i) * 200ms)}
.carte.in .zrl{opacity:1}
.zl{fill:#E3ECF8;font-family:var(--f-body);font-weight:600;stroke:#0A1830;stroke-width:.34em;paint-order:stroke;stroke-linejoin:round;opacity:0;transition:opacity .3s ease;pointer-events:none}
.carte.in .zl.on,.zl.hl{opacity:1}
.zl.hl{fill:#7FE0EE}
.zd{fill:#C5D3E8;stroke:#0A1830;stroke-width:1.5;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .5s var(--ease) calc(.7s + var(--i) * 35ms),fill .25s}
.zd.lnk{fill:var(--amber)}
.carte.in .zd{transform:scale(1)}
.carte.in .zd.on{transform:scale(1.8);fill:#7FE0EE;transition-delay:0s}
.zp{fill:var(--amber);stroke:#0A1830;stroke-width:3;vector-effect:non-scaling-stroke}
.zp-pulse{fill:var(--amber);transform-box:fill-box;transform-origin:center;animation:pulse 2.4s var(--ease) infinite}
.zpl{fill:#fff;font-family:var(--f-head);font-weight:800;stroke:#0A1830;stroke-width:.36em;paint-order:stroke;stroke-linejoin:round}
.zvues{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:0 0 12px}
.zvues button{appearance:none;border:1px solid rgba(255,255,255,.24);background:transparent;color:#DCE6F5;font:700 13.5px/1 var(--f-body);padding:9px 15px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.zvues button:hover{border-color:#fff;color:#fff}
.zvues button[aria-pressed=true]{background:#fff;color:#0B1B33;border-color:#fff}
.zvues button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.zcap{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:12px 0 0;font-size:13px;color:rgba(255,255,255,.82)}
.zcap i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;background:#C5D3E8;vertical-align:1px}
.zcap i.lnk{background:var(--amber)}
.zcap2{margin:6px 0 0;text-align:center;font-size:12px;line-height:1.5;color:rgba(255,255,255,.55)}
.zcap2 a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.zt.zt-tout{background:#0B1B33;color:#fff;box-shadow:none}
.zt.zt-tout em{background:rgba(255,255,255,.14);color:#fff}
.zt.zt-tout:hover{box-shadow:inset 0 0 0 1.5px var(--amber)}
.ztiers{display:grid;gap:18px}
.ztier{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:20px 20px 22px}
.zt-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin-bottom:14px}
.zt-time{font:800 22px/1.1 var(--f-head);color:var(--ink);letter-spacing:-.01em}
.zt-sub{color:var(--muted);font-size:14px}
.zlist{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
@media (max-width:560px){.zlist{grid-template-columns:1fr 1fr}}
.zc{display:flex;flex-direction:column;gap:2px;height:100%;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg)}
.zc b{font:700 15.5px/1.25 var(--f-head);color:var(--ink)}
.zc>span{font-size:13px;color:var(--muted)}
a.zc{background:#fff;border-color:#CFE0FB;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
a.zc b::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--amber);margin-left:8px;vertical-align:2px}
a.zc em{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-style:normal;font-size:13.5px;font-weight:700;color:#1A5FD0}
a.zc em::after{content:"→";transition:transform .25s var(--ease)}
a.zc:hover,a.zc:focus-visible{transform:translateY(-3px);box-shadow:var(--sh-1);border-color:#1A5FD0}
a.zc:hover em::after,a.zc:focus-visible em::after{transform:translateX(4px)}
.znote{margin-top:22px;color:var(--muted);font-size:14.5px;max-width:760px}
@media (prefers-reduced-motion:reduce){.zr,.zrl{transition:none;opacity:1}.zd{transition:none;transform:none}.zv,.zimg,.zl{transition:none}.zp-pulse{animation:none;opacity:0}}
/* v1.0.6 : articles de conseils */
.article .chapo{font-size:19.5px;line-height:1.6;color:var(--ink);font-weight:500}
.article a{color:#1A5FD0;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.article ul{padding-left:1.25em}
.article li+li{margin-top:6px}
.article details.qa{margin-top:12px}
.article details.qa>div,.article details.qa>p{padding:0 22px 20px}
.article .sources{font-size:13.5px;color:#8a9ab1;margin-top:32px}
.posts a{transition:transform .25s var(--ease),box-shadow .25s}
.posts a:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}