/* =====================================================================
   DLH CHAUFFEUR — Feuille de style
   Charte : DESIGN.md (Noir Onyx / Cuivre Tavascan / Cormorant + Archivo)
   ===================================================================== */

:root{
  /* Couleurs */
  --c-onyx:        #0A0A0C;
  --c-anthracite:  #15161A;
  --c-ardoise:     #9AA0A8;
  --c-cuivre:      #D68F5A;
  --c-cuivre-deep: #B5713F;
  --c-encre:       #16171B;
  --c-lin:         #F4F1EC;
  --c-cuivre-halo: rgba(214,143,90,.12);
  --c-voile-onyx:  rgba(8,8,11,.78);
  --c-succes:      #5E8A6B;
  /* Variantes "texte sur fond clair" — contraste AA (≥4,5:1) garanti */
  --c-cuivre-text: #8A4E26;  /* cuivre profond lisible sur Blanc Lin */
  --c-slate-text:  #5C636E;  /* ardoise lisible sur fond clair */

  /* Surfaces claires dérivées */
  --c-lin-2:       #ECE7DE;   /* léger contraste de carte sur fond lin */
  --c-line:        rgba(22,23,27,.12);
  --c-line-dark:   rgba(244,241,236,.14);

  /* Typographie */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-sans:    'Archivo', system-ui, -apple-system, sans-serif;

  /* Rayons */
  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 20px;

  /* Ombres */
  --shadow-sm: 0 2px 8px rgba(8,8,11,.12);
  --shadow:    0 14px 40px rgba(8,8,11,.16);
  --glow-cta:  0 10px 30px rgba(214,143,90,.28);

  /* Transitions */
  --ease: cubic-bezier(.2,.7,.2,1);

  /* Layout */
  --wrap: 1200px;
  --pad:  clamp(1.25rem, 5vw, 2.5rem);
}

/* -------------------- Reset -------------------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--font-sans);
  font-weight:500;
  font-size:1rem;
  line-height:1.65;
  color:var(--c-encre);
  background:var(--c-lin);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* Coupe tout débordement horizontal résiduel (bande blanche à droite sur Safari iOS).
   `clip` n'établit pas de conteneur de défilement -> ne casse pas la nav/barre fixes. */
@supports (overflow-x: clip){
  html, body{ overflow-x:clip; }
}

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

::selection{ background:var(--c-cuivre); color:var(--c-onyx); }

:focus-visible{
  outline:2px solid var(--c-cuivre);
  outline-offset:3px;
  border-radius:3px;
}

.skip-link{
  position:fixed; top:-100px; left:1rem; z-index:2000;
  background:var(--c-cuivre); color:var(--c-onyx);
  padding:.7rem 1.2rem; border-radius:var(--radius-sm); font-weight:600;
  transition:top .2s var(--ease);
}
.skip-link:focus{ top:1rem; }

/* -------------------- Utilitaires -------------------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

.section{ padding-block:clamp(4.5rem, 9vw, 8rem); }

.kicker{
  font-family:var(--font-sans);
  font-weight:600;
  font-size:.8125rem;
  text-transform:uppercase;
  letter-spacing:.4em;
  color:var(--c-cuivre);
  display:inline-flex; align-items:center; gap:1rem;
  margin-bottom:1.4rem;
}
.kicker::before,.kicker::after{
  content:""; width:34px; height:1px; background:var(--c-cuivre); opacity:.6;
}
.kicker--center{ justify-content:center; }
/* Kickers sur sections claires : cuivre assombri pour le contraste AA */
.services .sec-head .kicker,
.tarifs .sec-head .kicker{ color:var(--c-cuivre-text); }
.services .sec-head .kicker::before,.services .sec-head .kicker::after,
.tarifs .sec-head .kicker::before,.tarifs .sec-head .kicker::after{ background:var(--c-cuivre-text); opacity:.8; }

.sec-head{ max-width:46rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.sec-head--light .kicker{ color:var(--c-cuivre); }
.sec-title{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(2rem, 4.4vw, 3rem);
  line-height:1.04;
  letter-spacing:.01em;
}
.sec-lede{
  margin-top:1.25rem;
  font-size:1.125rem;
  max-width:40rem;
  color:color-mix(in srgb, var(--c-encre) 78%, transparent);
}

/* -------------------- Boutons -------------------- */
.btn{
  font-family:var(--font-sans);
  font-weight:600;
  font-size:.9375rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:1rem 1.9rem;
  border-radius:var(--radius-sm);
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:48px;
  cursor:pointer;
  white-space:nowrap;
  transition:transform .4s var(--ease), background .3s ease, box-shadow .3s ease, border-color .3s ease, color .3s ease;
}
.btn svg{ width:20px; height:20px; flex:none; }
.btn--sm{ padding:.7rem 1.25rem; font-size:.8125rem; min-height:42px; }
.btn--block{ width:100%; }

.btn--primary{
  position:relative;
  overflow:hidden;
  background:var(--c-cuivre);
  color:var(--c-onyx);
  box-shadow:var(--glow-cta);
}
/* Reflet qui balaie le bouton au survol (luxe discret) — sous le libellé */
.btn--primary::before{
  content:"";
  position:absolute; top:0; bottom:0; left:-130%;
  width:55%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
  transform:skewX(-18deg);
  transition:left .65s var(--ease);
  pointer-events:none;
}
.btn--primary:hover::before{ left:150%; }
.btn--primary:hover{
  background:var(--c-cuivre-deep);
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(214,143,90,.34);
}
.btn--primary:active{ transform:translateY(0); }

.btn--ghost{
  background:transparent;
  color:var(--c-lin);
  border:1px solid rgba(214,143,90,.7);
}
.btn--ghost:hover{ background:var(--c-cuivre-halo); border-color:var(--c-cuivre); }
/* Ghost sur fond clair */
.btn--ghost.btn--dark{ color:var(--c-encre); border-color:rgba(181,113,63,.55); }
.btn--ghost.btn--dark:hover{ background:var(--c-cuivre-halo); border-color:var(--c-cuivre); color:var(--c-cuivre-deep); }

.link-arrow{
  font-weight:600; font-size:.875rem; letter-spacing:.04em;
  color:var(--c-cuivre-text);
  display:inline-flex; align-items:center; gap:.45rem;
  transition:gap .3s var(--ease), color .2s ease;
}
.link-arrow span{ transition:transform .3s var(--ease); }
.link-arrow:hover{ color:var(--c-cuivre-deep); }
.link-arrow:hover span{ transform:translateX(4px); }

/* =====================================================================
   NAV
   ===================================================================== */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:1000;
  transition:background .4s ease, backdrop-filter .4s ease, box-shadow .4s ease;
}
.nav__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding:1.1rem var(--pad);
  display:flex; align-items:center; gap:1.5rem;
}
.nav.is-scrolled{
  background:rgba(10,10,12,.82);
  backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--c-line-dark);
}

.brand{ display:flex; flex-direction:column; line-height:1; margin-right:auto; }
.brand__mark{
  font-family:var(--font-display);
  font-weight:600;
  font-size:1.7rem;
  letter-spacing:.06em;
  color:var(--c-lin);
}
.brand__sub{
  font-size:.625rem; text-transform:uppercase; letter-spacing:.34em;
  color:var(--c-cuivre); font-weight:600; margin-top:.25rem;
}

