/* Gold Driver
   Direction : chauffeur privé de grand hôtel, en noir et or.
   Noir pour l'en-tête, le hero, les services et le pied de page,
   blanc pour le contenu, or pour les actions, les prix et les filets.
   Playfair Display pour les titres et les prix, Jost pour le texte. */

:root {
  --vert: #000000;
  --vert-2: #1a1a1a;
  --ivoire: #ffffff;
  --ivoire-2: #f2f2f2;
  --encre: #1a1a1a;
  --gris: #666666;
  --laiton: #c9a55f;
  --laiton-fonce: #9a7a3c;
  --filet: rgba(0, 0, 0, .12);
  --filet-clair: rgba(255, 255, 255, .16);
  --creme-70: rgba(255, 255, 255, .7);

  --serif: "Playfair Display", Georgia, serif;
  --sans: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;

  --pad: clamp(18px, 5vw, 64px);
  --max: 1160px;
  --header: 72px;
  --radius: 2px;
  --ease: cubic-bezier(0.23, 1, 0.32, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header) + 16px);
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--ivoire);
  color: var(--encre);
  font: 400 1.05rem/1.7 var(--sans);
  overflow-x: hidden;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 500; line-height: 1.1; letter-spacing: -.01em; margin: 0; }
p { margin: 0; }

button, a, summary { touch-action: manipulation; }
button, .btn, summary, .callbar a { user-select: none; -webkit-user-select: none; }

:focus-visible { outline: 2px solid var(--laiton); outline-offset: 3px; }

.skip { position: absolute; left: -9999px; top: 8px; background: var(--laiton); color: var(--vert); padding: 8px 14px; z-index: 100; }
.skip:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.nowrap { white-space: nowrap; }

/* Boutons ---------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 24px;
  font: 500 .98rem/1 var(--sans); letter-spacing: .02em;
  text-decoration: none; border: 1px solid transparent; border-radius: var(--radius);
  cursor: pointer;
  transition: background-color 200ms, color 200ms, border-color 200ms;
}
.btn--lg { min-height: 56px; padding: 0 30px; font-size: 1.02rem; }
.btn--gold { background: var(--laiton); color: var(--vert); }
.btn--ghost { background: transparent; color: var(--ivoire); border-color: rgba(255, 255, 255, .45); }
.btn--ghost-dark { background: transparent; color: var(--vert); border-color: var(--vert); }
@media (hover: hover) and (pointer: fine) {
  .btn--gold:hover { background: #d8b673; }
  .btn--ghost:hover { border-color: var(--ivoire); background: rgba(255, 255, 255, .08); }
  .btn--ghost-dark:hover { background: var(--vert); color: var(--ivoire); }
}

/* En-tête ---------------------------------------------------------- */
.top {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: rgba(0, 0, 0, .96);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--filet-clair);
  color: var(--ivoire);
  padding-top: env(safe-area-inset-top);
  transition: transform 350ms var(--ease);
}
.top.is-hidden { transform: translateY(-100%); }
.top__bar {
  max-width: calc(var(--max) + 2 * var(--pad)); margin: 0 auto;
  height: var(--header); padding: 0 var(--pad);
  display: flex; align-items: center; gap: clamp(14px, 2.6vw, 32px);
}

.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; margin-right: auto; }
.brand img { width: 50px; height: auto; }
.brand__name { display: grid; font: 500 1.25rem/1.1 var(--serif); color: var(--ivoire); letter-spacing: 0; }
.brand__name small { font: 400 .76rem/1.4 var(--sans); color: var(--creme-70); letter-spacing: .04em; }

.nav { position: relative; display: flex; align-self: stretch; }
.nav a {
  display: flex; align-items: center; padding: 0 14px;
  text-decoration: none; font-size: .95rem; color: var(--creme-70);
  transition: color 200ms;
}
.nav a.is-active, .nav a.is-hover { color: var(--ivoire); }
/* Filet laiton qui suit le lien survolé ou la section en cours */
.nav__pill {
  position: absolute; left: 0; bottom: 18px; height: 1px; width: 0;
  background: var(--laiton); opacity: 0;
  transition: transform 350ms var(--ease), width 350ms var(--ease), opacity 200ms;
}

.top__status { display: inline-flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--creme-70); white-space: nowrap; }
.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--laiton); }

.top__call { min-height: 44px; }

.burger {
  display: none; position: relative; width: 44px; height: 44px; flex: none;
  background: transparent; border: 1px solid var(--filet-clair); border-radius: var(--radius); cursor: pointer;
}
.burger span {
  position: absolute; left: 12px; right: 12px; top: 50%; height: 1px; margin-top: -.5px; background: var(--ivoire);
  transition: transform 250ms var(--ease);
}
.burger span:first-child { transform: translateY(-4px); }
.burger span:last-child { transform: translateY(4px); }
.burger[aria-expanded="true"] span:first-child { transform: rotate(45deg); }
.burger[aria-expanded="true"] span:last-child { transform: rotate(-45deg); }

