:root{--bg:#070B14;--bg2:#0A1020;--ink:#EAF0FF;--mut:#94A2C4;--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.14);--blue:#2E5BF6;--blue2:#6D9BFF;--teal:#19D3CB;--tealD:#0A7873;--lbg:#F6F8FE;--link:#0B1524;--lmut:#54637E;--lline:rgba(11,21,36,.09)}
.kz *{box-sizing:border-box}
.kz{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5}
.kz svg{display:block}.kz a{color:inherit;text-decoration:none}
.kz .wrap{max-width:1320px;margin:0 auto;padding:0 26px}
.kz .btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14.5px;border-radius:11px;padding:12px 22px;transition:.18s;cursor:pointer;border:0}
.kz .btn-p{background:linear-gradient(180deg,#2E5BF6,#2348D6);color:#fff;box-shadow:0 8px 26px rgba(46,91,246,.4)}
.kz .btn-p:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(46,91,246,.55)}
.kz .btn-g{background:rgba(255,255,255,.05);color:#EAF0FF;border:1px solid var(--line2)}.kz .btn-g:hover{border-color:rgba(255,255,255,.36)}
.kz .btn-lp{background:linear-gradient(180deg,#2E5BF6,#2348D6);color:#fff}
.kz .btn-lg{background:#fff;color:#0B1524;border:1px solid var(--lline)}.kz .btn-lg:hover{border-color:var(--blue);color:var(--blue)}
.kz #glow{position:fixed;width:520px;height:520px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(46,91,246,.13),transparent 62%);transform:translate(-50%,-50%);left:50%;top:12%;transition:left .18s,top .18s;mix-blend-mode:screen}
.kz .rv{opacity:0;transform:translateY(24px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1)}
.kz .rv.in{opacity:1;transform:none}
/* NAV */
/* Geometrie de l'entete flottante : source unique. --nav-bot est son bord
   INFERIEUR (decalage haut + hauteur bordures comprises) : c'est la ligne
   sous laquelle tout le reste doit se caler. */
.kz{--nav-top:clamp(8px,1.2vw,15px);--nav-h:70px;--nav-bot:calc(var(--nav-top) + var(--nav-h));--toc-h:48px}
/* Barre flottante : decollee du haut, arrondie, rentree sur les cotes. Les valeurs clamp() gerent le mobile sans media-query dediee. */
.kz nav.kznav{position:fixed;top:var(--nav-top);left:0;right:0;margin:0 auto;width:calc(100% - clamp(16px,2.6vw,36px));max-width:1320px;z-index:60;backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);background:rgba(9,14,25,.78);border:1px solid var(--line2);border-radius:clamp(14px,1.6vw,22px);box-shadow:0 16px 40px rgba(0,0,0,.42)}
/* Petit ecran : le CTA passait sur deux lignes et remplissait toute la barre. Il reste accessible dans le menu burger, qui le contient deja. */
@media(max-width:640px){
 .kz nav.kznav .nav-cta .btn-p{display:none}
 .kz nav.kznav .nav-in{height:58px;padding:0 16px;gap:14px}
 /* Entete plus basse en mobile, et barre d'ancres masquee (voir plus bas). */
 .kz{--nav-h:60px;--toc-h:0px}
 .kz nav.kznav .nav-in .lg{height:20px}
}
.kz .nav-in{max-width:1320px;margin:0 auto;padding:0 26px;height:68px;display:flex;align-items:center;gap:28px}
.kz .nav-in .lg{height:23px;filter:brightness(0) invert(1);opacity:.96}
.kz .nlinks{display:flex;gap:22px;margin-left:6px}
.kz .hm{position:static}
.kz .hm>a{font-size:14.5px;font-weight:500;color:#C4CFE6;display:inline-flex;align-items:center;gap:6px;padding:10px 2px;cursor:pointer}
.kz .hm>a:after{content:"";width:6px;height:6px;border-right:2px solid #6b7ba0;border-bottom:2px solid #6b7ba0;transform:rotate(45deg);margin-top:-3px;transition:.15s}
.kz .hm:hover>a,.kz .hm:hover>a:after{color:#fff;border-color:#fff}
.kz .nlink{font-size:14.5px;font-weight:500;color:#C4CFE6;padding:10px 2px}.kz .nlink:hover{color:#fff}
.kz .mega{position:absolute;left:0;right:0;top:calc(100% + 10px);background:#0A1020;border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 60px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.16s;padding:26px 0;z-index:70}
/* Pont invisible : sans lui, traverser l'espace entre la barre et le panneau referme le menu. */
.kz .mega:before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.kz .hm:hover .mega,.kz .hm:focus-within .mega{opacity:1;visibility:visible;transform:none}
.kz .mwrap{max-width:1320px;margin:0 auto;padding:0 26px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px 28px}
.kz .mega.sm .mwrap{grid-template-columns:repeat(2,1fr);max-width:780px}
.kz .mcol h5{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#94A2C4;margin:2px 0 8px 10px}
.kz a.mi{display:flex;gap:11px;padding:9px 10px;border-radius:11px;align-items:flex-start}
.kz a.mi:hover{background:rgba(255,255,255,.05)}
.kz a.mi .mic{width:36px;height:36px;border-radius:9px;background:rgba(46,91,246,.16);color:#8FB2FF;display:grid;place-items:center;flex:none}.kz a.mi .mic svg{width:18px;height:18px}
.kz a.mi b{display:block;font-size:14px;font-weight:700;color:#EAF0FF}
.kz a.mi i{display:block;font-style:normal;font-size:12px;color:#8595B8;margin-top:2px}
.kz .nav-cta{margin-left:auto;display:flex;gap:12px;align-items:center}
.kz .seg{display:inline-flex;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:99px;padding:3px}
.kz .seg a{font-size:12.5px;font-weight:700;color:#9FB0D0;padding:6px 14px;border-radius:99px}.kz .seg a.on{background:#fff;color:#0A1020}
.kz .uswitch{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#CFE0FF;background:rgba(255,255,255,.06);border:1px solid var(--line2);border-radius:99px;padding:7px 15px;transition:.16s;white-space:nowrap}
.kz .uswitch:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.34);color:#fff}
.kz .uswitch svg{opacity:.85;flex:none}
.kz .uswitch b{font-weight:800;color:#fff}
.kz .burg{display:none;width:44px;height:40px;border:1px solid var(--line2);border-radius:10px;background:rgba(255,255,255,.05);cursor:pointer;align-items:center;justify-content:center}
.kz .burg span,.kz .burg span:before,.kz .burg span:after{content:"";display:block;width:18px;height:2px;background:#EAF0FF;border-radius:2px;position:relative}
.kz .burg span:before{position:absolute;top:-6px}.kz .burg span:after{position:absolute;top:6px}
/* HERO */
.kz .hero{position:relative;min-height:92vh;display:flex;align-items:center;padding:118px 0 78px;overflow:hidden}
.kz .hero.short{min-height:auto;padding:150px 0 90px}
.kz .mesh{position:absolute;inset:0;z-index:0}
.kz .mesh b{position:absolute;border-radius:50%;filter:blur(74px)}
.kz .mesh .m1{width:640px;height:640px;left:-150px;top:-170px;background:radial-gradient(circle,#2E5BF6,transparent 65%);opacity:.55;animation:kd1 19s ease-in-out infinite}
.kz .mesh .m2{width:560px;height:560px;right:-120px;top:-40px;background:radial-gradient(circle,#19D3CB,transparent 65%);opacity:.4;animation:kd2 23s ease-in-out infinite}
.kz .mesh .m3{width:520px;height:520px;left:36%;bottom:-240px;background:radial-gradient(circle,#5B3BF6,transparent 66%);opacity:.3;animation:kd3 27s ease-in-out infinite}
@keyframes kd1{50%{transform:translate(90px,70px) scale(1.1)}}@keyframes kd2{50%{transform:translate(-70px,60px) scale(1.08)}}@keyframes kd3{50%{transform:translate(60px,-50px) scale(1.12)}}
.kz .grid-o{position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 78% 60% at 42% 32%,#000,transparent 74%)}
.kz .hero-in{position:relative;z-index:3;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;width:100%}
.kz .hero.solo .hero-in{grid-template-columns:1fr;max-width:820px;text-align:center;margin:0 auto}
.kz .hero.solo .hero-cta,.kz .hero.solo .hero-mini{justify-content:center}
.kz .eb{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;letter-spacing:.04em;color:#B9C6E4;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:99px;padding:7px 15px;text-transform:uppercase}
.kz .eb .d{width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal)}
.kz h1{font-size:clamp(40px,6vw,78px);line-height:1.02;letter-spacing:-.035em;font-weight:800;margin:22px 0 22px}
.kz .hero.short h1,.kz .hero.solo h1{font-size:clamp(38px,5vw,62px)}.kz h1 .g,.kz .g{color:#6D9BFF;-webkit-text-fill-color:#6D9BFF}
@supports ((-webkit-background-clip:text) or (background-clip:text)){.kz h1 .g,.kz .g{background:linear-gradient(100deg,#6D9BFF,#19D3CB);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}}
.kz .lead{font-size:19px;color:var(--mut);max-width:540px;line-height:1.6}
.kz .hero.solo .lead{margin:0 auto}
.kz .hero-cta{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.kz .hero-mini{margin-top:26px;display:flex;gap:18px;flex-wrap:wrap;color:#AEBAD4;font-weight:700;font-size:13.5px}
.kz .hero-mini span{display:inline-flex;gap:7px;align-items:center}.kz .hero-mini i{color:var(--teal);font-style:normal}
/* floating panels (visuel héros) */
.kz .hviz{position:relative;min-height:430px}
.kz .pan{position:absolute;background:linear-gradient(180deg,rgba(22,30,52,.94),rgba(12,18,34,.94));border:1px solid var(--line2);border-radius:18px;box-shadow:0 44px 90px rgba(0,0,0,.6);backdrop-filter:blur(8px)}
.kz .pan.a{width:340px;top:8px;right:0;padding:17px;animation:kfl 7s ease-in-out infinite}
.kz .pan.b{width:255px;left:0;top:150px;padding:15px;animation:kfl 7s ease-in-out infinite .8s}
.kz .pan.c{width:245px;right:20px;bottom:0;padding:15px;animation:kfl 7s ease-in-out infinite 1.6s}
@keyframes kfl{50%{transform:translateY(-14px)}}
.kz .pr{display:flex;align-items:center;gap:11px;padding:7px 0}
.kz .pi{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:none;color:#fff}.kz .pi svg{width:18px;height:18px}
.kz .pt{font-size:12.5px;font-weight:700;color:#DCE5FA}.kz .pt i{display:block;font-style:normal;font-size:11px;color:#8595B8;font-weight:500;margin-top:1px}
.kz .pbar{height:7px;border-radius:9px;background:rgba(255,255,255,.08);margin:6px 0;overflow:hidden;position:relative}
.kz .pbar:after{content:"";position:absolute;inset:0;width:60%;border-radius:9px;background:linear-gradient(90deg,#3B6EF6,#19D3CB);animation:kpf 3s ease-in-out infinite}
@keyframes kpf{0%,100%{width:34%}50%{width:88%}}
.kz .chip{display:inline-flex;gap:6px;font-size:11px;font-weight:800;color:#0FB3AC;background:rgba(25,211,203,.12);border-radius:99px;padding:5px 11px}
/* hero slot (démo interactive ou visuel injecté) */
.kz .hslot{position:relative;z-index:3}
/* LOGO STRIP */
.kz .strip{position:relative;z-index:3;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;background:rgba(255,255,255,.015)}
.kz .strip .lb{font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#94A2C4;text-align:center;margin-bottom:16px}
.kz .strip .row{display:flex;gap:40px;justify-content:center;flex-wrap:wrap;opacity:1}
.kz .strip .row span{font-weight:800;font-size:16px;color:#8595B8;letter-spacing:-.01em}
/* SECTIONS */
.kz section.blk{position:relative;z-index:3;padding:100px 0}
.kz .zl{background:var(--lbg);color:var(--link)}
.kz .kick{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--tealD)}
.kz h2{font-size:clamp(30px,4vw,46px);line-height:1.06;letter-spacing:-.03em;font-weight:800;margin-top:12px}
.kz .zl h2{color:var(--link)}
.kz .sub{font-size:18px;margin-top:14px;max-width:580px;color:var(--mut)}
.kz .zl .sub{color:var(--lmut)}
.kz .center{text-align:center}.kz .center .sub{margin:14px auto 0}
/* FEATURE ROW */
.kz .frow{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.kz .frow.rev .ftx{order:2}
.kz .ftx h3{font-size:clamp(26px,3vw,38px);letter-spacing:-.025em;font-weight:800;line-height:1.1;margin:12px 0 14px}
.kz .ftx p{font-size:17px;line-height:1.65;color:var(--mut)}.kz .zl .ftx p{color:var(--lmut)}
.kz .flist{list-style:none;margin:22px 0 26px;display:flex;flex-direction:column;gap:12px}
.kz .flist li{display:flex;gap:11px;font-weight:600;font-size:15px}
.kz .flist li .c{color:var(--tealD);flex:none;font-weight:900}
.kz .fmore{font-weight:800;font-size:14.5px;color:var(--blue2);display:inline-flex;gap:7px}
.kz .zl .fmore{color:var(--blue)}
/* visual cards */
.kz .vcard{border-radius:20px;padding:22px;position:relative;overflow:hidden}
.kz .vcard.d{background:linear-gradient(180deg,#0E1526,#0A1020);border:1px solid var(--line2);box-shadow:0 40px 80px rgba(0,0,0,.5)}
.kz .vcard.l{background:#fff;border:1px solid var(--lline);box-shadow:0 30px 60px rgba(11,21,36,.12)}
.kz .vhd{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.kz .vdot{width:10px;height:10px;border-radius:50%}.kz .r{background:#F2A2A2}.kz .y{background:#F2D19A}.kz .gn{background:#A6DDB0}
.kz .vurl{margin-left:10px;font-size:11.5px;font-weight:700;padding:4px 12px;border-radius:7px}
.kz .vcard.d .vurl{background:rgba(255,255,255,.06);color:#8595AE}.kz .vcard.l .vurl{background:#F5F8FE;color:#586777;border:1px solid var(--lline)}
.kz .vrow{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;margin-bottom:9px}
.kz .vcard.d .vrow{background:rgba(255,255,255,.04)}.kz .vcard.l .vrow{background:#F7F9FD;border:1px solid var(--lline)}
.kz .vic{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:#fff;flex:none}.kz .vic svg{width:18px;height:18px}
.kz .vnm{font-size:13.5px;font-weight:700}.kz .vcard.d .vnm{color:#DCE5FA}.kz .vcard.l .vnm{color:#243349}
.kz .vnm i{display:block;font-style:normal;font-size:11.5px;font-weight:500;margin-top:1px}.kz .vcard.d .vnm i{color:#8595B8}.kz .vcard.l .vnm i{color:#586777}
.kz .vtag{margin-left:auto;font-size:11px;font-weight:800;color:var(--tealD);background:rgba(25,211,203,.14);border-radius:99px;padding:5px 11px}
.kz .vbubble{max-width:82%;padding:10px 13px;border-radius:14px;font-size:13px;font-weight:600;margin-bottom:8px}
.kz .vb-me{background:var(--blue);color:#fff;margin-left:auto;border-bottom-right-radius:4px}
.kz .vb-ai{background:rgba(25,211,203,.14);color:#7FE7E1;border-bottom-left-radius:4px}.kz .vcard.l .vb-ai{background:#E2F7F5;color:#0B4A44}
/* STATS */
.kz .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.kz .stat b{color:#EAF0FF;-webkit-text-fill-color:#EAF0FF}
@supports ((-webkit-background-clip:text) or (background-clip:text)){.kz .stat b{display:block;font-size:52px;font-weight:800;letter-spacing:-.03em;background:linear-gradient(180deg,#EAF0FF,#8FA3CC);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}}.kz .zl .stat b{color:#0B1524;-webkit-text-fill-color:#0B1524}
@supports ((-webkit-background-clip:text) or (background-clip:text)){.kz .zl .stat b{background:linear-gradient(180deg,#0B1524,#4B5E80);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}}
.kz .stat span{color:var(--mut);font-size:14px;font-weight:500}.kz .zl .stat span{color:var(--lmut)}
/* SUITE GRID */
.kz .sgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:44px}
.kz .scard{background:#fff;border:1px solid var(--lline);border-radius:16px;padding:22px 14px;display:flex;flex-direction:column;align-items:center;gap:11px;text-align:center;transition:.18s}
.kz .scard:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(11,21,36,.1);border-color:var(--blue)}
.kz .scard .si{width:44px;height:44px;border-radius:12px;background:#0B1120;display:grid;place-items:center}.kz .scard .si svg{width:22px;height:22px}
.kz .scard b{font-size:13.5px;color:var(--link)}
.kz .zl.dk .sgrid .scard{background:rgba(255,255,255,.03);border:1px solid var(--line2)}.kz .zl.dk .scard b{color:#EAF0FF}
/* COMPARE */
.kz .cmp{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:960px;margin:44px auto 0}
.kz .cc{border-radius:22px;padding:32px}
.kz .cc.bad{background:rgba(255,255,255,.03);border:1px dashed rgba(255,255,255,.16)}
.kz .cc.good{background:linear-gradient(160deg,rgba(46,91,246,.22),rgba(25,211,203,.12));border:1px solid var(--line2)}
.kz .cc h4{font-size:20px;font-weight:800}.kz .cc .cs{font-size:13px;color:var(--mut);margin:4px 0 18px}
.kz .cc ul{list-style:none;display:flex;flex-direction:column;gap:12px}.kz .cc li{display:flex;gap:11px;font-size:14.5px;font-weight:600;color:#C9D4EC}
.kz .cc li .x{color:#7C8AA5}.kz .cc li .c{color:var(--teal)}
/* PRICING (offres) */
.kz .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1040px;margin:44px auto 0;align-items:stretch}
.kz .tier{background:#fff;border:1.5px solid var(--lline);border-radius:20px;padding:30px 26px;display:flex;flex-direction:column;position:relative}
.kz .tier.pop{border-color:var(--blue);box-shadow:0 30px 66px rgba(46,91,246,.16)}
.kz .tier .lab{position:absolute;top:-13px;left:26px;font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--blue);padding:5px 14px;border-radius:99px}
.kz .tier h3{font-size:23px;font-weight:800;color:var(--link)}
.kz .tier .who{color:var(--lmut);font-size:13.5px;margin:5px 0 16px;min-height:38px}
.kz .tier .price{font-size:44px;font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--link)}
.kz .tier .price small{font-size:14px;font-weight:700;color:var(--lmut)}
.kz .tier ul{list-style:none;margin:18px 0 22px;display:flex;flex-direction:column;gap:11px}
.kz .tier li{display:flex;gap:10px;font-size:14.5px;color:#33415C;font-weight:500}.kz .tier li .c{color:var(--tealD);font-weight:900;flex:none}
.kz .tier .btn{width:100%;justify-content:center;margin-top:auto}
/* TESTIMONIALS */
.kz .refs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.kz .ref{background:#fff;border:1px solid var(--lline);border-radius:18px;padding:26px}
.kz .ref p{font-size:15.5px;color:#28344A;line-height:1.6;font-weight:500}
.kz .rm{display:flex;align-items:center;gap:12px;margin-top:18px}
.kz .ra{width:40px;height:40px;border-radius:50%;background:linear-gradient(160deg,#2E5BF6,#0A7873);color:#fff;display:grid;place-items:center;font-weight:900;font-size:15px}
.kz .rm b{font-size:14px;color:var(--link);display:block}.kz .rm i{font-style:normal;font-size:12.5px;color:var(--lmut)}
/* FAQ */
.kz .faq{max-width:800px;margin:44px auto 0;display:flex;flex-direction:column;gap:12px}
.kz .faq details{background:#fff;border:1px solid var(--lline);border-radius:14px;padding:4px 22px;transition:.2s}
.kz .faq details[open]{box-shadow:0 16px 36px rgba(11,21,36,.08)}
.kz .faq summary{list-style:none;cursor:pointer;font-weight:700;font-size:16.5px;color:var(--link);padding:18px 0;display:flex;align-items:center;justify-content:space-between;gap:16px}
.kz .faq summary::-webkit-details-marker{display:none}
.kz .faq .pl{width:14px;height:14px;position:relative;flex:none}
.kz .faq .pl:before,.kz .faq .pl:after{content:"";position:absolute;background:var(--blue);border-radius:2px}
.kz .faq .pl:before{top:6px;left:0;width:14px;height:2px}.kz .faq .pl:after{left:6px;top:0;width:2px;height:14px;transition:.2s}
.kz .faq details[open] .pl:after{transform:rotate(90deg);opacity:0}
.kz .faq p{color:var(--lmut);font-size:15px;line-height:1.6;padding:0 0 20px}
/* CTA */
.kz .cta-in{max-width:1000px;margin:0 auto;border:1px solid var(--line2);border-radius:28px;padding:70px 40px;text-align:center;background:radial-gradient(120% 150% at 50% 0%,rgba(46,91,246,.3),transparent 60%),linear-gradient(180deg,rgba(20,28,48,.7),rgba(10,16,32,.7));overflow:hidden;position:relative}
.kz .cta-in h2{font-size:clamp(32px,4.5vw,52px)}
.kz .cta-in p{color:var(--mut);font-size:18px;margin:16px auto 30px;max-width:520px}
.kz .cta-in .hero-cta{justify-content:center}
/* FOOTER */
.kz footer.kzf{position:relative;z-index:3;border-top:1px solid var(--line);padding:62px 0 32px;background:#05080F}
.kz .fcols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px}
.kz .fbrand .lg{height:24px;filter:brightness(0) invert(1);opacity:.95;margin-bottom:16px}
.kz .fbrand p{color:var(--mut);font-size:14px;max-width:280px;line-height:1.6}
.kz .fsoc{display:flex;gap:10px;margin-top:18px}
.kz .fsoc a{width:36px;height:36px;border-radius:9px;border:1px solid var(--line2);display:grid;place-items:center;color:#C4CFE6;font-weight:800;font-size:13px}
.kz .fcol h5{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#7C8AA5;margin-bottom:16px}
.kz .fcol a{display:block;color:#AEBAD4;font-size:14px;padding:6px 0}.kz .fcol a:hover{color:#fff}
.kz .fbase{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:44px;padding-top:24px;color:#94A2C4;font-size:13px}
.kz .fbase a{color:#8595B8}
/* MOBILE */
.kz .kzmob{display:none}
@media(max-width:940px){
 .kz .nlinks,.kz .nav-cta .seg,.kz .nav-cta .uswitch,.kz .nav-cta .btn-g{display:none}
 .kz .burg{display:inline-flex}
 .kz .hero-in,.kz .frow,.kz .cmp,.kz .stats,.kz .tiers,.kz .refs,.kz .fcols{grid-template-columns:1fr}
 .kz .hviz{display:none}.kz .sgrid{grid-template-columns:repeat(2,1fr)}
 .kz .frow.rev .ftx{order:0}.kz .stats{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){.kz .mesh b,.kz .pan,.kz .pbar:after{animation:none!important}.kz .rv{opacity:1!important;transform:none!important}}

.kz .bcards{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:48px}.kz .bcards>*{flex:0 1 calc((100% - 36px)/3);min-width:0}
.kz .bcard{background:#fff;border:1px solid var(--lline);border-radius:18px;padding:26px;transition:.2s}
.kz .zl .bcard{background:#fff}.kz section.blk:not(.zl) .bcard{background:rgba(255,255,255,.03);border:1px solid var(--line2)}
.kz .bcard:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(11,21,36,.1)}
.kz .bcard .bic{width:50px;height:50px;border-radius:14px;background:rgba(46,91,246,.14);border:1px solid var(--line2);display:grid;place-items:center;margin-bottom:16px}.kz .bcard .bic svg{width:24px;height:24px;stroke:#2E5BF6}
.kz section.blk:not(.zl) .bcard .bic svg{stroke:#8FB2FF}
.kz .bcard h4{font-size:17px;font-weight:800;color:var(--link)}.kz section.blk:not(.zl) .bcard h4{color:#EAF0FF}
.kz .bcard p{color:var(--lmut);font-size:14.5px;margin-top:9px;line-height:1.55}.kz section.blk:not(.zl) .bcard p{color:var(--mut)}
@media(max-width:900px){.kz .bcards>*{flex-basis:calc((100% - 18px)/2)}}
@media(max-width:520px){.kz .bcards>*{flex-basis:100%}}
.kz .rcards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.kz .rcard{display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid var(--line2);transition:.2s}
.kz .zl .rcard{background:#fff;border:1px solid var(--lline)}
.kz .rcard:hover{transform:translateY(-4px);border-color:var(--blue)}
.kz .rcard .ri{width:44px;height:44px;border-radius:12px;background:rgba(46,91,246,.16);display:grid;place-items:center}.kz .rcard .ri svg{width:22px;height:22px}
.kz .rcard b{font-size:16px;font-weight:800}.kz .zl .rcard b{color:var(--link)}
.kz .rcard .rg{font-size:13px;font-weight:800;color:var(--blue2)}.kz .zl .rcard .rg{color:var(--blue)}
@media(max-width:900px){.kz .rcards{grid-template-columns:1fr 1fr}}

body,.kz{background:#070B14}
body,.kz .hero-fx,body,.kz .leghero{padding-top:110px}
body,.kz.fcgp,body,.kz.fcpro{background:#070B14}

html:has(body.kz){background:#070B14}
body,.kz{background:#070B14!important}
.kz .hero{background:#070B14}
.kz .strip{background:#0A0F1A}
.kz section.blk{background:#070B14}
.kz section.blk.zl{background:var(--lbg)}
.kz .cta-in h2,.kz .hero h1,.kz .stat b{color:#EAF0FF}
.kz .zl .stat b{color:#0B1524}
/* Pages maquette/flagship (classe body 'fcmq') : design CLAIR, texte sombre.
   Elles portent 'kz' pour la nav/footer premium mais leur contenu (titres, textes,
   cartes blanches) est conçu pour un fond CLAIR. Sans correctif, le fond sombre
   global de body,.kz + .kz section.blk rend le texte sombre illisible (sombre sur
   sombre). On rétablit donc, pour ces pages uniquement, un fond clair sur le body
   et sur les sections de contenu .blk. Le héros et le CTA final (.blk.final)
   gardent volontairement leur fond sombre + texte clair. */
html:has(body.fcmq){background:#fff}
body.fcmq{background:#fff!important}
body.fcmq section.blk{background:#fff}
body.fcmq section.blk.alt{background:var(--lbg)}
body.fcmq section.blk.final,body.fcmq section.blk.dark{background:#070B14}

.fcgp .legal.fcpro .legal{background:#fff;border:1px solid #E3EAF6;border-radius:16px;padding:clamp(22px,4vw,36px);max-width:900px;margin:0 auto;box-shadow:0 12px 44px rgba(0,0,0,.20)}
.fcgp .legal h2.fcgp .legal h3.fcgp .legal h4.fcgp .legal strong.fcpro .legal h2.fcpro .legal h3.fcpro .legal h4.fcpro .legal strong{color:#0B1524}
.fcgp .legal p.fcgp .legal li.fcgp .legal address.fcpro .legal p.fcpro .legal li.fcpro .legal address{color:#28344A}

.post-content{background:#fff;border:1px solid #E3EAF6;border-radius:16px;box-shadow:0 12px 44px rgba(0,0,0,.20);padding:clamp(24px,4vw,44px);max-width:820px;margin:0 auto;font-size:17px;line-height:1.75;color:#28344A;overflow-wrap:break-word}
.post-content>*:first-child{margin-top:0}
.post-content h1.post-content h2.post-content h3.post-content h4.post-content h5{color:#0B1524;line-height:1.25;margin:1.7em 0 .5em;font-weight:800;letter-spacing:-.01em}
.post-content h2{font-size:25px}.post-content h3{font-size:20px}.post-content h4{font-size:17.5px}
.post-content p{margin:0 0 1.1em}
.post-content a{color:#2450E0;font-weight:600;text-decoration:underline}
.post-content ul.post-content ol{margin:0 0 1.1em;padding-left:24px}
.post-content li{margin:.4em 0}
.post-content img.post-content svg.post-content video.post-content iframe.post-content embed.post-content object{max-width:100%;height:auto;border-radius:12px;margin:1.2em auto;display:block}
.post-content svg{max-height:420px}
.post-content figure{margin:1.4em 0;max-width:100%}
.post-content figcaption{font-size:14px;color:#64748B;text-align:center;margin-top:8px}
.post-content blockquote{border-left:4px solid #2450E0;padding:8px 18px;color:#33415C;margin:1.3em 0;background:#F6F8FB;border-radius:0 12px 12px 0}
.post-content pre{background:#0B1524;color:#EAF0FF;padding:16px;border-radius:12px;overflow:auto;font-size:14px;margin:1.2em 0}
.post-content code{background:#F0F3FA;border:1px solid #E3EAF6;border-radius:6px;padding:1px 6px;font-size:.9em}
.post-content pre code{background:none;border:0;padding:0}
.post-content table{width:100%;border-collapse:collapse;margin:1.3em 0;font-size:15px;display:block;overflow-x:auto}
.post-content th.post-content td{border:1px solid #E3EAF6;padding:9px 12px;text-align:left}
.post-content th{background:#F3F6FC;color:#0B1524}
.post-content hr{border:0;border-top:1px solid #E3EAF6;margin:2em 0}
.post-back{max-width:820px;margin:28px auto 0}
.post-list-item{border-bottom:1px solid #E3EAF6;padding:18px 0}
.post-list-item:last-child{border-bottom:0}
.post-list-item h2{margin:0 0 .25em}
.post-list-item a.pl-title{color:#0B1524;text-decoration:none}
.post-list-item .pl-meta{margin:0;color:#64748B;font-size:13.5px}

.fcdemo{--blue:#2450E0;--blue-d:#1B3FB8;--blue-l:#3B62E8;--ink:#0B1524;--muted:#586777;--teal:#0A7873;--teal-d:#075E5A;--teal-l:#16C7C0;--soft:#F2F6FF;--line:#E3EAF6;--blue-050:#E9F0FF;--teal-050:#E2F7F5}
.fcdemo *{box-sizing:border-box}
.fcdemo{font-family:'Roboto Flex',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);line-height:1.45;-webkit-font-smoothing:antialiased}
.fcdemo .wrap{max-width:1320px;margin:0 auto;padding:0 22px}
.fcdemo svg{display:block}.fcdemo a{color:inherit}
.fcdemo .btn{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:16px;border-radius:14px;padding:15px 26px;text-decoration:none;border:0;cursor:pointer;transition:.15s}
.fcdemo .btn-blue{background:var(--blue);color:#fff;box-shadow:0 10px 26px rgba(36,80,224,.3)}
.fcdemo .btn-blue:hover{background:var(--blue-d);transform:translateY(-2px)}
.fcdemo .btn-teal{background:var(--teal);color:#fff;box-shadow:0 10px 26px rgba(14,165,160,.32)}
.fcdemo .btn-teal:hover{background:var(--teal-d);transform:translateY(-2px)}
.fcdemo .btn-ghost{background:#fff;color:var(--ink);border:2px solid var(--line)}
.fcdemo .btn-ghost:hover{border-color:var(--blue);color:var(--blue)}
.fcdemo .btn-white{background:#fff;color:var(--blue)}
/* switch + header */
.fcdemo .usw{background:#fff;border-bottom:1px solid var(--line)}
.fcdemo .usw-in{display:flex;justify-content:center;align-items:center;height:44px}
.fcdemo .usw-seg{display:inline-flex;background:#EEF2F9;border-radius:10px;padding:3px}
.fcdemo .usw-seg a{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:13.5px;color:var(--muted);text-decoration:none;padding:7px 20px;border-radius:8px}
.fcdemo .usw-seg a.on{background:var(--ink);color:#fff}
.fcdemo .usw-seg .dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}
.fcdemo .hd{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.fcdemo .hd-in{display:flex;align-items:center;gap:26px;height:74px}
.fcdemo .lg img{height:30px;width:auto;display:block}
.fcdemo .hd-cta{margin-left:auto;display:flex;gap:10px}
/* hero produit */
.fcdemo .phero{background:radial-gradient(1100px 460px at 8% -18%,var(--blue-050),transparent 60%),radial-gradient(860px 460px at 104% -12%,var(--teal-050),transparent 56%),#fff;padding:60px 0 40px}
.fcdemo .phero-in{display:grid;grid-template-columns:1fr 1.05fr;gap:44px;align-items:center}
.fcdemo .eb{display:inline-flex;align-items:center;gap:8px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;font-size:12.5px;color:var(--teal-d)}
.fcdemo .eb .d{width:7px;height:7px;border-radius:50%;background:var(--teal)}
.fcdemo .phero h1{font-size:50px;line-height:1.03;letter-spacing:-.03em;font-weight:900;margin:14px 0 16px;color:var(--ink)}
.fcdemo .phero h1 u{text-decoration:none;color:var(--blue)}
.fcdemo .phero .lead{font-size:19px;color:#94A2C4;max-width:520px;margin-bottom:26px;font-weight:500}
.fcdemo .phero-cta{display:flex;gap:12px;flex-wrap:wrap}
.fcdemo .reass{display:flex;gap:18px;flex-wrap:wrap;margin-top:24px;font-weight:800;font-size:13.5px;color:#2B3A55}
.fcdemo .reass span{display:inline-flex;align-items:center;gap:7px}
.fcdemo .reass .c{color:var(--teal-d)}
@media(max-width:900px){.fcdemo .phero-in{grid-template-columns:1fr}.fcdemo .phero h1{font-size:35px}}
/* mockup fenêtre */
.fcdemo .mk{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 40px 80px rgba(11,21,36,.16);overflow:hidden}
.fcdemo .mk-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#F7F9FD;border-bottom:1px solid var(--line)}
.fcdemo .mk-bar .b{width:11px;height:11px;border-radius:50%}
.fcdemo .mk-bar .r{background:#F2A2A2}.fcdemo .mk-bar .y{background:#F2D19A}.fcdemo .mk-bar .g{background:#A6DDB0}
.fcdemo .mk-bar .u{margin-left:12px;font-size:12px;color:#586777;font-weight:700;background:#fff;border:1px solid var(--line);border-radius:7px;padding:4px 12px}
.fcdemo .mk-body{display:flex;min-height:280px}
.fcdemo .mk-side{width:160px;background:#FAFBFE;border-right:1px solid var(--line);padding:14px 12px;flex:none}
.fcdemo .mk-side .si{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;font-size:12.5px;font-weight:700;color:#5B6B85}
.fcdemo .mk-side .si.on{background:var(--blue-050);color:var(--blue)}
.fcdemo .mk-side .si .dot{width:16px;height:16px;border-radius:5px;background:#DDE5F5;flex:none}
.fcdemo .mk-main{flex:1;padding:16px 18px}
.fcdemo .mk-row{display:flex;align-items:center;gap:12px;padding:11px 8px;border-radius:10px}
.fcdemo .mk-row:hover{background:#F5F8FE}
.fcdemo .mk-row .ic{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;color:#fff;flex:none}
.fcdemo .mk-row .nm{font-size:13.5px;font-weight:700;color:#243349}
.fcdemo .mk-row .mt{font-size:11.5px;color:#586777;margin-left:auto}
.fcdemo .mk-row .bar{height:8px;border-radius:99px;background:#EEF2F9;width:120px}
.fcdemo .mk-chip{display:inline-block;font-size:11px;font-weight:800;padding:4px 10px;border-radius:99px;background:var(--teal-050);color:var(--teal-d)}
/* animations douces du mockup (le visuel « prend vie ») */
@keyframes fcfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes fcpulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes fcrise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes fcsync{to{transform:rotate(360deg)}}
.fcdemo .mk{animation:fcfloat 6s ease-in-out infinite}
.fcdemo .mk-chip{animation:fcpulse 2.4s ease-in-out infinite}
.fcdemo .mk-row{animation:fcrise .55s ease both}
.fcdemo .mk-row:nth-child(3){animation-delay:.1s}
.fcdemo .mk-row:nth-child(4){animation-delay:.2s}
.fcdemo .mk-row:nth-child(5){animation-delay:.3s}
.fcdemo .mk-sync{display:inline-block;width:11px;height:11px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:fcsync .9s linear infinite;vertical-align:-1px;margin-right:5px}
@media(prefers-reduced-motion:reduce){.fcdemo .mk,.fcdemo .mk-chip,.fcdemo .mk-row,.fcdemo .mk-sync{animation:none!important}}
/* sections */
.fcdemo .sec{padding:58px 0}.fcdemo .sec.soft{background:var(--soft)}
.fcdemo .head{text-align:center;max-width:680px;margin:0 auto 36px}
.fcdemo .head .eb{justify-content:center;display:inline-flex}
.fcdemo .head h2{font-size:38px;line-height:1.05;letter-spacing:-.03em;font-weight:900;margin-top:8px}
.fcdemo .head p{color:var(--muted);font-size:17px;margin-top:11px}
/* bénéfices */
.fcdemo .bens{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.fcdemo .ben{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;transition:.18s}
.fcdemo .ben:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(11,21,36,.1);border-color:var(--blue-l)}
.fcdemo .ben .ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;color:#fff;margin-bottom:14px}
.fcdemo .ben h4{font-size:17px;font-weight:900}
.fcdemo .ben p{color:var(--muted);font-size:14px;margin-top:8px;font-weight:500}
@media(max-width:900px){.fcdemo .bens{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.fcdemo .bens{grid-template-columns:1fr}}
/* étapes */
.fcdemo .steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:920px;margin:0 auto}
.fcdemo .st3{text-align:center;position:relative}
.fcdemo .st3 .n{width:46px;height:46px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:900;margin:0 auto 14px}
.fcdemo .st3 h4{font-size:17px;font-weight:900}
.fcdemo .st3 p{color:var(--muted);font-size:14.5px;margin-top:7px}
@media(max-width:760px){.fcdemo .steps3{grid-template-columns:1fr}}
/* intégration */
.fcdemo .integ{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:820px;margin:0 auto}
.fcdemo .integ a{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px 18px;text-decoration:none;font-weight:800;font-size:14.5px;color:var(--ink);transition:.15s}
.fcdemo .integ a:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 14px 30px rgba(36,80,224,.12)}
.fcdemo .integ a .ic{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#fff}
/* strip */
.fcdemo .vstrip{background:var(--ink);color:#fff;border-radius:22px;padding:24px 30px;display:flex;gap:34px;flex-wrap:wrap;justify-content:center;text-align:center}
.fcdemo .vstrip .it b{display:block;font-size:22px;font-weight:900;color:var(--teal-l);letter-spacing:-.02em}
.fcdemo .vstrip .it span{font-size:13px;color:#aeb9cf;font-weight:600}
/* band */
.fcdemo .band{max-width:1040px;margin:0 auto;background:linear-gradient(120deg,var(--blue),var(--teal));color:#fff;border-radius:30px;padding:46px;text-align:center}
.fcdemo .band h3{font-size:31px;font-weight:900;letter-spacing:-.03em;max-width:620px;margin:0 auto}
.fcdemo .band p{opacity:.94;margin:12px auto 22px;max-width:520px;font-size:16px}
/* ===== HÉROS SOMBRE PREMIUM (option B : entrée sombre, corps clair) ===== */
.fcdemo .phero{position:relative;background:#070B14;overflow:hidden;padding:120px 0 66px;border-bottom:1px solid rgba(255,255,255,.08)}
.fcdemo .phero .mesh{position:absolute;inset:0;z-index:0}
.fcdemo .phero .mesh b{position:absolute;border-radius:50%;filter:blur(72px)}
.fcdemo .phero .mesh .m1{width:560px;height:560px;left:-120px;top:-150px;background:radial-gradient(circle,#2E5BF6,transparent 65%);opacity:.5;animation:phd1 19s ease-in-out infinite}
.fcdemo .phero .mesh .m2{width:520px;height:520px;right:-100px;top:-40px;background:radial-gradient(circle,#19D3CB,transparent 65%);opacity:.34;animation:phd2 23s ease-in-out infinite}
@keyframes phd1{50%{transform:translate(80px,60px) scale(1.1)}}
@keyframes phd2{50%{transform:translate(-60px,50px) scale(1.08)}}
.fcdemo .phero .pgrid{position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 60% at 40% 30%,#000,transparent 74%)}
.fcdemo .phero-in{position:relative;z-index:3}
.fcdemo .phero .eb{color:#B9C6E4;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:7px 14px;border-radius:99px}
.fcdemo .phero .eb .d{background:#19D3CB;box-shadow:0 0 10px #19D3CB}
.fcdemo .phero h1{color:#EAF0FF;-webkit-text-fill-color:#EAF0FF;letter-spacing:-.035em}.fcdemo .phero h1 u{color:#6D9BFF;-webkit-text-fill-color:#6D9BFF}
@supports ((-webkit-background-clip:text) or (background-clip:text)){.fcdemo .phero h1 u{text-decoration:none;background:linear-gradient(100deg,#6D9BFF,#19D3CB);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}}
.fcdemo .phero .lead{color:#94A2C4}
.fcdemo .phero .reass{color:#AEBAD4}
.fcdemo .phero .reass .c{color:#19D3CB}
.fcdemo .phero .btn-ghost{background:rgba(255,255,255,.05);color:#EAF0FF;border:1px solid rgba(255,255,255,.16)}
.fcdemo .phero .btn-ghost:hover{border-color:rgba(255,255,255,.4);color:#fff}
/* le mockup blanc de la démo devient un panneau "verre" qui ressort sur le sombre */
.fcdemo .phero .mk{box-shadow:0 50px 100px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.06)}
/* révélation au scroll (corps clair) */
.fcdemo .rv{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.fcdemo .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.fcdemo .phero .mesh b{animation:none!important}.fcdemo .rv{opacity:1!important;transform:none!important}}

/* ===== DÉMO INTERACTIVE (héros application) ===== */
.fcdemo .demo{width:100%}
.fcdemo .dtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.fcdemo .dtab{appearance:none;border:1.5px solid var(--line);background:#fff;color:#33415C;font-weight:800;font-size:13px;line-height:1;padding:9px 15px;border-radius:99px;cursor:pointer;transition:.15s;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.fcdemo .dtab:hover{border-color:var(--blue-l)}
.fcdemo .dtab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.fcdemo .dtab svg{width:15px;height:15px;flex:none;display:block}
.fcdemo .dstage .mk-body{min-height:300px;display:block;padding:0}
.fcdemo .dpanel{display:none;padding:18px}
.fcdemo .dpanel.on{display:block}
.fcdemo .dcap{margin-top:14px;font-size:14.5px;color:#94A2C4;font-weight:600;min-height:42px}
.fcdemo .dcap span{display:none}.fcdemo .dcap span.on{display:block}
.fcdemo .dhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.fcdemo .dhead b{font-size:14px;color:#0B1524;font-weight:800}
.fcdemo .dnote{font-size:11.5px;font-weight:800;color:var(--teal-d);background:var(--teal-050);border-radius:99px;padding:4px 10px;white-space:nowrap}
/* animations de base */
@keyframes dpop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes dfade{to{opacity:1}}
@keyframes dspin{to{transform:rotate(360deg)}}
/* ---- sync ---- */
.fcdemo .drow{display:flex;align-items:center;gap:11px;padding:11px;border-radius:11px;background:#F7F9FD;border:1px solid var(--line)}
.fcdemo .drow .ic{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:#fff;flex:none}
.fcdemo .drow .nm{font-size:13.5px;font-weight:700;color:#243349}
.fcdemo .drow .spin{margin-left:auto;width:17px;height:17px;border:2.5px solid var(--blue-050);border-top-color:var(--blue);border-radius:50%;animation:dspin .8s linear infinite}
.fcdemo .dbar{height:9px;border-radius:99px;background:#EEF2F9;margin:16px 0 8px;overflow:hidden}
.fcdemo .dbar i{display:block;height:100%;width:8%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--teal))}
.fcdemo .dpanel.on .dbar i{animation:dfill 2.1s cubic-bezier(.4,.5,.2,1) forwards}
@keyframes dfill{to{width:100%}}
.fcdemo .ddevs{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.fcdemo .ddev{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:12.5px;font-weight:700;color:#5B6B85;opacity:0}
.fcdemo .ddev em{color:var(--teal-d);font-style:normal;font-weight:900;opacity:0;transform:scale(.4)}
.fcdemo .dpanel.on .ddev{animation:dpop .45s ease forwards}
.fcdemo .dpanel.on .ddev em{animation:dck .3s cubic-bezier(.2,1.5,.4,1) forwards}
.fcdemo .dpanel.on .ddev:nth-child(1){animation-delay:.6s}.fcdemo .dpanel.on .ddev:nth-child(1) em{animation-delay:.95s}
.fcdemo .dpanel.on .ddev:nth-child(2){animation-delay:1.15s}.fcdemo .dpanel.on .ddev:nth-child(2) em{animation-delay:1.5s}
.fcdemo .dpanel.on .ddev:nth-child(3){animation-delay:1.7s}.fcdemo .dpanel.on .ddev:nth-child(3) em{animation-delay:2.05s}
@keyframes dck{to{opacity:1;transform:scale(1)}}
/* ---- action (lien / chips / bouton) ---- */
.fcdemo .dcardp{border:1px solid var(--line);border-radius:14px;padding:16px;background:#fff}
.fcdemo .dsub{display:flex;align-items:center;gap:8px;background:#F5F8FE;border:1px solid var(--line);border-radius:10px;padding:11px 12px;font-size:12.5px;color:#5B6B85;font-weight:600;margin-bottom:13px}
.fcdemo .dsub b{color:var(--blue);margin-left:auto;font-weight:800;white-space:nowrap;overflow:hidden;max-width:0;border-right:2px solid var(--blue)}
.fcdemo .dpanel.on .dsub b{animation:dtype 1.1s steps(10) forwards .3s,dcaret .5s step-end 5 .3s}
@keyframes dtype{to{max-width:140px}}
@keyframes dcaret{50%{border-color:transparent}}
.fcdemo .dchips{display:flex;gap:8px;flex-wrap:wrap}
.fcdemo .dchip{display:inline-flex;align-items:center;gap:6px;background:var(--blue-050);color:var(--blue);border-radius:99px;padding:7px 13px;font-size:12px;font-weight:800;opacity:0}
.fcdemo .dpanel.on .dchip{animation:dchin .45s cubic-bezier(.2,1.3,.4,1) forwards}
.fcdemo .dpanel.on .dchip:nth-child(1){animation-delay:.3s}.fcdemo .dpanel.on .dchip:nth-child(2){animation-delay:.55s}
.fcdemo .dpanel.on .dchip:nth-child(3){animation-delay:.8s}.fcdemo .dpanel.on .dchip:nth-child(4){animation-delay:1.05s}
.fcdemo .dpanel.on .dchip:nth-child(5){animation-delay:1.3s}
@keyframes dchin{from{opacity:0;transform:scale(.8) translateY(5px)}to{opacity:1;transform:none}}
.fcdemo .dbtn{margin-top:14px;position:relative;height:46px}
.fcdemo .dbtn .b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;font-weight:800;font-size:14px}
.fcdemo .dbtn .b1{background:var(--blue);color:#fff}
.fcdemo .dbtn .b2{background:var(--teal);color:#fff;opacity:0}
.fcdemo .dpanel.on .dbtn .b1{animation:dpress .5s ease 1.7s both}
.fcdemo .dpanel.on .dbtn .b2{animation:dfade .4s ease 2.15s forwards}
@keyframes dpress{40%{transform:scale(.95)}to{opacity:0}}
.fcdemo .dbtn.conn .bm{background:#0F2547;color:#fff;opacity:0}
.fcdemo .dbtn.conn .b1{animation:dfade2 .3s ease 1.5s forwards}
.fcdemo .dbtn.conn .bm{animation:dshow .3s ease 1.5s forwards,dfade2 .3s ease 2.7s forwards}
.fcdemo .dbtn.conn .b2{animation:dfade .4s ease 2.7s forwards}
.fcdemo .dbtn.conn .b1{opacity:1}
@keyframes dfade2{to{opacity:0}}@keyframes dshow{from{opacity:0}to{opacity:1}}
.fcdemo .bspin{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:dspin .7s linear infinite}
/* ---- liste (rangées qui arrivent) ---- */
.fcdemo .drows{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.fcdemo .dli{display:flex;align-items:center;gap:10px;padding:12px 13px;border-bottom:1px solid var(--line);opacity:0}
.fcdemo .drows .dli:last-child{border-bottom:0}
.fcdemo .dpanel.on .dli{animation:dliin .5s ease forwards}
.fcdemo .dpanel.on .dli:nth-child(1){animation-delay:.15s}.fcdemo .dpanel.on .dli:nth-child(2){animation-delay:.4s}
.fcdemo .dpanel.on .dli:nth-child(3){animation-delay:.65s}.fcdemo .dpanel.on .dli:nth-child(4){animation-delay:.9s}
@keyframes dliin{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none}}
.fcdemo .dli .dot{width:9px;height:9px;border-radius:50%;flex:none;background:var(--line)}
.fcdemo .dli .vn{font-size:13px;font-weight:800;color:#243349}
.fcdemo .dli .vd{font-size:12px;color:#586777}
.fcdemo .dli .tr{margin-left:auto}
.fcdemo .dli .trbtn{font-size:12px;font-weight:800;color:var(--blue);border:1px solid var(--line);border-radius:8px;padding:6px 12px}
.fcdemo .dpanel.on .trbtn{animation:dpulse 1.7s ease-in-out infinite 1.1s}
@keyframes dpulse{0%,100%{box-shadow:0 0 0 0 rgba(36,80,224,0)}50%{box-shadow:0 0 0 5px rgba(36,80,224,.12)}}
.fcdemo .dli .trtag{font-size:11px;font-weight:800;color:var(--teal-d);background:var(--teal-050);border-radius:99px;padding:4px 10px}
.fcdemo .dli .trck{width:22px;height:22px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900;opacity:0;transform:scale(.3)}
.fcdemo .dpanel.on .dli:nth-child(1) .trck{animation:dck .35s cubic-bezier(.2,1.5,.4,1) forwards .7s}
.fcdemo .dpanel.on .dli:nth-child(2) .trck{animation:dck .35s cubic-bezier(.2,1.5,.4,1) forwards .95s}
.fcdemo .dpanel.on .dli:nth-child(3) .trck{animation:dck .35s cubic-bezier(.2,1.5,.4,1) forwards 1.2s}
.fcdemo .dpanel.on .dli:nth-child(4) .trck{animation:dck .35s cubic-bezier(.2,1.5,.4,1) forwards 1.45s}
/* ---- document coédité (frappe multi-curseurs) ---- */
.fcdemo .ddoc{border:1px solid var(--line);border-radius:12px;background:#fff;padding:15px 17px;min-height:150px}
.fcdemo .ddoc .ph{display:flex;gap:-6px;margin-bottom:13px}
.fcdemo .ddoc .pa{width:26px;height:26px;border-radius:50%;color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);margin-right:-6px}
.fcdemo .dln{font-size:13.5px;color:#243349;line-height:1.9;white-space:nowrap;overflow:hidden;max-width:0;border-right:2px solid var(--au)}
.fcdemo .dpanel.on .dln:nth-child(2){animation:dtypeln 1.7s steps(38) forwards .4s,dcaretl .5s step-end 5 .4s}
.fcdemo .dpanel.on .dln:nth-child(3){animation:dtypeln 1.9s steps(42) forwards 2.3s,dcaretl .5s step-end 6 2.3s}
@keyframes dtypeln{to{max-width:100%}}
@keyframes dcaretl{50%{border-color:transparent}}
/* ---- chat + IA ---- */
.fcdemo .dchat{display:flex;flex-direction:column;gap:9px;min-height:180px}
.fcdemo .dmsg{max-width:84%;padding:10px 13px;border-radius:14px;font-size:13px;font-weight:600;line-height:1.45;opacity:0}
.fcdemo .dpanel.on .dmsg{animation:dmsgin .45s ease forwards}
.fcdemo .dpanel.on .dmsg:nth-child(1){animation-delay:.2s}.fcdemo .dpanel.on .dmsg:nth-child(2){animation-delay:.75s}
.fcdemo .dpanel.on .dmsg:nth-child(3){animation-delay:1.3s}.fcdemo .dpanel.on .dmsg:nth-child(4){animation-delay:1.85s}
.fcdemo .dmsg.them{background:#F2F4F9;color:#243349;align-self:flex-start;border-bottom-left-radius:4px}
.fcdemo .dmsg.me{background:var(--blue);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.fcdemo .dmsg.ai{background:var(--teal-050);color:#0B4A44;align-self:flex-start;border-bottom-left-radius:4px}
@keyframes dmsgin{from{opacity:0;transform:translateY(9px) scale(.98)}to{opacity:1;transform:none}}
.fcdemo .dtyp{align-self:flex-start;background:#F2F4F9;border-radius:14px;border-bottom-left-radius:4px;padding:12px 14px;display:inline-flex;gap:4px;opacity:0}
.fcdemo .dtyp i{width:6px;height:6px;border-radius:50%;background:#9AA6BD;animation:dbounce 1s infinite}
.fcdemo .dtyp i:nth-child(2){animation-delay:.15s}.fcdemo .dtyp i:nth-child(3){animation-delay:.3s}
@keyframes dbounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
.fcdemo .dpanel.on .dtyp{animation:dmsgin .35s ease forwards .6s,dtypout .3s ease forwards 1.9s}
@keyframes dtypout{to{opacity:0;transform:scale(.9);max-height:0;padding-top:0;padding-bottom:0;margin-top:-9px}}
.fcdemo .dmsg.ait{max-width:88%}
.fcdemo .dpanel.on .dmsg.ait{animation:dmsgin .4s ease forwards 1.9s}
.fcdemo .dmsg.ait .tw{display:inline-block;clip-path:inset(0 100% 0 0)}
.fcdemo .dpanel.on .dmsg.ait .tw{animation:dwipe 1.9s steps(40) forwards 2.1s}
@keyframes dwipe{to{clip-path:inset(0 0 0 0)}}
/* ---- appel visio ---- */
.fcdemo .dtiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.fcdemo .dtile{aspect-ratio:16/10;border-radius:12px;background:linear-gradient(135deg,#12294B,#1B3FB8);display:grid;place-items:center;position:relative;overflow:hidden;opacity:0}
.fcdemo .dpanel.on .dtile{animation:dpop .4s ease forwards}
.fcdemo .dpanel.on .dtile:nth-child(2){animation-delay:.1s}.fcdemo .dpanel.on .dtile:nth-child(3){animation-delay:.2s}
.fcdemo .dpanel.on .dtile:nth-child(4){animation-delay:.3s}.fcdemo .dpanel.on .dtile:nth-child(5){animation-delay:.4s}
.fcdemo .dpanel.on .dtile:nth-child(6){animation-delay:.5s}
.fcdemo .dtile .av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900;font-size:14px;border:2px solid rgba(255,255,255,.55)}
.fcdemo .dtile.spk{outline:2.5px solid var(--teal-l);outline-offset:-3px}
.fcdemo .dpanel.on .dtile.spk{animation:dpop .4s ease forwards,dspeak 2.2s ease-in-out infinite .6s}
@keyframes dspeak{0%,100%{box-shadow:inset 0 0 0 0 rgba(22,199,192,0)}50%{box-shadow:inset 0 0 0 4px rgba(22,199,192,.55)}}
.fcdemo .drec{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:900;color:#DF2A3E;letter-spacing:.05em;background:none}
.fcdemo .drec i{width:8px;height:8px;border-radius:50%;background:#DF2A3E;animation:dblink 1.2s infinite}
@keyframes dblink{50%{opacity:.25}}
.fcdemo .dcallbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.fcdemo .dwave{display:flex;align-items:flex-end;gap:3px;height:24px}
.fcdemo .dwave i{width:4px;height:6px;background:var(--teal);border-radius:2px;animation:dwv 1s ease-in-out infinite}
.fcdemo .dwave i:nth-child(1){animation-delay:0s}.fcdemo .dwave i:nth-child(2){animation-delay:.12s}
.fcdemo .dwave i:nth-child(3){animation-delay:.24s}.fcdemo .dwave i:nth-child(4){animation-delay:.36s}
.fcdemo .dwave i:nth-child(5){animation-delay:.48s}.fcdemo .dwave i:nth-child(6){animation-delay:.6s}
.fcdemo .dwave i:nth-child(7){animation-delay:.72s}
@keyframes dwv{0%,100%{height:6px}50%{height:22px}}
.fcdemo .dcallbar .dchip{opacity:1}
/* ---- kanban (carte qui traverse) ---- */
.fcdemo .dkb{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;position:relative}
.fcdemo .dcol{background:#F7F9FD;border:1px solid var(--line);border-radius:12px;padding:10px;min-height:160px}
.fcdemo .dcol h5{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;color:#586777;margin:0 0 9px;display:flex;justify-content:space-between}
.fcdemo .dcol h5 span{color:#586777}
.fcdemo .dcard{background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px 10px;font-size:12px;font-weight:700;color:#243349;margin-bottom:7px;box-shadow:0 2px 6px rgba(11,21,36,.05)}
.fcdemo .dfly{position:absolute;width:calc(33.33% - 22px);background:#fff;border:2px solid var(--blue);border-radius:9px;padding:9px 10px;font-size:12px;font-weight:800;color:var(--blue);box-shadow:0 14px 26px rgba(36,80,224,.24);top:40px;left:11px}
.fcdemo .dpanel.on .dfly{animation:dfly 5s ease-in-out infinite}
@keyframes dfly{0%,14%{left:11px;top:40px;transform:rotate(0)}20%{transform:rotate(-2deg)}
33%,47%{left:calc(33.33% + 6px);top:40px;transform:rotate(0)}53%{transform:rotate(-2deg)}
66%,92%{left:calc(66.66% + 1px);top:40px;transform:rotate(0)}100%{left:calc(66.66% + 1px);top:40px}}
/* ---- compteur ---- */
@property --num{syntax:"<integer>";inherits:false;initial-value:128}
.fcdemo .dcount{text-align:center;padding:8px 0 14px}
.fcdemo .dcount .big{font-size:48px;font-weight:900;color:var(--blue);letter-spacing:-.03em;line-height:1;counter-reset:num var(--num)}
.fcdemo .dcount .big::after{content:counter(num)}
.fcdemo .dpanel.on .dcount .big{animation:dnum 1.9s cubic-bezier(.3,.6,.2,1) forwards}
@keyframes dnum{from{--num:109}to{--num:128}}
.fcdemo .dcount .u{font-size:12px;font-weight:800;color:#586777;margin-top:6px}
/* ---- barres de résultats ---- */
.fcdemo .dbars{display:flex;flex-direction:column;gap:15px}
.fcdemo .dbl{display:flex;justify-content:space-between;font-size:12.5px;font-weight:800;color:#243349;margin-bottom:6px}
.fcdemo .dbl .pc{color:var(--blue)}
.fcdemo .dbt{height:13px;border-radius:99px;background:#EEF2F9;overflow:hidden}
.fcdemo .dbt i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--teal))}
.fcdemo .dpanel.on .dbt i{animation:dgrow 1.5s cubic-bezier(.2,.7,.2,1) forwards}
.fcdemo .dpanel.on .dbrow:nth-child(2) .dbt i{animation-delay:.2s}.fcdemo .dpanel.on .dbrow:nth-child(3) .dbt i{animation-delay:.4s}
@keyframes dgrow{to{width:var(--p)}}
/* ---- signature ---- */
.fcdemo .dsign{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}
.fcdemo .dsigrow{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.fcdemo .dsigrow .fic{font-size:10px;font-weight:900;color:#fff;background:#E2495C;border-radius:6px;padding:4px 7px;letter-spacing:.03em}
.fcdemo .dsigrow .nm{font-size:13px;font-weight:800;color:#243349}
.fcdemo .dpad{border:1.5px dashed var(--line);border-radius:10px;height:86px;display:grid;place-items:center;background:#FAFBFE}
.fcdemo .dpad svg{width:190px;height:58px}
.fcdemo .dpad path{fill:none;stroke:var(--ink);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:640;stroke-dashoffset:640}
.fcdemo .dpanel.on .dpad path{animation:dstroke 2.1s ease forwards .4s}
@keyframes dstroke{to{stroke-dashoffset:0}}
.fcdemo .dsign .sgbar{margin:13px 0 12px}
.fcdemo .dsign .sgbar i{width:0}
.fcdemo .dpanel.on .dsign .sgbar i{animation:dgrowto 2.4s ease forwards .5s}
@keyframes dgrowto{to{width:66%}}
.fcdemo .dsigners{display:flex;gap:8px}
.fcdemo .dsg{flex:1;display:flex;align-items:center;gap:7px;background:#F7F9FD;border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:12px;font-weight:800;color:#5B6B85}
.fcdemo .dsg .ck{width:19px;height:19px;border-radius:50%;background:var(--line);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900}
.fcdemo .dpanel.on .dsg:nth-child(1) .ck{animation:dgo .3s ease forwards .9s}
.fcdemo .dpanel.on .dsg:nth-child(2) .ck{animation:dgo .3s ease forwards 1.8s}
.fcdemo .dpanel.on .dsg:nth-child(3) .ck{animation:dgo .3s ease forwards 2.7s}
@keyframes dgo{to{background:var(--teal)}}
/* ---- sceau / preuve ---- */
.fcdemo .dseal{text-align:center;padding:8px 0 14px}
.fcdemo .dseal .badge{width:62px;height:62px;border-radius:50%;background:var(--teal-050);color:var(--teal-d);display:grid;place-items:center;margin:0 auto 10px;opacity:0}
.fcdemo .dseal .badge svg{width:30px;height:30px}
.fcdemo .dpanel.on .dseal .badge{animation:dstamp .6s cubic-bezier(.2,1.5,.35,1) forwards 1.15s}
@keyframes dstamp{from{opacity:0;transform:scale(1.7) rotate(-12deg)}to{opacity:1;transform:none}}
.fcdemo .dseal .st{font-size:13.5px;font-weight:900;color:var(--teal-d);opacity:0}
.fcdemo .dpanel.on .dseal .st{animation:dfade .4s ease forwards 1.55s}
/* ---- accessibilité : mouvement réduit ---- */
/* ---- bureautique : badge moteur, tableur, présentation, choix du moteur ---- */
.fcdemo .deng{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;color:#33415C;background:#F3F6FC;border:1px solid var(--line);border-radius:99px;padding:4px 10px;white-space:nowrap}
.fcdemo .deng .dengd{width:7px;height:7px;border-radius:50%;background:var(--blue)}
.fcdemo .dsheet{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.fcdemo .dsrow{display:grid;grid-template-columns:34px 1.4fr 1fr 1fr;opacity:0}
.fcdemo .dcell{padding:9px 11px;font-size:12.5px;color:#243349;border-right:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fcdemo .dsrow .dcell:last-child{border-right:0}
.fcdemo .dsheet .dsrow:last-child .dcell{border-bottom:0}
.fcdemo .dshead .dcell,.fcdemo .dcell.drow{background:#F3F6FC;color:#64748B;font-weight:700;text-align:center}
.fcdemo .dcell.dnum{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.fcdemo .dcell.dcellf{color:var(--blue);font-weight:800;background:rgba(36,80,224,.07);box-shadow:inset 0 0 0 2px var(--blue)}
.fcdemo .dpanel.on .dsrow{animation:dcin .45s ease forwards}
.fcdemo .dpanel.on .dsrow:nth-child(1){animation-delay:.04s}.fcdemo .dpanel.on .dsrow:nth-child(2){animation-delay:.13s}.fcdemo .dpanel.on .dsrow:nth-child(3){animation-delay:.22s}.fcdemo .dpanel.on .dsrow:nth-child(4){animation-delay:.31s}.fcdemo .dpanel.on .dsrow:nth-child(5){animation-delay:.4s}
.fcdemo .dpanel.on .dcell.dcellf{animation:dfpulse 1.7s ease .6s infinite}
@keyframes dfpulse{0%,100%{box-shadow:inset 0 0 0 2px var(--blue)}50%{box-shadow:inset 0 0 0 2px var(--blue),0 0 0 5px rgba(36,80,224,.14)}}
.fcdemo .dpres{display:flex;flex-direction:column;gap:12px}
.fcdemo .dslide{position:relative;border-radius:12px;background:linear-gradient(150deg,#0E2138,#12294B);color:#fff;padding:22px;min-height:146px;overflow:hidden;opacity:0}
.fcdemo .dpanel.on .dslide{animation:dcin .5s ease forwards}
.fcdemo .dsl-k{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8FB2FF}
.fcdemo .dsl-h{display:block;font-size:22px;font-weight:800;margin-top:8px;max-width:66%;line-height:1.15}
.fcdemo .dsl-b{display:block;height:6px;width:58%;background:rgba(255,255,255,.16);border-radius:3px;margin-top:14px}
.fcdemo .dsl-b.s{width:40%;margin-top:8px}
.fcdemo .dsl-chart{position:absolute;right:20px;bottom:20px;display:flex;align-items:flex-end;gap:6px;height:56px}
.fcdemo .dsl-chart i{width:12px;background:linear-gradient(180deg,#4B72F0,#19D3CB);border-radius:3px 3px 0 0;transform:scaleY(0);transform-origin:bottom}
.fcdemo .dpanel.on .dsl-chart i{animation:dgrow .6s ease forwards}
.fcdemo .dsl-chart i:nth-child(1){height:38%;animation-delay:.35s}.fcdemo .dsl-chart i:nth-child(2){height:70%;animation-delay:.48s}.fcdemo .dsl-chart i:nth-child(3){height:52%;animation-delay:.61s}.fcdemo .dsl-chart i:nth-child(4){height:90%;animation-delay:.74s}
@keyframes dgrow{to{transform:scaleY(1)}}
.fcdemo .dthumbs{display:flex;gap:8px}
.fcdemo .dth{width:54px;height:34px;border-radius:6px;border:1px solid var(--line);background:#fff;opacity:0}
.fcdemo .dpanel.on .dth{animation:dcin .4s ease forwards}
.fcdemo .dth.on{border-color:var(--blue);box-shadow:0 0 0 2px rgba(36,80,224,.2)}
.fcdemo .dpanel.on .dth:nth-child(1){animation-delay:.2s}.fcdemo .dpanel.on .dth:nth-child(2){animation-delay:.3s}.fcdemo .dpanel.on .dth:nth-child(3){animation-delay:.4s}.fcdemo .dpanel.on .dth:nth-child(4){animation-delay:.5s}
.fcdemo .dengs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fcdemo .dengc{border:1.5px solid var(--line);border-radius:12px;padding:14px 15px;background:#fff;opacity:0}
.fcdemo .dpanel.on .dengc{animation:dcin .5s ease forwards}
.fcdemo .dpanel.on .dengc:nth-child(2){animation-delay:.15s}
.fcdemo .dengc.on{border-color:var(--blue);box-shadow:0 8px 22px rgba(36,80,224,.12)}
.fcdemo .dengc-t{display:flex;align-items:center;justify-content:space-between}
.fcdemo .dengc-t b{font-size:15px;color:#0B1524;font-weight:800}
.fcdemo .dengc-ok{width:20px;height:20px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900}
.fcdemo .dengc i{display:block;font-style:normal;font-size:12.5px;color:#5B6576;margin-top:6px;line-height:1.45}
.fcdemo .dengnote{margin-top:12px;font-size:12.5px;color:#64748B;text-align:center}
@keyframes dcin{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
 .fcdemo .demo *{animation:none!important;transition:none!important}
 .fcdemo .demo .dbar i,.fcdemo .demo .dbt i,.fcdemo .demo .sgbar i{width:100%!important}
 .fcdemo .demo .dsl-chart i{transform:none!important}
 .fcdemo .demo .ddev,.fcdemo .demo .ddev em,.fcdemo .demo .dchip,.fcdemo .demo .dli,.fcdemo .demo .dmsg,.fcdemo .demo .dtile,.fcdemo .demo .dseal .badge,.fcdemo .demo .dseal .st,.fcdemo .demo .trck,.fcdemo .demo .dsrow,.fcdemo .demo .dslide,.fcdemo .demo .dth,.fcdemo .demo .dengc{opacity:1!important;transform:none!important}
 .fcdemo .demo .dsub b,.fcdemo .demo .dln{max-width:100%!important;border-right:0!important}
 .fcdemo .demo .dmsg.ait .tw{clip-path:none!important}
 .fcdemo .demo .dpad path{stroke-dashoffset:0!important}
 .fcdemo .demo .dbtn .b2{opacity:1!important}.fcdemo .demo .dbtn .b1,.fcdemo .demo .dbtn .bm{opacity:0!important}
 .fcdemo .demo .dtyp{display:none!important}
 .fcdemo .demo .dsg .ck{background:var(--teal)!important}
}
/* Sécurité : grille de piliers (réutilise .bcard) */
.kz .seccards{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:44px}.kz .seccards>*{flex:0 1 calc((100% - 54px)/4);min-width:0}
@media(max-width:900px){.kz .seccards>*{flex-basis:calc((100% - 18px)/2)}}
@media(max-width:520px){.kz .seccards>*{flex-basis:100%}}
/* Tableau des fonctionnalités */
.kz .ftable-w{max-width:1040px;margin:44px auto 0;border:1px solid var(--lline);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 20px 44px rgba(11,21,36,.06)}
.kz .ftable{width:100%;border-collapse:collapse;font-size:15px}
.kz .ftable th,.kz .ftable td{text-align:left;vertical-align:middle}
.kz .ftable tr.fcat th{background:#EEF3FC;padding:13px 22px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--tealD)}
.kz .ftable tr.fcat:not(:first-child) th{border-top:1px solid var(--lline)}
.kz .ftable tbody tr:not(.fcat){border-top:1px solid var(--lline)}
.kz .ftable td.fn{padding:13px 22px;font-weight:700;color:var(--link);width:30%}
.kz .ftable td.fd{padding:13px 16px;color:var(--lmut);font-size:14px;line-height:1.5}
.kz .ftable td.fck{padding:13px 22px;width:56px;text-align:right;white-space:nowrap}
.kz .ftable td.fck span{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(25,211,203,.14);color:var(--tealD);font-weight:900;font-size:13px}
@media(max-width:720px){
 .kz .ftable,.kz .ftable tbody,.kz .ftable tr,.kz .ftable td,.kz .ftable th{display:block;width:auto}
 .kz .ftable tr.fcat th{border-radius:0}
 .kz .ftable tbody tr:not(.fcat){position:relative;padding:12px 56px 12px 22px;border-top:1px solid var(--lline)}
 .kz .ftable td.fn,.kz .ftable td.fd,.kz .ftable td.fck{padding:0;width:auto}
 .kz .ftable td.fn{margin-bottom:3px}
 .kz .ftable td.fck{position:absolute;right:18px;top:14px}
}
/* Bandeau de confiance */
.kz .trustbar{position:relative;z-index:3;border-top:1px solid var(--line);background:rgba(255,255,255,.02)}
.kz .tb-in{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 22px;padding:15px 0}
.kz .tb-i{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#AEBAD4;white-space:nowrap}
.kz .tb-i svg{width:16px;height:16px;stroke:var(--teal);flex:none}
.kz .tb-sep{width:1px;height:16px;background:var(--line2)}
@media(max-width:640px){.kz .tb-sep{display:none}.kz .tb-in{gap:8px 16px;padding:13px 0}}
/* Sommaire sticky */
html{scroll-behavior:smooth}
/* Une ancre cliquee doit poser son titre sous les DEUX barres : l'entete
   flottante puis la barre d'ancres, plus une respiration. */
.kz #fonctions,.kz #securite,.kz #detail,.kz #faq{scroll-margin-top:calc(var(--nav-bot) + var(--toc-h) + 24px)}
/* L'entete etant flottante ET decalee du haut, la barre d'ancres se cale sous
   son bord inferieur, pas sous sa seule hauteur : sinon elle vient se coller
   dessous et disparait derriere elle au defilement. */
.kz .toc{position:sticky;top:calc(var(--nav-bot) + 10px);z-index:40;background:rgba(7,11,20,.86);backdrop-filter:saturate(1.4) blur(12px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.kz .toc-in{display:flex;gap:6px;align-items:center;height:46px;overflow-x:auto}
.kz .toc a{font-size:13px;font-weight:700;color:#9FB0D0;padding:8px 14px;border-radius:99px;white-space:nowrap;transition:.15s}
.kz .toc a:hover{color:#fff;background:rgba(255,255,255,.06)}
.kz .toc a.on{color:#fff;background:rgba(46,91,246,.22)}
@media(max-width:640px){.kz .toc{display:none}}
/* Migration */
.kz .migrate{max-width:1040px;margin:0 auto;border:1px solid var(--line2);border-radius:24px;padding:44px 40px;background:radial-gradient(120% 150% at 50% 0%,rgba(25,211,203,.14),transparent 60%),linear-gradient(180deg,rgba(20,28,48,.6),rgba(10,16,32,.6))}
.kz .migrate .mg-head{text-align:center;max-width:640px;margin:0 auto}
.kz .migrate h2{font-size:clamp(28px,3.5vw,40px)}
.kz .migrate .mg-sub{color:var(--mut);font-size:17px;margin:14px auto 0;max-width:600px}
.kz .msteps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.kz .mstep{background:rgba(255,255,255,.03);border:1px solid var(--line2);border-radius:16px;padding:22px;text-align:center}
.kz .mstep .mn{width:42px;height:42px;border-radius:50%;background:linear-gradient(180deg,#2E5BF6,#2348D6);color:#fff;display:grid;place-items:center;font-weight:800;margin:0 auto 12px}
.kz .mstep b{display:block;font-size:16px;font-weight:800;color:#EAF0FF}
.kz .mstep p{color:var(--mut);font-size:14px;margin-top:7px;line-height:1.5}
@media(max-width:760px){.kz .msteps{grid-template-columns:1fr}}

/* Le prix des offres : couleur pleine, jamais de dégradé — voir kz.css. */
.kz .tier .price,.fcgp .tier .price,.kz .tier .price-free,.fcgp .tier .price-free{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:#075E5A;-webkit-text-fill-color:#075E5A}
.kz .tier .price small,.fcgp .tier .price small{color:#54637E;-webkit-text-fill-color:#54637E}

/* ══ TEXTE EN DÉGRADÉ — RETIRÉ DE TOUT CE QUI PORTE DE L'INFORMATION ══════
   Historique, parce qu'il explique la décision :

   31/07, 23 h 59 — le prix « 0 € » de Share Free s'affiche en vert foncé sur
   un pavé bleu-turquoise. Cause : `background-clip:text` non appliqué, le
   dégradé peint donc un rectangle.
   1er/08 — après avoir mis la règle sous `@supports`, le prix ne s'affiche
   plus DU TOUT : le pavé reste seul. Ce second état est instructif — la règle
   protégée s'est appliquée, donc le moteur a répondu OUI au test de prise en
   charge, tout en ne découpant rien.

   Un test de fonctionnalité qui répond oui à tort ne protège de rien. Il n'y
   a donc pas de garde-fou possible pour cette technique, et deux tentatives
   ont suffi à l'établir. On la retire de tout ce qui doit être LU : prix,
   chiffres clés, mots de titre.

   Le moyen retenu est le seul qui ne dépende d'aucune prise en charge :
   `-webkit-text-fill-color: currentColor` — l'encre suit toujours `color`,
   quoi qu'il arrive au fond — et le dégradé est supprimé. Les blocs
   @supports plus haut deviennent inertes ; ils sont laissés en place, sans
   effet, pour que l'historique reste lisible dans le fichier.

   Ce qu'on perd : un effet de dégradé sur une dizaine de mots et de chiffres.
   Ce qu'on gagne : un prix qui s'affiche sur tous les navigateurs. */
.kz h1 .g,.kz .g,body.fcmq .g,.fcnum,.kz .stat b,.kz .zl .stat b,
.hero h1 .u,.stat .v,.kz .tier .price,.fcgp .tier .price{
  background-image:none !important;
  -webkit-text-fill-color:currentColor !important;
}
/* Chaque contexte garde une encre pleine lisible. */
.kz h1 .g,.kz .g{color:#6D9BFF}
body.fcmq .g,.kz .zl .g{color:#2E5BF6}
body.fcmq .hero .g,body.fcmq .ohero .g,body.fcmq .blk.dark .g,body.fcmq .blk.final .g{color:#6D9BFF}
.fcnum{color:#2E5BF6}
.kz .stat b{color:#EAF0FF}
.kz .zl .stat b{color:#0B1524}
.hero h1 .u,.stat .v{color:#2E5BF6}
/* Les prix payants gardent l'encre foncée du dessin d'origine ; seul le
   « 0 € » de l'offre gratuite est en turquoise, comme il l'était (en dégradé)
   avant. Ma première neutralisation les avait tous teintés — une correction
   ne doit pas emporter avec elle ce qui n'était pas cassé. */
.kz .tier .price,.fcgp .tier .price{color:#0B1524}
.kz .tier .price-free,.fcgp .tier .price-free{color:#075E5A}
.kz .tier .price small,.fcgp .tier .price small{color:#54637E}