.nav__links{ display:flex; gap:2rem; }
.nav__links a{
  font-weight:600; font-size:.8125rem; text-transform:uppercase; letter-spacing:.14em;
  color:rgba(244,241,236,.82); padding:.4rem 0; position:relative;
  transition:color .25s ease;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:1px; width:0;
  background:var(--c-cuivre); transition:width .3s var(--ease);
}
.nav__links a:hover{ color:var(--c-lin); }
.nav__links a:hover::after{ width:100%; }

.nav__burger{
  display:none; width:44px; height:44px; flex-direction:column; gap:5px;
  align-items:center; justify-content:center;
}
.nav__burger span{ width:22px; height:2px; background:var(--c-lin); transition:.3s var(--ease); }
.nav__burger[aria-expanded="true"] span:first-child{ transform:translateY(3.5px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }

.nav__mobile{
  display:none; flex-direction:column; gap:.25rem;
  background:rgba(10,10,12,.96); backdrop-filter:blur(14px);
  padding:1rem var(--pad) 1.5rem;
  border-top:1px solid var(--c-line-dark);
}
.nav__mobile:not([hidden]){ display:flex; }
.nav__mobile a:not(.btn){
  color:var(--c-lin); font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  font-size:.875rem; padding:.9rem 0; border-bottom:1px solid var(--c-line-dark);
}
.nav__mobile .btn{ margin-top:1rem; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding:8rem var(--pad) 6rem;
  text-align:center;
  color:var(--c-lin);
  overflow:hidden;
  isolation:isolate;
}
.hero__media{ position:absolute; inset:0; z-index:-1; }
.hero__img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; object-position:center 62%;
  animation:heroDrift 26s ease-in-out infinite alternate;
}
@keyframes heroDrift{
  from{ transform:scale(1.06); }
  to  { transform:scale(1.12); }
}
/* Vignette permanente : bords assombris pour la lisibilité du texte */
.hero__scrim{
  position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 50% 18%, transparent 30%, rgba(8,8,11,.55) 100%),
    linear-gradient(180deg, rgba(8,8,11,.78) 0%, rgba(8,8,11,.32) 34%, rgba(8,8,11,.55) 70%, var(--c-voile-onyx) 100%);
}
/* Voile d'introduction : noir opaque au départ, se dissipe pour révéler la voiture */
.hero__veil{
  position:absolute; inset:0;
  background:#06060b;
  pointer-events:none;
  opacity:1;
  /* dissipation longue et très progressive (slow-in / slow-out) */
  animation:heroVeil 3.6s cubic-bezier(.33,0,.2,1) 1s forwards;
}
@keyframes heroVeil{
  from{ opacity:1; }
  to  { opacity:0; }
}

.hero__content{ max-width:54rem; margin-inline:auto; position:relative; }

/* --- Orchestration du chargement --- */
@keyframes heroUp{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@keyframes heroBrand{
  from{ opacity:0; transform:translateY(12px) scale(.94); filter:blur(8px); letter-spacing:.22em; }
  to  { opacity:1; transform:none; filter:none; letter-spacing:.08em; }
}
/* Le centre apparaît d'abord (kicker + DLH), avant que la voiture ne sorte de l'ombre */
.hero__content > *{ opacity:0; animation:heroUp .9s var(--ease) both; }
.hero .kicker{ animation-delay:.25s; }
.hero__title--brand{ animation:heroBrand 2.4s cubic-bezier(.16,.7,.2,1) .45s both; }
.hero__tagline{ animation-delay:2.1s; }
.hero__lede{ animation-delay:2.35s; }
.hero__actions{ animation-delay:2.6s; }
.hero__trust{ animation-delay:2.85s; }
.hero__scroll{ opacity:0; animation:heroUp .8s var(--ease) 3.1s both; }

.hero__title{
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(2.9rem, 8.2vw, 6.2rem);
  line-height:.96;
  letter-spacing:.01em;
  text-shadow:0 2px 30px rgba(8,8,11,.5);
}
.hero__title em{ font-style:italic; color:var(--c-cuivre); font-weight:500; }

/* Titre de marque "DLH" */
.hero__title--brand{
  font-size:clamp(5.5rem, 24vw, 15rem);
  line-height:.85;
  letter-spacing:.08em;
  /* compense l'espacement final pour rester optiquement centré */
  text-indent:.08em;
}
.hero__tagline{
  margin-top:.4rem;
  font-family:var(--font-display);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.4rem, 3.4vw, 2.4rem);
  line-height:1.2;
  color:var(--c-cuivre);
  /* fine signature cuivrée au-dessus, comme un trait manuscrit */
  position:relative;
  padding-top:1.4rem;
}
.hero__tagline::before{
  content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:64px; height:1px; background:var(--c-cuivre); opacity:.7;
}

.hero__lede{
  margin:1.8rem auto 0;
  max-width:34rem;
  font-size:clamp(1.05rem, 1.6vw, 1.2rem);
  color:rgba(244,241,236,.9);
}
.hero__actions{
  margin-top:2.5rem;
  display:flex; gap:1rem; flex-wrap:wrap; justify-content:center;
}
/* Bouton "Parler à Dylan sur WhatsApp" sous les CTA */
.hero__call{
  display:inline-flex; align-items:center; gap:.6rem;
  margin:1.4rem auto 0;
  padding:.65rem 1.3rem;
  border-radius:999px;
  border:1px solid rgba(244,241,236,.22);
  background:rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  color:var(--c-lin);
  font-weight:600; font-size:.875rem; letter-spacing:.02em;
  animation-delay:2.75s;  /* suit les CTA dans la séquence d'entrée */
  transition:border-color .3s var(--ease), background .3s ease, transform .3s var(--ease);
}
.hero__call:hover{ border-color:var(--c-cuivre); background:var(--c-cuivre-halo); transform:translateY(-1px); }
.hero__call-wa{ width:20px; height:20px; color:var(--c-cuivre); flex:none; }
.hero__call-dot{ position:relative; width:9px; height:9px; flex:none; border-radius:50%; background:var(--c-succes); }
.hero__call-dot::after{
  content:""; position:absolute; inset:0; border-radius:50%; background:var(--c-succes);
  animation:livePulse 1.9s ease-out infinite;
}
@keyframes livePulse{ 0%{ transform:scale(1); opacity:.7; } 70%{ transform:scale(3.2); opacity:0; } 100%{ opacity:0; } }

.hero__trust{
  list-style:none; padding:0;
  margin:3rem auto 0;
  display:flex; flex-wrap:wrap; gap:.7rem 1.4rem; justify-content:center;
}
.hero__trust li{ display:flex; align-items:center; gap:.6rem; font-size:.8125rem;
  text-transform:uppercase; letter-spacing:.16em; color:rgba(244,241,236,.7); font-weight:600; }
.hero__trust li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--c-cuivre); }

.hero__scroll{
  position:absolute; bottom:1.8rem; left:50%; transform:translateX(-50%);
  width:26px; height:42px; border:1.5px solid rgba(244,241,236,.5); border-radius:20px;
  display:grid; place-items:start center; padding-top:8px;
}
.hero__scroll span{ width:3px; height:8px; border-radius:2px; background:var(--c-cuivre);
  animation:scrollDot 1.8s var(--ease) infinite; }
@keyframes scrollDot{ 0%{ opacity:0; transform:translateY(-3px);} 40%{ opacity:1;} 80%,100%{ opacity:0; transform:translateY(10px);} }

/* =====================================================================
   SERVICES (fond clair)
   ===================================================================== */