.menu {
  border-top: 1px solid var(--filet-clair);
  padding: 8px var(--pad) 24px;
  opacity: 0; transition: opacity 250ms var(--ease);
}
.menu.is-open { opacity: 1; }
.menu nav { display: grid; }
.menu nav a {
  font: 500 1.7rem/1.2 var(--serif); color: var(--ivoire); text-decoration: none;
  padding: 14px 0; border-bottom: 1px solid var(--filet-clair);
}
.menu .menu__call { width: 100%; margin-top: 20px; }

@media (max-width: 1080px) { .top__status { display: none; } }
@media (max-width: 860px) {
  :root { --header: 64px; }
  .nav { display: none; }
  .burger { display: block; }
  .brand img { width: 42px; }
  .brand__name small { display: none; }
  .brand__name { font-size: 1.1rem; white-space: nowrap; }
  /* Sur mobile, le bouton d'appel devient une icône carrée */
  .top__call { width: 44px; min-height: 44px; padding: 0; font-size: 0; gap: 0; }
  .top__call svg { width: 19px; height: 19px; }
}

/* Hero : fond vert pleine largeur ------------------------------------ */
.hero {
  max-width: calc(var(--max) + 2 * var(--pad)); margin: 0 auto;
  padding: calc(var(--header) + env(safe-area-inset-top) + clamp(32px, 6vw, 80px)) var(--pad) clamp(56px, 8vw, 104px);
  display: grid; gap: clamp(36px, 5vw, 56px) clamp(32px, 6vw, 88px);
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  grid-template-areas: "text photo" "board photo";
  align-items: start;
  color: var(--ivoire);
  /* Fond qui déborde sur toute la largeur de l'écran */
  border-image: conic-gradient(var(--vert) 0 0) fill 0 / / 0 100vw;
}
.hero__text { grid-area: text; align-self: end; }
.crumbs { font-size: .88rem; color: var(--creme-70); margin-bottom: 20px; }
.crumbs a { color: var(--creme-70); }
.crumbs span[aria-current] { color: var(--ivoire); }
.hero h1 { font-size: clamp(2.3rem, 4.8vw, 4.1rem); line-height: 1.06; letter-spacing: -.02em; max-width: 16ch; color: var(--ivoire); }
.lede { margin-top: 22px; max-width: 40ch; font-size: 1.12rem; color: var(--creme-70); }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }

.hero__photo { grid-area: photo; margin: 0; align-self: stretch; }
.hero__photo picture { display: block; height: 100%; }
.hero__photo img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; border-radius: var(--radius); }
.hero__photo figcaption { margin-top: 12px; font: italic 400 .95rem/1.4 var(--serif); color: var(--creme-70); }

/* La carte des prix : l'élément fort de la page ---------------------- */
.board {
  grid-area: board;
  border-top: 1px solid var(--laiton);
  border-bottom: 1px solid var(--laiton);
  padding: 20px 0 16px;
}
.board__head { padding-bottom: 6px; }
.board__head h2 { font: italic 400 1.15rem/1.3 var(--serif); color: var(--laiton); letter-spacing: 0; }
.board__table { width: 100%; border-collapse: collapse; }
.board__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.board__table tr + tr td { border-top: 1px solid var(--filet-clair); }
.board__table td { padding: 12px 0; white-space: nowrap; vertical-align: baseline; }
.board__table td:first-child { font: 400 clamp(1.25rem, 2.2vw, 1.55rem)/1.2 var(--serif); color: var(--ivoire); }
.board__table td:nth-child(2) { padding: 0 16px; font-size: .9rem; color: var(--creme-70); text-align: right; }
.board__table td:last-child { text-align: right; width: 1%; font: 500 clamp(1.25rem, 2.2vw, 1.55rem)/1.2 var(--serif); color: var(--laiton); font-variant-numeric: lining-nums tabular-nums; }
.board__foot { margin-top: 10px; font-size: .88rem; color: var(--creme-70); }
.board__foot a { color: var(--ivoire); text-underline-offset: 4px; text-decoration-color: var(--laiton); }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; grid-template-areas: "text" "board" "photo"; }
  .hero__text { align-self: auto; }
  .hero__photo img { min-height: 0; height: auto; aspect-ratio: 4 / 3; object-position: 50% 40%; }
}
@media (max-width: 420px) {
  .board__table td:nth-child(2) { display: none; }
}

/* Hero photo pleine largeur (accueil) ---------------------------------
   Texte à gauche sur un dégradé noir, la moto reste nette à droite,
   la carte des prix s'étale en bandeau au pied de l'image. */
