/*
Theme Name: Divi Child Pixemea
Description: Child theme optimisé Divi 5 + Site Kit + Rank Math
Author: Manny
Template: Divi
Version: 4.1.0
Text Domain: divi-child-pixemea
*/

body{background-color:#FAF8F3 !important;}

/* =========================================================
   HARMONIE DES EN-TÊTES DE PAGE (toutes pages)
   ========================================================= */
.vlm-devise,
.vlm-bio-hero h1,
.vlm-ctx-hero h1,
.vlm-page-hero h1{
  font-family:var(--vlm-serif)!important;
  font-size:clamp(2.4rem,5vw,3rem)!important;
  font-weight:500!important;
  line-height:1.08!important;
  letter-spacing:-0.01em!important;
  color:var(--vlm-ink)!important;
  margin:0!important;
}

/* Sous-titre / chapô d'en-tête */
.vlm-bio-hero .vlm-verbes,
.vlm-ctx-hero .vlm-chapo{
  font-family:var(--vlm-serif)!important;
}

/* Titres de section H2 — même famille partout */
.vlm-prose h2,
.vlm-univers-bloc h2,
.vlm-frise h2.vlm-eyebrow,
h2.vlm-eyebrow{
  font-family:var(--vlm-serif)!important;
}
.vlm-prose h2,
.vlm-univers-bloc h2,
.vlm-frise h2.vlm-eyebrow,
h2.vlm-eyebrow{
  font-family:var(--vlm-serif)!important;
  font-size:clamp(1.6rem,3vw,2.2rem)!important;   /* ← ajoute cette ligne, ajuste le dernier chiffre */
}

/* =========================================================
   VÉRONIQUE LE MOUËL — Feuille de styles
   À coller dans style.css du thème enfant (Divi Child Pixemea)

   1. Variables · 2. Base · 3. Header/Footer · 4. Éléments partagés
   5. Accueil : hero · 6. Accueil : déambulation · 7. Accueil : contextes
   8. Accueil : mosaïque · 9. Accueil : bio synthétique
   10. Accueil : trace + invitation · 11. Responsive · 12. Correctifs
   ========================================================= */

/* ---------- 1. VARIABLES ---------- */
:root{
  --vlm-paper:#FAF8F3;
  --vlm-ink:#1C1A17;
  --vlm-stone:#8B857B;
  --vlm-thread:#E3B505;
  --vlm-line:#E6E1D6;
  --vlm-serif:'Cormorant Garamond', Georgia, serif;
  --vlm-sans:'Karla', 'Helvetica Neue', Arial, sans-serif;
}

/* ---------- 2. BASE ---------- */
body{background:var(--vlm-paper);color:var(--vlm-ink);font-family:var(--vlm-sans);font-weight:300;line-height:1.7}

/* Révélation au scroll — ne masque QUE si le JS est actif */
html.vlm-anim .vlm-reveal{opacity:0;transform:translateY(22px);transition:opacity .9s ease, transform .9s ease}
html.vlm-anim .vlm-reveal.vlm-vu{opacity:1;transform:none}

/* Le fil jaune — sur le bord droit, hors de la zone de texte */
.vlm-fil{position:fixed;left:auto;right:3vw;top:0;width:1px;height:0;background:var(--vlm-thread);opacity:.5;pointer-events:none;z-index:0}

/* ---------- 3. HEADER / FOOTER (Theme Builder) ---------- */
 
/* Logo — la LARGEUR commande (logo au ratio ~3:1) */
.et-l--header .et_pb_menu__logo-wrap,
.et-l--header .et_pb_menu__logo{width:270px!important;max-width:none!important}
.et-l--header .et_pb_menu__logo img{width:100%!important;height:auto!important;max-height:none!important}
/* version collée (sticky) */
.et-l--header .et_pb_sticky .et_pb_menu__logo-wrap,
.et-l--header .et_pb_sticky .et_pb_menu__logo{width:230px!important;transition:width .3s}
 
/* Liens du menu */
.et-l--header .et_pb_menu li a{
  font-family:var(--vlm-sans);
  font-size:14px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--vlm-ink)!important;
  text-decoration:none;
  transition:color .25s;
}
.et-l--header .et_pb_menu li a:hover,
.et-l--header .et_pb_menu li.current-menu-item > a{
  opacity:1;
  text-decoration:underline;
  text-decoration-color:var(--vlm-thread);
  text-decoration-thickness:1px;
  text-underline-offset:7px;
}
.et-l--header .et_pb_menu__menu > nav > ul > li{margin:0 0 0 1em}
 
/* Neutraliser bordures et ombres */
.et-l--header .et_pb_section,
.et-l--header .et_pb_row,
.et-l--header .et_pb_menu{border:none!important;box-shadow:none!important}
 
/* Burger mobile natif Divi */
.et-l--header .mobile_menu_bar:before{color:var(--vlm-ink)!important}
.et_mobile_menu{background:var(--vlm-paper)!important;border-top:2px solid var(--vlm-thread)!important;box-shadow:0 18px 40px -24px rgba(28,26,23,.35)}
.et_mobile_menu li a{font-family:var(--vlm-sans);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--vlm-ink)!important;border-bottom:1px solid var(--vlm-line)!important;padding:14px 5%!important}
.et_mobile_menu li a:hover{background:transparent!important;color:var(--vlm-stone)!important;padding-left:7%!important}
 
/* Logo en mobile */
@media (max-width:980px){
  .et-l--header .et_pb_menu__logo-wrap,
  .et-l--header .et_pb_menu__logo,
  .et-l--header .et_pb_sticky .et_pb_menu__logo-wrap,
  .et-l--header .et_pb_sticky .et_pb_menu__logo{width:200px!important}
}