.services{ background:var(--c-lin); }

.svc-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem;
}
.svc-card{
  display:flex; flex-direction:column;
  background:#fff;
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  padding:1.9rem 1.6rem;
  box-shadow:var(--shadow-sm);
  transition:transform .4s var(--ease), box-shadow .4s ease, border-color .3s ease;
}
.svc-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:rgba(214,143,90,.4); }
/* Carte service cliquable (vers une page dédiée) */
a.svc-card{ text-decoration:none; color:inherit; }
.svc-card__more{ margin-top:auto; padding-top:1.1rem; }
.svc-card__icon{
  width:48px; height:48px; border-radius:var(--radius-sm);
  background:var(--c-cuivre-halo); color:var(--c-cuivre-deep);
  display:grid; place-items:center; margin-bottom:1.2rem;
}
.svc-card__icon svg{ width:24px; height:24px; }
.svc-card h3{ font-family:var(--font-display); font-weight:600; font-size:1.5rem; line-height:1.1; margin-bottom:.5rem; }
.svc-card p{ font-size:.9375rem; color:color-mix(in srgb, var(--c-encre) 72%, transparent); }

/* Flotte */
.fleet{
  margin-top:clamp(2rem,4vw,3.5rem);
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;
}
.fleet__card{
  background:var(--c-onyx); color:var(--c-lin);
  border-radius:var(--radius-lg); overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:var(--shadow);
}
.fleet__media{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.fleet__media img{ width:100%; height:100%; object-fit:cover;
  filter:contrast(1.04) saturate(.96) brightness(.94); }

/* Carrousel photos (fondu doux) */
.carousel{ position:absolute; inset:0; touch-action:pan-y; }
.carousel__slide{
  position:absolute; inset:0;
  opacity:0;
  touch-action:pan-y; /* le glissement horizontal sur la photo change l'image (carrousel interne), pas la carte */
  transition:opacity 1.5s var(--ease), transform .9s var(--ease);
}
.carousel__slide.is-active{ opacity:1; }
.fleet__card:hover .carousel__slide.is-active{ transform:scale(1.05); }
/* Emplacement photo à venir (carrousel Business) */
.carousel__ph{
  display:grid; place-items:center; gap:.55rem; text-align:center; padding:1rem;
  background:
    radial-gradient(120% 100% at 50% 32%, var(--c-cuivre-halo), transparent 70%),
    var(--c-onyx);
  color:var(--c-cuivre);
}
.carousel__ph svg{ width:52px; height:52px; }
.carousel__ph span{ font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; color:var(--c-ardoise); font-weight:600; }

.carousel__dots{
  position:absolute; left:0; right:0; bottom:14px; z-index:2;
  display:flex; gap:8px; justify-content:center;
}
.carousel__dot{
  position:relative;
  width:8px; height:8px; padding:0; border:none; border-radius:999px; cursor:pointer;
  background:rgba(244,241,236,.5);
  box-shadow:0 1px 4px rgba(8,8,11,.45);
  transition:width .4s var(--ease), background .3s ease;
}
/* zone tactile élargie (~36px) sans changer le visuel */
.carousel__dot::before{ content:""; position:absolute; inset:-14px; }
.carousel__dot.is-active{ width:22px; background:var(--c-cuivre); }
.carousel__dot:focus-visible{ outline:2px solid var(--c-cuivre); outline-offset:3px; }
/* Étalonnage cinématographique : vignette + dégradé bas (cf. DESIGN.md) */
.fleet__media::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(180deg, transparent 52%, rgba(8,8,11,.58) 100%),
    radial-gradient(120% 85% at 50% 28%, transparent 58%, rgba(8,8,11,.34) 100%);
}
.fleet__body{ padding:1.8rem; }
.fleet__body .kicker{ margin-bottom:.9rem; }
.fleet__body h3{ font-family:var(--font-display); font-weight:600; font-size:2rem; line-height:1; margin-bottom:.7rem; }
.fleet__body p{ color:rgba(244,241,236,.78); font-size:.95rem; }
.fleet__body strong{ color:var(--c-lin); }
.fleet__specs{ list-style:none; padding:0; margin-top:1.2rem; display:flex; flex-wrap:wrap; gap:.5rem; }
.fleet__specs li{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; font-weight:600;
  padding:.4rem .8rem; border-radius:999px; border:1px solid var(--c-line-dark);
  color:var(--c-ardoise);
}

/* =====================================================================
   FAMILLES (sièges bébé / enfant) — fond sombre
   ===================================================================== */
.family{ background:var(--c-onyx); color:var(--c-lin); }
.family .sec-head{ margin-inline:auto; text-align:center; max-width:46rem; }
.family .sec-title{ color:var(--c-lin); }
.family .sec-lede{ color:rgba(244,241,236,.8); margin-inline:auto; }
.family .sec-lede strong{ color:var(--c-cuivre); }

.family-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; max-width:980px; margin:clamp(2rem,4vw,3rem) auto 0; }
.seat-card{
  background:var(--c-anthracite); border:1px solid var(--c-line-dark);
  border-radius:var(--radius-lg); overflow:hidden; margin:0;
}
.seat-card__media{
  position:relative; aspect-ratio:4/3; overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 30%, var(--c-cuivre-halo), transparent 70%),
    var(--c-onyx);
  color:var(--c-cuivre); display:grid; place-items:center; gap:.6rem;
}
.seat-card__media svg{ width:54px; height:54px; }
.seat-card__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.seat-card__ph{ font-size:.7rem; text-transform:uppercase; letter-spacing:.14em; color:var(--c-ardoise); font-weight:600; }
.seat-card__body{ padding:1.2rem 1.3rem 1.4rem; }
.seat-card__body h3{ font-family:var(--font-display); font-weight:600; font-size:1.5rem; line-height:1; }
.seat-card__range{ margin-top:.4rem; font-size:.9rem; font-weight:600; color:var(--c-cuivre); }
.seat-card__range span{ display:block; margin-top:.2rem; font-weight:500; font-size:.8rem; color:var(--c-ardoise); }

/* Garanties qui défilent en continu (marquee) */
.family-marquee{
  margin:clamp(1.6rem,3vw,2.4rem) 0 0; overflow:hidden;
  -webkit-mask:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
  mask:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
}
.family-marquee__track{
  display:flex; width:max-content; list-style:none; padding:.2rem 0; margin:0;
  animation:famMarquee 26s linear infinite;
}
.family-marquee:hover .family-marquee__track{ animation-play-state:paused; }
.family-marquee__track li{
  margin-right:.7rem; white-space:nowrap;
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.8125rem; font-weight:600; color:rgba(244,241,236,.85);
  border:1px solid var(--c-line-dark); border-radius:999px; padding:.55rem 1.1rem;
}
.family-marquee__track li::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--c-succes); flex:none; }
@keyframes famMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* Mobile : cartes sièges en carrousel à glisser (même ligne) au lieu d'empilées */
@media (max-width:620px){
  .family-grid{
    grid-template-columns:none; display:flex; gap:.9rem;
    overflow-x:auto; scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    padding-bottom:.4rem;
    margin-inline:calc(-1 * var(--pad)); padding-inline:var(--pad);
  }
  .family-grid::-webkit-scrollbar{ display:none; }
  .seat-card{ flex:0 0 78%; scroll-snap-align:center; }
}