.hero--image {
  position: relative; isolation: isolate;
  max-width: none; min-height: clamp(600px, 86svh, 800px);
  padding: calc(var(--header) + env(safe-area-inset-top) + clamp(40px, 6vw, 88px)) max(var(--pad), calc((100% - var(--max)) / 2)) clamp(28px, 4vw, 44px);
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "text" "board";
  align-content: end; gap: clamp(40px, 6vw, 72px);
  background: var(--vert);
  border-image: none;
}
/* L'image occupe la droite ; sa partie gauche (immeubles) se fond dans le noir sous le texte */
.hero__bg {
  position: absolute; top: calc(var(--header) + env(safe-area-inset-top)); right: 0; left: 12%;
  aspect-ratio: 1672 / 941; max-height: calc(100% - var(--header)); z-index: -1; overflow: hidden;
}
.hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 100% 55%; }
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, #000 0%, rgba(0, 0, 0, .75) 14%, rgba(0, 0, 0, .25) 34%, rgba(0, 0, 0, 0) 50%),
    linear-gradient(0deg, #000 0%, rgba(0, 0, 0, .55) 22%, rgba(0, 0, 0, 0) 44%),
    linear-gradient(180deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 18%);
}
.hero--image .hero__text { align-self: auto; max-width: 480px; }
.hero--image h1 { font-size: clamp(2.5rem, 4.4vw, 4rem); max-width: 11ch; text-wrap: balance; }
@media (max-width: 1100px) and (min-width: 701px) {
  .hero__bg { left: 0; }
  .hero__bg img { object-position: 78% 55%; }
  .hero__bg::after {
    background:
      linear-gradient(90deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .7) 38%, rgba(0, 0, 0, .1) 70%),
      linear-gradient(0deg, #000 0%, rgba(0, 0, 0, .55) 22%, rgba(0, 0, 0, 0) 44%);
  }
}
.hero--image .lede { color: rgba(255, 255, 255, .82); }

/* Carte des prix en bandeau : cinq destinations côte à côte */
.hero--image .board { border-bottom: 0; padding-bottom: 0; }
.hero--image .board__table tbody { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.hero--image .board__table tr { display: grid; align-content: start; gap: 2px; padding: 4px 18px 0; border-left: 1px solid var(--filet-clair); }
.hero--image .board__table tr:first-child { padding-left: 0; border-left: 0; }
.hero--image .board__table tr + tr td { border-top: 0; }
.hero--image .board__table td { padding: 0; text-align: left; width: auto; white-space: normal; }
.hero--image .board__table td:first-child { font-size: clamp(1.1rem, 1.6vw, 1.35rem); }
.hero--image .board__table td:nth-child(2) { order: 3; font-size: .85rem; }
.hero--image .board__table td:last-child { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.hero--image .board__foot { margin-top: 18px; }

@media (max-width: 900px) {
  .hero--image .board__table tbody { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 18px; }
  .hero--image .board__table tr:nth-child(4) { padding-left: 0; border-left: 0; }
}

/* Téléphone : l'image entière en haut, le texte dessous sur fond noir */
@media (max-width: 700px) {
  .hero--image {
    min-height: 0; align-content: start;
    padding-top: calc(var(--header) + env(safe-area-inset-top) + 56vw);
    gap: 36px;
  }
  .hero__bg { left: 0; aspect-ratio: auto; height: 60vw; }
  .hero__bg img { object-position: 75% 50%; }
  .hero__bg::after { background: linear-gradient(0deg, var(--vert) 0%, rgba(0, 0, 0, 0) 40%); }
  .hero--image h1 { font-size: clamp(2.1rem, 9vw, 2.8rem); max-width: none; }
  /* Carte des prix : retour à la liste verticale */
  .hero--image .board { border-bottom: 1px solid var(--laiton); padding-bottom: 16px; }
  .hero--image .board__table tbody { display: table-row-group; }
  .hero--image .board__table tr { display: table-row; padding: 0; border-left: 0; }
  .hero--image .board__table tr + tr td { border-top: 1px solid var(--filet-clair); }
  .hero--image .board__table td { display: table-cell; padding: 12px 0; white-space: nowrap; }
  .hero--image .board__table td:nth-child(2) { display: none; }
  .hero--image .board__table td:last-child { text-align: right; font-size: 1.35rem; }
  .hero--image .board__table td:first-child { font-size: 1.25rem; }
}

/* Décors de l'ancienne version, non utilisés */
.marquee, .route { display: none; }

/* Sections ---------------------------------------------------------- */
main > section:not(.hero) { padding: clamp(72px, 10vw, 136px) var(--pad); }
main > section:not(.hero) + section:not(.book) { border-top: 1px solid var(--filet); }
.section-head { max-width: var(--max); margin: 0 auto clamp(32px, 5vw, 56px); }
.section-head h2 { font-size: clamp(2rem, 4.2vw, 3.2rem); max-width: 20ch; color: var(--vert); }
.section-head p { margin-top: 16px; max-width: 54ch; color: var(--gris); }

/* Pourquoi / Arrivée : photo et texte */
.why { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 7vw, 104px); align-items: center; }
main > section.why {
  padding-left: max(var(--pad), calc((100% - var(--max)) / 2));
  padding-right: max(var(--pad), calc((100% - var(--max)) / 2));
}
.why__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius); }
.why__text h2 { font-size: clamp(2rem, 4.2vw, 3.2rem); max-width: 16ch; color: var(--vert); }
.why__text > p { margin-top: 18px; max-width: 46ch; color: var(--gris); }
.facts { margin: 36px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 560px; }
.facts div { border-top: 1px solid var(--laiton); padding-top: 14px; }
.facts dt { font: 400 2rem/1.1 var(--serif); color: var(--vert); font-variant-numeric: lining-nums; }
.facts dd { margin: 6px 0 0; font-size: .92rem; line-height: 1.5; color: var(--gris); }
.why__kit { margin-top: 28px; font-size: .95rem; color: var(--gris); }
.arrival { margin: 28px 0 0; padding: 0; list-style: none; counter-reset: a; display: grid; gap: 14px; max-width: 520px; }
.arrival li { counter-increment: a; position: relative; padding-left: 40px; }
.arrival li::before {
  content: counter(a); position: absolute; left: 0; top: -.15em;
  font: italic 400 1.5rem/1 var(--serif); color: var(--laiton-fonce);
}
.arrival strong { font-weight: 500; color: var(--vert); }
/* Variante sans photo (accueil) : titre à gauche, texte et chiffres à droite */
.why--solo { grid-template-columns: 1fr; }
.why--solo .why__text { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); column-gap: clamp(32px, 7vw, 104px); align-items: start; }
.why--solo .why__text h2 { grid-row: 1 / span 3; }
.why--solo .why__text > :not(h2) { grid-column: 2; }
.why--solo .why__text > p:first-of-type { margin-top: 6px; }
@media (max-width: 800px) {
  .why--solo .why__text { display: block; }
  .why--solo .why__text > p:first-of-type { margin-top: 16px; }
}

