/* Page À propos (AProposPage.jsx). Chargée par les widgets de widgets/a-propos.php (handle vlbh-apropos).
   Le corps de la maquette (18 px / 1.65) est hérité par tout ce qui n'a pas de taille propre. */
.vlbh-ap-hero, .vlbh-ap-pourquoi, .vlbh-marque, .vlbh-ellefait, .vlbh-ent-chiffres, .vlbh-ent-bas, .vlbh-ap-trio, .vlbh-ap-contact { font-size: 18px; line-height: 1.65; }

/* ——— Bandeau ——— */
.vlbh-ap-hero { min-height: min(78vh, 720px); }
.vlbh-ap-hero__voile { background: linear-gradient(180deg, rgba(18, 44, 30, .10) 0%, rgba(18, 44, 30, .45) 55%, rgba(18, 44, 30, .9) 100%); }
.vlbh-ap-hero__grille { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: end; }
.elementor .vlbh-ap-hero h1, .vlbh-ap-hero h1 { margin: 14px 0 0; font: 600 clamp(38px, 5.4vw, 68px)/1.04 var(--font-serif); color: var(--cream-100); letter-spacing: 0; }
.vlbh-ap-hero__filet { margin-top: 16px; max-width: 220px; }
.vlbh-ap-hero__phrase { margin: 18px 0 0; font: italic 400 clamp(19px, 2.2vw, 24px)/1.5 var(--font-serif); color: var(--gold-200); max-width: 40ch; }
.vlbh-ap-hero__en { margin: 8px 0 0; font: italic 400 14.5px/1.65 var(--font-body); color: var(--cream-200); max-width: 46ch; }
.vlbh-ap-hero-in { opacity: 0; transform: translateY(10px); transition: opacity 900ms var(--ease-soft) 120ms, transform 900ms var(--ease-soft) 120ms; }
.vlbh-ap-hero.is-shown .vlbh-ap-hero-in { opacity: 1; transform: none; }
.vlbh-ap-portrait { display: grid; justify-items: center; gap: 12px; opacity: 0; transition: opacity 900ms var(--ease-soft) 400ms; }
.vlbh-ap-hero.is-shown .vlbh-ap-portrait { opacity: 1; }
.vlbh-ap-portrait__rond { width: 168px; height: 168px; }
.vlbh-ap-portrait__texte { text-align: center; }
.vlbh-ap-portrait__nom { font: 600 19px/1.65 var(--font-serif); color: var(--cream-100); }
.vlbh-ap-portrait__role { margin-top: 4px; font: 500 10px/1.65 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-200); }

/* ——— Colonnes de texte partagées ——— */
.vlbh-ap-colonne { display: grid; gap: 24px; }
.vlbh-ap-citation { margin: 0; font: italic 400 clamp(20px, 2vw, 25px)/1.55 var(--font-serif); color: var(--forest-800); }
.vlbh-ap-texte { margin: 0; font: 400 17px/1.7 var(--font-body); color: var(--text-secondary); max-width: 58ch; }
.vlbh-ap-en { margin: 0; font: italic 400 14.5px/1.6 var(--font-body); color: var(--text-faint); max-width: 58ch; }
.vlbh-ap-photo { position: relative; overflow: hidden; border-radius: var(--radius-lg); aspect-ratio: 4 / 3; box-shadow: var(--shadow-md); border: 1px solid var(--border-hairline); }
.vlbh-ap-photo--16x9 { aspect-ratio: 16 / 9; }
.vlbh-ap-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vlbh-ap-pourquoi, .vlbh-ellefait, .vlbh-ent-bas { grid-template-columns: 1fr 1fr; gap: 64px; }
.vlbh-ellefait, .vlbh-ent-bas { align-items: start; }
.vlbh-attente--sombre { border-color: rgba(219, 180, 100, .6); background: rgba(250, 242, 232, .06); }
.vlbh-attente--sombre .vlbh-attente__titre, .vlbh-attente--sombre .vlbh-attente__titre svg { color: var(--gold-200); }
.vlbh-attente--sombre .vlbh-attente__texte { color: var(--cream-200); }