/* Compteurs de sièges dans la réservation */
.field__free{
  font-size:.65rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700;
  color:var(--c-succes); background:rgba(94,138,107,.15);
  padding:.15rem .5rem; border-radius:999px; margin-left:.4rem;
}
.seats{ display:flex; flex-direction:column; gap:.6rem; }
.seat-row{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.seat-row__label{ font-size:.9rem; color:var(--c-lin); }
.seat-row__label small{ color:var(--c-ardoise); font-weight:500; }
.stepper{
  display:inline-flex; align-items:center; gap:.1rem; flex:none;
  background:var(--c-onyx); border:1px solid var(--c-line-dark); border-radius:999px; padding:.2rem;
}
.stepper__btn{
  width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
  color:var(--c-cuivre); font-size:1.3rem; line-height:1;
  transition:background .2s ease, color .2s ease;
}
.stepper__btn:hover{ background:var(--c-cuivre-halo); }
.stepper__btn:disabled{ opacity:.3; pointer-events:none; }
.stepper__val{ min-width:1.8rem; text-align:center; font-weight:600; font-variant-numeric:tabular-nums; color:var(--c-lin); }
/* Variante pleine largeur (compteur de passagers, alignée avec les champs) */
.stepper--wide{
  display:flex; width:100%; justify-content:space-between; align-items:center;
  min-height:48px; border-radius:var(--radius-sm); padding:.25rem .5rem;
}

/* =====================================================================
   TARIFS (fond anthracite / sombre doux)
   ===================================================================== */
.tarifs{ background:var(--c-lin-2); }

.price-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;
}
.price-card{
  position:relative;
  background:#fff; border:1px solid var(--c-line); border-radius:var(--radius);
  padding:1.7rem; display:flex; flex-direction:column;
  box-shadow:var(--shadow-sm);
  transition:transform .5s var(--ease), box-shadow .4s ease, border-color .4s ease;
}
/* Trait cuivré qui se dessine en haut au survol */
.price-card::before{
  content:""; position:absolute; top:0; left:18px; right:18px; height:2px;
  background:linear-gradient(90deg, var(--c-cuivre), var(--c-cuivre-deep));
  transform:scaleX(0); transform-origin:center;
  transition:transform .55s var(--ease);
  pointer-events:none;
}
.price-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:rgba(214,143,90,.4); }
.price-card:hover::before{ transform:scaleX(1); }
.price-card:not(.price-card--featured):hover .price-card__rows strong{ color:var(--c-cuivre-deep); }
.price-card h3{ font-family:var(--font-display); font-weight:600; font-size:1.5rem; line-height:1.08; }
.price-card__meta{ font-size:.8125rem; text-transform:uppercase; letter-spacing:.1em; color:var(--c-ardoise); margin-top:.35rem; font-weight:600; }
/* Méta sur cartes claires : ardoise assombri (AA). La carte vedette reste sombre -> ardoise clair conservé. */
.price-card:not(.price-card--featured) .price-card__meta{ color:var(--c-slate-text); }
.price-card__rows{ margin:1.2rem 0 1.3rem; display:flex; flex-direction:column; gap:.65rem; flex:1; }
.price-card__rows > div{
  display:flex; align-items:center; justify-content:space-between; gap:.35rem .9rem;
  flex-wrap:wrap; padding-bottom:.65rem; border-bottom:1px solid var(--c-line);
}
.price-card__rows > div:last-child{ border-bottom:none; }
.price-card__rows span{ flex:1 1 auto; min-width:0; font-size:.9375rem; line-height:1.3;
  color:color-mix(in srgb,var(--c-encre) 72%, transparent); }
.price-card__rows strong{
  flex:0 0 auto; white-space:nowrap; margin-left:auto;
  font-family:var(--font-display); font-weight:600; font-size:1.7rem; color:var(--c-encre);
  font-variant-numeric:tabular-nums;
  transition:color .3s ease;
}
.price-card__rows em{ font-style:normal; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em;
  color:var(--c-cuivre-deep); font-weight:600; flex-basis:100%; text-align:right; }

/* Carte vedette en sombre */
.price-card--featured{
  background:var(--c-onyx); color:var(--c-lin);
  border-color:transparent;
  grid-row:span 2;
  position:relative; overflow:hidden;
  box-shadow:var(--shadow), 0 0 0 1px rgba(214,143,90,.3) inset;
}
/* Lueur cuivrée qui suit le curseur (JS met à jour --mx / --my) */
.price-card--featured::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at var(--mx,78%) var(--my,88%), rgba(214,143,90,.30), transparent 55%);
  pointer-events:none;
  transition:background .3s ease;
}
.price-card--featured h3{ font-size:1.9rem; }
.price-card--featured .price-card__rows span{ color:rgba(244,241,236,.8); }
.price-card--featured .price-card__rows strong{ color:var(--c-lin); }
.price-card--featured .price-card__rows > div{ border-color:var(--c-line-dark); }
.price-card__tag{
  display:inline-block; align-self:flex-start;
  background:var(--c-cuivre); color:var(--c-onyx);
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em;
  padding:.35rem .8rem; border-radius:999px; margin-bottom:1rem;
}
.price-card--featured .btn{ margin-top:auto; }

/* Bloc de comparaison avec la navette partagée (carte vedette, fond sombre) */
.price-vs{ margin:.1rem 0 1.3rem; padding-top:1.1rem; border-top:1px solid var(--c-line-dark); }
.price-vs__head{ font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; color:var(--c-ardoise); font-weight:600; margin-bottom:.7rem; }
.price-vs__rows{ display:flex; flex-direction:column; gap:.55rem; }
.price-vs__rows > div{ display:flex; align-items:center; justify-content:space-between; gap:.4rem .9rem; flex-wrap:wrap; font-size:.9rem; color:rgba(244,241,236,.78); }
.price-vs__rows span{ flex:1 1 auto; min-width:0; line-height:1.3; }
.price-vs__rows b{ flex:0 0 auto; margin-left:auto; font-family:var(--font-display); font-weight:600; font-size:1.15rem; color:var(--c-lin); white-space:nowrap; }
.price-vs__rows small{ font-size:.7rem; color:var(--c-ardoise); margin-left:.1rem; }
.price-vs__us span{ color:var(--c-lin); font-weight:600; }
.price-vs__us b{ color:var(--c-cuivre); }
.price-vs__note{ margin-top:.85rem; font-size:.78rem; line-height:1.55; color:var(--c-ardoise); }
.price-vs__note strong{ color:var(--c-lin); }
.price-vs__note a{ color:var(--c-cuivre); text-decoration:underline; text-underline-offset:2px; }

.price-card--devis{ background:transparent; border-style:dashed; box-shadow:none; }
.price-card--devis:hover{ transform:none; box-shadow:none; border-color:var(--c-cuivre); }
.price-card--devis p:not(.price-card__meta){ font-size:.9375rem; color:color-mix(in srgb,var(--c-encre) 72%, transparent); margin:.5rem 0 1.3rem; }
.price-card--devis .btn{ margin-top:auto; }

.tarifs__note{ margin-top:1.8rem; font-size:.8125rem; color:var(--c-slate-text); text-align:center; }

/* =====================================================================
   RESERVATION + CARTE (fond sombre immersif)
   ===================================================================== */
.book{ background:var(--c-onyx); color:var(--c-lin); position:relative; }
.book .sec-title{ color:var(--c-lin); }
.book .sec-lede{ color:rgba(244,241,236,.8); }

.book__grid{
  display:grid; grid-template-columns:1fr 1fr; gap:1.5rem;
  align-items:stretch;
}

