/* ==============================================================
   THIERRY DRIVER PACA — STYLE.CSS — DIRECTION A
   Refonte v2 « Maison de chauffeur » — Lot 1
   ============================================================== */


/* ==============================================================
   1. TOKENS
   ============================================================== */
:root{
  /* Palette */
  --bg-paper:#FAF7F2;
  --bg-cream:#F5F1EB;
  --ink:#1A1A1A;
  --ink-soft:#2C2C2A;
  --ink-mute:#6B5640;
  --ink-faint:#A89E8B;
  --accent:#A8825E;
  --accent-dark:#7A5C40;
  --accent-light:#C9A47D;
  --rule:#E5DFD3;
  --gold:#C9A961;
  --white:#ffffff;
  --danger:#A32D2D;
  --success:#3B6D11;
  --warning:#854F0B;

  /* Typography */
  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Layout */
  --container:1240px;
  --container-narrow:880px;

  /* Radius */
  --r-sm:4px;
  --r-md:8px;
  --r-lg:16px;
  --r-pill:999px;

  /* Shadows (1 seule ombre éditoriale) */
  --shadow-card:0 24px 60px -20px rgba(26,26,26,.18);

  /* Transitions */
  --ease:cubic-bezier(.22,.61,.36,1);
  --t-fast:200ms;
  --t-base:320ms;
  --t-slow:600ms;

  /* Z-index scale */
  --z-utility:40;
  --z-header:50;
  --z-drawer:60;
  --z-modal:70;
}


/* ==============================================================
   2. RESET + BASE
   ============================================================== */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  color:var(--ink-soft);
  background:var(--bg-paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img,svg,video{max-width:100%;height:auto;display:block}
button{font:inherit;cursor:pointer;background:none;border:none;color:inherit}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
input,textarea,select{font:inherit;color:inherit}

/* Focus visible accessibility */
:focus{outline:none}
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:2px;
}

::selection{background:var(--accent);color:var(--bg-paper)}


/* ==============================================================
   3. TYPOGRAPHY
   ============================================================== */
h1,h2,h3,h4,h5,h6{
  font-family:var(--serif);
  font-weight:300;
  line-height:1.15;
  letter-spacing:-0.01em;
  color:var(--ink);
}
h1{font-size:clamp(40px,5vw,64px);letter-spacing:-0.02em}
h2{font-size:clamp(32px,4vw,52px);letter-spacing:-0.02em}
h3{font-size:clamp(24px,2.5vw,32px)}
h4{font-size:20px}
em{font-style:italic}

p{margin-bottom:0}
.lead{
  font-size:18px;
  line-height:1.7;
  color:var(--ink-mute);
  max-width:62ch;
}


/* ==============================================================
   4. LAYOUT
   ============================================================== */
.container{
  width:min(var(--container), 92%);
  margin-inline:auto;
}
.container-narrow{
  width:min(var(--container-narrow), 92%);
  margin-inline:auto;
}

.section{
  padding:96px 0;
}
@media (max-width:900px){
  .section{padding:72px 0}
}

.grid2,.grid3{display:grid;gap:32px}
.grid2{grid-template-columns:repeat(2,1fr)}
.grid3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){
  .grid2,.grid3{grid-template-columns:1fr}
}


/* ==============================================================
   5. UTILITY BAR (top bandeau)
   ============================================================== */
.utility-bar{
  background:var(--ink);
  color:#D8D3C8;
  font-size:13px;
  letter-spacing:0.02em;
  position:relative;
  z-index:var(--z-utility);
}
.utility-bar .container{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 0;
  gap:24px;
}
.utility-bar a{
  color:#D8D3C8;
  transition:color var(--t-base) var(--ease);
}
.utility-bar a:hover{color:var(--accent-light)}
.utility-left{display:flex;gap:32px;align-items:center;flex-wrap:wrap}
.utility-left span{display:flex;align-items:center;gap:10px}
.utility-left span::before{
  content:"";
  width:6px;
  height:6px;
  background:var(--accent);
  border-radius:50%;
  flex-shrink:0;
}
.utility-right{display:flex;gap:24px;align-items:center}
.utility-phone{font-weight:500}
.utility-lang{
  border:1px solid rgba(255,255,255,.15);
  padding:3px 10px;
  border-radius:var(--r-sm);
  font-size:12px;
  letter-spacing:0.06em;
  text-transform:uppercase;
}


/* ==============================================================
   6. SITE HEADER
   ============================================================== */
.site-header{
  position:sticky;
  top:0;
  z-index:var(--z-header);
  background:rgba(250,247,242,.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule);
  transition:padding var(--t-base) var(--ease);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 0;
  gap:24px;
}

/* Brand (mode texte ou image) */
.brand{
  font-family:var(--serif);
  font-weight:400;
  font-size:22px;
  letter-spacing:-0.01em;
  color:var(--ink);
  display:flex;
  flex-direction:column;
  line-height:1;
  gap:4px;
  flex-shrink:0;
}
.brand-name{font-style:italic}
.brand-region{
  font-family:var(--sans);
  font-size:10px;
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
}
.brand img{
  height:48px;
  width:auto;
  object-fit:contain;
  display:block;
}

/* Logo legacy compat (anciennes pages) */
.logo{
  font-family:var(--serif);
  font-weight:400;
  font-size:22px;
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:10px;
  font-style:italic;
  color:var(--ink);
}
.logo span{color:var(--accent);font-style:normal}
.logo img{height:48px;width:auto;object-fit:contain;display:block;transform:none;filter:none}

/* Nav */
.nav{
  margin-left:auto;
  display:flex;
  gap:36px;
  align-items:center;
}
.nav a{
  font-size:14px;
  font-weight:500;
  color:var(--ink-soft);
  letter-spacing:0.02em;
  position:relative;
  padding:6px 0;
  transition:color var(--t-base) var(--ease);
}
.nav a:hover{color:var(--accent)}
.nav a:not(.nav-cta)::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform var(--t-base) var(--ease);
}
.nav a:not(.nav-cta):hover::after{transform:scaleX(1)}

.nav-cta{
  background:var(--ink);
  color:var(--bg-paper) !important;
  padding:12px 22px;
  border-radius:var(--r-sm);
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  font-weight:500;
  transition:background var(--t-base) var(--ease);
}
.nav-cta:hover{background:var(--accent)}

/* Burger */
.burger{
  display:none;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  background:transparent;
  transition:background var(--t-base) var(--ease);
}
.burger:hover{background:var(--bg-cream)}
.burger-icon{
  position:relative;
  width:18px;
  height:12px;
}
.burger-icon::before,
.burger-icon::after{
  content:"";
  position:absolute;
  left:0;
  width:100%;
  height:1px;
  background:var(--ink);
  transition:transform var(--t-base) var(--ease);
}
.burger-icon::before{top:0}
.burger-icon::after{bottom:0}

/* Mobile drawer */
.mobile-nav{
  display:none;
  position:fixed;
  inset:0;
  background:var(--bg-paper);
  z-index:var(--z-drawer);
  padding:96px 32px 48px;
  flex-direction:column;
  gap:8px;
  opacity:0;
  pointer-events:none;
  transition:opacity var(--t-base) var(--ease);
}
.mobile-nav.active{
  display:flex;
  opacity:1;
  pointer-events:auto;
}
.mobile-nav a{
  display:block;
  font-family:var(--serif);
  font-weight:400;
  font-size:32px;
  color:var(--ink);
  padding:16px 0;
  border-bottom:1px solid var(--rule);
  transition:color var(--t-base) var(--ease);
}
.mobile-nav a:hover{color:var(--accent)}
.mobile-nav-close{
  position:absolute;
  top:24px;
  right:32px;
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  color:var(--ink);
}


/* ==============================================================
   7. BUTTONS
   ============================================================== */
.btn,
.btn-primary{
  display:inline-flex;
  align-items:center;
  gap:12px;
  background:var(--accent);
  color:var(--ink);
  padding:18px 36px;
  font-family:var(--sans);
  font-size:14px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  border-radius:var(--r-sm);
  border:1px solid var(--accent);
  transition:background var(--t-base) var(--ease), color var(--t-base) var(--ease), transform var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
  cursor:pointer;
  text-decoration:none;
}
.btn:hover,
.btn-primary:hover{
  background:var(--accent-dark);
  border-color:var(--accent-dark);
  color:var(--bg-paper);
  transform:translateY(-1px);
}
.btn-arrow{width:14px;height:14px;transition:transform var(--t-base) var(--ease)}
.btn:hover .btn-arrow,
.btn-primary:hover .btn-arrow{transform:translateX(4px)}

.btn-outline{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--ink);
}
.btn-outline:hover{
  background:var(--ink);
  color:var(--bg-paper);
  border-color:var(--ink);
}

.btn-ghost{
  background:transparent;
  color:var(--ink);
  border:none;
  border-bottom:1px solid var(--ink);
  padding:18px 0;
  border-radius:0;
  letter-spacing:0.06em;
}
.btn-ghost:hover{
  background:transparent;
  color:var(--accent);
  border-color:var(--accent);
  transform:none;
}

.btn-small{
  padding:12px 22px;
  font-size:13px;
}

.btn-danger{
  background:var(--danger);
  border-color:var(--danger);
  color:var(--bg-paper);
}
.btn-danger:hover{
  background:#7a1f1f;
  border-color:#7a1f1f;
  color:var(--bg-paper);
}


/* ==============================================================
   8. SECTION HEADERS (eyebrow + title + lead)
   ============================================================== */
.section-eyebrow{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.4em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:500;
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:16px;
}
.section-eyebrow::before{
  content:"";
  width:36px;
  height:1px;
  background:var(--accent);
  flex-shrink:0;
}
.section-eyebrow.center{justify-content:center}

.section-title{
  margin-bottom:24px;
  max-width:780px;
}
.section-title em{font-style:italic;color:var(--accent)}
.section-title.center{margin-inline:auto}

.section-lead{
  font-size:18px;
  line-height:1.7;
  color:var(--ink-mute);
  max-width:620px;
  margin-bottom:64px;
}
.section-lead.center{margin-inline:auto;text-align:center}


/* ==============================================================
   9. HOME — HERO
   ============================================================== */
