/*
Theme Name: Pixence child
Theme URI: https://wordpress.org/themes/twentytwentyfive/
*/
/* ============================================================
   BioMécanique — style-anatomique.css
   Variante DA "Planche anatomique" — classes préfixées "bma-".
   La majeure partie est en CSS pur (menu via :target, préchargement,
   progress bar, motifs flottants). Piloté par script-anatomique.js :
   la citation de la section « Le Constat » qui s'éclaire mot par mot
   au scroll, et la révélation en fondu + flou des blocs .bma-rv.
   Fichier source unique : copier-coller intégralement ce fichier
   dans wp-content/themes/pixence-child/style.css pour publier.
   ============================================================ */

:root{
  --bma-parchment:#E7D8B4;
  --bma-ink:#241E18;
  --bma-ink-soft:#5B4F40;
  --bma-muted:#8A7B64;
  --bma-line:rgba(74,58,42,.2);
  --bma-sanguine:#A83A2C;
  --bma-footer-bg:#241E18;
  --bma-footer-text:#E9E0CE;
  --bma-font-serif:'Spectral', serif;
  --bma-font-mono:'Space Mono', monospace;
}

html{scroll-behavior:smooth}

.bma-page, .bma-page *{margin:0;padding:0;box-sizing:border-box}
.bma-page{background:radial-gradient(ellipse 560px 440px at 6% 12%,rgba(122,88,46,.09),transparent 60%),radial-gradient(ellipse 460px 560px at 95% 82%,rgba(122,88,46,.08),transparent 60%),radial-gradient(ellipse 700px 340px at 55% 48%,rgba(122,88,46,.04),transparent 70%),var(--bma-parchment);color:var(--bma-ink);font-family:var(--bma-font-mono);-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.6}
.bma-page ::selection{background:var(--bma-sanguine);color:var(--bma-parchment)}
/* :where() = spécificité nulle : cette couleur de lien "par défaut"
   ne doit jamais pouvoir écraser une couleur plus spécifique définie
   ailleurs (boutons, header, footer, menu...), quel que soit l'ordre
   des règles dans le fichier. */
.bma-page a{text-decoration:none}
:where(.bma-page a){color:var(--bma-ink)}
:where(.bma-page a:hover){color:var(--bma-sanguine)}
.bma-page em{font-style:italic}