.book__form{
  background:var(--c-anthracite);
  border:1px solid var(--c-line-dark);
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3vw,2.2rem);
  position:relative;
}

.field{ display:flex; flex-direction:column; margin-bottom:1.1rem; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field label{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.12em; font-weight:600;
  color:var(--c-ardoise); margin-bottom:.5rem;
  transition:color .25s ease;
}
/* Le label s'éclaire en cuivre pendant la saisie */
.field:focus-within label{ color:var(--c-cuivre); }
.req{ color:var(--c-cuivre); }
.field input,.field select,.field textarea{
  width:100%; max-width:100%; min-width:0; box-sizing:border-box;
  background:var(--c-onyx);
  border:1px solid var(--c-line-dark); border-radius:var(--radius-sm);
  padding:.85rem 1rem; min-height:48px; color:var(--c-lin);
  transition:border-color .25s ease, box-shadow .25s ease;
}
.field textarea{ resize:vertical; min-height:64px; line-height:1.5; }
.field input::placeholder,.field textarea::placeholder{ color:rgba(154,160,168,.6); }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--c-cuivre);
  box-shadow:0 0 0 3px var(--c-cuivre-halo);
}
.field select{ appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%239AA0A8' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m3 5 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem; }
/* iOS : empêche le champ date/heure de déborder à droite */
.field input[type="datetime-local"]{ color-scheme:dark; -webkit-appearance:none; appearance:none; }
.field input[type="datetime-local"]::-webkit-date-and-time-value{ text-align:left; margin:0; }
.field__help{ font-size:.75rem; color:var(--c-ardoise); margin-top:.45rem; }

.field input:invalid:not(:placeholder-shown){ border-color:rgba(199,90,90,.6); }
/* Placeholder du menu véhicule (aucun choix encore) : texte grisé */
.field select:invalid{ color:rgba(154,160,168,.65); }

/* Autocomplete */
.autocomplete{ position:relative; }
.autocomplete__list{
  list-style:none; padding:.35rem; margin:0;
  position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:50;
  background:var(--c-anthracite); border:1px solid var(--c-line-dark);
  border-radius:var(--radius); box-shadow:var(--shadow); max-height:240px; overflow-y:auto;
}
.autocomplete__list li{
  padding:.7rem .8rem; border-radius:var(--radius-sm); cursor:pointer;
  font-size:.9rem; color:var(--c-lin); display:flex; gap:.6rem; align-items:flex-start;
}
.autocomplete__list li small{ display:block; color:var(--c-ardoise); font-size:.75rem; }
.autocomplete__list li:hover,.autocomplete__list li.is-active{ background:var(--c-cuivre-halo); }
.autocomplete__list li svg{ width:16px; height:16px; color:var(--c-cuivre); flex:none; margin-top:.15rem; }
.autocomplete__empty{ padding:.7rem .8rem; font-size:.85rem; color:var(--c-ardoise); }

/* Bouton swap départ/arrivée */
.swap{
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; margin:-.4rem 0 .4rem auto;
  border:1px solid var(--c-line-dark); border-radius:50%; color:var(--c-cuivre);
  background:var(--c-onyx);
  transition:transform .4s var(--ease), border-color .25s ease, background .25s ease;
}
.swap svg{ width:20px; height:20px; }
.swap:hover{ border-color:var(--c-cuivre); background:var(--c-cuivre-halo); transform:rotate(180deg); }

.forfait-banner{
  display:flex; align-items:center; justify-content:space-between; gap:.8rem; flex-wrap:wrap;
  margin:.4rem 0 1rem; padding:.7rem .9rem;
  background:var(--c-cuivre-halo); border:1px solid var(--c-cuivre);
  border-radius:var(--radius-sm); color:var(--c-lin);
}
.forfait-banner[hidden]{ display:none; } /* l'attribut hidden doit l'emporter sur display:flex */
.forfait-banner__text{ display:flex; flex-direction:column; gap:.15rem; min-width:0; }
.forfait-banner__tag{
  font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; font-weight:700; color:var(--c-cuivre);
}
.forfait-banner__title{ font-weight:600; font-size:.98rem; }
.forfait-banner__prices{ font-size:.82rem; color:var(--c-ardoise); }
.forfait-banner__cancel{
  flex:none; cursor:pointer; font:inherit; font-size:.8rem; font-weight:600;
  color:var(--c-lin); background:transparent; border:1px solid rgba(244,241,236,.35);
  padding:.4rem .7rem; border-radius:999px; transition:border-color .18s var(--ease), color .18s var(--ease);
}
.forfait-banner__cancel:hover, .forfait-banner__cancel:focus-visible{ border-color:var(--c-cuivre); color:var(--c-cuivre); outline:none; }
.trip-readout{
  margin:.4rem 0 1rem; padding:1rem 1.1rem;
  background:var(--c-cuivre-halo); border:1px solid rgba(214,143,90,.25);
  border-radius:var(--radius-sm); color:var(--c-lin);
}
.trip-readout__top{ display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; }
.trip-readout__label{
  font-size:.72rem; text-transform:uppercase; letter-spacing:.14em;
  color:var(--c-ardoise); font-weight:600;
}
.trip-readout__price{
  font-family:var(--font-display); font-weight:600; font-size:1.85rem; line-height:1;
  color:var(--c-cuivre); font-variant-numeric:tabular-nums; white-space:nowrap;
}
.trip-readout__detail{ font-size:.82rem; color:rgba(244,241,236,.8); margin-top:.55rem; }
.trip-readout__detail strong{ color:var(--c-lin); font-variant-numeric:tabular-nums; }
.trip-readout__note{ font-size:.72rem; color:var(--c-ardoise); margin-top:.5rem; line-height:1.45; }

.form-error{
  color:#E29A8C; font-size:.85rem; font-weight:600; margin-bottom:.8rem;
}

.book__actions{ display:flex; flex-direction:column; gap:.7rem; margin-top:.5rem; }
.book__reassure{ margin-top:1rem; font-size:.75rem; text-align:center; color:var(--c-ardoise); letter-spacing:.04em; }

/* Carte */
.book__map-wrap{ display:flex; flex-direction:column; gap:1.5rem; }
.book__map{
  flex:1; min-height:380px;
  border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--c-line-dark);
  background:var(--c-anthracite);
  z-index:0;
}
.leaflet-container{ background:#1a1c22; font-family:var(--font-sans); }
.leaflet-popup-content-wrapper{ background:var(--c-anthracite); color:var(--c-lin); border-radius:var(--radius-sm); }
.leaflet-popup-tip{ background:var(--c-anthracite); }
.leaflet-popup-content{ font-weight:600; }
.leaflet-bar a{ background:var(--c-anthracite); color:var(--c-lin); border-color:var(--c-line-dark); }
.leaflet-bar a:hover{ background:var(--c-onyx); }

.book__contact{
  background:var(--c-anthracite); border:1px solid var(--c-line-dark);
  border-radius:var(--radius); padding:1.3rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.book__contact p{ font-size:.95rem; color:rgba(244,241,236,.85); }
.contact-line{
  display:inline-flex; align-items:center; gap:.6rem; font-weight:600;
  color:var(--c-cuivre); letter-spacing:.04em; min-height:44px;
}
.contact-line svg{ width:20px; height:20px; }
.contact-line:hover{ color:var(--c-lin); }

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer{ background:var(--c-onyx); color:var(--c-lin); padding-top:clamp(3.5rem,6vw,5rem); border-top:1px solid var(--c-line-dark); }
.footer__grid{
  display:grid; grid-template-columns:1.6fr 1fr 1.2fr 1fr; gap:2.5rem;
  padding-bottom:3rem;
}
.footer__brand .brand__mark{ font-size:2.2rem; }
.footer__promise{ margin-top:1rem; max-width:24rem; color:rgba(244,241,236,.75); font-size:.95rem; }
.footer__sign{ margin-top:1rem; font-family:var(--font-display); font-style:italic; font-size:1.2rem; color:var(--c-cuivre); }
.footer__col h4{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.16em; color:var(--c-cuivre);
  font-weight:600; margin-bottom:1.1rem;
}
.footer__col a,.footer__col p{ display:block; color:rgba(244,241,236,.82); font-size:.9375rem; margin-bottom:.6rem; }
.footer__col a{ position:relative; width:fit-content; transition:color .25s ease, padding-left .3s var(--ease); }
.footer__col a::before{
  content:""; position:absolute; left:0; top:50%; width:0; height:1px;
  background:var(--c-cuivre); transform:translateY(-50%);
  transition:width .3s var(--ease);
}
.footer__col a:hover{ color:var(--c-cuivre); padding-left:20px; }
.footer__col a:hover::before{ width:13px; }
.footer__muted{ color:var(--c-ardoise)!important; font-size:.8125rem!important; }
.footer__legal{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding-block:1.5rem; border-top:1px solid var(--c-line-dark);
  font-size:.8125rem; color:var(--c-ardoise);
}
.footer__legal em{ font-style:normal; color:var(--c-cuivre-deep); }
.footer__legal-links{ display:flex; align-items:center; gap:1.4rem; margin:0; }
.footer__legal-links a{ color:var(--c-ardoise); transition:color .2s ease; }
.footer__legal-links a:hover{ color:var(--c-cuivre); }
.footer__credit{
  margin:0; padding-bottom:1.4rem; text-align:center;
  font-size:.72rem; letter-spacing:.04em; color:rgba(154,160,168,.5);
}

/* FAB WhatsApp */
.fab{
  position:fixed; right:1.2rem; bottom:1.2rem; z-index:900;
  width:56px; height:56px; border-radius:50%;
  background:var(--c-cuivre); color:var(--c-onyx);
  display:grid; place-items:center;
  box-shadow:var(--glow-cta);
  transition:transform .3s var(--ease), background .25s ease;
}
.fab svg{ width:28px; height:28px; animation:waRing 3s ease-in-out infinite; transform-origin:center; }
.fab:hover{ transform:scale(1.08); background:var(--c-cuivre-deep); }
/* Halos qui pulsent autour du bouton (effet "balise") */
.fab::before, .fab::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:var(--c-cuivre); z-index:-1;
  animation:fabRing 2.6s ease-out infinite;
}
.fab::after{ animation-delay:1.3s; }
@keyframes fabRing{ 0%{ transform:scale(1); opacity:.45; } 70%{ transform:scale(2.1); opacity:0; } 100%{ opacity:0; } }
/* L'icône "sonne" par à-coups (comme un téléphone) */
@keyframes waRing{
  0%, 65%, 100%{ transform:rotate(0); }
  70%{ transform:rotate(-14deg); }
  76%{ transform:rotate(12deg); }
  82%{ transform:rotate(-8deg); }
  88%{ transform:rotate(5deg); }
  94%{ transform:rotate(0); }
}

/* =====================================================================
   BARRE D'ACTION MOBILE (décision propre au téléphone)
   ===================================================================== */
.mobile-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:950;
  display:none;
  gap:.6rem;
  padding:.7rem .9rem calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(10,10,12,.92);
  backdrop-filter:blur(14px);
  border-top:1px solid var(--c-line-dark);
  transform:translateY(130%);
  transition:transform .4s var(--ease);
}
.mobile-bar.is-visible{ transform:none; }
.mobile-bar__btn{
  flex:1; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:52px; border-radius:var(--radius-sm);
  font-family:var(--font-sans); font-weight:600; font-size:.8125rem;
  letter-spacing:.08em; text-transform:uppercase;
  transition:background .25s ease, box-shadow .25s ease;
}
.mobile-bar__btn svg{ width:20px; height:20px; flex:none; }
.mobile-bar__btn--primary{ flex:1.5; background:var(--c-cuivre); color:var(--c-onyx); box-shadow:var(--glow-cta); }
.mobile-bar__btn--ghost{ color:var(--c-lin); border:1px solid rgba(214,143,90,.6); }
.mobile-bar__btn--ghost:active{ background:var(--c-cuivre-halo); }
/* Icône WhatsApp qui "sonne" pour attirer l'attention */
.mobile-bar__btn--ghost svg{ animation:waRing 3s ease-in-out infinite; transform-origin:center; }

