:root{--b:#0000FD;--r:#F81005;--y:#FAAD15;--t:#1a1ab8;--l:#e1e6f5}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font-family:Poppins,sans-serif;color:var(--t);overflow-x:hidden;background:#fff}
h1,h2{font-family:Outfit,sans-serif;font-weight:400;color:var(--b);letter-spacing:-.02em;text-transform:uppercase}
img{max-width:100%;display:block}
#hd{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 5vw;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);box-shadow:0 1px 0 var(--l)}
#hd .logo img{height:58px;width:auto}
nav{display:flex;gap:26px;align-items:center}nav a{color:var(--b);text-decoration:none;font-size:.95rem;position:relative}
nav a:not(.cta):after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:linear-gradient(90deg,var(--b),#4fd1e8);transition:.3s}
nav a:hover:after,nav a.on:after{width:100%}.cta{border:2px solid #7fb4e8;border-radius:14px;padding:9px 24px}
.lang{background:none;border:0;color:var(--b);cursor:pointer;display:flex;align-items:center;gap:6px;font:500 .85rem Poppins}
.burger{display:none;background:none;border:0;color:var(--b);font-size:1.7rem}
@media(max-width:960px){.burger{display:block}nav{position:fixed;inset:78px 0 auto 0;flex-direction:column;background:#fff;padding:22px;gap:18px;transform:translateY(-140%);transition:.4s}nav.open{transform:none}}
.hero{position:relative;height:100vh;min-height:560px;overflow:hidden;background:#dbe9fb}
.sl{position:absolute;inset:0;opacity:0;transition:opacity 1.2s}.sl.on{opacity:1}
.sl .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.15);transition:transform 7s ease-out}.sl.on .bg{transform:scale(1)}
.sl:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,.3))}
.sl .c{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:90px 6vw 70px;gap:34px}
.sl h1{font-size:clamp(2.2rem,7vw,6rem);line-height:1.02;text-transform:none;max-width:1100px}
.sl h1 span{display:inline-block;opacity:0;transform:translateY(40px) rotateX(-60deg);filter:blur(6px)}
.sl.on h1 span{animation:wd .9s cubic-bezier(.2,.8,.2,1) forwards}@keyframes wd{to{opacity:1;transform:none;filter:none}}
.btn{display:inline-block;background:var(--y);color:#111;font-weight:500;text-decoration:none;padding:14px 56px;clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);transition:.3s;border:0;cursor:pointer;font-size:1rem;font-family:inherit}
.btn:hover{transform:translateY(-3px);filter:brightness(1.08)}
.sl .btn{opacity:0}.sl.on .btn{animation:up .8s .9s forwards}@keyframes up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.pg{position:absolute;z-index:5;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:20px}
.pg button{width:min(14vw,160px);height:12px;background:none;border:0;cursor:pointer;position:relative}
.pg button:before{content:"";position:absolute;left:0;right:0;top:5px;height:2px;background:rgba(0,0,253,.3)}
.pg button i{position:absolute;left:0;top:4px;height:4px;width:0;background:var(--y);border-radius:2px}
.pg button.on i{animation:fill 6s linear forwards}@keyframes fill{to{width:100%}}
.cor{position:absolute;width:18px;height:18px;border:3px solid var(--y);z-index:3;top:96px;animation:pulse 2.5s infinite}
.cor.a{left:6vw;border-right:0;border-bottom:0}.cor.b{right:6vw;border-left:0;border-bottom:0}@keyframes pulse{50%{opacity:.3;transform:scale(1.3)}}
.pb{padding:150px 6vw 60px;background:linear-gradient(#eef3ff,#fff);text-align:center}.pb h1{font-size:clamp(2.4rem,6vw,4.6rem)}
section{padding:90px 6vw;overflow:hidden}.wrap{max-width:1250px;margin:auto}
h2{font-size:clamp(2.2rem,5.5vw,4.6rem);line-height:1;margin-bottom:44px}.ctr{text-align:center}
.tag{display:inline-block;background:var(--y);color:#111;font-weight:500;padding:12px 44px;clip-path:polygon(4% 0,96% 0,100% 100%,0 100%);margin-bottom:18px;text-transform:uppercase;font-size:.95rem}
.txt{line-height:1.75;font-weight:300;max-width:540px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
@media(max-width:860px){.grid{grid-template-columns:1fr}}
.ph{position:relative;padding:36px}.ph:before{content:"";position:absolute;inset:0;border:1px solid #cfd6ee;border-radius:26px;transform:translate(14px,14px)}
.ph .img{position:relative;overflow:hidden;border-radius:26px}
.ph img,.card img{width:100%;height:100%;object-fit:cover;transform:scale(1.35);opacity:0;transition:transform 1.8s cubic-bezier(.2,.7,.2,1),opacity 1.4s}
.in .ph img,.ph.in img,.card.in img{transform:scale(1);opacity:1}.ph:hover img,.card:hover img{transform:scale(1.08)}
.rv{opacity:0;transform:translateY(46px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}.rl{transform:translateX(-60px)}.rr{transform:translateX(60px)}.rv.in.rl,.rv.in.rr{transform:none}
.btn2{display:inline-flex;gap:12px;align-items:center;margin-top:26px;border:2px solid #9ed8ee;border-radius:16px;padding:13px 30px;color:var(--b);text-decoration:none;transition:.3s}
.btn2:hover{background:var(--b);color:#fff}.btn2:after{content:"→";transition:.3s}.btn2:hover:after{transform:translateX(8px)}
.ic{width:46px;height:46px;color:var(--y);margin-bottom:10px}.ic *{stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 2s}.in .ic *,.ic.in *{stroke-dashoffset:0}
.en{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}@media(max-width:900px){.en{grid-template-columns:1fr 1fr}}
.card{text-align:center;border:1px solid var(--l);border-radius:24px;padding:14px;transition:.4s}.card:hover{transform:translateY(-8px);box-shadow:0 18px 36px rgba(0,0,253,.12)}
.card .img{aspect-ratio:1.3;overflow:hidden;border-radius:16px}.card h3{color:var(--y);font:500 1.05rem Outfit;margin-top:12px}
.sv{display:grid;grid-template-columns:1fr 1fr;gap:60px}@media(max-width:860px){.sv{grid-template-columns:1fr}}
.sv h3{color:var(--y);font:500 1.1rem Outfit;line-height:2;text-transform:uppercase}
.logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-top:56px;align-items:center}
.logos div{border:1px solid var(--l);border-radius:16px;padding:18px;height:100px;display:grid;place-items:center;transition:.4s}.logos div:hover{transform:scale(1.06)}
.logos img{max-height:64px;object-fit:contain}
.tg{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;padding-top:20px}@media(max-width:860px){.tg{grid-template-columns:1fr}}
.tc{border:1px solid #3b82d6;border-radius:34px;padding:34px;position:relative}.tc svg{position:absolute;top:-26px;right:-10px;width:60px;color:var(--b);background:#fff}
.st{color:var(--b);letter-spacing:6px;text-align:center;font-size:1.2rem}.tc p{font:500 1.1rem Outfit;color:var(--b);margin:16px 0 22px;text-align:center}.tc small{display:block;text-align:right;color:var(--b)}
.parts{background:#f6f8ff}.pm{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.pt{display:flex;gap:70px;width:max-content;align-items:center;animation:mq 28s linear infinite;padding:20px 0}.pm:hover .pt{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.pt img{height:70px;width:auto;max-width:200px;object-fit:contain;filter:grayscale(1);opacity:.55;transition:.4s}.pt img:hover{filter:none;opacity:1;transform:scale(1.12)}
.jobs{display:grid;gap:18px;margin-bottom:60px}.job{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--l);border-radius:20px;padding:22px 28px;transition:.3s}.job:hover{border-color:var(--b);transform:translateX(6px)}
.job b{font:500 1.2rem Outfit;color:var(--b);display:block}.job span{font-size:.9rem;font-weight:300}
form{display:grid;gap:14px;max-width:640px}form input,form select,form textarea{font:inherit;padding:14px 18px;border:1px solid #cfd6ee;border-radius:14px;width:100%;color:#111}
form input:focus,form textarea:focus,form select:focus{outline:2px solid var(--b)}.ok{color:#0a8a3a;font-weight:500;display:none}
.ci{display:grid;gap:22px}.ci div{border:1px solid var(--l);border-radius:20px;padding:20px 24px}.ci b{color:var(--b);display:block;margin-bottom:4px}
iframe{width:100%;height:320px;border:0;border-radius:22px;margin-top:24px}
#ft{position:relative;background:#0030d0;color:#fff;padding:130px 6vw 30px;margin-top:50px}
#ft:before{content:"";position:absolute;top:-1px;left:0;right:0;height:60px;background:#fff;clip-path:ellipse(70% 100% at 50% 0)}
.fg{display:grid;grid-template-columns:repeat(4,1fr) 1.6fr;gap:30px;max-width:1300px;margin:auto}@media(max-width:1000px){.fg{grid-template-columns:1fr 1fr}}
#ft h4{margin-bottom:14px;font-weight:600}#ft a,#ft p{display:block;color:#fff;text-decoration:none;font-weight:300;line-height:2.1;font-size:.93rem}#ft a:hover{color:var(--y)}
.nl{display:flex;gap:6px;margin-top:12px}.nl input{flex:1;min-width:0;padding:14px 20px;border-radius:30px;border:0;font:inherit}.nl button{background:var(--y);border:0;border-radius:30px;padding:0 24px;font-weight:600;cursor:pointer}
.big{font:600 2rem Outfit;text-align:right;margin-top:30px}.big small{display:block;font-size:.8rem;font-weight:400;border-bottom:3px solid var(--y);padding-bottom:10px}
.cp{max-width:1300px;margin:40px auto 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.85rem}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv,.ph img,.card img{opacity:1;transform:none}}
/* ===== Correction finale ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#hd{background:transparent;box-shadow:none;backdrop-filter:none;justify-content:center;gap:clamp(24px,3.5vw,60px);transition:background .35s,box-shadow .35s,padding .35s}
#hd:not(.sc):not(.mo):before{content:"";position:absolute;inset:0 0 -36px;background:linear-gradient(rgba(255,255,255,.88),rgba(255,255,255,0));z-index:-1;pointer-events:none}
#hd.sc,#hd.mo{background:#fff;box-shadow:0 2px 16px rgba(0,0,80,.09)}#hd.sc{padding-top:6px;padding-bottom:6px}
#hd .logo img{transition:height .35s}#hd.sc .logo img{height:46px}
@media(max-width:960px){#hd{justify-content:space-between}}
.sl:before{display:none}.hero.pghero{height:62vh;min-height:360px}
.pg button.on i{background:var(--y)}
.pb{display:none}.parts{background:#fff}
.sep{display:block;height:4px;width:min(86%,1200px);margin:0 auto;border-radius:4px;background:linear-gradient(90deg,var(--b),#4fd1e8,var(--y),#4fd1e8,var(--b));background-size:300% 100%;animation:flow 6s linear infinite;transform:scaleX(0);transition:transform 1.5s cubic-bezier(.2,.8,.2,1)}
.sep.in{transform:scaleX(1)}@keyframes flow{to{background-position:300% 0}}
.ph .img{aspect-ratio:4/3.4}
.s1{clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);border-radius:0 0 26px 26px!important}
.s2{clip-path:polygon(0 0,100% 0,90% 100%,10% 100%);border-radius:26px 26px 0 0!important}
.s3{clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);border-radius:0!important}
.s4{border-radius:50% 50% 26px 26px/40% 40% 26px 26px!important}
.s5{clip-path:polygon(0 0,100% 0,100% 84%,50% 100%,0 84%);border-radius:0!important}
.s6{border-radius:70px 8px 70px 8px!important}
.logos div{border:0!important;border-radius:0}
.ts{position:relative;display:flex;gap:30px;overflow-x:auto;scroll-snap-type:x mandatory;padding:36px 6vw 20px;margin:0 -6vw;scrollbar-width:none}
.ts::-webkit-scrollbar{display:none}.ts .tc{flex:0 0 min(380px,82vw);scroll-snap-align:center}
.dots{display:flex;gap:12px;justify-content:center;margin-top:22px}
.dots button{width:12px;height:12px;border-radius:50%;border:2px solid var(--b);background:none;cursor:pointer;padding:0;transition:.3s}
.dots button.on{background:var(--y);border-color:var(--y);transform:scale(1.35)}
.ob{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:34px}@media(max-width:860px){.ob{grid-template-columns:1fr}}
.ob div{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--l);border-radius:20px;padding:22px 24px;line-height:1.65;font-weight:300;transition:.3s}
.ob div:hover{border-color:var(--y);transform:translateY(-4px)}
.ob b{flex:0 0 42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--b),#4fd1e8);color:#fff;font:500 1rem Outfit}
.txt+.txt{margin-top:16px}
/* ===== Correction 5 : hero avec texte + voile blanc dégradé ===== */
.sl:before{display:block;content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.84) 0%,rgba(255,255,255,.58) 50%,rgba(255,255,255,.32) 100%)}
.pghero .sl h1{font-size:clamp(2.2rem,6vw,4.8rem)}
.sl .sub{max-width:660px;font-size:clamp(1rem,1.8vw,1.2rem);font-weight:400;color:var(--t);opacity:0;margin-top:-10px}
.sl.on .sub{animation:up .8s .7s forwards}
.card>a,.card>a:hover{display:block;cursor:pointer;text-decoration:none}
.logos a{display:grid;place-items:center;width:100%;height:100%;cursor:pointer}