.hero{
  position:relative;
  min-height:88vh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background:#0a0a0a;
}
.hero-slides{
  position:absolute;
  inset:0;
  z-index:1;
}
.hero-slide{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  opacity:0;
  transform:scale(1.06);
  transition:opacity 1.6s var(--ease), transform 14s var(--ease);
}
.hero-slide.active{
  opacity:1;
  transform:scale(1);
}
.hero::after,
.hero-overlay{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg, rgba(20,18,15,.2) 0%, rgba(20,18,15,.45) 50%, rgba(20,18,15,.85) 100%);
}
.hero-inner{
  position:relative;
  z-index:3;
  color:var(--bg-paper);
  padding:120px 0 100px;
  width:100%;
}
.hero-eyebrow{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.4em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:500;
  margin-bottom:32px;
  display:flex;
  align-items:center;
  gap:16px;
  opacity:0;
  animation:fadeUp 1s var(--ease) .3s forwards;
}
.hero-eyebrow::before{
  content:"";
  width:40px;
  height:1px;
  background:var(--gold);
}
.hero-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(40px,5.5vw,72px);
  line-height:1.05;
  letter-spacing:-0.02em;
  color:var(--bg-paper);
  margin-bottom:32px;
  max-width:920px;
  opacity:0;
  animation:fadeUp 1s var(--ease) .5s forwards;
}
.hero-title em{
  font-style:italic;
  color:var(--gold);
  font-weight:400;
}
.hero-subtitle{
  font-size:19px;
  line-height:1.6;
  color:rgba(250,247,242,.85);
  max-width:560px;
  margin-bottom:48px;
  opacity:0;
  animation:fadeUp 1s var(--ease) .7s forwards;
}
.hero-actions{
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap;
  opacity:0;
  animation:fadeUp 1s var(--ease) .9s forwards;
}
.hero-actions .btn-ghost{
  color:var(--bg-paper);
  border-color:rgba(250,247,242,.4);
}
.hero-actions .btn-ghost:hover{
  color:var(--gold);
  border-color:var(--gold);
}

/* Téléphone hero (option) */
.hero-phone{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(32px,4vw,48px);
  letter-spacing:0.02em;
  color:var(--gold);
  margin:6px 0 24px;
  display:inline-block;
}
.hero-phone a{color:inherit}
.hero-phone a:hover{opacity:.85}

/* Scroll indicator */
.hero-scroll{
  position:absolute;
  bottom:40px;
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  font-size:11px;
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:rgba(250,247,242,.7);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  transition:opacity var(--t-base) var(--ease);
  text-decoration:none;
}
.hero-scroll::after{
  content:"";
  width:1px;
  height:48px;
  background:linear-gradient(180deg, var(--gold) 0%, transparent 100%);
  animation:scrollPulse 2.5s var(--ease) infinite;
}
.hero-scroll.is-hidden{opacity:0;pointer-events:none}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes scrollPulse{
  0%,100%{transform:scaleY(.5);transform-origin:top;opacity:.5}
  50%{transform:scaleY(1);opacity:1}
}


/* ==============================================================
   10. HOME — TRUST BAR
   ============================================================== */
.trust-bar{
  background:var(--bg-cream);
  border-bottom:1px solid var(--rule);
}
.trust-bar .container{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.trust-item{
  padding:36px 24px;
  text-align:center;
  border-right:1px solid var(--rule);
}
.trust-item:last-child{border-right:none}
.trust-figure{
  font-family:var(--serif);
  font-weight:300;
  font-size:36px;
  color:var(--accent);
  letter-spacing:-0.02em;
  margin-bottom:6px;
  line-height:1;
}
.trust-figure em{font-style:italic}
.trust-label{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
}


/* ==============================================================
   11. HOME — SERVICES
   ============================================================== */
.services-section{padding:120px 0}
.services-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:48px 32px;
}
.service-card{
  cursor:pointer;
  transition:transform var(--t-slow) var(--ease);
  display:block;
}
.service-card:hover{transform:translateY(-6px)}
.service-img{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  margin-bottom:24px;
  background:var(--bg-cream);
}
.service-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 1.4s var(--ease);
}
.service-card:hover .service-img img{transform:scale(1.06)}
.service-img::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 60%, rgba(20,18,15,.3) 100%);
  pointer-events:none;
}
.service-num{
  position:absolute;
  top:20px;
  left:20px;
  font-family:var(--serif);
  font-style:italic;
  font-size:14px;
  color:var(--bg-paper);
  z-index:1;
  letter-spacing:0.02em;
}
.service-card h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:26px;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin-bottom:12px;
}
.service-card p{
  font-size:15px;
  color:var(--ink-mute);
  margin-bottom:16px;
  line-height:1.6;
}
.service-link{
  font-family:var(--sans);
  font-size:13px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:500;
  display:inline-flex;
  align-items:center;
  gap:10px;
  transition:color var(--t-base) var(--ease);
}
.service-link::after{
  content:"→";
  transition:transform var(--t-base) var(--ease);
}
.service-card:hover .service-link{color:var(--accent-dark)}
.service-card:hover .service-link::after{transform:translateX(6px)}


/* ==============================================================
   12. HOME — ELECTRIC VAN
   ============================================================== */
.electric{
  background:var(--ink);
  color:var(--bg-paper);
  padding:120px 0;
  position:relative;
  overflow:hidden;
}
.electric .container{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.electric-image{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
}
.electric-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.electric-content{padding:40px 0}
.electric .section-eyebrow{color:var(--gold)}
.electric .section-eyebrow::before{background:var(--gold)}
.electric .section-title{color:var(--bg-paper)}
.electric .section-title em{color:var(--gold)}
.electric p{
  font-size:17px;
  line-height:1.8;
  color:rgba(250,247,242,.78);
  margin-bottom:20px;
  max-width:480px;
}
.electric-quote{
  font-family:var(--serif);
  font-style:italic;
  font-weight:300;
  font-size:22px;
  line-height:1.5;
  color:var(--gold);
  border-left:1px solid var(--gold);
  padding-left:24px;
  margin:32px 0;
}
.electric-features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  margin:32px 0 40px;
  padding-top:32px;
  border-top:1px solid rgba(255,255,255,.1);
}
.electric-feature{font-size:14px;color:rgba(250,247,242,.78)}
.electric-feature strong{
  display:block;
  color:var(--gold);
  font-family:var(--serif);
  font-style:italic;
  font-size:24px;
  font-weight:300;
  margin-bottom:4px;
}


/* ==============================================================
   13. HOME — REVIEWS
   ============================================================== */
.reviews-section{
  background:var(--bg-cream);
  padding:120px 0;
}
.reviews-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:64px;
  flex-wrap:wrap;
  gap:32px;
}
.reviews-rating{
  text-align:right;
  flex-shrink:0;
}
.reviews-stars{
  color:var(--gold);
  font-size:20px;
  letter-spacing:4px;
  margin-bottom:6px;
}
.reviews-score{
  font-family:var(--serif);
  font-size:48px;
  font-weight:300;
  color:var(--ink);
  line-height:1;
}
.reviews-score em{
  font-style:italic;
  color:var(--accent);
  font-size:24px;
}
.reviews-count{
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:0.1em;
  text-transform:uppercase;
  margin-top:8px;
}
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
}
.review-card{
  background:var(--bg-paper);
  padding:40px;
  border-top:1px solid var(--accent);
  position:relative;
}
.review-card::before{
  content:"\201C";
  position:absolute;
  top:8px;
  right:24px;
  font-family:var(--serif);
  font-size:96px;
  color:var(--accent);
  opacity:.15;
  line-height:1;
}
.review-stars{
  color:var(--gold);
  font-size:14px;
  letter-spacing:3px;
  margin-bottom:20px;
}
.review-text{
  font-family:var(--serif);
  font-weight:300;
  font-size:18px;
  line-height:1.6;
  color:var(--ink-soft);
  margin-bottom:32px;
}
.review-author{
  font-family:var(--sans);
  font-size:14px;
  color:var(--ink);
  font-weight:500;
}
.review-meta{
  font-size:12px;
  color:var(--ink-mute);
  letter-spacing:0.05em;
  margin-top:4px;
}


/* ==============================================================
   14. HOME — ZONES
   ============================================================== */
.zones-section{padding:120px 0}
.zones-section .container{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.zones-map{
  position:relative;
  aspect-ratio:4/5;
  background:var(--bg-cream);
  overflow:hidden;
  border:1px solid var(--rule);
}
.zones-map img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:sepia(.15) saturate(.85);
}
.zones-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 32px;
  margin-top:32px;
}
.zones-list a{
  border-bottom:1px solid var(--rule);
  padding:18px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  transition:padding-left var(--t-base) var(--ease);
}
.zones-list a:hover{padding-left:8px}
.zones-list a:hover strong{color:var(--accent)}
.zones-list strong{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  color:var(--ink);
  transition:color var(--t-base) var(--ease);
}
.zones-list span{
  font-family:var(--sans);
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:0.05em;
}


/* ==============================================================
   15. HOME — FAQ
   ============================================================== */
.faq-section{
  background:var(--bg-cream);
  padding:120px 0;
}
.faq-list{
  max-width:880px;
  margin:0 auto;
}
.faq-item{border-bottom:1px solid var(--rule)}
.faq-question{
  width:100%;
  text-align:left;
  padding:28px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:32px;
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  color:var(--ink);
  letter-spacing:-0.01em;
  transition:color var(--t-base) var(--ease);
}
.faq-question:hover{color:var(--accent)}
.faq-toggle{
  width:32px;
  height:32px;
  border:1px solid var(--rule);
  border-radius:50%;
  flex-shrink:0;
  position:relative;
  transition:border-color var(--t-base) var(--ease), background var(--t-base) var(--ease);
}
.faq-question:hover .faq-toggle{border-color:var(--accent)}
.faq-toggle::before,
.faq-toggle::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:12px;
  height:1px;
  background:var(--ink);
  transition:transform var(--t-base) var(--ease), background var(--t-base) var(--ease);
}
.faq-toggle::before{transform:translate(-50%,-50%)}
.faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item.open .faq-toggle{background:var(--accent);border-color:var(--accent)}
.faq-item.open .faq-toggle::before,
.faq-item.open .faq-toggle::after{background:var(--bg-paper)}
.faq-item.open .faq-toggle::after{transform:translate(-50%,-50%) rotate(0deg)}
.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height var(--t-slow) var(--ease);
}
.faq-item.open .faq-answer{max-height:600px}
.faq-answer-inner{
  padding:0 0 32px;
  color:var(--ink-mute);
  font-size:16px;
  line-height:1.7;
  max-width:680px;
}


/* ==============================================================
   16. HOME — CTA FINAL
   ============================================================== */
