/* ===================================================================
   VR AUTO — Architecture "showroom" : sidebar fixe + place de marché
   Volontairement très différent d'un site à en-tête classique.
   =================================================================== */
:root{
  --navy:#0f2742; --navy-2:#1b3c63; --navy-3:#27537f;
  --gold:#2f7ff0; --gold-2:#1857c7; --gold-soft:#e9f1fe;
  --bg:#ffffff; --soft:#f4f7fb; --soft-2:#e8eef6; --line:#dfe7f0;
  --muted:#64748b; --text:#16263d;
  --ombre:0 4px 16px rgba(15,39,66,.08); --ombre-md:0 12px 30px rgba(15,39,66,.12); --ombre-lg:0 24px 54px rgba(15,39,66,.18);
  --radius:16px; --radius-sm:11px; --trans:.4s cubic-bezier(.2,.7,.3,1);
  --font:'DM Sans',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --display:'Sora',var(--font);
  --side:258px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--text);line-height:1.6;background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--display);line-height:1.16;color:var(--navy);letter-spacing:-.02em}
.wrap{max-width:1180px;margin:0 auto;padding:0 36px}
.sec{padding:64px 0}
.eyebrow{display:inline-block;font-family:var(--display);font-weight:700;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2);margin-bottom:12px}
.sec-titre{font-size:2.1rem;font-weight:800}
.sec-head{margin-bottom:36px}
.sec-head.center{text-align:center}
.sec-head p{color:var(--muted);max-width:600px;margin-top:8px}
.sec-head.center p{margin:8px auto 0}

