/* =====================================================================
   Alexo — couche « moderne » : en-tête flottant, rideau de transition,
   cartes lumineuses, chiffres animés, cartes empilées, texte qui
   s'illumine au défilement, grand logo de pied de page, curseur.
   Tout ce qui bouge est coupé par le bouton pause (.motion-off).
   ===================================================================== */
:root{--fx-violet:#7131dd;--fx-pink:#bb2edb;--fx-night:#10052b;--fx-ease:cubic-bezier(.16,1,.3,1)}

/* ---------- En-tête flottant en verre dépoli ---------- */
header{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:12px 16px 0;pointer-events:none;transition:transform .5s var(--fx-ease)}
header .nav{pointer-events:auto;position:relative;max-width:1400px;margin:0 auto;padding:10px 12px 10px 26px!important;border-radius:22px;background:#fff;-webkit-backdrop-filter:blur(18px) saturate(1.7);backdrop-filter:blur(18px) saturate(1.7);border:1px solid #ffffffb3;box-shadow:0 10px 40px #2a0d5e14,inset 0 1px 0 #fff;transition:box-shadow .4s,background .4s,padding .4s}
body.scrolled header .nav{background:#fff;box-shadow:0 14px 50px #2a0d5e26,inset 0 1px 0 #fff}
header .nav>.btn{border-radius:16px}
body.fx-header-hidden:not(.motion-off) header{transform:translateY(-130%)}
@media(max-width:650px){
  header{padding:8px 10px 0}
  header .nav{padding:8px 10px 8px 16px!important;border-radius:18px}
  header .nav .links{top:calc(100% + 8px)!important;left:0!important;right:0!important;border-radius:18px;border:1px solid #ece3f7!important;background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:0 24px 50px #10052b40!important}
  body:not(.motion-off) header .nav .links.open{animation:fx-menu-in .45s var(--fx-ease) both}
  body:not(.motion-off) header .nav .links.open a{animation:fx-menu-item .5s var(--fx-ease) both}
  header .nav .links.open a:nth-child(2){animation-delay:.05s}
  header .nav .links.open a:nth-child(3){animation-delay:.1s}
  header .nav .links.open a:nth-child(4){animation-delay:.15s}
}
@keyframes fx-menu-in{from{opacity:0;transform:translateY(-12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes fx-menu-item{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}
.page-progress{top:0;height:3px;border-radius:0 3px 3px 0}

/* ---------- Rideau de transition entre les pages ---------- */
.fx-curtain{position:fixed;inset:0;z-index:200;pointer-events:none;background:linear-gradient(135deg,#10052b 0%,#43109a 55%,#7131dd 100%);display:grid;place-items:center;transform:translateY(100%)}
.fx-curtain__logo{font-family:Manrope,sans-serif;font-size:clamp(56px,10vw,120px);font-weight:600;letter-spacing:-.06em;color:#fff;overflow:hidden;line-height:1.1}
.fx-curtain__logo span{display:inline-block}
.fx-curtain__logo i{font-style:normal;color:#ef95ff}
.fx-curtain.fx-intro{transform:none}
.fx-curtain.fx-intro .fx-curtain__logo span{animation:fx-logo-up .8s var(--fx-ease) both}
.fx-curtain.fx-intro.fx-out{transform:translateY(-100%);transition:transform .9s var(--fx-ease) .15s}
.fx-curtain.fx-cover{transform:none;transition:transform .55s var(--fx-ease)}
.fx-curtain.fx-cover .fx-curtain__logo{opacity:0}
@keyframes fx-logo-up{from{transform:translateY(110%)}to{transform:none}}

/* ---------- Héros : aurore lumineuse + grille de points ---------- */
.fx-aurora{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.fx-aurora i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;mix-blend-mode:screen}
.fx-aurora i:nth-child(1){width:46vw;height:46vw;left:-10vw;top:-20vw;background:#7131dd}
.fx-aurora i:nth-child(2){width:38vw;height:38vw;right:-8vw;top:10%;background:#bb2edb;opacity:.4}
.fx-aurora i:nth-child(3){width:30vw;height:30vw;left:35%;bottom:-18vw;background:#3b5bff;opacity:.3}
body:not(.motion-off) .fx-aurora i:nth-child(1){animation:fx-aur-a 16s ease-in-out infinite alternate}
body:not(.motion-off) .fx-aurora i:nth-child(2){animation:fx-aur-b 19s ease-in-out infinite alternate}
body:not(.motion-off) .fx-aurora i:nth-child(3){animation:fx-aur-a 22s ease-in-out infinite alternate-reverse}
@keyframes fx-aur-a{to{transform:translate(18vw,12vw) scale(1.25)}}
@keyframes fx-aur-b{to{transform:translate(-16vw,14vw) scale(.8)}}
.fx-dots{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(#ffffff2e 1px,transparent 1.2px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 20%,transparent 75%)}
.fx-dots.fx-dots--light{background-image:radial-gradient(#7131dd30 1px,transparent 1.2px)}
body:not(.motion-off) .fx-dots{animation:fx-dots-move 30s linear infinite}
@keyframes fx-dots-move{to{background-position:260px 260px}}

/* ---------- Cartes lumineuses : reflet doux qui suit la souris ---------- */
.fx-spot{position:relative;isolation:isolate}
.fx-spot::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;opacity:0;transition:opacity .4s;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),#bb2edb1f,transparent 45%);}
.fx-spot:hover::after{opacity:1}
@property --fx-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes fx-spin-angle{to{--fx-angle:360deg}}

/* ---------- Bandeau de chiffres ---------- */
.fx-stats{position:relative;padding:34px 0 10px}
.fx-stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fx-stat{position:relative;padding:30px 28px 28px;border-radius:24px;background:#fff;border:1px solid #ece3f7;overflow:hidden}
.fx-stat::before{content:'';position:absolute;width:160px;height:160px;right:-60px;top:-60px;border-radius:50%;background:radial-gradient(circle,#bb2edb2e,transparent 70%)}
.fx-stat strong{display:block;font-family:Manrope,sans-serif;font-size:clamp(46px,5vw,68px);font-weight:600;letter-spacing:-.05em;line-height:1;background:linear-gradient(100deg,#43109a,#7131dd 45%,#bb2edb);-webkit-background-clip:text;background-clip:text;color:transparent}
.fx-stat span{display:block;margin-top:12px;font-size:16px;line-height:1.5;color:#696581}
@media(max-width:950px){.fx-stats__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.fx-stat{padding:22px 18px}.fx-stat span{font-size:14.5px}}

/* ---------- Section méthode : cartes qui s'empilent au défilement ---------- */
@media(min-width:951px){
  body:not(.motion-off) .method-panel{position:sticky;top:130px;box-shadow:0 -20px 50px #00000040;background:linear-gradient(135deg,#2a1158,#170838)!important}
  body:not(.motion-off) .method-panel:nth-child(2){top:150px}
  body:not(.motion-off) .method-panel:nth-child(3){top:170px}
  body:not(.motion-off) .method-panel.is-current{background:linear-gradient(135deg,#4a1f9a,#24104f)!important}
}

/* ---------- Texte qui s'illumine mot à mot au défilement ---------- */
.fx-scrub .fx-sw{transition:opacity .25s,color .25s}
body:not(.motion-off) .fx-scrub .fx-sw{opacity:.16}
body:not(.motion-off) .fx-scrub .fx-sw.on{opacity:1}

/* ---------- Images dévoilées en volet ---------- */
body:not(.motion-off) .fx-clip{clip-path:inset(100% 0 0 0 round 24px);transition:clip-path 1.3s var(--fx-ease)}
body:not(.motion-off) .fx-clip.fx-in{clip-path:inset(0 0 0 0 round 0)}

/* ---------- Questions fréquentes : icône qui pivote ---------- */
.faq summary:after{transition:transform .4s var(--fx-ease),background .3s,color .3s}
.faq details[open] summary:after{transform:rotate(45deg);background:#7131dd!important;color:#fff!important}
.faq details{transition:background .3s}
.faq details:hover summary{color:#7131dd}

/* ---------- Bloc contact : dégradé vivant ---------- */
.contact{overflow:hidden}
.fx-contact-glow{position:absolute;inset:-40%;z-index:-2;pointer-events:none;background:conic-gradient(from var(--fx-angle,0deg) at 60% 40%,#7131dd,#bb2edb,#43109a,#5b2bd0,#7131dd);filter:blur(40px);opacity:.9}
body:not(.motion-off) .fx-contact-glow{animation:fx-spin-angle 10s linear infinite}

/* ---------- Ligne animée devant les sur-titres ---------- */
.sectionhead .eyebrow::before,.method-sticky .eyebrow::before{content:'';display:inline-block;width:0;height:2px;background:linear-gradient(90deg,#7131dd,#bb2edb);margin-right:0;vertical-align:middle;transition:width .9s var(--fx-ease) .2s,margin .9s var(--fx-ease) .2s}
.fx-in .eyebrow::before,.is-visible .eyebrow::before,body.motion-off .sectionhead .eyebrow::before{width:34px;margin-right:12px}

/* ---------- Grand logo animé dans le pied de page ---------- */
.fx-wordmark{font-family:Manrope,sans-serif;font-weight:600;font-size:clamp(90px,22vw,330px);letter-spacing:-.07em;line-height:.85;text-align:center;margin:50px 0 -0.06em;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}
.fx-wordmark span{display:inline-block;background:linear-gradient(180deg,#ffffff4d 0%,#a77bff26 55%,#ffffff00 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.fx-wordmark span:last-child{background:linear-gradient(180deg,#ef95ff,#bb2edb);-webkit-background-clip:text;background-clip:text}
.fx-wordmark i{font-style:normal}
body:not(.motion-off) .fx-wordmark span{transform:translateY(100%);transition:transform 1.1s var(--fx-ease);transition-delay:calc(var(--i)*60ms)}
body:not(.motion-off) .fx-wordmark.fx-in span{transform:none}
footer{overflow:hidden}

/* ---------- Bouton retour en haut avec anneau de progression ---------- */
.fx-top{position:fixed;right:20px;bottom:18px;z-index:60;width:52px;height:52px;border-radius:50%;border:0;background:#fff;color:#7131dd;display:grid;place-items:center;box-shadow:0 10px 30px #2a0d5e2e;cursor:pointer;opacity:0;transform:translateY(20px) scale(.8);pointer-events:none;transition:opacity .4s,transform .5s var(--fx-ease)}
.fx-top.show{opacity:1;transform:none;pointer-events:auto}
.fx-top:hover{transform:translateY(-4px)}
.fx-top>svg{position:absolute;inset:0;transform:rotate(-90deg)}
.fx-top circle{fill:none;stroke:#7131dd;stroke-width:3;stroke-linecap:round}
.fx-top circle.bg{stroke:#ece3f7}
.fx-top b{font-size:20px;line-height:1;font-weight:500}
@media(max-width:650px){.fx-top{right:12px;bottom:12px;width:46px;height:46px}}

/* ---------- Curseur animé (souris uniquement) ---------- */
.fx-cursor,.fx-cursor-dot{position:fixed;left:0;top:0;z-index:300;pointer-events:none;border-radius:50%;opacity:0;transition:opacity .3s}
.fx-cursor{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid #7131dd99;transition:opacity .3s,width .35s var(--fx-ease),height .35s var(--fx-ease),margin .35s var(--fx-ease),background .35s,border-color .35s}
.fx-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:#7131dd}
body.fx-cursor-on:not(.motion-off) .fx-cursor,body.fx-cursor-on:not(.motion-off) .fx-cursor-dot{opacity:1}
body.fx-cursor-hover .fx-cursor{width:70px;height:70px;margin:-35px 0 0 -35px;background:#bb2edb1a;border-color:#bb2edb}
body.fx-cursor-dark .fx-cursor{border-color:#ffffffaa}
body.fx-cursor-dark .fx-cursor-dot{background:#fff}

/* ---------- Bandeau défilant : réagit à la vitesse de défilement ---------- */
.marquee{transform:rotate(-1.2deg)!important}
.marquee span{font-weight:600;font-size:16px;-webkit-font-smoothing:antialiased}
.marquee b{font-size:20px}

/* ---------- Couverture pendant le chargement (évite un flash avant le rideau) ---------- */
html.fx-pending::before{content:'';position:fixed;inset:0;z-index:199;background:linear-gradient(135deg,#10052b 0%,#43109a 55%,#7131dd 100%);animation:fx-safety 0s linear 2.5s forwards}
@keyframes fx-safety{to{visibility:hidden;opacity:0}}


/* En-tête posé par-dessus le haut de page (réglé par modern.js) */

/* Le fond du haut de page passe sous la banderole penchée : plus de coin blanc */
.hero-v3{margin-bottom:-30px;padding-bottom:30px}

/* ---------- Lisibilité : plancher de taille pour les petits libellés ---------- */
.eyebrow,.manifesto-kicker{font-size:13px!important}
.service-category{font-size:12px!important;letter-spacing:1.6px}
.scroll-prompt,.hero-bottom span,.hero-page,.manifesto-bottom span{font-size:13px!important}
.method-tags span,.method-label{font-size:13px!important}
/* Sous-menu des pages assurances : défilement horizontal sur mobile */
@media(max-width:750px){
  .product-jump{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .product-jump::-webkit-scrollbar{display:none}
  .product-jump>.wrap{gap:22px!important}
  .product-jump a{white-space:nowrap;flex:0 0 auto}
}

/* ---------- Bas de page : mentions + crédit ALGORIUM ---------- */
footer .footbottom{align-items:center}
footer .footbottom .fx-legal a{color:inherit}
footer .footbottom .fx-legal a:hover{color:#fff}
.fx-credit{display:inline-flex;align-items:baseline;gap:7px;color:#8f86ab;text-decoration:none;transition:color .3s}
.fx-credit span{font-size:12px;font-weight:300;letter-spacing:.02em}
.fx-credit__logo{font-family:Manrope,sans-serif;font-weight:400;font-size:11.5px;letter-spacing:.32em;color:#d9d3ea;transition:color .3s}
.fx-credit__logo img{height:18px;width:auto;display:block;opacity:.8;transition:opacity .3s}
.fx-credit{align-items:center}
.fx-credit:hover,.fx-credit:hover .fx-credit__logo{color:#fff}
.fx-credit:hover .fx-credit__logo img{opacity:1}
footer .footbottom{padding-bottom:84px!important}
@media(max-width:650px){footer .footbottom{gap:16px;align-items:center;text-align:center;padding-bottom:96px!important}}

/* ---------- Page 404 ---------- */
.fx-404{min-height:60vh;padding-bottom:120px!important}
.fx-404 h1 em{font-style:normal;color:#7131dd}
.fx-404 .fx-404-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.fx-404 .fx-404-actions a{text-decoration:none}
.fx-404 .btn.outline{background:transparent;color:#7131dd;border:1px solid #7131dd}