/* ——— L'emblème ——— */
.vlbh-marque { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; }
.vlbh-marque__carte { background: var(--cream-050); border: 1px solid var(--border-hairline); border-radius: var(--radius-xl); padding: 40px; box-shadow: var(--shadow-sm); display: grid; justify-items: center; gap: 16px; }
.vlbh-marque__carte img { height: auto; display: block; }
.vlbh-marque__mark { width: min(100%, 260px); }
.vlbh-marque__wordmark { width: min(100%, 300px); }
.vlbh-marque .vlbh-ap-texte { max-width: 60ch; }
.vlbh-marque__liste { display: grid; gap: 16px; }
.vlbh-marque__ligne { display: flex; gap: 16px; align-items: flex-start; padding: 16px 0; border-top: 1px solid var(--rule-soft); }
.vlbh-marque__tete { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.vlbh-marque__fr { font: 600 19px/1.65 var(--font-serif); color: var(--forest-800); }
.vlbh-marque__en { font: italic 400 13.5px/1.65 var(--font-body); color: var(--text-accent); }
.vlbh-marque__mot { margin-left: auto; font: 600 10px/1.65 var(--font-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-900); }
.vlbh-marque__texte { margin-top: 4px; font: 400 15.5px/1.6 var(--font-body); color: var(--text-secondary); }

/* ——— Ce que je fais moi-même (fond forêt) ——— */
.vlbh-ellefait__liste { display: grid; }
.vlbh-ellefait__ligne { display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-bottom: 1px solid rgba(250, 242, 232, .16); }
.vlbh-ellefait__ligne:last-child { border-bottom: 0; }
.vlbh-ellefait__ico { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--gold-300); display: grid; place-items: center; flex: none; color: var(--gold-200); }
.vlbh-ellefait__quand { font: 600 11px/1.65 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-200); }
.vlbh-ellefait__quoi { margin-top: 4px; font: 400 16px/1.55 var(--font-body); color: var(--cream-100); }
.vlbh-ellefait__mot { margin: 0; }

/* ——— L'entreprise ——— */
.vlbh-ent-chiffres { margin-bottom: 48px; }
.vlbh-ent-chiffres > .ac-rise { height: 100%; }
.vlbh-ent-chiffre { height: 100%; background: var(--cream-050); border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow-sm); text-align: center; }
.vlbh-ent-chiffre__n { font: 400 56px/1 var(--font-display); color: var(--forest-800); }
.vlbh-ent-chiffre__l { margin-top: 10px; font: 600 11px/1.65 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-900); }
.vlbh-ent-chiffre__filet { width: 90px; margin: 12px auto; }
.vlbh-ent-chiffre__t { font: 400 15px/1.55 var(--font-body); color: var(--text-secondary); }
.vlbh-ent-fiche { background: var(--cream-050); border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow-sm); display: grid; gap: 24px; }
/* margin: 0 — le thème Hello pose 15 px sous les tableaux, la maquette n'en a pas. */
.vlbh-ent-table { width: 100%; margin: 0; border-collapse: collapse; font-family: var(--font-body); }
.vlbh-ent-table td { padding: 11px 0; font-size: 15.5px; line-height: 1.65; color: var(--text-secondary); border-bottom: 1px solid var(--rule-soft); }
.vlbh-ent-table td:first-child { width: 45%; }
.vlbh-ent-table tr.is-dernier td { border-bottom: 0; }
.vlbh-ent-table td.vlbh-ent-table__v { font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.vlbh-ent-table td.vlbh-ent-table__v.is-vide { color: var(--text-faint); }
.vlbh-ent-fiche__note { margin: 0; font: 400 16px/1.65 var(--font-body); color: var(--text-secondary); }

/* ——— Trois photos ——— */
.vlbh-ap-trio { gap: 16px; }
.vlbh-ap-trio__cadre { position: relative; overflow: hidden; border-radius: var(--radius-lg); aspect-ratio: 4 / 3; box-shadow: var(--shadow-sm); border: 1px solid var(--border-hairline); }
.vlbh-ap-trio__cadre img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vlbh-ap-trio__legende { position: absolute; left: 14px; bottom: 12px; font: 400 11px/1.65 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--cream-100); text-shadow: 0 1px 6px rgba(22, 53, 33, .6); }

/* ——— Comment la joindre ——— */
.vlbh-ap-contact { max-width: 820px; margin: 0 auto; background: var(--cream-050); border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow-sm); display: grid; gap: 24px; text-align: center; }
.vlbh-ap-contact__texte { margin: 0; font: 400 clamp(17px, 2vw, 20px)/1.65 var(--font-body); color: var(--text-secondary); }
.vlbh-ap-contact__texte strong { font-weight: 600; color: var(--text-primary); }
.vlbh-ap-contact__texte a, .vlbh-ap-contact__texte a:hover { color: inherit; }
.vlbh-ap-contact__boutons { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ——— Tablette et mobile (règles de la maquette) ——— */
@media (max-width: 900px) {
  .vlbh-ap-pourquoi, .vlbh-marque, .vlbh-ellefait, .vlbh-ent-bas { grid-template-columns: 1fr; gap: 32px; }
  .vlbh-ap-hero__grille { grid-template-columns: 1fr; gap: 28px; }
  .vlbh-ap-portrait { justify-items: start; }
  .vlbh-ap-portrait__texte { text-align: left; }
}
@media (max-width: 640px) {
  .vlbh-ap-portrait__rond { width: 120px; height: 120px; }
  .vlbh-ap-hero .vlbh-hero-inner { padding-top: 120px; }
  .vlbh-ent-chiffre, .vlbh-ent-fiche, .vlbh-ap-contact { padding: 32px 15px; }
  .elementor .vlbh-ap-hero h1, .vlbh-ap-hero h1 { font-size: 36px; }
  .vlbh-ap-contact__boutons { flex-direction: column; gap: 10px; }
  .vlbh-ap-contact__boutons > * { width: 100%; }
}