@media (max-width:860px){
  .mobile-bar{ display:flex; }
  .fab{ display:none; }
  body{ padding-bottom:calc(56px + env(safe-area-inset-bottom)); }
}

/* =====================================================================
   REVEAL au scroll (discret — activé seulement si <html class="anim">)
   ===================================================================== */
/* NB : ne pas inclure ici le pied de page ni .article__wrap — ces contenus sont
   toujours présents et ne sont pas révélés par les scripts des pages secondaires
   (ils resteraient invisibles). Le reveal ne concerne que le contenu animé. */
.anim :where(.sec-head, .svc-card, .fleet__card, .price-card, .post,
              .rcarousel, .commune-group, .zones-cta, .family-grid,
              .book__form, .book__map-wrap){
  opacity:0;
  transform:translateY(26px);
  transition:opacity .85s var(--ease), transform .85s var(--ease);
  will-change:opacity, transform;
}
.anim .is-in{ opacity:1; transform:none; will-change:auto; }

/* Stagger des éléments de grille */
.anim .svc-grid > :nth-child(2),
.anim .price-grid > :nth-child(2),
.anim .article-grid > :nth-child(2),
.anim .reviews__grid > :nth-child(2),
.anim .footer__col:nth-child(2){ transition-delay:.07s; }
.anim .svc-grid > :nth-child(3),
.anim .price-grid > :nth-child(3),
.anim .article-grid > :nth-child(3),
.anim .reviews__grid > :nth-child(3),
.anim .footer__col:nth-child(3){ transition-delay:.14s; }
.anim .svc-grid > :nth-child(4),
.anim .price-grid > :nth-child(4),
.anim .article-grid > :nth-child(4),
.anim .reviews__grid > :nth-child(4),
.anim .footer__col:nth-child(4){ transition-delay:.21s; }
.anim .price-grid > :nth-child(5),
.anim .reviews__grid > :nth-child(5){ transition-delay:.28s; }
.anim .price-grid > :nth-child(6),
.anim .reviews__grid > :nth-child(6){ transition-delay:.35s; }
.anim .fleet__card:nth-child(2){ transition-delay:.1s; }