.cta-final{
  background:var(--accent);
  color:var(--ink);
  padding:120px 0;
  text-align:center;
}
.cta-final-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(36px,4.5vw,60px);
  line-height:1.1;
  letter-spacing:-0.02em;
  color:var(--ink);
  margin-bottom:32px;
  max-width:880px;
  margin-inline:auto;
}
.cta-final-title em{font-style:italic}
.cta-final-lead{
  max-width:580px;
  margin:0 auto;
  font-size:18px;
  line-height:1.7;
  color:var(--ink-soft);
}
.cta-final-phone{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(36px,4vw,48px);
  letter-spacing:0.04em;
  margin:32px 0;
  display:block;
  color:var(--ink);
  transition:color var(--t-base) var(--ease);
}
.cta-final-phone:hover{color:var(--ink-soft)}
.cta-final-actions{
  display:flex;
  gap:24px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:24px;
}
.cta-final .btn-primary{
  background:var(--ink);
  color:var(--bg-paper);
  border-color:var(--ink);
}
.cta-final .btn-primary:hover{
  background:#000;
  border-color:#000;
  color:var(--bg-paper);
}
.cta-final .btn-ghost{
  color:var(--ink);
  border-color:var(--ink);
}
.cta-final .btn-ghost:hover{
  color:var(--ink-soft);
  border-color:var(--ink-soft);
}


/* ==============================================================
   17. SITE FOOTER
   ============================================================== */
.site-footer{
  background:var(--ink);
  color:#A8A39A;
  padding:96px 0 40px;
  font-size:14px;
}
.footer-grid,
.footer-grid-3{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:64px;
  padding-bottom:64px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-logo{
  font-family:var(--serif);
  font-weight:300;
  font-size:32px;
  color:var(--bg-paper);
  margin-bottom:24px;
  letter-spacing:-0.01em;
  font-style:italic;
}
.footer-logo span{color:var(--accent);font-style:normal}
.footer-grid p{
  line-height:1.7;
  margin-bottom:16px;
  max-width:300px;
}
.footer-grid h4{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:24px;
  font-weight:500;
}
.footer-links li,
.footer-grid li{margin-bottom:12px}
.footer-grid a,
.footer-links a{
  color:#A8A39A;
  transition:color var(--t-base) var(--ease);
}
.footer-grid a:hover,
.footer-links a:hover{color:var(--bg-paper)}
.footer-contact a{color:#A8A39A}
.footer-contact a:hover{color:var(--bg-paper)}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:32px;
  font-size:13px;
  color:#6A655C;
  flex-wrap:wrap;
  gap:16px;
}
.footer-credit{color:#6A655C}
.footer-credit a{color:#A8A39A;transition:color var(--t-base) var(--ease)}
.footer-credit a:hover{color:var(--bg-paper)}
.footer-legal-inline{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:20px;
  align-items:center;
  font-size:13px;
}
.footer-legal-inline a{color:#A8A39A}
.footer-legal-inline a:hover{color:var(--bg-paper)}
.footer-legal-inline .sep{color:#6A655C}


/* ==============================================================
   18. COOKIE BANNER (re-skin)
   ============================================================== */
.cookie-banner{
  position:fixed;
  bottom:24px;
  left:24px;
  right:24px;
  z-index:var(--z-modal);
  display:flex;
  justify-content:center;
  pointer-events:none;
}
.cookie-banner.hidden{display:none}
.cookie-card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-card);
  padding:24px 28px;
  max-width:640px;
  pointer-events:auto;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.cookie-top{display:flex;gap:16px;align-items:flex-start}
.cookie-emoji{font-size:24px;flex-shrink:0}
.cookie-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  color:var(--ink);
  margin-bottom:4px;
}
.cookie-text{
  font-size:14px;
  color:var(--ink-mute);
  line-height:1.6;
}
.cookie-link{color:var(--accent);text-decoration:underline}
.cookie-link:hover{color:var(--accent-dark)}
.cookie-actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.cookie-fab{
  position:fixed;
  bottom:24px;
  right:24px;
  z-index:var(--z-modal);
  width:48px;
  height:48px;
  border-radius:50%;
  background:var(--ink);
  color:var(--bg-paper);
  border:none;
  font-size:20px;
  cursor:pointer;
  box-shadow:var(--shadow-card);
  transition:transform var(--t-base) var(--ease);
}
.cookie-fab.hidden{display:none}
.cookie-fab:hover{transform:scale(1.05)}


/* ==============================================================
   19. TOP ALERT (config manquante)
   ============================================================== */
.top-alert{
  background:#FAEEDA;
  color:#854F0B;
  padding:12px 16px;
  font-size:14px;
  text-align:center;
  border-bottom:1px solid #FAC775;
}


/* ==============================================================
   20. LEGACY — pages non encore refondues (booking/services/véhicules…)
   Adaptation minimale au nouveau design system.
   Refonte complète prévue dans Lots 2 et 3.
   ============================================================== */

/* Hero legacy (pages internes) */
.hero-slider{
  position:relative;
  min-height:60vh;
  overflow:hidden;
  display:flex;
  align-items:center;
}
.hero-inner{position:relative;z-index:3;text-align:center;padding:56px 0}
.hero-brand,
.hero-kicker{
  font-family:var(--serif);
  font-weight:400;
  font-style:italic;
  font-size:26px;
  margin:0 0 10px;
  color:var(--bg-paper);
}
.hero-brand span{color:var(--accent);font-style:normal}
.hero-electric{margin:16px 0;display:flex;justify-content:center;gap:14px;flex-wrap:wrap;color:var(--gold);font-size:14px;letter-spacing:0.06em}
.electric-badge{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold);
  border:1px solid var(--gold);
  padding:6px 14px;
  border-radius:var(--r-pill);
}
.electric-text{color:rgba(250,247,242,.7);font-size:13px;letter-spacing:0.06em}
.hero-actions-center{justify-content:center}

.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.badges-center{justify-content:center}
.badges span{
  font-family:var(--sans);
  padding:8px 14px;
  border-radius:var(--r-pill);
  background:rgba(250,247,242,.08);
  color:rgba(250,247,242,.85);
  border:1px solid rgba(250,247,242,.12);
  font-size:13px;
  letter-spacing:0.02em;
}
.badge-female-driver{
  padding:9px 14px;
  background:rgba(201,169,97,.15);
  color:var(--gold);
  border:1px solid rgba(201,169,97,.4);
}
.badge-break{flex-basis:100%;justify-content:center;display:inline-flex}

.scroll-indicator{
  position:absolute;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  color:rgba(250,247,242,.7);
  font-size:24px;
  text-decoration:none;
  transition:opacity var(--t-base) var(--ease);
}
.scroll-indicator.is-hidden{opacity:0;pointer-events:none}

/* Prestations grid (legacy home — remplacé par .services-grid) */
.prestations{padding:96px 0}
.prestations-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(32px,4vw,52px);
  margin-bottom:16px;
  color:var(--ink);
}
.prestations-lead{
  font-size:18px;
  color:var(--ink-mute);
  margin-bottom:48px;
  max-width:62ch;
}
.tiles{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
@media (max-width:900px){.tiles{grid-template-columns:1fr}}
.tile{
  position:relative;
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  border-radius:var(--r-md);
  text-decoration:none;
}
.tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 1.4s var(--ease);
}
.tile:hover img{transform:scale(1.06)}
.tile-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 50%, rgba(20,18,15,.85) 100%);
  display:flex;
  align-items:flex-end;
  padding:24px;
}
.tile-label{
  font-family:var(--serif);
  color:var(--bg-paper);
  font-size:22px;
  font-weight:400;
  letter-spacing:-0.01em;
}

/* Cards génériques */
.card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px;
}
.card-dark{
  background:var(--ink);
  color:var(--bg-paper);
  border:none;
}

/* Forms (legacy booking/contact — refonte au Lot 2) */
.form{display:grid;gap:16px}
.form label{
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
  margin-bottom:6px;
  display:block;
}
.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form input[type="date"],
.form input[type="time"],
.form input[type="number"],
.form select,
.form textarea{
  width:100%;
  padding:14px 16px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  color:var(--ink);
  font-size:15px;
  transition:border-color var(--t-base) var(--ease);
}
.form input:focus,
.form select:focus,
.form textarea:focus{
  border-color:var(--accent);
  outline:none;
}
.form textarea{min-height:120px;resize:vertical;font-family:var(--sans)}

/* Booking (légèrement re-skin — refonte complète Lot 2) */
.booking-panels,.booking-panel-card{background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--r-md)}
.booking-panel-card{padding:24px;margin-bottom:16px}
.booking-panel-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  color:var(--ink);
  margin-bottom:16px;
}
.booking-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.booking-pill{
  font-family:var(--sans);
  font-size:13px;
  padding:8px 14px;
  border:1px solid var(--rule);
  border-radius:var(--r-pill);
  background:transparent;
  color:var(--ink-soft);
  cursor:pointer;
  transition:all var(--t-base) var(--ease);
}
.booking-pill:hover{border-color:var(--accent);color:var(--accent)}
.booking-faq{margin-top:24px;color:var(--ink-mute)}
.booking-bottom{margin-top:32px;text-align:center}
.booking-bottom-top{margin-top:16px;color:var(--ink-mute);font-size:14px}

/* Estimate box */
.estimate-box{
  background:var(--bg-cream);
  border:1px solid var(--rule);
  border-left:3px solid var(--accent);
  padding:20px 24px;
  border-radius:var(--r-sm);
  margin:16px 0;
}
.estimate-title{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:6px;
  font-weight:500;
}
.estimate-value{
  font-family:var(--serif);
  font-size:32px;
  font-weight:300;
  color:var(--accent);
  letter-spacing:-0.01em;
}