/* Footer */
.vlm-footer{border-top:1px solid var(--vlm-line);padding:34px 6vw;display:flex;justify-content:space-between;gap:20px;font-size:.7rem;letter-spacing:.1em;color:var(--vlm-stone);text-transform:uppercase}
.vlm-footer a{color:var(--vlm-stone)!important;text-decoration:none;border-bottom:1px solid transparent}
.vlm-footer a:hover{border-bottom-color:var(--vlm-thread)}

/* ---------- 4. ÉLÉMENTS PARTAGÉS ---------- */

/* Titres de section (H2) — sur une seule ligne */
h2.vlm-eyebrow,
.vlm-eyebrow{
  font-family:var(--vlm-serif);
  font-size:clamp(1.6rem,3.4vw,2.4rem);
  font-weight:500;
  line-height:1.2;
  letter-spacing:0;
  text-transform:none;
  color:var(--vlm-ink);
  max-width:none;
  margin:0 0 1.3em;
  padding:0;
}

.vlm-porte{display:inline-block;margin-top:3em;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-ink)!important;text-decoration:none;border-bottom:1px solid var(--vlm-thread);padding-bottom:5px;transition:letter-spacing .3s}
.vlm-porte:hover{letter-spacing:.26em}

/* ---------- 5. ACCUEIL : HERO ---------- */
.vlm-hero{min-height:70vh;display:flex;flex-direction:column;justify-content:center;padding:40px 0 20px}
.vlm-hero .vlm-devise{font-family:var(--vlm-serif);font-size:clamp(1.7rem,3.6vw,2.7rem);font-weight:500;max-width:20em;line-height:1.32;margin:0;color:var(--vlm-ink)}
.vlm-hero .vlm-devise-en{font-family:var(--vlm-serif);font-size:1.05rem;color:var(--vlm-stone);font-style:italic;margin:16px 0 0}
.vlm-axe-lien{display:inline-block;width:fit-content;margin-top:5.5vh;font-size:1rem;letter-spacing:.28em;text-transform:uppercase;color:var(--vlm-ink)!important;text-decoration:none;border-bottom:1px solid var(--vlm-thread);padding-bottom:6px;transition:opacity .35s, letter-spacing .3s;opacity:1}
.vlm-axe-lien:hover{letter-spacing:.36em}
.vlm-axe-lien.vlm-fade{opacity:0}
.vlm-questions{margin:.55em 0 0;font-family:var(--vlm-serif);font-style:italic;font-size:clamp(1.7rem,4.2vw,3rem);font-weight:400;min-height:1.35em;line-height:1.2;color:var(--vlm-ink)}
.vlm-caret{display:inline-block;width:2px;height:.92em;background:var(--vlm-thread);vertical-align:-0.1em;margin-left:4px;animation:vlm-blink 1.05s steps(1) infinite}
@keyframes vlm-blink{50%{opacity:0}}
.vlm-signature{margin-top:6vh;font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;color:var(--vlm-stone)}

/* ---------- 6. ACCUEIL : DÉAMBULATION (4 axes) ---------- */
.vlm-salle{display:grid;grid-template-columns:0.8fr 1fr;gap:5vw;align-items:center;margin-top:5vh;position:relative;text-decoration:none;color:var(--vlm-ink)!important}
.vlm-salle figure{position:relative;margin:0;max-width:380px}
.vlm-salle img{width:100%;height:auto;display:block;box-shadow:0 24px 60px -30px rgba(28,26,23,.35)}
.vlm-salle:nth-of-type(even) figure{order:2;margin-left:auto}
.vlm-lettre{display:none}
.vlm-cartel h3{font-family:var(--vlm-serif);font-size:clamp(1.7rem,3vw,2.4rem);font-weight:600;line-height:1.15;margin:0;color:var(--vlm-ink)}
.vlm-cartel .vlm-question{font-family:var(--vlm-serif);font-style:italic;font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--vlm-stone);margin:.5em 0 0}
.vlm-cartel .vlm-question::after{content:"";display:block;width:56px;height:1px;background:var(--vlm-thread);margin-top:1.6em}
.vlm-cartel .vlm-oeuvre-ref{margin:1.7em 0 0;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--vlm-stone)}

/* ---------- 7. ACCUEIL : CONTEXTES ---------- */
.vlm-contextes .vlm-ligne{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:1.7em 0;border-top:1px solid var(--vlm-line);text-decoration:none;color:var(--vlm-ink)!important;transition:padding-left .3s}
.vlm-contextes .vlm-ligne:hover{padding-left:14px}
.vlm-contextes .vlm-ligne:last-of-type{border-bottom:1px solid var(--vlm-line)}
.vlm-contextes .vlm-univers{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--vlm-stone);flex:0 0 230px}
.vlm-contextes .vlm-phrase{font-family:var(--vlm-serif);font-size:1.35rem;font-weight:500;flex:1}
.vlm-contextes .vlm-trace{margin-top:2em}

/* ---------- 8. ACCUEIL : MOSAÏQUE ---------- */
.vlm-mosaique{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:2.0em calc(50% - 50vw) 0;width:100vw}
.vlm-tuile{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:var(--vlm-line)}
.vlm-tuile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.vlm-tuile:hover img{transform:scale(1.04)}
.vlm-tuile .vlm-voile{position:absolute;inset:0;background:rgba(250,248,243,.82);opacity:0;transition:opacity .35s;display:flex;flex-direction:column;justify-content:flex-end;padding:26px}
.vlm-tuile:hover .vlm-voile,.vlm-tuile:focus-visible .vlm-voile{opacity:1}
.vlm-tuile .vlm-nom{font-family:var(--vlm-serif);font-weight:600;font-size:1.4rem;line-height:1.15;color:var(--vlm-ink)}
.vlm-tuile .vlm-lieu{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--vlm-stone);margin-top:4px}

