/* ==========================================================================
   MUSIPROF — refonte du 28/09/2026 (retours de Roxane, validés par Mathias)
   Palette simplifiée : blanc + nuit/indigo (une seule famille) + UN accent
   laiton (les cuivres). Plus de rose, plus de noir pur, plus de grain.
   Toutes les classes neuves sont préfixées mx- (aucune collision avec mp-).
   ========================================================================== */

:root{
  --mx-indigo-clair:#EEEDFC;
  --mx-ombre:0 18px 40px -22px rgba(23,21,59,.38);
  --mx-ombre-douce:0 8px 24px -16px rgba(23,21,59,.30);
  --mx-rayon:22px;
  --mx-ease:cubic-bezier(.22,.8,.26,1);
}
.mp-grain{background-image:none!important}
.mp-hero::before{display:none}
.mp-bande--feutre{background:var(--feutre)}
.mp-accent-mot{color:var(--drap)}
.mx-ico{width:1.1em;height:1.1em;flex:0 0 auto;vertical-align:-.15em}

/* ---------- mots-clés soulignés au laiton ---------- */
.mx-souligne{background:linear-gradient(transparent 62%, color-mix(in srgb,var(--laiton) 70%, transparent) 62%, color-mix(in srgb,var(--laiton) 70%, transparent) 92%, transparent 92%);
  padding-inline:.08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.mx-etiquette{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:12.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--drap)}
.mx-etiquette::before{content:"";width:22px;height:2px;background:var(--laiton);border-radius:2px}
.mx-etiquette--clair{color:#C9C8EA}
.mx-section-tete{margin-bottom:2rem}
.mx-section-tete h2{font-size:clamp(28px,3.2vw,40px);line-height:1.12;margin-top:.5rem;color:var(--ebene)}

/* ---------- boutons ---------- */
.mx-bouton{display:inline-flex;align-items:center;gap:.6rem;background:var(--drap);color:#fff;font-family:var(--f-titre);
  font-weight:700;font-size:16px;padding:.9rem 1.5rem;border-radius:var(--r-pille);border:0;min-height:48px;
  box-shadow:0 10px 22px -12px color-mix(in srgb,var(--drap) 80%, transparent);
  transition:transform .2s var(--mx-ease),box-shadow .2s var(--mx-ease),background .2s}
.mx-bouton:hover{transform:translateY(-2px);background:var(--drap-sombre);text-decoration:none}
.mx-bouton .mx-ico{transition:transform .2s var(--mx-ease)}
.mx-bouton:hover .mx-ico:last-child{transform:translateX(4px)}
.mx-bouton--laiton{background:var(--laiton);color:var(--ebene);box-shadow:0 10px 24px -12px rgba(217,154,30,.9)}
.mx-bouton--laiton:hover{background:#FFC857;color:var(--ebene)}
.mx-lien-fleche{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--f-titre);font-weight:700;color:var(--drap)}
.mx-lien-fleche .mx-ico{transition:transform .2s var(--mx-ease)}
.mx-lien-fleche:hover .mx-ico,a:hover .mx-lien-fleche .mx-ico{transform:translateX(4px)}

/* ==========================================================================
   EN-TÊTE (R3 logo, R4 menu, R5 bouton Contact)
   ========================================================================== */
.mx-entete{background:rgba(255,255,255,.88);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid color-mix(in srgb,var(--craie) 70%, transparent)}
.mx-entete .mp-entete-in{min-height:74px;gap:1.2rem}
.mx-logo{gap:.55rem}
.mx-logo-symbole{width:34px;height:41px;transition:transform .35s var(--mx-ease)}
.mx-logo:hover .mx-logo-symbole{transform:translateY(-3px) rotate(-6deg)}
.mx-logo-symbole svg{width:100%;height:100%;overflow:visible}
.mx-logo-mot{font-weight:800;font-size:25px;letter-spacing:-.03em;color:var(--ebene)}
.mx-logo-mot span{color:var(--drap)}
.mx-nav{gap:.25rem}
.mx-nav .mx-nav-lien{position:relative;font-size:15px;padding:.55rem .7rem;border-radius:10px;color:var(--ebene);transition:color .2s,background .2s}
.mx-nav .mx-nav-lien::after{content:"";position:absolute;left:.7rem;right:.7rem;bottom:.3rem;height:2px;border-radius:2px;background:var(--laiton);
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--mx-ease)}
.mx-nav .mx-nav-lien:hover{color:var(--drap);background:var(--mx-indigo-clair);text-decoration:none}
.mx-nav .mx-nav-lien:hover::after,.mx-nav .mx-nav-lien.is-actif::after{transform:scaleX(1)}
.mx-nav .mx-nav-lien.is-actif{color:var(--drap)}
.mx-nav .mx-nav-outil{display:inline-flex;align-items:center;gap:.4rem;margin-left:.4rem;padding:.5rem .85rem;border-radius:var(--r-pille);
  border:1.5px solid var(--craie);font-size:14.5px;color:var(--ebene);transition:border-color .2s,color .2s,background .2s}
.mx-nav .mx-nav-outil:hover{border-color:var(--drap);color:var(--drap);text-decoration:none}
.mx-nav .mx-nav-outil .mx-ico{color:var(--drap)}
.mx-nav .mx-cta{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.5rem;margin-left:.3rem;
  background:var(--laiton);color:var(--ebene)!important;padding:.62rem 1.15rem .62rem 1.3rem;border-radius:var(--r-pille);font-weight:700;
  box-shadow:0 8px 20px -10px rgba(217,154,30,.95);transition:transform .2s var(--mx-ease),box-shadow .2s}
