/* Maskan : habillage « nuit digitale / sable » de tout le site.
   Se charge après maskan.css et wizard.css : il en reprend les variables et redessine l'en-tête, les boutons,
   les sections et les animations. Respecte prefers-reduced-motion. */
:root{
  --nuit:#0F1431; --nuit-2:#141B45; --nuit-3:#1B2559;
  --maj-clair:#8E9CFF; --dore:#E8CFA0; --dore-2:#F3DDB0;
  --verre:rgba(255,255,255,.06); --verre-b:rgba(255,255,255,.14);
  --t-clair:rgba(245,244,239,.78);
  --ease:cubic-bezier(.2,.8,.2,1);
}
html{scroll-padding-top:84px}
html,body{overflow-x:clip}
body{background:var(--sable)}
::selection{background:var(--maj);color:#fff}

/* ---------- Barre de progression et lueur du curseur ---------- */
.sp{position:fixed;inset:0 0 auto 0;height:3px;z-index:60;transform-origin:0 50%;transform:scaleX(var(--sp,0));background:linear-gradient(90deg,var(--maj),var(--maj-clair),var(--dore));pointer-events:none}
.glow{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;opacity:0;transition:opacity .4s;background:radial-gradient(closest-side,rgba(142,156,255,.20),transparent);mix-blend-mode:screen;will-change:transform}
body.has-glow .glow{opacity:1}
@media (hover:none){.glow{display:none}}

/* ---------- En-tête ---------- */
header.top{position:fixed;inset:0 0 auto 0;background:transparent;border-bottom:1px solid transparent;backdrop-filter:none;transition:background .35s,border-color .35s,backdrop-filter .35s,transform .45s var(--ease)}
header.top.solid{background:color-mix(in srgb,var(--sable) 86%,transparent);backdrop-filter:saturate(1.4) blur(14px);border-bottom-color:var(--line)}
header.top.on-dark.solid{background:color-mix(in srgb,var(--nuit) 78%,transparent);border-bottom-color:rgba(255,255,255,.08)}
header.top.hide{transform:translateY(-100%)}
header.top.on-dark .logo,header.top.on-dark .nav ul a,header.top.on-dark .nav .login{color:#F5F4EF}
header.top.on-dark .nav ul a,header.top.on-dark .nav .login{opacity:.78}
header.top.on-dark .nav ul a:hover,header.top.on-dark .nav .login:hover{opacity:1;color:#fff}
header.top.on-dark .logo .ar{color:var(--dore);border-inline-start-color:rgba(255,255,255,.22)}
header.top.on-dark .btn-primary{background:linear-gradient(135deg,var(--maj),#5A6BF0);color:#fff}
header.top.on-dark .menu-btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff}
header.top.on-dark .lang{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18)}
header.top.on-dark .lang button{color:rgba(255,255,255,.7)}
header.top.on-dark .lang button[aria-pressed="true"]{background:#F5F4EF;color:var(--nuit)}
.logo svg{transition:transform .8s var(--ease)}
.logo:hover svg{transform:rotate(45deg)}
.mmenu:not([hidden]){background:var(--sable)}
body.has-hero main{padding-top:0}

/* ---------- Boutons ---------- */
.btn{position:relative;transition:transform .25s var(--ease),box-shadow .25s,background .2s,border-color .2s,color .2s;will-change:transform}
.btn-primary{background:linear-gradient(135deg,var(--atl),#27396E);box-shadow:0 10px 24px -12px rgba(26,43,86,.7)}
.btn-primary:hover{background:linear-gradient(135deg,#243a70,var(--maj));box-shadow:0 16px 34px -14px rgba(53,72,200,.8)}
.btn-ghost:hover{background:var(--atl);color:#fff}
.btn .ico{transition:transform .25s var(--ease)}
.btn:hover .ico{transform:translateX(4px)}
.dark .btn-primary,.btn-light{background:#F5F4EF;color:var(--nuit);box-shadow:0 14px 34px -14px rgba(0,0,0,.6)}
.dark .btn-primary:hover,.btn-light:hover{background:#fff;color:var(--nuit);box-shadow:0 18px 40px -12px rgba(142,156,255,.55)}
.dark .btn-ghost{border-color:rgba(255,255,255,.3);color:#F5F4EF}
.dark .btn-ghost:hover{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.55)}
.btn-glow{background:linear-gradient(135deg,var(--maj),#6B7BFF)!important;color:#fff!important;box-shadow:0 0 0 1px rgba(255,255,255,.2) inset,0 14px 40px -10px rgba(53,72,200,.9)!important}
.btn-glow:hover{box-shadow:0 0 0 1px rgba(255,255,255,.4) inset,0 18px 50px -8px rgba(107,123,255,1)!important}

/* ---------- Révélation au défilement ---------- */
[data-r]{opacity:0;transition:opacity .9s var(--ease) var(--d,0s),transform .9s var(--ease) var(--d,0s),filter .9s var(--ease) var(--d,0s);will-change:opacity,transform}
[data-r="up"]{transform:translateY(38px)}
[data-r="down"]{transform:translateY(-30px)}
[data-r="left"]{transform:translateX(-46px)}
[data-r="right"]{transform:translateX(46px)}
[data-r="zoom"]{transform:scale(.9)}
[data-r="blur"]{filter:blur(14px);transform:translateY(20px)}
[data-r].in{opacity:1;transform:none;filter:none}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.split .w>i{display:inline-block;font-style:normal;transform:translateY(110%);transition:transform 1s var(--ease);transition-delay:calc(var(--i,0)*45ms + var(--d,0s))}
.split.in .w>i{transform:none}

/* ---------- Sections en feuilles qui se superposent ---------- */
.sec{position:relative;padding-block:clamp(84px,11vw,150px);border-radius:44px 44px 0 0;margin-top:-44px;overflow-x:clip}
.sec.dark{background:var(--nuit);color:#F5F4EF}
.sec.light{background:var(--sable);color:var(--ink)}
.sec.light-2{background:var(--sable-2);color:var(--ink)}
.sec .wrap{position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 12.5px/1 var(--f-texte);letter-spacing:.14em;text-transform:uppercase;color:var(--maj);padding:8px 14px;border-radius:99px;background:var(--maj-doux)}
.dark .eyebrow{color:var(--dore);background:rgba(232,207,160,.10);box-shadow:0 0 0 1px rgba(232,207,160,.25) inset}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:ping 2.2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 55%,transparent)}80%,100%{box-shadow:0 0 0 12px transparent}}
.h2{font-size:clamp(34px,5vw,64px);line-height:1.02;letter-spacing:-.03em;margin-top:20px}
.dark .h2{color:#fff}
.h2 em{font-style:normal;--g:linear-gradient(100deg,var(--maj),#7A5AF0 60%,var(--ocre));background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
.dark .h2 em{--g:linear-gradient(100deg,var(--maj-clair),var(--dore))}
.split em{background:none}
.split em .w>i{background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent;padding-inline:.02em}
.sub{font-size:clamp(17px,1.5vw,20px);color:var(--ink-2);max-width:58ch;margin-top:20px}
.dark .sub{color:var(--t-clair)}
.sec-head{max-width:880px}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head.center .sub{margin-inline:auto}

/* ---------- 1. Hero ---------- */
.hx{position:relative;min-height:100svh;display:flex;align-items:center;padding-block:130px 90px;background:var(--nuit);color:#F5F4EF;overflow:hidden;isolation:isolate}
.hx::before{content:"";position:absolute;inset:-20%;z-index:-3;background:
  radial-gradient(60% 50% at 78% 38%,rgba(53,72,200,.55),transparent 70%),
  radial-gradient(40% 40% at 12% 85%,rgba(196,124,10,.22),transparent 70%),
  radial-gradient(50% 45% at 50% 0%,rgba(142,156,255,.18),transparent 70%)}
.zel{position:absolute;inset:-10%;z-index:-2;opacity:.9;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg fill='none' stroke='%238E9CFF' stroke-opacity='.13' stroke-width='1.2'%3E%3Cpath d='M60 8 L72.5 30 L97 24 L90 48.5 L112 60 L90 71.5 L97 96 L72.5 90 L60 112 L47.5 90 L23 96 L30 71.5 L8 60 L30 48.5 L23 24 L47.5 30Z'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:radial-gradient(70% 70% at 70% 45%,#000,transparent);mask-image:radial-gradient(70% 70% at 70% 45%,#000,transparent);animation:drift 80s linear infinite}
@keyframes drift{to{background-position:240px 120px}}
.aur{position:absolute;border-radius:50%;filter:blur(70px);z-index:-2;opacity:.55;animation:aur 18s ease-in-out infinite alternate}
.aur.a{width:420px;height:420px;background:#3548C8;right:8%;top:10%}
.aur.b{width:340px;height:340px;background:#C47C0A;opacity:.28;left:4%;bottom:6%;animation-duration:23s}
.aur.c{width:300px;height:300px;background:#7A5AF0;opacity:.3;left:44%;top:-6%;animation-duration:27s}
@keyframes aur{to{transform:translate3d(60px,40px,0) scale(1.15)}}
.hx-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:30px;align-items:center;width:100%}
.hx h1{font-size:clamp(40px,6.1vw,88px);line-height:.98;letter-spacing:-.04em;color:#fff;margin-top:26px}
.hx h1 em{font-style:normal;--g:linear-gradient(100deg,var(--maj-clair) 10%,#C9B8FF 50%,var(--dore));background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
.hx .lead{font-size:clamp(18px,1.6vw,21.5px);color:var(--t-clair);max-width:52ch;margin-top:26px}
.hx .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.hx .btn{padding:1.05em 1.5em;font-size:16.5px}
.trust{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:46px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12)}
.trust div{display:flex;align-items:baseline;gap:10px}
.trust b{font:700 clamp(30px,3vw,42px)/1 var(--f-titre);color:#fff;letter-spacing:-.03em}
.trust span{font-size:13.5px;line-height:1.3;color:var(--t-clair);max-width:15ch}
.live{display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 12px;border-radius:99px;background:rgba(255,255,255,.07);box-shadow:0 0 0 1px rgba(255,255,255,.14) inset;font-size:14px;color:#F5F4EF;backdrop-filter:blur(8px)}
.live i{width:8px;height:8px;border-radius:50%;background:#4ADE9B;box-shadow:0 0 0 0 rgba(74,222,155,.6);animation:ping 2s infinite;color:#4ADE9B}
.cue{position:absolute;inset-inline:0;bottom:26px;display:flex;justify-content:center;pointer-events:none}
.cue span{display:block;width:26px;height:42px;border-radius:99px;border:1.5px solid rgba(255,255,255,.4);position:relative}
.cue span::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:4px;background:#fff;animation:cue 1.8s infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(16px)}}

/* Orbite (utilisée dans le hero et dans la section des plateformes) */
.hub{position:relative;width:min(600px,100%);aspect-ratio:1;margin-inline:auto;transform:translate3d(calc(var(--mx,0)*14px),calc(var(--my,0)*14px),0);transition:transform .25s ease-out}
.ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px dashed rgba(255,255,255,.2);transform:translate(-50%,-50%)}
.orbit{position:absolute;inset:0;animation:spin var(--spd,70s) linear infinite;animation-direction:var(--dir,normal)}
.slot{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a)) translateX(var(--r)) rotate(calc(-1*var(--a)))}
.otile{position:absolute;left:0;top:0;display:grid;place-items:center;min-width:92px;height:56px;padding:8px 14px;margin:-28px 0 0 -46px;border-radius:16px;background:#fff;color:var(--ink);box-shadow:0 14px 34px -10px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.7) inset;font:700 14px/1 var(--f-titre);white-space:nowrap;animation:spin var(--spd,70s) linear infinite;animation-direction:var(--rev,reverse)}
.otile img{display:block;max-height:30px;max-width:92px;width:auto;height:auto;object-fit:contain}
.otile.ico-t{display:flex;gap:8px;align-items:center;justify-content:center}
.otile.ico-t img{width:28px;height:28px}
.otile.soon{background:rgba(255,255,255,.1);color:rgba(255,255,255,.85);box-shadow:0 0 0 1px rgba(255,255,255,.25) inset;backdrop-filter:blur(6px)}
.otile.off{background:rgba(255,255,255,.92)}
.otile .ok{position:absolute;right:-7px;top:-7px;width:20px;height:20px;border-radius:50%;background:#1AAE78;color:#fff;display:grid;place-items:center;box-shadow:0 0 0 3px var(--nuit)}
.otile .ok svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@keyframes spin{to{transform:rotate(360deg)}}
.ray{position:absolute;left:50%;top:50%;height:2px;width:var(--r);transform-origin:0 50%;transform:rotate(var(--a));background:linear-gradient(90deg,rgba(142,156,255,.5),rgba(142,156,255,0));opacity:.55}
.ray::after{content:"";position:absolute;left:0;top:-2px;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 12px 3px rgba(142,156,255,.95);animation:pulse 3.6s var(--ease) infinite;animation-delay:var(--dl,0s)}
@keyframes pulse{0%{transform:translateX(0);opacity:0}12%{opacity:1}85%{opacity:1}100%{transform:translateX(var(--r));opacity:0}}
.core{position:absolute;left:50%;top:50%;width:26%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#4B5CE0,#1A2B56 70%);box-shadow:0 0 0 1px rgba(255,255,255,.3) inset,0 0 60px 6px rgba(53,72,200,.8),0 0 140px 20px rgba(53,72,200,.45)}
.core::before,.core::after{content:"";position:absolute;inset:-14%;border-radius:50%;border:1px solid rgba(142,156,255,.55);animation:wave 3.6s ease-out infinite}
.core::after{animation-delay:1.8s}
@keyframes wave{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.9);opacity:0}}
.core svg{width:64%;height:64%;animation:spin 40s linear infinite}
.core small{position:absolute;bottom:-34px;font:700 13px var(--f-titre);letter-spacing:.2em;color:#fff}
.fcard{position:absolute;display:flex;align-items:center;gap:12px;padding:11px 16px 11px 11px;border-radius:18px;background:rgba(255,255,255,.09);backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 24px 50px -20px rgba(0,0,0,.7);font-size:13.5px;line-height:1.3;color:#fff;opacity:0;animation:fpop 9s ease-in-out infinite;animation-delay:var(--dl,0s);transform:translate3d(calc(var(--mx,0)*var(--px,-26px)),calc(var(--my,0)*var(--px,-26px)),0)}
.fcard img{width:44px;height:44px;border-radius:12px;object-fit:cover}
.fcard b{display:block;font-weight:600}
.fcard small{color:rgba(255,255,255,.7);font-size:12px}
.fcard .tick{margin-inline-start:6px;width:22px;height:22px;border-radius:50%;background:#1AAE78;display:grid;place-items:center;flex:none}
.fcard .tick svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@keyframes fpop{0%{opacity:0;margin-top:20px}8%{opacity:1;margin-top:0}38%{opacity:1;margin-top:0}46%,100%{opacity:0;margin-top:-14px}}

/* ---------- 2. Bandeau des portails ---------- */
.band-logos{position:relative;z-index:3;background:var(--sable);border-radius:44px 44px 0 0;margin-top:-44px;padding-block:54px 110px;overflow:hidden}
.band-logos .lbl{text-align:center;font:600 13px/1.3 var(--f-texte);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-bottom:26px}
.mq{display:flex;overflow:hidden;direction:ltr;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mq+.mq{margin-top:14px}
.mq ul{display:flex;flex:none;gap:14px;padding:0 7px;margin:0;list-style:none;min-width:100%;justify-content:space-around;animation:mq 42s linear infinite}
.mq.rev ul{animation-direction:reverse;animation-duration:55s}
.mq:hover ul{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-100%)}}
.mq li{display:flex;align-items:center;gap:10px;height:64px;padding:0 24px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px -14px rgba(15,20,49,.3);font:700 17px var(--f-titre);color:var(--ink-2);white-space:nowrap}
.mq li img{max-height:30px;max-width:104px;width:auto;height:auto}
.mq li.soon{background:transparent;border-style:dashed;box-shadow:none}
.mq li small{font:600 10.5px var(--f-texte);letter-spacing:.1em;text-transform:uppercase;color:var(--ocre-texte);background:var(--ocre-doux);padding:3px 8px;border-radius:99px}

/* ---------- 3. Récit au défilement ---------- */
.story{position:relative;overflow-x:clip;height:420vh;background:var(--nuit);color:#F5F4EF;border-radius:44px 44px 0 0;margin-top:-44px;z-index:4}
.story .pin{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.story .pin::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 75% 50%,rgba(53,72,200,.4),transparent 70%),radial-gradient(40% 40% at 10% 90%,rgba(196,124,10,.18),transparent 70%)}
.story-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:50px;align-items:center;width:100%;position:relative}
.steps{position:relative;padding-inline-start:44px}
.steps::before{content:"";position:absolute;inset-inline-start:11px;top:6px;bottom:6px;width:2px;background:rgba(255,255,255,.14)}
.steps::after{content:"";position:absolute;inset-inline-start:11px;top:6px;width:2px;height:calc((100% - 12px)*var(--p,0));background:linear-gradient(var(--maj-clair),var(--dore));box-shadow:0 0 14px rgba(142,156,255,.9)}
.step{position:relative;padding-block:18px;opacity:.32;transition:opacity .5s,transform .5s var(--ease);transform:translateX(0)}
.step.on{opacity:1;transform:translateX(8px)}
.step .n{position:absolute;inset-inline-start:-44px;top:20px;width:24px;height:24px;border-radius:50%;background:var(--nuit);border:2px solid rgba(255,255,255,.3);display:grid;place-items:center;font:700 11px var(--f-titre);color:#fff;transition:.4s}
.step.on .n,.step.done .n{background:var(--maj-clair);border-color:var(--maj-clair);color:var(--nuit);box-shadow:0 0 0 6px rgba(142,156,255,.2)}
.step.done{opacity:.6}
.step h3{font-size:clamp(24px,2.5vw,34px);letter-spacing:-.02em;color:#fff}
.step p{color:var(--t-clair);margin-top:8px;max-width:40ch;font-size:16.5px}
.story .h2{font-size:clamp(30px,4vw,52px)}

.stg{position:relative;aspect-ratio:1.18;width:min(680px,100%);margin-inline:auto;display:grid;grid-template-columns:1fr .78fr 1fr;gap:clamp(10px,2vw,26px);align-items:center}
.stg>*{transition:opacity .7s var(--ease),transform .8s var(--ease),filter .7s,box-shadow .6s}
.st-site,.st-box,.st-portals{opacity:.22;filter:saturate(.4) blur(1px);transform:scale(.94)}
.stg[data-step="1"] .st-site,.stg[data-step="2"] .st-box,.stg[data-step="3"] .st-portals{opacity:1;filter:none;transform:scale(1.03)}
.stg[data-step="2"] .st-site,.stg[data-step="3"] .st-site,.stg[data-step="3"] .st-box{opacity:.8;filter:none;transform:scale(.97)}
.st-site{background:#fff;color:var(--ink);border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(0,0,0,.7)}
.st-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;background:#ECEAE2}
.st-bar i{width:9px;height:9px;border-radius:50%;background:#C9C6BA}
.st-bar span{flex:1;margin-inline-start:6px;background:#fff;border-radius:6px;padding:3px 9px;font-size:10.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-body{padding:12px 13px 14px}
.st-body img{display:block;width:100%;height:76px;object-fit:cover;border-radius:10px;margin-bottom:10px}
.fl{display:grid;gap:5px;margin-bottom:8px}
.fl label{font:600 9.5px var(--f-texte);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.fl div{height:25px;border-radius:7px;background:var(--sable);border:1px solid var(--line);padding:4px 8px;font-size:11.5px;font-weight:500;overflow:hidden;white-space:nowrap;display:flex;align-items:center}
.fl div span{display:block;overflow:hidden;white-space:nowrap;width:100%}
.stg[data-step="1"] .fl div span{width:0;animation:type 1.2s steps(18,end) forwards;animation-delay:calc(var(--k)*.55s)}
@keyframes type{to{width:100%}}
.st-pub{display:block;width:100%;padding:8px;border-radius:8px;background:var(--atl);color:#fff;font:600 11.5px var(--f-texte);text-align:center;border:0}
.stg[data-step="1"] .st-pub{animation:press 1s 3.3s both}
@keyframes press{0%{background:var(--atl)}40%{transform:scale(.96);background:var(--maj)}100%{transform:scale(1);background:#1AAE78}}
.st-box{position:relative;display:grid;place-items:center}
.cube{position:relative;width:100%;aspect-ratio:1;border-radius:26px;background:linear-gradient(150deg,#27396E,#141B45);box-shadow:0 0 0 1px rgba(255,255,255,.2) inset,0 0 80px -6px rgba(53,72,200,.9),0 30px 60px -24px #000;display:grid;place-items:center;align-content:center;gap:8px;text-align:center}
.cube svg{width:46%}
.cube b{font:700 clamp(12px,1.4vw,17px) var(--f-titre);letter-spacing:.2em;color:#fff}
.fmt{position:absolute;display:flex;gap:6px;font:600 10.5px var(--f-texte);color:#fff;white-space:nowrap}
.fmt span{padding:5px 9px;border-radius:99px;background:rgba(142,156,255,.22);box-shadow:0 0 0 1px rgba(142,156,255,.5) inset;opacity:0;transform:translateY(8px) scale(.9)}
.stg[data-step="2"] .fmt span,.stg[data-step="3"] .fmt span{opacity:1;transform:none;transition:opacity .5s calc(var(--k)*.18s),transform .6s var(--ease) calc(var(--k)*.18s)}
.fmt.t{top:-16px;left:50%;transform:translateX(-50%)}
.fmt.b{bottom:-16px;left:50%;transform:translateX(-50%)}
.st-portals{display:grid;gap:9px}
.pt{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;height:50px;padding:0 12px;border-radius:14px;background:#fff;color:var(--ink);box-shadow:0 10px 26px -14px rgba(0,0,0,.7);font:700 12.5px var(--f-titre)}
.pt img{max-height:24px;max-width:76px;width:auto}
.pt .pill{font:600 10px var(--f-texte);padding:3px 8px;border-radius:99px;background:var(--ok-doux);color:var(--ok);opacity:0;transform:scale(.6)}
.stg[data-step="3"] .pt .pill{opacity:1;transform:none;transition:opacity .4s calc(var(--k)*.22s),transform .5s var(--ease) calc(var(--k)*.22s)}
.stg[data-step="3"] .pt{outline:2px solid transparent;animation:lit 1.2s calc(var(--k)*.22s) both}
@keyframes lit{0%{outline-color:transparent}30%{outline-color:#1AAE78;box-shadow:0 0 26px 2px rgba(26,174,120,.6)}100%{outline-color:transparent}}
.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.wires path{fill:none;stroke:rgba(142,156,255,.7);stroke-width:1.6;stroke-dasharray:6 7;stroke-linecap:round;opacity:0;transition:opacity .6s}
.stg[data-step="2"] .wires .w1,.stg[data-step="3"] .wires .w1,.stg[data-step="3"] .wires .w2{opacity:1;animation:dash 1.4s linear infinite}
@keyframes dash{to{stroke-dashoffset:-26}}

/* ---------- 4. Chiffres ---------- */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:56px}
.num{position:relative;padding:30px 26px 26px;border-radius:26px;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.num::before{content:"";position:absolute;inset:0;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,0%),rgba(53,72,200,.14),transparent 60%);opacity:0;transition:opacity .3s}
.num:hover::before{opacity:1}
.num:hover{box-shadow:0 30px 60px -28px rgba(26,43,86,.45)}
.num b{display:block;font:700 clamp(54px,6.4vw,96px)/.95 var(--f-titre);letter-spacing:-.05em;color:var(--atl);font-variant-numeric:tabular-nums}
.num b sup{font-size:.4em;vertical-align:top;margin-inline-start:2px;color:var(--maj)}
.num p{margin-top:14px;color:var(--ink-2);font-size:15.5px;line-height:1.4}
.num.hl{background:linear-gradient(150deg,var(--atl),var(--nuit-2));border-color:transparent;color:#fff}
.num.hl b{color:#fff}.num.hl p{color:var(--t-clair)}
.num.hl b sup{color:var(--dore)}
.num .bar{position:absolute;inset-inline:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--maj),var(--dore));transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s var(--ease) .3s}
.num.in .bar{transform:scaleX(1)}

/* ---------- 5. Orbite des 18 plateformes ---------- */
.orb-wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:50px;align-items:center;margin-top:30px}
.hub.big{width:min(720px,100%)}
.hub.big .otile{min-width:84px;height:50px;margin:-25px 0 0 -42px;padding:6px 12px;border-radius:14px}
.hub.big .otile img{max-height:26px;max-width:80px}
.legend{display:grid;gap:14px;margin-top:34px}
.legend div{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;background:var(--verre);box-shadow:0 0 0 1px var(--verre-b) inset;transition:background .3s,transform .3s var(--ease)}
.legend div:hover{background:rgba(255,255,255,.1);transform:translateX(6px)}
.legend b{font:700 36px/1 var(--f-titre);min-width:54px;color:#fff;letter-spacing:-.04em}
.legend span{font-size:15px;color:var(--t-clair);line-height:1.35}
.legend em{display:block;font-style:normal;color:#fff;font-weight:600;font-size:16px}
.legend .c1 b{color:#4ADE9B}.legend .c2 b{color:var(--maj-clair)}.legend .c3 b{color:var(--dore)}

/* ---------- 5b. Mur détaillé (reprend le balisage existant) ---------- */
.portals{padding:0;background:transparent}
.portals .wrap{padding-inline:20px}
.sec .pt-label{color:var(--ink-2)!important}
.portals ul.wall li{transition:transform .35s var(--ease)}
.portals ul.wall li:hover{transform:translateY(-6px)}
.pt-rule{margin-top:20px;font-size:18px;color:var(--t-clair)}
.pt-rule b{color:#fff}
.dark .pt-rule{color:var(--t-clair)}

/* ---------- 6. Pourquoi : démos vivantes ---------- */
.why{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;margin-top:56px}
.wc{position:relative;padding:30px;border-radius:30px;background:#fff;border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;gap:18px;transition:transform .4s var(--ease),box-shadow .4s}
.wc:hover{transform:translateY(-6px);box-shadow:0 34px 60px -30px rgba(26,43,86,.45)}
.wc h3{font-size:clamp(22px,2.2vw,30px);letter-spacing:-.025em}
.wc p{color:var(--ink-2);font-size:16px}
.wc.a{grid-column:span 7}.wc.b{grid-column:span 5}.wc.c{grid-column:span 5}.wc.d{grid-column:span 7}
.wc.dk{background:linear-gradient(155deg,var(--atl),var(--nuit));border-color:transparent;color:#fff}
.wc.dk h3{color:#fff}.wc.dk p{color:var(--t-clair)}
.demo{position:relative;min-height:190px;border-radius:20px;background:var(--sable);border:1px solid var(--line);padding:18px;display:grid;align-content:center;gap:12px;overflow:hidden}
.wc.dk .demo{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
/* a : le prix change partout */
.price-flip{display:flex;align-items:center;justify-content:space-between;gap:14px}
.price-flip .pf{position:relative;height:40px;min-width:210px;font:700 30px/40px var(--f-titre);letter-spacing:-.03em;color:var(--atl);overflow:hidden}
.pf span{position:absolute;left:0;top:0;white-space:nowrap}
.pf .o{animation:pfo 7s infinite}.pf .n{animation:pfn 7s infinite;color:var(--ok)}
@keyframes pfo{0%,28%{transform:none;opacity:1}34%,94%{transform:translateY(-110%);opacity:0}100%{transform:none;opacity:1}}
@keyframes pfn{0%,28%{transform:translateY(110%);opacity:0}34%,94%{transform:none;opacity:1}100%{transform:translateY(110%);opacity:0}}
.chp{display:flex;flex-wrap:wrap;gap:8px}
.chp span{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:99px;background:#fff;border:1px solid var(--line);font:600 12.5px var(--f-texte);color:var(--ink-2);animation:chipok 7s infinite;animation-delay:calc(var(--k)*.28s)}
.chp span::after{content:"";width:6px;height:6px;border-radius:50%;background:#C9C6BA;transition:background .3s;animation:dot 7s infinite;animation-delay:calc(var(--k)*.28s)}
@keyframes dot{0%,30%{background:#C9C6BA}36%,92%{background:#1AAE78}100%{background:#C9C6BA}}
@keyframes chipok{0%,30%{border-color:var(--line);transform:none}36%{border-color:#1AAE78;transform:translateY(-3px)}44%,100%{border-color:var(--line);transform:none}}
/* b : un bien vendu disparaît */
.sold{position:relative;display:grid;gap:10px}
.sold .row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.08);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset;font-size:13.5px;color:#fff;animation:vanish 8s infinite;animation-delay:calc(var(--k)*.35s)}
.sold .row img{width:44px;height:30px;border-radius:7px;object-fit:cover}
.sold .row em{margin-inline-start:auto;font-style:normal;font:600 10.5px var(--f-texte);padding:3px 8px;border-radius:99px;background:rgba(74,222,155,.18);color:#4ADE9B}
.stamp{position:absolute;inset-inline-end:6px;top:-6px;padding:6px 14px;border:2.5px solid #FF8A8A;color:#FF8A8A;border-radius:8px;font:700 16px var(--f-titre);letter-spacing:.14em;transform:rotate(-9deg) scale(1);opacity:0;animation:stamp 8s infinite;background:rgba(15,20,49,.6)}
@keyframes stamp{0%,22%{opacity:0;transform:rotate(-9deg) scale(2.4)}28%,70%{opacity:1;transform:rotate(-9deg) scale(1)}78%,100%{opacity:0;transform:rotate(-9deg) scale(1)}}
@keyframes vanish{0%,40%{opacity:1;transform:none;max-height:56px}52%,72%{opacity:0;transform:translateX(30px);max-height:0;padding-block:0}84%,100%{opacity:1;transform:none;max-height:56px}}
/* c : les demandes arrivent dans une seule boîte */
.inbox{display:grid;gap:8px}
.lead-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:13.5px;opacity:0;transform:translateX(-40px);animation:lead 9s infinite;animation-delay:calc(var(--k)*1.5s)}
.lead-row img{height:20px;max-width:60px;width:auto}
.lead-row b{font-weight:600}
.lead-row small{display:block;color:var(--ink-2);font-size:11.5px}
.lead-row .tag{margin-inline-start:auto;font:600 10.5px var(--f-texte);padding:3px 9px;border-radius:99px;background:var(--maj-doux);color:var(--maj)}
@keyframes lead{0%{opacity:0;transform:translateX(-40px)}8%,70%{opacity:1;transform:none}80%,100%{opacity:0}}
/* d : première agence cliente */
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.proof div{padding:16px;border-radius:16px;background:rgba(255,255,255,.07);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset}
.proof b{display:block;font:700 clamp(34px,4vw,54px)/1 var(--f-titre);color:#fff;letter-spacing:-.04em}
.proof span{font-size:13.5px;color:var(--t-clair)}

/* ---------- 6b. Tableau de bord ---------- */
.dash-wrap{margin-top:60px;perspective:1800px}
.dash{display:grid;grid-template-columns:210px minmax(0,1fr);border-radius:28px;background:#0F1431;color:#F5F4EF;box-shadow:0 70px 120px -50px rgba(15,20,49,.75),0 0 0 1px rgba(255,255,255,.1);overflow:hidden;transform:rotateX(var(--tilt,16deg)) scale(var(--sc,.94));transform-origin:50% 0;will-change:transform}
.dnav{padding:22px 14px;background:#0B1028;display:grid;align-content:start;gap:4px;font-size:14px}
.dlogo{display:flex;align-items:center;gap:10px;margin:0 8px 22px;font:700 15px var(--f-titre);letter-spacing:.14em}
.dlogo svg{width:28px;height:28px}
.dnav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;color:rgba(245,244,239,.62);text-decoration:none}
.dnav a.on{background:rgba(142,156,255,.16);color:#fff;box-shadow:0 0 0 1px rgba(142,156,255,.35) inset}
.dmain{padding:20px 24px 26px;display:grid;gap:18px;min-width:0;background:radial-gradient(60% 50% at 80% 0%,rgba(53,72,200,.28),transparent 70%)}
.dbar{display:flex;justify-content:space-between;align-items:center;gap:14px}
.dsearch{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:12px;background:rgba(255,255,255,.06);color:rgba(245,244,239,.55);font-size:14px;min-width:min(280px,100%)}
.dav{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--maj),var(--ocre));display:grid;place-items:center;font:700 13px var(--f-titre);flex:none}
.dkpi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.dkpi>div{position:relative;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;overflow:hidden}
.dkpi b{display:block;font:700 clamp(26px,3vw,38px)/1 var(--f-titre);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.dkpi span{font-size:12.5px;color:rgba(245,244,239,.65)}
.spark{position:absolute;right:12px;top:14px;width:84px;height:36px;background:linear-gradient(rgba(142,156,255,.75),transparent);clip-path:polygon(0 80%,14% 62%,28% 72%,42% 40%,56% 52%,72% 18%,86% 30%,100% 8%,100% 100%,0 100%)}
.spark.s2{clip-path:polygon(0 60%,16% 70%,32% 44%,48% 58%,64% 30%,80% 40%,100% 12%,100% 100%,0 100%);background:linear-gradient(rgba(232,207,160,.8),transparent)}
.spark.s3{clip-path:polygon(0 40%,20% 40%,20% 25%,45% 25%,45% 15%,100% 15%,100% 100%,0 100%);background:linear-gradient(rgba(74,222,155,.7),transparent)}
.dtab{display:grid;gap:7px}
.dh,.dr{display:grid;grid-template-columns:minmax(0,2.2fr) 1.1fr 1.1fr .9fr;gap:14px;align-items:center;padding:10px 14px}
.dh{font:600 11px var(--f-texte);letter-spacing:.1em;text-transform:uppercase;color:rgba(245,244,239,.5)}
.dr{border-radius:14px;background:rgba(255,255,255,.04);box-shadow:0 0 0 1px rgba(255,255,255,.06) inset;font-size:14px;transition:background .3s,transform .3s var(--ease)}
.dr:hover{background:rgba(255,255,255,.09);transform:translateX(4px)}
.dt{display:flex;align-items:center;gap:12px;min-width:0}
.dt img{width:50px;height:38px;object-fit:cover;border-radius:9px;flex:none}
.dt>span{min-width:0}
.dt b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt small{color:rgba(245,244,239,.55);font-size:12px}
.dp{font-variant-numeric:tabular-nums;white-space:nowrap}
.dd{display:flex;gap:5px}
.dd i{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.15)}
.dd i.on{background:#4ADE9B;box-shadow:0 0 10px rgba(74,222,155,.7);animation:dotin 7s infinite;animation-delay:calc(var(--k)*.25s)}
@keyframes dotin{0%,4%{transform:scale(0)}10%{transform:scale(1.4)}16%,100%{transform:scale(1)}}
.ds{justify-self:start;padding:4px 11px;border-radius:99px;font:600 11.5px var(--f-texte)}
.ds.ok{background:rgba(74,222,155,.16);color:#4ADE9B}
.ds.dr-b{background:rgba(232,207,160,.16);color:var(--dore)}
.num .ico.big{position:absolute;right:20px;top:20px;width:30px;height:30px;color:var(--maj);opacity:.55}
.num.hl .ico.big{color:var(--dore);opacity:.9}

/* ---------- 7. Deux façons d'alimenter Maskan ---------- */
.ways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:56px}
.way{position:relative;padding:34px;border-radius:30px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));box-shadow:0 0 0 1px rgba(255,255,255,.13) inset;overflow:hidden;transition:transform .4s var(--ease)}
.way:hover{transform:translateY(-6px)}
.way::after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;right:-120px;top:-140px;background:radial-gradient(closest-side,rgba(53,72,200,.55),transparent);pointer-events:none}
.way .tag{display:inline-block;font:600 12px var(--f-texte);letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;border-radius:99px;background:rgba(232,207,160,.14);color:var(--dore)}
.way h3{font-size:clamp(24px,2.6vw,34px);color:#fff;margin-top:18px;letter-spacing:-.025em}
.way>p{color:var(--t-clair);margin-top:12px}
.flow{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.flow li{position:relative;display:flex;gap:14px;align-items:center;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1) inset;font-size:15.5px;color:#F5F4EF;animation:flowon 9s infinite;animation-delay:calc(var(--k)*3s)}
.flow li .ico{width:30px;height:30px;padding:6px;border-radius:10px;background:rgba(142,156,255,.2);color:var(--maj-clair);box-sizing:content-box;width:1.2em;height:1.2em}
@keyframes flowon{0%,2%{background:rgba(255,255,255,.06);transform:none}6%,30%{background:rgba(142,156,255,.2);transform:translateX(8px);box-shadow:0 0 0 1px rgba(142,156,255,.6) inset,0 0 30px -6px rgba(142,156,255,.7)}36%,100%{background:rgba(255,255,255,.06);transform:none}}
.way .for{margin-top:20px;font-size:14.5px;color:var(--dore)}
.merge{display:flex;align-items:center;gap:16px;margin-top:22px;padding:22px 26px;border-radius:24px;background:linear-gradient(100deg,rgba(53,72,200,.4),rgba(232,207,160,.12));box-shadow:0 0 0 1px rgba(255,255,255,.16) inset;color:#fff;font-size:17px}
.merge .ico{width:30px;height:30px;color:var(--dore)}

/* ---------- 8. Tarifs ---------- */
.plans2{margin-top:56px}
.plan{border-radius:32px!important;transition:transform .4s var(--ease),box-shadow .4s}
.plan:hover{transform:translateY(-6px)}
.plan.feat{position:relative;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--maj),var(--dore),var(--maj)) border-box!important;border:2px solid transparent!important;box-shadow:0 40px 80px -40px rgba(53,72,200,.55)}
.netdots{display:grid;grid-template-columns:repeat(18,1fr);gap:5px;margin:4px 0 6px}
.netdots i{height:8px;border-radius:99px;background:var(--line);transition:background .4s,box-shadow .4s,transform .4s var(--ease)}
.netdots i.on{background:var(--maj);box-shadow:0 0 12px rgba(53,72,200,.6)}
.netdots i.all{background:linear-gradient(90deg,var(--maj),var(--ocre));transform:scaleY(1.4)}
.netlab{font-size:13.5px;color:var(--ink-2);display:flex;justify-content:space-between;gap:10px}
.netlab b{color:var(--atl)}
.calc .price{transition:transform .3s var(--ease)}
.calc .price.bump{transform:scale(1.06)}

/* ---------- 9. Recherche, FAQ, appel final ---------- */
.cherche-band{background:transparent;padding:0}
.cbar{position:relative;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;padding:34px 38px;border-radius:30px;background:linear-gradient(100deg,var(--atl),var(--nuit-3));color:#fff;overflow:hidden}
.cbar::before{content:"";position:absolute;inset:0;background:url("img/biens/riad-vue-mer.jpg") center/cover;opacity:.22;mix-blend-mode:luminosity}
.cbar p{position:relative;font-size:clamp(18px,2vw,24px);line-height:1.35}
.cbar .btn{position:relative}
.faq details{border-radius:22px!important;transition:background .3s,box-shadow .3s}
.faq details[open]{box-shadow:0 24px 50px -30px rgba(26,43,86,.5)}
.faq summary{transition:color .2s}
.faq summary:hover{color:var(--maj)}

.fin{position:relative;overflow:hidden;background:var(--nuit);color:#F5F4EF;padding-block:clamp(90px,12vw,170px);border-radius:44px 44px 0 0;margin-top:-44px;z-index:5;isolation:isolate}
.fin::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 60% at 80% 40%,rgba(53,72,200,.55),transparent 70%),radial-gradient(40% 50% at 10% 100%,rgba(196,124,10,.25),transparent 70%)}
.fin .zel{-webkit-mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent);mask-image:radial-gradient(80% 80% at 50% 50%,#000,transparent)}
.fin-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:50px;align-items:center}
.fin h2{font-size:clamp(38px,6vw,84px);line-height:.98;letter-spacing:-.04em;color:#fff}
.fin h2 em{font-style:normal;--g:linear-gradient(100deg,var(--maj-clair),var(--dore));background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
.fin p{color:var(--t-clair);font-size:19px;margin-top:24px;max-width:50ch}
.fin .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.fin .arche .photo{box-shadow:0 40px 80px -30px #000,0 0 0 1px rgba(255,255,255,.18);transform:translate3d(calc(var(--mx,0)*-10px),calc(var(--my,0)*-10px),0);transition:transform .3s ease-out}
.bigmq{position:absolute;inset-inline:0;bottom:-.18em;z-index:-1;overflow:hidden;white-space:nowrap;font:700 clamp(90px,16vw,230px)/1 var(--f-titre);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.1);direction:ltr}
.bigmq span{display:inline-block;animation:bigmq 40s linear infinite}
@keyframes bigmq{to{transform:translateX(-50%)}}

/* ---------- Pied de page ---------- */
footer{background:var(--nuit);color:var(--t-clair);margin:0;border-top:1px solid rgba(255,255,255,.08)}
footer .logo{color:#F5F4EF}
footer a{color:var(--t-clair);text-decoration:none}
footer a:hover{color:#fff}
footer h5{color:#fff}
footer .legal{border-top-color:rgba(255,255,255,.1);color:rgba(245,244,239,.6)}

/* ---------- Adaptation ---------- */
@media (max-width:1100px){
  .hx-grid{grid-template-columns:1fr}
  .hub{width:min(460px,92%);margin-top:10px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .orb-wrap,.fin-grid{grid-template-columns:1fr}
  .wc.a,.wc.b,.wc.c,.wc.d{grid-column:span 12}
  .ways{grid-template-columns:1fr}
}
@media (max-width:900px){
  .story{height:auto;padding-block:90px 60px}
  .story .pin{position:relative;height:auto}
  .story-grid{grid-template-columns:1fr;gap:34px}
  .steps::after{display:none}
  .step{opacity:1}
  .stg{aspect-ratio:auto;grid-template-columns:1fr;gap:18px;max-width:380px}
  .stg>*{opacity:1!important;filter:none!important;transform:none!important}
  .st-box{padding:20px 40px}
  .wires{display:none}
  .stg .fl div span{width:100%!important;animation:none!important}
  .stg .pt .pill,.stg .fmt span{opacity:1!important;transform:none!important}
}
@media (max-width:900px){
  .dash{grid-template-columns:1fr;transform:none}
  .dnav{display:none}
  .dh,.dr{grid-template-columns:minmax(0,2fr) 1fr}
  .dh span:nth-child(2),.dh span:nth-child(3),.dr .dp,.dr .dd{display:none}
}
@media (max-width:640px){
  .dkpi{grid-template-columns:1fr}
  .sec{border-radius:30px 30px 0 0;margin-top:-30px}
  .band-logos,.story,.fin{border-radius:30px 30px 0 0;margin-top:-30px}
  .hx{padding-block:110px 80px}
  .otile{min-width:74px;height:46px;margin:-23px 0 0 -37px;padding:6px 10px}
  .otile img{max-height:22px;max-width:62px}
  .fcard{display:none}
  .hub.big .otile{min-width:64px;height:40px;margin:-20px 0 0 -32px;padding:4px 8px}
  .hub.big .otile img{max-height:20px;max-width:52px}
  .hub.big .core{width:22%!important}
  .trust{gap:12px 24px}
  .cbar{grid-template-columns:1fr;padding:26px}
  .proof{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .wc{padding:22px}
  .stats{gap:12px}.num{padding:22px 18px}
}
@media (prefers-reduced-motion:reduce){
  [data-r]{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  .split .w>i{transform:none!important;transition:none!important}
  .orbit,.otile,.core svg,.zel,.aur,.mq ul,.bigmq span,.ray::after,.core::before,.core::after,.fcard,.eyebrow i,.live i,.cue span::after,.flow li,.chp span,.chp span::after,.pf span,.sold .row,.stamp,.lead-row{animation:none!important}
  .fcard{opacity:1}
  .lead-row{opacity:1;transform:none}
  .stg .fl div span{width:100%!important}
  .pf .o{display:none}.pf .n{transform:none;opacity:1}
  .stg>*{transition:none!important}
}

/* Logos SVG sans dimensions propres */
.mq li img[src$=".svg"],.otile img[src$=".svg"],.pt img[src$=".svg"],.lead-row img[src$=".svg"],.tile img[src$=".svg"]{height:26px;width:auto;max-height:none;max-width:96px}

/* ================= Pages secondaires ================= */
/* ---------- Recherche de biens ---------- */
.srch-hero{padding-block:150px 100px;overflow:hidden}
.srch-hero::after{content:"";position:absolute;inset:-5%;z-index:-2;background:var(--photo) center 60%/cover no-repeat;animation:kb 26s ease-out forwards}
@keyframes kb{from{transform:scale(1.14)}to{transform:scale(1)}}
.srch-hero::before{background:linear-gradient(180deg,rgba(15,20,49,.5),rgba(15,20,49,.92)),radial-gradient(60% 80% at 82% 18%,rgba(53,72,200,.55),transparent 70%)}
.srch-hero .kicker{display:inline-flex;padding:8px 14px;border-radius:99px;background:rgba(232,207,160,.12);box-shadow:0 0 0 1px rgba(232,207,160,.3) inset}
.srch-hero h1{font-size:clamp(40px,6vw,82px);line-height:.98;letter-spacing:-.04em;max-width:15ch}
.srch{background:rgba(255,255,255,.1);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:0 0 0 1px rgba(255,255,255,.22) inset,0 40px 80px -30px rgba(0,0,0,.65);color:#fff;border-radius:24px}
.srch .fld>span{color:rgba(255,255,255,.72)}
.srch .seg{background:rgba(255,255,255,.12)}
.srch .seg span{color:rgba(255,255,255,.82)}
.srch .seg input:checked+span{background:#fff;color:var(--nuit)}
.srch .btn-primary{background:linear-gradient(135deg,var(--maj),#6B7BFF);box-shadow:0 14px 34px -12px rgba(53,72,200,.9)}
.srch-res{position:relative;z-index:2;background:var(--sable);border-radius:44px 44px 0 0;margin-top:-44px;padding-block:70px 60px}
.res-head h2{font-size:clamp(28px,3.6vw,46px);letter-spacing:-.03em}
.cards .bien{animation:rise .8s var(--ease) both;border-radius:22px}
.cards .bien:nth-child(6n+1){animation-delay:0s}.cards .bien:nth-child(6n+2){animation-delay:.07s}.cards .bien:nth-child(6n+3){animation-delay:.14s}.cards .bien:nth-child(6n+4){animation-delay:.21s}.cards .bien:nth-child(6n+5){animation-delay:.28s}.cards .bien:nth-child(6n){animation-delay:.35s}
@keyframes rise{from{opacity:0;transform:translateY(34px) scale(.97)}to{opacity:1;transform:none}}
.bien.sk{animation:none}
.bien .ph{overflow:hidden}
.bien .ph img{transition:transform .9s var(--ease)}
a.bien{transition:transform .35s var(--ease),box-shadow .35s,border-color .2s}
a.bien:hover{transform:translateY(-8px);box-shadow:0 36px 60px -30px rgba(26,43,86,.55)}
a.bien:hover .ph img{transform:scale(1.08)}
.bien .px{font-size:23px}
.srch-agence{position:relative;z-index:3;background:var(--sable);padding-block:10px 90px}
.agence-cta{position:relative;overflow:hidden;background:linear-gradient(110deg,var(--atl),var(--nuit-3));color:#fff;border-radius:32px;padding:clamp(30px,5vw,60px)}
.agence-cta::before{content:"";position:absolute;inset:0;background:url("img/biens/medina-riad.jpg") center/cover;opacity:.18;mix-blend-mode:luminosity}
.agence-cta>*{position:relative}
.agence-cta h2{color:#fff;font-size:clamp(28px,4vw,50px);letter-spacing:-.03em}
.agence-cta p:not(.kicker){color:var(--t-clair)}
.agence-cta .kicker{color:var(--dore)}
.agence-cta .btn-primary{background:#F5F4EF;color:var(--nuit)}

/* ---------- Inscription guidée (page entière) ---------- */
body.p-wiz{background:var(--nuit);color:var(--ink);position:relative;overflow-x:clip}
body.p-wiz::before{content:"";position:fixed;inset:0;z-index:-2;background:radial-gradient(55% 55% at 85% 15%,rgba(53,72,200,.6),transparent 70%),radial-gradient(45% 45% at 5% 100%,rgba(196,124,10,.28),transparent 70%),var(--nuit)}
body.p-wiz .zel{position:fixed;inset:0;z-index:-1}
body.p-wiz .wz-top .logo{color:#F5F4EF}
body.p-wiz .wz-top .logo .ar{color:var(--dore);border-inline-start-color:rgba(255,255,255,.22)}
body.p-wiz .wz-top a.x{color:rgba(255,255,255,.75)}
body.p-wiz .lang{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18)}
body.p-wiz .lang button{color:rgba(255,255,255,.72)}
body.p-wiz .lang button[aria-pressed="true"]{background:#F5F4EF;color:var(--nuit)}
body.p-wiz .wz-card{box-shadow:0 50px 100px -40px #000,0 0 0 1px rgba(255,255,255,.18);animation:rise .9s var(--ease) both}
body.p-wiz .wz-side{animation:rise .9s var(--ease) .15s both}
body.p-wiz .wz-side .reassure{color:var(--t-clair)}
body.p-wiz .wz-count{color:var(--ink-2)}

/* ================= Page « lancement prochain » ================= */
.fcard .ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--maj),#6B7BFF);flex:none}
.fcard .ic .ico{width:22px;height:22px;stroke:#fff;fill:none}
.btn-lg{padding:1.1em 1.7em;font-size:17px}
.feats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:56px}
.feat-c{position:relative;padding:30px 26px 28px;border-radius:28px;background:#fff;border:1px solid var(--line);overflow:hidden;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s var(--ease),box-shadow .35s}
.feat-c::before{content:"";position:absolute;inset:0;background:radial-gradient(280px circle at var(--gx,50%) var(--gy,0%),rgba(53,72,200,.14),transparent 60%);opacity:0;transition:opacity .3s}
.feat-c:hover::before{opacity:1}.feat-c:hover{box-shadow:0 30px 60px -28px rgba(26,43,86,.45)}
.fi{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,var(--atl),var(--maj));margin-bottom:22px}
.fi .ico{width:28px;height:28px;stroke:#fff}
.feat-c h3{font-size:24px;letter-spacing:-.02em}.feat-c p{margin-top:10px;color:var(--ink-2);font-size:16px;line-height:1.5}
.road{margin-top:44px;padding:34px 38px;border-radius:30px;background:linear-gradient(150deg,var(--atl),var(--nuit));color:#fff}
.road-t{font:600 13px var(--f-texte);letter-spacing:.14em;text-transform:uppercase;color:var(--dore);margin-bottom:22px}
.road ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;position:relative}
.road ol::before{content:"";position:absolute;inset-inline:0;top:9px;height:2px;background:linear-gradient(90deg,#4ADE9B 0 33%,rgba(255,255,255,.2) 33%)}
.road li{position:relative;padding-top:36px;display:grid;gap:6px;color:var(--t-clair);font-size:15.5px;line-height:1.5}
.road li b{font:700 22px var(--f-titre);color:#fff}
.rd{position:absolute;inset-inline-start:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--nuit);border:2px solid rgba(255,255,255,.4)}
.road li.now .rd{background:#4ADE9B;border-color:#4ADE9B;box-shadow:0 0 0 6px rgba(74,222,155,.25);animation:ping 2.2s infinite;color:#4ADE9B}
.media-grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:56px;align-items:center;margin-top:56px}
.phone-col,.view-col{display:grid;gap:20px;justify-items:center}
.phone{position:relative;width:min(330px,100%);aspect-ratio:9/19;border-radius:46px;padding:12px;background:linear-gradient(160deg,#2A3470,#0B1028);box-shadow:0 60px 100px -40px #000,0 0 0 1.5px rgba(255,255,255,.25) inset,0 0 90px -10px rgba(53,72,200,.6)}
.phone video{display:block;width:100%;height:100%;object-fit:cover;border-radius:36px;background:#000}
.notch{position:absolute;left:50%;top:18px;width:84px;height:22px;margin-left:-42px;border-radius:99px;background:#05081c;z-index:2;pointer-events:none}
.viewer{width:100%;border-radius:26px;overflow:hidden;background:#0B1028;box-shadow:0 60px 100px -44px #000,0 0 0 1.5px rgba(255,255,255,.2) inset}
.vbar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#141B45}
.vbar i{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.25)}
.vbar span{margin-inline-start:10px;font-size:13.5px;color:var(--t-clair)}
.viewer iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#05081c}
.vact{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.mcap{text-align:center;color:var(--t-clair);font-size:15.5px;max-width:46ch}
.mcap b{display:block;color:#fff;font:700 20px var(--f-titre);margin-bottom:4px}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:56px}
.duo-c{position:relative;display:flex;flex-direction:column;gap:16px;padding:40px;border-radius:34px;background:#fff;border:1px solid var(--line);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s}
.duo-c:hover{transform:translateY(-6px);box-shadow:0 40px 70px -36px rgba(26,43,86,.5)}
.duo-c h3{font-size:clamp(30px,3.2vw,44px);letter-spacing:-.03em}
.duo-c>p{color:var(--ink-2);font-size:17px}
.duo-c.dk{background:linear-gradient(155deg,var(--atl),var(--nuit));border-color:transparent;color:#fff}
.duo-c.dk::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-120px;top:-150px;background:radial-gradient(closest-side,rgba(53,72,200,.6),transparent);pointer-events:none}
.duo-c.dk>p{color:var(--t-clair)}.duo-c.dk h3{color:#fff}
.duo-c .tag{align-self:flex-start;font:600 12px var(--f-texte);letter-spacing:.14em;text-transform:uppercase;padding:7px 14px;border-radius:99px;background:rgba(232,207,160,.14);color:var(--dore)}
.duo-c .tag.lt{background:var(--maj-doux);color:var(--maj)}
.duo-c ul{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:12px;font-size:16.5px}
.duo-c li{display:flex;gap:12px;align-items:center}
.duo-c li .ico{width:22px;height:22px;color:#4ADE9B}
.duo-c.dk li{color:#F5F4EF}
.duo-c .btn{align-self:flex-start;margin-top:auto}
.duo-c .alt{font-size:14.5px}.duo-c .alt a{color:var(--dore)}
.vp{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:22px;background:var(--sable);border:1px solid var(--line)}
.av{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--maj),var(--ocre));color:#fff;font:700 20px var(--f-titre);flex:none}
.vp b{display:block;font:700 19px/1.2 var(--f-titre)}.vp small{color:var(--ink-2);font-size:14.5px}
.duo-c .ct li .ico{color:var(--maj)}
.duo-c .ct a{text-decoration:none;font-weight:500}.duo-c .ct a:hover{color:var(--maj)}
.qrw{justify-self:center;text-align:center}
.qrbox{position:relative;width:min(340px,100%);padding:22px;border-radius:34px;background:#fff;margin-inline:auto;box-shadow:0 50px 100px -40px #000,0 0 0 1.5px rgba(255,255,255,.3),0 0 120px 6px rgba(53,72,200,.55)}
.qrbox svg{display:block;width:100%;height:auto}
.qrbox::before,.qrbox::after{content:"";position:absolute;width:44px;height:44px;border:4px solid var(--maj-clair)}
.qrbox::before{left:-12px;top:-12px;border-right:0;border-bottom:0;border-radius:20px 0 0 0}
.qrbox::after{right:-12px;bottom:-12px;border-left:0;border-top:0;border-radius:0 0 20px 0}
.qrw p{margin-top:26px;color:var(--t-clair);font-size:16px}
.qrw b{display:block;font:700 28px var(--f-titre);color:#fff;margin-top:4px}
@media (max-width:1100px){
  .feats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-grid,.duo{grid-template-columns:1fr}
  .road ol{grid-template-columns:1fr}
  .road ol::before{display:none}
}
@media (max-width:640px){
  .feats{grid-template-columns:1fr}
  .duo-c{padding:28px}
  .road{padding:26px}
}

/* Formulaire intégré sous l'en-tête de la page d'attente */
.fsec{position:relative;z-index:1;padding:112px 0 90px;background:var(--nuit);color:#F5F4EF;overflow:hidden;isolation:isolate}
.fsec::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(50% 60% at 85% 20%,rgba(53,72,200,.55),transparent 70%),radial-gradient(40% 45% at 0% 100%,rgba(196,124,10,.22),transparent 70%)}
.fwrap{max-width:1240px}
#cf{display:block;width:100%;border:0;background:transparent;min-height:520px;color-scheme:normal}
@media (max-width:640px){.fsec{padding:92px 0 70px}}

/* ================= Carte de pré-inscription intégrée au hero ================= */
.hbg{position:absolute;right:-14%;top:50%;width:min(900px,80vw);transform:translateY(-50%);opacity:.38;z-index:-1;pointer-events:none}
.hx-pre{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:56px;align-items:center}
.hx-pre h1{font-size:clamp(38px,5.2vw,76px)}
.perks{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px;font-size:17px;color:#F5F4EF}
.perks li{display:flex;gap:12px;align-items:flex-start}
.perks .ico{width:22px;height:22px;margin-top:2px;color:#4ADE9B}
.hx-pre .trust{margin-top:34px}
.pcard{position:relative;width:100%;max-width:560px;justify-self:end;padding:34px 34px 30px;border-radius:34px;background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);box-shadow:0 0 0 1px rgba(255,255,255,.22) inset,0 60px 110px -40px #000,0 0 120px -20px rgba(53,72,200,.7);color:#F5F4EF}
.pcard::before{content:"";position:absolute;inset:-1px;border-radius:35px;padding:1px;background:linear-gradient(135deg,rgba(142,156,255,.9),rgba(232,207,160,.5),transparent 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.pc-tag{display:inline-flex;align-items:center;gap:10px;font:600 12px/1 var(--f-texte);letter-spacing:.14em;text-transform:uppercase;color:var(--dore);padding:8px 14px;border-radius:99px;background:rgba(232,207,160,.1);box-shadow:0 0 0 1px rgba(232,207,160,.28) inset}
.pc-tag i{width:7px;height:7px;border-radius:50%;background:currentColor;animation:ping 2.2s infinite}
.pc-head h2{font-size:clamp(28px,3vw,38px);letter-spacing:-.03em;color:#fff;margin-top:16px}
.pc-head p{margin-top:8px;color:var(--t-clair);font-size:15.5px}
.pc-prog[hidden]{display:none}
.pc-prog{display:flex;align-items:center;gap:14px;margin:22px 0 4px;font-size:13px;color:var(--t-clair)}
.pc-bar{flex:1;height:5px;border-radius:5px;background:rgba(255,255,255,.14);overflow:hidden}
.pc-bar i{display:block;height:100%;width:var(--p,50%);border-radius:5px;background:linear-gradient(90deg,var(--maj-clair),var(--dore));transition:width .5s var(--ease)}
.pstep{display:grid;gap:14px;margin-top:16px;animation:rise .5s var(--ease) both}
.pstep[hidden]{display:none}
.pl{font:600 12.5px var(--f-texte);letter-spacing:.1em;text-transform:uppercase;color:rgba(245,244,239,.7);margin-top:4px}
.pcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pcs.sm{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pc{position:relative;display:block}
.pc input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.pc span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:50px;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.07);box-shadow:0 0 0 1.5px rgba(255,255,255,.16) inset;font:500 15px/1.25 var(--f-texte);color:#F5F4EF;transition:background .2s,box-shadow .2s,transform .2s var(--ease)}
.pc:hover span{background:rgba(255,255,255,.12);transform:translateY(-2px)}
.pc input:checked+span{background:linear-gradient(135deg,var(--maj),#6B7BFF);box-shadow:0 0 0 1.5px rgba(255,255,255,.5) inset,0 14px 30px -14px rgba(107,123,255,.9);font-weight:600}
.pc input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
.pest{display:grid;gap:4px;padding:14px 18px;border-radius:18px;background:rgba(232,207,160,.12);box-shadow:0 0 0 1px rgba(232,207,160,.3) inset;animation:rise .4s var(--ease) both}
.pest[hidden]{display:none}
.pest strong{font:700 26px/1.1 var(--f-titre);letter-spacing:-.02em;color:#fff}.pest strong small{font:500 15px var(--f-texte);color:var(--t-clair)}
.pest span{font-size:14px;color:var(--t-clair);line-height:1.45}.pest span b{color:#fff}
.pgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pgrid .full{grid-column:1/-1}.pgrid .full[hidden]{display:none}
.pfd{display:grid;gap:6px}
.pfd span{font:600 12px var(--f-texte);letter-spacing:.08em;text-transform:uppercase;color:rgba(245,244,239,.7)}
.pfd input{width:100%;font:500 16px var(--f-texte);color:#fff;padding:13px 15px;border-radius:14px;border:0;background:rgba(255,255,255,.08);box-shadow:0 0 0 1.5px rgba(255,255,255,.18) inset;transition:box-shadow .2s,background .2s}
.pfd input::placeholder{color:rgba(245,244,239,.4)}
.pfd input:focus{outline:0;background:rgba(255,255,255,.12);box-shadow:0 0 0 2px var(--maj-clair) inset,0 0 24px -6px rgba(142,156,255,.8)}
.pfd input[aria-invalid]{box-shadow:0 0 0 2px #FF8A8A inset}
.pconsent{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5;color:var(--t-clair);cursor:pointer}
.pconsent input{margin-top:3px;width:18px;height:18px;accent-color:var(--maj-clair);flex:none}
.pcard .msg{min-height:20px;color:#FFB4B4;font-size:14px}
.pact{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.pback{all:unset;cursor:pointer;font:600 15px var(--f-texte);color:var(--t-clair);padding:10px 4px}.pback:hover{color:#fff}
.pcard .btn-lg{margin-inline-start:auto}
.pdone{display:grid;gap:14px;justify-items:start;margin-top:22px;animation:rise .6s var(--ease) both}
.pdone[hidden]{display:none}
.pdone .tick{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#1AAE78;box-shadow:0 0 0 10px rgba(26,174,120,.2)}
.pdone .tick .ico{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:2.4}
.pdone h3{font-size:34px;color:#fff;letter-spacing:-.03em}.pdone p{color:var(--t-clair)}
.pdone ul{list-style:none;margin:0;padding:0;width:100%;display:grid;gap:8px}
.pdone li{display:flex;justify-content:space-between;gap:14px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.07);font-size:14.5px}.pdone li span{color:var(--t-clair)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:1100px){
  .hx-pre{grid-template-columns:1fr}
  .pcard{justify-self:stretch;max-width:none}
  .hbg{right:-30%;opacity:.25}
}
@media (max-width:640px){
  .pcard{padding:26px 20px 22px;border-radius:28px}
  .pgrid{grid-template-columns:1fr}
  .pcs.sm{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pact{flex-direction:column-reverse;align-items:stretch}.pcard .btn-lg{margin-inline-start:0;justify-content:center}
}