/* ══ Base : CSS extrait de index.html (source unique de la charte) ══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;color:var(--text);background:#fff;line-height:1.6}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
:root{
--navy:#0d1b3e;
--navy2:#1a2a52;
--red:#e11d2a;
--red2:#c40d1a;
--bg:#f5f7fb;
--card:#ffffff;
--border:#e7ebf3;
--text:#141a2e;
--muted:#697086;
--ok:#16a34a;
--radius:14px;
--head:'Bebas Neue',Impact,sans-serif;
}
/* ── TOP BAR ── */
.topbar{background:var(--navy);text-align:center;padding:9px 16px;font-size:13.5px;font-weight:600;color:#fff;letter-spacing:.2px}
.topbar a{color:#fff;text-decoration:underline;font-weight:700}
.topbar .blink{display:inline-block;width:8px;height:8px;background:var(--red);border-radius:50%;margin-right:7px;animation:pulse-dot 1.3s ease-in-out infinite;vertical-align:middle}
/* ── HEADER ── */
header{background:#fff;padding:12px 20px;position:sticky;top:0;z-index:999;box-shadow:0 2px 16px rgba(13,27,62,.13)}
.header-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo img{height:46px;width:auto}
.btn-call{background:var(--red);color:#fff;padding:10px 20px;border-radius:50px;font-weight:700;font-size:15px;display:flex;align-items:center;gap:8px;white-space:nowrap;transition:.2s}
.btn-call:hover{background:var(--red2);transform:translateY(-1px)}
.btn-call svg{width:16px;height:16px;fill:#fff;flex-shrink:0}
/* ── BULLE WHATSAPP FLOTTANTE ── */
.wa-fab{position:fixed;right:22px;bottom:22px;z-index:1000;display:flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;background:#25D366;box-shadow:0 8px 26px rgba(37,211,102,.5);transition:transform .2s}
.wa-fab:hover{transform:scale(1.08)}
.wa-fab svg{width:36px;height:36px;fill:#fff}
.wa-fab::before{content:'';position:absolute;inset:0;border-radius:50%;background:#25D366;animation:wa-pulse 2s infinite;z-index:-1}
@keyframes wa-pulse{0%{transform:scale(1);opacity:.65}70%{transform:scale(1.55);opacity:0}100%{opacity:0}}
.wa-tip{position:absolute;right:74px;background:#fff;color:#142a1c;padding:9px 14px;border-radius:12px;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.wa-tip::after{content:'';position:absolute;right:-6px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-left-color:#fff}
@media(max-width:600px){.wa-tip{display:none}.wa-fab{width:56px;height:56px;right:16px;bottom:16px}.wa-fab svg{width:32px;height:32px}}
/* ── HERO ── */
.hero{background:linear-gradient(150deg,var(--navy) 0%,#13234d 60%,#1c3565 100%);padding:56px 20px 76px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-140px;right:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(225,29,42,.16) 0%,transparent 70%);pointer-events:none}
.hero-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 420px;gap:48px;align-items:center;position:relative}
.hero-badge{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;padding:7px 16px;border-radius:50px;font-size:12.5px;font-weight:700;letter-spacing:.4px;margin-bottom:22px}
.hero-badge .dot{width:8px;height:8px;background:var(--red);border-radius:50%;box-shadow:0 0 0 0 rgba(225,29,42,.7);animation:pulse-ring 1.7s infinite}
@keyframes pulse-ring{0%{box-shadow:0 0 0 0 rgba(225,29,42,.6)}70%{box-shadow:0 0 0 8px rgba(225,29,42,0)}100%{box-shadow:0 0 0 0 rgba(225,29,42,0)}}
.hero h1{color:#fff;font-family:var(--head);font-weight:400;font-size:clamp(40px,5.6vw,66px);line-height:1.02;letter-spacing:1px;margin-bottom:16px}
.hero h1 em{color:var(--red);font-style:normal}
.hero-sub{color:rgba(255,255,255,.8);font-size:17px;margin-bottom:24px;max-width:520px}
.hero-pricebar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.hero-price{display:inline-flex;align-items:baseline;gap:8px;background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;border-radius:16px;padding:12px 26px;box-shadow:0 8px 24px rgba(225,29,42,.32)}
.hero-price .from{font-size:13px;opacity:.9;font-weight:600}
.hero-price .amount{font-family:var(--head);font-size:46px;line-height:.85;letter-spacing:1px}
.hero-guar{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.92);padding:10px 16px;border-radius:50px;font-size:13px;font-weight:600}
.hero-bullets{display:flex;flex-direction:column;gap:9px;margin-bottom:28px}
.hero-bullet{display:flex;align-items:center;gap:11px;color:rgba(255,255,255,.9);font-size:15px}
.hero-bullet svg{width:20px;height:20px;fill:var(--red);flex-shrink:0}
.hero-phone{display:inline-flex;align-items:center;gap:12px;color:#fff;font-size:22px;font-weight:800;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);padding:12px 24px;border-radius:50px;transition:.2s}
.hero-phone:hover{background:rgba(255,255,255,.14);transform:translateY(-2px)}
.hero-phone .ico{width:38px;height:38px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hero-phone .ico svg{width:18px;height:18px;fill:#fff}
.hero-phone span{font-size:12.5px;font-weight:500;opacity:.72;display:block;line-height:1.1}
/* ── FORM CARD / WIZARD ── */
.form-card{background:#fff;border-radius:20px;position:relative;z-index:1;box-shadow:0 24px 60px rgba(0,0,0,.32),0 0 0 1.5px rgba(225,29,42,.45);animation:formGlow 3.6s ease-in-out infinite;}
@keyframes formGlow{0%,100%{box-shadow:0 24px 60px rgba(0,0,0,.32),0 0 0 1.5px rgba(225,29,42,.4),0 0 0 0 rgba(225,29,42,0)}50%{box-shadow:0 24px 60px rgba(0,0,0,.32),0 0 0 1.5px rgba(225,29,42,.7),0 0 32px 2px rgba(225,29,42,.26)}}
.form-badge-float{position:absolute;top:-15px;right:18px;z-index:4;display:flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--border);border-radius:50px;padding:6px 14px 6px 11px;box-shadow:0 10px 24px rgba(13,27,62,.26)}
.form-badge-float svg{width:18px;height:18px;flex-shrink:0}
.form-badge-float .r{font-weight:800;color:var(--navy);font-size:14px}
.form-badge-float .s{color:#fbbc05;font-size:12px;letter-spacing:.5px}
.form-badge-float small{color:var(--muted);font-size:11px;font-weight:600;border-left:1px solid var(--border);padding-left:7px}
.form-card-head{background:linear-gradient(135deg,var(--navy),var(--navy2));padding:20px 28px;position:relative;overflow:hidden;border-radius:20px 20px 0 0;}
.form-card-head::after{content:'';position:absolute;right:-30px;top:-30px;width:130px;height:130px;background:radial-gradient(circle,rgba(225,29,42,.18) 0%,transparent 70%);border-radius:50%;}
.form-card-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;padding:4px 12px;border-radius:50px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;margin-bottom:10px;}
.form-card-badge::before{content:'';width:6px;height:6px;background:var(--red);border-radius:50%;animation:pulse-dot 1.5s ease-in-out infinite;}
@keyframes pulse-dot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.6}}
.form-card-title{font-size:20px;font-weight:800;color:#fff;line-height:1.3;margin-top:2px;}
.form-card-sub{color:rgba(255,255,255,.65);font-size:12.5px;margin-top:5px;}
.form-card-avail{display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(255,255,255,.7);margin-top:8px}
.avail-dot{width:7px;height:7px;background:var(--ok);border-radius:50%;flex-shrink:0;animation:pulse-dot 1.5s ease-in-out infinite}
.wiz-stepper{display:flex;align-items:center;justify-content:center;gap:6px;padding:14px 28px 0;}
.wiz-dot{height:4px;border-radius:4px;transition:all .4s cubic-bezier(.34,1.56,.64,1);background:#e2e8f0;}
.wiz-dot.active{background:var(--red);width:28px;}
.wiz-dot.done{background:var(--navy);width:16px;}
.wiz-dot.inactive{width:8px;}
.wiz-label{text-align:center;font-size:11px;font-weight:600;color:#94a3b8;padding:5px 28px 0;letter-spacing:.3px;}
.wiz-steps{position:relative;overflow:hidden;}
.wiz-step{padding:18px 28px 22px;display:none;animation:wizIn .35s cubic-bezier(.22,1,.36,1) forwards;}
.wiz-step.active{display:block;}
.wiz-step.exit{display:block;animation:wizOut .25s ease-in forwards;}
@keyframes wizIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes wizOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-8px) scale(.97)}}
.wiz-field{margin-bottom:13px;}
.wiz-field label{display:block;font-size:12px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;}
.wiz-field input{width:100%;padding:13px 16px;border:2px solid #e5e7eb;border-radius:10px;font-size:16px;font-family:inherit;font-weight:600;color:var(--navy);background:#f9fafb;transition:all .2s;letter-spacing:1px;}
.wiz-field input:focus{outline:none;border-color:var(--red);background:#fff;box-shadow:0 0 0 3px rgba(225,29,42,.1);}
.wiz-field input.error{border-color:#ef4444;background:#fef2f2;}
.wiz-field input::placeholder{color:#9ca3af;font-weight:400;letter-spacing:0;}
.wiz-field-error{font-size:11px;color:#ef4444;font-weight:600;margin-top:3px;display:none;}
.wiz-field-error.visible{display:block;}
.wiz-foreign{display:flex;align-items:center;gap:10px;padding:11px 13px;background:#f8fafc;border:1.5px solid #e5e7eb;border-radius:10px;cursor:pointer;transition:all .2s;margin-bottom:13px;user-select:none;}
.wiz-foreign:hover{border-color:var(--red);background:#fff5f5;}
.wiz-foreign input{display:none;}
.wiz-foreign-box{width:20px;height:20px;border-radius:6px;border:2px solid #d1d5db;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s cubic-bezier(.34,1.56,.64,1);}
.wiz-foreign.checked .wiz-foreign-box{background:var(--red);border-color:var(--red);transform:scale(1.1);}
.wiz-foreign-box svg{width:12px;height:12px;fill:#fff;opacity:0;transform:scale(0);transition:all .15s;}
.wiz-foreign.checked .wiz-foreign-box svg{opacity:1;transform:scale(1);}
.wiz-foreign-txt{font-size:13px;font-weight:600;color:#374151;line-height:1.3;}
.wiz-foreign-txt span{display:block;font-size:11px;font-weight:500;color:#94a3b8;margin-top:1px;}
.wiz-loading{text-align:center;padding:6px 0 4px;display:none;}
.wiz-loading-plate{font-size:20px;font-weight:900;color:var(--navy);letter-spacing:3px;margin-bottom:10px;}
.wiz-loading-bar-wrap{height:4px;background:#f1f5f9;border-radius:4px;overflow:hidden;margin-bottom:8px;}
.wiz-loading-bar{height:100%;background:linear-gradient(90deg,var(--red),var(--navy));border-radius:4px;}
@keyframes wiz-bar-anim{0%{width:0}40%{width:60%}70%{width:82%}100%{width:100%}}
.wiz-loading-txt{font-size:13px;color:#64748b;font-weight:500;}
.wiz-immat-display{background:#f9fafb;border:2px dashed #e5e7eb;border-radius:10px;padding:10px 16px;text-align:center;font-size:22px;font-weight:900;color:var(--navy);letter-spacing:3px;margin-bottom:14px;}
.wiz-vehicle-card{background:#f6f8fc;border:1.5px solid var(--border);border-radius:14px;padding:16px 18px;margin-bottom:16px;display:flex;align-items:center;gap:13px;}
.wiz-vehicle-icon{width:48px;height:48px;background:var(--navy);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.wiz-vehicle-icon svg{width:24px;height:24px;fill:#fff;}
.wiz-vehicle-info{flex:1;}
.wiz-vehicle-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin-bottom:2px;}
.wiz-vehicle-name{font-size:16px;font-weight:800;color:var(--navy);line-height:1.2;}
.wiz-vehicle-year{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;color:var(--navy);background:#eef2f9;border-radius:50px;padding:2px 10px;margin-top:3px;}
.wiz-confirm-q{font-size:14px;font-weight:700;color:#374151;text-align:center;margin-bottom:12px;}
.wiz-confirm-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:2px;}
.wiz-btn-confirm{padding:13px;border-radius:10px;border:2px solid transparent;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;transition:all .2s cubic-bezier(.34,1.56,.64,1);}
.wiz-btn-confirm:active{transform:scale(.97);}
.wiz-btn-yes{background:var(--navy);color:#fff;box-shadow:0 4px 14px rgba(13,27,62,.25);}
.wiz-btn-yes:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 22px rgba(13,27,62,.35);}
.wiz-btn-no{background:#fff;color:#64748b;border-color:#e5e7eb;}
.wiz-btn-no:hover{transform:translateY(-2px);border-color:var(--red);color:var(--red);box-shadow:0 4px 12px rgba(225,29,42,.15);}
.wiz-devis-banner{display:flex;align-items:center;gap:11px;background:linear-gradient(135deg,var(--navy),#1e3a6e);border-radius:12px;padding:13px 15px;margin-bottom:16px;position:relative;overflow:hidden;animation:bannerIn .4s cubic-bezier(.22,1,.36,1);}
@keyframes bannerIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.wiz-devis-banner-icon{font-size:20px;flex-shrink:0;}
.wiz-devis-banner-body{flex:1;}
.wiz-devis-banner-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.5);margin-bottom:2px;}
.wiz-devis-banner-veh{font-size:14px;font-weight:800;color:#fff;line-height:1.2;}
.wiz-devis-banner-check{width:26px;height:26px;background:var(--ok);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.wiz-back{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#94a3b8;cursor:pointer;margin-bottom:12px;background:none;border:none;padding:0;font-family:inherit;transition:color .2s;}
.wiz-back:hover{color:#64748b;}
.wiz-back svg{width:12px;height:12px;fill:currentColor;}
.wiz-btn-next{width:100%;padding:14px;background:var(--navy);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s cubic-bezier(.34,1.56,.64,1);}
.wiz-btn-next:hover{background:var(--navy2);transform:translateY(-2px);box-shadow:0 8px 22px rgba(13,27,62,.3);}
.wiz-btn-next:active{transform:scale(.98);}
.wiz-btn-next svg{width:16px;height:16px;fill:#fff;}
.wiz-btn-submit{width:100%;padding:15px;background:var(--red);color:#fff;border:none;border-radius:10px;font-size:17px;font-weight:800;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:5px;transition:all .2s cubic-bezier(.34,1.56,.64,1);box-shadow:0 4px 18px rgba(225,29,42,.32);}
.wiz-btn-submit:hover{background:var(--red2);transform:translateY(-2px);box-shadow:0 8px 26px rgba(225,29,42,.42);}
.wiz-btn-submit:active{transform:scale(.98);}
.wiz-btn-submit svg{width:20px;height:20px;fill:#fff;}
.wiz-note{font-size:12px;color:var(--muted);text-align:center;margin-top:10px;display:flex;align-items:center;justify-content:center;gap:4px;}
.wiz-note svg{width:12px;height:12px;fill:var(--muted);flex-shrink:0;}
.wiz-success{display:none;text-align:center;padding:20px 28px 28px;}
.wiz-success-circle{width:64px;height:64px;background:var(--ok);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 8px 22px rgba(22,163,74,.3);animation:popIn .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes popIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.wiz-success-circle svg{width:30px;height:30px;fill:#fff;}
.wiz-success h3{color:var(--navy);font-size:20px;font-weight:800;margin-bottom:8px;}
.wiz-success p{color:var(--muted);font-size:14px;line-height:1.6;}
@keyframes wiz-spin{to{transform:rotate(360deg)}}
/* ── TRUST BAR ── */
.trust-bar{background:var(--navy);padding:18px 20px;border-top:1px solid rgba(255,255,255,.08)}
.trust-bar-inner{max-width:1100px;margin:0 auto;display:flex;justify-content:center;flex-wrap:wrap;gap:16px 34px}
.trust-item{display:flex;align-items:center;gap:8px;color:#fff;font-weight:700;font-size:14px}
.trust-item svg{width:20px;height:20px;fill:var(--red);flex-shrink:0}
/* ── SECTIONS ── */
section{padding:66px 20px}
.section-inner{max-width:1100px;margin:0 auto}
.section-tag{font-size:13px;font-weight:800;color:var(--red);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px}
.section-title{font-family:var(--head);font-weight:400;font-size:clamp(30px,4vw,46px);color:var(--navy);margin-bottom:14px;line-height:1.05;letter-spacing:.5px}
.section-title em{color:var(--red);font-style:normal}
.section-sub{font-size:17px;color:var(--muted);max-width:620px;margin-bottom:42px}
.bg-soft{background:var(--bg)}
/* ── GOOGLE REVIEWS ── */
.greviews{background:var(--bg)}
.greviews-head{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:center;background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px 28px;max-width:620px;margin:0 auto 30px;box-shadow:0 6px 24px rgba(15,23,42,.06)}
.greviews-g{display:flex;align-items:center;gap:12px}
.greviews-g svg{width:40px;height:40px;flex-shrink:0}
.greviews-g .gtxt{display:flex;flex-direction:column;line-height:1.15}
.greviews-g .gtxt b{font-size:16px;color:var(--navy);font-weight:800}
.greviews-g .gtxt span{font-size:13px;color:var(--muted)}
.greviews-score{display:flex;align-items:center;gap:14px;border-left:1px solid var(--border);padding-left:22px}
.greviews-score .num{font-family:var(--head);font-size:46px;color:var(--navy);line-height:.8}
.greviews-score .stars{font-size:18px;letter-spacing:1px;color:#fbbc05}
.greviews-score .count{font-size:12px;color:var(--muted)}
.rev-viewport{position:relative}
.rev-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 2px 10px;-ms-overflow-style:none;scrollbar-width:none}
.rev-track::-webkit-scrollbar{display:none}
.greview{flex:0 0 340px;scroll-snap-align:start;background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:11px;box-shadow:0 4px 14px rgba(15,23,42,.05)}
.greview-top{display:flex;align-items:center;gap:12px}
.greview-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px;color:#fff;flex-shrink:0}
.greview-meta{flex:1;min-width:0}
.greview-meta strong{display:block;font-size:14px;color:var(--navy);font-weight:700}
.greview-meta .sub{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
.greview-meta .gmark{width:15px;height:15px}
.greview-stars{font-size:15px;letter-spacing:1px;color:#fbbc05}
.greview-stars .empty{color:#dadce0}
.greview-text{font-size:14px;color:#3c4257;line-height:1.65}
.rev-nav{display:flex;gap:10px;justify-content:center;margin-top:14px}
.rev-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--navy);cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:.2s;box-shadow:0 3px 10px rgba(15,23,42,.06)}
.rev-btn:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
/* ── GALERIE ── */
.gal-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 2px 10px;-ms-overflow-style:none;scrollbar-width:none}
.gal-track::-webkit-scrollbar{display:none}
.gallery-item{flex:0 0 190px;scroll-snap-align:start;position:relative;border-radius:12px;overflow:hidden;cursor:pointer;background:var(--navy);aspect-ratio:9/16;border:1px solid var(--border);box-shadow:0 3px 10px rgba(15,23,42,.08)}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.gallery-item:hover img{transform:scale(1.06)}
.gallery-item::after{content:'🔍';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22px;background:rgba(13,27,62,.35);opacity:0;transition:.25s}
.gallery-item:hover::after{opacity:1}
.gallery-note{text-align:center;margin-top:24px;font-size:13px;color:var(--muted)}
.lightbox{display:none;position:fixed;inset:0;z-index:9999;background:rgba(8,12,28,.92);align-items:center;justify-content:center;padding:20px}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lightbox-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;border:none;font-size:24px;cursor:pointer;line-height:1}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;border:none;font-size:26px;cursor:pointer}
.lightbox-prev{left:16px}.lightbox-next{right:16px}
/* ── PROBLEMES ── */
.problems-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.problem-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;display:flex;gap:14px;align-items:flex-start;box-shadow:0 3px 12px rgba(15,23,42,.04)}
.problem-ico{width:44px;height:44px;border-radius:12px;background:#fdeaec;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.problem-card h3{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:4px}
.problem-card p{font-size:14px;color:var(--muted)}
/* ── AVANTAGES ── */
.avantages-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.avantage-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column;gap:12px;transition:.2s;box-shadow:0 3px 12px rgba(15,23,42,.04)}
.avantage-card:hover{transform:translateY(-4px);border-color:var(--red);box-shadow:0 14px 32px rgba(225,29,42,.12)}
.avantage-ico{width:50px;height:50px;border-radius:12px;background:#fdeaec;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.avantage-card h3{font-size:17px;font-weight:800;color:var(--navy)}
.avantage-card p{font-size:14px;color:var(--muted);flex:1}
/* ── ÉTAPES ── */
.steps{background:var(--navy)}
.steps .section-title{color:#fff}
.steps .section-sub{color:rgba(255,255,255,.6)}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px}
.step-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:28px;text-align:center}
.step-num{width:46px;height:46px;background:var(--red);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--head);font-size:22px;line-height:1;color:#fff;margin:0 auto 16px}
.step-card h3{color:#fff;font-size:16px;font-weight:700;margin-bottom:8px}
.step-card p{color:rgba(255,255,255,.62);font-size:14px}
/* ── GARANTIES ── */
.garanties-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.garantie-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px;text-align:center;transition:.2s}
.garantie-card:hover{border-color:var(--red);transform:translateY(-3px)}
.garantie-card .icon{font-size:30px;margin-bottom:8px}
.garantie-card h3{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:4px}
.garantie-card p{font-size:13px;color:var(--muted)}
/* ── ZONE IDF ── */
.zone-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin-top:6px}
.zone-card{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 16px;transition:.2s;text-decoration:none;cursor:pointer}
.zone-card:hover{border-color:var(--red);transform:translateY(-2px);box-shadow:0 8px 20px rgba(13,27,62,.1)}
.zone-num{width:42px;height:42px;border-radius:11px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;line-height:1;flex-shrink:0}
.zone-card strong{font-size:14px;color:var(--navy);display:block}
.zone-card span{display:block;font-size:12px;color:var(--muted)}
.brands-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:14px;margin-top:26px}
.brands-grid a{display:flex;flex-direction:column;align-items:center;gap:11px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px 12px;text-decoration:none;transition:.2s}
.brands-grid a:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:0 10px 24px rgba(13,27,62,.1)}
.brands-grid img{height:40px;width:auto}
.brands-grid span{font-size:13px;font-weight:700;color:var(--navy)}
/* ── COMPARAISON PRIX ── */
.compare{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:16px;max-width:820px;margin:0 auto 8px}
.compare-col{border-radius:16px;padding:26px 24px;text-align:center;display:flex;flex-direction:column;gap:6px;justify-content:center}
.compare-col .lbl{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px}
.compare-col .price{font-family:var(--head);font-size:48px;line-height:.9;letter-spacing:1px}
.compare-col .desc{font-size:12.5px;line-height:1.45}
.compare-bad{background:#fff;border:1px solid var(--border)}
.compare-bad .lbl{color:var(--muted)}
.compare-bad .price{color:#94a3b8;text-decoration:line-through;text-decoration-color:rgba(225,29,42,.5)}
.compare-bad .desc{color:var(--muted)}
.compare-good{background:linear-gradient(135deg,var(--navy),#16294f);border:1px solid var(--navy)}
.compare-good .lbl{color:rgba(255,255,255,.6)}
.compare-good .price{color:#fff}
.compare-good .desc{color:rgba(255,255,255,.75)}
.compare-vs{align-self:center;font-family:var(--head);font-size:24px;color:var(--red);background:#fff;border:2px solid var(--red);width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center}
/* ── PRIX UNIQUE ── */
.price-hero{max-width:560px;margin:36px auto 0;background:#fff;border:2px solid var(--red);border-radius:20px;padding:30px 28px;text-align:center;box-shadow:0 14px 40px rgba(225,29,42,.12)}
.price-hero .tag{display:inline-block;background:var(--red);color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;padding:5px 14px;border-radius:50px;margin-bottom:14px}
.price-hero .amount{font-family:var(--head);font-size:64px;line-height:.85;color:var(--navy);letter-spacing:1px}
.price-hero .amount small{display:block;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--muted);letter-spacing:0;margin-top:6px}
.price-hero ul{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left}
.price-hero li{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--text)}
.price-hero li svg{width:18px;height:18px;fill:var(--ok);flex-shrink:0}
.price-covered{text-align:center;margin-top:22px;font-size:14px;color:var(--muted)}
/* ── FAQ ── */
.faq-list{display:flex;flex-direction:column}
.faq-item{border-bottom:1px solid var(--border)}
.faq-question{width:100%;background:none;border:none;text-align:left;padding:20px 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:16px;font-weight:700;color:var(--navy);gap:12px;font-family:inherit}
.faq-question:hover{color:var(--red)}
.faq-icon{width:24px;height:24px;background:var(--red);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.3s}
.faq-icon svg{width:12px;height:12px;fill:#fff;transition:.3s}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--muted);font-size:15px}
.faq-item.open .faq-answer{max-height:340px;padding-bottom:20px}
.faq-item.open .faq-icon{background:var(--navy)}
.faq-item.open .faq-icon svg{transform:rotate(45deg)}
/* ── CTA SECTION ── */
.cta-section{background:linear-gradient(135deg,var(--red) 0%,var(--red2) 100%);padding:58px 20px;text-align:center}
.cta-section h2{font-family:var(--head);font-weight:400;font-size:clamp(30px,4vw,46px);color:#fff;margin-bottom:10px;letter-spacing:.5px}
.cta-section p{color:rgba(255,255,255,.92);font-size:17px;margin-bottom:30px;max-width:520px;margin-left:auto;margin-right:auto}
.cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.btn-white{background:#fff;color:var(--red);padding:16px 32px;border-radius:50px;font-weight:800;font-size:17px;display:flex;align-items:center;gap:8px;transition:.2s}
.btn-white:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.btn-white svg{width:18px;height:18px;fill:var(--red)}
.btn-outline-white{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.65);padding:14px 28px;border-radius:50px;font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px;transition:.2s}
.btn-outline-white:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-outline-white svg{width:18px;height:18px;fill:#fff}
/* ── MID CTA ── */
.midpage-cta{background:var(--navy);padding:22px 20px}
.midpage-cta-inner{max-width:900px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.midpage-cta-text strong{color:#fff;font-size:18px;font-weight:800;display:block}
.midpage-cta-text span{color:rgba(255,255,255,.65);font-size:14px}
.midpage-cta-btn{background:var(--red);color:#fff;padding:14px 28px;border-radius:50px;font-weight:800;font-size:15px;white-space:nowrap;transition:.2s}
.midpage-cta-btn:hover{background:var(--red2);transform:translateY(-2px)}
/* ── FOOTER ── */
footer{background:#0a142e;color:rgba(255,255,255,.6);padding:38px 20px 30px;text-align:center;font-size:13px}
footer .f-logo img{height:42px;margin:0 auto 14px}
footer strong{color:#fff}
footer a{color:rgba(255,255,255,.7);text-decoration:underline}
.f-links{margin:14px 0;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
/* ── STICKY MOBILE CTA ── */
.sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:998;background:var(--navy);padding:12px 16px;box-shadow:0 -4px 20px rgba(0,0,0,.25)}
.sticky-cta-inner{display:flex;gap:10px;max-width:500px;margin:0 auto}
.sticky-cta .btn-form{flex:1;background:var(--red);color:#fff;border:none;padding:14px;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;font-family:inherit}
.sticky-cta .btn-phone{flex:1;background:#fff;color:var(--navy);padding:14px;border-radius:10px;font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;gap:6px}
.sticky-cta .btn-phone svg{width:16px;height:16px;fill:var(--navy)}
/* ── BOUTON DEVIS (réutilisable) ── */
.btn-quote{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;padding:15px 30px;border-radius:50px;font-weight:800;font-size:16px;cursor:pointer;border:none;font-family:inherit;box-shadow:0 8px 24px rgba(225,29,42,.3);transition:.2s}
.btn-quote:hover{background:var(--red2);transform:translateY(-2px);box-shadow:0 12px 30px rgba(225,29,42,.4)}
.btn-quote svg{width:18px;height:18px;fill:#fff}
/* ── FAB (bouton tarif flottant, desktop) ── */
.fab{position:fixed;right:22px;bottom:24px;z-index:997;display:inline-flex;align-items:center;gap:9px;background:var(--red);color:#fff;border:none;font-family:inherit;font-weight:800;font-size:15px;padding:14px 22px;border-radius:50px;cursor:pointer;box-shadow:0 10px 30px rgba(225,29,42,.4);opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s}
.fab.show{opacity:1;visibility:visible;transform:translateY(0)}
.fab svg{width:18px;height:18px;fill:#fff}
@media(max-width:820px){.fab{display:none}}
/* ── POPUP TARIF ── */
.promo{position:fixed;inset:0;z-index:9998;background:rgba(8,12,28,.62);display:none;align-items:center;justify-content:center;padding:20px}
.promo.open{display:flex;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.promo-card{background:#fff;border-radius:20px;max-width:420px;width:100%;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.4);animation:popIn .4s cubic-bezier(.34,1.56,.64,1)}
.promo-head{background:linear-gradient(135deg,var(--navy),var(--navy2));padding:26px 26px 22px;position:relative;text-align:center}
.promo-head .ico{font-size:34px;line-height:1}
.promo-head h3{color:#fff;font-size:20px;font-weight:800;margin-top:8px}
.promo-close{position:absolute;top:12px;right:14px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;border:none;font-size:15px;cursor:pointer;line-height:1}
.promo-body{padding:22px 26px 24px;text-align:center}
.promo-body .price{font-family:var(--head);font-size:32px;color:var(--red);display:block;margin-bottom:6px;letter-spacing:1px}
.promo-body p{color:var(--muted);font-size:14.5px;margin-bottom:18px;line-height:1.55}
.promo-cta{width:100%;background:var(--red);color:#fff;border:none;font-family:inherit;font-weight:800;font-size:16px;padding:15px;border-radius:12px;cursor:pointer;transition:.2s}
.promo-cta:hover{background:var(--red2)}
.promo-foot{margin-top:12px;font-size:12px;color:var(--muted)}
@media(max-width:820px){
.hero-inner{grid-template-columns:1fr;gap:32px}
.sticky-cta{display:block}
body{padding-bottom:80px}
.greviews-score{border-left:none;padding-left:0}
}
@media(max-width:600px){
.compare{grid-template-columns:1fr;gap:12px}
.compare-vs{margin:-4px auto;width:44px;height:44px;font-size:20px}
.price-hero ul{grid-template-columns:1fr}
.midpage-cta-inner{flex-direction:column;align-items:stretch;text-align:center}
}
@media(max-width:480px){
.trust-bar-inner{gap:12px 22px}
.trust-item{font-size:13px}
.btn-call span{display:none}
.logo img{height:38px}
.greview{flex-basis:82vw}
.gallery-item{flex-basis:58vw}
.form-badge-float small{display:none}
.form-badge-float{right:12px;top:-13px;padding:5px 12px 5px 10px}
}
/* ══ brand-band (injecté par integrate-lp-home.php) ══ */
/* ==========================================================================
BRAND BAND — bande de logos de marques automobiles
urgence-adblue.fr · composant autonome, aucune dépendance externe
--------------------------------------------------------------------------
PRINCIPE D'ÉQUILIBRE OPTIQUE
Tous les SVG partagent un viewBox 24x24 mais leur remplissage optique
diffère (le lion Peugeot remplit la boîte, le wordmark IVECO en occupe 16 %
en hauteur). Une hauteur CSS commune donne donc des logos de poids visuel
incohérents.
Chaque logo reçoit ici un facteur --s (champ "scale" de seo-data/marques.json),
mesuré sur la bounding box RÉELLE du tracé (rasterisation 960 px + trim alpha) :
largeur naturelle wnat = --logo-base * bbox.w / 24
hauteur naturelle hnat = --logo-base * bbox.h / 24
--s = min(40 / hnat , 96 / wnat) borné à [0.6 , 1.8]
Le SVG est ensuite dimensionné à (--logo-base * --s) dans une boîte fixe de
96x40, ce qui donne :
· une hauteur de tracé de 40 px pour les logos compacts (cercles, écussons) ;
· une largeur plafonnée à 96 px pour les wordmarks très plats
(Iveco, Dacia, Audi, Ford), qui sinon écraseraient la bande.
--logo-base = 60px est la taille de référence sur laquelle --s a été calculé :
NE PAS la modifier sans recalculer le manifeste.
USAGE
Les marques sans landing page utilisent au
lieu de
: le composant gère les deux.
========================================================================== */
.brand-band{
/* charte urgence-adblue.fr — valeurs en dur pour rester autonome,
surchargées automatiquement si les variables globales du site existent */
--bb-navy:#0d1b3e;
--bb-red:#e11d2a;
--bb-card:#fff;
--bb-border:#e7ebf3;
--bb-muted:#697086;
--logo-base:60px; /* base de calcul de --s : ne pas toucher seule */
--box-w:96px;
--box-h:40px;
--bb-gap:14px;
--bb-radius:14px;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(calc(var(--box-w) + 24px),1fr));
gap:var(--bb-gap);
margin:0;
padding:0;
list-style:none;
}
/* ── Tuile ───────────────────────────────────────────────────────────────── */
.brand-band__item{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:11px;
background:var(--bb-card);
border:1px solid var(--bb-border);
border-radius:var(--bb-radius);
padding:20px 10px 16px;
text-decoration:none;
color:inherit;
transition:transform .2s,border-color .2s,box-shadow .2s;
}
a.brand-band__item:hover,
a.brand-band__item:focus-visible{
border-color:var(--bb-red);
transform:translateY(-3px);
box-shadow:0 10px 24px rgba(13,27,62,.1);
}
a.brand-band__item:focus-visible{
outline:2px solid var(--bb-red);
outline-offset:2px;
}
/* ── Boîte optique : dimensions FIXES, le SVG est centré dedans ───────────── */
.brand-band__box{
position:relative;
display:block;
width:var(--box-w);
height:var(--box-h);
flex:0 0 auto;
}
.brand-band__box img{
position:absolute; /* hors flux : la boîte garde 96x40 quoi qu'il arrive */
top:50%;
left:50%;
/* taille pilotée par le facteur optique du manifeste ; --s:1 en secours */
width:calc(var(--logo-base) * var(--s, 1));
height:calc(var(--logo-base) * var(--s, 1));
translate:-50% -50%; /* pas de transform : le SVG reste net à tout DPI */
max-width:none; /* neutralise un éventuel img{max-width:100%} global */
display:block;
}
.brand-band__label{
font-size:13px;
font-weight:700;
line-height:1.2;
text-align:center;
color:var(--bb-navy);
}
.brand-band__motor{
font-size:11.5px;
font-weight:500;
line-height:1.35;
text-align:center;
color:var(--bb-muted);
}
/* ══ VARIANTE STRIP — bande horizontale compacte, défilable au doigt ════════ */
.brand-band--strip{
display:flex;
flex-wrap:nowrap;
overflow-x:auto;
overscroll-behavior-x:contain;
scroll-snap-type:x proximity;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
gap:10px;
padding:2px 2px 10px;
/* fondu sur les bords pour signaler le défilement */
-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);
mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);
}
.brand-band--strip::-webkit-scrollbar{display:none}
.brand-band--strip .brand-band__item{
flex:0 0 auto;
scroll-snap-align:center;
padding:12px 14px;
gap:0;
}
.brand-band--strip .brand-band__label,
.brand-band--strip .brand-band__motor{display:none}
.brand-band--strip.brand-band--strip-labelled .brand-band__label{
display:block;
margin-top:8px;
}
/* variante sans cadre, pour poser la bande sur un fond déjà cartonné */
.brand-band--bare .brand-band__item{
background:none;
border-color:transparent;
box-shadow:none;
padding:10px 8px;
}
.brand-band--bare .brand-band__box img{opacity:.82;transition:opacity .2s}
.brand-band--bare a.brand-band__item:hover .brand-band__box img{opacity:1}
/* ══ RESPONSIVE ════════════════════════════════════════════════════════════
La boîte ET --logo-base sont réduits du MÊME facteur : l'équilibre optique
calculé par --s reste donc exact à toutes les tailles.
Facteur .78 → boîte 75x31, base 47px : 3 logos par ligne tiennent sur 360px
(3 x 75 + 2 x 10 de gap + 2 x 16 de marge = 277px). */
@media (max-width:719px){
.brand-band{
--logo-base:47px;
--box-w:75px;
--box-h:31px;
--bb-gap:10px;
grid-template-columns:repeat(auto-fit,minmax(calc(var(--box-w) + 14px),1fr));
}
.brand-band__item{padding:14px 6px 12px;gap:8px}
.brand-band__label{font-size:12px}
}
@media (max-width:359px){
.brand-band{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
.brand-band__item{transition:none}
a.brand-band__item:hover{transform:none}
}
/* ══ lp-extra.css ══ */
/* ─────────────────────────────────────────────────────────────────────
* lp-extra.css — composants propres aux landing pages SEO (lp.php).
* Concaténé à la fin de /css/lp.css par build-lp.php : il hérite donc
* de toutes les variables de la charte (--navy, --red, --border…).
* ───────────────────────────────────────────────────────────────────── */
/* ── Fil d'Ariane ── */
.lp-crumbs{background:#fff;border-bottom:1px solid var(--border);font-size:13px}
.lp-crumbs .section-inner{padding-top:12px;padding-bottom:12px;display:flex;flex-wrap:wrap;align-items:center;gap:7px;color:var(--muted)}
.lp-crumbs a{color:var(--muted);text-decoration:none;transition:.2s}
.lp-crumbs a:hover{color:var(--red)}
.lp-crumbs .sep{color:#c3c9d6}
.lp-crumbs [aria-current]{color:var(--navy);font-weight:700}
/* ── Blocs de texte rédactionnel ── */
.lp-prose{max-width:820px}
.lp-prose p{font-size:16px;line-height:1.75;color:#42506b;margin-top:16px}
.lp-prose .section-title{text-align:left}
.lp-prose .section-tag{text-align:left}
/* ── Chiffres clés de la commune ── */
.lp-facts{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-top:28px;padding:0}
.lp-facts li{background:#fff;border:1px solid var(--border);border-left:3px solid var(--red);border-radius:12px;padding:14px 16px}
.lp-facts strong{display:block;font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:.5px;color:var(--navy);line-height:1.15}
.lp-facts span{display:block;font-size:12.5px;color:var(--muted);margin-top:3px}
/* ── Liste exhaustive des communes (maillage interne) ── */
.lp-all-cities{margin-top:34px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 22px}
.lp-all-title{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:.6px;color:var(--navy);margin-bottom:12px}
.lp-all-cities ul{list-style:none;columns:4;column-gap:26px;padding:0;margin:0}
.lp-all-cities li{break-inside:avoid;margin-bottom:5px}
.lp-all-cities a{font-size:13.5px;color:#42506b;text-decoration:none;transition:.15s}
.lp-all-cities a:hover{color:var(--red);text-decoration:underline}
@media(max-width:900px){.lp-all-cities ul{columns:2}}
@media(max-width:520px){.lp-all-cities ul{columns:1}}
/* ── Mention de cadrage légal ── */
.lp-mentions{max-width:900px;margin:0 auto;padding:26px 20px 34px;font-size:12.5px;line-height:1.6;color:#8892a6;text-align:center}
/* ── Carte de situation de la commune (SVG inline, unique par page) ── */
.lp-map{display:grid;grid-template-columns:200px 1fr;gap:26px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px 24px;margin-top:30px}
.lp-map figure{margin:0}
.lp-map svg{display:block;width:200px;height:200px}
.lp-map .dept-shape{fill:#eef1f7;stroke:#c9d2e4;stroke-width:1.2;stroke-linejoin:round}
.lp-map .dept-shape.is-other{fill:#f6f8fc;stroke:#dfe5f0}
.lp-map .city-halo{fill:var(--red);opacity:.18}
.lp-map .city-dot{fill:var(--red);stroke:#fff;stroke-width:1.6}
.lp-map figcaption{font-size:12px;color:var(--muted);margin-top:8px;text-align:center}
.lp-map-txt h3{font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:.6px;color:var(--navy);margin-bottom:8px}
.lp-map-txt p{font-size:15px;line-height:1.7;color:#42506b}
@media(max-width:700px){.lp-map{grid-template-columns:1fr;justify-items:center;text-align:center}}
/* ── Galerie de photos d'intervention ── */
.lp-gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:26px}
.lp-gal figure{margin:0;background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:.2s}
.lp-gal figure:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:0 10px 24px rgba(13,27,62,.1)}
.lp-gal img{display:block;width:100%;height:230px;object-fit:cover;background:#eef1f7}
.lp-gal figcaption{font-size:12.5px;line-height:1.5;color:var(--muted);padding:11px 13px}
@media(max-width:520px){.lp-gal img{height:200px}}
/* ── Bulle WhatsApp : ne doit pas chevaucher la barre collante mobile ── */
@media(max-width:760px){
.wa-fab{bottom:86px}
}
/* ── Lien "tout le département" ── */
.lp-link-dept{display:inline-block;border-color:var(--navy);color:var(--navy)}
.lp-link-dept:hover{background:var(--navy);color:#fff}
Peugeot
...