/* Customer type modal (booking — refonte au Lot 2) */
.ctm-overlay{position:fixed;inset:0;background:rgba(20,18,15,.7);backdrop-filter:blur(8px);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:24px}
.ctm-overlay.hidden{display:none}
.ctm-card{background:var(--bg-paper);border-radius:var(--r-md);padding:40px;max-width:560px;width:100%;max-height:90vh;overflow-y:auto;border:1px solid var(--rule)}
.ctm-eyebrow{font-size:12px;letter-spacing:0.4em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-bottom:16px}
.ctm-title{font-family:var(--serif);font-weight:300;font-size:32px;color:var(--ink);margin-bottom:8px}
.ctm-sub{color:var(--ink-mute);margin-bottom:24px;line-height:1.6}
.ctm-choices{display:grid;gap:12px}
.ctm-choice{display:flex;gap:16px;align-items:center;padding:18px 20px;border:1px solid var(--rule);border-radius:var(--r-sm);background:transparent;cursor:pointer;text-align:left;transition:all var(--t-base) var(--ease)}
.ctm-choice:hover{border-color:var(--accent);background:var(--bg-cream)}
.ctm-choice-icon{font-size:24px;flex-shrink:0}
.ctm-choice-text{flex:1}
.ctm-choice-title{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--ink);margin-bottom:4px}
.ctm-choice-desc{font-size:13px;color:var(--ink-mute)}
.ctm-choice-arrow{color:var(--accent);font-size:20px}
.ctm-back{margin-top:16px;font-size:13px;color:var(--ink-mute);background:transparent;border:none;cursor:pointer;padding:8px 0}
.ctm-back:hover{color:var(--accent)}
.ctm-input-group{display:flex;gap:8px;margin:14px 0 8px}
.ctm-input{flex:1;padding:12px 14px;background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--r-sm);color:var(--ink);font-size:15px;font-weight:500;outline:none;letter-spacing:.5px}
.ctm-input:focus{border-color:var(--accent);background:var(--bg-cream)}
.ctm-btn{padding:12px 18px;background:var(--ink);color:var(--bg-paper);border:none;border-radius:var(--r-sm);font-size:13px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;transition:background var(--t-base) var(--ease)}
.ctm-btn:hover{background:var(--accent)}
.ctm-btn-primary{background:var(--accent);color:var(--ink)}
.ctm-btn-primary:hover{background:var(--accent-dark);color:var(--bg-paper)}
.ctm-btn-secondary{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.ctm-code-status{min-height:22px;margin-top:6px;font-size:13px;font-weight:500}
.ctm-code-status.is-ok{color:var(--success)}
.ctm-code-status.is-err{color:var(--danger)}
.ctm-code-status.is-loading{color:var(--ink-mute)}
.ctm-actions{display:flex;gap:8px;margin-top:24px;flex-wrap:wrap}

/* Customer badge */
.customer-badge{display:flex;align-items:center;gap:12px;padding:14px 18px;margin:14px 0 18px;background:var(--bg-cream);border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:var(--r-sm);font-size:14px;flex-wrap:wrap}
.cb-label{color:var(--ink-mute);font-weight:500}
.cb-value{color:var(--ink);font-weight:500;flex:1;min-width:140px}
.cb-value.is-partner{color:var(--accent)}
.cb-value.is-pro{color:var(--success)}
.cb-change{background:transparent;border:1px solid var(--rule);color:var(--ink-mute);padding:6px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:500;cursor:pointer;transition:all var(--t-base) var(--ease)}
.cb-change:hover{border-color:var(--ink);color:var(--ink)}

/* Service buttons */
.service-btn{padding:10px 18px;background:transparent;border:1px solid var(--rule);border-radius:var(--r-pill);font-size:13px;color:var(--ink-soft);cursor:pointer;transition:all var(--t-base) var(--ease)}
.service-btn:hover{border-color:var(--accent);color:var(--accent)}
.service-btn.active{background:var(--ink);color:var(--bg-paper);border-color:var(--ink)}

/* Time picker */
.time-picker-dlg{border:1px solid var(--rule);border-radius:var(--r-md);padding:0;background:var(--bg-paper)}
.time-picker-card{padding:24px;display:flex;flex-direction:column;gap:16px}
.time-picker-title{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--ink)}
.time-picker-row{display:flex;gap:8px;align-items:center;justify-content:center}
.time-picker-sep{color:var(--ink-mute)}
.time-picker-actions{display:flex;gap:8px;justify-content:flex-end}

/* Waypoints */
.waypoints-toggle{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-mute);cursor:pointer;margin:8px 0}
.waypoints-wrap{margin-top:8px}
.waypoints-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.waypoints-title{font-size:13px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-mute);font-weight:500}
.waypoints-add{background:transparent;border:1px dashed var(--rule);padding:8px 14px;border-radius:var(--r-sm);font-size:13px;color:var(--accent);cursor:pointer;transition:border-color var(--t-base) var(--ease)}
.waypoints-add:hover{border-color:var(--accent)}
.waypoints-list{display:flex;flex-direction:column;gap:8px}

/* Options grid */
.options-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));gap:8px}
.opt{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--rule);border-radius:var(--r-sm);font-size:14px;cursor:pointer;transition:border-color var(--t-base) var(--ease)}
.opt:hover{border-color:var(--accent)}
.options-col,.options-col-top,.notes-col{display:flex;flex-direction:column;gap:8px}
.options-top-label{font-size:13px;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-mute);font-weight:500;margin-bottom:8px}
.options-note{font-size:13px;color:var(--ink-mute);margin-top:8px}
.options-dd{margin-top:12px;border:1px solid var(--rule);border-radius:var(--r-sm);overflow:hidden}
.options-dd-summary{padding:12px 16px;background:var(--bg-cream);cursor:pointer;font-weight:500;font-size:14px;color:var(--ink)}
.options-dd-body{padding:16px}
.options-dd-meta{font-size:13px;color:var(--ink-mute);margin-top:8px}
.options-dd-caret{color:var(--accent)}

/* OD swap */
.od-field{display:flex;flex-direction:column}
.od-swap-wrap{display:flex;justify-content:center;margin:8px 0}
.od-swap-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--rule);background:var(--bg-paper);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--t-base) var(--ease)}
.od-swap-btn:hover{border-color:var(--accent);color:var(--accent)}

/* Dest label/title (booking pills) */
.dest-label{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);font-weight:500;margin-bottom:8px}
.dest-title{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--ink);margin-bottom:12px}

/* Notice / error / success */
.notice,.error-box,.success-box{padding:16px 20px;border-radius:var(--r-sm);margin:16px 0;font-size:14px}
.notice{background:#E6F1FB;color:#0C447C;border-left:3px solid #378ADD}
.error-box{background:#FCEBEB;color:#791F1F;border-left:3px solid var(--danger)}
.success-box{background:#EAF3DE;color:#27500A;border-left:3px solid var(--success)}

/* Vehicles */
.vehicles-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:24px}
.vehicle-card{background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--r-md);overflow:hidden;transition:transform var(--t-base) var(--ease)}
.vehicle-card:hover{transform:translateY(-4px);border-color:var(--accent)}
.vehicle-image{aspect-ratio:16/10;overflow:hidden}
.vehicle-image img{width:100%;height:100%;object-fit:cover}
.vehicle-card .vehicle-desc{padding:20px}
.vehicle-card h3{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ink);margin-bottom:8px}
.vehicle-meta{font-size:13px;color:var(--ink-mute);letter-spacing:0.05em;display:flex;gap:16px;flex-wrap:wrap;margin-top:8px}

/* Success page */
.success-page{padding:96px 0;display:flex;align-items:center;justify-content:center;min-height:60vh}
.success-card{max-width:560px;background:var(--bg-paper);border:1px solid var(--rule);border-radius:var(--r-md);padding:48px;text-align:center}
.success-icon,.success-check{width:64px;height:64px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:var(--accent);border-radius:50%;color:var(--ink);font-size:28px}
.success-content h1{margin-bottom:16px}
.success-sub,.success-text{color:var(--ink-mute);margin-bottom:24px;line-height:1.6}
.success-infos{background:var(--bg-cream);padding:20px;border-radius:var(--r-sm);text-align:left;margin:24px 0;font-size:14px;color:var(--ink-soft)}
.success-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* Maintenance services */
.services-page{padding:0}
.services-hero-bg{filter:saturate(.9) contrast(1.05)}
.maint-wrap{position:relative;z-index:1;min-height:520px;display:flex;align-items:center;justify-content:center;padding:10px 0}
.maint-overlay{width:min(860px,100%);padding:40px;border-radius:var(--r-md);background:rgba(250,247,242,.95);border:1px solid var(--rule);text-align:center;backdrop-filter:blur(10px)}
.maint-kicker{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:0.4em;text-transform:uppercase;color:var(--accent);font-weight:500;margin-bottom:16px}
.maint-title{font-family:var(--serif);font-weight:300;font-size:clamp(28px,4vw,42px);margin-bottom:16px;color:var(--ink)}
.maint-text{font-size:16px;color:var(--ink-mute);line-height:1.6;margin-bottom:24px;max-width:62ch;margin-inline:auto}
.maint-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.maint-btn{padding:14px 28px;border-radius:var(--r-sm);font-size:13px;letter-spacing:0.06em;text-transform:uppercase;font-weight:500;text-decoration:none;transition:all var(--t-base) var(--ease)}
.maint-btn.primary{background:var(--accent);color:var(--ink)}
.maint-btn:not(.primary){background:transparent;color:var(--ink);border:1px solid var(--ink)}
.maint-help{margin-top:16px;font-size:13px;color:var(--ink-mute)}

/* Services page (real, post-maintenance) */
.services-top{margin-bottom:32px}
.services-nav{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 32px;padding:16px;border-radius:var(--r-md);background:var(--bg-cream);border:1px solid var(--rule)}
.services-cta{padding:16px;border-radius:var(--r-md);background:var(--ink);color:var(--bg-paper);text-align:center;margin-bottom:32px}
.svc-card{border:1px solid var(--rule);border-radius:var(--r-md);background:var(--bg-paper);overflow:hidden;transition:transform var(--t-base) var(--ease)}
.svc-card:hover{transform:translateY(-4px)}
.svc-img{height:200px;background-size:cover;background-position:center}
.svc-body{padding:24px}
.svc-card h2{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ink);margin-bottom:8px}
.svc-card p{color:var(--ink-mute);font-size:14px;line-height:1.6}
.svc-actions{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.svc-actions a{font-size:13px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;color:var(--ink);background:var(--accent);padding:10px 16px;border-radius:var(--r-sm);transition:background var(--t-base) var(--ease)}
.svc-actions a:hover{background:var(--accent-dark);color:var(--bg-paper)}
.svc-actions a.alt{color:var(--ink);background:transparent;border:1px solid var(--ink)}
.svc-actions a.alt:hover{background:var(--ink);color:var(--bg-paper)}
.services-top-trips{margin:32px 0;padding:24px;border-radius:var(--r-md);background:var(--bg-cream);border:1px solid var(--rule)}
.services-top-trips h3{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--ink);margin-bottom:16px}
.trip-links{display:flex;flex-wrap:wrap;gap:8px}
.trip-links a{padding:8px 14px;border-radius:var(--r-pill);font-size:13px;color:var(--ink-soft);background:var(--bg-paper);border:1px solid var(--rule);text-decoration:none;transition:all var(--t-base) var(--ease)}
.trip-links a:hover{border-color:var(--accent);color:var(--accent)}
.services-faq{margin-top:48px;padding:32px;border-radius:var(--r-md);background:var(--bg-cream);border:1px solid var(--rule)}
.services-faq h2{font-family:var(--serif);font-weight:400;font-size:24px;color:var(--ink);margin-bottom:16px}
.faq-item{border-top:1px solid var(--rule);padding:16px 0}
.faq-item:first-of-type{border-top:none;padding-top:0}
.faq-q{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--ink);margin-bottom:6px}
.faq-a{color:var(--ink-mute);line-height:1.6;font-size:14px}