.mx-nav .mx-cta::before{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);animation:mx-reflet 4.5s ease-in-out infinite}
.mx-nav .mx-cta:hover{transform:translateY(-2px);background:#FFC857;box-shadow:0 12px 24px -10px rgba(217,154,30,1);text-decoration:none!important}
.mx-nav .mx-cta .mx-ico{transition:transform .2s var(--mx-ease)}
.mx-nav .mx-cta:hover .mx-ico{transform:translateX(3px)}
@keyframes mx-reflet{0%,70%{left:-60%}100%{left:130%}}
@media (max-width:1180px){
  .mx-entete .mp-nav{display:none}
  .mx-entete .mp-burger{display:block}
  .mx-entete .mp-nav-mobile.is-ouvert{display:flex}
}
.mp-nav-mobile a:last-child{background:var(--laiton);color:var(--ebene);border-radius:var(--r-pille);text-align:center}

/* ---------- bandeau défilant (R30) ---------- */
.mx-tempo{height:42px;background:var(--ebene);padding:0;display:block;overflow:hidden;position:relative}
.mx-tempo::before,.mx-tempo::after{content:"";position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none}
.mx-tempo::before{left:0;background:linear-gradient(90deg,var(--ebene),transparent)}
.mx-tempo::after{right:0;background:linear-gradient(-90deg,var(--ebene),transparent)}
.mx-tempo-piste{display:flex;width:max-content;height:100%;animation:mx-defile 70s linear infinite}
.mx-tempo:hover .mx-tempo-piste,.mx-tempo:focus-within .mx-tempo-piste{animation-play-state:paused}
.mx-tempo-liste{display:flex;align-items:center;gap:0;margin:0;padding:0;list-style:none;height:100%}
.mx-tempo-item{display:inline-flex;align-items:center;gap:.45rem;padding:0 1.15rem;height:100%;white-space:nowrap;
  font-family:var(--f-titre);font-size:13.5px;font-weight:500;color:#C9C8EA}
.mx-tempo-item a{color:inherit}
.mx-tempo-item a:hover{color:#fff;text-decoration:none}
.mx-tempo-item .mx-ico{width:14px;height:14px;color:var(--laiton)}
.mx-tempo-item .mx-tempo-note{width:8px;height:16px;color:#8F89F0}
.mx-tempo-item--fort{color:#fff;font-weight:700;padding-inline:1.6rem;position:relative}
.mx-tempo-item--fort b{color:var(--laiton);font-weight:800}
.mx-tempo-item--fort::before{content:"";position:absolute;left:0;top:30%;bottom:30%;width:1px;background:rgba(255,255,255,.18)}
@keyframes mx-defile{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){ .mx-tempo-piste{animation:none} }

/* ==========================================================================
   ACCUEIL — HERO PLEIN ÉCRAN ÉQUILIBRÉ (R1, R2)
   ========================================================================== */
.mx-hero{position:relative;overflow:hidden;min-height:calc(100svh - 116px);display:flex;align-items:center;
  padding-block:2.6rem 3.4rem;
  background:radial-gradient(900px 520px at 88% 20%, #E9E7FF 0%, transparent 60%),
             radial-gradient(700px 480px at 0% 100%, #FFF3D9 0%, transparent 60%), #fff}
.mx-hero-fond{position:absolute;inset:auto 0 0 0;height:46%;pointer-events:none;opacity:.55}
.mx-hero-portee{width:100%;height:100%}
.mx-hero-portee path{fill:none;stroke:#D9D7F5;stroke-width:1.2}
.mx-hero-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:3rem;align-items:center}
.mx-surtitre{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--craie);border-radius:var(--r-pille);
  padding:.4rem .9rem .4rem .7rem;font-family:var(--f-titre);font-weight:600;font-size:14px;color:var(--encre-douce);box-shadow:var(--mx-ombre-douce)}
.mx-surtitre .mx-ico{color:var(--drap)}
.mx-hero h1{font-size:clamp(40px,4.6vw,64px);line-height:1.03;font-weight:900;letter-spacing:-.025em;margin-top:1.1rem;color:var(--ebene)}
.mx-hero-chapo{font-size:19px;line-height:1.55;color:var(--encre-douce);margin-top:1.1rem;max-width:34em}
.mx-hero-lutrin{margin-top:1.8rem;max-width:560px}
.mx-hero-lutrin .mp-lutrin{border-top:0;border-radius:24px;box-shadow:0 24px 50px -26px rgba(23,21,59,.45);border:1px solid #E6E5F5}
.mx-hero-lutrin .mp-lutrin-pilule{border-color:#DCDBF1}
.mx-hero-lutrin .mp-lutrin-suivant,.mx-hero-lutrin .mp-lutrin-bouton{background:var(--drap)}
.mx-preuves{display:flex;flex-wrap:wrap;gap:.6rem 1.3rem;margin-top:1.4rem}
.mx-preuves li{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--f-titre);font-size:14.5px;font-weight:500;color:var(--encre-douce)}
.mx-preuves .mx-ico{color:var(--drap);width:18px;height:18px}
.mx-preuves b{color:var(--ebene)}
.mx-hero-suite{position:absolute;left:50%;bottom:1rem;transform:translateX(-50%);z-index:3;width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;color:var(--drap);background:#fff;border:1px solid var(--craie);box-shadow:var(--mx-ombre-douce);animation:mx-rebond 2.4s ease-in-out infinite}
.mx-ico--bas{transform:rotate(90deg)}
@keyframes mx-rebond{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,6px)}}

/* orbite d'instruments cliquables (R1 : remplace le plateau du bas, R21 esprit « animé ») */
.mx-orbite{--r:215px;--b:112px;position:relative;width:calc(var(--r) * 2 + var(--b));aspect-ratio:1;margin-inline:auto;max-width:100%}
.mx-orbite-anneau{position:absolute;inset:calc(var(--b) / 2);border-radius:50%;border:2px dashed #CFCCF5;animation:mx-tourne 60s linear infinite}
.mx-orbite-centre{position:absolute;left:50%;top:50%;width:196px;height:196px;transform:translate(-50%,-50%);border-radius:50%;
  background:linear-gradient(145deg,#4F46E5,#2E279E);color:#fff;display:grid;place-items:center;text-align:center;padding:1.4rem;
  box-shadow:0 24px 48px -18px rgba(46,39,158,.7)}
.mx-orbite-centre p{display:flex;flex-direction:column;gap:.35rem;font-family:var(--f-titre);font-size:12.5px;line-height:1.35;color:#DAD8FF}
.mx-orbite-centre b{font-size:19px;color:#fff}
.mx-orbite-onde{display:flex;align-items:flex-end;gap:3px;height:22px;justify-content:center;margin-bottom:.5rem}
.mx-orbite-onde i{width:4px;border-radius:2px;background:var(--laiton);animation:mx-egal 1.1s ease-in-out infinite}
.mx-orbite-onde i:nth-child(2){animation-delay:-.2s}.mx-orbite-onde i:nth-child(3){animation-delay:-.45s}
.mx-orbite-onde i:nth-child(4){animation-delay:-.7s}.mx-orbite-onde i:nth-child(5){animation-delay:-.9s}
.mx-orbite-liste{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.mx-bulle{--a:calc(360deg / var(--n) * var(--i) - 90deg);position:absolute;left:50%;top:50%;width:var(--b);
  transform:translate(-50%,-50%) rotate(var(--a)) translate(var(--r)) rotate(calc(-1 * var(--a)))}
.mx-bulle a{display:flex;flex-direction:column;align-items:center;gap:.4rem;text-decoration:none;animation:mx-flotte 5s ease-in-out infinite;
  animation-delay:calc(var(--i) * -.7s)}
.mx-bulle-photo{width:92px;height:92px;border-radius:50%;overflow:hidden;background:#fff;border:4px solid #fff;
  box-shadow:0 14px 28px -14px rgba(23,21,59,.55);transition:transform .3s var(--mx-ease),box-shadow .3s,border-color .3s}
.mx-bulle-photo img{width:100%;height:100%;object-fit:cover}
.mx-bulle-nom{font-family:var(--f-titre);font-weight:700;font-size:14px;color:var(--ebene);background:#fff;padding:.18rem .7rem;border-radius:var(--r-pille);
  box-shadow:var(--mx-ombre-douce);transition:background .25s,color .25s}
.mx-bulle a:hover .mx-bulle-photo,.mx-bulle a:focus-visible .mx-bulle-photo{transform:scale(1.14);border-color:var(--laiton);box-shadow:0 18px 34px -14px rgba(23,21,59,.6)}
.mx-bulle a:hover .mx-bulle-nom,.mx-bulle a:focus-visible .mx-bulle-nom{background:var(--drap);color:#fff}
@keyframes mx-tourne{to{transform:rotate(360deg)}}
@keyframes mx-flotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes mx-egal{0%,100%{height:30%}50%{height:100%}}
@media (prefers-reduced-motion:reduce){ .mx-orbite-anneau,.mx-bulle a,.mx-orbite-onde i,.mx-hero-suite,.mx-egaliseur i,.mx-nav .mx-cta::before{animation:none} }

@media (max-width:1180px){ .mx-orbite{--r:175px;--b:100px} .mx-bulle-photo{width:80px;height:80px} .mx-orbite-centre{width:170px;height:170px} }
@media (max-width:960px){
  .mx-hero{min-height:0;padding-block:2rem 3.6rem}
  .mx-hero-in{grid-template-columns:minmax(0,1fr);gap:2.2rem}
  .mx-hero h1{font-size:40px}
  .mx-hero-suite{display:none}
  /* sur téléphone l'orbite devient une rangée qu'on fait glisser au doigt */
  .mx-orbite{width:auto;aspect-ratio:auto;max-width:none;margin-inline:calc(var(--gout) * -1)}
  .mx-orbite-anneau,.mx-orbite-centre{display:none}
  .mx-orbite-liste{position:static;display:flex;gap:.9rem;overflow-x:auto;padding:.6rem var(--gout) 1rem;scroll-snap-type:x mandatory;scrollbar-width:none}
  .mx-orbite-liste::-webkit-scrollbar{display:none}
  .mx-bulle{position:static;transform:none;width:auto;flex:0 0 auto;scroll-snap-align:start}
  .mx-bulle-photo{width:76px;height:76px}
}
@media (max-width:600px){ .mx-hero h1{font-size:34px} .mx-hero-chapo{font-size:17px} .mx-preuves{gap:.5rem 1rem} .mx-preuves li{font-size:13.5px} }

/* ==========================================================================
   ACCUEIL — UN PROJET PAR PROFIL (R6)
   ========================================================================== */
.mx-projets{padding-block:5rem;background:var(--feutre)}
.mx-onglets{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr);gap:2rem;align-items:stretch}
.mx-onglets-liste{display:flex;flex-direction:column;gap:.7rem}
.mx-onglet{display:flex;align-items:center;gap:1rem;width:100%;text-align:left;background:#fff;border:1.5px solid transparent;border-radius:18px;
  padding:1.1rem 1.2rem;font-family:var(--f-titre);color:var(--ebene);box-shadow:var(--mx-ombre-douce);transition:border-color .2s,transform .2s var(--mx-ease),background .2s}
.mx-onglet:hover{transform:translateX(4px)}
.mx-onglet.is-actif{border-color:var(--drap);background:#fff}
.mx-onglet-ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--mx-indigo-clair);color:var(--drap);flex:0 0 auto;transition:background .2s,color .2s}
.mx-onglet-ico .mx-ico{width:22px;height:22px}
.mx-onglet.is-actif .mx-onglet-ico{background:var(--drap);color:#fff}
.mx-onglet-txt b{font-size:18px}
.mx-onglet-fleche{margin-left:auto;color:var(--craie);transition:color .2s,transform .2s}
.mx-onglet.is-actif .mx-onglet-fleche{color:var(--laiton);transform:translateX(3px)}
.mx-onglets-panneaux{position:relative;min-height:380px}
.mx-panneau{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:#fff;border-radius:var(--mx-rayon);overflow:hidden;box-shadow:var(--mx-ombre);height:100%}
.js .mx-panneau{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .35s var(--mx-ease),transform .35s var(--mx-ease),visibility .35s}
.js .mx-panneau.is-actif{opacity:1;visibility:visible;transform:none}
html:not(.js) .mx-panneau + .mx-panneau{margin-top:1rem}
.mx-panneau-photo img{width:100%;height:100%;object-fit:cover}
.mx-panneau-texte{padding:2.2rem 2rem;display:flex;flex-direction:column;justify-content:center;gap:1rem}
.mx-panneau-texte h3{font-size:28px;color:var(--ebene)}
.mx-panneau-texte p{font-size:18px;line-height:1.6;color:var(--encre-douce)}
@media (max-width:960px){
  .mx-onglets{grid-template-columns:minmax(0,1fr)}
  .mx-onglets-liste{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gout) * -1);padding:0 var(--gout) .4rem}
  .mx-onglet{flex:0 0 auto;width:auto;padding:.7rem 1rem}
  .mx-onglet-fleche{display:none}
  .mx-onglet-ico{width:36px;height:36px}
  .mx-onglet-txt b{font-size:15.5px}
  .mx-onglets-panneaux{min-height:0}
  .js .mx-panneau{position:relative;display:none}
  .js .mx-panneau.is-actif{display:grid}
  .mx-panneau{grid-template-columns:minmax(0,1fr)}
  .mx-panneau-photo{height:220px}
  .mx-panneau-texte{padding:1.5rem 1.3rem}
  .mx-panneau-texte h3{font-size:23px}
}

/* ==========================================================================
   ACCUEIL — COMBIEN ÇA COÛTE (R8)
   ========================================================================== */
.mx-prix{padding-block:5rem;background:#fff}
.mx-prix-panneau{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:2.6rem;align-items:center;
  background:radial-gradient(600px 400px at 100% 0%, #3A33B8 0%, transparent 60%), var(--ebene);color:#fff;border-radius:32px;padding:3.2rem}
.mx-prix-texte h2{font-size:clamp(28px,3vw,40px);line-height:1.12;margin:.6rem 0 1rem;color:#fff}
.mx-prix-texte p{color:#C9C8EA;font-size:18px;line-height:1.6;margin-bottom:1.6rem}
.mx-prix-etiquettes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.mx-etiq-prix{position:relative;background:#fff;color:var(--ebene);border-radius:20px;padding:2.2rem 1.2rem 1.4rem;text-align:center;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.55);transition:transform .35s var(--mx-ease)}
.mx-etiq-prix:nth-child(1){transform:rotate(-2.5deg)}
.mx-etiq-prix:nth-child(3){transform:rotate(2deg)}
.mx-etiq-prix:hover{transform:rotate(0) translateY(-6px)}
.mx-etiq-prix-trou{position:absolute;top:12px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--ebene);box-shadow:inset 0 2px 3px rgba(0,0,0,.4)}
.mx-etiq-prix-val{font-family:var(--f-titre);font-weight:900;font-size:44px;line-height:1;color:var(--drap);letter-spacing:-.02em}
.mx-etiq-prix-val small{display:block;font-size:14px;font-weight:600;color:var(--encre-douce);margin-top:.35rem;letter-spacing:0}
.mx-etiq-prix p:last-child{font-size:14.5px;line-height:1.45;color:var(--encre-douce);margin-top:.8rem}
.mx-etiq-prix--anneau{padding-top:1.4rem}
.mx-anneau{width:92px;height:92px;display:block;margin:0 auto .3rem;transform:rotate(-90deg)}
.mx-anneau circle{fill:none;stroke:var(--mx-indigo-clair);stroke-width:10}
.mx-anneau .mx-anneau-val{stroke:var(--laiton);stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray 1.4s var(--mx-ease)}
.is-vu .mx-anneau-val,html:not(.js) .mx-anneau-val{stroke-dasharray:var(--v) 100}
.mx-etiq-prix--anneau .mx-etiq-prix-val{margin-top:-68px;margin-bottom:34px;font-size:30px}
@media (max-width:1080px){ .mx-prix-panneau{grid-template-columns:minmax(0,1fr);padding:2.4rem 1.6rem} }
@media (max-width:640px){
  .mx-prix{padding-block:3rem}
  .mx-prix-etiquettes{grid-template-columns:minmax(0,1fr);gap:1.2rem}
  .mx-etiq-prix:nth-child(n){transform:none}
}

/* ==========================================================================
   ACCUEIL — MISE EN RELATION (R9 couleur, R10 espace texte/bouton)
   ========================================================================== */
.mx-relance-bande{padding-block:1rem 4.4rem;background:#fff}
.mx-relance{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:2.4rem;flex-wrap:wrap;
  background:linear-gradient(120deg,#4F46E5 0%,#2E279E 100%);border-radius:28px;padding:2.6rem 3rem;color:#fff;text-align:left}
.mx-relance-texte h2{font-size:clamp(24px,2.6vw,32px);line-height:1.15;color:#fff;max-width:22ch;margin-top:.4rem}
.mx-egaliseur{display:flex;align-items:flex-end;gap:5px;height:56px;flex:0 0 auto}
.mx-egaliseur i{width:7px;border-radius:4px;background:linear-gradient(var(--laiton),#FFE3A3);animation:mx-egal 1.2s ease-in-out infinite}
.mx-egaliseur i:nth-child(2n){animation-delay:-.3s}.mx-egaliseur i:nth-child(3n){animation-delay:-.6s}.mx-egaliseur i:nth-child(4n){animation-delay:-.9s}
@media (max-width:760px){ .mx-relance{padding:2rem 1.4rem;gap:1.2rem;justify-content:flex-start} .mx-egaliseur{display:none} }

/* ==========================================================================
   ACCUEIL — ACCORDEUR (R31) et GUIDES (R11)
   ========================================================================== */
.mx-accordeur-promo{padding-block:4rem;background:var(--feutre)}
.mx-accordeur-promo-in{display:grid;grid-template-columns:260px minmax(0,1fr);gap:3rem;align-items:center}
.mx-accordeur-promo h2{font-size:clamp(26px,2.8vw,36px);margin:.5rem 0 .8rem;color:var(--ebene)}
.mx-accordeur-promo p{color:var(--encre-douce);font-size:18px;max-width:44ch;margin-bottom:1.4rem}
.mx-accordeur-promo-cadran{position:relative;width:240px;height:150px;margin-inline:auto;overflow:hidden}
.mx-cadran-arc{position:absolute;left:0;top:0;width:240px;height:240px;border-radius:50%;
  background:conic-gradient(from -90deg,#E54D4D 0deg,#F4B63F 50deg,#34C77B 85deg,#34C77B 95deg,#F4B63F 130deg,#E54D4D 180deg,transparent 180deg);
  -webkit-mask:radial-gradient(circle,transparent 58%,#000 59%);mask:radial-gradient(circle,transparent 58%,#000 59%)}
.mx-cadran-aiguille{position:absolute;left:50%;bottom:30px;width:4px;height:100px;margin-left:-2px;background:var(--ebene);border-radius:4px;transform-origin:50% 100%;
  animation:mx-aiguille 3.2s var(--mx-ease) infinite}
.mx-accordeur-promo-cadran b{position:absolute;left:50%;bottom:0;transform:translateX(-50%);font-family:var(--f-titre);font-size:26px;color:var(--ebene)}
@keyframes mx-aiguille{0%{transform:rotate(-38deg)}40%{transform:rotate(14deg)}70%{transform:rotate(-4deg)}100%{transform:rotate(-38deg)}}
@media (prefers-reduced-motion:reduce){ .mx-cadran-aiguille{animation:none} }
@media (max-width:760px){ .mx-accordeur-promo-in{grid-template-columns:minmax(0,1fr);gap:1.4rem;text-align:left} }

.mx-guides{padding-block:5rem;background:#fff}
.mx-guides-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.mx-guide{display:flex;flex-direction:column;background:#fff;border:1px solid #E6E5F5;border-radius:var(--mx-rayon);overflow:hidden;
  box-shadow:var(--mx-ombre-douce);transition:transform .3s var(--mx-ease),box-shadow .3s}
.mx-guide:hover{transform:translateY(-6px);box-shadow:var(--mx-ombre);text-decoration:none}
.mx-guide-photo{height:200px;overflow:hidden;display:block}
.mx-guide-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--mx-ease)}
.mx-guide:hover .mx-guide-photo img{transform:scale(1.06)}
.mx-guide-corps{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:2rem 1.4rem 1.4rem;flex:1}
.mx-guide-ico{position:absolute;top:-26px;left:1.4rem;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--drap);color:#fff;
  box-shadow:0 10px 20px -10px rgba(63,55,201,.9)}
.mx-guide-ico .mx-ico{width:24px;height:24px}
.mx-guide-corps b{font-family:var(--f-titre);font-size:22px;color:var(--ebene)}
.mx-guide-corps > span:not([class]){color:var(--encre-douce);font-size:16px;line-height:1.5}
.mx-guide-pied{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:.8rem;border-top:1px solid #EEEDF8}
.mx-guide-pied i{font-style:normal;font-family:var(--f-mono);font-size:12.5px;color:var(--encre-douce);background:var(--mx-indigo-clair);padding:.2rem .6rem;border-radius:var(--r-pille)}
@media (max-width:960px){ .mx-guides-grille{grid-template-columns:minmax(0,1fr)} .mx-guide{flex-direction:row} .mx-guide-photo{width:38%;height:auto;flex:0 0 auto} }
@media (max-width:600px){ .mx-guide{flex-direction:column} .mx-guide-photo{width:auto;height:170px} .mx-projets,.mx-guides{padding-block:3.2rem} }

/* apparition au défilement (JS ajoute .is-vu ; sans JS tout est visible) */
.js .mx-apparait{opacity:0;transform:translateY(16px);transition:opacity .6s var(--mx-ease),transform .6s var(--mx-ease)}
.js .mx-apparait.is-vu{opacity:1;transform:none}
.js .mx-etiq-prix.mx-apparait.is-vu:nth-child(1){transform:rotate(-2.5deg)}
.js .mx-etiq-prix.mx-apparait.is-vu:nth-child(3){transform:rotate(2deg)}
@media (max-width:640px){ .js .mx-etiq-prix.mx-apparait.is-vu:nth-child(n){transform:none} }
@media (prefers-reduced-motion:reduce){ .js .mx-apparait{opacity:1;transform:none;transition:none} }

/* ==========================================================================
   ARTICLE — en-tête organisé (R13) + couleurs (R12)
   ========================================================================== */
.mx-art-tete{background:linear-gradient(180deg,var(--feutre) 0%,#fff 100%);padding-block:2.2rem 2.6rem;margin-bottom:1.6rem}
.mx-art-tete-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:2.6rem;align-items:center}
.mx-art-tete-in--seul{grid-template-columns:minmax(0,1fr);max-width:860px}
.mx-ariane{display:flex;flex-wrap:wrap;gap:.45rem;font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce);margin-bottom:1rem}
.mx-ariane a{color:var(--drap)}
.mx-art-tete h1{font-size:clamp(30px,3.3vw,44px);line-height:1.1;letter-spacing:-.015em;margin-top:.7rem;color:var(--ebene)}
.mx-art-chapo{font-size:19px;line-height:1.6;color:var(--encre-douce);margin-top:1rem}
.mx-byline{display:flex;align-items:center;gap:.8rem;margin-top:1.4rem}
.mx-byline img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:var(--mx-ombre-douce)}
.mx-byline p{display:flex;flex-direction:column;font-family:var(--f-titre);font-size:14px;color:var(--encre-douce);line-height:1.4}
.mx-byline a{color:var(--ebene);font-weight:700}
.mx-art-une{margin:0;position:relative}
.mx-art-une img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:26px;box-shadow:var(--mx-ombre)}
.mx-art-une::before{content:"";position:absolute;inset:18px -14px -14px 18px;border-radius:26px;background:var(--laiton);opacity:.35;z-index:-1}
.mx-art-une figcaption{font-family:var(--f-mono);font-size:11.5px;color:var(--encre-douce);margin-top:.7rem;text-align:right}
@media (max-width:960px){
  .mx-art-tete{padding-block:1.4rem 1.8rem}
  .mx-art-tete-in{grid-template-columns:minmax(0,1fr);gap:1.4rem}
  .mx-art-une{order:-1}
  .mx-art-une img{aspect-ratio:16/10;border-radius:18px}
  .mx-art-une::before{display:none}
}

/* ==========================================================================
   BLOCS VISUELS DANS LE CORPS (R14 infographie, R15 image, R16 schéma, R17 le saviez-vous)
   ========================================================================== */
.mp-corps .mx-info,.mp-corps .mx-schema,.mp-corps .mx-saviez,.mp-corps .mx-image-corps{margin:2.2rem 0}
.mx-info,.mx-schema{background:#fff;border:1px solid #E6E5F5;border-radius:22px;padding:1.5rem 1.5rem 1.6rem;box-shadow:var(--mx-ombre-douce)}
.mx-info-tete{display:flex;align-items:center;gap:.55rem;font-family:var(--f-titre);font-weight:800;font-size:17px;color:var(--ebene);margin-bottom:1.1rem}
.mx-info-tete .mx-ico{color:var(--laiton-sombre);width:22px;height:22px}
.mx-info-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.mx-info-grille--2,.mx-info-grille--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.mx-info-item{display:flex;flex-direction:column;gap:.35rem;background:var(--feutre);border-radius:16px;padding:1.1rem 1rem}
.mx-info-ico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--drap);color:#fff}
.mx-info-ico .mx-ico{width:20px;height:20px}
.mx-info-val{font-family:var(--f-titre);font-weight:900;font-size:30px;line-height:1.05;color:var(--drap);letter-spacing:-.02em;margin-top:.3rem}
.mx-info-label{font-family:var(--f-titre);font-size:14px;line-height:1.4;color:var(--encre-douce)}
.mx-barres{display:flex;flex-direction:column;gap:.9rem}
.mx-barre{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) auto;gap:.9rem;align-items:center;font-family:var(--f-titre);font-size:14.5px}
.mx-barre-label{font-weight:700;color:var(--ebene)}
.mx-barre-piste{position:relative;height:14px;border-radius:99px;background:var(--mx-indigo-clair);overflow:hidden}
.mx-barre-plage{position:absolute;top:0;bottom:0;left:var(--g);width:0;border-radius:99px;background:linear-gradient(90deg,var(--drap),#6D64F0);transition:width 1s var(--mx-ease)}
.is-vu .mx-barre-plage,html:not(.js) .mx-barre-plage{width:var(--w)}
.mx-barre-val{font-family:var(--f-mono);font-size:13px;color:var(--encre-douce);white-space:nowrap}
.mx-schema-etapes{display:grid;grid-template-columns:repeat(var(--k,3),minmax(0,1fr));gap:.9rem;counter-reset:e;margin:0;padding:0;list-style:none;position:relative}
.mx-schema-etapes--2{--k:2}.mx-schema-etapes--3{--k:3}.mx-schema-etapes--4{--k:4}.mx-schema-etapes--5{--k:5}
.mx-schema-etapes::before{content:"";position:absolute;left:22px;right:22px;top:21px;height:2px;background:repeating-linear-gradient(90deg,var(--laiton) 0 8px,transparent 8px 14px)}
.mx-schema-etape{position:relative;display:flex;flex-direction:column;gap:.35rem;font-family:var(--f-titre)}
.mx-schema-num{position:relative;z-index:1;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--drap);color:#fff;font-weight:800;font-size:17px;
  box-shadow:0 0 0 6px #fff}
.mx-schema-etape strong{font-size:15.5px;color:var(--ebene);line-height:1.3;margin-top:.3rem}
.mx-schema-etape span:last-child{font-size:14px;line-height:1.45;color:var(--encre-douce)}
.mx-saviez{display:flex;gap:1rem;align-items:flex-start;background:linear-gradient(135deg,#FFF6E0,#FFFBF1);border:1px solid #F6DDA0;border-left:5px solid var(--laiton);
  border-radius:18px;padding:1.2rem 1.3rem}
.mx-saviez-ico{width:44px;height:44px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:var(--laiton);color:var(--ebene)}
.mx-saviez-ico .mx-ico{width:22px;height:22px}
.mx-saviez-titre{font-family:var(--f-titre);font-weight:800;font-size:16px;color:var(--ebene);margin-bottom:.25rem!important}
.mx-saviez p{margin:0;font-size:17px;line-height:1.6;color:#3D3A2A}
.mx-image-corps{margin-inline:0}
.mx-image-corps img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:20px;box-shadow:var(--mx-ombre-douce)}
.mx-image-corps figcaption{font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce);margin-top:.6rem}
.mx-image-corps figcaption span{font-family:var(--f-mono);font-size:11.5px;opacity:.8;margin-left:.3rem}
@media (max-width:760px){
  .mx-info-grille,.mx-info-grille--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mx-info-grille--3 .mx-info-item:last-child{grid-column:1/-1}
  .mx-info-val{font-size:26px}
  .mx-barre{grid-template-columns:minmax(0,1fr) auto;row-gap:.35rem}
  .mx-barre-piste{grid-column:1/-1;grid-row:2}
  .mx-schema-etapes{grid-template-columns:minmax(0,1fr);gap:1.1rem}
  .mx-schema-etapes::before{left:21px;right:auto;top:22px;bottom:22px;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--laiton) 0 8px,transparent 8px 14px)}
  .mx-schema-etape{padding-left:60px;min-height:44px}
  .mx-schema-num{position:absolute;left:0;top:0}
  .mx-schema-etape strong{margin-top:.1rem}
}

/* ==========================================================================
   INSTRUMENTS — hub en mosaïque vivante (R20, R21) + encadré animé (R22)
   ========================================================================== */
.mx-inst-hero{padding-block:3.2rem 1.6rem;background:radial-gradient(800px 400px at 90% 0%,#E9E7FF 0%,transparent 60%),#fff}
.mx-inst-hero h1{font-size:clamp(34px,4.2vw,56px);line-height:1.05;letter-spacing:-.02em;margin-top:.6rem;color:var(--ebene);max-width:18ch}
.mx-inst-chapo{font-size:19px;color:var(--encre-douce);margin-top:1rem;max-width:52ch}
.mx-mosaique-bande{padding-block:1.4rem 4rem}
.mx-mosaique{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:230px;gap:1rem;margin:0;padding:0;list-style:none}
.mx-tuile--piano{grid-column:span 2;grid-row:span 2}
.mx-tuile--aide{grid-column:span 2}
.mx-tuile a{position:relative;display:block;height:100%;border-radius:24px;overflow:hidden;background:var(--ebene);color:#fff;text-decoration:none;
  box-shadow:var(--mx-ombre-douce);transition:transform .45s var(--mx-ease),box-shadow .45s var(--mx-ease)}
.mx-tuile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--mx-ease)}
.mx-tuile--guitare img{object-fit:contain;background:#fff;padding:1rem}
.mx-tuile-voile{position:absolute;inset:0;background:linear-gradient(0deg,rgba(23,21,59,.92) 0%,rgba(23,21,59,.25) 55%,rgba(23,21,59,0) 80%);transition:background .45s}
.mx-tuile a:hover,.mx-tuile a:focus-visible{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 26px 50px -24px rgba(23,21,59,.7)}
.mx-tuile a:hover img,.mx-tuile a:focus-visible img{transform:scale(1.08)}
.mx-tuile a:hover .mx-tuile-voile{background:linear-gradient(0deg,rgba(46,39,158,.95) 0%,rgba(63,55,201,.35) 60%,rgba(63,55,201,.05) 90%)}
.mx-tuile-onde{position:absolute;top:1rem;right:1rem;display:flex;align-items:flex-end;gap:3px;height:26px;padding:.3rem .45rem;border-radius:10px;background:rgba(255,255,255,.14);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.mx-tuile-onde i{width:4px;height:30%;border-radius:2px;background:var(--laiton);animation:mx-egal 1.2s ease-in-out infinite;animation-play-state:paused}
.mx-tuile-onde i:nth-child(2){animation-delay:-.2s}.mx-tuile-onde i:nth-child(3){animation-delay:-.5s}.mx-tuile-onde i:nth-child(4){animation-delay:-.8s}.mx-tuile-onde i:nth-child(5){animation-delay:-1s}
.mx-tuile a:hover .mx-tuile-onde i,.mx-tuile a:focus-visible .mx-tuile-onde i{animation-play-state:running}
.mx-tuile-corps{position:absolute;left:0;right:0;bottom:0;padding:1.2rem 1.3rem;display:flex;flex-direction:column;gap:.5rem}
.mx-tuile-nom{font-family:var(--f-titre);font-size:26px;font-weight:800;letter-spacing:-.01em}
.mx-tuile--piano .mx-tuile-nom{font-size:40px}
.mx-tuile-reperes{display:flex;flex-wrap:wrap;gap:.4rem}
.mx-tuile-reperes span{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--f-titre);font-size:12.5px;font-weight:600;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.22);padding:.22rem .6rem;border-radius:99px;backdrop-filter:blur(6px)}
.mx-tuile-reperes .mx-ico{width:14px;height:14px;color:var(--laiton)}
.mx-tuile-lien{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-titre);font-weight:700;font-size:14.5px;color:var(--laiton);
  max-height:0;opacity:0;overflow:hidden;transition:max-height .35s var(--mx-ease),opacity .35s}
.mx-tuile a:hover .mx-tuile-lien,.mx-tuile a:focus-visible .mx-tuile-lien{max-height:30px;opacity:1}
.mx-tuile--aide a{background:linear-gradient(135deg,#FFF3D6 0%,#FFE3A3 100%);color:var(--ebene)}
.mx-tuile--aide .mx-tuile-corps{top:0;justify-content:center;padding:1.6rem 1.8rem}
.mx-tuile--aide .mx-tuile-lien{max-height:30px;opacity:1;color:var(--drap)}
.mx-tuile-aide-ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--ebene);color:var(--laiton)}
.mx-tuile-aide-ico .mx-ico{width:24px;height:24px}
.mx-tuile-texte{font-size:16px;line-height:1.5;color:#4A4332;max-width:40ch}
.js .mx-tuile.mx-apparait{transition-delay:calc(var(--i) * 70ms)}
@media (hover:none){ .mx-tuile-lien{max-height:30px;opacity:1} .mx-tuile-onde i{animation-play-state:running} }
@media (max-width:960px){
  .mx-mosaique{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:200px}
  .mx-tuile--piano{grid-column:span 2;grid-row:span 1}
  .mx-tuile--piano .mx-tuile-nom{font-size:30px}
}
@media (max-width:520px){ .mx-mosaique{grid-auto-rows:170px;gap:.7rem} .mx-tuile-nom{font-size:21px} .mx-tuile-reperes span{font-size:11.5px} .mx-tuile--aide{grid-row:span 2} }

/* encadré animé coloré (bordure en dégradé qui tourne) */
.mx-encadre-bande{padding-block:0 4.4rem}
.mx-encadre{--ang:0deg;position:relative;display:flex;gap:1.3rem;align-items:flex-start;max-width:900px;margin-inline:auto;padding:2rem 2.2rem;border-radius:26px;
  background:linear-gradient(#fff,#fff) padding-box,conic-gradient(from var(--ang),var(--drap),var(--laiton),#8F89F0,var(--drap)) border-box;border:3px solid transparent;
  box-shadow:var(--mx-ombre);animation:mx-bordure 6s linear infinite}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes mx-bordure{to{--ang:360deg}}
@media (prefers-reduced-motion:reduce){ .mx-encadre{animation:none} }
.mx-encadre-ico{width:52px;height:52px;flex:0 0 auto;border-radius:16px;display:grid;place-items:center;background:var(--laiton);color:var(--ebene)}
.mx-encadre-ico .mx-ico{width:26px;height:26px}
.mx-encadre-titre{font-family:var(--f-titre);font-weight:800;font-size:20px;color:var(--ebene);margin-bottom:.5rem!important}
.mx-encadre-corps p{font-size:17.5px;line-height:1.65;color:var(--encre-douce);margin:0 0 .7rem}
.mx-encadre-corps p:last-child{margin-bottom:0}
@media (max-width:600px){ .mx-encadre{flex-direction:column;padding:1.5rem 1.3rem;gap:.8rem} }

/* ==========================================================================
   FICHE INSTRUMENT — héros vivant (R20, R21)
   ========================================================================== */
.mx-fiche-hero{padding-block:2.4rem 1.2rem;background:radial-gradient(700px 420px at 85% 30%,#E9E7FF 0%,transparent 62%),linear-gradient(180deg,#fff,var(--feutre))}
.mx-fiche-hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:3rem;align-items:center}
.mx-fiche-texte h1{font-size:clamp(30px,3.4vw,46px);line-height:1.08;letter-spacing:-.015em;margin-top:.6rem;color:var(--ebene)}
.mx-reperes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:1.5rem 0 1.6rem}
.mx-reperes li{display:flex;gap:.7rem;align-items:flex-start;background:#fff;border:1px solid #E6E5F5;border-radius:16px;padding:.85rem .9rem;box-shadow:var(--mx-ombre-douce)}
.mx-reperes-ico{width:36px;height:36px;flex:0 0 auto;border-radius:11px;display:grid;place-items:center;background:var(--mx-indigo-clair);color:var(--drap)}
.mx-reperes-ico .mx-ico{width:19px;height:19px}
.mx-reperes small{display:block;font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--encre-douce)}
.mx-reperes b{font-family:var(--f-titre);font-size:15.5px;line-height:1.3;color:var(--ebene)}
.mx-fiche-visuel{position:relative;width:min(420px,100%);aspect-ratio:1;margin-inline:auto}
.mx-fiche-rond{position:absolute;inset:12%;border-radius:50%;overflow:hidden;border:8px solid #fff;box-shadow:0 30px 60px -26px rgba(23,21,59,.6);animation:mx-flotte 6s ease-in-out infinite}
.mx-fiche-rond img{width:100%;height:100%;object-fit:cover}
.mx-fiche-ondes i{position:absolute;inset:12%;border-radius:50%;border:2px solid var(--drap);opacity:0;animation:mx-onde 3.6s ease-out infinite}
.mx-fiche-ondes i:nth-child(2){animation-delay:1.2s}.mx-fiche-ondes i:nth-child(3){animation-delay:2.4s}
@keyframes mx-onde{0%{transform:scale(1);opacity:.45}100%{transform:scale(1.35);opacity:0}}
.mx-fiche-note{position:absolute;width:22px;height:44px;color:var(--laiton);animation:mx-flotte 4s ease-in-out infinite}
.mx-fiche-note svg{width:100%;height:100%}
.mx-fiche-note--1{top:4%;right:10%}.mx-fiche-note--2{bottom:8%;left:2%;color:var(--drap);animation-delay:-1.3s}.mx-fiche-note--3{top:40%;right:-2%;width:16px;height:32px;animation-delay:-2.6s}
@media (prefers-reduced-motion:reduce){ .mx-fiche-rond,.mx-fiche-ondes i,.mx-fiche-note{animation:none} }
.mx-fiche-autres{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:2rem}
.mx-fiche-autres a{font-family:var(--f-titre);font-weight:600;font-size:14.5px;padding:.45rem 1rem;border-radius:99px;background:#fff;border:1px solid #E1E0F3;color:var(--ebene);transition:all .2s}
.mx-fiche-autres a:hover{border-color:var(--drap);color:var(--drap);text-decoration:none}
.mx-fiche-autres a.is-actif{background:var(--drap);border-color:var(--drap);color:#fff}
@media (max-width:960px){
  .mx-fiche-hero-in{grid-template-columns:minmax(0,1fr);gap:1.4rem}
  .mx-fiche-visuel{order:-1;width:240px}
  .mx-fiche-autres{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gout) * -1);padding-inline:var(--gout)}
  .mx-fiche-autres a{flex:0 0 auto}
}
@media (max-width:520px){ .mx-reperes{grid-template-columns:minmax(0,1fr)} }
.mx-tuile-atout{font-family:var(--f-titre);font-size:14px;line-height:1.35;color:#DAD8FF;max-width:32ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mx-tuile--guitare a{background:#F4F4FA}
.mx-tuile--guitare .mx-tuile-voile{background:linear-gradient(0deg,rgba(23,21,59,.95) 0%,rgba(23,21,59,.55) 38%,rgba(23,21,59,0) 62%)}
.mx-reperes li > span:last-child{display:flex;flex-direction:column;gap:.15rem;line-height:1.35}
.mx-reperes b{font-size:15px;line-height:1.35}

/* ==========================================================================
   VILLES — carte + recherche + formulaire (R18, R19)
   ========================================================================== */
.mx-villes-hero{padding-block:3rem 1rem;background:radial-gradient(800px 380px at 85% 0%,#E9E7FF 0%,transparent 60%),#fff}
.mx-villes-hero h1{font-size:clamp(34px,4vw,52px);letter-spacing:-.02em;margin-top:.5rem;color:var(--ebene)}
.mx-villes-grille{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:2rem;align-items:start}
.mx-carte-carte{max-width:none;margin:0;background:linear-gradient(160deg,#FBFBFF,#EEEDFC);border:1px solid #E1E0F3;border-radius:28px;padding:2rem 2.4rem;box-shadow:var(--mx-ombre)}
.mx-fr-region{fill:#fff;stroke:#C9C6F0;transition:fill .25s}
.mx-fr-region:hover{fill:#E4E2FB}
.mx-carte-carte .mp-fr-point{fill:var(--laiton);stroke:var(--ebene);stroke-width:1.6;transition:r .2s}
.mx-carte-carte .mp-fr-ville:hover .mp-fr-point,.mx-carte-carte .mp-fr-ville:focus .mp-fr-point{r:8;fill:var(--drap);stroke:#fff}
.mx-fr-pulse{fill:none;stroke:var(--drap);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:mx-fr-pulse 3s ease-out infinite}
@keyframes mx-fr-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3);opacity:0}}
@media (prefers-reduced-motion:reduce){ .mx-fr-pulse{animation:none;opacity:0} }
.mx-carte-carte .mp-fr-nom{font-family:var(--f-titre);font-size:10.5px;font-weight:700;fill:var(--ebene);stroke:#F4F4FF}
.mx-carte-carte .mp-fr-ville:hover .mp-fr-nom{fill:var(--drap)}
.mx-carte-carte .mp-fr-corse{right:1.4rem!important}
.mx-villes-cote{display:flex;flex-direction:column;gap:1.2rem;position:sticky;top:130px}
.mx-villes-cherche{background:#fff;border:1px solid #E1E0F3;border-radius:22px;padding:1.3rem 1.3rem 1.1rem;box-shadow:var(--mx-ombre-douce)}
.mx-villes-cherche label{display:flex;align-items:center;gap:.45rem;font-family:var(--f-titre);font-weight:800;font-size:17px;color:var(--ebene);margin-bottom:.7rem}
.mx-villes-cherche label .mx-ico{color:var(--drap)}
.mx-villes-cherche input{width:100%;font-family:var(--f-titre);font-size:16px;padding:.8rem 1rem;border:1.5px solid #DCDBF1;border-radius:14px;background:#FBFBFE;color:var(--ebene)}
.mx-villes-cherche input:focus{outline:none;border-color:var(--drap);box-shadow:0 0 0 4px var(--mx-indigo-clair)}
.mx-villes-resultats{list-style:none;margin:.8rem 0 0;padding:0;max-height:216px;overflow:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;scrollbar-width:thin}
.mx-villes-resultats a{display:flex;align-items:center;gap:.4rem;padding:.45rem .6rem;border-radius:10px;font-family:var(--f-titre);font-size:14px;color:var(--ebene);background:var(--feutre)}
.mx-villes-resultats a:hover{background:var(--drap);color:#fff;text-decoration:none}
.mx-villes-resultats .mx-ico{width:14px;height:14px;color:var(--laiton-sombre)}
.mx-villes-resultats small{margin-left:auto;font-family:var(--f-mono);font-size:11px;opacity:.7}
.mx-villes-resultats li[hidden]{display:none}
.mx-villes-compte{font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce);margin-top:.8rem!important}
.mx-villes-compte b{color:var(--drap)}
.mx-villes-lutrin{background:var(--ebene);border-radius:22px;padding:1.4rem;color:#fff}
.mx-villes-lutrin-titre{font-family:var(--f-titre);font-weight:800;font-size:19px}
.mx-villes-lutrin-txt{color:#C9C8EA;font-size:15.5px;line-height:1.5;margin:.4rem 0 1rem!important}
.mx-villes-lutrin .mp-lutrin{border-top:0;box-shadow:none;padding:1rem}
@media (max-width:1024px){ .mx-villes-grille{grid-template-columns:minmax(0,1fr)} .mx-villes-cote{position:static} .mx-carte-carte{padding:1.2rem} }
.mx-carte-carte .mp-fr-corse{right:1.2rem!important}

/* ==========================================================================
   RUBRIQUES (R23) + ACTUALITÉ façon site d'info (R29)
   ========================================================================== */
.mx-rub-tete{padding-block:2.6rem 1.4rem;background:radial-gradient(700px 380px at 88% 20%,#E9E7FF 0%,transparent 62%),linear-gradient(180deg,#fff,var(--feutre))}
.mx-rub-tete-in{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:2rem;align-items:center}
.mx-rub-tete h1{font-size:clamp(36px,4.4vw,58px);letter-spacing:-.02em;line-height:1.02;margin-top:.5rem;color:var(--ebene)}
.mx-rub-chiffres{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.mx-rub-chiffres li{font-family:var(--f-titre);font-size:14px;color:var(--encre-douce);background:#fff;border:1px solid #E1E0F3;border-radius:99px;padding:.35rem .9rem}
.mx-rub-chiffres b{color:var(--drap)}
.mx-rub-embleme{position:relative;width:220px;height:220px;margin-inline:auto;display:grid;place-items:center}
.mx-rub-embleme-anneau{position:absolute;inset:0;border-radius:50%;border:2px dashed #CFCCF5;animation:mx-tourne 40s linear infinite}
.mx-rub-embleme-anneau + .mx-rub-embleme-anneau{inset:28px;border-style:solid;border-color:#E4E2FB;animation-direction:reverse}
.mx-rub-embleme-ico{width:110px;height:110px;border-radius:32px;display:grid;place-items:center;background:linear-gradient(145deg,#4F46E5,#2E279E);color:#fff;
  box-shadow:0 24px 44px -18px rgba(46,39,158,.7);transform:rotate(-6deg);animation:mx-flotte 5s ease-in-out infinite}
.mx-rub-embleme-ico .mx-ico{width:52px;height:52px;color:var(--laiton)}
.mx-rub-tete .mx-fiche-autres{margin-top:1.6rem}
.mx-rub-liste{padding-block:2.4rem 3.4rem}
.mx-une-label{display:inline-block;font-family:var(--f-mono);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;background:var(--laiton);color:var(--ebene);padding:.25rem .6rem;border-radius:6px}
.mx-rub-une{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);background:#fff;border:1px solid #E6E5F5;border-radius:28px;overflow:hidden;box-shadow:var(--mx-ombre);margin-bottom:2rem;transition:transform .35s var(--mx-ease)}
.mx-rub-une:hover{transform:translateY(-4px)}
.mx-rub-une-photo img{width:100%;height:100%;min-height:340px;object-fit:cover}
.mx-rub-une-corps{padding:2.4rem 2.2rem;display:flex;flex-direction:column;justify-content:center;gap:1rem}
.mx-rub-une-corps h2{font-size:clamp(24px,2.4vw,32px);line-height:1.15;color:var(--ebene)}
.mx-rub-une-corps p{color:var(--encre-douce);font-size:17.5px;line-height:1.6}
.mx-rub-une-corps .mx-bouton{align-self:flex-start}
.mx-rgrille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem}
.mx-rcarte{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #E6E5F5;border-radius:22px;overflow:hidden;box-shadow:var(--mx-ombre-douce);transition:transform .3s var(--mx-ease),box-shadow .3s}
.mx-rcarte:hover{transform:translateY(-5px);box-shadow:var(--mx-ombre)}
.mx-rcarte-photo{position:relative;aspect-ratio:16/10;overflow:hidden}
.mx-rcarte-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--mx-ease)}
.mx-rcarte:hover .mx-rcarte-photo img{transform:scale(1.05)}
.mx-rcarte-corps{display:flex;flex-direction:column;gap:.55rem;padding:1.2rem 1.25rem 1.3rem;flex:1}
.mx-rcarte-meta{display:flex;align-items:center;gap:.4rem;font-family:var(--f-titre);font-size:13px;color:var(--encre-douce)}
.mx-rcarte-meta .mx-ico{width:15px;height:15px;color:var(--drap)}
.mx-rcarte-titre{font-size:19px;line-height:1.25;color:var(--ebene)}
.mx-rcarte-chapo{font-size:15.5px;line-height:1.55;color:var(--encre-douce)}
.mx-rcarte .mx-lien-fleche{margin-top:auto;font-size:15px}
.mx-badge-nouveau{position:absolute;top:.8rem;left:.8rem;font-family:var(--f-titre);font-weight:800;font-size:12px;background:#E54D4D;color:#fff;padding:.2rem .6rem;border-radius:99px;
  box-shadow:0 0 0 0 rgba(229,77,77,.6);animation:mx-pouls 2s infinite}
@keyframes mx-pouls{0%{box-shadow:0 0 0 0 rgba(229,77,77,.55)}70%{box-shadow:0 0 0 10px rgba(229,77,77,0)}100%{box-shadow:0 0 0 0 rgba(229,77,77,0)}}
/* actualité */
.mx-direct{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--f-titre);font-weight:700;font-size:14px;color:#C0392B;background:#FDECEC;padding:.35rem .85rem;border-radius:99px}
.mx-direct-point{width:9px;height:9px;border-radius:50%;background:#E54D4D;animation:mx-pouls 1.6s infinite}
.mx-flash{display:flex;align-items:stretch;background:var(--ebene);color:#fff;height:52px;overflow:hidden}
.mx-flash-titre{display:flex;align-items:center;gap:.55rem;flex:0 0 auto;padding:0 1.3rem;background:#E54D4D;font-family:var(--f-titre);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.mx-flash-titre .mx-direct-point{background:#fff}
.mx-flash-fenetre{flex:1;overflow:hidden;position:relative}
.mx-flash-piste{display:flex;width:max-content;height:100%;animation:mx-defile 60s linear infinite}
.mx-flash:hover .mx-flash-piste,.mx-flash:focus-within .mx-flash-piste{animation-play-state:paused}
.mx-flash ul{display:flex;align-items:center;margin:0;padding:0;list-style:none}
.mx-flash li{display:flex;align-items:center;gap:.6rem;padding:0 1.6rem;white-space:nowrap;font-family:var(--f-titre);font-size:14.5px;border-right:1px solid rgba(255,255,255,.12)}
.mx-flash time{font-family:var(--f-mono);font-size:12px;color:var(--laiton)}
.mx-flash a{color:#fff}
@media (prefers-reduced-motion:reduce){ .mx-flash-piste,.mx-direct-point,.mx-badge-nouveau,.mx-rub-embleme-anneau,.mx-rub-embleme-ico{animation:none} }
.mx-actu-une{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:1.6rem;margin-bottom:2.6rem}
.mx-une-grand{position:relative;border-radius:28px;overflow:hidden;min-height:480px;background:var(--ebene);box-shadow:var(--mx-ombre)}
.mx-une-photo,.mx-une-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mx-une-photo img{transition:transform 1s var(--mx-ease)}
.mx-une-grand:hover .mx-une-photo img{transform:scale(1.04)}
.mx-une-voile{position:absolute;inset:0;background:linear-gradient(0deg,rgba(23,21,59,.95) 0%,rgba(23,21,59,.5) 45%,rgba(23,21,59,0) 75%)}
.mx-une-corps{position:absolute;left:0;right:0;bottom:0;padding:2rem;color:#fff;display:flex;flex-direction:column;gap:.7rem}
.mx-une-corps h2{font-size:clamp(24px,2.6vw,34px);line-height:1.15;color:#fff}
.mx-une-corps p{color:#DAD8FF;font-size:16.5px;line-height:1.5}
.mx-une-corps .mx-rcarte-meta{color:#C9C8EA}
.mx-une-corps .mx-rcarte-meta .mx-ico{color:var(--laiton)}
.mx-actu-fil{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.8rem;counter-reset:fil}
.mx-actu-fil li{counter-increment:fil}
.mx-actu-fil a{display:flex;gap:.9rem;align-items:center;background:#fff;border:1px solid #E6E5F5;border-radius:18px;padding:.75rem;box-shadow:var(--mx-ombre-douce);transition:transform .25s var(--mx-ease),border-color .25s}
.mx-actu-fil a:hover{transform:translateX(5px);border-color:var(--drap);text-decoration:none}
.mx-fil-photo{flex:0 0 96px;height:96px;border-radius:14px;overflow:hidden}
.mx-fil-photo img{width:100%;height:100%;object-fit:cover}
.mx-fil-txt{display:flex;flex-direction:column;gap:.3rem}
.mx-fil-txt time{font-family:var(--f-mono);font-size:11.5px;color:#C0392B}
.mx-fil-txt b{font-family:var(--f-titre);font-size:15.5px;line-height:1.3;color:var(--ebene)}
.mx-rub-sous{font-size:26px;margin-bottom:1.2rem;color:var(--ebene);display:flex;align-items:center;gap:.8rem}
.mx-rub-sous::after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--laiton),transparent)}
@media (max-width:1024px){
  .mx-rub-tete-in{grid-template-columns:minmax(0,1fr)}
  .mx-rub-embleme{display:none}
  .mx-rgrille{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mx-actu-une{grid-template-columns:minmax(0,1fr)}
  .mx-rub-une{grid-template-columns:minmax(0,1fr)}
  .mx-rub-une-photo img{min-height:0;aspect-ratio:16/9}
}
@media (max-width:640px){
  .mx-rgrille{grid-template-columns:minmax(0,1fr)}
  .mx-une-grand{min-height:420px}
  .mx-une-corps{padding:1.3rem}
  .mx-rub-une-corps{padding:1.5rem 1.3rem}
  .mx-fil-photo{flex-basis:76px;height:76px}
  .mx-flash-titre{padding:0 .8rem;font-size:12px}
}
.mx-une-label{align-self:flex-start}
.mp-pagination ul{display:flex;gap:.5rem;list-style:none;margin:2rem 0 0;padding:0;flex-wrap:wrap}
.mp-pagination a,.mp-pagination span{display:grid;place-items:center;min-width:44px;height:44px;padding:0 .9rem;border-radius:12px;font-family:var(--f-titre);font-weight:700;font-size:15px;
  background:#fff;border:1px solid #E1E0F3;color:var(--ebene)}
.mp-pagination a:hover{border-color:var(--drap);color:var(--drap);text-decoration:none}
.mp-pagination .current{background:var(--drap);border-color:var(--drap);color:#fff}

/* ==========================================================================
   À PROPOS (R25)
   ========================================================================== */
.mx-apropos-hero{position:relative;overflow:hidden;padding-block:4.4rem 4.8rem;color:#fff;
  background:radial-gradient(700px 460px at 90% 10%,#4F46E5 0%,transparent 60%),radial-gradient(600px 400px at 0% 100%,#2E279E 0%,transparent 60%),var(--ebene)}
.mx-apropos-hero-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:3rem;align-items:center}
.mx-apropos-hero h1{font-size:clamp(34px,4.4vw,58px);line-height:1.05;letter-spacing:-.02em;margin-top:.8rem;color:#fff}
.mx-souligne--sombre{background:linear-gradient(transparent 64%,rgba(244,182,63,.55) 64%,rgba(244,182,63,.55) 92%,transparent 92%)}
.mx-apropos-chapo{font-size:19px;line-height:1.6;color:#DAD8FF;margin-top:1.2rem;max-width:40em}
.mx-apropos-chiffres{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.mx-apropos-chiffres li{display:flex;flex-direction:column;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:.9rem 1.3rem;min-width:130px}
.mx-apropos-chiffres b{font-family:var(--f-titre);font-weight:900;font-size:36px;line-height:1;color:var(--laiton)}
.mx-apropos-chiffres span{font-family:var(--f-titre);font-size:14px;color:#C9C8EA;margin-top:.3rem}
.mx-apropos-collage{position:relative;height:380px}
.mx-apropos-rond{position:absolute;border-radius:50%;overflow:hidden;border:6px solid rgba(255,255,255,.9);box-shadow:0 26px 50px -20px rgba(0,0,0,.6);animation:mx-flotte 6s ease-in-out infinite}
.mx-apropos-rond img{width:100%;height:100%;object-fit:cover}
.mx-apropos-rond--0{width:220px;height:220px;top:10px;left:8%}
.mx-apropos-rond--1{width:160px;height:160px;top:170px;right:4%;animation-delay:-2s}
.mx-apropos-rond--2{width:120px;height:120px;bottom:0;left:22%;animation-delay:-4s}
.mx-apropos-badge{position:absolute;top:24px;right:6%;display:flex;align-items:center;gap:.5rem;background:var(--laiton);color:var(--ebene);font-family:var(--f-titre);font-weight:800;font-size:14px;line-height:1.2;
  padding:.7rem 1rem;border-radius:16px;transform:rotate(4deg);box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.mx-apropos-badge .mx-ico{width:22px;height:22px}
.mx-apropos-bloc{padding-block:4.4rem}
.mx-apropos-bloc--teinte{background:var(--feutre)}
.mx-oui-non{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.3rem}
.mx-oui,.mx-non{border-radius:24px;padding:1.8rem 2rem;border:1px solid #E6E5F5;background:#fff;box-shadow:var(--mx-ombre-douce)}
.mx-non{background:linear-gradient(135deg,#FFF6E0,#FFFBF1);border-color:#F6DDA0}
.mx-oui-non-titre{display:flex;align-items:center;gap:.6rem;font-family:var(--f-titre);font-weight:800;font-size:20px;color:var(--ebene);margin-bottom:1rem!important}
.mx-oui-non-titre .mx-ico{width:30px;height:30px;padding:5px;border-radius:10px;background:var(--drap);color:#fff}
.mx-non .mx-oui-non-titre .mx-ico{background:var(--laiton);color:var(--ebene)}
.mx-oui ul,.mx-non ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.mx-oui li,.mx-non li{position:relative;padding-left:1.6rem;font-family:var(--f-titre);font-size:16.5px;color:var(--ebene)}
.mx-oui li::before,.mx-non li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border-radius:50%;background:var(--drap)}
.mx-non li::before{background:var(--laiton-sombre)}
.mx-principes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem}
.mx-principe{background:#fff;border-radius:24px;padding:1.8rem 1.6rem;border:1px solid #E6E5F5;box-shadow:var(--mx-ombre-douce);transition:transform .3s var(--mx-ease)}
.mx-principe:hover{transform:translateY(-6px)}
.mx-principe-ico{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#4F46E5,#2E279E);color:var(--laiton);margin-bottom:1.1rem}
.mx-principe-ico .mx-ico{width:26px;height:26px}
.mx-principe h3{font-size:21px;color:var(--ebene);margin-bottom:.6rem}
.mx-principe p{font-size:16.5px;line-height:1.6;color:var(--encre-douce)}
.mx-apropos-relation{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:center}
.mx-apropos-txt{font-size:18px;line-height:1.65;color:var(--encre-douce);margin-bottom:1.6rem!important}
.mx-etapes-v{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem;position:relative}
.mx-etapes-v::before{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;background:repeating-linear-gradient(180deg,var(--laiton) 0 8px,transparent 8px 14px)}
.mx-etapes-v li{position:relative;display:flex;gap:1.1rem;align-items:center;background:#fff;border:1px solid #E6E5F5;border-radius:20px;padding:1.1rem 1.2rem;box-shadow:var(--mx-ombre-douce)}
.mx-etapes-v li > span{flex:0 0 auto;width:34px;height:34px;margin-left:3px;border-radius:50%;display:grid;place-items:center;background:var(--drap);color:#fff;font-family:var(--f-titre);font-weight:800;box-shadow:0 0 0 6px #fff}
.mx-etapes-v b{font-family:var(--f-titre);font-size:17px;color:var(--ebene)}
.mx-etapes-v p{margin:.15rem 0 0;color:var(--encre-douce);font-size:15.5px}
.mx-equipe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.3rem}
.mx-membre{display:flex;gap:1.3rem;align-items:flex-start;background:#fff;border:1px solid #E6E5F5;border-radius:24px;padding:1.6rem;box-shadow:var(--mx-ombre-douce);transition:transform .3s var(--mx-ease),border-color .3s}
.mx-membre:hover{transform:translateY(-5px);border-color:var(--drap);text-decoration:none}
.mx-membre-photo img{width:104px;height:104px;border-radius:50%;object-fit:cover;border:4px solid var(--mx-indigo-clair)}
.mx-membre-corps{display:flex;flex-direction:column;gap:.35rem}
.mx-membre-corps b{font-family:var(--f-titre);font-size:21px;color:var(--ebene)}
.mx-membre-corps small{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--drap)}
.mx-membre-corps > span:not([class]){color:var(--encre-douce);font-size:15.5px;line-height:1.55}
@media (max-width:960px){
  .mx-apropos-hero{padding-block:3rem}
  .mx-apropos-hero-in,.mx-apropos-relation{grid-template-columns:minmax(0,1fr);gap:2rem}
  .mx-apropos-collage{height:260px}
  .mx-apropos-rond--0{width:160px;height:160px}.mx-apropos-rond--1{width:120px;height:120px;top:110px}.mx-apropos-rond--2{width:90px;height:90px}
  .mx-oui-non,.mx-principes,.mx-equipe{grid-template-columns:minmax(0,1fr)}
  .mx-apropos-bloc{padding-block:3rem}
}
@media (max-width:520px){ .mx-membre{flex-direction:column} .mx-apropos-chiffres li{min-width:0;flex:1} }

/* ==========================================================================
   CONTACT (R26)
   ========================================================================== */
.mx-contact{padding-block:3rem 4.4rem;background:radial-gradient(700px 420px at 90% 0%,#E9E7FF 0%,transparent 60%),linear-gradient(180deg,#fff,var(--feutre))}
.mx-contact-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:start}
.mx-contact h1{font-size:clamp(36px,4.4vw,58px);letter-spacing:-.02em;margin-top:.5rem;color:var(--ebene)}
.mx-contact-chapo{font-size:19px;line-height:1.6;color:var(--encre-douce);margin-top:.8rem;max-width:32em}
.mx-motifs{display:flex;flex-direction:column;gap:.7rem;margin-top:1.8rem}
.mx-motif{display:flex;align-items:center;gap:1rem;width:100%;text-align:left;background:#fff;border:1.5px solid #E1E0F3;border-radius:18px;padding:.95rem 1.1rem;font-family:var(--f-titre);
  box-shadow:var(--mx-ombre-douce);transition:transform .2s var(--mx-ease),border-color .2s}
.mx-motif:hover{transform:translateX(5px);border-color:var(--drap)}
.mx-motif.is-actif{border-color:var(--drap);background:var(--mx-indigo-clair)}
.mx-motif-ico{width:44px;height:44px;flex:0 0 auto;border-radius:13px;display:grid;place-items:center;background:var(--mx-indigo-clair);color:var(--drap)}
.mx-motif.is-actif .mx-motif-ico{background:var(--drap);color:#fff}
.mx-motif-ico .mx-ico{width:22px;height:22px}
.mx-motif b{display:block;font-size:17px;color:var(--ebene)}
.mx-motif small{display:block;font-size:14px;color:var(--encre-douce);margin-top:.1rem}
.mx-contact-mail{display:flex;align-items:center;gap:.6rem;margin-top:1.4rem!important;font-family:var(--f-titre);font-size:16px;color:var(--encre-douce)}
.mx-contact-mail .mx-ico{width:22px;height:22px;color:var(--drap)}
.mx-contact-mail a{color:var(--drap);font-weight:700}
.mx-contact-lead{margin-top:.8rem!important;font-family:var(--f-titre);font-size:15px;color:var(--encre-douce)}
.mx-contact-lead a{color:var(--drap);font-weight:700;display:inline-flex;align-items:center;gap:.3rem}
.mx-contact-carte{background:#fff;border-radius:28px;padding:2rem;border:1px solid #E6E5F5;box-shadow:0 30px 60px -30px rgba(23,21,59,.45);position:relative}
.mx-contact-carte::before{content:"";position:absolute;inset:14px -12px -12px 14px;border-radius:28px;background:var(--laiton);opacity:.3;z-index:-1}
.mx-contact-carte-titre{font-family:var(--f-titre);font-weight:800;font-size:22px;color:var(--ebene);margin-bottom:1rem!important}
.mx-contact-carte .mp-champ{margin-bottom:.9rem}
.mx-contact-carte .mp-champ label{display:block;font-family:var(--f-titre);font-weight:700;font-size:14px;letter-spacing:0;text-transform:none;color:var(--ebene);margin-bottom:.35rem}
.mx-contact-carte input,.mx-contact-carte textarea{width:100%;font-family:var(--f-titre);font-size:16px;padding:.8rem 1rem;border:1.5px solid #DCDBF1;border-radius:14px;background:#FBFBFE;color:var(--ebene);transition:border-color .2s,box-shadow .2s}
.mx-contact-carte textarea{min-height:130px;resize:vertical}
.mx-contact-carte input:focus,.mx-contact-carte textarea:focus{outline:none;border-color:var(--drap);box-shadow:0 0 0 4px var(--mx-indigo-clair);background:#fff}
.mx-contact-carte .mp-lutrin-bouton{background:var(--laiton);color:var(--ebene);font-family:var(--f-titre);font-weight:800;font-size:17px;border-radius:99px;padding:.95rem;border:0;margin-top:.4rem}
.mx-contact-carte .mp-lutrin-bouton:hover{background:#FFC857}
.mx-contact-rgpd{display:flex;align-items:center;gap:.4rem;font-family:var(--f-titre);font-size:13px;color:var(--encre-douce);margin-top:.9rem!important}
.mx-contact-rgpd .mx-ico{color:var(--verifie)}
.mx-contact-rgpd a{color:var(--drap);text-decoration:underline}
@media (max-width:960px){
  .mx-contact{padding-block:1.8rem 3rem}
  .mx-contact-in{grid-template-columns:minmax(0,1fr);gap:1.6rem}
  .mx-motifs{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gout) * -1);padding:0 var(--gout) .3rem;margin-top:1.2rem}
  .mx-motif{flex:0 0 auto;width:auto;padding:.6rem .8rem}
  .mx-motif small{display:none}
  .mx-motif-ico{width:34px;height:34px}
  .mx-motif b{font-size:15px}
  .mx-contact-carte{padding:1.3rem;border-radius:22px}
  .mx-contact-carte::before{display:none}
  .mx-contact-carte textarea{min-height:100px}
  .mx-contact-mail,.mx-contact-lead{font-size:14.5px}
}

/* ==========================================================================
   PAGES LÉGALES (R27) + FICHE AUTEUR
   ========================================================================== */
.mx-legal-tete{padding-block:2.6rem 2rem;background:linear-gradient(180deg,#fff,var(--feutre))}
.mx-legal-tete h1{font-size:clamp(32px,4vw,50px);letter-spacing:-.02em;margin:.4rem 0 .8rem;color:var(--ebene)}
.mx-legal{display:grid;grid-template-columns:260px minmax(0,1fr);gap:3rem;align-items:start;padding-block:2.4rem 4rem}
.mx-legal-som{position:sticky;top:130px;background:#fff;border:1px solid #E6E5F5;border-radius:20px;padding:1.2rem 1.3rem;box-shadow:var(--mx-ombre-douce)}
.mx-legal-som p{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--drap);margin-bottom:.6rem}
.mx-legal-som ol{list-style:none;margin:0;padding:0;counter-reset:s}
.mx-legal-som li{counter-increment:s}
.mx-legal-som a{display:flex;gap:.5rem;padding:.35rem 0;font-family:var(--f-titre);font-size:14.5px;color:var(--ebene);line-height:1.35}
.mx-legal-som a::before{content:counter(s,decimal-leading-zero);font-family:var(--f-mono);font-size:11.5px;color:var(--laiton-sombre);padding-top:.15rem}
.mx-legal-som a:hover{color:var(--drap);text-decoration:none}
.mx-legal-corps{max-width:760px}
.mx-legal-corps h2{scroll-margin-top:130px}
.mx-legal-corps a{color:var(--drap);text-decoration:underline}
@media (max-width:960px){ .mx-legal{grid-template-columns:minmax(0,1fr);gap:1.4rem;padding-top:1.4rem} .mx-legal-som{position:static} }
.mx-auteur-tete{padding-block:3rem 2.4rem;background:radial-gradient(700px 420px at 90% 0%,#E9E7FF 0%,transparent 60%),linear-gradient(180deg,#fff,var(--feutre))}
.mx-auteur-in{display:grid;grid-template-columns:200px minmax(0,1fr);gap:2.4rem;align-items:center}
.mx-auteur-photo img{width:190px;height:190px;border-radius:50%;object-fit:cover;border:8px solid #fff;box-shadow:var(--mx-ombre)}
.mx-auteur-tete h1{font-size:clamp(32px,4vw,50px);letter-spacing:-.02em;margin-top:.4rem;color:var(--ebene)}
@media (max-width:760px){ .mx-auteur-in{grid-template-columns:minmax(0,1fr);gap:1rem} .mx-auteur-photo img{width:130px;height:130px} }
.mx-membre-photo{flex:0 0 auto}
.mx-contact-in > *,.mx-villes-grille > *,.mx-hero-in > *,.mx-onglets > *{min-width:0}

/* ==========================================================================
   ACCORDEUR EN LIGNE (R31)
   ========================================================================== */
.mx-acc-hero{padding-block:2.6rem 4rem;color:#fff;text-align:center;
  background:radial-gradient(700px 420px at 50% 0%,#4F46E5 0%,transparent 70%),var(--ebene)}
.mx-acc-hero .mx-ariane{justify-content:center;color:#C9C8EA}.mx-acc-hero .mx-ariane a{color:#fff}
.mx-acc-hero h1{font-size:clamp(34px,4.4vw,56px);letter-spacing:-.02em;margin-top:.5rem;color:#fff}
.mx-acc-chapo{font-size:19px;color:#DAD8FF;max-width:44em;margin:1rem auto 0}
.mx-acc{max-width:620px;margin:2.2rem auto 0;background:#fff;color:var(--ebene);border-radius:32px;padding:1.8rem 1.6rem 1.5rem;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.mx-acc-presets{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem}
.mx-acc-preset{font-family:var(--f-titre);font-weight:700;font-size:14.5px;padding:.5rem 1rem;border-radius:99px;border:1.5px solid #E1E0F3;background:#fff;color:var(--ebene);transition:all .2s}
.mx-acc-preset:hover{border-color:var(--drap);color:var(--drap)}
.mx-acc-preset.is-actif{background:var(--drap);border-color:var(--drap);color:#fff}
.mx-acc-cadran{position:relative;margin:1.4rem auto .6rem;max-width:420px}
.mx-acc-arc{width:100%;display:block}
.mx-acc-aiguille{position:absolute;left:50%;bottom:calc(20 / 170 * 100%);width:4px;height:calc(112 / 170 * 100%);margin-left:-2px;border-radius:4px;background:var(--ebene);
  transform-origin:50% 100%;transform:rotate(-80deg);transition:transform .18s ease-out}
.mx-acc:not(.is-son) .mx-acc-aiguille{transform:rotate(0)!important;opacity:.25}
.mx-acc-pivot{position:absolute;left:50%;bottom:calc(20 / 170 * 100% - 9px);width:18px;height:18px;margin-left:-9px;border-radius:50%;background:var(--ebene);border:4px solid #fff;box-shadow:0 0 0 2px var(--ebene)}
.mx-acc-note{display:flex;align-items:baseline;justify-content:center;gap:.25rem;margin-top:.6rem;font-family:var(--f-titre)}
.mx-acc-note b{font-size:64px;font-weight:900;line-height:1;color:var(--ebene);transition:color .2s}
.mx-acc-note sub{font-size:20px;font-weight:700;color:var(--encre-douce)}
.mx-acc-note small{font-size:18px;font-weight:700;color:var(--drap);margin-left:.4rem}
.mx-acc.is-juste .mx-acc-note b{color:#1E9E5A}
.mx-acc.is-juste .mx-acc-cadran::after{content:"";position:absolute;inset:-10px;border-radius:30px;box-shadow:0 0 0 3px rgba(52,199,123,.35);animation:mx-pouls-vert 1.2s infinite}
@keyframes mx-pouls-vert{0%,100%{opacity:1}50%{opacity:.3}}
.mx-acc-mesures{display:flex;justify-content:center;gap:1.2rem;font-family:var(--f-mono);font-size:13.5px;color:var(--encre-douce);margin-top:.4rem}
.mx-acc-conseil{font-family:var(--f-titre);font-weight:700;font-size:16px;color:var(--ebene);text-align:center;margin-top:.7rem!important;min-height:1.5em}
.mx-acc-cordes{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:1rem 0 1.2rem}
.mx-acc-cordes[hidden]{display:none}
.mx-corde{display:flex;flex-direction:column;align-items:center;min-width:64px;padding:.5rem .6rem;border-radius:16px;border:1.5px solid #E1E0F3;background:#FBFBFE;font-family:var(--f-titre);color:var(--ebene);transition:all .2s}
.mx-corde span{font-size:11px;color:var(--encre-douce)}
.mx-corde b{font-size:18px}
.mx-corde small{font-family:var(--f-mono);font-size:11px;color:var(--drap)}
.mx-corde:hover{border-color:var(--drap);transform:translateY(-2px)}
.mx-corde.is-cible{background:var(--drap);border-color:var(--drap);color:#fff}
.mx-corde.is-cible span,.mx-corde.is-cible small{color:#DAD8FF}
.mx-acc-bouton{width:100%;justify-content:center;font-size:17px}
.mx-acc.is-actif .mx-acc-bouton{background:var(--ebene);color:#fff}
.mx-acc-etat{font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce);text-align:center;margin-top:.8rem!important}
.mx-acc-la{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-top:.8rem;font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce)}
.mx-acc-la input{accent-color:var(--drap);width:140px}
.mx-acc-guide{max-width:760px}
@media (max-width:600px){ .mx-acc{padding:1.3rem 1rem;border-radius:24px} .mx-acc-note b{font-size:52px} .mx-corde{min-width:54px} }
@media (prefers-reduced-motion:reduce){ .mx-acc-aiguille{transition:none} .mx-acc.is-juste .mx-acc-cadran::after{animation:none} }
.mx-acc-jauge{position:relative;aspect-ratio:300/170}

/* ==========================================================================
   PAGE VILLE — héros et repères (R18, R19)
   ========================================================================== */
.mp-vhero2{background:radial-gradient(700px 420px at 85% 20%,#E9E7FF 0%,transparent 62%),linear-gradient(180deg,#fff,var(--feutre))!important;border-radius:0!important}
.mp-vhero2::before{display:none!important}
.mp-vhero2 h1{font-size:clamp(32px,3.6vw,48px)}
.mp-vhero2-chapo{font-style:normal;font-size:18px}
.mp-vhero2 .mp-lutrin{border-top:0;border:1px solid #E6E5F5}
.mp-vhero2-capsules{height:440px}
.mp-capsule-photo--1{width:min(400px,100%);height:440px;border-radius:200px 200px 40px 200px;border:8px solid #fff;box-shadow:0 30px 60px -26px rgba(23,21,59,.55);position:relative}
.mp-vhero2-capsules::before{content:"";position:absolute;width:200px;height:200px;right:4%;bottom:-10px;border-radius:50%;background:var(--laiton);opacity:.35;filter:blur(2px)}
@media (max-width:1024px){ .mp-vhero2-capsules{height:260px} .mp-capsule-photo--1{height:260px;width:100%;border-radius:32px} }
.mx-ville-reperes{padding-block:4rem;background:#fff}
.mx-ville-reperes-in{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:3rem;align-items:center}
.mx-ville-reperes-in--seul{grid-template-columns:minmax(0,1fr)}
.mx-ville-carte{position:relative;background:linear-gradient(160deg,#FBFBFF,#EEEDFC);border:1px solid #E1E0F3;border-radius:28px;padding:2rem;box-shadow:var(--mx-ombre);display:flex;flex-direction:column;align-items:center}
.mx-ville-carte > svg{width:100%;max-width:320px;height:auto;overflow:visible}
.mx-ville-carte > svg path{fill:#fff;stroke:var(--drap);stroke-width:1.6}
.mx-ville-carte > svg circle{fill:var(--laiton);stroke:var(--ebene);stroke-width:1.2;transform-box:fill-box;transform-origin:center;animation:mx-flotte 3s ease-in-out infinite}
.mx-ville-carte > svg rect{fill:var(--ebene)}
.mx-ville-carte .mp-departement-nom{font-family:var(--f-titre);font-weight:800;font-size:22px;color:var(--ebene);margin-top:.6rem}
.mx-ville-carte-legende{display:flex;align-items:center;gap:.4rem;font-family:var(--f-titre);font-size:14px;color:var(--encre-douce)}
.mx-ville-carte-legende .mx-ico{color:var(--drap)}
.mx-ville-infos h2{font-size:clamp(26px,2.8vw,36px);line-height:1.15;margin:.5rem 0 1.4rem;color:var(--ebene)}
.mx-ville-chiffres{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:0 0 1.3rem;padding:0;list-style:none}
.mx-ville-chiffres li{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.8rem;align-items:center;background:#fff;border:1px solid #E6E5F5;border-radius:18px;padding:.9rem 1rem;box-shadow:var(--mx-ombre-douce)}
.mx-ville-chiffres .mx-info-ico{grid-row:span 2}
.mx-ville-chiffres b{font-family:var(--f-titre);font-weight:900;font-size:26px;line-height:1.05;color:var(--drap)}
.mx-ville-chiffres small{font-family:var(--f-titre);font-size:13.5px;color:var(--encre-douce)}
.mx-ville-instrus{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.5rem}
.mx-ville-instrus a{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--f-titre);font-weight:600;font-size:14px;padding:.4rem .85rem;border-radius:99px;background:var(--mx-indigo-clair);color:var(--ebene);transition:all .2s}
.mx-ville-instrus a:hover{background:var(--drap);color:#fff;text-decoration:none}
.mx-ville-instrus .mx-tempo-note{width:7px;height:14px;color:var(--drap)}
.mx-ville-instrus a:hover .mx-tempo-note{color:var(--laiton)}
@media (max-width:960px){ .mx-ville-reperes{padding-block:2.6rem} .mx-ville-reperes-in{grid-template-columns:minmax(0,1fr);gap:1.6rem} .mx-ville-carte > svg{max-width:220px} }
.mx-ville-carte-legende .mx-ico{width:18px;height:18px}
.mx-logo-mot--pied{color:#fff}.mx-logo-mot--pied span{color:var(--laiton)}