
:root {
  --navy: #1D4E6B;
  --navy-2: #2C6A8E;
  --blue: #3A8EBC;
  --volt: #459EC2;
  --volt-dark: #3687AD;
  --volt-light: #9FD3E8;
  --yellow: #E4F3F7;
  --pale: #E4F3F7;
  --bg: #F3F9FB;
  --white: #FFFFFF;
  --text: #2B2B2B;
  --muted: #5F6B73;
  --border: #DCE8EE;
  --grad: linear-gradient(100deg, #4FAAD0 0%, #459EC2 55%, #3A8EBC 100%);
  --r: 10px;
  --rl: 18px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:72px; }
body { font-family:'Montserrat',system-ui,sans-serif; color:var(--text); background:var(--white); line-height:1.6; overflow-x:hidden; }
img, video, svg { display:block; max-width:100%; }
a { color:inherit; }

/* NAV */
nav {
  position:fixed; top:0; left:0; right:0; z-index:100; height:72px; padding:0 2rem;
  display:flex; align-items:center; justify-content:space-between;
  transition:background .3s, box-shadow .3s, border-color .3s;
  border-bottom:1px solid transparent;
}
nav.solid { background:rgba(255,255,255,.97); backdrop-filter:blur(12px); border-color:var(--border); box-shadow:0 4px 20px rgba(18,58,82,.06); }
.logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.logo-mark { width:38px; height:38px; border-radius:11px; background:var(--grad); display:grid; place-items:center; }
.logo-mark svg { width:20px; height:20px; }
.logo-txt { font-size:1.25rem; font-weight:800; letter-spacing:-.5px; color:var(--white); transition:color .3s; }
.logo-txt span { color:var(--volt); }
nav.solid .logo-txt { color:var(--navy); }
.nav-links { display:flex; align-items:center; gap:1.8rem; list-style:none; }
.nav-links a { text-decoration:none; color:rgba(255,255,255,.8); font-size:.86rem; font-weight:600; transition:color .2s; position:relative; }
.nav-links a:not(.nav-cta)::after { content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--volt); transform:scaleX(0); transition:transform .25s; transform-origin:left; }
.nav-links a:not(.nav-cta):hover::after { transform:scaleX(1); }
nav.solid .nav-links a { color:var(--muted); }
nav.solid .nav-links a:hover { color:var(--navy); }
.nav-cta { background:var(--grad); color:#fff !important; padding:.6rem 1.2rem; border-radius:var(--r); }
.nav-cta:hover { filter:brightness(1.07); }
.nav-toggle { display:none; background:none; border:none; cursor:pointer; color:#fff; }
nav.solid .nav-toggle { color:var(--navy); }
.nav-mobile { display:none; position:fixed; top:72px; left:0; right:0; background:var(--white); border-bottom:1px solid var(--border); padding:1rem 1.5rem 1.5rem; z-index:99; flex-direction:column; box-shadow:0 20px 40px rgba(18,58,82,.12); }
.nav-mobile.open { display:flex; }
.nav-mobile a { text-decoration:none; color:var(--text); font-weight:600; padding:.8rem 0; border-bottom:1px solid var(--border); }
.nav-mobile a:last-child { border:0; margin-top:.8rem; text-align:center; }

/* HERO */
.hero { min-height:100vh; position:relative; overflow:hidden; display:flex; align-items:center; padding:7rem 2rem 4rem; background:var(--navy); color:var(--white); }
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-fallback { position:absolute; inset:0; z-index:0; overflow:hidden;
  background:radial-gradient(ellipse at 75% 30%, rgba(44,106,142,.55), transparent 55%), radial-gradient(ellipse at 20% 90%, rgba(69,158,194,.25), transparent 50%), linear-gradient(160deg, #163E56, #1D4E6B 60%, #24607F); }
.streak { position:absolute; height:2px; border-radius:2px; background:linear-gradient(90deg, transparent, rgba(125,240,198,.9), transparent); animation:streak linear infinite; opacity:0; }
@keyframes streak { 0% { transform:translateX(110vw); opacity:0; } 10% { opacity:1; } 90% { opacity:1; } 100% { transform:translateX(-40vw); opacity:0; } }
.hero-overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(100deg, rgba(18,58,82,.92) 0%, rgba(18,58,82,.65) 55%, rgba(18,58,82,.35) 100%); }
.hero-inner { max-width:1180px; margin:0 auto; width:100%; display:grid; grid-template-columns:1.15fr .85fr; gap:4rem; align-items:center; position:relative; z-index:2; }
.pill { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:2px; padding:6px 14px; border-radius:20px; margin-bottom:1.5rem; text-transform:uppercase; }
.pill::before { content:''; width:7px; height:7px; background:var(--yellow); border-radius:50%; animation:blink 2s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }
.hero h1 { font-size:clamp(2.3rem, 5vw, 3.8rem); font-weight:800; line-height:1.08; letter-spacing:-1.5px; margin-bottom:1.4rem; }
.hero h1 em { color:#7CC6E4; font-style:normal; }
.hero-sub { font-size:1.08rem; color:rgba(255,255,255,.72); margin-bottom:2.2rem; max-width:540px; }
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:2.8rem; }
.btn { display:inline-flex; align-items:center; gap:8px; padding:.95rem 1.7rem; border-radius:var(--r); font-weight:700; font-size:.9rem; text-decoration:none; border:none; cursor:pointer; font-family:inherit; transition:background .2s, transform .15s, border-color .2s, color .2s; }
.btn:hover { transform:translateY(-2px); }
.btn-volt { background:var(--grad); color:#fff; box-shadow:0 8px 24px rgba(69,158,194,.35); }
.btn-volt:hover { filter:brightness(1.07); box-shadow:0 12px 30px rgba(69,158,194,.45); }
.btn-ghost { background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.3); }
.btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.06); }
.btn-navy { background:var(--navy); color:#fff; }
.btn-navy:hover { background:var(--navy-2); }
.btn-line { background:transparent; color:var(--navy); border:1.5px solid var(--border); }
.btn-line:hover { border-color:var(--navy); background:var(--pale); }
.proof { display:flex; gap:2.5rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,.12); flex-wrap:wrap; }
.proof .num { font-size:1.8rem; font-weight:800; letter-spacing:-1px; }
.proof .num em { color:var(--volt); font-style:normal; }
.proof .lbl { font-size:.7rem; color:rgba(255,255,255,.5); text-transform:uppercase; letter-spacing:1px; font-weight:600; }

.hero-card { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(14px); border-radius:var(--rl); padding:1.8rem; animation:float 6s ease-in-out infinite; }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
.card-head { display:flex; align-items:center; gap:10px; margin-bottom:1.2rem; padding-bottom:1rem; border-bottom:1px solid rgba(255,255,255,.1); }
.card-dot { width:8px; height:8px; background:var(--volt); border-radius:50%; animation:blink 2s infinite; }
.card-title { font-size:.75rem; font-weight:700; color:rgba(255,255,255,.55); text-transform:uppercase; letter-spacing:1.5px; }
.battery { margin-bottom:1.2rem; }
.battery-top { display:flex; justify-content:space-between; font-size:.8rem; color:rgba(255,255,255,.6); margin-bottom:.5rem; }
.battery-top b { color:#fff; }
.battery-bar { height:10px; background:rgba(255,255,255,.1); border-radius:10px; overflow:hidden; }
.battery-bar i { display:block; height:100%; width:0; background:linear-gradient(90deg, var(--volt-dark), var(--volt-light)); border-radius:10px; transition:width 2.2s cubic-bezier(.2,.8,.2,1); }
.row { display:flex; justify-content:space-between; align-items:center; padding:.62rem 0; border-bottom:1px solid rgba(255,255,255,.06); font-size:.84rem; }
.row:last-child { border:0; }
.row span:first-child { color:rgba(255,255,255,.55); }
.row b { font-weight:700; }
.tag-ok { background:rgba(69,158,194,.16); color:var(--volt-light); padding:2px 9px; border-radius:5px; font-size:.72rem; font-weight:700; }
.scroll-hint { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:2; width:26px; height:42px; border:2px solid rgba(255,255,255,.35); border-radius:14px; }
.scroll-hint::after { content:''; position:absolute; left:50%; top:8px; width:4px; height:8px; margin-left:-2px; background:#fff; border-radius:2px; animation:wheel 1.8s infinite; }
@keyframes wheel { 0% { opacity:1; transform:translateY(0); } 100% { opacity:0; transform:translateY(14px); } }

/* SECTIONS */
section { padding:6rem 2rem; }
.inner { max-width:1180px; margin:0 auto; }
.eyebrow { font-size:.72rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--blue); margin-bottom:.8rem; }
.h2 { font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:800; color:var(--navy); letter-spacing:-.8px; line-height:1.15; margin-bottom:1rem; }
.sub { font-size:1.02rem; color:var(--muted); max-width:600px; margin-bottom:3rem; }
.center { text-align:center; }
.center .sub { margin-left:auto; margin-right:auto; }
.dark { background:var(--navy); color:#fff; }
.dark .eyebrow { color:var(--volt-light); }
.dark .h2 { color:#fff; }
.dark .sub { color:rgba(255,255,255,.6); }
.soft { background:var(--bg); }

/* VOUS ÊTES */
.who-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.who { background:var(--white); border:1px solid var(--border); border-radius:var(--rl); padding:2rem; position:relative; overflow:hidden; transition:box-shadow .25s, transform .25s; display:flex; flex-direction:column; }
.who::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--volt); transform:scaleX(0); transform-origin:left; transition:transform .3s; }
.who:hover { box-shadow:0 14px 40px rgba(18,58,82,.1); transform:translateY(-4px); }
.who:hover::after { transform:scaleX(1); }
.who-top { display:flex; align-items:center; gap:.8rem; margin-bottom:1.1rem; }
.who-ico { width:46px; height:46px; border-radius:12px; background:var(--pale); display:grid; place-items:center; font-size:1.4rem; transition:transform .35s cubic-bezier(.3,1.6,.5,1); }
.who:hover .who-ico { transform:scale(1.12) rotate(-6deg); }
.who-tag { font-size:.7rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--blue); }
.who h3 { font-size:1.05rem; font-weight:700; color:var(--navy); line-height:1.4; margin-bottom:.7rem; }
.who p { font-size:.88rem; color:var(--muted); margin-bottom:1.2rem; flex:1; }
.gain { display:flex; gap:8px; font-size:.82rem; font-weight:700; color:var(--volt-dark); }
.gain::before { content:'→'; color:var(--blue); }

/* STEPS */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; position:relative; }
.steps::before { content:''; position:absolute; top:30px; left:12%; right:12%; height:2px; background:linear-gradient(90deg, var(--border) 0 50%, transparent 50%) 0 0/14px 2px; }
.step { text-align:center; position:relative; z-index:1; }
.step-n { width:60px; height:60px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-size:1.15rem; font-weight:800; margin:0 auto 1.2rem; border:4px solid #fff; box-shadow:0 0 0 1px var(--border); transition:transform .3s; }
.step:hover .step-n { transform:scale(1.1); }
.step-n.v { background:var(--grad); color:#fff; }
.step h3 { font-size:.98rem; font-weight:700; color:var(--navy); margin-bottom:.4rem; }
.step p { font-size:.84rem; color:var(--muted); }

/* VEHICULES */
.tabs { display:inline-flex; background:var(--white); border:1px solid var(--border); border-radius:12px; padding:5px; margin-bottom:2.2rem; gap:4px; flex-wrap:wrap; }
.tab { border:0; background:none; font-family:inherit; font-weight:700; font-size:.86rem; color:var(--muted); padding:.6rem 1.2rem; border-radius:9px; cursor:pointer; transition:background .2s, color .2s; }
.tab.on { background:var(--navy); color:#fff; }
.cars { display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.car { background:var(--white); border:1px solid var(--border); border-radius:var(--rl); overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .25s, transform .25s; }
.car:hover { box-shadow:0 14px 40px rgba(18,58,82,.1); transform:translateY(-4px); }
.car-img { aspect-ratio:4/3; background:linear-gradient(140deg, #E9F1FA, #D7E4F2); display:grid; place-items:center; position:relative; overflow:hidden; }
.car-img svg { width:72%; transition:transform .5s cubic-bezier(.2,.8,.2,1); }
.car:hover .car-img svg { transform:scale(1.07) translateX(4px); }
.car-badge { position:absolute; top:12px; left:12px; font-size:.68rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:4px 9px; border-radius:6px; background:var(--navy); color:#fff; }
.car-badge.occ { background:var(--blue); }
.car-body { padding:1.2rem 1.3rem 1.4rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.car-brand { font-size:.7rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); }
.car h3 { font-size:1.05rem; font-weight:700; color:var(--navy); }
.chips { display:flex; flex-wrap:wrap; gap:.35rem; }
.chips span { font-size:.72rem; font-weight:600; background:var(--bg); padding:3px 8px; border-radius:6px; color:var(--text); }
.car-price { margin-top:auto; padding-top:.6rem; display:flex; align-items:baseline; justify-content:space-between; gap:.5rem; flex-wrap:wrap; }
.car-price b { font-size:1.35rem; font-weight:800; color:var(--navy); letter-spacing:-.5px; }
.car-price small { font-size:.75rem; color:var(--muted); font-weight:600; }
.note { text-align:center; margin-top:2rem; font-size:.8rem; color:var(--muted); }
.note a { color:var(--blue); font-weight:600; }

/* LOCATION */
.loc-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }
.loc { border-radius:var(--rl); padding:2.4rem; position:relative; overflow:hidden; }
.loc-part { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); }
.loc-pro { background:linear-gradient(150deg, rgba(69,158,194,.22), rgba(44,106,142,.25)); border:1px solid rgba(69,158,194,.55); }
.loc-head { display:flex; align-items:center; gap:.9rem; margin-bottom:1rem; }
.loc-ico { width:52px; height:52px; border-radius:14px; background:rgba(255,255,255,.1); display:grid; place-items:center; font-size:1.6rem; }
.loc-who { font-size:.72rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--volt-light); }
.loc-photo { margin:-2.4rem -2.4rem 1.6rem; height:190px; background-size:cover; background-position:center; position:relative; }
.loc-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(18,58,82,.85)); }
.loc-pro .loc-photo::after { background:linear-gradient(180deg, transparent 40%, rgba(18,58,82,.75)); }
@media (max-width:600px) { .loc-photo { margin:-1.6rem -1.6rem 1.2rem; } }
.loc h3 { font-size:1.4rem; font-weight:800; }
.loc > p { color:rgba(255,255,255,.65); font-size:.92rem; margin-bottom:1.5rem; }
.prices { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin-bottom:1.6rem; }
.price { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:1rem .8rem; text-align:center; transition:background .2s, border-color .2s; }
.price:hover { background:rgba(255,255,255,.12); border-color:rgba(69,158,194,.5); }
.price .p-from { font-size:.62rem; font-weight:600; color:rgba(255,255,255,.55); margin-bottom:.15rem; }
.price .p-lbl { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,.5); }
.price .p-val { font-size:1.6rem; font-weight:800; letter-spacing:-1px; }
.price .p-val small { font-size:.75rem; font-weight:600; color:rgba(255,255,255,.55); letter-spacing:0; }
.checks { list-style:none; margin-bottom:1.8rem; display:grid; gap:.5rem; }
.checks li { display:flex; gap:10px; font-size:.88rem; color:rgba(255,255,255,.85); }
.checks li::before { content:'✓'; color:var(--volt); font-weight:800; flex-shrink:0; }
.ribbon { position:absolute; top:22px; right:-38px; background:var(--yellow); color:var(--navy); font-size:.66rem; font-weight:800; letter-spacing:1px; text-transform:uppercase; padding:5px 44px; transform:rotate(35deg); }

/* ATELIER */
.serv-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem; }
.serv { display:flex; gap:1.2rem; align-items:flex-start; background:var(--white); border:1px solid var(--border); border-radius:var(--rl); padding:1.6rem; transition:border-color .25s, box-shadow .25s; }
.serv:hover { border-color:var(--volt); box-shadow:0 10px 30px rgba(18,58,82,.07); }
.serv-ico { width:52px; height:52px; flex-shrink:0; border-radius:12px; background:var(--pale); display:grid; place-items:center; font-size:1.4rem; }
.serv h3 { font-size:1rem; font-weight:700; color:var(--navy); margin-bottom:.3rem; }
.serv p { font-size:.86rem; color:var(--muted); }
.serv .tag { display:inline-block; margin-top:.6rem; font-size:.72rem; font-weight:700; color:var(--blue); background:var(--pale); padding:3px 9px; border-radius:6px; }
.serv.wide { grid-column:1 / -1; background:var(--navy); color:#fff; border-color:var(--navy); }
.serv.wide h3 { color:#fff; }
.serv.wide p { color:rgba(255,255,255,.65); }
.serv.wide .serv-ico { background:rgba(255,255,255,.1); }
.serv.wide .btn { margin-left:auto; align-self:center; flex-shrink:0; }

/* ZONE */
.zone-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.zone-list { list-style:none; }
.zone-list li { padding:.75rem 0; border-bottom:1px solid var(--border); font-size:.92rem; display:flex; justify-content:space-between; gap:1rem; }
.zone-list li:last-child { border:0; }
.zone-list li span:first-child::before { content:'→ '; color:var(--volt-dark); font-weight:800; }
.zone-list li span:last-child { font-weight:700; color:var(--navy); font-size:.82rem; white-space:nowrap; }
.zone-map { background:var(--navy); border-radius:var(--rl); padding:2.5rem; display:grid; place-items:center; min-height:340px; }
.zone-map svg { width:100%; max-width:330px; }

/* AVIS */
.avis-band { display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; background:var(--white); border:1px solid var(--border); border-radius:var(--rl); padding:2.2rem 2.4rem; }
.avis-band h3 { font-size:1.35rem; font-weight:800; color:var(--navy); margin-bottom:.3rem; }
.avis-band p { color:var(--muted); font-size:.92rem; }

/* CONTACT */
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:4rem; }
.ci { display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.4rem; }
.ci-ico { width:44px; height:44px; flex-shrink:0; background:rgba(255,255,255,.08); border-radius:10px; display:grid; place-items:center; }
.ci-lbl { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,.4); }
.ci-val { font-size:.98rem; font-weight:600; }
.ci-val a { text-decoration:none; }
.ci-val a:hover { color:var(--volt); }
.engage { margin-top:2rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,.1); display:grid; gap:.7rem; }
.engage div { display:flex; gap:10px; font-size:.88rem; color:rgba(255,255,255,.7); }
.engage div::before { content:'✓'; color:var(--volt); font-weight:800; }
.form { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--rl); padding:2rem; }
.f-row { margin-bottom:1.05rem; }
.f-row label { display:block; font-size:.72rem; font-weight:700; color:rgba(255,255,255,.55); margin-bottom:.4rem; text-transform:uppercase; letter-spacing:.6px; }
.f-row input, .f-row select, .f-row textarea { width:100%; padding:.8rem 1rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:var(--r); color:#fff; font-family:inherit; font-size:.9rem; outline:none; transition:border-color .2s, background .2s; }
.f-row input::placeholder, .f-row textarea::placeholder { color:rgba(255,255,255,.3); }
.f-row input:focus, .f-row select:focus, .f-row textarea:focus { border-color:var(--volt); background:rgba(255,255,255,.11); }
.f-row select option { background:var(--navy); }
.f-row textarea { resize:vertical; min-height:90px; }
.f-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.f-check { display:flex; gap:.6rem; font-size:.78rem; color:rgba(255,255,255,.55); margin:.4rem 0 1.2rem; }
.f-check input { margin-top:3px; accent-color:var(--volt); }
.hp { position:absolute; left:-9999px; }
.btn-send { width:100%; justify-content:center; font-size:.95rem; }
.form-ok { display:none; text-align:center; padding:1rem; color:var(--volt-light); font-weight:700; }

/* FOOTER */
footer { background:#163E56; padding:3rem 2rem 2rem; color:rgba(255,255,255,.55); }
.foot { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:2rem; padding-bottom:2rem; border-bottom:1px solid rgba(255,255,255,.08); }
.foot h4 { color:#fff; font-size:.85rem; margin-bottom:.8rem; }
.foot a { display:block; font-size:.84rem; text-decoration:none; margin:.3rem 0; transition:color .2s; }
.foot a:hover { color:var(--volt); }
.foot p { font-size:.84rem; margin-top:.8rem; max-width:320px; }
.copy { max-width:1180px; margin:1.5rem auto 0; font-size:.75rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; }


/* HERO DIAPORAMA (effet vidéo) */
.slides { position:absolute; inset:0; z-index:0; overflow:hidden; background:var(--navy); }
.slide { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.12); transition:opacity 1.6s ease; will-change:transform, opacity; }
.slide.on { opacity:1; animation:kenburns 7.5s ease-out forwards; }
@keyframes kenburns { from { transform:scale(1.14) translate(1.5%, 1%); } to { transform:scale(1.02) translate(0,0); } }
.hero-overlay { background:linear-gradient(95deg, rgba(18,58,82,.94) 0%, rgba(18,58,82,.78) 40%, rgba(18,58,82,.25) 75%, rgba(18,58,82,.1) 100%) !important; }
.hero-inner.single { grid-template-columns:1fr; }
.hero-inner.single > div { max-width:640px; }
.dots { position:absolute; right:2rem; bottom:2.2rem; z-index:3; display:flex; gap:8px; }
.dots button { width:28px; height:4px; border:0; border-radius:4px; background:rgba(255,255,255,.35); cursor:pointer; padding:0; transition:background .3s, width .3s; }
.dots button.on { background:#fff; width:44px; }
.brands { display:flex; align-items:center; gap:1.2rem; margin-top:1.8rem; font-size:.72rem; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.55); font-weight:700; }
.brands b { color:#fff; font-size:1rem; letter-spacing:1px; }

/* CATALOGUE */
.car-img { background:radial-gradient(ellipse at 50% 70%, #FFFFFF 0%, #EEF1F6 70%) !important; cursor:pointer; }
.car-img img { width:86%; height:80%; object-fit:contain; transition:transform .5s cubic-bezier(.2,.8,.2,1); filter:drop-shadow(0 14px 14px rgba(18,58,82,.18)); }
.car:hover .car-img img { transform:scale(1.07) translateX(4px); }
.car-badge.c50 { background:var(--grad); }
.car-badge.c125 { background:var(--navy); }
.car-badge.moto { background:#163E56; }
.car-badge.occ { background:#2B4A74; }
.car-soon { display:grid; place-items:center; text-align:center; color:var(--muted); font-size:.8rem; font-weight:600; gap:.4rem; }
.car-soon span { font-size:2.4rem; font-weight:800; color:#CBD3DF; letter-spacing:-1px; }
.car-actions { display:flex; gap:.5rem; margin-top:.4rem; }
.car-actions .btn { padding:.6rem .9rem; font-size:.78rem; flex:1; justify-content:center; }
.car-price b { font-size:1.05rem !important; }
.car-tagline { font-size:.82rem; color:var(--muted); margin-top:-.2rem; }

/* FICHE MODÈLE */
.modal { position:fixed; inset:0; z-index:200; background:rgba(18,58,82,.72); backdrop-filter:blur(4px); display:none; place-items:center; padding:1rem; }
.modal.open { display:grid; animation:fade .25s ease; }
@keyframes fade { from { opacity:0; } }
.modal-box { background:#fff; border-radius:var(--rl); max-width:920px; width:100%; max-height:92vh; overflow:auto; display:grid; grid-template-columns:1fr 1fr; position:relative; animation:pop .35s cubic-bezier(.2,.8,.2,1); }
@keyframes pop { from { transform:translateY(20px) scale(.97); } }
.modal-close { position:absolute; top:12px; right:12px; width:40px; height:40px; border-radius:50%; border:0; background:var(--bg); font-size:1.4rem; cursor:pointer; z-index:2; }
.m-img { background:radial-gradient(ellipse at 50% 65%, #fff, #E9EDF4 75%); display:grid; place-items:center; padding:2rem; min-height:320px; }
.m-img img { width:100%; max-height:340px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(18,58,82,.2)); }
.m-body { padding:2.2rem 2rem; }
.m-body h3 { font-size:1.7rem; font-weight:800; color:var(--navy); letter-spacing:-.5px; }
.m-body .m-tag { font-weight:700; color:var(--blue); margin-bottom:.8rem; }
.m-body p { font-size:.88rem; color:var(--muted); margin-bottom:1.2rem; }
.specs { width:100%; border-collapse:collapse; margin-bottom:1.4rem; }
.specs td { padding:.5rem 0; border-bottom:1px solid var(--border); font-size:.84rem; vertical-align:top; }
.specs td:first-child { color:var(--muted); width:42%; }
.specs td:last-child { font-weight:600; }
.m-actions { display:flex; gap:.6rem; flex-wrap:wrap; }
@media (max-width:760px) { .modal-box { grid-template-columns:1fr; } .m-img { min-height:220px; } }

/* OCCASIONS */
.occ-head { display:flex; justify-content:space-between; align-items:end; gap:1.5rem; flex-wrap:wrap; margin-bottom:2.2rem; }
.occ-head .sub { margin-bottom:0; }
.occ-perks { display:flex; gap:.6rem; flex-wrap:wrap; }
.occ-perks span { font-size:.78rem; font-weight:700; color:var(--navy); background:#fff; border:1px solid var(--border); padding:.45rem .8rem; border-radius:20px; }
.occ-perks span::before { content:'✓ '; color:var(--volt); }
.km { font-size:.78rem; color:var(--muted); font-weight:600; }
.old-price { text-decoration:line-through; color:var(--muted); font-size:.8rem; font-weight:600; margin-left:.3rem; }
.example { font-size:.7rem; font-weight:700; color:#B54708; background:#FEF0C7; padding:2px 7px; border-radius:5px; }

.socials { display:flex; gap:.7rem; margin-top:.3rem; }
.socials a { width:42px; height:42px; border-radius:50%; display:grid !important; place-items:center; background:rgba(255,255,255,.08); color:#fff; margin:0 !important; transition:background .2s, transform .2s; }
.socials a:hover { background:var(--grad); color:#fff; transform:translateY(-2px); }
.ci-socials { display:flex; gap:.7rem; margin-top:1.6rem; }
.ci-socials a { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.08); color:#fff; transition:background .2s, transform .2s; }
.ci-socials a:hover { background:var(--grad); transform:translateY(-2px); }

.logo-img { width:56px; height:56px; border-radius:50%; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.15); transition:width .3s, height .3s; }
nav.solid .logo-img { width:48px; height:48px; }
footer .logo-img { width:72px; height:72px; }

/* REVEAL */
html.js .reveal:not(.visible) { opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); transition-delay:var(--d,0s); }
.reveal.visible { opacity:1; transform:none; }
.hero .anim { opacity:0; transform:translateY(24px); animation:up .9s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:var(--d,0s); }
@keyframes up { to { opacity:1; transform:none; } }

/* RESPONSIVE */
@media (max-width:1000px) {
  .cars { grid-template-columns:repeat(2,1fr); }
  .nav-links { display:none; }
  .nav-toggle { display:block; }
}
@media (max-width:900px) {
  .hero-inner { grid-template-columns:1fr; }
  .hero-card { display:none; }
  .who-grid { grid-template-columns:1fr 1fr; }
  .steps { grid-template-columns:repeat(2,1fr); }
  .steps::before { display:none; }
  .loc-grid, .zone-grid, .contact-grid, .serv-grid { grid-template-columns:1fr; }
  .serv.wide { flex-wrap:wrap; }
  .serv.wide .btn { margin-left:0; }
  .foot { grid-template-columns:1fr 1fr; }
}
@media (max-width:600px) {
  section { padding:4rem 1rem; }
  nav { padding:0 1rem; }
  .hero { padding:6rem 1rem 4rem; }
  .who-grid, .cars, .steps { grid-template-columns:1fr; }
  .prices { grid-template-columns:1fr 1fr 1fr; gap:.5rem; }
  .price .p-val { font-size:1.25rem; }
  .loc { padding:1.6rem; }
  .f-2 { grid-template-columns:1fr; }
  .foot { grid-template-columns:1fr; }
  .proof { gap:1.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation:none !important; transition:none !important; }
  .reveal, .hero .anim { opacity:1; transform:none; }
}
