/* Fiches des vans (Le Globe-Trotter, Le Magellan, Ulysse, Wonderlust), options de la page
   Louer un van, et petits composants de la v1.3 (dépliant dans la carte des prix, citation). */

/* ---------- en-tête de fiche : le texte à gauche, le van à droite ---------- */
@media (min-width:981px){
  .lha-page .lha .lha-fiche-tete{display:flex;align-items:center}
}
.lha-page .lha .lha-fiche-img{text-align:center}
.lha-page .lha .lha-fiche-img .et_pb_image_wrap{
  display:flex; align-items:center; justify-content:center; width:100%;
  aspect-ratio:4/3; box-sizing:border-box; padding:28px;
  border-radius:var(--lha-r-lg);
  background:radial-gradient(ellipse 70% 22% at 50% 82%, rgba(27,42,34,.10), transparent 70%), var(--lha-sunken);
}
.lha-page .lha .lha-fiche-img img{width:100%;max-width:520px;height:auto;object-fit:contain;display:block}

.lha-page .lha .lha-fiche-cta{margin-top:24px}
.lha-page .lha .lha-fiche-cta .lha-fiche-prix{font-size:16px;color:var(--lha-muted)}
.lha-page .lha .lha-fiche-cta .lha-fiche-prix b{
  font:600 22px/1.2 var(--lha-display); letter-spacing:-.01em; color:var(--lha-ink); font-variant-numeric:tabular-nums;
}
.lha-page .lha .lha-fiche-cta .lha-actions{margin-top:14px}

/* ---------- les options (page Louer un van) ---------- */
.lha-page .lha .lha-options ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lha-page .lha .lha-options li{
  display:grid; grid-template-columns:22px minmax(0,1fr); column-gap:12px; align-items:start;
  padding:16px 18px; background:var(--lha-raised); border:1px solid var(--lha-border); border-radius:var(--lha-r-md);
}
.lha-page .lha .lha-options li::before{grid-row:1 / 4;width:22px;height:22px;margin-top:1px;color:var(--lha-primary)}
.lha-page .lha .lha-options li b{display:block;font:600 16px/1.35 var(--lha-sans);color:var(--lha-ink)}
.lha-page .lha .lha-options li span{display:block;margin-top:2px;font-size:15px;line-height:1.4;color:var(--lha-muted);font-variant-numeric:tabular-nums}
.lha-page .lha .lha-options li small{display:block;margin-top:4px;font-size:13px;line-height:1.4;color:var(--lha-primary);font-weight:500}

/* ---------- les autres vans, en bas de fiche (4 colonnes quand il y en a 4) ---------- */
.lha-page .lha .lha-suite-vans a span{font-size:14px}
.lha-page .lha .lha-suite-vans ul:has(> li:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr))}

/* ---------- dépliant dans la carte sombre des prix ---------- */
.lha-page .lha .lha-prix details.lha-plus > summary{color:#e9c98a}
.lha-page .lha .lha-prix details.lha-plus > summary:hover{color:#fff}
.lha-page .lha .lha-prix details.lha-plus li{color:var(--lha-on-dark-muted);font-size:14px}
.lha-page .lha .lha-prix details.lha-plus li::before{background:var(--lha-sage400)}

/* ---------- citation seule (longue durée) ---------- */
.lha-page .lha .lha-citation{background:transparent;border:0;padding:0 0 0 24px;border-left:3px solid var(--lha-sage400);border-radius:0}
.lha-page .lha .lha-citation blockquote p{font-size:clamp(20px,2vw,24px);line-height:1.45}

/* ---------- « pourquoi » : des phrases, pas des chiffres ---------- */
.lha-page .lha .lha-chiffres.lha-pourquoi li b{font-size:20px;line-height:1.25}

/* ---------- tablette et mobile ---------- */
@media (max-width:980px){
  .lha-page .lha .lha-fiche-img{margin-top:28px}
  .lha-page .lha .lha-fiche-img .et_pb_image_wrap{aspect-ratio:16/9;padding:20px}
  .lha-page .lha .lha-options ul{grid-template-columns:1fr 1fr}
  .lha-page .lha .lha-suite-vans ul:has(> li:nth-child(4)){grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .lha-page .lha .lha-options ul{grid-template-columns:1fr}
  .lha-page .lha .lha-suite-vans ul:has(> li:nth-child(4)){grid-template-columns:1fr}
  .lha-page .lha .lha-fiche-img .et_pb_image_wrap{aspect-ratio:4/3}
  .lha-page .lha .lha-chiffres.lha-pourquoi li{display:block}
  .lha-page .lha .lha-chiffres.lha-pourquoi li b{font-size:19px}
  .lha-page .lha .lha-citation{margin-top:24px}
}