/* ============================================================
   Lutopie Business Club — grammaire structurelle des pages internes.
   Chargée par toutes les pages SAUF les deux homes, qui ont leur
   propre mise en page sur mesure (home.css).

   Objectif : sortir de l'empilement centré sans réécrire le markup
   de 51 pages. On s'appuie sur les classes posées par lux.js.
   ============================================================ */

/* --- 1. HERO : centré, sur l'axe ------------------------------
   Une version antérieure ancrait à gauche le titre de chaque page
   intérieure, pour rompre l'empilement centré. À l'usage l'effet ne
   se lisait pas comme un parti pris mais comme un défaut : les titres
   paraissaient décalés sur le côté, et le site perdait son unité —
   La mise en relation, qui suit la grammaire de la home, restait
   centrée pendant que ses voisines penchaient à gauche.
   Le hero revient donc dans l'axe partout. L'asymétrie subsiste là où
   elle se justifie : proportions de grille et quinconce (§3). */
[data-lbc-lux]:not([data-lbc-home]) section.lux-hero .lux-centered{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
[data-lbc-lux]:not([data-lbc-home]) section.lux-hero .lux-rule-gold{
  margin-left:auto !important; margin-right:auto !important;
  /* dégradé symétrique : un filet centré ne peut pas s'éteindre d'un seul côté */
  background:linear-gradient(90deg,transparent,var(--lbc-gold),transparent) !important;
}
[data-lbc-lux]:not([data-lbc-home]) section.lux-hero h1{
  margin-left:auto !important; margin-right:auto !important;
}
[data-lbc-lux]:not([data-lbc-home]) section.lux-hero p{
  margin-left:auto !important; margin-right:auto !important;
}

/* --- 2. RYTHME ALTERNÉ — RETIRÉ ------------------------------
   Une version antérieure forçait margin-left:0 / margin-left:auto
   sur les conteneurs de section pour créer une alternance. Cela
   écrasait leur `margin:0 auto` : les blocs cessaient d'être
   centrés, les grilles ne s'alignaient plus sur leur titre et
   débordaient à droite. Le gain visuel ne valait pas la casse.
   L'asymétrie passe désormais uniquement par le hero décentré
   et par les proportions de grille, qui ne touchent pas au
   centrage du conteneur. */

/* --- 3. GRILLES : asymétrie et quinconce --------------------- */
/* .lux-grid-sep = grille à vraie gouttière. Sans ce garde-fou, le décalage
   appliqué à un treillis à bordures partagées fait chevaucher les cellules. */
[data-lbc-lux]:not([data-lbc-home]) [data-lux-cols="2"].lux-grid-sep{
  grid-template-columns:1.08fr .92fr !important;
}
[data-lbc-lux]:not([data-lbc-home]) [data-lux-cols="3"].lux-grid-sep > *:nth-child(3n+2){
  margin-top:clamp(16px,2.5vw,44px);
}
[data-lbc-lux]:not([data-lbc-home]) [data-lux-cols="3"].lux-grid-sep > *:nth-child(3n+3){
  margin-top:clamp(32px,5vw,88px);
}

/* --- 4. TITRES DE SECTION : sortis de l'axe ------------------ */
[data-lbc-lux]:not([data-lbc-home]) section:not(.lux-hero) h2{
  max-width:20ch;
}

@media (max-width:860px){
  /* sur petit écran, tout revient dans l'axe : l'asymétrie n'a plus de sens */
  [data-lbc-lux]:not([data-lbc-home]) section > div{ margin-inline:auto !important; }
  [data-lbc-lux]:not([data-lbc-home]) [data-lux-cols="3"] > *{ margin-top:0 !important; }
  [data-lbc-lux]:not([data-lbc-home]) [data-lux-cols="2"].lux-grid-sep{ grid-template-columns:1fr !important; }
}

/* --- GALERIE ÉVÉNEMENTS ---------------------------------------
   Les photos étaient forcées en 3/4 portrait avec object-fit:cover,
   alors que les sources mélangent portrait (1169×1746) et paysage
   (1169×772) : les visages étaient tranchés. On rend leur ratio
   naturel à chaque image et on laisse une mise en colonnes absorber
   la différence de hauteur. */
[data-lbc-lux] .ev-gallery{
  display:block !important;
  columns:4 220px;
  column-gap:20px;
}
[data-lbc-lux] .ev-gallery img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:auto !important;      /* ratio intrinsèque via width/height */
  object-fit:contain !important;      /* plus aucun recadrage */
  max-height:60vh;
  display:block;
  margin:0 0 20px;
  break-inside:avoid;
  grid-column:auto !important;
}
/* Une galerie à image unique ne doit pas se réduire à une colonne :
   elle occupe toute la largeur, comme dans la mise en page d'origine. */
[data-lbc-lux] .ev-gallery:has(> img:only-child){ columns:1; }
@media (max-width:900px){
  [data-lbc-lux] .ev-gallery{ columns:2 160px; }
}

/* LES DOMAINES : le bloc .lbc-fields a migré dans lux.css — il est
   désormais utilisé aussi par des pages qui chargent home.css (Mise en
   relation, Événements) et ne voient donc jamais cette feuille. */