@media (max-width: 800px) {
  .why { grid-template-columns: 1fr; }
  .facts { gap: 14px; }
  .facts dt { font-size: 1.5rem; }
  .why__photo img { aspect-ratio: 4 / 3; }
}

/* Tarifs */
.grid-tarifs {
  max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: start;
}
/* Grille principale : trajet en Playfair, durée ou zone en petit dessous,
   prix de jour en grand, prix de nuit en retrait */
.price-table { width: 100%; border-collapse: collapse; }
.price-table caption { text-align: left; font: 500 1.4rem/1.25 var(--serif); color: var(--vert); padding-bottom: 20px; }
.price-table thead th { font: 500 .78rem/1.3 var(--sans); letter-spacing: .05em; color: var(--gris); text-align: right; padding: 0 0 12px 16px; border-bottom: 1px solid var(--vert); }
.price-table thead th:first-child { text-align: left; padding-left: 0; }
.price-table tbody th { text-align: left; padding: 20px 16px 20px 0; font: 500 1.2rem/1.25 var(--serif); color: var(--vert); }
.price-table tbody th small { display: block; margin-top: 5px; font: 400 .85rem/1.3 var(--sans); color: var(--gris); }
.price-table td { text-align: right; vertical-align: middle; padding: 20px 0 20px 16px; font: 500 1.75rem/1 var(--serif); color: var(--vert); font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.price-table td + td { font: 400 1.05rem/1 var(--sans); color: var(--gris); }
.price-table tbody tr { border-bottom: 1px solid var(--filet); }

/* Carte noire à droite : tous les autres trajets, prix en doré */
.tarifs__km {
  display: grid; gap: 20px; align-content: start;
  background: var(--vert); color: var(--ivoire);
  padding: clamp(24px, 3vw, 40px); border-radius: var(--radius);
}
.tarifs__km .price-table caption { color: var(--ivoire); }
.tarifs__km .price-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tarifs__km .price-table tbody tr { border-bottom: 1px solid var(--filet-clair); }
.tarifs__km .price-table tbody tr:first-child { border-top: 1px solid var(--laiton); }
.tarifs__km .price-table tbody th { font-size: 1.1rem; color: var(--ivoire); padding: 16px 12px 16px 0; }
.tarifs__km .price-table tbody th small { color: var(--creme-70); }
.tarifs__km .price-table td { padding: 16px 0 16px 12px; font: 400 .95rem/1 var(--sans); color: var(--creme-70); }
.tarifs__km .price-table td:last-child { font: 500 1.45rem/1 var(--serif); color: var(--laiton); }
.tarifs__hint { font-size: .95rem; color: var(--gris); }
.tarifs__km .tarifs__hint { color: var(--creme-70); }
.tarifs__km .tarifs__hint a { color: var(--ivoire); }
.tarifs__hint a, .faq__more a, .book__direct a, .svc a, .guide__grid a {
  color: var(--vert); font-weight: 500; text-underline-offset: 4px; text-decoration-color: var(--laiton);
}
.conditions { max-width: var(--max); margin: clamp(40px, 5vw, 64px) auto 0; padding-top: 28px; border-top: 1px solid var(--filet); }
.conditions h3 { font-size: 1.4rem; color: var(--vert); }
.conditions ul { margin: 16px 0 0; padding: 0; list-style: none; display: grid; gap: 10px 40px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.conditions li { position: relative; padding-left: 22px; color: var(--encre); }
.conditions li::before { content: ""; position: absolute; left: 0; top: .78em; width: 10px; height: 1px; background: var(--laiton-fonce); }
.conditions strong { font-weight: 500; color: var(--vert); }
.conditions__note { margin-top: 20px; max-width: 90ch; font-size: .93rem; color: var(--gris); }
.conditions__note + .conditions__note { margin-top: 10px; }
.schedule { margin-top: 24px; max-width: 480px; }
.schedule td { font: 400 1rem/1.3 var(--sans); color: var(--encre); }
.schedule td:last-child { font: 500 1.3rem/1 var(--serif); color: var(--vert); }
.schedule tbody th { font: 500 1.3rem/1 var(--serif); }
@media (max-width: 900px) { .grid-tarifs { grid-template-columns: 1fr; } }
@media (max-width: 480px) {
  .price-table tbody th { font-size: 1rem; padding-top: 16px; padding-bottom: 16px; }
  .price-table thead th { font-size: .72rem; }
  .price-table td { font-size: 1.4rem; padding-top: 16px; padding-bottom: 16px; }
  .price-table td + td { font-size: .95rem; }
  .tarifs__km .price-table td:last-child { font-size: 1.3rem; }
}

/* Pages aéroports sans photo -------------------------------------------- */
/* Haut de page : texte à gauche, carte des prix à droite */
.hero--split { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); grid-template-areas: "text board"; align-items: end; }
.hero--split .board { align-self: end; }
@media (max-width: 900px) { .hero--split { grid-template-columns: 1fr; grid-template-areas: "text" "board"; } }
/* Bloc noir : titre à gauche, texte à droite */
.svc--text { grid-template-columns: 1fr; margin-bottom: 0; }
.svc--text .svc__body { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); column-gap: clamp(32px, 7vw, 104px); padding-top: 0; }
.svc--text .svc__body h2 { grid-row: 1 / span 3; }
.svc--text .svc__body p { grid-column: 2; }
.svc--text .svc__body p:first-of-type { margin-top: 6px; }
@media (max-width: 800px) {
  .svc--text .svc__body { display: block; }
  .svc--text .svc__body p:first-of-type { margin-top: 14px; }
}

