/* ============================================================
   PAGE LIEUX D'INTÉRÊT (front_index_lieu) — design v2
   Réutilise les modules partagés (base, breadcrumb, descriptif,
   suggestions, organiser, blog) + finding.css (hero + carte). Ce
   fichier ne porte QUE les spécificités lieux : fond, header sticky,
   hero (titre centré), bloc édito 764 (typo WYSIWYG + CTA), écarts.
   Figma desktop 846:1734 | mobile 846:1503
============================================================ */

/* Fond crème sur toute la page (comme la page Trouvailles). */
body { background-color: #efece9; }

/* Header sticky opaque EN FLUX (identique finding) → le header basev2
   (position:absolute) ne chevauche plus le hero clair. */
.header-transparant { display: block; }
@media (min-width: 1100px) {
  .header-transparant { display: block; }
}

/* ============================================================
   HERO — titre CENTRÉ à toutes les largeurs (Figma 846:1751).
   .finding-hero__title bascule à gauche ≥1100 ; on le recentre.
============================================================ */
.lieux-hero .finding-hero__title { text-align: center; }

/* ============================================================
   ÉDITO — colonne 764 centrée (gabarit .edito-bloc / descriptif.css).
   Figma desktop 846:1758 | mobile 846:1530
============================================================ */
.section-lieux-edito {
  background-color: #efece9;
  padding: 40px 0;
}
@media (min-width: 769px) {
  .section-lieux-edito { padding: 80px 0; }
}

/* On pilote les écarts par marges (gap flex de .edito-bloc neutralisé). */
.lieux-edito {
  gap: 0;
  color: #0f1b24;
}

/* Contenu WYSIWYG (avisResponsable) — NEUTRALISATION des polices du back-office :
   on FORCE la typo Figma (family + size + line-height) en !important sur TOUT le
   contenu ; le JS (_edito) retire en plus les styles inline (qu'aucune feuille ne
   pourrait battre). Le poids n'est PAS forcé (préserve l'emphase <strong>). */
.lieux-edito__text,
.lieux-edito__text * {
  font-family: 'Lexend', sans-serif !important;
  font-size: 15px !important;
  line-height: 24px !important;
}
.lieux-edito__text { font-weight: 300; color: #0f1b24; }
.lieux-edito__text > :first-child { margin-top: 0; }
.lieux-edito__text p { margin: 0 0 16px; }

/* Alignement à gauche (écrase justify/center hérités du BO). */
.lieux-edito__text,
.lieux-edito__text * { text-align: left !important; }

/* Titres internes : Asul 400 (Figma 846:1762). Le sélecteur couvre AUSSI les
   descendants (`h2 *`) : si le BO enveloppe le titre dans un <span>/<font>, la
   police Figma s'impose quand même. #GRAND TITRE = h1/h2 (26px). */
.lieux-edito__text h1, .lieux-edito__text h1 *,
.lieux-edito__text h2, .lieux-edito__text h2 *,
.lieux-edito__text h3, .lieux-edito__text h3 *,
.lieux-edito__text h4, .lieux-edito__text h4 *,
.lieux-edito__text h5, .lieux-edito__text h5 *,
.lieux-edito__text h6, .lieux-edito__text h6 * {
  font-family: 'Asul', sans-serif !important;
  font-weight: 400 !important;
  color: #0f1b24;
}
.lieux-edito__text h1, .lieux-edito__text h2, .lieux-edito__text h3,
.lieux-edito__text h4, .lieux-edito__text h5, .lieux-edito__text h6 { margin: 24px 0 8px; }
.lieux-edito__text h1, .lieux-edito__text h1 *,
.lieux-edito__text h2, .lieux-edito__text h2 * { font-size: 26px !important; line-height: 31px !important; }
.lieux-edito__text h3, .lieux-edito__text h3 * { font-size: 20px !important; line-height: 27px !important; }
.lieux-edito__text h4, .lieux-edito__text h4 * { font-size: 19px !important; line-height: 24px !important; }
.lieux-edito__text h5, .lieux-edito__text h5 * { font-size: 17px !important; line-height: 22px !important; }
.lieux-edito__text h6, .lieux-edito__text h6 * { font-size: 15px !important; line-height: 22px !important; }

/* Listes. */
.lieux-edito__text ul, .lieux-edito__text ol {
  margin: 16px 0;
  padding-left: 20px;
  list-style: revert;
}

/* Liens (ancrages href) — design Figma sauge, comme page article/package.
   On force family/couleur pour battre un éventuel inline du BO. */
.lieux-edito__text a {
  color: #9f9a7c !important;
  font-family: 'Lexend', sans-serif !important;
  font-weight: 400;
}
.lieux-edito__text a:hover {
  text-decoration: underline;
  text-decoration-skip-ink: auto;
  text-underline-offset: 2px;
}

/* Images / médias inline — bornés à la colonne, coins arrondis. */
.lieux-edito__text img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  display: block;
  margin: 24px 0;
}

/* Groupe d'images (galerie créée par le JS) : une seule CTA au-dessus. Les
   images d'un même groupe s'alignent HORIZONTALEMENT et passent à la ligne
   (VERTICAL) dès que la largeur cumulée dépasse la colonne. flex-shrink:0 →
   les images gardent leur taille et enroulent au lieu de rétrécir. */
.lieux-edito__gallery {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 24px;
  margin: 24px 0;
}
.lieux-edito__gallery img {
  margin: 0;
  flex: 0 0 auto;
  max-width: 100%;
  height: auto;
}
.lieux-edito__text iframe,
.lieux-edito__text table {
  max-width: 100%;
}

/* CTA « Demander un devis » — pill compacte alignée à gauche.
   CTA STATIQUE (fin du bloc, hors .lieux-edito__text). */
.lieux-edito__cta {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  width: max-content;
  max-width: 100%;
  margin-top: 30px;
}
.lieux-edito__cta .btn__icon { flex-shrink: 0; }

/* CTA INSÉRÉS dans le flux du contenu (avant image / grand titre) : ils
   hériteraient sinon des règles a/* ci-dessus (sauge, Lexend, text-align).
   On restaure le style bouton (blanc, Asul 16) + un espacement symétrique. */
.lieux-edito__text a.lieux-edito__cta,
.lieux-edito__text a.lieux-edito__cta:hover,
.lieux-edito__text a.lieux-edito__cta * {
  color: #ffffff !important;
  font-family: 'Asul', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
.lieux-edito__text a.lieux-edito__cta {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  margin: 30px 0;
}

/* ============================================================
   BLOC « Nos trouvailles {en|au} {pays} » (structure Organiser réutilisée)
   Le pays (heading-s) + la trouvaille (body-m) forment un bloc texte serré
   à l'intérieur de la carte organiser (gap 24 hérité entre visuel/texte/lien).
============================================================ */
.section-trouvailles-lieu{
  background-color: #EFECE9;
}
.section-trouvailles-lieu .trouvaille-lieu__text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.section-trouvailles-lieu .trouvaille-lieu__text h3,
.section-trouvailles-lieu .trouvaille-lieu__text p { margin: 0; }
.section-trouvailles-lieu .trouvaille-lieu__text a {
  color: inherit;
  text-decoration: none;
}
