/* Mentions, conditions, confidentialité (LegalesPage.jsx). Chargée par les widgets de widgets/legales.php (handle vlbh-legales).
   Les valeurs viennent du composant DocumentLong du kit.
   Corps de la maquette (18 px / 1.65) hérité par tout ce qui n'a pas de taille propre. */
.vlbh-lg, .vlbh-lg-fin { font-size: 18px; line-height: 1.65; }

/* Les rameaux des angles dépassent du bloc : on les coupe avec « clip », qui ne crée pas de conteneur de
   défilement. « overflow: hidden » en créerait un, et le sommaire collant cesserait alors de coller. */
.elementor .vlbh-lg-section { overflow: clip; }

/* ——— Tête de page et onglets ——— */
.vlbh-lg { display: grid; gap: 32px; }
.elementor .vlbh-lg h1, .vlbh-lg__h1 { margin: 10px 0 0; font: 600 clamp(32px, 3.6vw, 46px)/1.08 var(--font-serif); color: var(--forest-800); letter-spacing: 0; }
.vlbh-lg__en { margin-top: 6px; font: italic 400 17px/1.65 var(--font-body); color: var(--text-accent); }
/* Le widget porte le bloc de titre et la barre : ils gardent l'écart de 32 px de la grille de la maquette. */
.vlbh-lg-tete { display: grid; gap: 32px; }
.vlbh-lg-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
button.vlbh-lg-tab.vlbh-lg-tab { cursor: pointer; min-height: 44px; border: 1px solid var(--border-hairline); background: var(--cream-050); color: var(--text-secondary); border-radius: var(--radius-pill); padding: 10px 18px; font: 600 11px/1.65 var(--font-sans); letter-spacing: 0.12em; text-transform: uppercase; transition: var(--transition-color); box-shadow: none; }
button.vlbh-lg-tab.vlbh-lg-tab.is-actif { border-color: var(--border-gold); background: var(--gold-050); color: var(--forest-800); }

/* ——— La carte qui porte le document ——— */
.vlbh-lg-carte { background: var(--cream-050); border: 1px solid var(--border-hairline); border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); padding: 40px; }
.vlbh-lg-doc[hidden] { display: none; }
.vlbh-lg-doc { display: grid; gap: 40px; }

/* ——— En-tête du document ——— */
.vlbh-lg-doc__tete { display: grid; gap: 20px; max-width: 62ch; }
.elementor .vlbh-lg-doc__titre, .vlbh-lg-doc__titre { margin: 0; font: 700 clamp(34px, 5vw, 52px)/1.06 var(--font-display); letter-spacing: -0.01em; color: var(--text-primary); }
.vlbh-lg-doc__en { font: italic 400 22px/1.65 var(--font-serif); color: var(--text-accent); }
.vlbh-lg-doc__filet { max-width: 320px; }
.vlbh-lg-doc__meta { margin: 0; display: flex; flex-wrap: wrap; gap: 12px 32px; }
.vlbh-lg-doc__meta > div { display: grid; gap: 2px; }
.vlbh-lg-doc__meta dt { font: 600 9.5px/1.65 var(--font-sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-faint); }
.vlbh-lg-doc__meta dd { margin: 0; font: 400 15px/1.65 var(--font-body); color: var(--text-primary); font-variant-numeric: tabular-nums; }
.vlbh-lg-doc__chapo { margin: 0; font: 400 18px/1.68 var(--font-body); color: var(--text-secondary); }

/* ——— Corps du document et sommaire ——— */
.vlbh-lg-doc__corps { display: grid; grid-template-columns: minmax(0, 62ch) minmax(180px, 240px); gap: 48px; align-items: start; }
.vlbh-lg-doc__articles { display: grid; gap: 40px; }
.vlbh-lg-art { display: grid; gap: 16px; break-inside: avoid; }
.vlbh-lg-art__num { font: 600 10px/1.65 var(--font-sans); letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-accent); }
.elementor .vlbh-lg-art__titre, .vlbh-lg-art__titre { margin: 0; font: 600 26px/1.18 var(--font-serif); color: var(--text-primary); letter-spacing: 0; }
.vlbh-lg-art__en { margin-top: -6px; font: italic 400 15px/1.65 var(--font-body); color: var(--text-accent); }
.vlbh-lg-art p { margin: 0; font: 400 16.5px/1.72 var(--font-body); color: var(--text-secondary); }
.vlbh-lg-art__attente { border: 1.5px dashed var(--border-gold); border-radius: var(--radius-md); padding: 24px; display: flex; gap: 10px; align-items: flex-start; background: var(--cream-200); }
.vlbh-lg-art__attente svg { margin-top: 3px; color: var(--gold-800); flex: none; }
.vlbh-lg-art__attente span { font: 400 15.5px/1.6 var(--font-body); color: var(--text-secondary); }
.vlbh-lg-doc__pied { border-top: 1px solid var(--border-hairline); padding-top: 28px; }
.vlbh-lg-somm { position: sticky; top: calc(var(--header-h) + 24px); display: grid; gap: 16px; border-left: 1px solid var(--border-hairline); padding-left: 24px; }
.vlbh-lg-somm__tit { font: 600 9.5px/1.65 var(--font-sans); letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-faint); }
a.vlbh-lg-somm__lien, a.vlbh-lg-somm__lien:hover { font: 400 14.5px/1.45 var(--font-body); color: var(--text-secondary); text-decoration: none; }
.vlbh-lg-somm__lien span { color: var(--text-accent); font-variant-numeric: tabular-nums; }

/* ——— Pied « Merci » ——— */
.vlbh-lg-fin { text-align: center; }
.vlbh-lg-fin__script { font: 400 44px/1.25 var(--font-script); color: var(--gold-200); display: inline-block; }
.vlbh-lg-fin__phrase { margin: 8px 0 0; font: 400 20px/1.65 var(--font-serif); color: var(--cream-100); }
.vlbh-lg-fin__phrase em { font: italic 400 14.5px/1.65 var(--font-body); color: var(--gold-200); }

/* ——— Tablette et mobile ——— */
@media (max-width: 640px) {
  /* Sous 640, la colonne du sommaire écraserait le texte (35 px de large dans la maquette) : elle passe dessous. */
  .vlbh-lg-doc__corps { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .vlbh-lg-somm { position: static; border-left: 0; border-top: 1px solid var(--border-hairline); padding-left: 0; padding-top: 24px; }
  .vlbh-lg-carte { padding: 32px 15px; }
  .vlbh-lg-fin__script { font-size: 34px; }
}