/* Services : bloc vert */
main > section.services { background: var(--vert); color: var(--ivoire); border-top: 0; }
main > section.services + section { border-top: 0; }
.services .section-head h2, .services h2, .services h3 { color: var(--ivoire); }
.services__grid {
  max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px);
}
.svc picture { display: block; overflow: hidden; border-radius: var(--radius); }
.svc picture img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.svc__body { padding-top: 18px; }
.svc h3 { font-size: 1.5rem; }
.svc p { margin-top: 8px; color: var(--creme-70); }
.svc p + p { margin-top: 12px; }
.services .svc a { color: var(--ivoire); }
.svc--wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(24px, 5vw, 72px); align-items: center; margin-bottom: clamp(16px, 3vw, 32px); }
.svc--wide picture img { aspect-ratio: 3 / 2; }
.svc--wide h3, .svc--wide h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); }
.svc--wide p { font-size: 1.05rem; }
.svc--wide:only-child { margin-bottom: 0; }
@media (max-width: 900px) {
  .services__grid { grid-template-columns: 1fr 1fr; }
  .svc--wide { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  /* Sur téléphone, les petites cartes passent en ligne : photo à gauche, texte à droite */
  .services__grid { grid-template-columns: 1fr; }
  .svc:not(.svc--wide) { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: center; }
  .svc:not(.svc--wide) picture img { aspect-ratio: 1; }
  .svc:not(.svc--wide) .svc__body { padding-top: 0; }
  .svc:not(.svc--wide) h3 { font-size: 1.3rem; }
}

/* Services de l'accueil : quatre colonnes sans photo, séparées par des filets dorés */
.offers {
  max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--laiton);
}
.offer {
  display: flex; flex-direction: column;
  padding: 28px clamp(18px, 2.4vw, 32px) 4px;
  border-left: 1px solid var(--filet-clair);
}
.offer:first-child { border-left: 0; padding-left: 0; }
.offer h3 { font-size: 1.45rem; color: var(--ivoire); }
.offer p { margin-top: 10px; color: var(--creme-70); font-size: .98rem; }
.offer a { color: var(--ivoire); text-underline-offset: 4px; text-decoration-color: var(--laiton); }
.offer .offer__price { margin-top: auto; padding-top: 24px; font: 500 1.5rem/1 var(--serif); color: var(--laiton); font-variant-numeric: lining-nums; }
@media (max-width: 900px) {
  .offers { grid-template-columns: 1fr 1fr; }
  .offer:nth-child(3) { border-left: 0; padding-left: 0; }
  .offer:nth-child(n+3) { border-top: 1px solid var(--filet-clair); margin-top: 28px; }
}
@media (max-width: 560px) {
  .offers { grid-template-columns: 1fr; }
  .offer, .offer:nth-child(3) { border-left: 0; padding: 22px 0; margin-top: 0; }
  .offer + .offer { border-top: 1px solid var(--filet-clair); }
  .offer .offer__price { padding-top: 14px; }
}