/* ===== Animations ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes zoomIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1)}
.reveal.visible{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ===== Boutons ===== */
.btn{position:relative;display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--navy);padding:13px 24px;border-radius:11px;font-family:var(--display);font-weight:700;font-size:.94rem;transition:transform .2s,box-shadow .25s,background .25s;border:none;cursor:pointer;white-space:nowrap}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(47,127,240,.4);background:var(--gold-2)}
.btn.dark{background:var(--navy);color:#fff}.btn.dark:hover{background:#0a1d33}
.btn.ghost{background:transparent;color:var(--navy);border:2px solid var(--line)}.btn.ghost:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn.lg{padding:16px 30px;font-size:1rem}

/* ===== SIDEBAR ===== */
.app{display:flex;min-height:100vh}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--side);background:linear-gradient(165deg,#13294a 0%,#0b1a2e 100%);color:#fff;display:flex;flex-direction:column;padding:26px 22px;z-index:80;overflow-y:auto;transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.sb-brand{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.sb-badge{height:44px;width:auto;display:block;flex-shrink:0}
.sb-name{font-family:var(--display);font-weight:800;font-size:1.35rem;color:#fff;line-height:1}
.sb-name b{color:var(--gold)}
.sb-name small{display:block;font-size:.56rem;font-weight:700;letter-spacing:2px;color:rgba(255,255,255,.55);margin-top:4px}
.sb-nav{display:flex;flex-direction:column;gap:3px;margin-top:34px}
.sb-nav a{color:rgba(255,255,255,.82);font-family:var(--display);font-weight:600;font-size:.97rem;padding:12px 14px;border-radius:11px;display:flex;align-items:center;gap:12px;transition:background .2s,color .2s}
.sb-nav a svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.7;opacity:.85}
.sb-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.sb-nav a.actif{background:var(--gold);color:var(--navy)}
.sb-foot{margin-top:auto;padding-top:22px}
.sb-call{display:block;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:13px;padding:14px 16px;margin-bottom:14px;transition:background .2s}
.sb-call:hover{background:rgba(255,255,255,.12)}
.sb-call .lab{font-size:.64rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.5)}
.sb-call .num{font-family:var(--display);font-weight:800;font-size:1.32rem;color:var(--gold);letter-spacing:.5px}
.sb-status{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:700;color:#bbf7d0;margin-bottom:14px}
.sb-status .pin{width:8px;height:8px;border-radius:50%;background:#2ec26a;box-shadow:0 0 0 3px rgba(46,194,106,.25)}
.sb-status.ferme{color:rgba(255,255,255,.55)}.sb-status.ferme .pin{background:#7d8ba0;box-shadow:0 0 0 3px rgba(125,139,160,.25)}
.sb-rating{display:flex;align-items:center;gap:8px;font-size:.84rem;color:rgba(255,255,255,.8);margin-bottom:8px}
.sb-rating b{color:#fff;font-family:var(--display)}
.sb-rating .st{color:#f5b50a;letter-spacing:1px}
.sb-addr{font-size:.78rem;color:rgba(255,255,255,.55);line-height:1.5}
.sb-addr a{color:rgba(255,255,255,.7)}

/* ===== Contenu ===== */
.content{margin-left:var(--side);width:calc(100% - var(--side));min-height:100vh;display:flex;flex-direction:column}
main{flex:1}

/* ===== Topbar mobile ===== */
.topbar{display:none;position:sticky;top:0;z-index:70;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);height:64px;align-items:center;justify-content:space-between;padding:0 18px}
.topbar .tb-brand{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:800;color:var(--navy)}
.topbar .tb-brand .b{width:34px;height:34px;border-radius:9px;background:var(--navy);object-fit:contain;padding:5px;box-sizing:border-box}
.topbar .tb-actions{display:flex;align-items:center;gap:6px}
.topbar .ic-btn{width:42px;height:42px;border-radius:10px;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--navy);cursor:pointer}
.topbar .ic-btn svg{width:20px;height:20px;fill:var(--navy)}
.backdrop{display:none;position:fixed;inset:0;background:rgba(8,18,30,.5);z-index:75}
.backdrop.show{display:block}

/* ===== HERO scindé ===== */
.hero{display:grid;grid-template-columns:1.04fr .96fr;gap:46px;align-items:center;padding:64px 0 56px}
.hero .eyebrow{color:var(--gold-2)}
.hero h1{font-size:3.1rem;font-weight:800;line-height:1.07;margin-bottom:18px}
.hero h1 .hl{color:var(--gold-2);position:relative;white-space:nowrap}
.hero h1 .hl::after{content:'';position:absolute;left:0;right:0;bottom:.05em;height:.28em;background:var(--gold-soft);z-index:-1;border-radius:3px}
.hero p.lead{font-size:1.16rem;color:var(--muted);max-width:520px;margin-bottom:26px}
.hero .htrust{display:flex;gap:26px;flex-wrap:wrap;margin-top:8px}
.hero .htrust .t b{font-family:var(--display);font-size:1.5rem;font-weight:800;color:var(--navy);display:block;line-height:1}
.hero .htrust .t span{font-size:.82rem;color:var(--muted)}
.hero .htrust .t b.gold{color:var(--gold-2)}
/* visuel hero = collage */
.hero-visual{position:relative}
.hero-visual .big{border-radius:22px;overflow:hidden;box-shadow:var(--ombre-lg);aspect-ratio:4/3;background:var(--soft-2)}
.hero-visual .big img{width:100%;height:100%;object-fit:cover}
.hero-visual .chip{position:absolute;left:-18px;bottom:24px;background:#fff;border-radius:16px;box-shadow:var(--ombre-lg);padding:14px 18px;display:flex;align-items:center;gap:12px}
.hero-visual .chip .ic{width:42px;height:42px;border-radius:11px;background:var(--gold-soft);display:flex;align-items:center;justify-content:center}
.hero-visual .chip .ic svg{width:22px;height:22px;stroke:var(--gold-2);fill:none;stroke-width:1.8}
.hero-visual .chip b{font-family:var(--display);color:var(--navy);font-size:.95rem;display:block}
.hero-visual .chip span{font-size:.78rem;color:var(--muted)}

/* ===== Moteur de recherche ===== */
.search{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--ombre-md);padding:18px;margin-top:30px;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:12px;align-items:end}
.search .f{display:flex;flex-direction:column;gap:6px}
.search label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.search select{padding:12px 12px;border:1px solid var(--line);border-radius:10px;background:var(--soft);font-family:var(--display);font-weight:600;color:var(--navy);font-size:.92rem}
.search .btn{height:46px;justify-content:center}
@media(max-width:560px){.search{grid-template-columns:1fr 1fr}.search .btn{grid-column:1/-1}}

/* ===== Bande chiffres ===== */
.stripe{background:var(--navy);color:#fff}
.stripe .row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:30px 0}
.stripe .it{text-align:center}
.stripe .it b{font-family:var(--display);font-size:2rem;font-weight:800;display:block;line-height:1}
.stripe .it b.gold{color:var(--gold)}
.stripe .it span{font-size:.85rem;color:rgba(255,255,255,.65)}

/* ===== Marques ===== */
.marques{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:center;align-items:center}
.marques span{font-family:var(--display);font-weight:700;color:var(--muted);opacity:.75;font-size:.95rem;letter-spacing:.03em}

/* ===== Lignes véhicule (place de marché) ===== */
.vh-list{display:flex;flex-direction:column;gap:16px}
.vh-row{display:grid;grid-template-columns:286px 1fr;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform var(--trans),box-shadow var(--trans);color:inherit}
.vh-row:hover{transform:translateY(-3px);box-shadow:var(--ombre-lg)}
.vh-row .ph{position:relative;overflow:hidden;background:var(--soft-2);min-height:200px}
.vh-row .ph img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.vh-row:hover .ph img{transform:scale(1.07)}
.vh-row .badges{position:absolute;top:12px;left:12px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;z-index:2}
.tag{font-family:var(--display);font-size:.68rem;font-weight:700;padding:5px 11px;border-radius:7px;text-transform:uppercase;letter-spacing:.04em;color:#fff}
.tag.rouge{background:var(--gold);color:var(--navy)}.tag.bleu{background:var(--navy)}.tag.or{background:var(--navy)}
.vh-row .cnt{position:absolute;bottom:10px;right:10px;background:rgba(15,39,66,.78);color:#fff;font-size:.7rem;font-weight:600;padding:4px 9px;border-radius:7px;z-index:2}
.vh-row .info{padding:22px 24px;display:flex;flex-direction:column}
.vh-row .info h3{font-family:var(--display);font-size:1.18rem;font-weight:700;color:var(--navy);margin-bottom:10px}
.vh-row .specs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.vh-row .specs span{background:var(--soft);border:1px solid var(--line);color:var(--muted);font-size:.78rem;font-weight:600;padding:5px 11px;border-radius:8px}
.vh-row .bot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.vh-row .prix{font-family:var(--display);font-size:1.7rem;font-weight:800;color:var(--gold-2);letter-spacing:-.02em}
.vh-row .voir{font-family:var(--display);font-weight:700;font-size:.9rem;color:var(--navy);display:inline-flex;gap:6px;align-items:center}
.vh-row:hover .voir{color:var(--gold-2)}
@media(max-width:620px){.vh-row{grid-template-columns:1fr}.vh-row .ph{min-height:210px;aspect-ratio:16/10}}

/* ===== Catalogue : rail + résultats ===== */
.cat{display:grid;grid-template-columns:262px 1fr;gap:32px;align-items:start}
.rail{position:sticky;top:20px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.rail h3{font-size:1.05rem;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.rail .f{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.rail label{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.rail select{padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--soft);font-family:var(--display);font-weight:600;color:var(--navy);font-size:.9rem;cursor:pointer}
.rail select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.rail .count{font-size:.86rem;color:var(--muted);border-top:1px solid var(--line);padding-top:14px;margin-top:2px}
.rail .count strong{color:var(--navy);font-family:var(--display);font-size:1.1rem}
.empty{text-align:center;color:var(--muted);padding:50px 0}
@media(max-width:860px){.cat{grid-template-columns:1fr}.rail{position:static}.rail .fbox{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}}

/* ===== Services en liste alternée ===== */
.svc{display:flex;flex-direction:column}
.svc .it{display:grid;grid-template-columns:96px 1fr auto;gap:26px;align-items:center;padding:30px 0;border-top:1px solid var(--line)}
.svc .it:last-child{border-bottom:1px solid var(--line)}
.svc .it .n{font-family:var(--display);font-weight:800;font-size:2.4rem;color:var(--soft-2);line-height:1}
.svc .it .ic{width:56px;height:56px;border-radius:14px;background:var(--gold-soft);display:flex;align-items:center;justify-content:center}
.svc .it .ic svg{width:27px;height:27px;stroke:var(--gold-2);fill:none;stroke-width:1.7}
.svc .it h3{font-size:1.25rem;margin-bottom:5px}
.svc .it p{color:var(--muted);max-width:560px}
.svc .it .go{color:var(--gold-2);font-weight:700;font-family:var(--display);white-space:nowrap}
@media(max-width:720px){.svc .it{grid-template-columns:56px 1fr;gap:18px}.svc .it .n{display:none}.svc .it .go{display:none}}

/* ===== Atouts (bandeau) ===== */
.atouts{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.atout{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;transition:transform var(--trans),box-shadow var(--trans)}
.atout:hover{transform:translateY(-4px);box-shadow:var(--ombre-md)}
.atout .ic{flex:none;width:44px;height:44px;border-radius:11px;background:var(--gold-soft);display:flex;align-items:center;justify-content:center}
.atout .ic svg{width:23px;height:23px;stroke:var(--gold-2);fill:none;stroke-width:1.7}
.atout h4{font-family:var(--display);font-size:.98rem;margin-bottom:3px}
.atout p{color:var(--muted);font-size:.84rem}
@media(max-width:820px){.atouts{grid-template-columns:repeat(2,1fr)}.stripe .row{grid-template-columns:repeat(2,1fr);gap:18px}}

/* ===== CTA ===== */
.cta{background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#fff;border-radius:22px;padding:46px;text-align:center;position:relative;overflow:hidden}
.cta::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(47,127,240,.28),transparent 45%)}
.cta h2{color:#fff;font-size:1.9rem;margin-bottom:10px;position:relative}
.cta p{color:rgba(255,255,255,.85);position:relative;margin-bottom:24px}
.cta .btn{position:relative}

/* ===== Avis ===== */
.note-google{display:inline-flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:40px;padding:9px 20px;box-shadow:var(--ombre)}
.note-google .note{font-family:var(--display);font-weight:800;font-size:1.4rem;color:var(--gold-2)}
.note-google .st{color:#f5b50a;letter-spacing:2px}
.note-google small{color:var(--muted);font-weight:600}
.avis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.avis-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:transform var(--trans),box-shadow var(--trans)}
.avis-card:hover{transform:translateY(-5px);box-shadow:var(--ombre-lg)}
.avis-card .st{color:#f5b50a;letter-spacing:2px;margin-bottom:12px;display:block}
.avis-card p{color:#39495d;font-style:italic;margin-bottom:16px;line-height:1.7}
.avis-card .au{display:flex;align-items:center;gap:11px}
.avis-card .av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--navy),var(--navy-3));color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800}
.avis-card .nom{font-family:var(--display);font-weight:700;color:var(--navy);font-size:.92rem}
.avis-card .meta{color:var(--muted);font-size:.78rem}
.avis-src{text-align:center;margin-top:26px}
.avis-src a{color:var(--gold-2);font-weight:700;font-family:var(--display)}
@media(max-width:820px){.avis-grid{grid-template-columns:1fr}}

/* ===== Simulateur ===== */
.simu{display:grid;grid-template-columns:1.1fr .9fr;background:var(--navy);border-radius:20px;overflow:hidden;box-shadow:var(--ombre-lg)}
.simu-form{padding:34px 32px;color:#fff}
.simu-form h3{color:#fff;font-size:1.3rem;margin-bottom:5px}
.simu-form .lead{color:rgba(255,255,255,.7);font-size:.9rem;margin-bottom:22px}
.simu-champ{margin-bottom:20px}
.simu-champ label{display:flex;justify-content:space-between;font-family:var(--display);font-weight:600;font-size:.88rem;margin-bottom:9px}
.simu-champ label b{color:var(--gold)}
.simu-champ input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;background:rgba(255,255,255,.18);outline:none}
.simu-champ input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid #fff}
.simu-champ input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid #fff}
.simu-res{background:linear-gradient(150deg,var(--gold),var(--gold-2));padding:34px 32px;color:var(--navy);display:flex;flex-direction:column;justify-content:center;text-align:center}
.simu-res .mensu{font-family:var(--display);font-size:3.1rem;font-weight:800;line-height:1}
.simu-res .mensu span{font-size:1.1rem;font-weight:700}
.simu-res .sub{opacity:.85;margin:8px 0 20px;font-size:.9rem;font-weight:600}
.simu-res .detail{display:flex;justify-content:space-between;border-top:1px solid rgba(15,39,66,.25);padding:10px 0;font-size:.88rem;font-weight:600}
.simu-res .btn{margin-top:18px;background:var(--navy);color:#fff}.simu-res .btn:hover{background:#0a1d33}
.simu-note{text-align:center;color:var(--muted);font-size:.8rem;margin-top:14px}
@media(max-width:760px){.simu{grid-template-columns:1fr}}

/* ===== Bandeau de page ===== */
.pageband{background:var(--soft);border-bottom:1px solid var(--line);padding:42px 0}
.pageband h1{font-size:2.2rem;font-weight:800}
.pageband p{color:var(--muted);margin-top:6px}
.pageband .fil{font-family:var(--display);font-size:.84rem;color:var(--muted);margin-top:12px;font-weight:600}
.pageband .fil a:hover{color:var(--gold-2)}

/* ===== Détail véhicule ===== */
.detail-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:40px;align-items:start;margin-top:8px}
.galerie .principale{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--soft-2);box-shadow:var(--ombre-md);cursor:zoom-in}
.galerie .principale img{width:100%;height:100%;object-fit:cover;transition:opacity .35s}
.galerie .principale .loupe{position:absolute;bottom:14px;right:14px;background:rgba(15,39,66,.65);color:#fff;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.galerie .nav-photo{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,.94);color:var(--navy);font-size:1.3rem;cursor:pointer;box-shadow:var(--ombre-md);z-index:2}
.galerie .prev{left:12px}.galerie .next{right:12px}
.galerie .vignettes{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}
.galerie .vignettes img{aspect-ratio:4/3;object-fit:cover;border-radius:8px;cursor:pointer;opacity:.55;border:2px solid transparent;transition:opacity .2s}
.galerie .vignettes img.active,.galerie .vignettes img:hover{opacity:1;border-color:var(--gold)}
.detail-info{position:sticky;top:20px}
.detail-info h1{font-size:1.7rem;font-weight:800;margin-bottom:8px}
.detail-info .sous{color:var(--muted);margin-bottom:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.detail-info .sous .dot{width:4px;height:4px;border-radius:50%;background:var(--muted)}
.detail-prix-bloc{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:18px}
.detail-prix{font-family:var(--display);font-size:2.3rem;font-weight:800;color:var(--gold-2)}
.detail-note{background:var(--gold-soft);color:var(--gold-2);font-family:var(--display);font-weight:700;font-size:.82rem;padding:6px 13px;border-radius:30px}
.specs-cles{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-bottom:22px}
.spec-cle{display:flex;align-items:center;gap:11px;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.spec-cle .i svg{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:1.7}
.spec-cle .v{font-family:var(--display);font-weight:700;color:var(--navy);font-size:.96rem;line-height:1.2}
.spec-cle .l{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.detail-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.detail-actions .btn{justify-content:center}
.encart{background:var(--navy);color:#fff;border-radius:var(--radius);padding:22px;position:relative;overflow:hidden}
.encart::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 85% 10%,rgba(47,127,240,.25),transparent 45%)}
.encart h3{color:#fff;font-size:1.1rem;margin-bottom:5px;position:relative}
.encart p{color:rgba(255,255,255,.82);font-size:.88rem;margin-bottom:5px;position:relative}
.encart .coord{margin-top:12px;display:grid;gap:7px;font-size:.86rem;position:relative}
.bloc-detail{margin-top:40px}
.bloc-detail h2{font-size:1.4rem;font-weight:800;margin-bottom:18px;padding-bottom:10px;border-bottom:2px solid var(--soft-2)}
.plus-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.plus-item{display:flex;align-items:center;gap:10px;background:var(--gold-soft);border-radius:11px;padding:13px 15px;font-weight:600;font-size:.9rem;color:var(--navy)}
.plus-item .c{color:var(--gold-2);font-weight:800}
.fiche-table{display:grid;grid-template-columns:repeat(2,1fr);gap:0 40px}
.fiche-row{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.fiche-row .k{color:var(--muted);font-size:.9rem}.fiche-row .v{font-family:var(--display);font-weight:700;color:var(--navy);font-size:.9rem;text-align:right}
.equip-chips{display:flex;flex-wrap:wrap;gap:9px}
.equip-chips .chip{background:var(--soft);border:1px solid var(--line);border-radius:30px;padding:8px 15px;font-size:.85rem;font-weight:600;color:var(--text)}
.equip-chips .chip::before{content:'✓ ';color:var(--gold-2);font-weight:800}
.acompte-vehicule{display:flex;align-items:center;gap:20px;background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;flex-wrap:wrap}
.acompte-vehicule img{width:110px;height:80px;object-fit:cover;border-radius:11px;flex-shrink:0}
.acompte-vehicule h2{font-size:1.15rem;margin-bottom:3px}
.acompte-vehicule p{color:var(--muted);font-size:.86rem;margin-bottom:6px}
.acompte-vehicule .detail-prix{font-family:var(--display);font-weight:800;color:var(--navy);font-size:1.2rem}
.acompte-vehicule > div{flex:1;min-width:180px}
.rib-card{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:6px 22px}
.rib-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.rib-row:last-child{border-bottom:none}
.rib-row .k{color:var(--muted);font-size:.88rem;font-weight:600}
.rib-row .v-wrap{display:flex;align-items:center;gap:12px}
.rib-row .v{font-family:var(--display);font-weight:700;color:var(--navy);font-size:.95rem;letter-spacing:.02em}
.copy-btn{background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:.78rem;font-weight:700;color:var(--navy);cursor:pointer;transition:background .15s,color .15s}
.copy-btn:hover{background:var(--navy);color:#fff}
.copy-btn.copied{background:var(--gold-2);color:#fff;border-color:var(--gold-2)}
.acompte-warn{margin-top:24px}
.desc-txt{color:#39495d;line-height:1.85;white-space:pre-line}
@media(max-width:880px){.detail-grid{grid-template-columns:1fr}.detail-info{position:static}}

/* ===== Lightbox ===== */
.lightbox{position:fixed;inset:0;background:rgba(8,18,30,.95);z-index:200;display:none;align-items:center;justify-content:center;flex-direction:column}
.lightbox.open{display:flex;animation:fadeIn .3s}
.lightbox img{max-width:92vw;max-height:80vh;border-radius:10px;animation:zoomIn .3s}
.lightbox .lb-close{position:absolute;top:22px;right:28px;color:#fff;font-size:2.3rem;cursor:pointer}
.lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.14);border:none;color:#fff;width:52px;height:52px;border-radius:50%;font-size:1.7rem;cursor:pointer}
.lightbox .lb-prev{left:24px}.lightbox .lb-next{right:24px}
.lightbox .lb-count{color:#fff;margin-top:16px;font-family:var(--display);font-size:.9rem;opacity:.8}

/* ===== Contact ===== */
.infos-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.bloc-info{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:16px}
.bloc-info h3{font-size:1.05rem;margin-bottom:8px}
.bloc-info p{color:var(--muted)}
form .champ{margin-bottom:15px}
form label{display:block;font-family:var(--display);font-weight:600;font-size:.88rem;margin-bottom:6px}
form input,form select,form textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:11px;font-family:inherit;font-size:.95rem;background:#fff}
form input:focus,form select:focus,form textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
form textarea{min-height:120px;resize:vertical}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.84rem;color:var(--muted)}
.consent input{width:auto;margin-top:3px}.consent a{color:var(--gold-2);font-weight:600}
.map-wrap{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);height:330px}
.map-wrap iframe{width:100%;height:100%;border:0}
@media(max-width:820px){.infos-grid{grid-template-columns:1fr}}

/* ===== À propos ===== */
.apropos-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:46px;align-items:center}
.apropos-grid img{border-radius:var(--radius);box-shadow:var(--ombre-lg)}
.apropos-grid p{color:var(--muted);margin-bottom:14px}
.liste-check{list-style:none;margin-top:6px}
.liste-check li{padding-left:32px;position:relative;margin-bottom:11px;font-weight:500}
.liste-check li::before{content:'✔';position:absolute;left:0;color:var(--navy);background:var(--gold);width:21px;height:21px;border-radius:50%;font-size:.7rem;display:flex;align-items:center;justify-content:center}
@media(max-width:820px){.apropos-grid{grid-template-columns:1fr}}

/* ===== Légal ===== */
.legal{max-width:780px}
.legal h2{font-size:1.3rem;margin:30px 0 10px}
.legal p,.legal li{color:#39495d;margin-bottom:9px;line-height:1.75}
.legal ul{padding-left:20px;margin-bottom:12px}

/* ===== Pied de page ===== */
.foot{background:#0a1726;color:#9fb1c6;padding:34px 0;margin-top:10px}
.foot .row{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;font-size:.88rem}
.foot a:hover{color:var(--gold)}
.foot .lk{display:flex;gap:18px;flex-wrap:wrap}

/* ===== Icônes / accès ===== */
svg.ico-svg{stroke:var(--gold-2);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.skip-link{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--navy);padding:12px 18px;border-radius:0 0 10px 0;z-index:200;font-family:var(--display);font-weight:700}
.skip-link:focus{left:0}
a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:6px}
.fab-call{position:fixed;right:18px;bottom:18px;z-index:90;background:var(--gold);color:var(--navy);width:58px;height:58px;border-radius:50%;display:none;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(47,127,240,.5);animation:floaty 2.4s ease-in-out infinite}
.fab-call svg{width:25px;height:25px;fill:var(--navy)}
@media(max-width:1000px){.fab-call{display:flex}}

/* ===== Responsive : bascule sidebar -> drawer ===== */
@media(max-width:1000px){
  .sidebar{transform:translateX(-100%);width:280px;box-shadow:var(--ombre-lg)}
  .sidebar.open{transform:none}
  .content{margin-left:0;width:100%}
  .topbar{display:flex}
  .hero{grid-template-columns:1fr;padding:36px 0}
  .hero-visual{order:-1}
}
@media(max-width:760px){
  .wrap{padding:0 20px}
  .hero h1{font-size:2.25rem}
  .sec{padding:46px 0}
  .sec-titre{font-size:1.7rem}
}

/* ===================================================================
   COUCHE DÉCORATIVE PREMIUM
   =================================================================== */
.app{position:relative}

/* Sidebar : halo + accent */
.sidebar{position:fixed;overflow:hidden}
.sidebar > *{position:relative;z-index:1}
.sidebar::before{content:'';position:absolute;top:-70px;left:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.22),transparent 70%);z-index:0;pointer-events:none}
.sidebar::after{content:'';position:absolute;bottom:-90px;right:-90px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(39,83,127,.35),transparent 70%);z-index:0;pointer-events:none}

/* Boutons : reflet */
.btn{overflow:hidden}
.btn::after{content:'';position:absolute;top:0;left:-60%;width:42%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);pointer-events:none}
.btn:hover::after{animation:sweep .85s}
@keyframes sweep{0%{left:-60%}60%,100%{left:135%}}

/* Hero : orbes + cadre or */
.hero{position:relative;overflow:visible}
.hero::before{content:'';position:absolute;width:440px;height:440px;right:-140px;top:-150px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.16),transparent 70%);z-index:-1;pointer-events:none}
.hero::after{content:'';position:absolute;width:320px;height:320px;left:-180px;bottom:-130px;border-radius:50%;background:radial-gradient(circle,rgba(27,60,99,.12),transparent 70%);z-index:-1;pointer-events:none}
.hero h1 .hl::after{height:.32em;background:linear-gradient(90deg,var(--gold-soft),rgba(47,127,240,.35))}
.hero-visual{position:relative}
.hero-visual::before{content:'';position:absolute;right:-16px;top:-18px;width:130px;height:130px;border:3px solid var(--gold);border-radius:20px;z-index:0;opacity:.85}
.hero-visual::after{content:'';position:absolute;left:-22px;bottom:-22px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.25),transparent 70%);z-index:0}
.hero-visual .big,.hero-visual .chip{position:relative;z-index:2}
.hero-visual .chip.top{left:auto;right:18px;bottom:auto;top:-22px}

/* Motif points (réutilisable) */
.dots{position:relative}
.dots::before{content:'';position:absolute;inset:0;background-image:radial-gradient(var(--soft-2) 1.4px,transparent 1.5px);background-size:20px 20px;opacity:.6;z-index:0;pointer-events:none}
.dots > *{position:relative;z-index:1}

/* Titres : accent doré */
.sec-head .sec-titre{position:relative;display:inline-block}
.sec-head .sec-titre::after{content:'';display:block;width:56px;height:4px;background:linear-gradient(90deg,var(--gold),var(--gold-2));border-radius:3px;margin-top:13px}
.sec-head.center .sec-titre::after{margin-left:auto;margin-right:auto}

/* Marquee marques */
.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee .track{display:flex;gap:52px;width:max-content;animation:scrollx 30s linear infinite;align-items:center}
.marquee:hover .track{animation-play-state:paused}
.marquee .track span{font-family:var(--display);font-weight:700;color:var(--muted);opacity:.7;font-size:1.05rem;letter-spacing:.04em;white-space:nowrap}
@keyframes scrollx{to{transform:translateX(-50%)}}

/* Atouts : bulle décorative */
.atout{position:relative;overflow:hidden}
.atout::after{content:'';position:absolute;right:-26px;top:-26px;width:74px;height:74px;border-radius:50%;background:var(--gold-soft);opacity:.55;transition:transform .45s;z-index:0}
.atout:hover::after{transform:scale(1.7)}
.atout > *{position:relative;z-index:1}
.atout .ic{box-shadow:0 6px 16px rgba(47,127,240,.18)}

/* Lignes véhicule : accent + overlay */
.vh-row{position:relative}
.vh-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(var(--gold),var(--gold-2));transition:width .3s;z-index:4}
.vh-row:hover::before{width:5px}
.vh-row .ph::after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 55%,rgba(15,39,66,.18));z-index:1;pointer-events:none}
.vh-row .prix{position:relative}

/* Bande chiffres : motif + séparateurs */
.stripe{position:relative;overflow:hidden}
.stripe::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1.2px,transparent 1.3px);background-size:22px 22px;opacity:.6;pointer-events:none}
.stripe .row{position:relative}
.stripe .it{position:relative}
.stripe .it + .it::before{content:'';position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:1px;height:42px;background:rgba(255,255,255,.16)}
.stripe .it b.gold{text-shadow:0 0 22px rgba(47,127,240,.5)}

/* Avis : guillemet décoratif */
.avis-card{position:relative;overflow:hidden}
.avis-card::before{content:'\201C';position:absolute;top:-14px;right:16px;font-family:Georgia,'Times New Roman',serif;font-size:5.5rem;line-height:1;color:var(--gold-soft);z-index:0}
.avis-card > *{position:relative;z-index:1}
.note-google{position:relative}

/* CTA : anneaux + motif */
.cta{position:relative}
.cta::after{content:'';position:absolute;right:-50px;bottom:-50px;width:220px;height:220px;border:2px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}
.cta .deco-ring{position:absolute;left:-30px;top:-30px;width:120px;height:120px;border:2px solid rgba(47,127,240,.3);border-radius:50%;pointer-events:none}

/* Pageband : halo */
.pageband{position:relative;overflow:hidden}
.pageband::before{content:'';position:absolute;right:-70px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.16),transparent 70%);pointer-events:none}
.pageband::after{content:'';position:absolute;left:0;bottom:0;width:120px;height:4px;background:linear-gradient(90deg,var(--gold),transparent)}
.pageband .wrap{position:relative}