@keyframes bma-fade{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@keyframes bma-float-y{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes bma-spin{to{transform:rotate(360deg)}}
@keyframes bma-preloader-out{from{opacity:1;visibility:visible}to{opacity:0;visibility:hidden}}
@keyframes bma-thread-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes bma-thread-mark-reveal{from{opacity:0;transform:translateY(16px) scale(.85)}to{opacity:.55;transform:translateY(0) scale(1)}}

/* Révélation au scroll (fondu + flou + léger décalage), pilotée par
   script-anatomique.js (bmaInitReveal, IntersectionObserver). Visible
   par défaut : si JS est désactivé/indisponible ou en cas de
   prefers-reduced-motion, la classe --ready n'est jamais posée et les
   blocs .bma-rv restent simplement affichés (repli toujours sûr). */
.bma-rv{opacity:1}
.bma-rv.bma-rv--ready{opacity:0;transition:opacity .9s ease-in-out}
.bma-rv.bma-rv--ready.bma-rv--in{opacity:1}
.bma-plate__lead.bma-rv {color: inherit;}
#pratique .bma-pratique__footer {
gap: 0 30px;
}
.bma-constat {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.bma-trust {
width: 40%;
margin-top: 24px;
}

.bma-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Citation qui s'éclaire mot par mot : flou + estompé + grisé par
   défaut, net et en pleine opacité une fois "lit" au scroll (piloté
   par script-anatomique.js). Contrairement à un déclenchement
   IntersectionObserver à sens unique, la position est recalculée à
   chaque scroll dans les deux sens : remonter refait l'inverse
   naturellement, pas besoin de recharger la page.
   Repli sans JS : voir la balise <noscript> dans header-anatomique.php,
   qui repasse tous les mots nets et en encre pleine. */
.bma-word{display:inline-block;color:var(--bma-muted);opacity:.35;filter:blur(6px);transition:color .5s ease,opacity .5s ease,filter .5s ease}
.bma-word.is-lit{color:var(--bma-ink);opacity:1;filter:blur(0)}
.bma-constat__lead em .bma-word.is-lit{color:var(--bma-sanguine)}

.bma-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--bma-font-mono);font-size:11px;letter-spacing:.16em;padding:15px 30px;transition:background .3s ease,color .3s ease,border-color .3s ease}
.bma-btn--solid{background:var(--bma-sanguine);color:#F3ECDD}
.bma-btn--solid:hover{background:#7c2c20;color:#F3ECDD}
.bma-btn--ghost{border:1px solid var(--bma-line);color:var(--bma-ink-soft)}
.bma-btn--ghost:hover{border-color:var(--bma-sanguine);color:var(--bma-sanguine)}
.bma-tag{display:inline-block;font-family:var(--bma-font-mono);font-size:11px;color:var(--bma-ink-soft);border:1px solid var(--bma-line);padding:6px 13px}

/* ---- Préchargement (CSS pur) ---- */
.bma-preloader{position:fixed;inset:0;z-index:90;background:var(--bma-parchment);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;animation:bma-preloader-out .9s ease 1.6s forwards}
.bma-preloader__gear{width:36px;opacity:.75;animation:bma-spin 3.5s linear infinite}
.bma-preloader__title{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(30px,4.6vw,54px);color:var(--bma-ink);opacity:0;animation:bma-fade 1s .3s both}
.bma-preloader__sub{font-size:11px;letter-spacing:.26em;color:var(--bma-sanguine);opacity:0;animation:bma-fade 1s .6s both}

/* ---- En-tête ---- */
.bma-header{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;justify-content:space-between;align-items:center;padding:6px 6vw;background:rgba(231,216,180,.92);box-shadow:0 1px 0 var(--bma-line)}
.bma-header__logo{display:inline-block;font-family:var(--bma-font-serif);color:var(--bma-ink)}
.bma-header__logo img{width:200px;height:auto;display:block}
.bma-header__actions{display:flex;align-items:center;gap:24px}
.bma-header__cta{display:inline-flex;align-items:center;font-family:var(--bma-font-mono);font-size:16px;padding:12px 26px;border:1px solid var(--bma-sanguine);color:var(--bma-sanguine);transition:background .3s ease,color .3s ease}
.bma-header__cta:hover{background:var(--bma-sanguine);color:#F3ECDD}
.bma-menu-trigger{display:flex;align-items:center;gap:9px;font-family:var(--bma-font-mono);font-size:16px;letter-spacing:.18em;color:var(--bma-ink);cursor:pointer}
.bma-menu-trigger__bars{display:flex;flex-direction:column;gap:3px}
.bma-menu-trigger__bars span{width:18px;height:1px;background:currentColor;display:block}

/* ---- Menu plein écran (piloté par :target) ---- */
.bma-menu{position:fixed;inset:0;z-index:80;background:rgba(231,216,180,.98);opacity:0;visibility:hidden;transition:opacity .45s cubic-bezier(.19,1,.22,1),visibility .45s cubic-bezier(.19,1,.22,1);display:flex;flex-direction:column;padding:30px 8vw}
#bma-menu:target{opacity:1;visibility:visible}
.bma-menu__top{display:flex;justify-content:space-between;align-items:center}
.bma-menu__eyebrow{font-size:10px;letter-spacing:.22em;color:var(--bma-muted)}
.bma-menu__close{font-size:16px;letter-spacing:.18em;color:var(--bma-ink);display:flex;align-items:center;gap:10px;cursor:pointer}
.bma-menu__nav{flex:1;display:flex;flex-direction:column;justify-content:center;gap:2px;overflow-y:auto}
.bma-menu__link{display:flex;align-items:baseline;gap:22px;padding:11px 0;border-bottom:1px solid rgba(74,58,42,.13)}
.bma-menu__link:last-child{border-bottom:0}
.bma-menu__num{font-family:var(--bma-font-mono);font-size:11px;color:var(--bma-muted);width:26px;transition:color .3s ease}
.bma-menu__label{font-family:var(--bma-font-serif);font-size:clamp(26px,3.6vw,46px);color:var(--bma-ink);transition:color .3s ease}
.bma-menu__link:hover .bma-menu__num,
.bma-menu__link:hover .bma-menu__label{color:var(--bma-sanguine)}
.bma-menu__foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;border-top:1px solid var(--bma-line);padding-top:22px}
.bma-menu__location{font-size:10px;letter-spacing:.14em;color:var(--bma-muted)}

/* ---- Progression / retour haut ----
   Remplissage piloté 100% en JS (bmaInitProgress, script-anatomique.js)
   plutôt que via animation-timeline:scroll(root) — cette dernière
   laissait le rail invisible (display:none jamais levé) sur les
   navigateurs sans support des scroll-driven animations. */
.bma-progress-track{position:fixed;left:0;top:0;bottom:0;width:5px;z-index:57;background:rgba(74,58,42,.1)}
.bma-progress-fill{position:absolute;top:0;left:0;width:100%;height:0;background:var(--bma-sanguine)}
.bma-to-top{position:fixed;right:30px;bottom:24px;z-index:57;font-size:14px;letter-spacing:.14em;color:var(--bma-muted)}

/* ---- Fil unificateur (traverse les planches I à IV) ---- */
.bma-thread{position:relative}
.bma-thread__line{position:absolute;top:0;bottom:0;left:8vw;width:1px;background:var(--bma-line);pointer-events:none;z-index:5}
@supports (animation-timeline: scroll(root)){
  .bma-thread__line{background:var(--bma-sanguine);opacity:.5;transform-origin:top;transform:scaleY(0);animation:bma-thread-grow linear both;animation-timeline:scroll(root)}
}
.bma-thread__mark{position:absolute;width:46px;height:46px;opacity:.55;z-index:1;pointer-events:none}
@supports (animation-timeline: view()){
  .bma-thread__mark{opacity:0;animation:bma-thread-mark-reveal linear both;animation-timeline:view();animation-range:entry 0% cover 35%}
}

/* ---- Cadre de planche gravé (fixe, plein écran) ---- */
.bma-frame{position:fixed;inset:14px;z-index:55;pointer-events:none}
.bma-frame::before{content:"";position:absolute;inset:0;border:1px solid rgba(74,58,42,.4)}
.bma-frame::after{content:"";position:absolute;inset:6px;border:1px solid rgba(74,58,42,.18)}
.bma-frame span{position:absolute;width:15px;height:15px}
.bma-frame span:nth-child(1){top:-4px;left:-4px;border-top:2px solid var(--bma-sanguine);border-left:2px solid var(--bma-sanguine)}
.bma-frame span:nth-child(2){top:-4px;right:-4px;border-top:2px solid var(--bma-sanguine);border-right:2px solid var(--bma-sanguine)}
.bma-frame span:nth-child(3){bottom:-4px;left:-4px;border-bottom:2px solid var(--bma-sanguine);border-left:2px solid var(--bma-sanguine)}
.bma-frame span:nth-child(4){bottom:-4px;right:-4px;border-bottom:2px solid var(--bma-sanguine);border-right:2px solid var(--bma-sanguine)}

/* ---- Motifs décoratifs (parallax CSS pur via background-attachment:fixed) ---- */
.bma-motif{position:absolute;pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:contain;background-attachment:fixed}
.bma-motif--drift{animation:bma-float-y 8s ease-in-out infinite}
.bma-gear{position:absolute;pointer-events:none}
.bma-gear--spin{animation:bma-spin 26s linear infinite}
.bma-gear--spin-rev{animation:bma-spin 34s linear infinite reverse}
.bma-plate-label{position:absolute;font-size:10px;letter-spacing:.22em;color:var(--bma-muted)}

.bma-hero__motif-leaf{top:10vh;left:3vw;width:min(17vw,215px);aspect-ratio:4/5;opacity:.16;background-image:url(/wp-content/themes/pixence-child/images/m-plante-ink.png)}
.bma-hero__motif-gears{bottom:8vh;right:4vw;width:min(14vw,180px);aspect-ratio:4/5;opacity:.14;background-image:url(/wp-content/themes/pixence-child/images/m-plante2-ink.png)}
.bma-hero__motif-gear1{top:25vh;right:17vw;width:52px;opacity:.5}
.bma-hero__motif-gear2{bottom:22vh;left:11vw;width:34px;opacity:.35}
.bma-hero__watermark{position:absolute;top:0;left:0;right:0;bottom:0;background:url(/wp-content/themes/pixence-child/images/hero-planche-anatomique.png) center / cover no-repeat;opacity:.4;pointer-events:none}
.bma-pratique__motif-heart{top:6vh;right:3vw;width:min(15vw,190px);aspect-ratio:4/5;opacity:.09;background-image:url(/wp-content/themes/pixence-child/images/m-coeur-ink.png)}

/* ---- Hero (Frontispice) ---- */
/* Planches empilées (I à IV) : chaque planche reste "collée" en haut
   de l'écran (position:sticky) pendant que la suivante glisse
   par-dessus au scroll, la recouvrant progressivement — effet
   feuilletage de planches d'atlas anatomique. Zéro JS : dégrade
   proprement en flux normal si sticky n'est pas supporté. Désactivé
   sous 900px (cf. media query en bas) où l'empilement fixe est
   moins lisible sur petit écran. */
.bma-hero{position:sticky;top:0;z-index:1;min-height:100vh;background:var(--bma-parchment);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:14vh 8vw;overflow:hidden}
.bma-hero__content{position:relative;max-width:900px}
.bma-hero__eyebrow{font-size:11px;letter-spacing:.26em;color:var(--bma-sanguine);margin-bottom:30px;opacity:0;animation:bma-fade 1s .2s both}
.bma-hero__title{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(40px,6.5vw,100px);line-height:.96;letter-spacing:-.01em;color:var(--bma-ink);opacity:0;animation:bma-fade 1.1s .4s both}
.bma-hero__tagline{font-family:var(--bma-font-serif);font-style:italic;font-size:clamp(20px,2.9vw,36px);color:var(--bma-sanguine);margin-top:24px;opacity:0;animation:bma-fade 1.1s .65s both}
.bma-hero__cta{margin-top:44px;opacity:0;animation:bma-fade 1.1s .95s both; text-align:center;}
.bma-hero__scroll{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:.2em;color:var(--bma-muted);opacity:0;animation:bma-fade 1s 1.3s both}

/* ---- Sections génériques ---- */
.bma-section{position:sticky;top:0;min-height:100vh;background:#FFECC7;padding:16vh 8vw;overflow:hidden;border-top: 1px solid rgb(74 58 42 / .4);}
#constat{z-index:2;background: rgba(231, 216, 180);
    border-top: 1px solid rgba(74, 58, 42, .4);}
#pratique{z-index:3}
#approche{z-index:4;background: rgba(231, 216, 180);
    border-top: 1px solid rgba(74, 58, 42, .4);}
.bma-section__eyebrow{font-size:11px;letter-spacing:.24em;color:var(--bma-sanguine);margin-bottom:22px}
.bma-section__heading{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(27px,3.6vw,48px);line-height:1.2;color:var(--bma-ink)}

/* ---- Sections des pages intérieures (planches en diaporama) ----
   .bma-section reste réservée à la homepage (sticky top:0, cf. plus
   haut) : là-bas chaque planche tient dans un écran. Sur les pages
   intérieures, plusieurs planches sont bien plus hautes qu'un écran,
   et un sticky top:0 les « mangeait » : la planche se collait en haut
   dès son arrivée, tout ce qui dépassait sous la ligne de flottaison
   n'était jamais lu avant que la suivante ne la recouvre.

   Mécanique retenue — aucune hauteur fixe, la planche se cale sur son
   propre contenu :

   1. .bma-slide-wrap passe en display:contents. Le wrapper ne génère
      plus de boîte : la planche devient enfant de flux direct de
      .bma-thread, qui devient son bloc conteneur. Indispensable — un
      wrapper fait exactement la hauteur de sa planche, il enfermait
      donc le sticky dans un bloc sans marge de manœuvre et lui
      interdisait tout décalage (c'est ce qui rendait l'ancienne règle
      inopérante). Les sélecteurs .bma-slide-wrap:nth-of-type(odd)
      (fonds alternés, plus bas) continuent de matcher :
      display:contents ne change rien au DOM, seulement au rendu.

   2. La planche est sticky avec un top NÉGATIF, valant
      (hauteur d'écran − hauteur de la planche), posé en ligne par
      bmaInitPlateStack (JS de chaque page intérieure) parce qu'aucune
      unité CSS ne donne la hauteur d'un élément (un top en % se
      résout sur le bloc conteneur, pas sur la planche : testé, il
      tombe à 0). Conséquence : la planche défile en flux normal tant
      que son bord bas n'a pas atteint le bas de l'écran — on lit donc
      tout son contenu, quelle que soit sa hauteur — puis se fige, et
      la planche suivante, dont le haut est précisément au bas de
      l'écran à cet instant, glisse par-dessus (positionnée et plus
      loin dans le DOM, donc peinte au-dessus). L'effet feuilletage de
      l'accueil, déclenché seulement en fin de planche.
      Une planche qui tient dans un écran reçoit top:0 (le min plafonne
      à 0) : comportement identique à l'accueil, inchangé.

   Le bloc conteneur du sticky est .bma-thread, qui couvre toutes les
   planches : chaque planche reste donc figée jusqu'à la fin de la
   page, recouverte par les suivantes puis par le pied de page — même
   comportement que .bma-section sur l'accueil.

   Repli : la règle sticky est gatée par .bma-slide-ready, posée par le
   JS uniquement. Sans JS, sans support de sticky ou sous 900px, tout
   reste en flux normal et rien n'est caché. */
.bma-plate-section{position:relative;min-height:40svh;background:#FFECC7;padding:16vh 8vw;overflow:hidden;    border-top: 1px solid rgba(74, 58, 42, .4);}
.bma-slide-wrap{display:contents}
.bma-thread.bma-slide-ready > .bma-slide-wrap > .bma-plate-section{position:sticky;top:0}

/* ---- Tracé anatomique animé (fond de la section Ma Pratique) ----
   SVG inline .bma-trace, chaque <path> se dessine au scroll via
   stroke-dashoffset, entièrement calculé et mis à jour en JS pur
   (bmaInitTrace, script-anatomique.js) — pas de scroll-driven
   animations CSS cette fois, pour ne pas dépendre du support
   navigateur des view-timelines nommées. Repli : sans JS, sur
   mobile (<760px) ou avec prefers-reduced-motion, le JS ne touche
   jamais au stroke-dasharray/dashoffset : le tracé reste affiché
   complet par défaut (aucune règle ci-dessous ne le cache). */
.bma-trace{position:absolute;inset:0;z-index:0;opacity:.18;pointer-events:none;overflow:hidden}
.bma-trace svg{width:80%;height:100%;display:block;margin-left:auto}
.bma-trace path{fill:none;stroke:var(--bma-ink);stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;vector-effect:non-scaling-stroke}
@media (max-width:760px){
  .bma-trace{display:none}
}

/* ---- Le constat ---- */
.bma-constat{text-align:center}
.bma-constat__testimonial{position:absolute;max-width:230px;font-family:var(--bma-font-serif);font-style:italic;font-size:15px;line-height:1.55;color:var(--bma-ink-soft);opacity:.6;z-index:0}
.bma-constat__testimonial cite{display:block;margin-top:10px;font-family:var(--bma-font-mono);font-style:normal;font-size:10px;letter-spacing:.14em;color:var(--bma-muted)}
.bma-constat__testimonial--a{top:14vh;left:2vw;text-align:right;transform:rotate(-2deg)}
.bma-constat__testimonial--b{bottom:12vh;right:2vw;transform:rotate(2deg)}
.bma-constat__testimonial--c{top:10vh;right:6vw;transform:rotate(2deg)}
.bma-constat__testimonial--d{bottom:12vh;left:4vw;transform:rotate(2deg)}
.bma-constat__testimonial--e{bottom:50vh;left:4vw;transform:rotate(2deg)}
#reseaux {background-color: rgba(231,216,180);}
@media (max-width:1100px){
  .bma-constat__testimonial{display:none}
}
.bma-constat__lead{position:relative;z-index:1;max-width:820px;margin:0 auto;font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(25px,3.5vw,46px);line-height:1.32;color:var(--bma-ink)}
.bma-constat__echo{position:relative;z-index:1;max-width:600px;margin:48px auto}
.bma-constat__echo p{font-family:var(--bma-font-serif);font-style:italic;font-size:clamp(18px,2.3vw,26px);line-height:1.7;color:var(--bma-ink-soft)}

/* ---- Ma pratique ---- */
.bma-pratique__grid{position:relative;z-index:1;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:center}
.bma-pratique__photo-wrap{position:relative}
.bma-pratique__photo-frame{position:relative;border:1px solid rgba(74,58,42,.4);padding:7px;overflow:hidden}
.bma-pratique__photo-frame span{position:absolute;width:11px;height:11px}
.bma-pratique__photo-frame span:nth-child(2){top:2px;left:2px;border-top:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-pratique__photo-frame span:nth-child(3){top:2px;right:2px;border-top:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}
.bma-pratique__photo-frame span:nth-child(4){bottom:2px;left:2px;border-bottom:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-pratique__photo-frame span:nth-child(5){bottom:2px;right:2px;border-bottom:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}
.bma-pratique__photo{position:relative;border:1px solid var(--bma-line);overflow:hidden}
.bma-pratique__photo img{width:100%;display:block;aspect-ratio:4/5;object-fit:cover;object-position:center 28%;filter:sepia(.3) contrast(1.05) saturate(.85)}
.bma-pratique__eyebrow{font-size:11px;letter-spacing:.24em;color:var(--bma-sanguine);margin-bottom:26px}
.bma-pratique__title{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(28px,3.8vw,50px);line-height:1.12;color:var(--bma-ink)}
.bma-pratique__title em{color:#7A6B55}
.bma-pratique__text{margin-top:24px;max-width:540px;font-size:14.5px;line-height:1.95;color:var(--bma-ink-soft)}
.bma-pratique__text strong{color:var(--bma-ink)}
.bma-pratique__tags{margin-top:24px;display:flex;flex-wrap:wrap;max-width:560px}
.bma-pratique__tags-sep{width:100%;height:1px;background:rgba(74,58,42,.18);display:block;margin:9px 0}
.bma-pratique__tag-item{display:flex;align-items:baseline;gap:10px;padding:0 20px;margin-right:16px;}
#regulation-nerveux .bma-pratique__tag-item{display:flex;align-items:baseline;gap:10px;padding:0 20px;margin-right:16px;width:33%;}
.bma-pratique__tag-num{font-family:var(--bma-font-mono);font-size:9px;letter-spacing:.18em;color:var(--bma-sanguine);flex-shrink:0}
.bma-pratique__tag-dash{width:16px;height:1px;background:rgba(74,58,42,.3);flex-shrink:0;margin-bottom:2px}
.bma-pratique__tag-text{font-family:var(--bma-font-serif);font-size:15px;color:var(--bma-ink);white-space:nowrap}
.bma-pratique__footer{margin-top:34px;display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.bma-signature{font-family:var(--bma-font-serif);font-style:italic;font-size:30px;color:var(--bma-sanguine)}

/* ---- Mon approche ---- */
.bma-approche__intro{max-width:820px;margin:0 auto 54px}
.bma-approche__outcome{text-align:center;max-width:700px;margin:52px auto 0;font-family:var(--bma-font-serif);font-style:italic;font-size:clamp(19px,2.5vw,28px);line-height:1.55;color:var(--bma-ink-soft)}

/* ---- Pied de page / rendez-vous ---- */
.bma-footer{position:sticky;top:0;z-index:6;min-height:80svh;background:var(--bma-footer-bg);color:var(--bma-footer-text);padding:16vh 8vw 5vh;overflow:hidden}
.bma-footer__cta{max-width:900px;margin:0 auto;text-align:center}
.bma-footer__eyebrow{font-size:11px;letter-spacing:.24em;color:#c79a8d;margin-bottom:24px}
.bma-footer__heading{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(32px,5vw,74px);line-height:1.02;color:#F3ECDD}
.bma-footer__cta-btn{margin-top:40px}
.bma-footer__grid{max-width:1120px;margin:9vh auto 0;display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px;border-top:1px solid rgba(231,216,180,.16);padding-top:44px;text-align:left;font-family:var(--bma-font-mono)}
.bma-footer__brand{font-family:var(--bma-font-serif);font-size:23px;color:#F3ECDD;margin-bottom:6px}
.bma-footer__tagline{font-size:11px;letter-spacing:.14em;color:var(--bma-sanguine);margin-bottom:10px}
.bma-footer__signature{font-family:var(--bma-font-serif);font-style:italic;font-size:26px;color:#c79a8d;display:block;margin-top:8px}
.bma-footer__label{font-size:10px;letter-spacing:.18em;color:var(--bma-muted);margin-bottom:14px}
.bma-footer__link{display:block;font-size:13px;color:var(--bma-footer-text);margin-bottom:7px}
.bma-footer__link:hover{color:var(--bma-sanguine)}
.bma-footer__text{font-size:13px;line-height:1.8;color:#c9c0b0}
.bma-footer__bottom{max-width:1120px;margin:5vh auto 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-size:10px;letter-spacing:.08em;color:#8a8175;font-family:var(--bma-font-mono)}
.bma-footer__legal{display:flex;gap:20px}
.bma-footer__legal a{color:#8a8175}
.bma-footer__legal a:hover{color:var(--bma-sanguine)}

@media (max-width:900px){
  .bma-pratique__grid,.bma-footer__grid{grid-template-columns:1fr !important}
  /*.bma-hero,.bma-section,.bma-footer{position:relative;top:auto;min-height:0;padding-bottom:0}
  .bma-plate-section{min-height:0}
  .bma-thread.bma-slide-ready > .bma-slide-wrap > .bma-plate-section{position:relative;top:auto}*/
}

.bma-approche__intro,
.bma-approche__grid { max-width:820px; margin-left:auto; margin-right:auto; }

.bma-approche__grid {
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:52px 40px;
}

.bma-appro-card {
  display:flex; flex-direction:column;
  align-items:center; text-align:center;
  margin:0;
}

.bma-appro-card__num {
  font-family:var(--bma-font-mono);
  font-size:9px; letter-spacing:.22em;
  color:var(--bma-sanguine);
  margin-bottom:12px;
  align-self:flex-start;
}

.bma-appro-card__frame {
  position:relative;
  border:1px solid rgba(74,58,42,.4);
  padding:6px; width:100%;
}
.bma-appro-card__frame span {
  position:absolute; width:10px; height:10px; z-index:2;
}
.bma-appro-card__frame span:nth-child(1){top:2px;left:2px;border-top:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-appro-card__frame span:nth-child(2){top:2px;right:2px;border-top:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}
.bma-appro-card__frame span:nth-child(3){bottom:2px;left:2px;border-bottom:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-appro-card__frame span:nth-child(4){bottom:2px;right:2px;border-bottom:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}

.bma-appro-card__frame-inner {
  position:relative;
  border:1px solid rgba(74,58,42,.18);
  overflow:hidden;
}

.bma-appro-card img {
  width:100%; aspect-ratio:1/1;
  object-fit:contain; object-position:center;
  display:block;
  mix-blend-mode:multiply;
  filter:sepia(.15) contrast(1.02);
}

.bma-appro-card__line {
  display:block;
  width:28px; height:1px;
  background:rgba(74,58,42,.3);
  margin:16px auto 10px;
}

.bma-appro-card figcaption {
  font-family:var(--bma-font-serif);
  font-style:italic;
  font-size:15px; line-height:1.4;
  color:var(--bma-ink);
  max-width:22ch; margin:0 auto;
}

@media (max-width:900px){
  .bma-approche__grid{ grid-template-columns:repeat(2,1fr); gap:38px 26px; }
}
@media (max-width:560px){
  .bma-approche__grid{ grid-template-columns:1fr; gap:32px; }
}

/* ============================================================
   Gabarit commun — pages intérieures (Entrer dans l'atelier,
   Les outils de l'atelier, La mécanicienne, Sous le capot des
   humains). Mêmes composants que l'accueil (.bma-section,
   .bma-rv, .bma-word, .bma-plate-label, .bma-thread) ; les
   classes ci-dessous ne sont que des primitives génériques
   (intro, citation flou->net, texte courant, tags, CTA) pour
   éviter de réutiliser des noms propres à l'accueil (bma-constat__,
   bma-pratique__) sur des pages qui n'ont rien à voir avec « le
   constat » ou « la pratique ». Une seule définition, partagée
   par les 4 pages intérieures.
   ============================================================ */
.bma-plate--center{text-align:center}
.bma-plate__intro{max-width:820px;margin:0 auto 54px}

/* Planche I façon frontispice — alignée à gauche, titre pleine
   échelle, comme .bma-ent-hero de la maquette (pas de centrage). */
.bma-plate--hero{padding-top:max(190px,20vh);padding-bottom:12vh}
.bma-plate--hero .bma-plate__intro{max-width:1000px;margin:0}
.bma-plate--hero .bma-section__eyebrow{margin-bottom:28px}
.bma-plate--hero .bma-section__heading{font-size:clamp(44px,7.6vw,100px);line-height:.98;letter-spacing:-.01em;text-align:left}
.bma-plate--hero .bma-plate__lead{margin:30px 0 0;text-align:left}
.bma-plate--hero .bma-plate__split{margin:9vh 0 0;grid-template-columns:1.15fr .85fr;max-width:1120px}
.bma-plate__scroll{position:absolute;bottom:40px;left:8vw;font-family:var(--bma-font-mono);font-size:10px;letter-spacing:.2em;color:var(--bma-muted)}
.bma-plate__lead{position:relative;z-index:1;max-width:760px;margin:0 auto;font-family:var(--bma-font-serif);font-style:italic;font-weight:300;font-size:clamp(19px,2.6vw,32px);line-height:1.45;color:var(--bma-sanguine)}
.bma-plate__lead em .bma-word.is-lit{color:var(--bma-sanguine)}
.bma-plate__text{margin-top:24px;max-width:640px;font-size:14.5px;line-height:1.95;color:var(--bma-ink-soft)}
.bma-plate__text strong{color:var(--bma-ink)}
.bma-plate--center .bma-plate__text em{color:var(--bma-sanguine)}
.bma-plate--center .bma-plate__text{margin-left:auto;margin-right:auto}
.bma-plate__tags{margin-top:20px;margin-bottom:24px;display:flex;flex-wrap:wrap;gap:9px}
.bma-plate__lead-in{font-size:11px;letter-spacing:.1em;color:var(--bma-muted);margin-top:24px}
.bma-plate__cta{margin-top:40px;display:flex;gap:20px;flex-wrap:wrap}
.bma-plate--center .bma-plate__cta{justify-content:center}

/* Fond alterné une planche sur deux à partir de la 2e — même règle
   et même couleur que l'accueil (#constat, #approche : #DBC58F),
   appliquée automatiquement à toutes les pages intérieures sans
   avoir à retagger chaque section à la main. */
.bma-thread > section:nth-of-type(2n){background:#DBC58F}
.bma-thread > .bma-slide-wrap:nth-of-type(odd) .bma-plate-section{background:rgba(231,216,180);border-top: 1px solid rgba(74,58,42,.4);}

/* Grille 2 colonnes (Planche II : texte / liste — Planche III :
   leviers / encadré). */
.bma-plate__split{position:relative;z-index:1;max-width:1160px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:6vw;align-items:start}
.bma-plate__split--even{grid-template-columns:1fr 1fr;max-width:1060px;gap:5vw}
@media (max-width:900px){
  .bma-plate__split,.bma-plate__split--even{grid-template-columns:1fr;gap:44px}
}

/* Liste en gros serif avec filets (Planche II). */
.bma-plate__biglist{display:flex;flex-direction:column}
.bma-plate__biglist span{display:block;font-family:var(--bma-font-serif);font-size:clamp(22px,2.6vw,30px);color:var(--bma-ink);padding:14px 0;border-top:1px solid var(--bma-line)}
.bma-plate__biglist span:last-child{border-bottom:1px solid var(--bma-line)}

/* Liste à puce (Planche III, « on travaille avec ») — puce CSS,
   pas d'icône image. */
.bma-plate__levier-list{display:flex;flex-direction:column}
.bma-plate__levier{display:flex;align-items:center;gap:20px;padding:16px 0;border-top:1px solid var(--bma-line)}
.bma-plate__levier:last-child{border-bottom:1px solid var(--bma-line)}
.bma-plate__levier::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--bma-sanguine);opacity:.7;flex-shrink:0}
.bma-plate__levier span{font-family:var(--bma-font-serif);font-size:22px;color:var(--bma-ink)}

/* Encadré double filet (« Ce que beaucoup observent ») — coins
   gravés en CSS pur, aucune image. */
.bma-plate__callout{position:relative;border:1px solid rgba(74,58,42,.4);padding:7px}
.bma-plate__callout-inner{border:1px solid rgba(74,58,42,.22);padding:clamp(34px,5vw,64px);background:rgba(251,246,238,.5)}
.bma-plate__callout-corner{position:absolute;width:11px;height:11px}
.bma-plate__callout-corner:nth-child(1){top:2px;left:2px;border-top:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-plate__callout-corner:nth-child(2){top:2px;right:2px;border-top:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}
.bma-plate__callout-corner:nth-child(3){bottom:2px;left:2px;border-bottom:1px solid var(--bma-sanguine);border-left:1px solid var(--bma-sanguine)}
.bma-plate__callout-corner:nth-child(4){bottom:2px;right:2px;border-bottom:1px solid var(--bma-sanguine);border-right:1px solid var(--bma-sanguine)}
.bma-plate__callout-list{display:flex;flex-direction:column;gap:6px;font-size:14.5px;padding-top:12px;line-height:1.7;color:var(--bma-ink)}

/* Séances numérotées (Planche IV) — le gap:1px + background crée
   les filets de séparation entre cellules. */
.bma-plate__numbered{position:relative;z-index:1;max-width:1060px;margin:24px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#B53E2F;}
.bma-plate__num-item{background:#FFECC7;padding:36px 30px;display:flex;gap:18px;align-items:auto;margin:4px;}
.bma-plate__numbered.bma-rv.bma-rv--ready.bma-rv--in {background-color: transparent;}
.bma-plate__num-item:nth-child(1){border-right:1px solid rgba(74,58,42,.22);border-bottom:1px solid rgba(74,58,42,.22);}
.bma-plate__num-item:nth-child(2){border-left:1px solid rgba(74,58,42,.22);border-bottom:1px solid rgba(74,58,42,.22);}
.bma-plate__num-item:nth-child(3){border-top:1px solid rgba(74,58,42,.22);border-right:1px solid rgba(74,58,42,.22);}
.bma-plate__num-item:nth-child(4){border-left:1px solid rgba(74,58,42,.22);border-top:1px solid rgba(74,58,42,.22);}
.bma-thread > section:nth-of-type(2n) .bma-plate__num-item{background:#DBC58F}
.bma-plate__num{font-family:var(--bma-font-mono);font-size:11px;color:var(--bma-ink)}
.bma-plate__num-label{font-family:var(--bma-font-serif);font-size:clamp(20px,2.4vw,28px);line-height:1.3;color:var(--bma-ink)}
@media (max-width:700px){
  .bma-plate__numbered{grid-template-columns:1fr}
}

/* Corps de texte « une phrase = un bloc respiré » — chaque <span>
   du .bma-plate__prose est une phrase du contenu source, empilée
   avec un léger espace, plutôt qu'un unique <p> avec des <br>. */
.bma-plate__prose{font-size:16px;color:var(--bma-ink-soft);}
.bma-thread > section:nth-of-type(2n) .bma-plate__prose{color:var(--bma-ink)}
.bma-thread > .bma-slide-wrap:nth-of-type(odd) .bma-plate__prose{color:var(--bma-ink)}
.bma-plate__prose span{display:block}
@media (max-width:900px){
  .bma-plate__prose{font-size:14px;}
}

/* Citation d'accent — sans filet par défaut ; .bma-plate__quote--rule
   ajoute le filet gauche pour les citations qui doivent ressortir
   davantage. */
.bma-plate__quote{font-family:var(--bma-font-serif);font-style:italic;font-size:clamp(19px,2.4vw,28px);line-height:1.5;color:var(--bma-ink)}
.bma-thread > section:nth-of-type(2n) .bma-plate__quote{color:var(--bma-ink)}
.bma-plate__quote--rule{border-left:2px solid var(--bma-sanguine);padding-left:26px}
.bma-plate__quote--sanguine{color:var(--bma-sanguine) !important;font-size:clamp(19px,2.5vw,30px)}
/* Variante lisible sur fond terre/doré (#DBC58F) : rouge plus sombre
   que --bma-sanguine, appliquée automatiquement sur les planches
   paires (même détection que le fond alterné). */
.bma-thread > section:nth-of-type(2n) .bma-plate__quote--rule{border-color:#8C2E22;color:#8C2E22}

/* Phrases mises en valeur, en cascade (ex. « J'ai vécu vite. »...) —
   réutilisent .bma-rv pour la révélation (même observer/mécanisme
   que le reste du site), avec un flou plus léger et un décalage
   plus court adapté aux phrases courtes qui s'enchaînent. */
.bma-plate__lines{display:flex;flex-direction:column;gap:14px}
.bma-plate__lines--tight{gap:12px}
.bma-plate__line{display:block;font-family:var(--bma-font-serif);font-size:clamp(21px,2.7vw,32px);line-height:1.35;color:var(--bma-ink)}
.bma-plate__line--lg{font-size:clamp(24px,3.2vw,38px);line-height:1.2}
.bma-plate__line--xl{font-size:clamp(22px,3vw,36px);line-height:1.25}
.bma-plate__line--accent{font-style:italic;color:var(--bma-sanguine)}
.bma-thread > section:nth-of-type(2n) .bma-plate__line--accent{color:#8C2E22}
.bma-rv.bma-plate__line.bma-rv--ready{opacity:0;filter:blur(9px);transform:translateY(10px);transition:opacity 1.2s cubic-bezier(.19,1,.22,1),filter 1.3s cubic-bezier(.19,1,.22,1),transform 1.2s cubic-bezier(.19,1,.22,1)}
.bma-rv.bma-plate__line.bma-rv--ready.bma-rv--in{opacity:1;filter:blur(0);transform:none}
.bma-plate__line--d1{transition-delay:.12s}
.bma-plate__line--d2{transition-delay:.24s}
.bma-plate__line--d3{transition-delay:.36s}
.bma-plate__line--d4{transition-delay:.52s}

/* Emplacement portrait vide (aucune image tant que Chloé n'en a pas
   fourni une) — cadre + texte indicatif, même mécanique de coins
   gravés que .bma-plate__callout. */
.bma-plate__portrait-slot{position:relative;border:1px solid rgba(74,58,42,.24);aspect-ratio:4/5;background:rgba(251,246,238,.35);display:flex;align-items:center;justify-content:center}
.bma-plate__portrait-hint{font-family:var(--bma-font-mono);font-size:10px;letter-spacing:.16em;color:var(--bma-muted);text-align:center;padding:0 20px}
.bma-plate__portrait-tag{position:absolute;top:10px;left:10px;background:var(--bma-parchment);padding:5px 10px;font-family:var(--bma-font-mono);font-size:9px;letter-spacing:.12em;color:var(--bma-muted)}

/* Bloc encadré par deux filets horizontaux (ex. « mouvements
   sauvages »), centré. */
.bma-plate__ruled-block{position:relative;z-index:1;max-width:820px;margin:0 auto;padding:34px 0;border-top:1px solid var(--bma-line);}
.bma-plate__ruled-block .bma-plate__prose{margin-top:18px}

/* Grille de cartes texte à filets (ex. « Selon les personnes, cela
   peut passer par »), 3 colonnes. */
.bma-plate__cardgrid{position:relative;z-index:1;max-width:1060px;margin:24px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:transparent;}
.bma-plate__cardgrid-item{background:var(--bma-parchment);padding:30px 26px;font-family:var(--bma-font-serif);font-size:16px;line-height:1.35;color:var(--bma-ink); margin:4px;}
.bma-plate__cardgrid-item:nth-child(1){border-right:1px solid rgba(74,58,42,.18);border-bottom:1px solid rgba(74,58,42,.18);}
.bma-plate__cardgrid-item:nth-child(2){border-left:1px solid rgba(74,58,42,.18);border-bottom:1px solid rgba(74,58,42,.18);}
.bma-plate__cardgrid-item:nth-child(3){border-top:1px solid rgba(74,58,42,.18);border-right:1px solid rgba(74,58,42,.18);border-bottom:1px solid rgba(74,58,42,.18);}
.bma-plate__cardgrid-item:nth-child(4){border-top:1px solid rgba(74,58,42,.18);border-bottom:1px solid rgba(74,58,42,.18);border-left:1px solid rgba(74,58,42,.18);}
.bma-plate__cardgrid-item:nth-child(5){border-top:1px solid rgba(74,58,42,.18);border-right:1px solid rgba(74,58,42,.18);}
.bma-plate__cardgrid-item:nth-child(6){border-top:1px solid rgba(74,58,42,.18);border-left:1px solid rgba(74,58,42,.18);}
.bma-thread > section:nth-of-type(2n) .bma-plate__cardgrid-item{background:#DBC58F}
.bma-thread > .bma-slide-wrap:nth-of-type(odd) .bma-plate__cardgrid-item{background:#FFECC7}
@media (max-width:900px){
  .bma-plate__cardgrid{grid-template-columns:1fr}
}

/* Liste numérotée à un rang (ex. les 6 niveaux, Planche I). */
.bma-plate__niveau-list{display:flex;flex-direction:column}
.bma-plate__niveau{display:flex;align-items:baseline;gap:16px;padding:13px 0;border-top:1px solid var(--bma-line)}
.bma-plate__niveau:last-child{border-bottom:1px solid var(--bma-line)}
.bma-plate__niveau-num{font-family:var(--bma-font-mono);font-size:10px;color:var(--bma-sanguine)}
.bma-plate__niveau-label{font-family:var(--bma-font-serif);font-size:21px;color:var(--bma-ink)}

/* 3 colonnes à filet supérieur (ex. les technologies corporelles). */
.bma-plate__cols3{position:relative;z-index:1;max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.bma-plate__col{border-top:1px solid rgba(74,58,42,.35);padding:30px 20px 0 0}
.bma-plate__col-num{font-family:var(--bma-font-mono);font-size:10px;letter-spacing:.2em;color:var(--bma-sanguine);margin-bottom:14px}
.bma-plate__col-title{font-family:var(--bma-font-serif);font-weight:400;font-size:26px;color:var(--bma-ink);margin-bottom:14px}
.bma-plate__col-text{font-size:15.5px;line-height:1.95;color:var(--bma-ink-soft)}
.color-sanguine {color:var(--bma-sanguine);}
@media (max-width:900px){
  .bma-plate__cols3{grid-template-columns:1fr;gap:30px}
	.bma-header__cta {display:none;}
	.bma-pratique__photo img {height:140px;}
	.bma-pratique__text {font-size:13px;margin-top:12px;}
	.bma-trust {width: 100%;}
	.bma-plate-section {padding: 16vh 8vw 4vh 8vw !important;}
	.bma-plate__split {grid-template-columns:1fr!important;}
	.bma-pratique__tag-text {white-space:normal;}
	.bma-pratique__text{font-size:14px;line-height:1.4;}
	.bma-approche__outcome {width:80%!important;}
	.bma-plate__num-item {padding:18px 15px;}
	.bma-signature {font-size:24px;}
	.bma-btn {padding:10px 15px;}
	.bma-pratique__footer {margin-top:12px;}
	.bma-pratique__eyebrow {margin-bottom:0;}
	.bma-pratique__tag-text {13px;}
	.bma-pratique__tags {margin-top:12px;}
	.bma-carou__slide {opacity:1;}
	.bma-pratique__tag-item,#regulation-nerveux .bma-pratique__tag-item{width:100%;}

}

/* Liste à tirets et filets (ex. l'environnement et l'image de soi). */
.bma-plate__dashlist{margin-top:20px;max-width:900px;display:flex;flex-direction:column}
.bma-plate__dashlist div{display:flex;align-items:baseline;gap:20px;padding:18px 0;border-top:1px solid var(--bma-line)}
.bma-plate__dashlist div:last-child{border-bottom:1px solid var(--bma-line)}
.bma-plate__dashlist span:first-child{font-family:var(--bma-font-mono);font-size:10px;color:var(--bma-sanguine)}
.bma-plate__dashlist span:last-child{font-family:var(--bma-font-serif);font-size:clamp(20px,2.3vw,26px);color:var(--bma-ink)}

/* Déclaration finale (conclusion) — pas la citation flou->net, un
   simple grand paragraphe serif léger. */
.bma-plate__statement{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(24px,3.2vw,42px);line-height:1.34;color:var(--bma-ink);max-width:840px;margin:0 auto}

/* Grand titre en colonne (ex. Planche « L'hygiène de vie »). */
.bma-plate__split-title{font-family:var(--bma-font-serif);font-weight:300;font-size:clamp(30px,4.2vw,54px);line-height:1.08;color:var(--bma-ink)}
.bma-plate__split--narrow-left{grid-template-columns:.8fr 1.2fr}

/* Contenu non fourni (ex. articles du blog, réseaux sociaux) —
   cadre en tirets, ton discret, jamais de fausse donnée. */
.bma-plate__placeholder{border:1px dashed rgba(74,58,42,.35);color:var(--bma-muted);font-family:var(--bma-font-mono)}
.bma-plate__placeholder-link{display:inline-flex;align-items:center;font-size:11px;letter-spacing:.14em;padding:13px 22px}

/* Case vide dans la grille numérotée (Planche « Le blog » : aucun
   article publié à ce stade) — même grille que .bma-plate__num-item,
   mise en page interne différente (empilée + lien). */
.bma-plate__num-item--empty{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;background:rgba(251,246,238,.45)}
.bma-plate__num-item--empty span{font-size:10px;letter-spacing:.18em}
.bma-plate__num-item--empty a{font-family:var(--bma-font-mono);font-size:11px;letter-spacing:.14em;color:var(--bma-sanguine)}

/* ============ MON APPROCHE — carrousel de planches ============
   3 planches visibles (centrale nette + 2 aperçus atténués).
   Auto-défilement lent, boucle infinie, drag, flèches, points.
   ============================================================ */
.bma-carou{ position:relative; max-width:1120px; margin:0 auto; }

.bma-carou__viewport{ overflow:hidden; padding:10px 0 4px; }
.bma-carou__track{ display:flex; will-change:transform; }
/* transition posée par le JS quand il faut glisser (désactivée au drag) */
.bma-carou__track.is-animating{ transition:transform .8s cubic-bezier(.4,0,.2,1); }

/* 3 visibles -> chaque planche fait ~1/3 de la fenêtre */
.bma-carou__slide{
  flex:0 0 33.333%; box-sizing:border-box; margin:0; padding:0 22px;
  text-align:center;
  opacity:.42; transform:scale(.9);
  transition:opacity .6s ease, transform .6s ease;
}
.bma-carou__slide.is-active{ opacity:1; transform:scale(1); }   /* la centrale ressort */

.bma-carou__num{
  display:block; font-family:var(--bma-font-mono);
  font-size:12px; letter-spacing:.3em; color:var(--bma-sanguine); margin-bottom:16px;
}

/* Cadre "planche gravée" à coins sanguine */
.bma-carou__plate{
  position:relative; aspect-ratio:1/1;
  border:1px solid var(--bma-line);
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,252,244,.35);
}
.bma-carou__plate img{
  max-width:100%; max-height:100%; width:auto; height:auto; display:block;
  mix-blend-mode:multiply;
}
.bma-carou__corner{ position:absolute; width:13px; height:13px; }
.bma-carou__corner:nth-child(1){ top:6px; left:6px; border-top:1px solid var(--bma-sanguine); border-left:1px solid var(--bma-sanguine); }
.bma-carou__corner:nth-child(2){ top:6px; right:6px; border-top:1px solid var(--bma-sanguine); border-right:1px solid var(--bma-sanguine); }
.bma-carou__corner:nth-child(3){ bottom:6px; left:6px; border-bottom:1px solid var(--bma-sanguine); border-left:1px solid var(--bma-sanguine); }
.bma-carou__corner:nth-child(4){ bottom:6px; right:6px; border-bottom:1px solid var(--bma-sanguine); border-right:1px solid var(--bma-sanguine); }

.bma-carou__cap{
  margin-top:18px; font-family:var(--bma-font-serif); font-style:italic;
  font-size:clamp(17px,1.5vw,21px); line-height:1.35; color:var(--bma-ink);
  max-width:24ch; margin-left:auto; margin-right:auto; min-height:3.4em;
}

/* Flèches */
.bma-carou__arrow{
  position:absolute; top:44%; transform:translateY(-50%); z-index:3;
  width:46px; height:46px; border:none; border-radius:50%;
  background:transparent; color:var(--bma-ink);
  font-size:22px; line-height:1; cursor:pointer;
  transition:background .3s, color .3s, border-color .3s;
}
.bma-carou__arrow:hover{ color:var(--bma-sanguine); }
.bma-carou__arrow--prev{ left:-6px; }
.bma-carou__arrow--next{ right:-6px; }

/* Points */
.bma-carou__dots{ display:flex; justify-content:center; gap:10px; margin-top:30px; }
.bma-carou__dots button{
  width:8px; height:8px; padding:0; border:0; border-radius:50%;
  background:var(--bma-line); cursor:pointer; transition:background .3s, transform .3s;
}
.bma-carou__dots button.is-active{ background:var(--bma-sanguine); transform:scale(1.35); }

@media (max-width:760px){
  .bma-carou__slide{ flex-basis:80%; }       /* 1 planche + aperçus fins sur mobile */
  .bma-carou__arrow{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .bma-carou__track.is-animating{ transition:none; }
  .bma-carou__slide{ transition:none; }
}

/* ============ FIL D'ARIANE ============ */
.bma-breadcrumb{
  padding:14px 6px 4vw;                      /* même marge latérale que tes sections (8vw) */
  font-family:var(--bma-font-mono);
}
.bma-breadcrumb ol{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
}
.bma-breadcrumb li{ display:flex; align-items:center; gap:10px; }

/* Séparateur entre les niveaux */
.bma-breadcrumb li + li::before{
  content:"—";                           /* tiret sobre ; mets "›" si tu préfères une flèche */
  color:var(--bma-line);
}

/* Liens cliquables */
.bma-breadcrumb a{
  color:var(--bma-muted);
  text-decoration:none;
  transition:color .3s ease;
}
.bma-breadcrumb a:hover{ color:var(--bma-sanguine); }

/* Page courante (non cliquable, mise en avant) */
.bma-breadcrumb [aria-current="page"]{
  color:var(--bma-sanguine);
}

/* Le mot animé ne doit jamais intercepter les clics ni déborder */
.bma-word{
  pointer-events:none;          /* il ne bloque plus les clics des éléments derrière */
}
/* Sécurité : le paragraphe animé reste dans sa zone */
.bma-constat__lead,
[data-reveal]{
  position:relative;
  z-index:0;                    /* passe SOUS le fil d'Ariane / header */
}
/* Le fil d'Ariane et le header restent cliquables au-dessus */
.bma-breadcrumb{ position:relative; z-index:5; }

/* Lien du menu correspondant à la page active : en sanguine */
.bma-menu__link[aria-current="page"] .bma-menu__num,
.bma-menu__link[aria-current="page"] .bma-menu__label{
  color:var(--bma-sanguine);
}