/* Guide aéroports */
.guide__grid { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(32px, 5vw, 72px); }
.guide__grid article { padding: 24px 0; border-top: 1px solid var(--filet); }
.guide__grid h3 { font-size: 1.45rem; color: var(--vert); }
.guide__grid h3 a { font-weight: 500; }
.guide__grid p { margin-top: 8px; color: var(--gris); }
@media (max-width: 800px) { .guide__grid { grid-template-columns: 1fr; } }

/* Étapes : vraie séquence, chiffres en italique laiton */
.steps__list {
  max-width: var(--max); margin: 0 auto; padding: 0; list-style: none; counter-reset: s;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 56px);
}
.steps__list li { counter-increment: s; border-top: 1px solid var(--laiton); padding-top: 20px; }
.steps__list li::before { content: counter(s); display: block; margin-bottom: 14px; font: italic 400 2.4rem/1 var(--serif); color: var(--laiton-fonce); }
.steps__list h3 { font-size: 1.5rem; color: var(--vert); }
.steps__list p { margin-top: 8px; color: var(--gris); }
@media (max-width: 800px) { .steps__list { grid-template-columns: 1fr; } }

/* Galerie */
main > section.gallery { padding-left: 0; padding-right: 0; }
.gallery .section-head { padding: 0 var(--pad); max-width: calc(var(--max) + 2 * var(--pad)); }
.gallery .section-head { text-align: center; }
.gallery .section-head h2, .gallery .section-head p { margin-left: auto; margin-right: auto; }

/* Carrousel empilé : la carte active au centre, les autres en éventail derrière.
   Positions calculées par script.js ; sans JavaScript, simple défilement horizontal. */
.stack { overflow: hidden; padding: 0 var(--pad); }
.stack__stage {
  position: relative; height: 330px;
  display: flex; align-items: center; justify-content: center;
  touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none;
}
.stack__stage.is-dragging { cursor: grabbing; }
.stack__card {
  position: absolute; margin: 0;
  width: 190px; height: 254px;
  border-radius: 6px; overflow: hidden; background: #111;
  box-shadow: 0 24px 48px -24px rgba(0, 0, 0, .55);
  will-change: transform, opacity;
  -webkit-user-drag: none;
}
.stack__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
/* Voile noir sur les cartes de côté, dégradé sous la légende */
.stack__card::before { content: ""; position: absolute; inset: 0; z-index: 1; background: #000; opacity: var(--dim, 0); pointer-events: none; }
.stack__card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .2) 45%, rgba(0, 0, 0, 0) 70%); pointer-events: none; }
.stack__badge {
  position: absolute; top: 12px; right: 12px; z-index: 2;
  padding: 4px 10px; border-radius: 999px;
  background: rgba(255, 255, 255, .95); color: #000;
  font: 500 .68rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase;
}
.stack__card figcaption {
  position: absolute; left: 16px; right: 16px; bottom: 18px; z-index: 2;
  display: grid; gap: 2px; color: var(--ivoire);
  opacity: var(--cap, 1);
}
.stack__card figcaption strong { font: 500 1.2rem/1.2 var(--serif); }
.stack__card figcaption span { display: none; font-size: .85rem; line-height: 1.4; color: rgba(255, 255, 255, .75); }

.stack__nav { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 24px; }
.stack__btn {
  display: grid; place-items: center; width: 46px; height: 46px;
  background: transparent; color: var(--vert); border: 1px solid var(--filet); border-radius: 50%; cursor: pointer;
  transition: border-color 200ms, background-color 200ms, color 200ms;
}
@media (hover: hover) and (pointer: fine) { .stack__btn:hover { background: var(--vert); border-color: var(--vert); color: var(--ivoire); } }
.stack__count { min-width: 4.5ch; text-align: center; font: 500 1.05rem/1 var(--serif); color: var(--vert); font-variant-numeric: lining-nums tabular-nums; }

@media (min-width: 640px) {
  .stack__stage { height: 460px; }
  .stack__card { width: 240px; height: 330px; }
  .stack__card figcaption { left: 22px; right: 22px; bottom: 26px; }
  .stack__card figcaption strong { font-size: 1.4rem; }
  .stack__card figcaption span { display: block; }
}
@media (min-width: 1024px) {
  .stack__stage { height: 540px; }
  .stack__card { width: 290px; height: 400px; }
}

/* Sans JavaScript : les photos défilent simplement à l'horizontale */
html:not(.js) .stack__stage { height: auto; justify-content: flex-start; gap: 14px; overflow-x: auto; cursor: auto; }
html:not(.js) .stack__card { position: relative; flex: none; }
html:not(.js) .stack__nav { display: none; }