/* --- Variante : module Portefeuille Divi habillé en mosaïque (page Références) --- */
.vlm-portfolio .et_pb_portfolio_items{margin:0!important;display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.vlm-portfolio .et_pb_portfolio_item{width:100%!important;margin:0!important;float:none!important}
.vlm-portfolio .et_portfolio_image{aspect-ratio:3/4;width:100%}
.vlm-portfolio .et_portfolio_image img{width:100%;height:100%;object-fit:cover}
.vlm-portfolio .et_overlay{background:rgba(250,248,243,.82)!important;border:none!important}
.vlm-portfolio .et_overlay:before{display:none!important}
.vlm-portfolio .et_pb_portfolio_item h2{font-family:var(--vlm-serif);font-size:1.2rem;font-weight:600;color:var(--vlm-ink);padding:14px 0 0}
.vlm-portfolio .post-meta{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--vlm-stone)}
.vlm-portfolio .et_pb_portfolio_filters ul{text-align:center}
.vlm-portfolio .et_pb_portfolio_filter a{font-family:var(--vlm-sans);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--vlm-stone)!important;border:none!important;padding:6px 0!important;margin:0 1.4em!important}
.vlm-portfolio .et_pb_portfolio_filter a.active{color:var(--vlm-ink)!important;border-bottom:1px solid var(--vlm-thread)!important}

/* ---------- 9. ACCUEIL : BIOGRAPHIE SYNTHÉTIQUE ---------- */
.vlm-bio{display:flex!important;flex-direction:row;align-items:center;gap:5vw;margin-top:4vh}
.vlm-bio .vlm-bio-texte{flex:1 1 0;order:1}
.vlm-bio figure{flex:0 0 48%;order:2;margin:0;max-width:520px}
.vlm-bio img{width:100%;height:auto;display:block}
.vlm-bio .vlm-bio-texte p{font-family:var(--vlm-serif);font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:400;line-height:1.2;color:var(--vlm-ink);margin:0 0 1em}
.vlm-bio .vlm-bio-texte .vlm-intro{font-family:var(--vlm-serif);font-style:italic;font-size:clamp(1.6rem,2.6vw,2.1rem);font-weight:500;color:var(--vlm-ink);margin-bottom:.6em}
.vlm-bio .vlm-bio-texte .vlm-porte{margin-top:1.4em}
@media (max-width:820px){
  .vlm-bio{flex-direction:column;align-items:center !important}
  .vlm-bio figure{flex:none;order:1;max-width:340px;width:100%;margin:0 auto}
  .vlm-bio .vlm-bio-texte{order:2;width:100%}
  .vlm-bio .vlm-bio-texte p{font-size:1.3rem;line-height:1.3}
}

/* ---------- 10. ACCUEIL : TRACE + INVITATION ---------- */
.vlm-trace .vlm-texte{font-family:var(--vlm-serif);font-size:clamp(1.25rem,1.9vw,1.55rem);font-weight:500;max-width:28em;line-height:1.55;margin:1.2em 0 0;color:var(--vlm-ink)}
.vlm-trace em{font-style:normal;border-bottom:1px solid var(--vlm-thread)}
.vlm-invitation{text-align:center;padding:6vh 0;opacity:1 !important;}
.vlm-invitation h2{font-family:var(--vlm-serif);font-size:clamp(1.9rem,3.8vw,3rem);font-weight:500;font-style:italic;margin:0;color:var(--vlm-ink)}
.vlm-invitation .vlm-porte{margin-top:1.6em}
.vlm-contextes .vlm-trace .vlm-texte{
  font-size: clamp(1.25rem, 1.9vw, 1.55rem);
  font-style: italic;
  color: var(--vlm-stone);
  max-width: none;
}

/* ---------- 11. RESPONSIVE ---------- */
@media (max-width:980px){
  .et-l--header .et_pb_menu__logo-wrap img{max-height:64px}
}
@media (max-width:820px){
  .vlm-salle{grid-template-columns:1fr;gap:1.8em}
  .vlm-salle figure{max-width:100%}
  .vlm-salle:nth-of-type(even) figure{order:0;margin-left:0}
  .vlm-contextes .vlm-ligne{flex-direction:column;gap:6px}
  .vlm-contextes .vlm-univers{flex:none}
  .vlm-mosaique,
  .vlm-portfolio .et_pb_portfolio_items{grid-template-columns:repeat(2,1fr)}
  .vlm-tuile{aspect-ratio:4/5}
  .vlm-tuile .vlm-voile{opacity:1;background:linear-gradient(to top, rgba(250,248,243,.92) 0%, rgba(250,248,243,0) 55%);padding:12px 14px}
  .vlm-tuile .vlm-nom{font-size:1.05rem}
  .vlm-footer{flex-direction:column}
}
@media (prefers-reduced-motion: reduce){
  html.vlm-anim .vlm-reveal{opacity:1;transform:none;transition:none}
  .vlm-caret{animation:none}
}