/* nosavis legacy (Google reviews marquee) */
.g-reviews{padding:96px 0}
.g-reviews-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:32px;flex-wrap:wrap;gap:16px}
.g-reviews-title{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.5vw,42px);color:var(--ink);margin:0}
.g-reviews-sub{font-size:14px;color:var(--ink-mute);margin-top:8px}
.g-reviews-actions{display:flex;gap:8px}
.g-stars{color:var(--gold);letter-spacing:3px}
.g-marquee{overflow:hidden;mask-image:linear-gradient(90deg, transparent, black 10%, black 90%, transparent)}
.g-track{display:flex;gap:24px;width:max-content;will-change:transform}
.g-slide,.g-reviews-card{flex-shrink:0;width:340px;background:var(--bg-paper);border:1px solid var(--rule);border-top:1px solid var(--accent);border-radius:var(--r-md);padding:28px}
.g-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.g-who{font-weight:500;font-size:14px;color:var(--ink)}
.g-text{font-family:var(--serif);font-weight:300;font-size:16px;line-height:1.6;color:var(--ink-soft);margin-bottom:16px}
.g-foot{font-size:12px;color:var(--ink-mute);letter-spacing:0.05em}
.g-link{color:var(--accent);font-weight:500;font-size:13px;letter-spacing:0.06em;text-transform:uppercase}
.g-link:hover{color:var(--accent-dark)}
.g-brand{font-size:13px;color:var(--ink-mute);letter-spacing:0.06em}
.g-muted{color:var(--ink-faint)}

/* Captcha */
.captcha-wrap{margin:16px 0}

/* Map */
.map-wrap{margin:24px 0;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--rule)}
.map-title{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--ink);margin-bottom:12px}

/* Misc helpers */
.note-box{background:var(--bg-cream);border-left:3px solid var(--accent);padding:16px 20px;border-radius:var(--r-sm);font-size:14px;color:var(--ink-soft);margin:16px 0}
.warning{color:var(--warning);font-weight:500}
.fine{font-size:13px;color:var(--ink-mute)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.span-2{grid-column:span 2}
@media (max-width:900px){.split{grid-template-columns:1fr}.span-2{grid-column:auto}}
.cta{font-weight:500}
.primary{color:var(--accent)}
.sep{color:var(--ink-faint);margin:0 6px}
.hidden{display:none !important}
.ride-only,.hourly-only{display:none}
.service-active-ride .ride-only,
.service-active-hourly .hourly-only{display:block}
.cards{display:grid;grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));gap:16px}
.traffic-note{font-size:13px;color:var(--ink-mute);margin-top:8px}


/* ==============================================================
   21. RESPONSIVE
   ============================================================== */
@media (max-width:900px){
  /* Header / nav */
  .utility-bar .container{padding:8px 0;font-size:12px;gap:12px}
  .utility-left{gap:14px}
  .utility-left span{font-size:11px}
  .utility-right{display:none}
  .nav{display:none}
  .burger{display:flex}

  /* Sections */
  .section,
  .services-section,
  .reviews-section,
  .zones-section,
  .faq-section,
  .electric,
  .cta-final{padding:72px 0}

  /* Hero */
  .hero{min-height:75vh}
  .hero-inner{padding:80px 0 60px;text-align:left}

  /* Trust bar */
  .trust-bar .container{grid-template-columns:repeat(2,1fr)}
  .trust-item{border-bottom:1px solid var(--rule);padding:24px 16px}
  .trust-item:nth-child(2){border-right:none}
  .trust-item:nth-last-child(-n+2){border-bottom:none}
  .trust-figure{font-size:28px}

  /* Services */
  .services-grid{grid-template-columns:1fr;gap:48px}

  /* Electric */
  .electric .container,
  .zones-section .container{grid-template-columns:1fr;gap:48px}

  /* Reviews */
  .reviews-grid{grid-template-columns:1fr;gap:24px}
  .reviews-header{flex-direction:column;align-items:flex-start}
  .reviews-rating{text-align:left}

  /* Footer */
  .footer-grid,.footer-grid-3{grid-template-columns:1fr 1fr;gap:40px}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  .footer-legal-inline{margin-top:8px}

  /* Zones list */
  .zones-list{grid-template-columns:1fr}

  /* Container */
  .container{width:min(var(--container), 92%)}
}

@media (max-width:560px){
  .footer-grid,.footer-grid-3{grid-template-columns:1fr}
  .hero-actions{flex-direction:column;align-items:flex-start}
  .hero-actions a{width:100%;justify-content:center;text-align:center}
  .cta-final-actions a{width:100%;justify-content:center;text-align:center}
  .cookie-banner{left:12px;right:12px;bottom:12px}
  .cookie-card{padding:18px 20px}
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}


/* ==============================================================
   22. BOOKING PREMIUM (Lot 2) — Maison de chauffeur
   Toutes les classes booking sont préfixées .bk-
   ============================================================== */

/* ----------- Page wrapper & hero ----------- */
.bk-page{
  padding:64px 0 96px;
  background:var(--bg-paper);
}
.bk-hero{
  text-align:center;
  margin-bottom:48px;
}
.bk-hero .section-eyebrow{
  justify-content:center;
}
.bk-hero h1{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(36px,4.5vw,56px);
  letter-spacing:-0.02em;
  margin-bottom:16px;
}
.bk-hero h1 em{font-style:italic;color:var(--accent)}
.bk-hero p{
  font-size:18px;
  line-height:1.6;
  color:var(--ink-mute);
  max-width:580px;
  margin:0 auto;
}

/* ----------- Trust strip mini ----------- */
.bk-trust{
  display:flex;
  justify-content:center;
  gap:48px;
  flex-wrap:wrap;
  padding:24px 0;
  margin-bottom:48px;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:0.02em;
}
.bk-trust span{display:flex;align-items:center;gap:10px}
.bk-trust span::before{
  content:"";
  width:6px;height:6px;
  background:var(--accent);
  border-radius:50%;
  flex-shrink:0;
}

/* ----------- Layout 2 colonnes ----------- */
.bk-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:64px;
  align-items:start;
}
@media (max-width:1024px){
  .bk-layout{grid-template-columns:1fr;gap:32px}
}

/* ----------- Stepper ----------- */
.bk-stepper{
  display:flex;
  justify-content:space-between;
  margin-bottom:48px;
  position:relative;
  counter-reset:step;
}
.bk-stepper::before{
  content:"";
  position:absolute;
  top:18px;
  left:18px;
  right:18px;
  height:1px;
  background:var(--rule);
  z-index:0;
}
.bk-stepper::after{
  content:"";
  position:absolute;
  top:18px;
  left:18px;
  width:0;
  height:1px;
  background:var(--accent);
  transition:width var(--t-slow) var(--ease);
  z-index:0;
}
.bk-stepper[data-progress="2"]::after{width:calc(33.33% - 12px)}
.bk-stepper[data-progress="3"]::after{width:calc(66.66% - 24px)}
.bk-stepper[data-progress="4"]::after{width:calc(100% - 36px)}

.bk-step{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  flex:1;
  cursor:default;
}
.bk-step-circle{
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--serif);
  font-style:italic;
  font-size:15px;
  color:var(--ink-mute);
  transition:all var(--t-base) var(--ease);
}
.bk-step.is-active .bk-step-circle{
  background:var(--ink);
  border-color:var(--ink);
  color:var(--bg-paper);
}
.bk-step.is-done .bk-step-circle{
  background:var(--accent);
  border-color:var(--accent);
  color:var(--bg-paper);
}
.bk-step.is-done .bk-step-circle::before{
  content:"✓";
  font-style:normal;
}
.bk-step.is-done .bk-step-circle span{display:none}
.bk-step-label{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
  text-align:center;
  transition:color var(--t-base) var(--ease);
}
.bk-step.is-active .bk-step-label,
.bk-step.is-done .bk-step-label{color:var(--ink)}

@media (max-width:640px){
  .bk-step-label{display:none}
  .bk-stepper{margin-bottom:32px}
}

/* ----------- Panes (étapes) ----------- */
.bk-pane{
  display:none;
  animation:bkFadeIn .4s var(--ease);
}
.bk-pane.is-active{display:block}

@keyframes bkFadeIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}

.bk-pane-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:32px;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin-bottom:8px;
}
.bk-pane-title em{font-style:italic;color:var(--accent)}
.bk-pane-lead{
  font-size:16px;
  color:var(--ink-mute);
  margin-bottom:32px;
  line-height:1.6;
}

/* ----------- Choice cards (Profil + Driver pref + Service) ----------- */
.bk-choice-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
  margin-bottom:24px;
}
.bk-choice{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px 20px;
  cursor:pointer;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:12px;
  transition:all var(--t-base) var(--ease);
  font-family:var(--sans);
  color:var(--ink);
}
.bk-choice:hover{
  border-color:var(--accent);
  background:var(--bg-cream);
}
.bk-choice.is-selected{
  border-color:var(--ink);
  background:var(--ink);
  color:var(--bg-paper);
}
.bk-choice-icon{
  font-size:28px;
  line-height:1;
}
.bk-choice-title{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  letter-spacing:-0.01em;
}
.bk-choice-desc{
  font-size:13px;
  line-height:1.5;
  color:var(--ink-mute);
}
.bk-choice.is-selected .bk-choice-desc{color:rgba(250,247,242,.7)}