/* Réservation */
main > section.book {
  background: var(--ivoire-2);
  padding-left: max(var(--pad), calc((100% - var(--max)) / 2));
  padding-right: max(var(--pad), calc((100% - var(--max)) / 2));
}
.book {
  display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 88px); align-items: start;
}
.book > * { min-width: 0; }
.book__intro { max-width: 420px; }
.book__intro h2 { font-size: clamp(2rem, 4.2vw, 3.2rem); color: var(--vert); }
.book__intro p { margin-top: 16px; color: var(--gris); }
.book__direct { color: var(--encre) !important; }
.book__contacts { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 6px; font-size: .95rem; }
.book__contacts a { color: var(--gris); text-underline-offset: 4px; }

.form {
  max-width: 680px;
  background: var(--ivoire); border: 1px solid var(--filet); border-radius: var(--radius);
  padding: clamp(20px, 3.4vw, 40px);
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
}
.field { display: grid; gap: 6px; min-width: 0; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: .88rem; font-weight: 500; letter-spacing: .02em; color: var(--vert); }
.opt { color: var(--gris); font-weight: 400; }
.field input, .field select {
  font: 400 16px/1.3 var(--sans); color: var(--encre);
  min-height: 50px; padding: 12px 14px; width: 100%;
  background: #ffffff; border: 1px solid rgba(0, 0, 0, .25); border-radius: var(--radius);
  appearance: none; -webkit-appearance: none;
}
.field input::placeholder { color: #9a9a9a; }
.field input:focus, .field select:focus { outline: none; border-color: var(--vert); box-shadow: 0 0 0 3px rgba(201, 165, 95, .4); }
.field input[aria-invalid="true"] { border-color: #a3261e; }
.field--check { display: flex; align-items: center; gap: 12px; }
.field--check input { width: 20px; height: 20px; min-height: 0; padding: 0; accent-color: var(--vert); appearance: auto; -webkit-appearance: checkbox; }
.field--check label { font-weight: 400; font-size: 1rem; letter-spacing: 0; color: var(--encre); }

.estimate {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 2px 16px;
  background: var(--vert); color: var(--ivoire); padding: 18px 22px; border-radius: var(--radius);
}
.estimate__label { font-size: .88rem; color: var(--creme-70); }
.estimate__value { grid-row: span 2; justify-self: end; font: 500 2.4rem/1 var(--serif); color: var(--laiton); font-variant-numeric: lining-nums tabular-nums; }
.estimate__note { font-size: .88rem; color: var(--ivoire); }
.estimate__detail { grid-column: 1 / -1; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--filet-clair); font-size: .85rem; color: var(--creme-70); font-variant-numeric: tabular-nums; }
.estimate__value.bump { animation: bump 400ms var(--ease); }
@keyframes bump { from { opacity: .35; } }

.combo { position: relative; }
.combo__list {
  position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; right: 0;
  margin: 0; padding: 6px; list-style: none;
  background: #ffffff; border: 1px solid var(--filet); border-radius: var(--radius);
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .3);
  max-height: 290px; overflow-y: auto; overscroll-behavior: contain;
}
.combo__list li[role="option"] { padding: 11px 12px; cursor: pointer; font-size: .96rem; }
.combo__list li[aria-selected="true"] { background: var(--ivoire-2); }
@media (hover: hover) and (pointer: fine) { .combo__list li[role="option"]:hover { background: var(--ivoire-2); } }
.combo__head { padding: 8px 12px 4px; font-size: .8rem; color: var(--gris); }

.form__error { grid-column: 1 / -1; color: #8f1f17; font-weight: 500; }
.form__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 12px; }
.form__actions .btn { flex: 1 1 200px; }
@media (max-width: 900px) {
  .book { grid-template-columns: 1fr; }
  .book__intro { max-width: none; }
}
@media (max-width: 520px) { .form { grid-template-columns: 1fr; } }

