/* ============================================================================
   Atelier LUXE (Claude, 30/09/2026) — LA MAISON, phase 3 de la consigne du 29/09.
   Un apport de contenu : la composition « Une Maison, des vocations distinctes »
   (phrase du propriétaire ; Caravelli Costruzioni et Fondazione Caravelli liées
   aux seuls domaines déjà présents dans la page). Un raffinement : le détail
   d'archive du plan de Florence — recadrage CSS de cartes/firenze-1835.jpg,
   planche déjà servie, agrandissement complémentaire (la planche
   entière et ses commandes restent) — qui révèle sa légende au clic/focus, avec
   une lecture lente (transform composé) arrêtée sous la garde centrale
   body[data-tc-cine-paused="true"], légende ouverte, focus, mouvement réduit,
   contraste renforcé, couleurs forcées, impression.
   Galerie ivoire : loggia.webp conservée (signature de La Maison) ; seul le
   kicker change, dans le HTML. Aucune feuille de Codex modifiée ; surcharges
   par cascade sous body.page-la-maison:not(#lx) (1,2,1 + …) ; aucun
   !important ; aucun décalage de mise en page (espaces réservés ; opacité et
   transform seulement) ; aucune nouvelle police ; aucun nouvel actif.
   LOT INTENSITÉ (Claude, 30/09/2026 ; arbitrages Codex 16:45, 16:49) : la
   galerie devient la profondeur centrale de la loggia — passe-partout intérieur
   allégé et marge droite réduite (l'image gagne la place), caméra qui avance
   lentement vers la baie centrale avec un léger travelling (seul zoom du site,
   propriétés individuelles scale/translate : le transform du moteur n'est pas
   touché), lumière chaude qui balaie les arcades. Détail Firenze : même
   parcours, même cadre, mêmes arrêts au focus/légende ; sa lecture marque deux
   temps de repos (Duomo, Piazza del Granduca) au lieu d'un glissé continu,
   40 s → 26 s. Le bloc des vocations est inchangé.
   ============================================================================ */

