/* Animations supplémentaires MEPEA (hors kit). transform/opacity uniquement. */
:root{--xr-ease:cubic-bezier(.22,1,.36,1)}
/* 1. Apparitions au défilement (le contenu reste visible sans script) */
html.xr-js main > section:not(.hero):not(#methode-solo) :is(.section-head,.t-lead,.rows > li,.card,.panel,.field,.btn-row):not(.xr-done){
  opacity:0;transform:translateY(28px);
  transition:opacity .9s var(--xr-ease) var(--xd,0ms),transform .9s var(--xr-ease) var(--xd,0ms)}
html.xr-js main > section:not(.hero):not(#methode-solo) :is(.section-head,.t-lead,.rows > li,.card,.panel,.field,.btn-row):not(.xr-done).xr-in{opacity:1;transform:none}
html.xr-safe main > section :is(.section-head,.t-lead,.rows > li,.card,.panel,.field,.btn-row){opacity:1!important;transform:none!important}
/* 2. Barre de progression */
.xr-progress{position:fixed;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg,#1d4ed8,#38a0ff);transform:scaleX(0);transform-origin:0 50%;z-index:200;pointer-events:none}
/* 3. Héros : aurore + pastilles flottantes */
.hero{position:relative;overflow:clip}
.hero > .wrap{position:relative;z-index:1}
.xr-aurora{position:absolute;inset:0 0 0 38%;pointer-events:none;z-index:0;will-change:transform}
.xr-aurora i{position:absolute;border-radius:50%;filter:blur(54px);opacity:.55;animation:xr-drift 16s ease-in-out infinite alternate}
.xr-aurora i:nth-child(1){width:46%;aspect-ratio:1;right:6%;top:6%;background:radial-gradient(circle,#38a0ff,transparent 68%)}
.xr-aurora i:nth-child(2){width:38%;aspect-ratio:1;right:34%;top:38%;background:radial-gradient(circle,#1d4ed8,transparent 68%);animation-duration:21s;animation-delay:-6s;opacity:.38}
.xr-aurora i:nth-child(3){width:30%;aspect-ratio:1;right:2%;top:52%;background:radial-gradient(circle,#a9cbff,transparent 68%);animation-duration:18s;animation-delay:-3s;opacity:.7}
@keyframes xr-drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-7%,6%,0) scale(1.08)}100%{transform:translate3d(5%,-6%,0) scale(.95)}}
.xr-pill{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(29,78,216,.16);box-shadow:0 18px 40px -22px rgba(10,27,74,.45);font:500 .95rem/1.2 var(--font-text);color:#0a1b4a;white-space:nowrap;animation:xr-float 7s ease-in-out infinite}
.xr-pill b{font-weight:600;color:#1d4ed8}
.xr-pill img{width:22px;height:22px}
.xr-pills{position:absolute;inset:0 3% 0 60%}
.xr-pill:nth-of-type(1){left:0;top:15%}
.xr-pill:nth-of-type(2){right:0;top:40%;animation-delay:-2.4s}
.xr-pill:nth-of-type(3){left:8%;top:62%;animation-delay:-4.6s}
@keyframes xr-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
/* 4. Bandeau de mots */
.xr-marquee{overflow:hidden;border-block:1px solid rgba(10,27,74,.12);background:var(--surface,#e3edfd);padding:20px 0}
.xr-track{display:flex;width:max-content;animation:xr-marq 42s linear infinite}
.xr-marquee:hover .xr-track{animation-play-state:paused}
.xr-track span{font:italic 400 clamp(1.5rem,3vw,2.2rem)/1 var(--font-display);letter-spacing:-.01em;color:#0a1b4a;padding:0 clamp(18px,2.4vw,34px);display:inline-flex;align-items:center;gap:clamp(18px,2.4vw,34px)}
.xr-track span::after{content:"";width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,#1d4ed8,#38a0ff);flex:none}
@keyframes xr-marq{to{transform:translateX(-50%)}}
/* 5. Icônes qui flottent, lignes qui s'illuminent */
.panel .ic-svg{animation:xr-bob 5s ease-in-out infinite}
.panel .ic-svg:nth-child(2n){animation-delay:-1.2s}.panel .ic-svg:nth-child(3n){animation-delay:-2.4s}.panel .ic-svg:nth-child(5n){animation-delay:-3.4s}
@keyframes xr-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.rows > li{position:relative;isolation:isolate}
.rows > li::before{content:"";position:absolute;inset:0 -14px;border-radius:14px;background:currentColor;opacity:0;z-index:-1;transition:opacity .25s ease}
@media (hover:hover) and (pointer:fine){.rows > li:hover::before{opacity:.06}}
/* 6. Compteurs : chiffres alignés */
[data-count]{font-variant-numeric:tabular-nums}
@media (max-width:1099px){.xr-pills{display:none}}
@media (max-width:900px){.xr-aurora{inset:0 -20% 0 10%;opacity:.8}}
@media (prefers-reduced-motion:reduce){.xr-aurora i,.xr-pill,.xr-track,.panel .ic-svg{animation:none!important}.xr-progress{display:none}}
/* panneau d'icônes aux couleurs MEPEA (bleu pâle, pas de beige) */
.panel{background:#e3edfd!important;border:1px solid #cfdef8!important}
/* Anti-chevauchement : sur grand écran peu haut, une section grandit avec son contenu (comme sur tablette) */
@media (min-width:1280px){
  main > :is(section,.section):not(.hero,.section--hero), footer.closing{height:auto;min-height:calc(var(--h,1)*100vh);min-height:calc(var(--h,1)*100svh)}
  :where(main > :is(section,.section):not(.hero,.section--hero), footer.closing){display:flex;flex-direction:column}
  main > :is(section,.section):not(.hero,.section--hero) > :is(.wrap,.container), footer.closing > .wrap{flex:1 0 auto;height:auto;min-height:0}
}
/* hero : le héros grandit aussi si le contenu dépasse l'écran */
.hero{height:auto;min-height:100svh}
.hero > .wrap > .hero-text{min-height:calc(100svh - var(--nav, 68px));gap:var(--s-6)}
/* respirations */
#methode-solo .t-label{display:block;margin-bottom:var(--s-5)}
.rows__name .link{display:inline-block;margin-bottom:6px}
.t-stat,.plan__price{font-variant-numeric:tabular-nums}
.xr-pills{inset:0 9% 0 58%}
/* héros : grandit avec son contenu (les faits ne sont plus coupés sur écran peu haut) */
.hero{height:auto!important;min-height:100svh;overflow:visible;overflow-x:clip}
.hero > .wrap{height:auto!important;min-height:calc(100svh - 160px)}
.hero > .wrap > .hero-text{height:auto!important;min-height:calc(100svh - 160px)}