/* Simulateur : halo */
.simu{position:relative;overflow:hidden}
.simu::before{content:'';position:absolute;left:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.18),transparent 70%);pointer-events:none}
.simu > *{position:relative}

/* ===== Page Reprise ===== */
.reprise-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:0;border-radius:22px;overflow:hidden;box-shadow:var(--ombre-lg);border:1px solid var(--line)}
.reprise-side{background:linear-gradient(165deg,#16365c,#0c2038);color:#fff;padding:40px 34px;position:relative;overflow:hidden}
.reprise-side::before{content:'';position:absolute;right:-60px;bottom:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,240,.25),transparent 70%)}
.reprise-side > *{position:relative;z-index:1}
.reprise-side h2{color:#fff;font-size:1.6rem;margin-bottom:8px}
.reprise-side .lead{color:rgba(255,255,255,.8);margin-bottom:26px}
.rstep{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.rstep .num{flex:none;width:38px;height:38px;border-radius:11px;background:var(--gold);color:var(--navy);font-family:var(--display);font-weight:800;display:flex;align-items:center;justify-content:center}
.rstep h4{color:#fff;font-size:1.02rem;margin-bottom:2px}
.rstep p{color:rgba(255,255,255,.72);font-size:.9rem}
.reprise-side .rnote{margin-top:26px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);display:flex;align-items:center;gap:10px;font-size:.9rem}
.reprise-side .rnote .st{color:#f5b50a;letter-spacing:1px}
.reprise-form{background:#fff;padding:38px 34px}
.reprise-form h3{font-size:1.3rem;margin-bottom:4px}
.reprise-form .sub{color:var(--muted);margin-bottom:22px;font-size:.92rem}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fgrid .full{grid-column:1/-1}
@media(max-width:860px){.reprise-grid{grid-template-columns:1fr}.fgrid{grid-template-columns:1fr}}

/* ===================================================================
   CORRECTIONS — Charte BLEU / BLANC / NOIR + clarté + mise en page
   (bloc final : surcharge les valeurs précédentes)
   =================================================================== */
:root{
  --gold:#2f7ff0;       /* accent : bleu vif (remplace le doré) */
  --gold-2:#1857c7;     /* bleu foncé, lisible sur blanc (AA) */
  --gold-soft:#e9f1fe;  /* bleu très clair */
  --text:#0f141b;       /* quasi-noir */
  --muted:#586575;      /* gris plus contrasté */
}
body{color:var(--text)}
/* Texte BLANC sur les fonds d'accent bleu (contraste) */
.btn{color:#fff}
.btn.ghost{color:var(--navy)}
.btn.ghost:hover{color:#fff}
.sb-nav a.actif{color:#fff}
.tag.rouge{color:#fff}
.fab-call{color:#fff}.fab-call svg{fill:#fff}
.rstep .num{color:#fff}
.simu-res{color:#fff}
.simu-res .detail{border-top-color:rgba(255,255,255,.32)}
.simu-res .sub{opacity:.92}

/* HERO : on retire le cadre décoratif qui se chevauchait ; halo plus sobre */
.hero-visual::before{display:none}
.hero::before{background:radial-gradient(circle,rgba(47,127,240,.14),transparent 70%)}
.hero::after{background:radial-gradient(circle,rgba(27,60,99,.10),transparent 70%)}
.hero-visual::after{background:radial-gradient(circle,rgba(47,127,240,.22),transparent 70%)}

/* Badge horaires sur fond clair (page Contact) */
.statut{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:6px 13px;font-family:var(--display);font-weight:700;font-size:.82rem;color:#15803d}
.statut .pin{width:8px;height:8px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.18)}
.statut.ferme{color:var(--muted)}
.statut.ferme .pin{background:#9ca3af;box-shadow:0 0 0 3px rgba(156,163,175,.2)}

/* TEXTE / lisibilité */
.sb-name small{font-size:.6rem;letter-spacing:1.6px;color:rgba(255,255,255,.66)}
.vh-row .specs span{color:#42506280}
.vh-row .specs span{color:#41506a}
.hero p.lead{color:#41506a}
.sec-head p,.atout p,.svc .it p{color:#48566c}

/* DÉTAIL véhicule : blocs déplacés en pleine largeur sous la galerie */
.detail-blocs{margin-top:46px}
.detail-blocs .fiche-table{grid-template-columns:repeat(2,1fr)}

/* Palier responsive intermédiaire (1000–1150 px) */
@media(max-width:1150px){
  .hero{grid-template-columns:1fr;gap:30px;padding:40px 0}
  .hero-visual{order:-1;max-width:560px}
  .hero h1{font-size:2.7rem}
  .search{grid-template-columns:1fr 1fr}
  .search .btn{grid-column:1/-1}
  .simu{grid-template-columns:1fr}
}

/* ===================================================================
   MOBILE — bloc unique et autoritaire (remplace les anciennes rustines)
   =================================================================== */
html,body{overflow-x:hidden;max-width:100%}
*{min-width:0}

/* --- Bascule en mode mobile (drawer) --- */
@media(max-width:1000px){
  .app{display:block}
  .content{margin-left:0!important;width:100%!important}
  /* Neutralise TOUTES les décorations absolues qui débordent/chevauchent */
  .hero::before,.hero::after,.hero-visual::before,.hero-visual::after,
  .pageband::before,.pageband::after,.simu::before,.reprise-side::before,
  .cta::after,.cta .deco-ring,.atout::after,.avis-card::before,
  .stripe::before,.dots::before{display:none!important}
  .dots>*{position:static}
}

/* --- Téléphone --- */
@media(max-width:760px){
  .wrap{padding:0 16px!important;max-width:100%}
  section,.sec{padding:36px 0}
  .sec-head{margin-bottom:24px;text-align:center}
  .sec-head p{margin-left:auto;margin-right:auto}
  .sec-head .eyebrow{display:block;margin-bottom:8px}
  .sec-head .sec-titre{display:block}
  .sec-head .sec-titre::after{margin-left:auto;margin-right:auto}
  .sec-titre{font-size:1.45rem}
  .eyebrow{font-size:.7rem;letter-spacing:.16em}

  /* HERO : empilé, centré, titres qui reviennent à la ligne */
  .hero{display:block;text-align:center;padding:18px 0 4px}
  .hero-visual{margin:0 auto 18px;max-width:100%}
  .hero-visual .big{aspect-ratio:16/10}
  .hero-visual .chip{position:static;display:inline-flex;margin-top:12px}
  .hero h1{font-size:1.7rem;line-height:1.22}
  .hero h1 br{display:none}
  .hero h1 .hl{white-space:normal}
  .hero p.lead{font-size:1rem;margin:0 auto 20px}
  .hero .htrust{justify-content:center;gap:16px 26px}
  .hero .htrust .t b{font-size:1.3rem}

  /* RECHERCHE : une colonne pleine largeur */
  .search{grid-template-columns:1fr!important;padding:14px;margin-top:20px;gap:12px}
  .search .btn{width:100%;grid-column:auto}

  /* TOUT en une colonne */
  .atouts,.avis-grid,.plus-grid,.specs-cles,.fiche-table,.infos-grid,
  .apropos-grid,.fgrid,.detail-grid,.cat,.simu,.reprise-grid,.vh-row{grid-template-columns:1fr!important}
  .stripe .row{grid-template-columns:1fr 1fr!important;gap:22px 14px;padding:26px 0}
  .stripe .it + .it::before{display:none}

  /* Services : icône au-dessus, centré */
  .svc .it{grid-template-columns:1fr!important;text-align:center;justify-items:center;gap:10px;padding:24px 0}
  .svc .it .ic{margin:0 auto}
  .svc .it p{max-width:none}
  .svc .it .go{display:inline-flex}

  /* Véhicules : photo au-dessus */
  .vh-row .ph{aspect-ratio:16/10;min-height:0}
  .vh-row .info{padding:18px}
  .vh-row .prix{font-size:1.5rem}

  /* Sections colorées : ne collent plus aux bords */
  section.sec[style*="background"]{margin:0 8px;border-radius:16px!important}

  /* CTA / rail / galerie / pied */
  .cta{padding:30px 20px}.cta h2{font-size:1.45rem}
  .rail{position:static}.rail .fbox{grid-template-columns:1fr 1fr}
  .galerie .vignettes{grid-template-columns:repeat(4,1fr)}
  .foot .row{flex-direction:column;text-align:center;gap:12px}
  .foot .lk{justify-content:center;flex-wrap:wrap}
  .detail-info{position:static}
  .detail-actions .btn,.btn.lg{width:100%;justify-content:center}
  .marquee .track{gap:30px}.marquee .track span{font-size:.9rem}

  /* Champs 16px : évite le zoom auto iOS */
  input,select,textarea{font-size:16px}
}

@media(max-width:420px){
  .hero h1{font-size:1.5rem}
  .sec-titre{font-size:1.3rem}
  .stripe .row{grid-template-columns:1fr!important}
  .rail .fbox{grid-template-columns:1fr}
  .galerie .vignettes{grid-template-columns:repeat(3,1fr)}
  .cta h2{font-size:1.35rem}
}

/* ===================================================================
   Section « Nos services » — version compacte mobile (moins chargée)
   =================================================================== */
@media(max-width:760px){
  .svc{display:grid!important;grid-template-columns:1fr 1fr;gap:12px}
  .svc .it{display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;
    text-align:center;gap:10px;background:#fff;border:1px solid var(--line)!important;border-radius:14px;
    padding:22px 12px;box-shadow:var(--ombre)}
  .svc .it .ic{margin:0;width:50px;height:50px}
  .svc .it h3{font-size:1rem;margin:0;line-height:1.2}
  .svc .it > div{display:flex;flex-direction:column;align-items:center;gap:2px}
  .svc .it p{display:none}
  .svc .it .go{display:none}
  .svc .it:last-child{grid-column:1 / -1}
}

/* Tuiles services cliquables (lien sur toute la tuile) */
a.it{cursor:pointer;text-decoration:none;color:inherit}
.svc a.it:hover{border-color:var(--gold)!important;box-shadow:var(--ombre-md)}
.svc a.it:hover h3{color:var(--gold-2)}