/* ---------- 12. CORRECTIFS D'ESPACEMENT & EMPILEMENT ---------- */
.vlm-hero{min-height:40vh;padding:0}
.vlm-salle{margin-top:5vh}
.vlm-salle:first-of-type{margin-top:3vh}
.vlm-contextes .vlm-ligne:first-of-type{border-top:1px solid var(--vlm-line)}
.vlm-mosaique{margin-top:1.6em}
.vlm-trace .vlm-texte{margin-top:0}
.vlm-invitation{padding:1vh 0 1vh}
.vlm-porte{margin-top:1.2em}

/* Forcer la serif là où Divi impose ses polices */
.vlm-devise, .vlm-questions, .vlm-cartel h3, .vlm-invitation h2,
.vlm-trace .vlm-texte, .vlm-tuile .vlm-nom, .vlm-contextes .vlm-phrase,
.vlm-bio .vlm-bio-texte p, h2.vlm-eyebrow{font-family:var(--vlm-serif)!important}

/* Le fil jaune passe derrière le contenu, mais reste visible */
.et_pb_row, .et_pb_module{position:relative;z-index:1}

.vlm-fil{width:1px!important;opacity:1!important;right:3vw!important;left:auto!important}

/* =========================================================
   PAGE BIOGRAPHIE (v3 — alternance éditoriale)
   ========================================================= */

/* ---- En-tête ---- */
.vlm-bio-hero{padding:2vh 0 0}
.vlm-bio-hero h1{font-family:var(--vlm-serif);font-size:clamp(2rem,4.4vw,3.2rem);font-weight:500;line-height:1.15;margin:0;color:var(--vlm-ink)}
.vlm-bio-hero .vlm-verbes{font-family:var(--vlm-serif);font-style:italic;font-size:clamp(1.2rem,2.2vw,1.7rem);color:var(--vlm-stone);margin:.6em 0 0}

/* ---- Intro pleine largeur (nouveau bloc) ---- */
.vlm-bio-intro-full{margin-top:6vh}
.vlm-bio-intro-full .vlm-intro{font-family:var(--vlm-serif);font-style:italic;font-size:clamp(1.6rem,2.6vw,2.1rem);font-weight:500;color:var(--vlm-ink);margin-bottom:.8em}
.vlm-bio-intro-full .vlm-intro .vlm-souligne{
  border-bottom: 1px solid var(--vlm-thread);
  padding-bottom: 2px;
}
.vlm-bio-intro-full p{font-family:var(--vlm-serif);font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:400;line-height:1.35;color:var(--vlm-ink);margin:0 0 1em;max-width:52em}

/* ---- Diptyque texte / image (structure commune) ---- */
.vlm-dip{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;margin-top:10vh}
.vlm-dip:first-of-type{margin-top:4vh}
.vlm-dip .vlm-txt{display:flex;flex-direction:column;justify-content:center}
.vlm-dip figure{margin:0;overflow:hidden;background:var(--vlm-line);align-self:stretch;min-height:520px}
.vlm-dip figure img{width:100%;height:100%;object-fit:cover;display:block;min-height:520px}

/* Variante : photo à GAUCHE (on inverse l'ordre) */
.vlm-dip.vlm-inv .vlm-txt{order:2}
.vlm-dip.vlm-inv figure{order:1}

/* La photo peut déborder vers le bord de l'écran pour l'effet magazine */
.vlm-dip.vlm-bord-d figure{margin-right:calc(100% - 50vw)}
.vlm-dip.vlm-bord-g figure{margin-left:calc(100% - 50vw)}

/* ---- Variante : diptyque à image réduite ----
   Ajouter la classe vlm-dip-petit sur le bloc concerné :
   <div class="vlm-dip vlm-bord-d vlm-dip-petit">                       */
.vlm-dip-petit{grid-template-columns:1fr 0.7fr}
.vlm-dip-petit figure{min-height:auto;max-width:400px;justify-self:end;margin-right:0!important;margin-left:0!important;align-self:center}
.vlm-dip-petit figure img{min-height:auto;height:auto}
.vlm-dip-petit.vlm-inv figure{justify-self:start}

/* ---- Prose ---- */
.vlm-prose p{font-family:var(--vlm-serif);font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:400;line-height:1.2;color:var(--vlm-ink);margin:0 0 1.1em}
.vlm-prose h2{font-family:var(--vlm-serif);font-size:clamp(1.7rem,3.2vw,2.5rem);font-weight:500;color:var(--vlm-ink);margin:0 0 .8em;position:relative;padding-top:.6em}
.vlm-prose h2::before{content:"";position:absolute;top:0;left:0;width:44px;height:2px;background:var(--vlm-thread)}
.vlm-prose em{font-style:italic}

/* ---- Repli "Lire la suite" — sans JS ---- */
.vlm-plus{position:absolute;opacity:0;pointer-events:none}
.vlm-suite{max-height:0;overflow:hidden;opacity:0;transition:max-height .6s ease, opacity .5s ease}
.vlm-plus:checked ~ .vlm-suite{max-height:1500px;opacity:1}
.vlm-lire{display:inline-block;margin-top:1.2em;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--vlm-ink);cursor:pointer;border-bottom:1px solid var(--vlm-thread);padding-bottom:5px;transition:letter-spacing .3s;user-select:none;align-self:flex-start}
.vlm-lire:hover{letter-spacing:.26em}
.vlm-lire .vlm-moins{display:none}
.vlm-plus:checked ~ .vlm-lire .vlm-plus-txt{display:none}
.vlm-plus:checked ~ .vlm-lire .vlm-moins{display:inline}