/* Les filets du kicker se dessinent à l'apparition de la section */
.anim .sec-head .kicker::before,
.anim .sec-head .kicker::after{ width:0; transition:width .7s var(--ease) .25s; }
.anim .sec-head.is-in .kicker::before,
.anim .sec-head.is-in .kicker::after{ width:34px; }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:980px){
  .svc-grid{ grid-template-columns:1fr 1fr; }
  .price-grid{ grid-template-columns:1fr 1fr; }
  .price-card--featured{ grid-row:span 1; grid-column:span 2; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
}

@media (min-width:861px){
  .nav__mobile{ display:none !important; }
}

@media (max-width:860px){
  .nav__links,.nav__cta{ display:none; }
  .nav__burger{ display:flex; }
  .book__grid{ grid-template-columns:1fr; }
  .book__map{ min-height:320px; order:-1; }
  .fleet{ grid-template-columns:1fr; }
}

@media (max-width:620px){
  .svc-grid{ grid-template-columns:1fr; }
  .price-grid{ grid-template-columns:1fr; }
  .price-card--featured{ grid-column:span 1; }
  .field-row{ grid-template-columns:1fr; }
  .hero__actions{ flex-direction:column; }
  .hero__actions .btn{ width:100%; }
  .footer__grid{ grid-template-columns:1fr; gap:2rem; }
  .footer__legal{ flex-direction:column; align-items:flex-start; }
}

/* =====================================================================
   AVIS GOOGLE
   ===================================================================== */
.reviews{ background:var(--c-lin); padding-block:clamp(3rem,6vw,5rem); }

/* En-tête compact : titre à gauche, note à droite */
.reviews__bar{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:1.2rem 2rem; flex-wrap:wrap; margin-bottom:clamp(1.8rem,3vw,2.4rem);
}
.reviews__bar .sec-head{ margin-bottom:0; max-width:none; }
.reviews__title{ font-size:clamp(1.7rem,3.2vw,2.3rem); }
.reviews__rating{ display:flex; align-items:center; gap:.6rem; }
.reviews__score{ font-family:var(--font-display); font-weight:600; font-size:2.1rem; line-height:1; color:var(--c-encre); }
.reviews__count{ display:inline-flex; align-items:center; gap:.35rem; font-size:.875rem; color:var(--c-slate-text); white-space:nowrap; }
.reviews__count strong{ color:var(--c-encre); }
.glogo{ width:16px; height:16px; flex:none; }

.stars{ display:inline-flex; gap:2px; }
.star{ width:16px; height:16px; fill:var(--c-cuivre); }

/* Carrousel coulissant (scroll-snap) */
.rcarousel{ position:relative; }
.rcarousel__track{
  display:flex; gap:1.25rem; overflow-x:auto;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch; scrollbar-width:none;
  padding:.3rem; margin:-.3rem;
}
.rcarousel__track::-webkit-scrollbar{ display:none; }
.rcarousel__track:focus-visible{ outline:2px solid var(--c-cuivre); outline-offset:2px; border-radius:var(--radius); }

.review{
  flex:0 0 calc((100% - 2 * 1.25rem) / 3);
  scroll-snap-align:start;
  background:#fff; border:1px solid var(--c-line); border-radius:var(--radius);
  padding:1.6rem; box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column; gap:.9rem;
  transition:transform .5s var(--ease), box-shadow .4s ease, border-color .4s ease;
}
.review:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:rgba(214,143,90,.35); }
.review__head{ display:flex; align-items:center; gap:.8rem; }
.review__avatar{
  flex:none; width:42px; height:42px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--c-cuivre-halo); color:var(--c-cuivre-deep);
  font-family:var(--font-display); font-weight:600; font-size:1.3rem;
}
.review__who{ flex:1; min-width:0; }
.review__name{ font-weight:600; font-size:.95rem; color:var(--c-encre); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.review__date{ font-size:.78rem; color:var(--c-slate-text); }
.review__g{ width:20px; height:20px; flex:none; }
.review__text{ font-size:.92rem; line-height:1.65; color:color-mix(in srgb,var(--c-encre) 82%, transparent); }
.review__text::before{
  content:"\201C"; font-family:var(--font-display); color:var(--c-cuivre);
  font-size:1.4rem; line-height:0; margin-right:.1rem; vertical-align:-.35em;
}

/* Flèches de navigation */
.rcarousel__btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:44px; height:44px; border-radius:50%;
  background:#fff; border:1px solid var(--c-line); box-shadow:var(--shadow);
  display:grid; place-items:center; color:var(--c-encre);
  transition:background .2s ease, color .2s ease, border-color .2s ease, opacity .2s ease;
}
.rcarousel__btn svg{ width:20px; height:20px; }
.rcarousel__btn:hover{ background:var(--c-cuivre); color:var(--c-onyx); border-color:var(--c-cuivre); }
.rcarousel__btn--prev{ left:-20px; }
.rcarousel__btn--next{ right:-20px; }
.rcarousel__btn:disabled{ opacity:.3; pointer-events:none; }

.reviews__cta{ text-align:center; margin-top:clamp(1.8rem,3vw,2.5rem); }

@media (max-width:900px){ .review{ flex-basis:calc((100% - 1.25rem) / 2); } }
@media (max-width:620px){
  .review{ flex-basis:86%; }
  .rcarousel__btn{ display:none; }
  .reviews__bar{ align-items:flex-start; }
}

/* =====================================================================
   PAGES INTERNES — Journal & Articles
   ===================================================================== */
/* En-tête de page (sous la nav fixe, fond onyx) */
.page-head{
  background:var(--c-onyx); color:var(--c-lin);
  padding:clamp(8rem,14vw,11rem) 0 clamp(2.8rem,6vw,4.5rem);
  text-align:center; position:relative; overflow:hidden;
  border-bottom:1px solid var(--c-line-dark);
}
.page-head::after{
  content:""; position:absolute; inset:auto 0 -50% 0; height:300px;
  background:radial-gradient(60% 100% at 50% 100%, rgba(214,143,90,.12), transparent 70%);
  pointer-events:none;
}
.page-head__inner{ position:relative; z-index:1; }
.page-head .kicker{ justify-content:center; }
.page-head h1{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(2.6rem,6vw,4.5rem); line-height:1.02; letter-spacing:.01em;
}
.page-head p{ margin:1.2rem auto 0; max-width:40rem; color:rgba(244,241,236,.82); font-size:1.125rem; }

/* État actif de la nav */
.nav__links a[aria-current="page"]{ color:var(--c-lin); }
.nav__links a[aria-current="page"]::after{ width:100%; }

/* Grille d'articles */
.journal{ background:var(--c-lin); }
.article-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.post{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--c-line); border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow-sm);
  transition:transform .5s var(--ease), box-shadow .4s ease, border-color .4s ease;
}
.post:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:rgba(214,143,90,.35); }
.post__media{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.post__media img{ width:100%; height:100%; object-fit:cover;
  filter:contrast(1.04) saturate(.96) brightness(.94); transition:transform .8s var(--ease); }
.post:hover .post__media img{ transform:scale(1.05); }
.post__media::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, transparent 55%, rgba(8,8,11,.45)); }
.post__tag{
  position:absolute; top:12px; left:12px; z-index:1;
  background:rgba(10,10,12,.78); color:var(--c-cuivre);
  font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.12em;
  padding:.35rem .75rem; border-radius:999px; backdrop-filter:blur(4px);
}
.post__body{ padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.post__date{ font-size:.75rem; text-transform:uppercase; letter-spacing:.1em;
  color:var(--c-slate-text); font-weight:600; margin-bottom:.6rem; }
.post__body h2{ font-family:var(--font-display); font-weight:600; font-size:1.5rem;
  line-height:1.12; margin-bottom:.55rem; }
.post__body p{ font-size:.9375rem; color:color-mix(in srgb,var(--c-encre) 72%, transparent); flex:1; }
.post__body .link-arrow{ margin-top:1.1rem; }

/* Article (mise en page éditoriale) */
.article{ background:var(--c-lin); padding-block:clamp(3rem,6vw,5rem) clamp(4rem,8vw,7rem); }
.article__wrap{ max-width:44rem; margin-inline:auto; }
.article__back{ display:inline-flex; align-items:center; gap:.5rem; font-weight:600;
  font-size:.875rem; color:var(--c-cuivre-text); margin-bottom:1.8rem; }
.article__back:hover{ color:var(--c-cuivre-deep); }
.article__meta{ display:flex; gap:.8rem; align-items:center; flex-wrap:wrap;
  margin-top:1.4rem; color:var(--c-slate-text); font-size:.85rem; font-weight:600;
  text-transform:uppercase; letter-spacing:.08em; }
.article__meta .post__tag{ position:static; }
.article__lead{ margin-top:1.6rem; font-size:1.2rem; line-height:1.6;
  color:color-mix(in srgb,var(--c-encre) 80%, transparent); }
.article__cover{ margin:2.2rem 0; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:16/9; position:relative; }
.article__cover img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.04) saturate(.96) brightness(.94); }

