/* page métier (modèle « services details ») */
.mh{padding:0}
.mh .grille{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.15fr 1fr;align-items:stretch;padding:30px 0 0}
.mh .g{padding:0 20px;display:flex;flex-direction:column;justify-content:flex-start}
.fil{display:inline-flex;gap:8px;background:var(--peche);border-radius:99px;padding:7px 16px;font:500 13px/1 "In";width:max-content}
.fil a{color:var(--rouge);text-decoration:none}.fil span{color:#999}
.mh h1{font-size:clamp(40px,6vw,72px);margin:22px 0 18px}
.mh .sous{color:var(--texte);font-size:17px;max-width:540px;margin:0 0 28px}
.mh .actions{display:flex;gap:12px;flex-wrap:wrap}
.mh .noir{background:var(--peche);border-radius:0 28px 28px 0;display:flex;flex-direction:column;justify-content:center;padding:30px 50px;gap:6px;position:relative;overflow:hidden}
.mh .noir span{font:700 clamp(26px,3vw,40px)/1.15 "SG";letter-spacing:-.02em;color:var(--rouge);text-transform:uppercase;transition:color .4s}
.mh .noir span.on{color:var(--noir)}
.mh .noir span.on:after{content:" ✓";color:var(--rouge)}
.mh .noir span.fait{color:#9b140e}
.vue{padding-top:90px}
.vue .grille{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}
.vue h2{font-size:clamp(32px,4.4vw,48px);margin:16px 0 20px}
.vue p{color:var(--texte)}
.vue .faits{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:30px}
.vue .faits .chiffre .n{margin:22px 0 8px;font-size:40px}
.vue .visuel{position:relative;height:600px}
.vue .visuel .tel{top:20px}
.vue .visuel .ph{position:absolute;border-radius:18px;background:#ccc center/cover;box-shadow:0 24px 50px rgba(0,0,0,.14)}
.vue .visuel .p1{width:190px;height:240px;left:0;top:120px;transform:rotate(-6deg)}
.vue .visuel .p2{width:200px;height:250px;right:0;top:300px;transform:rotate(5deg)}
.vue .visuel em{position:absolute;left:10px;bottom:10px;background:#fff;border-radius:99px;padding:4px 10px;font:600 11px "In";font-style:normal}
.ex-tete{max-width:780px;margin:80px auto 34px;text-align:center}
.ex-tete h2{font-size:clamp(28px,3.6vw,40px);margin:14px 0 14px}
.ex-tete p{color:var(--texte);margin:0}
.exemples{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.exemple{background:#fff;border:1px solid var(--ligne);border-radius:22px;padding:28px 30px;box-shadow:0 10px 30px rgba(0,0,0,.04)}
.ex-note{text-align:center;color:#55575c;font-size:14px;margin:30px 0 0}
.services{padding-bottom:20px}.faq-s{padding-top:36px}
@media(max-width:800px){.exemples{grid-template-columns:1fr}.ex-tete{margin-top:56px}}
.exemple small{font:600 11px "In";letter-spacing:.08em;text-transform:uppercase;color:var(--rouge)}
.exemple p{margin:12px 0 0;color:#333;font-size:15px}
.exemple p span{color:#1d5fbf}
.villes{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.villes span{background:#fff;border:1px solid var(--ligne);border-radius:99px;padding:6px 14px;font-size:14px}
@media(max-width:900px){
 .mh .grille{grid-template-columns:1fr;padding-top:20px}.mh .g{padding:0 20px 26px}
 .mh .noir{border-radius:22px;margin:0 16px;padding:28px 26px;flex-direction:row;flex-wrap:wrap;gap:4px 14px}
 .mh .noir span{font-size:22px}
 .vue{padding-top:60px}.vue .grille{grid-template-columns:1fr;gap:30px}
 .vue .visuel{height:520px;max-width:420px;margin:0 auto;width:100%}
 .vue .visuel .p1{width:130px;height:170px;top:80px}.vue .visuel .p2{width:140px;height:180px;top:260px}
 .exemple{padding:22px}
}
@media(max-width:420px){.vue .faits{grid-template-columns:1fr}.vue .visuel .tel{width:250px;height:500px}}
.exemple ul{margin:12px 0 0;padding-left:18px;color:#333;font-size:15px}.exemple li{margin:4px 0}