/* ---- Collection : encart pleine largeur tenu ---- */
.vlm-collection{margin-top:10vh;padding:6vh 6vw;color:var(--vlm-paper);text-align:center}
.vlm-collection p{font-family:var(--vlm-serif);font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:500;line-height:1.2;max-width:28em;margin:0 auto;color:var(--vlm-ink)}
.vlm-collection a{font-family:var(--vlm-serif);font-style:italic;color:var(--vlm-ink);border-bottom:1px solid var(--vlm-thread)}

/* ---- Frise : ligne de temps ---- */
.vlm-frise{margin-top:8vh;position:relative}
.vlm-frise h2.vlm-eyebrow{margin-bottom:1.4em}
.vlm-frise .vlm-timeline{position:relative}
.vlm-frise .vlm-timeline::before{content:"";position:absolute;left:200px;top:10px;bottom:10px;width:1px;background:var(--vlm-line)}
.vlm-frise .vlm-annee{display:grid;grid-template-columns:200px 1fr;gap:0;padding:2.4em 0;position:relative}
.vlm-frise .vlm-annee:not(:last-child){border-bottom:1px solid var(--vlm-line)}
.vlm-frise .vlm-date{font-family:var(--vlm-serif);font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:500;color:var(--vlm-ink);line-height:1.05;padding-right:40px}
.vlm-frise .vlm-annee::before{content:"";position:absolute;left:196px;top:2.7em;width:9px;height:9px;border-radius:50%;background:var(--vlm-thread);z-index:1}
.vlm-frise .vlm-fait{color:var(--vlm-ink);padding-left:44px;font-size:1.02rem;line-height:1.55}
.vlm-frise .vlm-fait strong{font-weight:500}
.vlm-frise .vlm-fait ul{margin:.6em 0 0;padding:0 0 0 1.1em}
.vlm-frise .vlm-fait li{margin:.35em 0}

/* ---- Responsive ---- */
@media (max-width:820px){
  .vlm-dip{grid-template-columns:1fr;gap:1.6em;margin-top:8vh}
  .vlm-dip .vlm-txt,.vlm-dip.vlm-inv .vlm-txt{order:2}
.vlm-dip figure{align-self:stretch;min-height:520px}
.vlm-dip figure img{min-height:520px;object-fit:cover}
 .vlm-dip-petit{grid-template-columns:1fr 0.55fr;gap:4vw;align-items:center}
.vlm-dip-petit figure{min-height:auto;max-width:300px;justify-self:end;margin-right:0!important;margin-left:0!important;align-self:center}
.vlm-dip-petit figure img{min-height:auto;height:auto}
  .vlm-frise .vlm-timeline::before{left:0}
  .vlm-frise .vlm-annee{grid-template-columns:1fr;gap:8px;padding:1.8em 0 1.8em 24px}
  .vlm-frise .vlm-annee::before{left:-4px;top:2.2em}
  .vlm-frise .vlm-fait{padding-left:0}
}
@media (max-width:820px){
  .vlm-collection{margin-top:2vh;padding:2vh 4vw}
}
@media (max-width:820px){
  .vlm-dip.vlm-bord-d figure,
  .vlm-dip.vlm-bord-g figure{
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    width:100vw!important;
  }
@media (max-width:820px){
  .vlm-frise{margin-top:3vh}
}	
}	

/* =========================================================
   CONTEXTES D'INTERVENTION
   ========================================================= */

/* ---------- Hero : bandeau d'images ---------- */
.vlm-ctx-bandeau{display:grid;grid-template-columns:repeat(4,1fr);height:58vh;min-height:380px;width:100vw;margin-left:calc(50% - 50vw)}
.vlm-ctx-bandeau div{overflow:hidden}
.vlm-ctx-bandeau img{width:100%;height:100%;object-fit:cover;display:block}
.vlm-ctx-intro{padding:3.5vh 0 0}
.vlm-ctx-intro h1{font-family:var(--vlm-serif)!important;font-size:clamp(2.2rem,5vw,3.8rem)!important;font-weight:500!important;line-height:1.05!important;color:var(--vlm-ink)!important;margin:0!important}
.vlm-ctx-intro .vlm-sous{font-family:var(--vlm-serif);font-size:clamp(1.05rem,1.5vw,1.3rem);color:var(--vlm-stone);max-width:30em;margin:.8em 0 0}

/* Sommaire */
.vlm-sommaire{
  display:flex;
  flex-wrap:wrap;
  gap:2.4em;
  padding-top:3vh;
  margin-top:3vh;
  border-top:1px solid var(--vlm-line);
}
.vlm-sommaire a{
  font-family:var(--vlm-sans);
  font-size:14px;
  font-weight:300;
  letter-spacing:2px;
  line-height:1.7;
  text-transform:uppercase;
  color:var(--vlm-stone)!important;
  text-decoration:none;
  display:inline-block;
  padding-bottom:5px;
  border-bottom:1px solid transparent;
  transition:.25s;
}
.vlm-sommaire a:hover{color:var(--vlm-ink)!important;border-bottom-color:var(--vlm-thread)}