/* ----------- Partner code section ----------- */
.bk-partner-section{
  background:var(--bg-cream);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px;
  margin-bottom:24px;
}
.bk-partner-section h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  margin-bottom:8px;
  color:var(--ink);
}
.bk-partner-section p{
  font-size:14px;
  color:var(--ink-mute);
  margin-bottom:16px;
  line-height:1.5;
}
.bk-partner-row{
  display:flex;
  gap:8px;
  align-items:stretch;
}
.bk-partner-row input{
  flex:1;
  padding:14px 16px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:15px;
  font-weight:500;
  letter-spacing:0.04em;
  color:var(--ink);
  font-family:var(--sans);
}
.bk-partner-row input:focus{
  border-color:var(--accent);
  outline:none;
}
.bk-partner-validate{
  padding:14px 24px;
  background:var(--ink);
  color:var(--bg-paper);
  border:none;
  border-radius:var(--r-sm);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.06em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background var(--t-base) var(--ease);
}
.bk-partner-validate:hover{background:var(--accent)}
.bk-partner-status{
  margin-top:12px;
  font-size:13px;
  font-weight:500;
  min-height:20px;
}
.bk-partner-status.is-ok{color:var(--success)}
.bk-partner-status.is-err{color:var(--danger)}
.bk-partner-status.is-loading{color:var(--ink-mute)}

.bk-partner-alt{
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid var(--rule);
  font-size:13px;
  color:var(--ink-mute);
}
.bk-partner-alt a{color:var(--accent);font-weight:500}
.bk-partner-alt a:hover{color:var(--accent-dark)}

/* ----------- Service pills ----------- */
.bk-service-pills{
  display:flex;
  gap:8px;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.bk-service-pill{
  padding:14px 22px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-pill);
  font-family:var(--sans);
  font-size:14px;
  font-weight:500;
  letter-spacing:0.02em;
  color:var(--ink-soft);
  cursor:pointer;
  transition:all var(--t-base) var(--ease);
}
.bk-service-pill:hover{border-color:var(--accent);color:var(--accent)}
.bk-service-pill.is-selected{
  background:var(--ink);
  color:var(--bg-paper);
  border-color:var(--ink);
}

/* ----------- Form fields ----------- */
.bk-field{
  margin-bottom:20px;
}
.bk-field label,
.bk-label{
  display:block;
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
  margin-bottom:8px;
}
.bk-input,
.bk-field input[type="text"],
.bk-field input[type="email"],
.bk-field input[type="tel"],
.bk-field input[type="date"],
.bk-field input[type="time"],
.bk-field input[type="number"],
.bk-field select,
.bk-field textarea{
  width:100%;
  padding:14px 16px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:15px;
  color:var(--ink);
  transition:border-color var(--t-base) var(--ease);
}
.bk-field input:focus,
.bk-field select:focus,
.bk-field textarea:focus,
.bk-input:focus{
  outline:none;
  border-color:var(--accent);
}
.bk-field textarea{
  min-height:100px;
  resize:vertical;
  font-family:var(--sans);
}
.bk-field-row{
  display:grid;
  gap:16px;
}
.bk-field-row.cols-2{grid-template-columns:1fr 1fr}
.bk-field-row.cols-3{grid-template-columns:1fr 1fr 1fr}
@media (max-width:640px){
  .bk-field-row.cols-2,
  .bk-field-row.cols-3{grid-template-columns:1fr}
}

/* ----------- OD swap (Pickup ↔ Dropoff) ----------- */
.bk-od-wrap{
  position:relative;
  margin-bottom:20px;
}
.bk-od-wrap .bk-field{margin-bottom:8px}
.bk-od-swap{
  position:absolute;
  top:50%;
  right:-12px;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  color:var(--ink-mute);
  z-index:2;
  transition:all var(--t-base) var(--ease);
}
.bk-od-swap:hover{
  border-color:var(--accent);
  color:var(--accent);
  transform:translateY(-50%) rotate(180deg);
}
@media (max-width:640px){
  .bk-od-swap{right:auto;left:50%;top:50%;transform:translate(-50%,-50%)}
  .bk-od-swap:hover{transform:translate(-50%,-50%) rotate(180deg)}
}

/* ----------- Waypoints ----------- */
.bk-waypoints-toggle{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:var(--ink-mute);
  cursor:pointer;
  margin:8px 0 16px;
  user-select:none;
}
.bk-waypoints-toggle input{margin:0}
.bk-waypoints-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px;
}
.bk-waypoint-item{
  display:flex;
  gap:8px;
  align-items:center;
}
.bk-waypoint-item input{flex:1}
.bk-waypoint-remove{
  width:38px;height:38px;
  flex-shrink:0;
  border-radius:var(--r-sm);
  border:1px solid var(--rule);
  background:transparent;
  cursor:pointer;
  font-size:14px;
  color:var(--ink-mute);
  transition:all var(--t-base) var(--ease);
}
.bk-waypoint-remove:hover{border-color:var(--danger);color:var(--danger)}
.bk-waypoint-add{
  background:transparent;
  border:1px dashed var(--rule);
  padding:10px 16px;
  border-radius:var(--r-sm);
  font-size:13px;
  font-weight:500;
  color:var(--accent);
  cursor:pointer;
  letter-spacing:0.02em;
  transition:all var(--t-base) var(--ease);
}
.bk-waypoint-add:hover{
  border-color:var(--accent);
  background:var(--bg-cream);
}

/* ----------- Vehicle cards ----------- */
.bk-vehicle-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:16px;
  margin-bottom:24px;
}
.bk-vehicle{
  position:relative;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  overflow:hidden;
  cursor:pointer;
  text-align:left;
  transition:all var(--t-base) var(--ease);
  font-family:var(--sans);
  color:var(--ink);
  display:flex;
  flex-direction:column;
}
.bk-vehicle:hover{
  border-color:var(--accent);
  transform:translateY(-2px);
}
.bk-vehicle.is-selected{
  border-color:var(--ink);
  border-width:2px;
}
.bk-vehicle.is-selected::after{
  content:"✓";
  position:absolute;
  top:12px;
  right:12px;
  width:28px;height:28px;
  border-radius:50%;
  background:var(--ink);
  color:var(--bg-paper);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  z-index:2;
}
.bk-vehicle-img{
  aspect-ratio:16/10;
  background:var(--bg-cream);
  background-size:cover;
  background-position:center;
}
.bk-vehicle-body{
  padding:18px 20px;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.bk-vehicle-name{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin:0;
}
.bk-vehicle-meta{
  font-size:13px;
  color:var(--ink-mute);
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}
.bk-vehicle-tag{
  display:inline-block;
  margin-top:6px;
  padding:4px 10px;
  background:rgba(168,130,94,.12);
  color:var(--accent-dark);
  border-radius:var(--r-pill);
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  font-weight:500;
  width:fit-content;
}

/* ----------- Driver preference (3 mini-cards) ----------- */
.bk-pref-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-bottom:24px;
}
@media (max-width:540px){
  .bk-pref-grid{grid-template-columns:1fr}
}
.bk-pref{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:16px 18px;
  cursor:pointer;
  text-align:center;
  transition:all var(--t-base) var(--ease);
  font-family:var(--sans);
  color:var(--ink);
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:center;
}
.bk-pref:hover{border-color:var(--accent);background:var(--bg-cream)}
.bk-pref.is-selected{
  border-color:var(--ink);
  background:var(--ink);
  color:var(--bg-paper);
}
.bk-pref-icon{font-size:20px}
.bk-pref-name{
  font-family:var(--serif);
  font-weight:400;
  font-size:15px;
}
.bk-pref-sub{
  font-size:11px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--ink-mute);
}
.bk-pref.is-selected .bk-pref-sub{color:rgba(250,247,242,.7)}

/* ----------- Options checkboxes ----------- */
.bk-options{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:8px;
  margin-bottom:8px;
}
.bk-opt{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:14px;
  cursor:pointer;
  transition:all var(--t-base) var(--ease);
  user-select:none;
}
.bk-opt:hover{border-color:var(--accent)}
.bk-opt:has(input:checked){
  background:var(--bg-cream);
  border-color:var(--accent);
}
.bk-opt input{accent-color:var(--accent)}
.bk-opt-note{
  font-size:12px;
  color:var(--ink-mute);
  font-style:italic;
  margin-top:8px;
}

/* ----------- Map ----------- */
.bk-map-wrap{
  margin:24px 0;
  border-radius:var(--r-md);
  overflow:hidden;
  border:1px solid var(--rule);
  background:var(--bg-cream);
}
.bk-map{
  width:100%;
  height:280px;
}

/* ----------- Step navigation buttons ----------- */
.bk-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid var(--rule);
  flex-wrap:wrap;
}
.bk-back{
  background:transparent;
  border:none;
  color:var(--ink-mute);
  cursor:pointer;
  font-family:var(--sans);
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  font-weight:500;
  padding:14px 0;
  transition:color var(--t-base) var(--ease);
}
.bk-back:hover{color:var(--accent)}
.bk-next,
.bk-submit{
  background:var(--ink);
  color:var(--bg-paper);
  border:1px solid var(--ink);
  padding:16px 32px;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:all var(--t-base) var(--ease);
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.bk-next:hover,
.bk-submit:hover{
  background:var(--accent);
  border-color:var(--accent);
  color:var(--ink);
}
.bk-submit{
  background:var(--accent);
  color:var(--ink);
  border-color:var(--accent);
  padding:18px 36px;
}
.bk-submit:hover{
  background:var(--accent-dark);
  border-color:var(--accent-dark);
  color:var(--bg-paper);
}
.bk-submit:disabled,
.bk-next:disabled{
  opacity:.5;
  cursor:not-allowed;
}

/* ----------- Recap sticky ----------- */
.bk-recap{
  position:sticky;
  top:120px;
  background:var(--bg-cream);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px;
}
@media (max-width:1024px){
  .bk-recap{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    top:auto;
    z-index:60;
    border-radius:var(--r-md) var(--r-md) 0 0;
    border-bottom:none;
    box-shadow:0 -10px 40px rgba(20,18,15,.15);
    transform:translateY(calc(100% - 88px));
    transition:transform var(--t-base) var(--ease);
    padding:0;
  }
  .bk-recap.is-expanded{
    transform:translateY(0);
  }
}
.bk-recap-toggle{
  display:none;
  width:100%;
  padding:20px 24px;
  background:transparent;
  border:none;
  cursor:pointer;
  text-align:left;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
@media (max-width:1024px){
  .bk-recap-toggle{display:flex}
  .bk-recap-content{padding:0 24px 24px;display:none}
  .bk-recap.is-expanded .bk-recap-content{display:block}
}
.bk-recap-toggle-label{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
}
.bk-recap-toggle-price{
  font-family:var(--serif);
  font-weight:300;
  font-size:24px;
  color:var(--accent);
  letter-spacing:-0.01em;
}
.bk-recap-toggle-chev{
  font-size:18px;
  color:var(--ink-mute);
  margin-left:auto;
  transition:transform var(--t-base) var(--ease);
}
.bk-recap.is-expanded .bk-recap-toggle-chev{transform:rotate(180deg)}

.bk-recap h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  letter-spacing:-0.01em;
  margin-bottom:20px;
  padding-bottom:16px;
  border-bottom:1px solid var(--rule);
  color:var(--ink);
}
.bk-recap-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(229,223,211,.5);
  font-size:13px;
}
.bk-recap-row:last-of-type{border-bottom:none}
.bk-recap-key{
  color:var(--ink-mute);
  letter-spacing:0.05em;
  flex-shrink:0;
}
.bk-recap-val{
  color:var(--ink);
  font-weight:500;
  text-align:right;
  word-break:break-word;
}
.bk-recap-val.is-empty{color:var(--ink-faint);font-weight:400;font-style:italic}