/* FAQ */
.faq .section-head, .faq__list, .faq__more { max-width: 780px; }
.faq__list { margin: 0 auto; border-top: 1px solid var(--filet); }
.faq details { border-bottom: 1px solid var(--filet); }
.faq summary {
  list-style: none; cursor: pointer; position: relative;
  padding: 22px 44px 22px 0; font: 400 1.2rem/1.35 var(--serif); color: var(--vert);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before, .faq summary::after {
  content: ""; position: absolute; right: 8px; top: 50%; width: 14px; height: 1px; background: var(--laiton-fonce);
  transition: transform 250ms var(--ease);
}
.faq summary::after { transform: rotate(90deg); }
.faq details[open] summary::after { transform: rotate(0deg); }
.faq details p { padding: 0 0 24px; max-width: 60ch; color: var(--gris); }
.faq__more { margin: 32px auto 0; color: var(--gris); }

/* Pied de page */
.foot { background: var(--vert); color: var(--creme-70); padding: clamp(56px, 7vw, 96px) var(--pad) calc(28px + env(safe-area-inset-bottom)); }
.foot__inner { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 200px 1fr; gap: clamp(32px, 6vw, 88px); align-items: start; }
.foot__inner img { width: 100%; max-width: 180px; }
.foot__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.foot h2 { font-size: 1.2rem; color: var(--ivoire); margin-bottom: 12px; }
.foot p { font-size: .95rem; }
.foot a { text-decoration: none; }
.foot p a { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(201, 165, 95, .7); }
@media (hover: hover) and (pointer: fine) { .foot a:hover { color: var(--laiton); } }
.foot__legal { max-width: var(--max); margin: 48px auto 0; padding-top: 20px; border-top: 1px solid var(--filet-clair); font-size: .85rem; color: rgba(255, 255, 255, .5); }
.foot__legal a { color: var(--creme-70); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) {
  .foot__inner, .foot__cols { grid-template-columns: 1fr; }
  .foot__inner img { max-width: 140px; }
}

/* Barre d'action mobile, toujours visible */
.callbar { display: none; }
@media (max-width: 860px) {
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
  .callbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    display: grid; grid-template-columns: 1.3fr 1fr 1fr;
    background: var(--vert); border-top: 1px solid var(--vert);
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .12);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .callbar a {
    display: flex; align-items: center; justify-content: center; min-height: 60px;
    text-decoration: none; font-weight: 500; letter-spacing: .02em; color: var(--ivoire);
  }
  .callbar .callbar__call { background: var(--laiton); color: var(--vert); }
  .callbar .callbar__wa { border-right: 1px solid var(--filet-clair); }
}

@media (prefers-reduced-motion: reduce) {
  .top, .menu, .btn, .nav__pill, .burger span, .faq summary::after { transition: none !important; }
  .estimate__value.bump { animation: none; }
}

/* Ajouts demandés : informations de service, tarifs et urgences. */
.brand__name small { display:block; }
.hero-availability { display:flex; align-items:center; gap:10px; color:var(--laiton); font-size:.86rem; margin-bottom:20px; }
.hero-availability svg { width:19px; height:19px; flex:none; }
.hero-specialties { margin-top:22px; color:var(--laiton); font-size:1.02rem; letter-spacing:.06em; }
.hero-promise { margin-top:12px; color:var(--creme-70); max-width:52ch; }
.hero-benefits { list-style:none; padding:0; margin:24px 0 0; display:grid; gap:14px; max-width:55ch; }
.hero-benefits li { display:flex; gap:12px; align-items:flex-start; font-size:.98rem; line-height:1.5; }
.hero-benefits svg { flex:none; width:22px; height:22px; color:var(--laiton); }
main > section.service-assurances { background:#000; color:#fff; padding:36px var(--pad); }
.service-assurances__grid { max-width:var(--max); margin:auto; display:grid; grid-template-columns:repeat(6,1fr); gap:24px; }
.service-assurances__grid > div { display:grid; justify-items:center; align-content:start; gap:12px; text-align:center; font-size:.9rem; }
.service-assurances__grid svg { color:var(--laiton); }
.quick-pickup { max-width:var(--max); margin:32px auto 0; padding:26px 0 0; border-top:1px solid var(--filet-clair); display:flex; gap:24px; justify-content:space-between; align-items:center; }
.quick-pickup strong { color:var(--laiton); font-weight:500; }
.quick-pickup small { display:block; color:var(--creme-70); margin-top:5px; }
.quick-pickup .btn { flex-shrink:0; }
.price-zone,.price-notice,.price-urgent { max-width:var(--max); margin:32px auto 0; }
.price-zone { padding-top:28px; border-top:1px solid var(--filet); }
.price-zone h3,.price-notice h3,.price-urgent h3 { font-size:1.6rem; margin-bottom:12px; }
.price-zone p { color:var(--gris); max-width:78ch; }
.price-zone a { text-underline-offset:4px; }
.price-notice { display:flex; align-items:flex-start; gap:20px; padding:28px; background:#17140e; color:#fff; border-left:4px solid var(--laiton); }
.price-notice > svg { flex:none; color:var(--laiton); }
.price-notice h3 { color:var(--laiton); }
.price-notice p { max-width:72ch; }
.price-notice__example { color:var(--creme-70); margin-top:12px; font-size:.95rem; }
.price-urgent { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:28px; background:var(--ivoire-2); }
.price-urgent p { color:var(--gris); }
.price-urgent .btn { flex-shrink:0; }
@media(max-width:860px) { .brand__name small { font-size:.62rem; letter-spacing:0; white-space:normal; } .service-assurances__grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:540px) { .quick-pickup,.price-urgent { align-items:stretch; flex-direction:column; } .price-notice { padding:22px 18px; gap:12px; } .price-notice h3 { font-size:1.3rem; } .service-assurances__grid { gap:24px 12px; } .service-assurances__grid > div { font-size:.8rem; } .board__table td:first-child { white-space:normal; } }
@media(max-width:380px) { .brand { gap:6px; } .brand img { width:32px; } .top__bar { gap:10px; } }

.booking-price-note { margin: 0; line-height: 1.65; }
.booking-price-note a { text-decoration: underline; }