.prose{ font-size:1.075rem; line-height:1.75; color:color-mix(in srgb,var(--c-encre) 88%, transparent); }
.prose > * + *{ margin-top:1.35rem; }
.prose h2{ font-family:var(--font-display); font-weight:600; font-size:clamp(1.6rem,3vw,2.1rem);
  line-height:1.15; margin-top:2.6rem; color:var(--c-encre); }
.prose h3{ font-family:var(--font-display); font-weight:600; font-size:1.4rem; margin-top:2rem; color:var(--c-encre); }
.prose blockquote{ border-left:2px solid var(--c-cuivre); padding-left:1.4rem; margin-left:0;
  font-family:var(--font-display); font-style:italic; font-size:1.45rem; line-height:1.4; color:var(--c-encre); }
.prose a{ color:var(--c-cuivre-text); text-decoration:underline; text-underline-offset:3px; }
.prose ul{ padding-left:1.2rem; }
.prose li{ margin-top:.5rem; }
.prose li::marker{ color:var(--c-cuivre); }

/* CTA fin d'article */
.article__cta{ margin-top:3rem; padding:2rem; border-radius:var(--radius-lg);
  background:var(--c-onyx); color:var(--c-lin); text-align:center; }
.article__cta h3{ font-family:var(--font-display); font-weight:600; font-size:1.75rem; margin-bottom:1.2rem; }

@media (max-width:980px){ .article-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .article-grid{ grid-template-columns:1fr; } }

/* --- Page Zones desservies --- */
.zones{ background:var(--c-lin); }
.zones__lead{ max-width:46rem; margin:0 auto clamp(2.5rem,5vw,3.5rem); text-align:center;
  font-size:1.125rem; color:color-mix(in srgb,var(--c-encre) 78%, transparent); }

/* Points clés (aéroport / gares) */
.zones-hl{ display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.zones-hl__item{ display:inline-flex; align-items:center; gap:.55rem; background:#fff;
  border:1px solid var(--c-line); border-radius:999px; padding:.6rem 1.1rem;
  font-size:.9rem; font-weight:600; color:var(--c-encre); box-shadow:var(--shadow-sm); }
.zones-hl__item svg{ width:18px; height:18px; color:var(--c-cuivre-deep); flex:none; }

/* Groupes de communes */
.commune-group{ margin-bottom:clamp(2.5rem,5vw,3.5rem); }
.commune-group__head{ display:flex; align-items:baseline; gap:.8rem; flex-wrap:wrap;
  border-bottom:1px solid var(--c-line); padding-bottom:.8rem; margin-bottom:1.3rem; }
.commune-group__head h2{ font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.5rem,3vw,2rem); color:var(--c-encre); line-height:1.1; }
.commune-group__count{ font-size:.78rem; text-transform:uppercase; letter-spacing:.1em;
  color:var(--c-slate-text); font-weight:600; }
.commune-group__note{ margin:-.4rem 0 1.3rem; font-size:.95rem; max-width:60ch;
  color:color-mix(in srgb,var(--c-encre) 80%, transparent); }
.commune-group__note strong{ color:var(--c-cuivre); font-weight:600; }
.commune-list{ columns:4 170px; column-gap:1.5rem; list-style:none; padding:0; margin:0; }
.commune-list li{ break-inside:avoid; position:relative; padding:.42rem 0 .42rem 1.1rem;
  font-size:.95rem; color:color-mix(in srgb,var(--c-encre) 80%, transparent); }
.commune-list li::before{ content:""; position:absolute; left:0; top:.95em;
  width:5px; height:5px; border-radius:50%; background:var(--c-cuivre); }
.commune-list a{ color:inherit; text-decoration:none; transition:color .18s var(--ease); }
.commune-list a:hover, .commune-list a:focus-visible{ color:var(--c-cuivre); outline:none; }

/* CTA bas de page zones */
.zones-cta{ margin-top:1rem; padding:clamp(1.8rem,4vw,2.6rem); border-radius:var(--radius-lg);
  background:var(--c-onyx); color:var(--c-lin); text-align:center; }
.zones-cta h2{ font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.6rem,3vw,2.1rem); margin-bottom:.6rem; }
.zones-cta p{ color:rgba(244,241,236,.8); max-width:34rem; margin:0 auto 1.4rem; }

/* =====================================================================
   NOS PRESTATIONS — cartes en carrousel horizontal sur mobile
   (services + véhicules), comme les cartes sièges enfant.
   Placé en fin de feuille pour être prioritaire sur les grilles responsive.
   ===================================================================== */
@media (max-width:620px){
  .svc-grid, .fleet{
    display:flex; grid-template-columns:none; gap:.9rem;
    overflow-x:auto; scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    padding-bottom:.4rem;
    margin-inline:calc(-1 * var(--pad)); padding-inline:var(--pad);
  }
  .svc-grid::-webkit-scrollbar, .fleet::-webkit-scrollbar{ display:none; }
  .svc-card{ flex:0 0 76%; scroll-snap-align:center; }
  .fleet__card{ flex:0 0 86%; scroll-snap-align:center; }
  /* Toujours visibles en carrousel (sinon la révélation au scroll bloque
     les cartes hors-écran latéralement). */
  .anim .svc-card, .anim .fleet__card{ opacity:1 !important; transform:none !important; }
}

/* =====================================================================
   REDUCED MOTION
   ===================================================================== */
@media (prefers-reduced-motion: reduce){
  /* On garde les fondus & carrousels (mouvement minime), mais on supprime
     les mouvements amples ou en boucle, gênants pour la sensibilité vestibulaire. */
  .hero__img{ animation:none !important; transform:scale(1.06); }   /* pas de zoom continu */
  .hero__scroll span{ animation:none !important; }                  /* pas de point qui pulse */
  /* L'apparition du titre se fait en fondu seul (sans flou ni déplacement) */
  .hero__title--brand{ animation:heroFade 1s ease .4s both !important; }
  .hero__content > *{ transform:none !important; filter:none !important; }
  /* Pas d'animations d'attention en boucle (WhatsApp) */
  .fab svg, .fab::before, .fab::after,
  .mobile-bar__btn--ghost svg,
  .hero__call-dot::after{ animation:none !important; }
}
@keyframes heroFade{ from{ opacity:0; } to{ opacity:1; } }