.bk-recap-price{
  margin-top:24px;
  padding:20px;
  background:var(--bg-paper);
  border-top:2px solid var(--accent);
  border-radius:var(--r-sm);
  text-align:center;
}
.bk-recap-price-label{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  font-weight:500;
  margin-bottom:6px;
}
.bk-recap-price-value{
  font-family:var(--serif);
  font-weight:300;
  font-size:42px;
  letter-spacing:-0.02em;
  color:var(--accent);
  line-height:1;
  transition:color .3s var(--ease);
}
.bk-recap-price-value.is-pending{color:var(--ink-faint)}
.bk-recap-price-mod{
  margin-top:8px;
  font-size:12px;
  color:var(--ink-mute);
  letter-spacing:0.02em;
}
.bk-recap-price-mod.is-discount{color:var(--success)}
.bk-recap-price-mod.is-markup{color:var(--warning)}

.bk-recap-help{
  margin-top:16px;
  font-size:12px;
  color:var(--ink-mute);
  font-style:italic;
  line-height:1.5;
  text-align:center;
}

/* ----------- Section "Trajets populaires" ----------- */
.bk-popular{
  margin-top:96px;
  padding-top:64px;
  border-top:1px solid var(--rule);
}
.bk-popular-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:28px;
  margin-bottom:24px;
  color:var(--ink);
}
.bk-popular-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.bk-popular-pill{
  padding:10px 16px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-pill);
  font-size:13px;
  color:var(--ink-soft);
  cursor:pointer;
  transition:all var(--t-base) var(--ease);
  font-family:var(--sans);
}
.bk-popular-pill:hover{
  border-color:var(--accent);
  color:var(--accent);
  background:var(--bg-cream);
}

/* ----------- Captcha + erreurs ----------- */
.bk-captcha{
  margin:24px 0;
  display:flex;
  justify-content:center;
}
.bk-error{
  background:#FCEBEB;
  color:#791F1F;
  border-left:3px solid var(--danger);
  padding:14px 18px;
  border-radius:var(--r-sm);
  font-size:14px;
  margin:16px 0;
}
.bk-error.hidden{display:none}

/* ----------- Customer badge (étape 1 résumé) ----------- */
.bk-customer-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 14px;
  background:var(--bg-cream);
  border:1px solid var(--rule);
  border-radius:var(--r-pill);
  font-size:13px;
  margin-bottom:24px;
}
.bk-customer-badge .label{color:var(--ink-mute);letter-spacing:0.05em}
.bk-customer-badge .value{font-weight:500;color:var(--ink)}
.bk-customer-badge .value.is-partner{color:var(--accent)}
.bk-customer-badge .value.is-pro{color:var(--warning)}
.bk-customer-badge .change{
  background:transparent;
  border:none;
  color:var(--ink-mute);
  font-size:12px;
  cursor:pointer;
  text-decoration:underline;
  padding:0;
  margin-left:6px;
}
.bk-customer-badge .change:hover{color:var(--accent)}

/* Spacer pour mobile bottom-bar */
@media (max-width:1024px){
  .bk-page{padding-bottom:140px}
}


/* ==============================================================
   23. PAGES STRUCTURELLES (Lot 3.1) — tarifs, flotte, services
   Réutilise au max les variables et classes du Lot 1.
   ============================================================== */

/* ----------- Section générique des pages structurelles ----------- */
.page-section{
  margin-top:80px;
}
.page-section:first-of-type{margin-top:48px}

.section-eyebrow.center{justify-content:center;display:flex}

.section-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(28px,3.2vw,40px);
  letter-spacing:-0.015em;
  line-height:1.2;
  margin:8px 0 16px;
  color:var(--ink);
}
.section-title em{font-style:italic;color:var(--accent)}

.section-lead{
  font-size:17px;
  line-height:1.65;
  color:var(--ink-mute);
  max-width:680px;
  margin-bottom:32px;
}

.muted-note{
  font-size:13px;
  color:var(--ink-mute);
  font-style:italic;
  margin-top:16px;
  line-height:1.5;
}


/* ============================================================
   TARIFS — Engagement cards
   ============================================================ */
.commit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
  margin-top:32px;
}
.commit-card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:28px 24px;
  position:relative;
}
.commit-num{
  font-family:var(--serif);
  font-weight:300;
  font-size:18px;
  letter-spacing:0.1em;
  color:var(--accent);
  margin-bottom:12px;
}
.commit-card h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  letter-spacing:-0.01em;
  margin-bottom:10px;
  color:var(--ink);
}
.commit-card p{
  font-size:14px;
  line-height:1.6;
  color:var(--ink-soft);
  margin:0;
}

/* ============================================================
   TARIFS — Price cards (Berline / Van)
   ============================================================ */
.price-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:24px;
  margin-top:32px;
}
.price-card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:32px 28px;
  position:relative;
  display:flex;
  flex-direction:column;
}
.price-card-featured{
  border-color:var(--accent);
  background:var(--bg-cream);
}
.price-card-tag{
  position:absolute;
  top:-12px;
  right:24px;
  background:var(--accent);
  color:var(--bg-paper);
  padding:5px 14px;
  font-size:11px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-weight:500;
  border-radius:var(--r-pill);
}
.price-card-head{
  margin-bottom:20px;
  padding-bottom:16px;
  border-bottom:1px solid var(--rule);
}
.price-card-head h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:24px;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin-bottom:6px;
}
.price-card-sub{
  font-size:13px;
  color:var(--ink-mute);
  letter-spacing:0.02em;
}
.price-list{
  list-style:none;
  padding:0;
  margin:0 0 24px;
  flex:1;
}
.price-list li{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:11px 0;
  border-bottom:1px solid rgba(229,223,211,.5);
  gap:12px;
}
.price-list li:last-child{border-bottom:none}
.price-key{
  font-size:14px;
  color:var(--ink-soft);
  letter-spacing:0.01em;
}
.price-val{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  color:var(--accent);
  letter-spacing:-0.01em;
  flex-shrink:0;
}
.price-card-cta{
  display:inline-block;
  text-align:center;
  padding:14px 24px;
  background:var(--ink);
  color:var(--bg-paper);
  text-decoration:none;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.06em;
  text-transform:uppercase;
  transition:all var(--t-base) var(--ease);
}
.price-card-cta:hover{
  background:var(--accent);
  color:var(--ink);
}

/* ============================================================
   TARIFS — Formule de calcul
   ============================================================ */
.howto-formula{
  background:var(--bg-cream);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:32px;
  margin:32px 0;
  max-width:640px;
}
.formula-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 0;
  font-family:var(--sans);
  font-size:15px;
  color:var(--ink-soft);
}
.formula-row + .formula-row{border-top:1px solid var(--rule)}
.formula-op{
  font-family:var(--serif);
  font-style:italic;
  font-size:22px;
  color:var(--accent);
}
.formula-result .formula-label{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  color:var(--ink);
}
.formula-result-note{
  font-size:12px;
  color:var(--ink-mute);
  font-style:italic;
}
.howto-explain p{
  font-size:15px;
  line-height:1.7;
  color:var(--ink-soft);
  margin-bottom:16px;
}

/* ============================================================
   TARIFS — Suppléments
   ============================================================ */
.supp-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:20px;
  margin-top:32px;
}
.supp-card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px;
}
.supp-card h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  margin-bottom:12px;
  color:var(--ink);
}
.supp-card p{
  font-size:14px;
  line-height:1.65;
  color:var(--ink-soft);
  margin:0;
}

/* ============================================================
   TARIFS — Profils
   ============================================================ */
.profile-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:20px;
  margin-top:32px;
}
.profile-card{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:28px 24px;
  text-align:center;
}
.profile-icon{
  font-size:32px;
  margin-bottom:12px;
}
.profile-card h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:22px;
  letter-spacing:-0.01em;
  margin-bottom:8px;
  color:var(--ink);
}
.profile-modifier{
  display:inline-block;
  padding:4px 14px;
  background:var(--bg-cream);
  border-radius:var(--r-pill);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.04em;
  color:var(--ink-mute);
  margin-bottom:16px;
}
.profile-modifier-up{
  background:rgba(184,134,11,.12);
  color:var(--warning);
}
.profile-modifier-down{
  background:rgba(33,138,33,.12);
  color:var(--success);
}
.profile-card p{
  font-size:14px;
  line-height:1.6;
  color:var(--ink-soft);
  margin:0;
}

/* ============================================================
   TARIFS — Table d'exemples
   ============================================================ */
