/* Copie exacte du style de la maquette Site-V3 (claude.ai/artifact/TWbLzqCS9nyZfBMXtRP6sz). Ne pas retoucher : voir ajustements.css. */
body{margin:0;background:#F6F7F9}
a{color:#0B0D12}a:hover{color:#D1006F}
.s{container-type:inline-size;--mx:70%;--my:40%;font-family:Geist,system-ui,sans-serif;font-weight:400;color:#0B0D12;background:#F6F7F9;min-height:100%;overflow:hidden}
.w{max-width:1240px;margin:0 auto;padding:0 56px;box-sizing:border-box}
.d{font-family:Geist,sans-serif;font-weight:600;letter-spacing:-0.045em;margin:0;line-height:1}
.mut{color:#5B6272}
.mono{font-family:"Geist Mono",monospace;font-size:13px;color:#5B6272}
button{font-family:inherit}
:focus-visible{outline:2px solid #D1006F;outline-offset:3px}
.top{position:sticky;top:0;z-index:20;background:rgba(246,247,249,.78);backdrop-filter:blur(16px) saturate(170%);-webkit-backdrop-filter:blur(16px) saturate(170%);border-bottom:1px solid rgba(11,13,18,.07)}
.bar{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav{display:flex;gap:32px;align-items:center}
.nl{background:none;border:0;color:#3D4352;font-weight:500;font-size:15px;cursor:pointer;min-height:44px;padding:0;position:relative}
.nl:hover,.nl.on{color:#0B0D12}
.nl.on::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:2px;background:linear-gradient(90deg,#FDBD00,#FF0000,#FF0099)}
.pill{border:0;cursor:pointer;min-height:44px;padding:0 20px;border-radius:10px;font-weight:500;font-size:15px;color:#fff;background:#0B0D12;transition:transform .15s,box-shadow .3s;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 6px 20px -8px rgba(11,13,18,.5)}
.pill:hover{color:#fff;box-shadow:0 0 0 1px #0B0D12,0 10px 30px -10px rgba(209,0,111,.55)}
.pill:active{transform:scale(.98)}
.pill.o{background:#fff;color:#0B0D12;box-shadow:inset 0 0 0 1px rgba(11,13,18,.14)}
.pill.o:hover{box-shadow:inset 0 0 0 1px rgba(11,13,18,.4);color:#0B0D12}
.burger{display:none;background:#fff;border:1px solid rgba(11,13,18,.14);border-radius:10px;color:#0B0D12;width:44px;height:44px;cursor:pointer}
.mnav{display:none}

.hero{position:relative;min-height:820px;display:flex;align-items:center;isolation:isolate}
.mesh{position:absolute;inset:-20% -10% auto auto;width:900px;height:900px;z-index:-2;background:conic-gradient(from 200deg at 50% 50%,#FDBD00,#FF0000,#FF0099,#FDBD00);filter:blur(120px);opacity:.22;border-radius:50%}
.gridl{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(11,13,18,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(11,13,18,.06) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at 70% 40%,#000 15%,transparent 65%);-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 15%,transparent 65%)}
.spot{position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(255,0,153,.07),transparent 60%);pointer-events:none}
.hgrid{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center;width:100%}
.frame{position:relative;padding:48px 0 48px 56px}
.frame svg{position:absolute;width:120px;height:80px;overflow:visible}
.frame .c1{left:0;bottom:0}.frame .c2{right:12%;top:0}
.frame path{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:300;stroke-dashoffset:0}
.hx{font-size:84px;max-width:660px}
.lead{font-size:20px;line-height:1.5;max-width:520px;margin:28px 0 36px;color:#4A5162}
.stack{position:relative;height:520px}
.mk{position:absolute;width:340px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.06),0 30px 60px -30px rgba(40,20,60,.35);overflow:hidden;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.mk .vis{height:180px}
.mk .bd{padding:18px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.mk img{height:22px;display:block}
.mk1{left:0;top:30px;transform:rotate(-5deg)}
.mk2{left:150px;top:150px;transform:rotate(3deg);z-index:2}
.mk3{left:40px;top:300px;transform:rotate(-1deg);z-index:3}
.stack:hover .mk1{transform:rotate(-8deg) translate(-20px,-10px)}
.stack:hover .mk2{transform:rotate(5deg) translate(20px,-6px)}
.stack:hover .mk3{transform:rotate(-2deg) translate(0,14px)}
.live{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px rgba(11,13,18,.08);font-size:13px;color:#3D4352;margin-bottom:28px}

.mq{border-block:1px solid rgba(11,13,18,.07);overflow:hidden;padding:30px 0;background:#fff}
.mqt{display:flex;width:max-content}
.mqg{display:flex;gap:96px;padding-right:96px;align-items:center;flex-shrink:0}
.mq:hover .mqt{animation-play-state:paused}
.mqt img{height:30px;display:block;filter:grayscale(1) contrast(1.2);opacity:.7}
.mqt span{font-weight:600;font-size:22px;letter-spacing:-0.03em;color:#8A90A0;white-space:nowrap}

.sec{padding:128px 0}
.h2{font-size:60px;max-width:820px}
.p{font-size:18px;line-height:1.65;color:#4A5162;max-width:600px;margin:24px 0 0}

.acc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:64px}
.pan{position:relative;border-radius:22px;overflow:hidden;border:0;padding:0;cursor:pointer;text-align:left;color:#0B0D12;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.07),0 24px 48px -32px rgba(40,20,60,.3);display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.pan:hover,.pan.on{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(209,0,111,.35),0 40px 70px -34px rgba(209,0,111,.35)}
.pan .bg{position:relative;height:180px;width:100%}
.pan .tx{position:static;padding:24px 26px 28px;display:flex;flex-direction:column;gap:10px}
.pan .nm{font-weight:600;font-size:28px;letter-spacing:-0.035em;line-height:1}
.pan .ds{font-size:15px;line-height:1.55;color:#4A5162}
.pan .go{font-weight:500;font-size:15px;color:#D1006F}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:0;background:#fff;border-radius:22px;box-shadow:0 0 0 1px rgba(11,13,18,.07)}
.stats>div{padding:36px 32px;border-left:1px solid rgba(11,13,18,.07)}
.stats>div:first-child{border-left:0}
.stv{font-weight:600;font-size:56px;letter-spacing:-0.05em;line-height:1;color:#0B0D12;font-variant-numeric:tabular-nums}
.stv.todo{font-size:18px;letter-spacing:0;color:#B07A00}
.stl{margin-top:12px;font-size:15px;color:#5B6272}
.bar3{height:3px;width:48px;border-radius:3px;background:linear-gradient(90deg,#FDBD00,#FF0000,#FF0099);margin-bottom:20px}

.man{font-weight:600;font-size:44px;line-height:1.15;letter-spacing:-0.035em;max-width:1000px;margin:0}
.man .dim{color:#9AA0AE}

.join{position:relative;border-radius:28px;padding:80px 64px;overflow:hidden;background:#0B0D12;color:#fff;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;isolation:isolate}
.join::before{content:"";position:absolute;width:640px;height:640px;right:-160px;top:-280px;border-radius:50%;background:conic-gradient(#FDBD00,#FF0000,#FF0099,#FDBD00);filter:blur(80px);opacity:.45;z-index:-1}
.join .p{color:#C5CAD6}
.join .pill{background:#fff;color:#0B0D12}

.ph{position:relative;padding:112px 0 64px}
.ph .d{font-size:80px}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px;align-items:start}
.grp3{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;margin-top:56px}
.tile{border-radius:22px;padding:36px;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.07);min-height:220px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}
.tile.g{background:linear-gradient(135deg,#FFE9A8,#FFC2C2 55%,#FFC2E6)}
.tile h3{font-weight:600;font-size:24px;margin:0;letter-spacing:-0.03em}
.time{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:56px}
.time div{border-top:2px solid rgba(11,13,18,.1);padding-top:20px}
.tabs{display:inline-flex;gap:4px;flex-wrap:wrap;padding:4px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px rgba(11,13,18,.08)}
.tb{background:none;border:0;color:#4A5162;border-radius:9px;padding:0 18px;min-height:40px;font-weight:500;font-size:15px;cursor:pointer}
.tb.on{background:#0B0D12;color:#fff}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px}
.fact{border-radius:16px;padding:20px 22px;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.07);display:flex;flex-direction:column;gap:6px;font-size:15px}
.job{border-radius:22px;padding:32px 36px;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.07);display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;margin-top:16px}
.f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;background:#fff;padding:32px;border-radius:22px;box-shadow:0 0 0 1px rgba(11,13,18,.07)}
.f label{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:500;color:#3D4352}
.f input,.f textarea,.f select{font:400 16px Geist,sans-serif;color:#0B0D12;padding:13px 14px;border:0;border-radius:10px;background:#F6F7F9;box-shadow:inset 0 0 0 1px rgba(11,13,18,.16)}
.f input:focus,.f textarea:focus,.f select:focus{outline:none;box-shadow:inset 0 0 0 2px #D1006F;background:#fff}
.full{grid-column:1/-1}
.err{color:#B00020;font-size:14px;margin:0}
.ok{border-radius:16px;padding:24px;background:#fff;box-shadow:inset 0 0 0 1px rgba(46,125,79,.5);font-size:17px;line-height:1.5}
.pil{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:56px}
.pil5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:16px}
.pi.sm{padding:28px 24px}.pi.sm h3{font-size:20px}.pi.sm p{font-size:15px}
.pi{border-radius:22px;padding:36px;background:#fff;box-shadow:0 0 0 1px rgba(11,13,18,.07);display:flex;flex-direction:column;gap:12px}
.pi.big{background:linear-gradient(135deg,#FFF6D6,#FFE3E3 55%,#FFE2F3)}
.pi h3{font-weight:600;font-size:34px;letter-spacing:-0.035em;line-height:1.1;margin:0}
.pi p{margin:0;font-size:16px;line-height:1.6;color:#4A5162}
.pi.slot{background:transparent;box-shadow:none;border:1.5px dashed rgba(11,13,18,.2)}
.legal h3{font-size:22px;font-weight:600;margin:40px 0 10px;letter-spacing:-0.02em}
.legal p{font-size:16px;line-height:1.75;color:#4A5162;margin:0 0 8px}
.lgz{display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;border-bottom:1px solid rgba(11,13,18,.07)}
.lc{align-items:center;justify-content:center;min-height:260px;box-sizing:border-box}

.foot{padding:88px 0 40px;border-top:1px solid rgba(11,13,18,.07);font-size:14px;color:#5B6272;background:#fff}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px}
.fl{background:none;border:0;color:#5B6272;font-size:14px;padding:6px 0;cursor:pointer;text-align:left;min-height:32px}
.fl:hover{color:#0B0D12}
.huge{font-weight:700;font-size:21vw;letter-spacing:-0.07em;line-height:.8;margin:72px 0 0;background:linear-gradient(180deg,rgba(11,13,18,.09),rgba(11,13,18,0));-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none}

@media (prefers-reduced-motion:no-preference){
.mesh{animation:spin 30s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.frame path{stroke-dashoffset:300;animation:draw 1.4s .2s cubic-bezier(.65,0,.35,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.in{opacity:0;transform:translateY(20px);filter:blur(6px);animation:up .9s cubic-bezier(.16,1,.3,1) forwards}
.in.d2{animation-delay:.15s}.in.d3{animation-delay:.3s}
@keyframes up{to{opacity:1;transform:none;filter:none}}
.mk{opacity:0;animation:pop .9s cubic-bezier(.16,1,.3,1) forwards}
.mk2{animation-delay:.25s}.mk3{animation-delay:.45s}
@keyframes pop{from{opacity:0;translate:0 40px}to{opacity:1;translate:0 0}}
.mqt{animation:mq 40s linear infinite;will-change:transform}
@keyframes mq{to{transform:translateX(-50%)}}
@supports (animation-timeline:view()){
.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
@keyframes rv{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
}
}
@container (max-width:700px){
.w{padding:0 16px}
.nav{display:none}.burger{display:block}
.mnav{display:flex;flex-direction:column;padding:8px 16px 24px;border-top:1px solid rgba(11,13,18,.07)}
.hero{min-height:0;padding:56px 0 48px}
.hgrid{grid-template-columns:minmax(0,1fr);gap:24px}
.frame{padding:36px 0 36px 24px}
.frame svg{width:70px;height:48px}
.hx{font-size:46px}.lead{font-size:17px}
.stack{height:400px}
.mk{width:250px}.mk .vis{height:120px}
.mk2{left:90px;top:120px}.mk3{left:20px;top:230px}
.mqt img{height:24px}.mqg{gap:56px;padding-right:56px}
.sec{padding:80px 0}.h2{font-size:38px}
.acc{grid-template-columns:minmax(0,1fr)}
.pan .bg{height:140px}
.stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.stats>div{padding:24px 20px;border-left:0;border-top:1px solid rgba(11,13,18,.07)}
.stv{font-size:38px}
.man{font-size:28px}
.join{padding:48px 24px;border-radius:22px}
.join .d{font-size:38px !important}
.ph{padding:64px 0 32px}.ph .d{font-size:44px}
.split,.grp3,.time,.facts,.f,.fg,.pil,.pil5{grid-template-columns:minmax(0,1fr);gap:14px}
.f{padding:20px}
.split{gap:32px}
.lc{min-height:180px}
.job{padding:24px}
.huge{font-size:30vw}
}