/* ---------- Chapitre : image pleine largeur + titre ---------- */
.vlm-chap-visuel{position:relative;width:100vw;margin-left:calc(50% - 50vw);height:76vh;min-height:440px;overflow:hidden;scroll-margin-top:110px}
.vlm-chap-visuel img{width:100%;height:100%;object-fit:cover;display:block}
.vlm-chap-visuel::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(28,26,23,.62) 0%,rgba(28,26,23,.12) 45%,transparent 75%)}
.vlm-chap-legende{position:absolute;left:0;right:0;bottom:0;z-index:2;max-width:1180px;margin:0 auto;padding:0 6vw 5vh;color:#fff}
.vlm-chap-num{font-family:var(--vlm-sans);font-size:.68rem;letter-spacing:.34em;text-transform:uppercase;opacity:.85;margin:0 0 .7em;color:#fff}
.vlm-chap-legende h2{font-family:var(--vlm-serif)!important;font-size:clamp(2rem,4.6vw,3.4rem)!important;font-weight:500!important;line-height:1.05!important;margin:0!important;color:#fff!important}
.vlm-chap-legende h2 em{font-style:normal;border-bottom:2px solid var(--vlm-thread);padding-bottom:2px}

/* ---------- Texte court, deux colonnes ---------- */
.vlm-chap-corps{display:grid;grid-template-columns:1fr 1.15fr;gap:5vw;margin-top:4vh;align-items:start}
.vlm-chap-corps .vlm-accroche{font-family:var(--vlm-serif);font-size:clamp(1.2rem,1.9vw,1.55rem);line-height:1.45;color:var(--vlm-ink);margin:0}
.vlm-chap-corps .vlm-detail{font-family:var(--vlm-sans);font-size:.98rem;line-height:1.7;color:var(--vlm-stone);margin:0}
.vlm-chap-lien{display:inline-block;margin-top:1.6em;font-family:var(--vlm-sans);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--vlm-ink)!important;text-decoration:none;border-bottom:1px solid var(--vlm-thread);padding-bottom:4px}

/* ---------- Bande d'œuvres (module Code) ---------- */
.vlm-oeuvres{display:grid;grid-template-columns:repeat(4,1fr);gap:0;width:100vw;margin:5vh 0 0 calc(50% - 50vw)}
.vlm-oeuvres a{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--vlm-line);display:block}
.vlm-oeuvres img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s}
.vlm-oeuvres a:hover img{transform:scale(1.05)}
.vlm-oeuvres .vlm-cartouche{position:absolute;inset:auto 0 0 0;padding:16px 18px;color:#fff;background:linear-gradient(to top,rgba(28,26,23,.72),transparent);opacity:0;transition:opacity .3s}
.vlm-oeuvres a:hover .vlm-cartouche{opacity:1}
.vlm-oeuvres .vlm-cartouche b{display:block;font-family:var(--vlm-serif);font-size:1.05rem;font-weight:600}
.vlm-oeuvres .vlm-cartouche span{font-family:var(--vlm-sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.85}

/* ---------- Variante : module Portefeuille Divi ---------- */
.vlm-ctx-portfolio .et_pb_portfolio_filters{display:none}
.vlm-ctx-portfolio .et_pb_portfolio_items{margin:0!important;display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.vlm-ctx-portfolio .et_pb_portfolio_item{width:100%!important;margin:0!important;float:none!important}
.vlm-ctx-portfolio .et_portfolio_image{aspect-ratio:1/1;width:100%}
.vlm-ctx-portfolio .et_portfolio_image img{width:100%;height:100%;object-fit:cover}
.vlm-ctx-portfolio .et_overlay{background:linear-gradient(to top,rgba(28,26,23,.72),transparent)!important;border:none!important}
.vlm-ctx-portfolio .et_overlay:before{display:none!important}
.vlm-ctx-portfolio .et_pb_portfolio_item h2{font-family:var(--vlm-serif);font-size:1.05rem;font-weight:600;color:var(--vlm-ink);padding:12px 0 0}
.vlm-ctx-portfolio .post-meta{font-family:var(--vlm-sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-stone)}

/* ---------- Espacement des chapitres ---------- */
.vlm-chap{margin-top:12vh}

@media (max-width:900px){
  .vlm-ctx-bandeau{grid-template-columns:repeat(2,1fr);height:44vh}
  .vlm-chap-visuel{height:52vh}
	.vlm-chap-corps{margin-top:1.5vh}
  .vlm-chap-corps{grid-template-columns:1fr;gap:1.4em}
  .vlm-oeuvres,
  .vlm-ctx-portfolio .et_pb_portfolio_items{grid-template-columns:repeat(2,1fr)}
  .vlm-oeuvres .vlm-cartouche{opacity:1;padding:10px 12px}
  .vlm-chap{margin-top:2vh !important}
}
@media (max-width:900px){
  .vlm-sommaire{
    flex-direction: column;
    align-items: center;
    gap: 0.7em;
  }
  .vlm-sommaire a{
    text-align: center;
  }
}

/* =========================================================
   ÉCRITURES
   ========================================================= */

/* ---------- Bandeau ---------- */
.vlm-ecrits-hero{background:#F2EEE4;margin:0 calc(50% - 50vw);padding:7vh calc(50vw - 50%);width:100vw}
.vlm-ecrits-hero .vlm-sur{font-family:var(--vlm-sans);font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--vlm-stone);margin:0 0 .8em}
.vlm-ecrits-hero h1{font-family:var(--vlm-serif)!important;font-size:clamp(2.2rem,4.6vw,3.4rem)!important;font-weight:500!important;line-height:1.08!important;color:var(--vlm-ink)!important;margin:0!important}
.vlm-ecrits-hero .vlm-chapo{font-family:var(--vlm-serif);font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.55;color:var(--vlm-ink);max-width:34em;margin:1.2em 0 0}

/* ---------- Filtres typographiques ---------- */
.vlm-filtres{display:flex;flex-wrap:wrap;gap:2.6em;margin:3.5em 0 0;padding-bottom:2.6em;border-bottom:1px solid var(--vlm-line)}
.vlm-filtres a{
  font-family:var(--vlm-sans);
  font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--vlm-stone)!important;text-decoration:none;
  padding-bottom:6px;border-bottom:1px solid transparent;
  transition:color .25s,border-color .25s;
}
.vlm-filtres a:hover{color:var(--vlm-ink)!important}
.vlm-filtres a.actif{color:var(--vlm-ink)!important;border-bottom-color:var(--vlm-thread)}

/* ---------- Grille de cartes ---------- */
.vlm-ecrits-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:3.5em 0 0}
.vlm-carte{display:flex;flex-direction:column;text-decoration:none;color:var(--vlm-ink)!important;border:1px solid var(--vlm-line);padding:26px 28px 30px;transition:border-color .3s,transform .3s,box-shadow .3s}
.vlm-carte:hover{border-color:var(--vlm-thread);transform:translateY(-3px);box-shadow:0 10px 26px -18px rgba(28,26,23,.35)}
.vlm-carte-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:1em}
.vlm-badge{font-family:var(--vlm-sans);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-ink);background:#F2EEE4;padding:5px 13px;border-radius:100px}
.vlm-date{font-family:var(--vlm-sans);font-size:.75rem;color:var(--vlm-stone)}
.vlm-carte h3{font-family:var(--vlm-serif);font-size:clamp(1.25rem,1.9vw,1.55rem);font-weight:600;line-height:1.25;color:var(--vlm-ink);margin:0 0 .55em}
.vlm-carte p{font-family:var(--vlm-sans);font-size:.95rem;line-height:1.6;color:var(--vlm-stone);margin:0}
.vlm-carte-lien{margin-top:1.4em;font-family:var(--vlm-sans);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-ink);border-bottom:1px solid var(--vlm-thread);padding-bottom:4px;align-self:flex-start}

