/* ===== page Clients ===== */
.ph.cl{min-height:78svh}
.ph.cl h1{font-size:clamp(74px,19vw,300px)}
.ph.cl .lead{margin:clamp(20px,3vh,34px) 0 0;max-width:560px}
.hbtns{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn.g{background:linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,.06) 55%,rgba(255,255,255,.14));-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);color:#fff;border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 1px rgba(255,255,255,.5);margin-top:0}
.btn.g:hover{background:linear-gradient(135deg,rgba(255,255,255,.3),rgba(255,255,255,.1) 55%,rgba(255,255,255,.2));color:#fff}
.hbtns .btn{margin-top:0}
/* client à la une */
.feat{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(24px,4vw,56px);border-radius:28px;text-decoration:none;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 85% 10%,rgba(246,127,84,.34),transparent 55%),linear-gradient(165deg,#2A2A52,var(--bg2) 82%);box-shadow:0 30px 80px rgba(0,0,0,.4);transition:box-shadow .4s;transform:perspective(1200px) rotateX(calc(var(--rx,0)*1deg)) rotateY(calc(var(--ry,0)*1deg)) translateY(calc(var(--l,0)*-6px));will-change:transform}
.feat:hover{box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 0 1px var(--star)}
.feat::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;opacity:var(--l,0);background:radial-gradient(circle 360px at var(--mx,50%) var(--my,50%),rgba(249,200,120,.2),transparent 65%);mix-blend-mode:screen}
.feat .fl{display:grid;gap:18px;justify-items:start}
.feat .fk{font:500 16px/1.3 var(--u);color:var(--star)}
.feat h3{font-size:clamp(54px,8vw,120px);line-height:.86}
.feat .klogo{width:min(230px,60%);margin:0}
.feat p{margin:0;color:#D3D2E2;max-width:44ch}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills span{padding:6px 14px;border-radius:99px;background:rgba(26,26,46,.6);font:500 14px/1.3 var(--u);box-shadow:inset 0 0 0 1px var(--line)}
.go{display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:15px 26px;border-radius:99px;background:var(--ink);color:var(--bg);font:500 16px/1 var(--u);transition:box-shadow .3s}
.feat:hover .go{box-shadow:0 0 0 8px rgba(249,200,120,.2)}
.go svg{width:18px;height:18px;transition:transform .3s}
.feat:hover .go svg{transform:translateX(4px)}
.stack{position:relative;aspect-ratio:16/11;min-width:0}
.stack figure{position:absolute;margin:0;width:68%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.55);transform:translate3d(calc(var(--px,0)*var(--dx)*1px),calc(var(--py,0)*var(--dy)*1px),0) rotate(calc(var(--r)*1deg + var(--l,0)*var(--hr)*1deg))}
.stack figure:nth-child(1){left:0;top:0;--r:-3;--hr:-2;--dx:-16;--dy:-10}
.stack figure:nth-child(2){right:0;top:28%;--r:2.5;--hr:1.5;--dx:10;--dy:6;z-index:1}
.stack figure:nth-child(3){left:6%;bottom:0;--r:-1.5;--hr:-1.5;--dx:30;--dy:20;z-index:2}
.stack img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.feat{grid-template-columns:minmax(0,1fr)}.stack{max-width:560px;width:100%}}
/* autres références */
.more{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px)}
.slot{display:grid;gap:16px;align-content:space-between;min-height:260px;padding:26px;border-radius:22px;background:rgba(255,255,255,.025);box-shadow:inset 0 0 0 1px var(--line);border:1px dashed rgba(249,200,120,.4);border-style:dashed;box-shadow:none}
.slot .mark{display:grid;place-items:center;height:58px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line);font:500 14px/1 var(--u);color:var(--mut)}
.slot b{display:block;font:800 clamp(28px,3vw,38px)/.95 var(--d);text-transform:uppercase}
.slot small{display:block;margin-top:8px;color:var(--mut);font-size:15px}
/* étapes */
.steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:30px;--i:0}
.steps::before{content:"";position:absolute;left:27px;right:27px;top:27px;height:2px;background:var(--line)}
.steps::after{content:"";position:absolute;left:27px;top:27px;height:2px;width:calc((100% - 54px) * var(--i) / 4);background:linear-gradient(90deg,var(--org),var(--star));transition:width .5s cubic-bezier(.3,.8,.3,1)}
.st{all:unset;box-sizing:border-box;position:relative;z-index:1;cursor:pointer;display:grid;gap:12px;justify-items:start;color:var(--mut)}
.st .dot{width:54px;height:54px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 2px var(--line);display:grid;place-items:center;font:800 24px/1 var(--d);transition:.3s}
.st .n{font:500 15px/1.2 var(--u)}
.st[aria-selected=true]{color:var(--ink)}
.st[aria-selected=true] .dot{background:var(--star);color:var(--bg);box-shadow:0 0 0 8px rgba(249,200,120,.18);filter:drop-shadow(0 0 12px rgba(249,200,120,.4))}
.st.done .dot{box-shadow:inset 0 0 0 2px var(--star);color:var(--star)}
.st:focus-visible{outline:2px solid var(--star);outline-offset:6px;border-radius:12px}
.panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);padding:clamp(24px,4vw,48px);border-radius:22px;background:linear-gradient(165deg,#2A2A52,var(--bg2) 78%);box-shadow:0 20px 50px rgba(0,0,0,.3)}
.panel h3{font-size:clamp(40px,5vw,68px);margin:12px 0 16px;line-height:.9}
.panel p{margin:0;color:#C9C8DA;max-width:52ch}
.panel ul{list-style:none;margin:0;padding:0;display:grid;gap:0;align-content:start}
.panel li{display:flex;gap:12px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line)}
.panel li::before{content:"";flex:none;width:.7em;height:.7em;background:var(--star);-webkit-mask:var(--starmask) center/contain no-repeat;mask:var(--starmask) center/contain no-repeat}
.dur{margin-top:22px;display:inline-flex;padding:7px 14px;border-radius:99px;background:rgba(26,26,46,.6);box-shadow:inset 0 0 0 1px var(--line);font:500 14px/1.3 var(--u);color:var(--star)}
@media (max-width:820px){.steps{grid-template-columns:minmax(0,1fr);gap:0}.steps::before{left:27px;right:auto;top:27px;bottom:27px;width:2px;height:auto}.steps::after{left:27px;top:27px;width:2px;height:calc((100% - 54px) * var(--i) / 4)}.st{grid-template-columns:54px 1fr;align-items:center;gap:16px;padding:10px 0}.panel{grid-template-columns:minmax(0,1fr)}}
.cta p.sub{margin:22px 0 0;font:italic 400 clamp(20px,2vw,24px)/1.5 var(--s);color:#C9C8DA;max-width:560px}
.cta .mail{display:block;margin-top:22px;color:var(--mut);font-size:15px}
.st .n{display:grid;gap:4px}
.md{font:400 13px/1.3 var(--u);color:var(--mut)}
.md.e{color:var(--star)}
.pillrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.pillrow .dur{margin:0}
.mode{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:99px;font:500 14px/1.3 var(--u);background:rgba(26,26,46,.6);box-shadow:inset 0 0 0 1px var(--line)}
.mode::before{content:"";width:.8em;height:.8em;background:currentColor;-webkit-mask:var(--starmask) center/contain no-repeat;mask:var(--starmask) center/contain no-repeat}
.mode.e,.mode.m{color:var(--star);box-shadow:inset 0 0 0 1px rgba(249,200,120,.5)}
.mode.s{color:#D3D2E2}.mode.s::before{border-radius:50%;-webkit-mask:none;mask:none;width:.55em;height:.55em;border:2px solid currentColor;background:none}
.dur{color:var(--mut)}
.slot{transition:box-shadow .3s,border-color .3s;transform:perspective(900px) rotateX(calc(var(--rx,0)*1deg)) rotateY(calc(var(--ry,0)*1deg));will-change:transform}
.slot:hover{border-color:rgba(249,200,120,.75)}
@media (prefers-reduced-motion:reduce){.feat,.slot,.stack figure{transform:none!important}}