:root{--ink:#050C18;--navy:#0A1A33;--panel:rgba(255,255,255,.03);--green:#00E0A4;--cyan:#22C7FF;--violet:#7C5CFF;--amber:#FFC24B;--lite:#D7E3F2;--mut:#8498B6;--line:rgba(255,255,255,.08)}
*{margin:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--lite);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.disp{font-family:'Bricolage Grotesque',sans-serif}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;padding:15px 26px;border-radius:14px;transition:.3s cubic-bezier(.2,.7,.2,1);font-size:15px;cursor:pointer}
.btn-p{background:linear-gradient(120deg,var(--green),var(--cyan));color:#04121f;box-shadow:0 10px 40px -12px rgba(0,224,164,.6)}
.btn-p:hover{transform:translateY(-3px);box-shadow:0 18px 50px -12px rgba(0,224,164,.75)}
.btn-a{background:linear-gradient(120deg,var(--amber),#ff9d3c);color:#2a1800;box-shadow:0 10px 40px -12px rgba(255,194,75,.55)}
.btn-a:hover{transform:translateY(-3px)}
.btn-g{border:1px solid var(--line);color:#fff;background:rgba(255,255,255,.02)}
.btn-g:hover{border-color:var(--green);color:var(--green)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:600;color:var(--green)}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--green),transparent)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* INTRO */
#intro{position:fixed;inset:0;z-index:200;background:radial-gradient(130% 100% at 50% 40%,#0C2036,var(--ink) 70%);display:grid;place-items:center;transition:opacity .9s ease,visibility .9s}
#intro.done{opacity:0;visibility:hidden;pointer-events:none}
.intro-stage{position:relative;display:grid;place-items:center;perspective:1200px}
.intro-glow{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(0,224,164,.35),transparent 62%);filter:blur(30px);animation:ib 2.6s ease-in-out infinite}
.intro-logo{width:220px;height:220px;transform-style:preserve-3d;animation:spin360 2.4s cubic-bezier(.3,.05,.2,1) forwards}
.intro-logo img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 30px rgba(0,224,164,.5))}
.intro-word{position:absolute;bottom:-58px;font-family:'Bricolage Grotesque';font-weight:800;font-size:32px;letter-spacing:1px;opacity:0;animation:iw .7s ease 2.6s forwards}
.intro-word .s{color:var(--green)}
.intro-ring{position:absolute;border:2px solid transparent;border-top-color:var(--cyan);border-radius:50%;animation:spin 3s linear infinite}
.intro-partners{position:absolute;bottom:-215px;text-align:center;opacity:0;animation:iw .6s ease 3.3s forwards;width:600px;max-width:94vw}
.intro-partners .lab{font-size:12px;letter-spacing:.2em;color:var(--mut);text-transform:uppercase}
.intro-partners .row{margin-top:14px;display:flex;gap:10px;justify-content:center;flex-wrap:nowrap}
.intro-partners .p{background:#fff!important;border:none!important;width:104px!important;height:50px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;flex:none}
@keyframes spin360{0%{transform:rotateY(0) scale(.3);opacity:0}25%{opacity:1}100%{transform:rotateY(720deg) scale(1);opacity:1}}
@keyframes iw{to{opacity:1;transform:translateY(0)}}
@keyframes ib{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:.8;transform:scale(1.08)}}
@keyframes spin{to{transform:rotate(360deg)}}
.skip{position:absolute;bottom:30px;right:30px;font-size:12px;color:var(--mut);cursor:pointer;border:1px solid var(--line);padding:7px 14px;border-radius:20px}
.skip:hover{color:#fff;border-color:var(--green)}

/* NAV + MEGA MENU */
nav{position:sticky;top:0;z-index:100;backdrop-filter:blur(14px);background:rgba(5,12,24,.78);border-bottom:1px solid var(--line)}
.nav-in{height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:42px;width:42px;object-fit:contain;transition:.5s cubic-bezier(.2,.7,.2,1)}
.brand:hover img{transform:rotate(360deg);filter:drop-shadow(0 0 12px rgba(0,224,164,.7))}
.brand .wm{font-family:'Bricolage Grotesque';font-weight:800;font-size:21px}
.brand .wm .s{color:var(--green)}
.links{display:flex;gap:28px;font-size:14.5px;font-weight:500;color:var(--mut);align-items:center}
.links>a,.has-menu>button{position:relative;padding:26px 0;color:var(--mut);background:none;border:none;font:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.links>a:hover,.has-menu:hover>button{color:#fff}
.chev{transition:.3s}.has-menu:hover .chev{transform:rotate(180deg)}
.has-menu{position:static}
.mega{position:absolute;left:0;right:0;top:74px;background:rgba(7,16,30,.98);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(0,0,0,.7);opacity:0;visibility:hidden;transform:translateY(-10px);transition:.28s cubic-bezier(.2,.7,.2,1)}
.has-menu:hover .mega,.mega:hover,.mega.open{opacity:1;visibility:visible;transform:none}
.mega-in{max-width:1200px;margin:0 auto;padding:30px 28px;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mega-col h5{font-family:'Bricolage Grotesque';font-weight:700;color:#fff;font-size:14px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.mega-col h5 i{width:8px;height:8px;border-radius:3px;background:linear-gradient(120deg,var(--green),var(--cyan))}
.mega-col a{display:block;color:var(--mut);font-size:13.5px;padding:7px 0;transition:.2s;border-radius:6px}
.mega-col a:hover{color:var(--green);padding-left:6px}
.mega-col a .free{font-size:10px;font-weight:700;color:var(--amber);border:1px solid rgba(255,194,75,.4);border-radius:20px;padding:1px 7px;margin-left:6px}
@media(max-width:960px){.links{display:none}}

/* HERO */
.hero{position:relative;overflow:hidden;min-height:90vh;display:flex;align-items:center}
.aurora{position:absolute;inset:-20%;z-index:0;filter:blur(60px);opacity:.75}
.aurora b{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:drift 18s ease-in-out infinite}
.a1{width:46vw;height:46vw;left:-6vw;top:-8vw;background:radial-gradient(circle,rgba(0,224,164,.5),transparent 60%)}
.a2{width:40vw;height:40vw;right:-6vw;top:2vw;background:radial-gradient(circle,rgba(34,199,255,.45),transparent 60%);animation-delay:-5s}
.a3{width:38vw;height:38vw;left:28vw;bottom:-14vw;background:radial-gradient(circle,rgba(124,92,255,.4),transparent 60%);animation-delay:-9s}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(5vw,3vw) scale(1.1)}66%{transform:translate(-4vw,2vw) scale(.95)}}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:56px 0}
.hero h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(38px,6vw,66px);line-height:1.02;letter-spacing:-1.5px;color:#fff}
.hero h1 .grad{color:var(--green)}
.hero p.sub{margin-top:22px;font-size:18px;color:var(--mut);max-width:520px;line-height:1.6}
.hero .ctas{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px}
.trust{margin-top:38px;display:flex;flex-wrap:wrap;gap:22px;align-items:center;color:var(--mut);font-size:13px}.trust b{color:var(--green)}
.hero-art{position:relative;display:grid;place-items:center;min-height:380px}
.ha-glow{position:absolute;width:120%;height:120%;background:radial-gradient(circle,rgba(0,224,164,.25),transparent 60%);filter:blur(40px);animation:ib 4s ease-in-out infinite}
.ha-ring{position:absolute;border:1.5px solid transparent;border-radius:50%}
.r1{width:92%;height:92%;border-top-color:rgba(0,224,164,.8);border-left-color:rgba(34,199,255,.4);animation:spin 12s linear infinite}
.r2{width:68%;height:68%;border-top-color:rgba(34,199,255,.7);border-right-color:rgba(124,92,255,.4);animation:spin 8s linear infinite reverse}
.r3{width:112%;height:112%;border-bottom-color:rgba(0,224,164,.35);animation:spin 20s linear infinite}
.ha-emb{width:60%;height:60%;object-fit:contain;animation:float 5s ease-in-out infinite;filter:drop-shadow(0 0 24px rgba(0,224,164,.45))}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.orb{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green)}
@media(max-width:960px){.hero-in{grid-template-columns:1fr}.hero-art{order:-1;min-height:260px}}

section{position:relative}.sec{padding:96px 0}
.sec-h{max-width:720px;margin-bottom:44px}
.sec-h h2{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(28px,4vw,44px);color:#fff;letter-spacing:-1px;margin-top:14px;line-height:1.1}
.sec-h p{margin-top:16px;color:var(--mut);font-size:17px;line-height:1.6}

/* PARTNERS showcase */
.part-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.part{border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:26px 18px;text-align:center;transition:.35s cubic-bezier(.2,.7,.2,1)}
.part:hover{transform:translateY(-6px);border-color:rgba(0,224,164,.5);background:rgba(0,224,164,.04)}
.part .mono{width:64px;height:64px;margin:0 auto 14px;border-radius:16px;display:grid;place-items:center;font-family:'Bricolage Grotesque';font-weight:800;font-size:22px;color:#04121f;background:linear-gradient(135deg,var(--green),var(--cyan))}
.part h4{font-family:'Bricolage Grotesque';color:#fff;font-size:16px}
.part .tag{font-size:12px;color:var(--green);margin-top:6px}
.part .cat{font-size:12px;color:var(--mut);margin-top:3px}
@media(max-width:860px){.part-grid{grid-template-columns:repeat(2,1fr)}}

/* FREE ISO AUDIT band */
.free-band{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(255,194,75,.3);background:linear-gradient(120deg,rgba(255,194,75,.1),rgba(0,224,164,.06));padding:48px;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
.free-band .pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,194,75,.15);border:1px solid rgba(255,194,75,.4);color:var(--amber);font-weight:700;font-size:12px;padding:6px 14px;border-radius:30px}
.free-band h2{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(26px,3.6vw,40px);color:#fff;margin-top:16px;letter-spacing:-.5px;line-height:1.08}
.free-band p{color:var(--mut);margin-top:14px;font-size:16px;line-height:1.6;max-width:480px}
.free-steps{margin-top:20px;display:flex;gap:18px;flex-wrap:wrap;color:var(--lite);font-size:14px}
.free-steps span{display:flex;align-items:center;gap:8px}.free-steps b{color:var(--amber)}
.gauge-card{background:rgba(5,12,24,.5);border:1px solid var(--line);border-radius:20px;padding:30px;text-align:center}
.gauge{position:relative;width:220px;height:130px;margin:0 auto}
.gauge .val{position:absolute;bottom:0;left:0;right:0;font-family:'Bricolage Grotesque';font-weight:800;font-size:40px;color:#fff}
.gauge .val small{display:block;font-size:12px;color:var(--mut);font-weight:500;margin-top:2px}
@media(max-width:860px){.free-band{grid-template-columns:1fr;padding:30px}}

/* SERVICES by family */
.fam{margin-top:40px}
.fam-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.fam-head .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:var(--green);background:rgba(0,224,164,.1);border:1px solid rgba(0,224,164,.25)}
.fam-head h3{font-family:'Bricolage Grotesque';font-weight:800;color:#fff;font-size:22px}
.fam-head p{color:var(--mut);font-size:13.5px;margin-top:2px}
.fam-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.scard{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:20px;transition:.3s cubic-bezier(.2,.7,.2,1);position:relative}
.scard:hover{transform:translateY(-5px);border-color:rgba(0,224,164,.5);background:rgba(0,224,164,.04)}
.scard h4{font-family:'Bricolage Grotesque';font-weight:700;color:#fff;font-size:15.5px}
.scard p{color:var(--mut);font-size:13px;margin-top:6px;line-height:1.5}
.scard .free{position:absolute;top:14px;right:14px;font-size:10px;font-weight:700;color:var(--amber);border:1px solid rgba(255,194,75,.4);border-radius:20px;padding:2px 8px}
@media(max-width:980px){.fam-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.fam-grid{grid-template-columns:1fr}}

/* transparence / articles / cta / footer (repris) */
.trans{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tcard{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:22px;position:relative}
.tcard h4{font-family:'Bricolage Grotesque';font-weight:700;color:#fff;font-size:16px}.tcard p{color:var(--mut);font-size:13px;margin-top:6px}
.tcard .dot{position:absolute;top:20px;right:20px;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:ib 2.4s ease-in-out infinite}
@media(max-width:860px){.trans{grid-template-columns:1fr 1fr}}
.arts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.art-c{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--panel);transition:.35s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
.art-c:hover{transform:translateY(-6px);border-color:rgba(34,199,255,.5)}
.art-top{height:120px;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--navy),var(--ink))}
.art-c .body{padding:22px;flex:1;display:flex;flex-direction:column}
.chip{align-self:flex-start;font-size:12px;font-weight:700;color:var(--cyan);background:rgba(34,199,255,.1);border:1px solid rgba(34,199,255,.25);padding:4px 10px;border-radius:20px}
.art-c h3{font-family:'Bricolage Grotesque';font-weight:700;color:#fff;font-size:18px;margin-top:12px;line-height:1.25}
.art-c p{color:var(--mut);font-size:13.5px;margin-top:8px;flex:1}.art-c .meta{color:#5a6f8e;font-size:12px;margin-top:14px}
@media(max-width:860px){.arts{grid-template-columns:1fr}}
.cta-band{position:relative;overflow:hidden;border-radius:28px;padding:66px 40px;text-align:center;border:1px solid var(--line);background:linear-gradient(120deg,rgba(0,224,164,.1),rgba(124,92,255,.08))}
.cta-band h2{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(28px,4.4vw,48px);color:#fff;letter-spacing:-1px}.cta-band p{color:var(--mut);margin-top:14px;font-size:17px}.cta-band .ctas{margin-top:28px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
footer{border-top:1px solid var(--line);margin-top:30px}
.foot{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:36px;padding:56px 0;font-size:14px;color:var(--mut)}
footer h4{font-family:'Bricolage Grotesque';color:#fff;margin-bottom:16px;font-size:15px}footer li{list-style:none;padding:4px 0}footer a:hover{color:var(--green)}
.foot-b{border-top:1px solid var(--line)}.foot-b .wrap{display:flex;justify-content:space-between;padding:20px 28px;font-size:12.5px;color:#5a6f8e;flex-wrap:wrap;gap:8px}
@media(max-width:760px){.foot{grid-template-columns:1fr 1fr}}
.motif{position:absolute;inset:0;width:100%;height:100%}
@keyframes mflow{to{stroke-dashoffset:-200}}@keyframes mpulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}@keyframes msweep{to{transform:rotate(360deg)}}@keyframes mblink{0%,100%{opacity:.25}50%{opacity:1}}@keyframes mpkt{0%{transform:translateX(0);opacity:0}10%{opacity:1}70%{opacity:1}100%{transform:translateX(130px);opacity:0}}@keyframes gauge{from{stroke-dashoffset:314}}
.mflow{stroke-dasharray:6 10;animation:mflow 2.4s linear infinite}.mpulse{animation:mpulse 2.6s ease-in-out infinite;transform-origin:center}.msweep{animation:msweep 5s linear infinite;transform-origin:center}.mblink{animation:mblink 1.8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}#intro{display:none}}


.crumb{display:flex;gap:8px;align-items:center;color:var(--mut);font-size:13px;margin-bottom:6px}.crumb a:hover{color:var(--green)}.crumb .sep{opacity:.5}
.phero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.phero .in{position:relative;z-index:2;padding:52px 0}
.phero h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(30px,5vw,50px);color:#fff;letter-spacing:-1px;margin-top:10px}
.phero p{color:var(--mut);font-size:18px;max-width:650px;margin-top:12px;line-height:1.6}
.quick{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.quick a{font-size:13px;color:var(--lite);border:1px solid var(--line);border-radius:30px;padding:8px 16px;background:rgba(255,255,255,.02);transition:.25s}.quick a:hover{border-color:var(--green);color:var(--green)}
.volet{border:1px solid var(--line);border-radius:18px;background:var(--panel);margin-bottom:14px;overflow:hidden;scroll-margin-top:90px}
.volet>summary{list-style:none;cursor:pointer;padding:22px 24px;display:flex;align-items:center;gap:16px}
.volet>summary::-webkit-details-marker{display:none}
.volet .vic{flex:none;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:var(--green);background:rgba(0,224,164,.1);border:1px solid rgba(0,224,164,.25)}
.volet summary h3{font-family:'Bricolage Grotesque';font-weight:700;color:#fff;font-size:18px}.volet summary p{color:var(--mut);font-size:13px;margin-top:2px}
.volet summary .chev{margin-left:auto;transition:.3s;color:var(--mut)}
.volet[open] summary .chev{transform:rotate(180deg)}
.volet[open]{border-color:rgba(0,224,164,.45);box-shadow:0 20px 60px -30px rgba(0,224,164,.3)}
.volet:target{border-color:rgba(0,224,164,.7)}
.vbody{padding:4px 24px 26px;border-top:1px solid var(--line)}
.vgrid{display:grid;grid-template-columns:1.7fr 1fr;gap:28px;margin-top:18px}
.vbody h4{font-family:'Bricolage Grotesque';color:#fff;font-size:15px;margin:16px 0 8px}.vbody p{color:var(--lite);line-height:1.7;font-size:14.5px;margin-bottom:8px}
.liv{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}.liv div{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:12px;padding:12px 14px;font-size:13.5px}.liv svg{flex:none;margin-top:2px;color:var(--green)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:6px}.stp{border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:12px;padding:14px}.stp .n{font-family:'Bricolage Grotesque';font-weight:800;color:var(--green);font-size:20px}.stp h5{font-family:'Bricolage Grotesque';color:#fff;margin-top:3px;font-size:14px}.stp span{color:var(--mut);font-size:12px}
.ben{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:6px}.ben li{display:flex;gap:10px;font-size:14px}.ben b{color:var(--green)}
.vside .box{border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:14px;padding:18px;margin-bottom:14px}.vside h4{font-family:'Bricolage Grotesque';color:#fff;font-size:14px;margin-bottom:8px}
.tech{display:flex;flex-wrap:wrap;gap:7px}.tech span{font-size:12px;color:var(--lite);border:1px solid var(--line);border-radius:7px;padding:3px 8px}
.vbanner{height:200px;border-radius:14px;overflow:hidden;border:1px solid var(--line);position:relative;background:linear-gradient(135deg,var(--navy),var(--ink));margin-bottom:14px}
.vbanner img.prod{position:absolute;right:4%;top:50%;transform:translateY(-50%);max-height:78%;filter:drop-shadow(0 16px 30px rgba(0,224,164,.25))}
@keyframes fabflow{to{stroke-dashoffset:-240}}.fabflow{animation:fabflow 2.6s linear infinite}@keyframes fabhalo{0%,100%{opacity:.3;transform:scale(.92)}50%{opacity:.65;transform:scale(1.05)}}.fabhalo{animation:fabhalo 3s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
/* pages dédiées (reprise) */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.prod{border:1px solid var(--line);border-radius:18px;background:linear-gradient(160deg,#0C1E3A,#070F1F);padding:22px;transition:.35s}.prod:hover{transform:translateY(-6px);border-color:rgba(0,224,164,.5)}.prod .im{height:140px;display:grid;place-items:center;margin-bottom:10px}.prod img{max-width:92%;max-height:140px;object-fit:contain}.prod h3{font-family:'Bricolage Grotesque';color:#fff;font-size:17px}.prod p{color:var(--mut);font-size:13px;margin-top:4px}
.part-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.pcard{border:1px solid var(--line);border-radius:20px;background:var(--panel);padding:28px;transition:.35s}.pcard:hover{transform:translateY(-6px);border-color:rgba(0,224,164,.5)}.pcard .mono{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;font-family:'Bricolage Grotesque';font-weight:800;font-size:24px;color:#04121f;background:linear-gradient(135deg,var(--green),var(--cyan))}.pcard h3{font-family:'Bricolage Grotesque';color:#fff;font-size:20px;margin-top:14px}.pcard .t{font-size:12px;color:var(--green);margin-top:4px}.pcard p{color:var(--mut);font-size:14px;margin-top:10px}
.free-band{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(255,194,75,.3);background:linear-gradient(120deg,rgba(255,194,75,.1),rgba(0,224,164,.06));padding:44px;display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}.free-band .pill{display:inline-flex;gap:8px;background:rgba(255,194,75,.15);border:1px solid rgba(255,194,75,.4);color:var(--amber);font-weight:700;font-size:12px;padding:6px 14px;border-radius:30px}.free-band h2{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(26px,3.6vw,38px);color:#fff;margin-top:16px;line-height:1.1}.free-band p{color:var(--mut);margin-top:14px;line-height:1.6}.gauge-card{background:rgba(5,12,24,.5);border:1px solid var(--line);border-radius:20px;padding:30px;text-align:center}.gauge{position:relative;width:220px;height:130px;margin:0 auto}.gauge .val{position:absolute;bottom:0;left:0;right:0;font-family:'Bricolage Grotesque';font-weight:800;font-size:40px;color:#fff}.gauge .val small{display:block;font-size:12px;color:var(--mut);font-weight:500}@keyframes gauge{from{stroke-dashoffset:314}}
.forti-row{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}.forti-row ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:9px}.forti-row li{display:flex;gap:10px}.forti-row li b{color:var(--green)}
.trans{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.tcard{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:22px;position:relative}.tcard h4{font-family:'Bricolage Grotesque';color:#fff;font-size:16px}.tcard p{color:var(--mut);font-size:13.5px;margin-top:6px}.tcard .dot{position:absolute;top:20px;right:20px;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
@media(max-width:900px){.vgrid,.free-band,.forti-row,.trans{grid-template-columns:1fr}.pgrid,.part-grid{grid-template-columns:1fr 1fr}.liv,.steps{grid-template-columns:1fr 1fr}}

.fam-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fcard{border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:8px;transition:.35s}
.fcard:hover{transform:translateY(-6px);border-color:rgba(0,224,164,.5);box-shadow:0 30px 70px -30px rgba(0,224,164,.35)}
.fcard .vic{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;color:var(--green);background:rgba(0,224,164,.1);border:1px solid rgba(0,224,164,.25)}
.fcard h3{font-family:'Bricolage Grotesque';color:#fff;font-size:19px}.fcard p{color:var(--mut);font-size:13.5px;flex:1}
.sec-h{max-width:720px;margin-bottom:30px}
@media(max-width:900px){.fam-cards{grid-template-columns:1fr}}


.pbadges{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.pbadge{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:14px;padding:12px 14px;transition:.3s}
.pbadge:hover{border-color:rgba(0,224,164,.5);transform:translateY(-3px)}
.pbadge .pm{flex:none;width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-family:'Bricolage Grotesque';font-weight:800;color:#04121f;background:linear-gradient(135deg,var(--green),var(--cyan))}
.pbadge b{display:block;color:#fff;font-size:13.5px;font-family:'Bricolage Grotesque'}.pbadge small{color:var(--mut);font-size:12px}
@media(max-width:900px){.pbadges{grid-template-columns:repeat(2,1fr)}}


/* --- Survol premium : agrandissement + halo + liseré animé --- */
.fcard,.volet,.pbadge,.prod,.pcard,.scard,.tcard{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s,background .35s}
.fcard{position:relative;overflow:hidden}
.fcard::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 50% 0%,rgba(0,224,164,.14),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
.fcard:hover{transform:translateY(-10px) scale(1.035);border-color:rgba(0,224,164,.65);box-shadow:0 40px 90px -30px rgba(0,224,164,.45),0 0 0 1px rgba(0,224,164,.25)}
.fcard:hover::before{opacity:1}
.fcard:hover .vic{transform:scale(1.12) rotate(-4deg);box-shadow:0 0 18px rgba(0,224,164,.55)}
.fcard .vic{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
/* volets : surbrillance + léger zoom au survol (sans ouvrir) */
.volet:hover{transform:scale(1.012);border-color:rgba(0,224,164,.55);box-shadow:0 26px 70px -34px rgba(0,224,164,.4)}
.volet:hover>summary .vic{transform:scale(1.1);box-shadow:0 0 16px rgba(0,224,164,.5)}
.volet>summary .vic{transition:transform .3s,box-shadow .3s}
.volet:hover>summary h3{color:var(--green)}
/* badges partenaires & cartes produits : pop au survol */
.pbadge:hover{transform:translateY(-5px) scale(1.04);border-color:rgba(0,224,164,.6);box-shadow:0 20px 50px -24px rgba(0,224,164,.45)}
.prod:hover,.pcard:hover{transform:translateY(-8px) scale(1.03);box-shadow:0 36px 80px -30px rgba(0,224,164,.4)}
@media(hover:none){.fcard:hover,.volet:hover,.pbadge:hover,.prod:hover,.pcard:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.fcard,.volet,.pbadge,.prod,.pcard{transition:none!important;transform:none!important}}


/* ===== PALETTE MIX (vert signature + cyan + ambre d'attention + profondeur violette) ===== */
:root{
  --ink:#070C16; /* fond un poil plus bleu-violet */
  --green:#00E6A6; --cyan:#2CC9FF; --violet:#8B6CFF; --amber:#FFB43C;
}
body{background:
  radial-gradient(60vw 60vw at 85% -10%, rgba(44,201,255,.07), transparent 60%),
  radial-gradient(55vw 55vw at -10% 10%, rgba(0,230,166,.07), transparent 60%),
  radial-gradient(50vw 50vw at 50% 120%, rgba(139,108,255,.08), transparent 60%),
  var(--ink);}
/* dégradés de titres : vert -> cyan -> violet, plus lumineux */
.hero h1 .grad,.phero .grad{color:var(--green)!important}
/* boutons primaires : vert->cyan */
.btn-p{background:linear-gradient(120deg,var(--green),var(--cyan))!important;color:#04121f!important;box-shadow:0 10px 40px -12px rgba(0,230,166,.55)!important}
/* boutons "attention" (audit) : ambre -> or */
.btn-a{background:linear-gradient(120deg,var(--amber),#ff8a3c)!important;color:#2a1600!important;box-shadow:0 10px 40px -12px rgba(255,180,60,.5)!important}
/* liseré de section (eyebrow) garde le vert ; variante ambre pour audit */
.eyebrow.amber{color:var(--amber)}.eyebrow.amber::before{background:linear-gradient(90deg,var(--amber),transparent)}
/* cartes : halo mixte au survol (vert + cyan) */
.fcard:hover{border-color:rgba(44,201,255,.6)!important;box-shadow:0 40px 90px -30px rgba(0,230,166,.4),0 0 0 1px rgba(44,201,255,.25)!important}
.fcard::before{background:radial-gradient(120% 120% at 50% 0%,rgba(44,201,255,.14),transparent 60%)!important}
.volet:hover{border-color:rgba(0,230,166,.55)!important}
.volet[open]{border-color:rgba(44,201,255,.45)!important}
/* chips techno : alterner subtilement cyan/vert via nth */
.tech span:nth-child(3n+1){border-color:rgba(0,230,166,.35);color:#bdeede}
.tech span:nth-child(3n+2){border-color:rgba(44,201,255,.35);color:#bfe9ff}
/* badges partenaires : pastille dégradé vert->cyan (déjà) ; HPE pastille cyan->violet pour varier */
.pbadge .pm{background:linear-gradient(135deg,var(--green),var(--cyan))}
/* CTA band : fond tri-ton */
.cta-band{background:linear-gradient(120deg,rgba(0,230,166,.1),rgba(44,201,255,.07),rgba(139,108,255,.09))!important}
/* audit free-band : accent ambre renforcé */
.free-band{border-color:rgba(255,180,60,.35)!important;background:linear-gradient(120deg,rgba(255,180,60,.12),rgba(0,230,166,.05))!important}


.hero h1 .grad,.phero .grad{display:inline-block;color:var(--green)}
/* --- FIX 2 : trop de vide sur l'accueil --- */
.hero{min-height:auto!important}
.hero-in{padding:48px 0 56px!important}
.sec{padding:64px 0!important}
#services{padding-top:24px!important}
.hero-art{min-height:300px!important}
@media(max-width:900px){.hero-in{padding:32px 0!important}}


.hero h1 .grad,.phero .grad{
  background:none!important;
  color:var(--green)!important;
  display:inline!important;padding:0!important;
}


/* pastilles logos partenaires : alignement propre */
.pbadge .pm{flex:none;min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pbadge .pm img{max-height:18px;width:auto;display:block}
.pbadge{align-items:center}
.pbadge span:last-child{min-width:0}
.pbadge b{white-space:nowrap}
/* cartes partenaires : logo centré dans une zone fixe */
.pcard .mono{display:flex;align-items:center;justify-content:center;min-height:56px}
.pcard .mono img{max-height:26px;width:auto}


.vmotif{height:auto!important;aspect-ratio:860/230;min-height:200px}
.vmotif svg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain!important}


.logochip{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:10px;padding:0 12px;height:44px;min-width:58px}
.logochip img{max-height:22px;width:auto;display:block}
/* version petite pour la bande accueil */
.logochip.sm{height:34px;min-width:46px;padding:0 9px}.logochip.sm img{max-height:16px}
/* neutraliser l'ancien style .pm/.mono quand ils contiennent un logo */
.pbadge .pm:has(img),.pcard .mono:has(img){background:none!important;border:none!important;padding:0!important;min-width:0!important;height:auto!important}


.pmarquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ptrack{display:flex;gap:18px;width:max-content;animation:pscroll 24s ease-in-out infinite}
.pmarquee:hover .ptrack{animation-play-state:paused}
@keyframes pscroll{0%{transform:translateX(0)}50%{transform:translateX(-50%)}100%{transform:translateX(0)}}50%{transform:translateX(calc(-100% + 100vw - 120px))}100%{transform:translateX(0)}}
.pitem{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:14px;padding:12px 18px;flex:none}
.plogo{flex:none;width:72px;height:44px;background:#fff;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.plogo img{max-height:26px;max-width:62px;width:auto;height:auto;object-fit:contain;display:block}
.pmeta b{display:block;color:#fff;font-size:14px;font-family:'Bricolage Grotesque';white-space:nowrap}
.pmeta small{color:var(--mut);font-size:11.5px;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.ptrack{animation:none;flex-wrap:wrap;justify-content:center}}


.stage3d{height:210px;position:relative;perspective:1100px;margin-top:6px}
.ring3d{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;animation:spin3d 22s linear infinite}
.stage3d:hover .ring3d{animation-play-state:paused}
@keyframes spin3d{to{transform:rotateY(360deg)}}
.c3d{position:absolute;left:-75px;top:-48px;width:150px;transform-style:preserve-3d;
  transform:rotateY(var(--ang)) translateZ(300px);}
.logo3d{height:56px;width:120px;margin:0 auto;background:#fff;border-radius:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 18px 50px -20px rgba(0,0,0,.6);backface-visibility:hidden}
.logo3d img{max-height:24px;max-width:96px;width:auto;height:auto;object-fit:contain;display:block}
.logo3d .q{font-family:'Bricolage Grotesque';font-weight:800;font-size:24px;color:#04121f}
.meta3d{text-align:center;margin-top:10px;backface-visibility:hidden}
.meta3d b{display:block;color:#fff;font-size:14px;font-family:'Bricolage Grotesque';white-space:nowrap}
.meta3d small{color:var(--mut);font-size:11.5px}
/* contre-rotation pour garder les logos face caméra */
.ring3d{}
@media(max-width:760px){.stage3d{height:200px;perspective:800px}.c3d{transform:rotateY(var(--ang)) translateZ(240px)}}
@media(prefers-reduced-motion:reduce){.ring3d{animation:none}.c3d{position:relative;left:auto;top:auto;transform:none;display:inline-block;margin:8px}.stage3d{height:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:14px}}


.intro-partners .p{background:#fff!important;border:none!important;width:104px!important;height:50px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;flex:none}
.intro-partners .p img{max-height:22px!important;max-width:84px!important;width:auto!important;height:auto!important;object-fit:contain}


.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.kpi{background:var(--ink);padding:30px 20px;text-align:center}
.kpi .n{font-family:'Bricolage Grotesque';font-weight:800;font-size:clamp(28px,4vw,44px);color:var(--green)}
.kpi .l{color:var(--mut);font-size:13px;margin-top:6px}
.clients{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:34px}
.client{height:66px;border:1px dashed var(--line);border-radius:14px;display:flex;align-items:center;justify-content:center;color:#44586f;font-size:12px;background:rgba(255,255,255,.015);transition:.3s}
.client:hover{border-color:rgba(0,230,166,.4);color:var(--mut)}
.tmos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tmos[data-count="1"]{grid-template-columns:1fr;max-width:560px;margin:0 auto}
.tmos[data-count="2"]{grid-template-columns:repeat(2,1fr)}
.tmo{border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:18px;padding:26px;margin:0;position:relative;transition:.35s cubic-bezier(.2,.7,.2,1)}
.tmo:hover{transform:translateY(-6px);border-color:rgba(0,230,166,.45);box-shadow:0 26px 60px -30px rgba(0,230,166,.35)}
.tmo::before{content:"\201C";position:absolute;top:8px;left:18px;font-family:Georgia,serif;font-size:56px;color:rgba(0,230,166,.25);line-height:1}
.tmo p{color:var(--lite);line-height:1.6;font-size:14.5px;margin:10px 0 16px}
.tmo figcaption{display:flex;align-items:center;gap:10px}
.tmo figcaption img{width:34px;height:34px;border-radius:8px;object-fit:contain;background:#fff;padding:3px;flex-shrink:0}
.tmo figcaption b{color:#fff;font-family:'Bricolage Grotesque';font-size:14px;display:block}
.tmo figcaption span{color:var(--mut);font-size:12.5px}
@media(max-width:900px){.kpis{grid-template-columns:1fr 1fr}.clients{grid-template-columns:repeat(3,1fr)}.tmos{grid-template-columns:1fr!important;max-width:none}}


.hero-art{min-height:480px}
.hero3d-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.ha-glow{z-index:0}
@media(max-width:860px){.hero-art{min-height:360px}}


.globe3d{position:relative;max-width:640px;margin:0 auto 10px;height:360px}
.globe3d canvas{width:100%;height:100%;display:block}
.globe-cap{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);font-size:12.5px;color:var(--mut);text-align:center;width:90%}
.globe-cap span{color:var(--green);font-weight:700}
@media(max-width:640px){.globe3d{height:280px}}


.fcard,.pcard{will-change:transform;transition:transform .18s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.tilt-on{box-shadow:0 26px 60px -24px rgba(0,230,166,.45)!important}


@keyframes mflow{to{stroke-dashoffset:-240}}@keyframes mpulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes msweep{to{transform:rotate(360deg)}}@keyframes mblink{0%,100%{opacity:.25}50%{opacity:1}}@keyframes pkt{0%{transform:translateX(0);opacity:0}10%{opacity:1}70%{opacity:1}100%{transform:translateX(150px);opacity:0}}
@keyframes mexp{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.25)}}@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-120px);opacity:0}}@keyframes mfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.mf{stroke-dasharray:6 10;animation:mflow 2.4s linear infinite}.mb{animation:mblink 1.7s ease-in-out infinite}.msw{animation:msweep 5s linear infinite;transform-origin:center}.mx{animation:mexp 3s ease-out infinite;transform-origin:center}.mfl{animation:mfloat 4s ease-in-out infinite}.md{stroke-dasharray:3 6;animation:mflow 1.5s linear infinite}
.vmotif{height:180px;border-radius:14px;overflow:hidden;position:relative;border:1px solid var(--line);background:linear-gradient(135deg,var(--navy),var(--ink));margin-bottom:16px}
.vmotif .lbl{position:absolute;top:12px;left:14px;z-index:2;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--green);background:rgba(7,12,22,.6);padding:4px 10px;border-radius:20px}
@media(prefers-reduced-motion:reduce){.vmotif svg *{animation:none!important}}


@keyframes mflow{to{stroke-dashoffset:-240}}@keyframes mblink{0%,100%{opacity:.3}50%{opacity:1}}@keyframes msweep{to{transform:rotate(360deg)}}
@keyframes mfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-120px);opacity:0}}
@keyframes ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}
@keyframes ecg{to{stroke-dashoffset:-1000}}@keyframes scanx{0%,100%{transform:translate(120px,70px)}50%{transform:translate(620px,150px)}}
@keyframes flick{0%,100%{transform:translate(400px,120px) scaleY(1)}50%{transform:translate(400px,120px) scaleY(1.12)}}
@keyframes ringb{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}@keyframes spinM{to{transform:rotate(360deg)}}
.mf{stroke-dasharray:6 10;animation:mflow 2.4s linear infinite}.md{stroke-dasharray:4 7;animation:mflow 1.6s linear infinite}
.mb{animation:mblink 1.7s ease-in-out infinite}.msw{animation:msweep 5s linear infinite;transform-origin:center}
.mfl{animation:mfloat 4s ease-in-out infinite}.ping{animation:ping 2s ease-out infinite;transform-box:fill-box;transform-origin:center}
.halo{animation:mblink 2.6s ease-in-out infinite}.ecg{animation:ecg 3s linear infinite}
.scanx{animation:scanx 4s ease-in-out infinite}.flick{animation:flick 1.1s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom center}
.ring{animation:ringb 1s ease-in-out infinite;transform-box:fill-box;transform-origin:top center}.spin{animation:spinM 14s linear infinite;transform-box:fill-box;transform-origin:center}
@media(prefers-reduced-motion:reduce){svg *{animation:none!important}}

@keyframes riseIn{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}.riseIn{animation:riseIn .6s ease forwards;transform-box:fill-box}

.phero{min-height:320px;position:relative;overflow:hidden}
.phero3d{position:absolute;top:0;right:0;width:50%;height:100%;z-index:1;display:block;pointer-events:none}
.phero .aurora{z-index:0}.phero .in{position:relative;z-index:2}
@media(max-width:860px){.phero3d{width:100%;opacity:.45}.phero{min-height:250px}}


.it360{border:1px solid rgba(0,230,166,.3);border-radius:24px;background:linear-gradient(120deg,rgba(0,230,166,.08),rgba(44,201,255,.05),rgba(139,108,255,.06));padding:34px}
.it360-head{max-width:720px}.it360-head h2{font-family:'Bricolage Grotesque';font-weight:800;color:#fff;font-size:clamp(26px,3.6vw,36px);margin-top:8px}
.it360-head p{color:var(--mut);margin-top:12px;line-height:1.6}
.it360-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
.it360-card{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:16px;padding:20px;transition:.35s cubic-bezier(.2,.7,.2,1);position:relative}
.it360-card:hover{transform:translateY(-6px);border-color:rgba(0,230,166,.5);box-shadow:0 26px 60px -30px rgba(0,230,166,.4)}
.it360-logo{height:46px;width:92px;background:#fff;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:12px}
.it360-logo img{max-height:22px;max-width:80px;width:auto;height:auto;object-fit:contain}
.it360-card h4{font-family:'Bricolage Grotesque';color:#fff;font-size:16px}.it360-card p{color:var(--mut);font-size:13px;margin-top:6px;line-height:1.5}
.it360-card .opt{display:inline-block;margin-top:10px;font-size:10.5px;font-weight:700;color:var(--green);border:1px solid rgba(0,230,166,.4);border-radius:20px;padding:2px 10px}
.it360-cta{margin-top:24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.it360-note{color:var(--mut);font-size:13px}
@media(max-width:900px){.it360-grid{grid-template-columns:1fr 1fr}}

@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin 3.5s linear infinite}

@keyframes mflow{to{stroke-dashoffset:-240}}@keyframes mblink{0%,100%{opacity:.3}50%{opacity:1}}@keyframes msweep{to{transform:rotate(360deg)}}
@keyframes mexp{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.25)}}@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-120px);opacity:0}}
@keyframes ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
.mf{animation:mflow 2.4s linear infinite}.mb{animation:mblink 1.7s ease-in-out infinite}.msw{animation:msweep 5s linear infinite;transform-origin:center}
.mx{animation:mexp 3s ease-out infinite;transform-origin:center;transform-box:fill-box}.halo{animation:mblink 2.6s ease-in-out infinite}
.ping{animation:ping 2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@media(prefers-reduced-motion:reduce){svg *{animation:none!important}}

/* --- Parcours 3D du câble à la conformité --- */
.journey{position:relative;height:600vh;background:linear-gradient(180deg,transparent,rgba(0,230,166,.02),transparent)}
.journey-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center}
#journey3d{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.journey-overlay{position:relative;z-index:1;pointer-events:none}
.journey-overlay .eyebrow{justify-content:flex-start}
.j-h{font-weight:800;color:#fff;font-size:clamp(26px,4vw,44px);letter-spacing:-1px;margin:10px 0 26px;max-width:620px}
.j-steps{display:flex;flex-direction:column;gap:8px;max-width:470px}
.j-step{border-left:2px solid rgba(255,255,255,.1);padding:8px 0 8px 16px;opacity:.35;transition:opacity .4s,border-color .4s,transform .4s}
.j-step.active{opacity:1;border-left-color:var(--green,#00E6A6);transform:translateX(6px)}
.j-step b{display:block;color:#fff;font-size:15px}
.j-step span{font-size:13px;color:var(--mut,#8498B6)}
@media(max-width:860px){.journey{height:520vh}.j-h{font-size:26px}.j-steps{max-width:90%}}

/* --- Galerie réalisations --- */
.gal{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:14px}
.gal figure{position:relative;margin:0;border-radius:16px;overflow:hidden;border:1px solid var(--line,rgba(255,255,255,.08));aspect-ratio:4/3;background:#0b1726}
.gal img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.gal figure:hover img{transform:scale(1.06)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:linear-gradient(transparent,rgba(5,12,24,.9));color:#fff;font-weight:600;font-size:14px}
.gal .g1{grid-column:span 2;grid-row:span 2}
@media(max-width:760px){.gal{grid-template-columns:repeat(2,1fr)}.gal .g1{grid-column:span 2;grid-row:auto}}

/* --- Hero cinématique : sphère 3D en fond plein écran + voile lisibilité --- */
.hero{min-height:94vh}
.hero .hero-art{position:static!important;min-height:0!important}
.hero #net3d{position:absolute!important;inset:0;width:100%!important;height:100%!important;left:0;top:0;z-index:0;opacity:.95}
.hero .aurora{z-index:0}
.hero .hero-in{position:relative;z-index:2}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(130% 90% at 72% 48%, transparent 0%, rgba(5,12,24,.35) 72%),
    linear-gradient(90deg, rgba(5,12,24,.95) 0%, rgba(5,12,24,.80) 44%, rgba(5,12,24,.28) 68%, transparent 86%),
    linear-gradient(0deg, rgba(5,12,24,.85) 0%, transparent 28%)}
@media(max-width:860px){.hero::after{background:linear-gradient(0deg,rgba(5,12,24,.92),rgba(5,12,24,.55) 55%,rgba(5,12,24,.3))}}

/* --- Logos partenaires : cadres blancs strictement identiques --- */
.pcard .logochip{height:52px!important;width:120px!important;min-width:0!important;padding:9px 16px!important;display:flex!important;align-items:center;justify-content:center}
.pcard .logochip img{max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain!important;display:block}

/* --- Logo d'en-tête : rotation au survol --- */
.brand img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.brand:hover img{transform:rotate(360deg)}

/* --- Intro : apparition "wow" des logos partenaires, un par un --- */
@keyframes ppop{
  0%{opacity:0;transform:translateY(20px) scale(.35);filter:blur(7px);box-shadow:0 0 0 0 rgba(0,224,164,0)}
  55%{opacity:1;transform:translateY(-5px) scale(1.14);filter:blur(0);box-shadow:0 0 30px 6px rgba(0,224,164,.6)}
  75%{transform:translateY(0) scale(.96);box-shadow:0 0 16px 2px rgba(44,201,255,.45)}
  100%{opacity:1;transform:translateY(0) scale(1);box-shadow:0 10px 26px rgba(0,0,0,.28)}
}
/* Intro v2 : bloc partenaires pilote par JS, empile sous le logo, jamais rogne */
.intro-partners{position:absolute!important;left:50%!important;right:auto!important;top:auto!important;bottom:-150px!important;transform:translateX(-50%)!important;width:640px;max-width:92vw;opacity:0;transition:opacity .5s ease;animation:none!important}
.intro-partners.show{opacity:1}
.intro-partners .row{display:flex!important;gap:12px;justify-content:center;flex-wrap:nowrap}
.intro-partners .p{opacity:0;transform:translateY(22px) scale(.5);animation:none!important}
.intro-partners .p.in{animation:ppop .8s cubic-bezier(.2,.8,.25,1) both!important}
/* Ecrans courts : on reduit tout le bloc pour qu'il tienne sans chevauchement */
@media(max-height:780px){.intro-stage{transform:scale(.85)}}
@media(max-height:660px){.intro-stage{transform:scale(.72)}}
@media(max-width:560px){.intro-partners .row{flex-wrap:wrap}.intro-partners .p{width:88px!important;height:44px!important}}

/* Parcours : 3D confinee a la moitie droite pour ne pas chevaucher le texte */
#journey3d{left:auto!important;right:0!important;width:38%!important}
@media(max-width:860px){#journey3d{width:100%!important;right:0!important;opacity:.45}}

/* Hero : tous les calques decoratifs (3D, glow, aurora) ne doivent jamais capter les clics */
.hero .hero-art, .hero .hero-art *, .hero .aurora, .hero3d-canvas, .hero #net3d{pointer-events:none!important}
.hero .hero-in, .hero .hero-in *{pointer-events:auto}

/* Hero : sphere 3D CONTENUE dans sa cellule de droite (grille 2 colonnes) -> jamais coupee */
.hero .hero-art{ position:relative!important; display:block!important; min-height:0!important; }
.hero #net3d{ position:relative!important; inset:auto!important; transform:none!important; width:100%!important; height:460px!important; display:block!important; z-index:1; }
.hero .ha-glow{ z-index:0; }
.hero::after{ display:none!important; }   /* plus de voile plein ecran : le texte a sa propre colonne */
@media(max-width:960px){ .hero #net3d{ height:320px!important; } }

/* ===== Passe UX/UI (v1.5.0) : conteneur large, en-tete + logo plus grands, moins de vide ===== */
.wrap{ max-width:1480px!important; padding:0 44px!important; }
.mega-in{ max-width:1480px!important; }

/* En-tete plus imposant */
.nav-in{ height:96px!important; }
.brand{ gap:16px!important; }
.brand img{ height:62px!important; width:62px!important; }
.brand .wm{ font-size:29px!important; letter-spacing:.4px; }
.links{ gap:36px!important; font-size:16.5px!important; }
.links>a, .has-menu>button{ font-size:16.5px!important; padding:37px 0!important; }
.mega{ top:96px!important; }
nav .btn{ padding:13px 24px!important; font-size:15.5px!important; }
@media(max-width:960px){ .nav-in{ height:72px!important; } .brand img{ height:46px!important; width:46px!important; } .brand .wm{ font-size:22px!important; } }

/* Menu mobile : sous 960px, .links et .nav-right (CTA/socials/langue) sont
   masqués et remplacés par le bouton burger + le panneau ci-dessous — avant
   ce correctif, rien ne les remplaçait et le header devenait inutilisable
   sous 960px (impossible d'atteindre Services/Contact, CTA tronqué). */
.nav-burger{display:none;align-items:center;justify-content:center;background:none;border:none;color:#fff;padding:8px;cursor:pointer;flex-shrink:0}
.mobile-panel{display:none}
@media(max-width:960px){
  .nav-burger{display:inline-flex}
  .nav-right{display:none}
  .mobile-panel{display:block;position:fixed;top:72px;left:0;right:0;bottom:0;z-index:99;background:rgba(7,16,30,.98);backdrop-filter:blur(16px);overflow-y:auto;padding:18px 24px 40px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.25s cubic-bezier(.2,.7,.2,1)}
  .mobile-panel.open{opacity:1;visibility:visible;transform:none}
  .mobile-panel>a{display:block;color:var(--mut);font-size:17px;font-weight:600;padding:15px 2px;border-bottom:1px solid var(--line)}
  .mobile-panel>a:hover{color:#fff}
  .mobile-panel .mp-cta{margin-top:20px;justify-content:center;width:100%;border-bottom:none}
  .mp-foot{display:flex;align-items:center;justify-content:space-between;margin-top:24px}
  .mp-foot>a{color:var(--mut);font-size:12.5px;font-weight:700;border:1px solid var(--line);border-radius:20px;padding:6px 11px}
  .mp-socials{display:flex;align-items:center;gap:16px;color:var(--mut)}
}
@media(max-width:640px){ .wrap{ padding:0 20px!important; } }

/* Partenaires (accueil) : rangee propre de logos au lieu de l'anneau 3D (fini les slivers + vide) */
.stage3d{ height:auto!important; perspective:none!important; display:flex!important; flex-wrap:wrap!important; justify-content:center!important; align-items:center!important; gap:20px!important; margin-top:22px!important; }
.ring3d{ position:static!important; left:auto!important; top:auto!important; width:auto!important; height:auto!important; transform:none!important; animation:none!important; transform-style:flat!important; display:flex!important; flex-wrap:wrap!important; justify-content:center!important; gap:20px!important; }
.c3d{ position:static!important; left:auto!important; top:auto!important; width:auto!important; transform:none!important; display:inline-block!important; }
.logo3d{ height:64px!important; width:158px!important; backface-visibility:visible!important; }
.logo3d img{ max-height:32px!important; max-width:124px!important; }
/* HPE (logo quasi carré, 432x288) et Sophos (grand vide interne autour de la
   marque) rendent visiblement plus petits que les autres sous ce object-fit
   height-first — compensé pour une taille perçue homogène sur toute la rangée. */
.logo3d img[alt="HPE / Aruba"]{ max-height:46px!important; max-width:124px!important; transform:scale(1.45); }
.logo3d img[alt="SOPHOS"]{ max-height:38px!important; transform:scale(1.15); }

/* Rythme vertical plus serre : moins de vide entre les sections */
.sec{ padding:60px 0!important; }
.hero{ min-height:84vh!important; }
.journey{ height:430vh!important; }

/* Le contenu du hero doit occuper toute la largeur du conteneur (il retrecissait au contenu) */
.hero .hero-in{ width:100%!important; }

/* Page Partenaires : logos plus grands et nets (remplissent le chip) */
.pcard .logochip{ height:72px!important; width:100%!important; max-width:none!important; min-width:0!important; padding:8px 16px!important; border-radius:14px!important; }
.pcard .logochip img{ max-height:56px!important; max-width:100%!important; width:auto!important; height:auto!important; object-fit:contain!important; display:block; margin:0 auto; }
/* ============================================================
   v1.6.3 — Page Partenaires : logos nettement plus grands + nets,
   et textes des cartes agrandis.
   Structure reelle : .pcard > .mono (conteneur) > .logochip (span) > img
   Le .mono devient un bandeau blanc pleine largeur ; le logo le remplit.
   (bloc final = priorite maximale)
   ============================================================ */
.part-grid .pcard{ padding:24px 24px 26px!important; }

.part-grid .pcard .mono{
  width:100%!important;
  height:112px!important;
  min-height:112px!important;
  max-width:none!important;
  background:#fff!important;
  border-radius:16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:14px 20px!important;
  box-sizing:border-box!important;
}
.part-grid .pcard .mono .logochip{
  background:none!important;
  padding:0!important;
  height:auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.part-grid .pcard .mono img,
.part-grid .pcard .mono .logochip img{
  width:100%!important;
  height:84px!important;
  max-width:100%!important;
  max-height:84px!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
  margin:0 auto!important;
  image-rendering:-webkit-optimize-contrast;
}

/* Textes des cartes partenaires plus grands et lisibles */
.part-grid .pcard h3{ font-size:24px!important; margin-top:18px!important; }
.part-grid .pcard .t{ font-size:14px!important; margin-top:6px!important; font-weight:700!important; }
.part-grid .pcard p{ font-size:16px!important; line-height:1.55!important; margin-top:12px!important; }

@media(max-width:860px){
  .part-grid .pcard .mono{ height:96px!important; min-height:96px!important; }
  .part-grid .pcard .mono img,
  .part-grid .pcard .mono .logochip img{ height:70px!important; max-height:70px!important; }
  .part-grid .pcard p{ font-size:15px!important; }
}

/* Formulaire de contact / capture de lead */
.lead-form{display:flex;flex-direction:column;gap:16px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px}
.lf-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.lf-grid{grid-template-columns:1fr}}
.lf-row{display:flex;flex-direction:column;gap:6px}
.lf-row label{font-size:13px;color:var(--mut);font-weight:600}
.lf-row input,.lf-row textarea,.lf-row select{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;color:var(--lite);font:inherit;font-size:14.5px;padding:11px 14px;resize:vertical}
.lf-row select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238498B6' stroke-width='1.6' fill='none' fill-rule='evenodd'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:34px}
.lf-row select option{background:#0b1726;color:var(--lite)}
.lf-row input:focus,.lf-row textarea:focus,.lf-row select:focus{outline:2px solid var(--green);outline-offset:1px;border-color:transparent}
.lead-form button[type="submit"]{align-self:flex-start}
.lead-form button[disabled]{opacity:.6;cursor:not-allowed}
.lf-status{margin:0;font-size:13.5px;min-height:1.2em}
.lf-status.ok{color:var(--green)}
.lf-status.err{color:#FF5C7A}

/* Article de blog (contenu rendu depuis le Markdown saisi en admin) */
.post-body h2,.post-body h3,.post-body h4{font-family:'Bricolage Grotesque',sans-serif;color:#fff;font-weight:700;margin:28px 0 10px}
.post-body h2{font-size:24px}.post-body h3{font-size:19px}.post-body h4{font-size:16px}
.post-body p{margin-bottom:16px}
.post-body ul{margin:0 0 16px 20px}
.post-body li{margin-bottom:6px}
.post-body a{color:var(--green);text-decoration:underline}
.post-body img{max-width:100%;border-radius:12px;margin:16px 0}
.post-body strong{color:#fff}