/* ---- 1. Composition « Une Maison, des vocations distinctes » ---------------- */
body.page-la-maison:not(#lx) .lx-vocations {
  position: relative;            /* le voile « poussière » de la dramaturgie s'y pose comme sur tout chapitre */
  isolation: isolate;
  box-sizing: border-box;
  margin: 0;
  padding: clamp(44px, 4.6vw, 72px) var(--tc-gutter, 5.6vw) clamp(48px, 4.8vw, 76px);
  background: var(--mc-paper-warm, var(--co-paper, #f4f0e8));
  color: var(--mc-green-ink, #122d25);
  font-family: var(--tc-serif, "Times New Roman", serif);
  scroll-margin-top: 90px;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-running {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px 24px;
  margin: 0; padding-bottom: 20px;
  border-bottom: 1px solid var(--mc-line-paper, #122d2538);
  background: linear-gradient(var(--mc-orange-ink, #963d19), var(--mc-orange-ink, #963d19)) left bottom / 48px 1px no-repeat;
  font-family: var(--tc-sans, Arial, sans-serif); font-size: 12px; line-height: 1.6; letter-spacing: .1em; text-transform: uppercase;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-running span:last-child { color: var(--mc-orange-ink, #963d19); }
body.page-la-maison:not(#lx) .lx-vocations .lx-tete {
  display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: end;
  gap: 26px clamp(28px, 6vw, 96px); padding: clamp(28px, 3vw, 44px) 0 clamp(30px, 3.2vw, 46px);
}
body.page-la-maison:not(#lx) .lx-vocations .lx-titre {
  margin: 0; max-width: 15ch; color: inherit;
  font: 300 clamp(40px, 4.9vw, 78px) / 1.04 var(--tc-serif, "Times New Roman", serif);
  letter-spacing: -.028em; text-wrap: balance;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-phrase {
  margin: 0 0 6px; justify-self: end; max-width: 34ch;
  font-size: clamp(17px, 1.35vw, 21px); line-height: 1.65; color: var(--mc-green-copy, #334d42); text-wrap: pretty;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-liste {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--mc-line-paper, #122d2538); border-bottom: 1px solid var(--mc-line-paper, #122d2538);
}
body.page-la-maison:not(#lx) .lx-vocations .lx-liste > li { min-width: 0; display: grid; }
body.page-la-maison:not(#lx) .lx-vocations .lx-liste > li + li { border-left: 1px solid var(--mc-line-paper, #122d2538); }
body.page-la-maison:not(#lx) .lx-vocations .lx-cellule {
  display: grid; grid-template-rows: auto auto 1fr; gap: 14px; box-sizing: border-box; min-height: 100%;
  padding: 28px clamp(18px, 2.4vw, 36px) 30px; color: inherit; text-decoration: none; letter-spacing: normal;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-liste > li:first-child .lx-cellule { padding-left: 0; }
body.page-la-maison:not(#lx) .lx-vocations .lx-nom {
  font: 300 clamp(26px, 2.5vw, 38px) / 1.1 var(--tc-serif, "Times New Roman", serif); letter-spacing: -.02em;
  text-decoration-thickness: 1px; text-underline-offset: 8px;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-ici .lx-nom { border-inline-start: 2px solid currentColor; padding-inline-start: 16px; }
body.page-la-maison:not(#lx) .lx-vocations .lx-vocation {
  font: 400 12px / 1.6 var(--tc-sans, Arial, sans-serif); letter-spacing: .1em; text-transform: uppercase; color: var(--mc-orange-ink, #963d19);
}
body.page-la-maison:not(#lx) .lx-vocations .lx-domaine {
  align-self: end; font: 400 13px / 1.6 var(--tc-sans, Arial, sans-serif); letter-spacing: .03em;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px;
}
body.page-la-maison:not(#lx) .lx-vocations .lx-ici .lx-domaine { text-decoration: none; opacity: .72; }
body.page-la-maison:not(#lx) .lx-vocations .lx-domaine i { font-style: normal; display: inline-block; transition: translate var(--tc-dur-vif, 320ms) var(--tc-ease-vif, ease); }
body.page-la-maison:not(#lx) .lx-vocations a.lx-cellule:hover .lx-nom { text-decoration: underline; }
body.page-la-maison:not(#lx) .lx-vocations a.lx-cellule:hover .lx-domaine i { translate: 2px -2px; }
body.page-la-maison:not(#lx) .lx-vocations a.lx-cellule:focus-visible { outline: 2px solid var(--co-orange, #f37021); outline-offset: 5px; }
body.page-la-maison:not(#lx)[data-tc-cine-paused="true"] .lx-vocations .lx-domaine i { transition: none; translate: none; }

@media (max-width: 900px) {
  body.page-la-maison:not(#lx) .lx-vocations .lx-tete { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-phrase { justify-self: start; max-width: 48ch; }
}
@media (max-width: 700px) {
  body.page-la-maison:not(#lx) .lx-vocations { padding: 38px 22px 44px; scroll-margin-top: 76px; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-running { font-size: 11px; letter-spacing: .07em; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-titre { font-size: clamp(34px, 9.6vw, 56px); max-width: none; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-phrase { font-size: 16px; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-liste { grid-template-columns: minmax(0, 1fr); }
  body.page-la-maison:not(#lx) .lx-vocations .lx-liste > li + li { border-left: 0; border-top: 1px solid var(--mc-line-paper, #122d2538); }
  body.page-la-maison:not(#lx) .lx-vocations .lx-cellule { padding: 22px 0 24px; gap: 10px; }
  body.page-la-maison:not(#lx) .lx-vocations .lx-nom { font-size: 28px; }
}

/* ---- 2. Détail d'archive : recadrage de cartes/firenze-1835.jpg, légende au clic/focus ---- */
body.page-la-maison:not(#lx) .lx-detail {
  --lx-echelle: 2;                 /* 2 500 px × 2 : le quartier du Duomo, agrandi ~8 fois par rapport à la planche montée */
  margin: clamp(26px, 2.6vw, 38px) 0 0; padding: 0; max-width: 560px; color: inherit;
}
body.page-la-maison:not(#lx) .lx-detail-bouton {
  display: block; position: relative; width: 100%; margin: 0; padding: 0; border: 0; border-radius: 0;
  background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; -webkit-appearance: none; appearance: none;
}
body.page-la-maison:not(#lx) .lx-detail-cadre {
  display: block; position: relative; height: clamp(170px, 16vw, 236px); overflow: hidden; contain: paint;
  background: var(--co-mount, #e9e2d7); border: 1px solid var(--it-f1, #071e1857);
  box-shadow: 0 18px 30px -26px #071e18aa;
}
body.page-la-maison:not(#lx) .lx-detail-cadre img {
  position: absolute; left: 50%; top: 50%; display: block; max-width: none;
  width: calc(2500px * var(--lx-echelle)); height: calc(1848px * var(--lx-echelle));
  /* Point d'ancrage : Il Duomo (≈ 1 388 × 830 px de la planche) au centre du cadre. */
  translate: calc(-1388px * var(--lx-echelle)) calc(-830px * var(--lx-echelle));
  animation: lx-lecture 26s cubic-bezier(.45, 0, .55, 1) infinite alternate;
}
/* Lecture en deux temps : repos sur le Duomo, glissé vers la Piazza del Granduca et l'Arno, repos, puis retour (alternate). */
@keyframes lx-lecture {
  0%, 16% { transform: translate(0, 0); animation-timing-function: cubic-bezier(.45, 0, .55, 1); }
  84%, 100% { transform: translate(calc(130px * var(--lx-echelle)), calc(-360px * var(--lx-echelle))); }
}
body.page-la-maison:not(#lx)[data-tc-cine-paused="true"] .lx-detail-cadre img,
body.page-la-maison:not(#lx) .lx-detail[data-lx-ouvert="true"] .lx-detail-cadre img,
body.page-la-maison:not(#lx) .lx-detail:focus-within .lx-detail-cadre img { animation-play-state: paused; }
body.page-la-maison:not(#lx) .lx-detail-chip {
  position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 10px;
  min-height: 34px; padding: 7px 12px 7px 14px; box-sizing: border-box;
  background: var(--co-paper, #f4f0e8); color: var(--co-ink, #071e18); border: 1px solid var(--co-line, #071e182d);
  font: 400 11.5px / 1.5 var(--tc-sans, Arial, sans-serif); letter-spacing: .085em; text-transform: uppercase;
  transition: background-color var(--tc-dur-vif, 320ms) ease, color var(--tc-dur-vif, 320ms) ease;
}
body.page-la-maison:not(#lx) .lx-detail-chip i {
  font-style: normal; display: inline-grid; place-items: center; width: 16px; height: 16px;
  border: 1px solid currentColor; border-radius: 50%; font-size: 12px; line-height: 1;
}
body.page-la-maison:not(#lx) .lx-detail-chip i::before { content: "+"; }
body.page-la-maison:not(#lx) .lx-detail-bouton[aria-expanded="true"] .lx-detail-chip i::before { content: "−"; }
body.page-la-maison:not(#lx) .lx-detail-bouton:hover .lx-detail-chip,
body.page-la-maison:not(#lx) .lx-detail-bouton:focus-visible .lx-detail-chip,
body.page-la-maison:not(#lx) .lx-detail-bouton[aria-expanded="true"] .lx-detail-chip { background: var(--co-ink, #071e18); color: var(--co-paper, #f4f0e8); }
body.page-la-maison:not(#lx) .lx-detail-bouton:focus-visible { outline: 2px solid var(--co-orange, #f37021); outline-offset: 5px; }
/* Zone réservée : repère au repos, légende au clic/focus. Même boîte, aucun reflux. */
body.page-la-maison:not(#lx) .lx-detail-zone {
  position: relative; margin: 0; padding: 14px 0 0; min-height: calc(14px + 4 * 1.6em);
  font: 400 12.5px / 1.6 var(--tc-sans, Arial, sans-serif); letter-spacing: .03em; color: inherit;
}
body.page-la-maison:not(#lx) .lx-detail-zone > span { position: absolute; left: 0; right: 0; top: 14px; display: block; transition: opacity var(--tc-dur-vif, 320ms) var(--tc-ease-vif, ease); }
body.page-la-maison:not(#lx) .lx-detail-repere { font-size: 11.5px; letter-spacing: .085em; text-transform: uppercase; color: var(--co-ochre, #f37021); }
body.page-la-maison:not(#lx) .lx-detail-legende { max-width: 46ch; opacity: 0; visibility: hidden; }
body.page-la-maison:not(#lx) .lx-detail[data-lx-ouvert="true"] .lx-detail-legende,
body.page-la-maison:not(#lx) .lx-detail:not([data-lx-ready="true"]):focus-within .lx-detail-legende { opacity: 1; visibility: visible; }
body.page-la-maison:not(#lx) .lx-detail[data-lx-ouvert="true"] .lx-detail-repere,
body.page-la-maison:not(#lx) .lx-detail:not([data-lx-ready="true"]):focus-within .lx-detail-repere { opacity: 0; visibility: hidden; }

@media (max-width: 700px) {
  body.page-la-maison:not(#lx) .lx-detail { --lx-echelle: 1.6; margin-top: 26px; max-width: none; }
  body.page-la-maison:not(#lx) .lx-detail-cadre { height: 176px; }
  body.page-la-maison:not(#lx) .lx-detail-zone { min-height: calc(14px + 6 * 1.6em); }
}

/* ---- 3. Préférences et gardes : tout devient statique, rien ne disparaît ---- */
@media (prefers-reduced-motion: reduce), (prefers-contrast: more), (forced-colors: active), print {
  body.page-la-maison:not(#lx) .lx-detail-cadre img { animation: none; transform: none; }
  body.page-la-maison:not(#lx) .lx-detail-zone > span,
  body.page-la-maison:not(#lx) .lx-detail-chip,
  body.page-la-maison:not(#lx) .lx-vocations .lx-domaine i { transition: none; translate: none; }
}
@media (forced-colors: active) {
  body.page-la-maison:not(#lx) .lx-vocations { background: Canvas; color: CanvasText; }
  body.page-la-maison:not(#lx) .lx-vocations :is(.lx-running, .lx-liste, .lx-liste > li + li) { border-color: CanvasText; background-image: none; }
  body.page-la-maison:not(#lx) .lx-vocations :is(.lx-vocation, .lx-running span:last-child) { color: CanvasText; }
  body.page-la-maison:not(#lx) .lx-detail-cadre { border-color: CanvasText; box-shadow: none; }
  body.page-la-maison:not(#lx) .lx-detail-chip { background: ButtonFace; color: ButtonText; border-color: ButtonText; }
  body.page-la-maison:not(#lx) .lx-detail-repere { color: CanvasText; }
}
@media print {
  body.page-la-maison:not(#lx) .lx-detail-legende { opacity: 1; visibility: visible; position: static; }
  body.page-la-maison:not(#lx) .lx-detail-repere { display: none; }
}
/* ---- 4. LOT INTENSITÉ — galerie ivoire : la profondeur de la loggia ---------------------------------------------------
   Passe-partout intérieur allégé (bordure de l'image 14 → 4 px) et marge droite du passe-partout extérieur réduite :
   l'image prend la place, le cadre ne domine plus d'un côté. Caméra : avancée lente vers la baie centrale et léger
   travelling (16 s, aller-retour), par les propriétés individuelles scale/translate de l'image — elles se composent au
   transform du moteur (galeries-ivoire, edition-sensorielle) sans le remplacer ; couverture garantie (échelle ≥ 1 + 2 ×
   décalage). Lumière chaude qui balaie les arcades (::before de .iv-picture, 20 s, décalée de la caméra). Au repos et en
   mouvement réduit : l'image servie, sans échelle ni lumière. */
body.page-la-maison:not(#lx) .iv-gallery { --mc-gallery-mat: clamp(8px, 1vw, 16px); }
body.page-la-maison:not(#lx) .iv-gallery .iv-stage > .iv-picture { border-width: clamp(3px, .3vw, 5px); }
body.page-la-maison:not(#lx) .iv-gallery .iv-stage > .iv-picture img {
  animation: lx-loggia-camera 16s cubic-bezier(.45, 0, .55, 1) infinite alternate;
  animation-play-state: paused;
}
@keyframes lx-loggia-camera {
  from { scale: 1.05; translate: -1.8% .6%; }
  to { scale: 1.18; translate: 2.2% -1.4%; }
}
body.page-la-maison:not(#lx) .iv-gallery .iv-picture::before {
  content: "";
  position: absolute;
  inset: -8% -95%;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(97deg, transparent 39%, #ffc98030 44.5%, #ffdca466 49.5%, #ffe6b87a 50.5%, #ffc98033 55.5%, transparent 61%),
    radial-gradient(ellipse 7% 40% at 50% 66%, #ffd69a4d, transparent 72%);
  transform: translate3d(-10%, 0, 0);
  animation: lx-loggia-lumiere 20s cubic-bezier(.45, 0, .55, 1) infinite alternate;
  animation-play-state: paused;
}
@keyframes lx-loggia-lumiere { from { transform: translate3d(-10%, 0, 0); } to { transform: translate3d(16%, 0, 0); } }
body.page-la-maison:not([data-tc-cine-paused="true"]):not(#lx) .iv-gallery[data-active="true"][data-moving="true"] .iv-stage > .iv-picture img,
body.page-la-maison:not([data-tc-cine-paused="true"]):not(#lx) .iv-gallery[data-active="true"][data-moving="true"] .iv-picture::before { animation-play-state: running; }

/* ---- Gardes réaffirmées en fin de feuille (aucun raccourci « animation » ne peut les rouvrir) ---- */
body.page-la-maison[data-tc-cine-paused="true"]:not(#lx) .iv-gallery .iv-stage > .iv-picture img,
body.page-la-maison[data-tc-cine-paused="true"]:not(#lx) .iv-gallery .iv-picture::before,
body.page-la-maison:not(#lx) .iv-gallery:not([data-moving="true"]) .iv-stage > .iv-picture img,
body.page-la-maison:not(#lx) .iv-gallery:not([data-moving="true"]) .iv-picture::before { animation-play-state: paused; }
body.page-la-maison:not(#lx)[data-tc-cine-paused="true"] .lx-detail-cadre img,
body.page-la-maison:not(#lx) .lx-detail[data-lx-ouvert="true"] .lx-detail-cadre img,
body.page-la-maison:not(#lx) .lx-detail:focus-within .lx-detail-cadre img { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce), (prefers-contrast: more), (forced-colors: active), print {
  body.page-la-maison:not(#lx) .iv-gallery .iv-stage > .iv-picture img { animation: none; scale: none; translate: none; }
  body.page-la-maison:not(#lx) .iv-gallery .iv-picture::before { animation: none; transform: translate3d(-10%, 0, 0); }
  body.page-la-maison:not(#lx) .lx-detail-cadre img { animation: none; transform: none; }
}
@media (prefers-contrast: more), (forced-colors: active), print {
  body.page-la-maison:not(#lx) .iv-gallery .iv-picture::before { display: none; }
}