/* ---------- Pagination ---------- */
.vlm-pagination{display:flex;justify-content:center;gap:8px;margin-top:3em}
.vlm-page{min-width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-family:var(--vlm-sans);font-size:.8rem;color:var(--vlm-ink)!important;border:1px solid var(--vlm-line);text-decoration:none;transition:border-color .25s}
.vlm-page:hover{border-color:var(--vlm-thread)}
.vlm-page.actif{background:var(--vlm-ink);color:var(--vlm-paper)!important;border-color:var(--vlm-ink)}
.vlm-vide{font-family:var(--vlm-serif);font-size:1.2rem;color:var(--vlm-stone);margin:3em 0}

/* ---------- Responsive ---------- */
@media (max-width:980px){.vlm-ecrits-grille{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
  .vlm-ecrits-grille{grid-template-columns:1fr}
  .vlm-ecrits-hero{padding:5vh 6vw}
  .vlm-filtres{gap:1.6em;margin-top:2.5em;padding-bottom:2em}
}

/* =========================================================
   ARTICLE (single)
   ========================================================= */
body.single-post .et_pb_section{background-color:var(--vlm-paper)!important}

.vlm-article{max-width:44em;margin:0 auto;padding:2vh 0 0;text-align:left!important}
.vlm-article .et_pb_title_container,
.vlm-article .entry-title,
.vlm-article .et_pb_title_meta_container{text-align:left!important}
.vlm-article .entry-title,
.vlm-article h1{font-family:var(--vlm-serif)!important;font-size:clamp(2.1rem,4.4vw,3.2rem)!important;font-weight:500!important;line-height:1.1!important;color:var(--vlm-ink)!important;margin:0 0 .5em!important}
.vlm-article .et_pb_title_meta_container{font-family:var(--vlm-sans)!important;font-size:.72rem!important;letter-spacing:.24em;text-transform:uppercase;color:var(--vlm-stone)!important}

.vlm-article-corps {
  max-width: 44em;
  margin: 2.5em auto 0;
}

/* Paragraphes */
.vlm-article-corps p {
  font-family: var(--vlm-serif) !important;
  font-size: clamp(1.2rem, 1.6vw, 1.45rem) !important;
  line-height: 1.35 !important;
  color: var(--vlm-ink) !important;
  margin: 0 0 0.8em !important;
  padding: 0 !important;
  text-align: left !important;
}

/* Évite que les styles ajoutés dans l’éditeur perturbent l’affichage */
.vlm-article-corps span {
  font-size: inherit !important;
  line-height: inherit !important;
  background: transparent !important;
}

/* Suppression des paragraphes vides */
.vlm-article-corps p:empty,
.vlm-article-corps p:has(> br:only-child) {
  display: none !important;
}

/* Titres H2 */
.vlm-article-corps h2 {
  font-family: var(--vlm-serif) !important;
  font-size: clamp(1.6rem, 3vw, 2.2rem) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  color: var(--vlm-ink) !important;
  margin: 1.3em 0 0.4em !important;
}

/* Titres H3 */
.vlm-article-corps h3 {
  font-family: var(--vlm-serif) !important;
  font-size: clamp(1.3rem, 2.2vw, 1.7rem) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: var(--vlm-ink) !important;
  margin: 1.1em 0 0.35em !important;
}

/* Liens */
.vlm-article-corps a {
  color: var(--vlm-ink);
  border-bottom: 1px solid var(--vlm-thread);
  text-decoration: none;
}

/* Citations */
.vlm-article-corps blockquote {
  margin: 1.3em 0;
  padding: 0 0 0 1.4em;
  border-left: 2px solid var(--vlm-thread);
  font-family: var(--vlm-serif);
  font-style: italic;
  font-size: clamp(1.3rem, 2.2vw, 1.7rem);
  line-height: 1.4;
  color: var(--vlm-ink);
}

/* Paragraphes présents dans les citations */
.vlm-article-corps blockquote p {
  margin-bottom: 0.4em !important;
}

/* Listes */
.vlm-article-corps ul,
.vlm-article-corps ol {
  font-family: var(--vlm-serif);
  font-size: clamp(1.2rem, 1.6vw, 1.45rem);
  line-height: 1.35;
  color: var(--vlm-ink);
  margin: 0 0 0.5em;
  padding-left: 1.4em;
}

.vlm-article-corps li {
  margin: 0.15em 0;
}

/* Paragraphes présents dans les listes */
.vlm-article-corps li p {
  margin-bottom: 0.2em !important;
}

/* Images */
.vlm-article-corps img {
  display: block;
  height: auto;
  margin: 2em auto;
  max-width: 100%;
}

/* Figures */
.vlm-article-corps figure {
  margin: 2em 0;
}

/* Légendes */
.vlm-article-corps figcaption,
.vlm-article-corps .wp-caption-text {
  font-family: var(--vlm-sans);
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--vlm-stone);
  text-align: center;
  margin-top: 0.6em;
}