.examples-table-wrap{
  overflow-x:auto;
  margin-top:32px;
  border:1px solid var(--rule);
  border-radius:var(--r-md);
}
.examples-table{
  width:100%;
  border-collapse:collapse;
  font-family:var(--sans);
}
.examples-table th{
  background:var(--bg-cream);
  padding:14px 18px;
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--ink-mute);
  text-align:left;
  border-bottom:1px solid var(--rule);
}
.examples-table th:nth-child(2),
.examples-table th:nth-child(3),
.examples-table th:nth-child(4){text-align:right}
.examples-table td{
  padding:14px 18px;
  font-size:15px;
  color:var(--ink);
  border-bottom:1px solid rgba(229,223,211,.5);
}
.examples-table td:nth-child(2){
  color:var(--ink-mute);
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.examples-table td:nth-child(3),
.examples-table td:nth-child(4){
  text-align:right;
  font-family:var(--serif);
  font-weight:400;
  color:var(--accent);
  font-variant-numeric:tabular-nums;
}
.examples-table tr:last-child td{border-bottom:none}
.examples-table tr:hover td{background:var(--bg-cream)}


/* ============================================================
   FLOTTE — Détail véhicule (alternance)
   ============================================================ */
.vehicle-detail{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center;
  margin:96px 0;
}
.vehicle-detail.is-alt{
  direction:rtl;
}
.vehicle-detail.is-alt > *{direction:ltr}
@media (max-width:900px){
  .vehicle-detail,
  .vehicle-detail.is-alt{
    grid-template-columns:1fr;
    gap:32px;
    direction:ltr;
    margin:64px 0;
  }
}
.vehicle-detail-img{
  position:relative;
  border-radius:var(--r-md);
  overflow:hidden;
  background:var(--bg-cream);
  aspect-ratio:4/3;
}
.vehicle-detail-img img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.vehicle-detail-badge{
  position:absolute;
  top:16px;
  left:16px;
  padding:8px 16px;
  background:var(--accent);
  color:var(--bg-paper);
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:500;
  border-radius:var(--r-pill);
  letter-spacing:0.1em;
}
.vehicle-detail-title{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(28px,3.5vw,40px);
  letter-spacing:-0.02em;
  margin:8px 0 16px;
  color:var(--ink);
}
.vehicle-detail-meta{
  display:flex;
  gap:24px;
  flex-wrap:wrap;
  margin-bottom:20px;
  padding-bottom:20px;
  border-bottom:1px solid var(--rule);
  font-size:14px;
  color:var(--ink-mute);
}
.vehicle-detail-meta span strong{
  font-family:var(--serif);
  font-weight:400;
  color:var(--accent);
  font-size:18px;
  margin-right:4px;
}
.vehicle-detail-philo{
  font-size:16px;
  line-height:1.7;
  color:var(--ink-soft);
  margin-bottom:24px;
}
.vehicle-section-h3{
  font-family:var(--sans);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin:24px 0 12px;
}
.vehicle-features{
  list-style:none;
  padding:0;
  margin:0 0 16px;
}
.vehicle-features li{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:16px;
  padding:10px 0;
  border-bottom:1px solid rgba(229,223,211,.5);
}
.vehicle-features li:last-child{border-bottom:none}
.vehicle-feat-key{
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:500;
  align-self:center;
}
.vehicle-feat-val{
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.5;
}
.vehicle-usecases{
  list-style:none;
  padding:0;
  margin:0;
}
.vehicle-usecases li{
  position:relative;
  padding:6px 0 6px 22px;
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.5;
}
.vehicle-usecases li::before{
  content:"→";
  position:absolute;
  left:0;
  color:var(--accent);
  font-family:var(--serif);
  font-style:italic;
}
.vehicle-detail-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:24px;
}

/* ============================================================
   FLOTTE — Amenities grid
   ============================================================ */
.amenities-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:20px;
  margin-top:32px;
}
.amenity{
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-md);
  padding:24px;
  text-align:left;
}
.amenity-icon{
  font-size:24px;
  margin-bottom:12px;
}
.amenity h3{
  font-family:var(--serif);
  font-weight:400;
  font-size:17px;
  margin-bottom:8px;
  color:var(--ink);
}
.amenity p{
  font-size:13px;
  line-height:1.55;
  color:var(--ink-soft);
  margin:0;
}

/* ============================================================
   FLOTTE — Compare table
   ============================================================ */
.compare-table-wrap{
  overflow-x:auto;
  margin-top:32px;
  border:1px solid var(--rule);
  border-radius:var(--r-md);
}
.compare-table{
  width:100%;
  border-collapse:collapse;
  font-family:var(--sans);
}
.compare-table th{
  background:var(--bg-cream);
  padding:14px 18px;
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--ink-mute);
  text-align:left;
  border-bottom:1px solid var(--rule);
}
.compare-table td{
  padding:14px 18px;
  font-size:14px;
  border-bottom:1px solid rgba(229,223,211,.5);
}
.compare-table td:first-child{color:var(--ink)}
.compare-table td.ok{color:var(--success);font-weight:500}
.compare-table td.meh{color:var(--ink-mute);font-style:italic}
.compare-table tr:last-child td{border-bottom:none}


/* ============================================================
   SERVICES — Anchor nav (mini)
   ============================================================ */
.services-anchor-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
  margin-bottom:64px;
  padding:16px 0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.services-anchor-nav a{
  padding:8px 16px;
  background:transparent;
  border:1px solid transparent;
  border-radius:var(--r-pill);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  color:var(--ink-soft);
  text-decoration:none;
  letter-spacing:0.02em;
  transition:all var(--t-base) var(--ease);
}
.services-anchor-nav a:hover{
  border-color:var(--accent);
  color:var(--accent);
}

/* ============================================================
   SERVICES — Service blocks (alternance)
   ============================================================ */
.service-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center;
  margin:96px 0;
  scroll-margin-top:120px;
}
.service-block.is-alt{direction:rtl}
.service-block.is-alt > *{direction:ltr}
@media (max-width:900px){
  .service-block,
  .service-block.is-alt{
    grid-template-columns:1fr;
    gap:32px;
    direction:ltr;
    margin:64px 0;
  }
}
.service-block-img{
  border-radius:var(--r-md);
  overflow:hidden;
  background:var(--bg-cream);
  aspect-ratio:4/3;
}
.service-block-img img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.service-block-body h2{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(26px,3vw,36px);
  letter-spacing:-0.015em;
  margin:8px 0 16px;
  color:var(--ink);
  line-height:1.2;
}
.service-block-body h2 em{font-style:italic;color:var(--accent)}
.service-block-body p{
  font-size:15px;
  line-height:1.7;
  color:var(--ink-soft);
  margin-bottom:16px;
}
.service-points{
  list-style:none;
  padding:0;
  margin:24px 0;
}
.service-points li{
  position:relative;
  padding:8px 0 8px 28px;
  font-size:14px;
  line-height:1.55;
  color:var(--ink-soft);
}
.service-points li::before{
  content:"";
  position:absolute;
  left:0;top:14px;
  width:14px;height:1px;
  background:var(--accent);
}
.service-block-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:24px;
}
.btn-link{
  font-family:var(--sans);
  font-size:13px;
  color:var(--ink-mute);
  text-decoration:none;
  border-bottom:1px solid var(--rule);
  padding:10px 0;
  transition:all var(--t-base) var(--ease);
  letter-spacing:0.02em;
}
.btn-link:hover{
  color:var(--accent);
  border-bottom-color:var(--accent);
}

/* ============================================================
   SERVICES — Trip grid (liens vers pages locales)
   ============================================================ */
.trip-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:8px;
  margin-top:32px;
}
.trip-link{
  display:block;
  padding:18px 20px;
  background:var(--bg-paper);
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:14px;
  font-weight:500;
  color:var(--ink-soft);
  text-decoration:none;
  text-align:center;
  letter-spacing:0.01em;
  transition:all var(--t-base) var(--ease);
}
.trip-link:hover{
  border-color:var(--accent);
  color:var(--accent);
  background:var(--bg-cream);
}


/* ============================================================
   FAQ — accordion
   ============================================================ */
.faq-list{
  margin-top:24px;
  border-top:1px solid var(--rule);
}
.faq-item{
  border-bottom:1px solid var(--rule);
  padding:20px 0;
  cursor:pointer;
}
.faq-item summary{
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  letter-spacing:-0.01em;
  color:var(--ink);
  padding-right:24px;
  position:relative;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:"+";
  position:absolute;
  right:0;top:50%;
  transform:translateY(-50%);
  width:24px;height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--serif);
  font-weight:300;
  font-size:24px;
  color:var(--accent);
  transition:transform var(--t-base) var(--ease);
}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq-item p{
  margin-top:14px;
  font-size:15px;
  line-height:1.7;
  color:var(--ink-soft);
}
.faq-item p a{color:var(--accent);font-weight:500;border-bottom:1px solid var(--accent)}


/* ============================================================
   CTA FINAL BLOCK (commun aux 3 pages)
   ============================================================ */
.cta-final-block{
  margin-top:96px;
  padding:64px 32px;
  background:var(--ink);
  color:var(--bg-paper);
  border-radius:var(--r-md);
  text-align:center;
}
.cta-final-block h2{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(28px,3.2vw,40px);
  letter-spacing:-0.015em;
  margin-bottom:12px;
  color:var(--bg-paper);
}
.cta-final-block p{
  font-size:16px;
  color:rgba(250,247,242,.7);
  margin-bottom:32px;
  line-height:1.6;
}
.cta-final-actions{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}
.cta-final-actions .btn-primary{
  background:var(--accent);
  color:var(--ink);
  border:1px solid var(--accent);
  padding:16px 32px;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  text-decoration:none;
  transition:all var(--t-base) var(--ease);
  display:inline-block;
}
.cta-final-actions .btn-primary:hover{
  background:var(--accent-dark);
  border-color:var(--accent-dark);
  color:var(--bg-paper);
}
.cta-final-actions .btn-secondary{
  background:transparent;
  color:var(--bg-paper);
  border:1px solid rgba(250,247,242,.3);
  padding:16px 32px;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.08em;
  text-transform:uppercase;
  text-decoration:none;
  transition:all var(--t-base) var(--ease);
  display:inline-block;
}
.cta-final-actions .btn-secondary:hover{
  border-color:var(--bg-paper);
  background:rgba(250,247,242,.05);
}

/* ============================================================
   Boutons primary/secondary génériques (hors cta-final)
   Réutilisés dans les service-block-actions et autres
   ============================================================ */
.service-block-actions .btn-primary,
.vehicle-detail-actions .btn-primary{
  background:var(--ink);
  color:var(--bg-paper);
  border:1px solid var(--ink);
  padding:14px 24px;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.06em;
  text-transform:uppercase;
  text-decoration:none;
  transition:all var(--t-base) var(--ease);
  display:inline-block;
}
.service-block-actions .btn-primary:hover,
.vehicle-detail-actions .btn-primary:hover{
  background:var(--accent);
  border-color:var(--accent);
  color:var(--ink);
}
.vehicle-detail-actions .btn-secondary{
  background:transparent;
  color:var(--ink-soft);
  border:1px solid var(--rule);
  padding:14px 24px;
  border-radius:var(--r-sm);
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.06em;
  text-transform:uppercase;
  text-decoration:none;
  transition:all var(--t-base) var(--ease);
  display:inline-block;
}
.vehicle-detail-actions .btn-secondary:hover{
  border-color:var(--accent);
  color:var(--accent);
}