/* Images pleine largeur */
.vlm-article-corps .alignfull {
  max-width: 100vw;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Images larges */
.vlm-article-corps .alignwide {
  max-width: 120%;
  width: 120%;
  margin-left: -10%;
}

.vlm-article-pied{max-width:44em;margin:5em auto 0;padding-top:2em;border-top:1px solid var(--vlm-line)}
.vlm-article-pied a{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-ink);border-bottom:1px solid var(--vlm-thread);padding-bottom:5px;text-decoration:none}

.wp-block-file__button{
  font-family:var(--vlm-sans)!important;
  font-size:.76rem!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
  color:var(--vlm-paper)!important;
  background:var(--vlm-ink)!important;
  border:0!important;
  border-radius:0!important;
  padding:12px 28px!important;
  text-decoration:none!important;
  transition:background .25s;
}
.wp-block-file__button:hover{
  background:var(--vlm-stone)!important;
}

/* =========================================================
   PAGE CONTACT
   ========================================================= */
.vlm-contact{display:grid;grid-template-columns:0.9fr 1.1fr;gap:6vw;align-items:start;margin-top:2vh}

/* Colonne gauche */
.vlm-contact-intro h1{font-family:var(--vlm-serif)!important;font-size:clamp(2.2rem,4.6vw,3.4rem)!important;font-weight:500!important;line-height:1.08!important;color:var(--vlm-ink)!important;margin:0 0 .6em!important}
.vlm-contact-intro .vlm-accroche{font-family:var(--vlm-serif);font-size:clamp(1.2rem,1.9vw,1.55rem);line-height:1.5;color:var(--vlm-ink);margin:0 0 2em}
.vlm-contact-intro .vlm-coord{font-family:var(--vlm-sans);font-size:.95rem;line-height:1.9;color:var(--vlm-stone)}
.vlm-contact-intro .vlm-coord a{color:var(--vlm-ink);border-bottom:1px solid var(--vlm-thread);text-decoration:none}
.vlm-contact-intro .vlm-coord .vlm-label{display:block;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--vlm-stone);margin-top:1.4em}

/* Formulaire */
.vlm-form .vlm-field{margin-bottom:1.8em}
.vlm-form label{display:block;font-family:var(--vlm-sans);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vlm-stone);margin-bottom:8px}
.vlm-form input[type=text],
.vlm-form input[type=email],
.vlm-form textarea{
  width:100%;
  font-family:var(--vlm-sans);font-size:1rem;color:var(--vlm-ink);
  background:transparent;
  border:0;border-bottom:1px solid var(--vlm-line);
  border-radius:0;padding:10px 0;
  transition:border-color .25s;
}
.vlm-form input:focus,
.vlm-form textarea:focus{border-bottom-color:var(--vlm-thread);outline:none}
.vlm-form textarea{min-height:130px;resize:vertical}

/* Case RGPD */
.vlm-form .vlm-checkbox-field{display:flex;gap:10px;align-items:flex-start;margin:1.4em 0 2em}
.vlm-form .vlm-checkbox-field input{margin-top:4px;accent-color:var(--vlm-thread)}
.vlm-form .vlm-checkbox-field label{font-family:var(--vlm-sans);font-size:.82rem;letter-spacing:0;text-transform:none;color:var(--vlm-stone);margin:0;line-height:1.5}
.vlm-form .vlm-checkbox-field a{color:var(--vlm-ink);border-bottom:1px solid var(--vlm-thread);text-decoration:none}

/* Bouton */
.vlm-form .vlm-btn-submit{
  font-family:var(--vlm-sans);font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--vlm-paper);background:var(--vlm-ink);
  border:0;border-radius:0;padding:15px 40px;
  cursor:pointer;transition:background .25s;
}
.vlm-form .vlm-btn-submit:hover{background:var(--vlm-stone)}

/* Messages succès / erreur */
.vlm-form-message{font-family:var(--vlm-serif);font-size:1.2rem;padding:1.4em 1.6em;margin-bottom:2em}
.vlm-form-success{background:#F2EEE4;border-left:2px solid var(--vlm-thread);color:var(--vlm-ink)}
.vlm-form-error{background:#faeae7;border-left:2px solid #a3402f;color:#a3402f}

@media (max-width:820px){
  .vlm-contact{grid-template-columns:1fr;gap:3em}
}

body{background-color:#FAF8F3 !important;}

.et_pb_section {background-color:#FAF8F3 !important;}