/* Pitch commerciaux Agentova · styles propres au pitch (préfixes pr-, ob, ac, sc). La base est celle de la propale. */
/* écran de préparation */
#prep{position:fixed;inset:0;z-index:90;display:none;place-items:center;background:rgba(2,3,8,.82);backdrop-filter:blur(8px);font-family:"Inter",system-ui,sans-serif;padding:16px;overflow:auto}
#prep.on{display:grid}
.prepc{width:min(880px,100%);background:#fff;border-radius:28px;padding:36px 40px;display:flex;flex-direction:column;gap:14px;color:#020308}
.prk{margin:0;font:500 13px "IBM Plex Mono",monospace;color:#B3321D;background:#FFE9E4;align-self:flex-start;padding:6px 12px;border-radius:999px}
.prepc h2{margin:0;font-size:34px;font-weight:500;letter-spacing:-.03em}
.prl{margin:10px 0 0;font-size:16px;font-weight:600}
.prg{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.prg.po{grid-template-columns:repeat(7,1fr)}
.prg button{font:500 15px "Inter",sans-serif;padding:14px 12px;border-radius:14px;border:1.5px solid rgba(2,3,8,.12);background:#F4F3F1;cursor:pointer;color:#020308;display:flex;flex-direction:column;gap:4px;align-items:center;text-align:center}
.prg button b{font-size:20px}.prg button span{font:400 11px "IBM Plex Mono",monospace;color:rgba(2,3,8,.6)}
.prg button.on{background:#020308;color:#fff;border-color:#020308}.prg button.on span{color:rgba(255,255,255,.7)}
.prgo{margin-top:10px;font:600 18px "Inter",sans-serif;padding:16px;border-radius:999px;border:0;background:#22AA7C;color:#fff;cursor:pointer}
.prgo:disabled{background:rgba(2,3,8,.15);cursor:not-allowed}
.prn{margin:0;font-size:13px;color:rgba(2,3,8,.55);text-align:center}
@media (max-width:640px){.prg{grid-template-columns:1fr 1fr}.prg.po{grid-template-columns:repeat(4,1fr)}}
/* bouton vers l'application */
.applnk{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;padding:14px 24px;border-radius:999px;background:#020308;color:#fff;font:600 21px var(--fs);text-decoration:none;letter-spacing:-.01em}
.gr .applnk{background:#fff;color:#020308}
/* le Cerveau et ses neuf agents */
.orbw{position:absolute;left:128px;top:330px;width:1664px;height:640px}
.orbw svg{position:absolute;inset:0;overflow:visible}
.orbw .core{position:absolute;left:832px;top:300px;transform:translate(-50%,-50%);width:250px;height:250px;border-radius:50%;background:radial-gradient(closest-side,rgba(34,170,124,.26),rgba(34,170,124,.07) 70%,transparent);box-shadow:0 0 0 2px rgba(34,170,124,.4),0 0 0 16px rgba(34,170,124,.08);display:grid;place-items:center}
.orbw .core canvas{position:absolute;inset:0;width:100%;height:100%}
.orbw .core b{position:relative;background:linear-gradient(135deg,#013916,#1A8A45);color:#fff;border-radius:999px;padding:12px 24px;font-size:24px;font-weight:600;white-space:nowrap;box-shadow:0 20px 40px -16px rgba(1,57,22,.7)}
.ob{position:absolute;transform:translate(-50%,-50%);display:grid;grid-template-columns:60px auto;column-gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 22px 8px 8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 14%,transparent),0 18px 36px -24px rgba(0,0,0,.45);white-space:nowrap;transition-delay:var(--dl)!important}
.ob.shown{transform:translate(-50%,-50%)!important}
.ob:not(.shown){transform:translate(-50%,-30%)!important}
.ob img,.ob>span{grid-row:1/3;width:60px;height:60px;border-radius:50%;object-fit:cover;background:var(--c);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:600}
.ob b{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.1;align-self:end}
.ob i{font:400 19px var(--fm);font-style:normal;color:var(--mut);align-self:start}
/* la grille des agents */
#agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;flex:1;min-height:0;--step:60ms}
.ac{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:18px;padding:18px 22px;border-radius:24px;background:var(--card);border:2px solid transparent;transition:border-color .25s,background .25s,transform .25s;position:relative}
.ac:hover,.ac:focus-visible{border-color:var(--c);background:#fff;transform:translateY(-3px)}
.ac .af img,.ac .af span{width:84px;height:84px;border-radius:50%;object-fit:cover;background:var(--c);color:#fff;display:grid;place-items:center;font-size:36px;font-weight:600;box-shadow:0 0 0 4px #fff,0 0 0 6px color-mix(in srgb,var(--c) 45%,transparent)}
.ac .at{display:flex;flex-direction:column;gap:2px;min-width:0}
.ac .at b{font-size:27px;font-weight:600;letter-spacing:-.02em}
.ac .at i{font:500 19px var(--fm);font-style:normal;color:var(--c)}
.ac .at em{font-style:normal;font-size:19px;line-height:1.3;color:var(--mut);margin-top:4px}
.ac .ago{position:absolute;right:18px;top:16px;font:500 19px var(--fm);color:var(--mut2)}
.ac.vu .ago{color:#13703A}.ac.vu .ago::before{content:"✓ "}
/* les scènes d'agent */
#scene{position:absolute;inset:0;z-index:30;background:var(--bg,#FCFCFC);display:none;flex-direction:column;font-family:var(--fs);color:var(--ink);cursor:pointer}
#scene.on{display:flex;animation:scin .45s cubic-bezier(.16,1,.3,1)}
@keyframes scin{from{opacity:0;transform:scale(1.03)}}
.sch{display:flex;align-items:center;gap:26px;padding:36px 128px 0}
.sch .back{font:500 20px var(--fs);padding:12px 22px;border-radius:999px;border:1.5px solid var(--line);background:#fff;cursor:pointer}
.sch .who{display:flex;align-items:center;gap:12px;margin-left:auto}
.sch .who img,.sch .who>span{width:52px;height:52px;border-radius:50%;object-fit:cover;background:var(--c);color:#fff;display:grid;place-items:center;font-size:22px;font-weight:600}
.sch .who b{font-size:24px;font-weight:600}.sch .who i{font:400 19px var(--fm);font-style:normal;color:var(--mut)}
.sch .app{font:600 20px var(--fs);padding:12px 22px;border-radius:999px;background:#020308;color:#fff;text-decoration:none}
.scb{flex:1;display:grid;grid-template-columns:620px 1fr;gap:70px;align-items:center;padding:0 128px 60px}
.scl{display:flex;flex-direction:column;gap:22px}
.sck{margin:0;font:500 19px var(--fm);color:var(--green)}
.scl h2{font-size:64px;white-space:normal;line-height:1.02}
.scs{margin:0;font-size:27px;line-height:1.4;color:var(--mut)}
.dots{display:flex;gap:8px}.dots i{width:34px;height:6px;border-radius:9px;background:rgba(2,3,8,.12)}.dots i.on{background:var(--ink)}
.hint{margin:0;font:400 19px var(--fm);color:var(--mut2)}
.scr{display:flex;flex-direction:column;gap:18px;justify-content:center;min-height:560px}
.scr>*{animation:pup .6s cubic-bezier(.16,1,.3,1) both}
@keyframes pup{from{opacity:0;transform:translateY(24px)}}
.win{background:#fff;border-radius:26px;border:1px solid var(--line);box-shadow:0 50px 90px -50px rgba(2,3,8,.5);overflow:hidden}
.wb{height:52px;background:#F1F0EE;display:flex;align-items:center;gap:8px;padding:0 20px;font:400 19px var(--fm);color:var(--mut)}
.wb i{width:12px;height:12px;border-radius:50%;background:rgba(2,3,8,.18)}.wb span{margin-left:12px}
.wc{padding:22px;display:flex;flex-direction:column;gap:12px}
.mr{display:grid;grid-template-columns:230px 1fr auto;gap:18px;align-items:center;padding:16px 20px;border-radius:16px;background:var(--card);font-size:21px;animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.12s)}
.mr b{font-weight:600}.mr span{color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg{font:500 19px var(--fs);font-style:normal;padding:4px 14px;border-radius:999px;animation:pop2 .5s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(.3s + var(--i)*.14s)}
@keyframes pop2{from{opacity:0;transform:scale(.4)}}
.t0{background:#E3F6EC;color:#13703A}.t1{background:#E4E7FB;color:#3B46B8}.t2{background:#FFE9E4;color:#B3321D}.t3{background:#FFF1D6;color:#8A5A00}
.dr{margin:0;font-size:24px;line-height:1.5;padding:22px;border-radius:16px;background:var(--card)}
.dra{display:flex;gap:12px}.btn{font:600 20px var(--fs);padding:12px 24px;border-radius:999px;border:1.5px solid var(--line)}.btn.g{background:var(--green);color:#fff;border-color:var(--green)}
.chat{display:flex;flex-direction:column;gap:14px;padding:8px}
.bu{margin:0;max-width:78%;padding:16px 22px;border-radius:22px;font-size:22px;line-height:1.4;animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.5s)}
.bu.me{align-self:flex-start;background:var(--card);border-bottom-left-radius:6px}
.bu.ag{align-self:flex-end;background:var(--c,#22AA7C);color:#fff;border-bottom-right-radius:6px}
.ls{display:flex;flex-direction:column;gap:12px}
.ls p{margin:0;display:flex;gap:16px;align-items:center;font-size:24px;font-weight:500;padding:18px 22px;border-radius:18px;background:#fff;border:1px solid var(--line);animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.18s)}
.ls p span{flex:none;width:34px;height:34px;border-radius:50%;background:var(--c,#22AA7C);color:#fff;display:grid;place-items:center;font-size:18px}
.chs{display:flex;gap:12px;flex-wrap:wrap}.chs span{font:600 22px var(--fs);padding:14px 26px;border-radius:999px;background:#020308;color:#fff}
.call{position:relative;border-radius:28px;background:#020308;color:#fff;padding:40px 44px 40px 130px;display:flex;flex-direction:column;gap:10px}
.call b{font-size:34px;font-weight:600;letter-spacing:-.02em}.call p{margin:0;font-size:24px;line-height:1.4;color:rgba(255,255,255,.8)}
.call.ok{background:linear-gradient(135deg,#013916,#1A8A45);padding-left:44px}
.ring{position:absolute;left:44px;top:50%;width:56px;height:56px;margin-top:-28px;border-radius:50%;background:var(--c,#22AA7C)}
.ring::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:3px solid var(--c,#22AA7C);animation:rg 1.4s ease-out infinite}
@keyframes rg{from{transform:scale(.8);opacity:1}to{transform:scale(1.7);opacity:0}}
.voc{position:relative;padding:50px 30px 50px 130px;font-size:26px}.voc p{margin:0}
.vsl{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.vsl div{aspect-ratio:4/5;border-radius:24px;padding:24px;display:flex;align-items:flex-end;color:#fff;font-size:24px;font-weight:600;line-height:1.2;background:linear-gradient(160deg,color-mix(in srgb,var(--c) 70%,#000),var(--c));animation:pup .6s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.2s)}
.meet{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.meet span{aspect-ratio:4/3;border-radius:18px;background:#22252B;color:#fff;display:grid;place-items:center;font-size:21px}
.meet .el{background:var(--c);animation:pop2 .6s cubic-bezier(.3,1.5,.5,1) .4s both}
/* le prix */
#pxL{position:absolute;right:128px;top:96px;display:flex;gap:4px;z-index:6}
#pxL button{all:unset;cursor:pointer;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font:400 19px var(--fm);color:var(--mut2)}
#pxL button.on{color:var(--ink);background:var(--card)}
html.shot #prep{display:none!important}
html.shot #scene *,html.shot #scene{animation:none!important}
.ob img,.ac .af img,.sch .who img{object-position:50% 12%}
.prg.po{grid-template-columns:repeat(6,1fr)}

/* ===== Scènes, version storyboard : la scène à droite est un écran 16:9, photo floutée ou papier ===== */
#scene{background:#E4E2DD}
.scb{grid-template-columns:560px 1fr;gap:56px}
.sck{font:500 19px var(--fm);color:var(--mut);letter-spacing:.04em}
.scl h2{font-size:58px}
.scr{min-height:0}
.stg{position:relative;width:100%;aspect-ratio:16/9;border-radius:30px;overflow:hidden;box-shadow:0 60px 110px -60px rgba(2,3,8,.65);display:flex;flex-direction:column;justify-content:center;animation:pup .7s cubic-bezier(.16,1,.3,1) both}
.stg.pap{background:#F7F6F3;padding:44px 48px;gap:20px;border:1px solid rgba(2,3,8,.07)}
.stg.ph{background:#15120F;color:#fff;padding:60px 70px}
.stg.ph .bg{position:absolute;inset:-30px;background-size:cover;background-position:center;filter:blur(9px) brightness(.5) saturate(.9);transform:scale(1.04)}
.stg.ph>*:not(.bg){position:relative}
/* message de l'agent et réponse */
.pile{display:inline-flex;vertical-align:middle}.pile img,.pile i{width:38px;height:38px;border-radius:11px;object-fit:cover;object-position:50% 12%;border:2px solid rgba(255,255,255,.9);font-style:normal;display:grid;place-items:center;color:#fff;font-weight:600}
.pile>*+*{margin-left:-10px}
.say{max-width:640px;display:flex;flex-direction:column;gap:14px;animation:pup .7s cubic-bezier(.16,1,.3,1) .2s both}
.sa{margin:0;display:flex;align-items:center;gap:12px}.sa small{font:400 19px var(--fm);color:rgba(255,255,255,.7)}
.sq{margin:0;font-size:38px;line-height:1.18;font-weight:500;letter-spacing:-.03em}
.rep2{position:absolute!important;right:70px;bottom:56px;margin:0;display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-size:28px;font-weight:500;animation:pup .6s cubic-bezier(.16,1,.3,1) 1.1s both}
.rep2 i{width:40px;height:40px;border-radius:50%;background:#fff;color:#020308;display:grid;place-items:center;font-style:normal;font-size:19px;font-weight:600}
.ck{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.ck li{display:flex;gap:12px;align-items:center;font-size:23px;color:rgba(255,255,255,.88);animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.5s + var(--i)*.22s)}
.ck li::before{content:"";width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.8);flex:none}
/* notifications en verre */
.nfs{display:flex;flex-direction:column;gap:14px;align-items:center}
.clk{margin:0 0 10px;text-align:center;font-size:24px;color:rgba(255,255,255,.75)}.clk b{display:block;font-size:92px;font-weight:300;line-height:1;letter-spacing:-.02em;color:rgba(255,255,255,.92)}
.nf{width:620px;display:grid;grid-template-columns:54px 1fr auto;gap:16px;align-items:center;padding:16px 20px;border-radius:24px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:pup .6s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(.25s + var(--i)*.35s)}
.nf>b{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:26px;color:#fff}
.nf p{margin:0;min-width:0}.nf strong{display:block;font-size:22px;font-weight:600}.nf span{display:block;font-size:20px;color:rgba(255,255,255,.82);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nf em{font-style:normal;font-size:19px;color:rgba(255,255,255,.7);align-self:start}
.chip{position:absolute!important;left:50%;bottom:50px;transform:translateX(-50%);margin:0;display:inline-flex;align-items:center;gap:12px;padding:12px 22px;border-radius:999px;background:#fff;color:#020308;font-size:21px;font-weight:500;white-space:nowrap;box-shadow:0 18px 40px -18px rgba(0,0,0,.6);animation:pup .6s cubic-bezier(.16,1,.3,1) .7s both}
.chip.k{position:relative!important;left:auto;bottom:auto;transform:none;align-self:flex-start;border:1px solid rgba(2,3,8,.1)}
.sp{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(2,3,8,.15);border-top-color:#2F6BFF;animation:tourne .9s linear infinite}
@keyframes tourne{to{transform:rotate(360deg)}}
/* téléphone */
.tel{align-self:center;width:420px;border-radius:38px;background:rgba(20,20,24,.82);border:1px solid rgba(255,255,255,.18);padding:30px 34px;display:flex;justify-content:space-between;align-items:center;backdrop-filter:blur(12px)}
.tn{margin:0;font-size:20px;color:rgba(255,255,255,.7)}.tn b{display:block;font-size:30px;color:#fff;font-weight:500}
.tb{margin:0;display:flex;gap:14px}.tb i{width:58px;height:58px;border-radius:50%}.tb .no{background:#FF453A}.tb .ok{background:#30D158;animation:rg2 1.2s ease-in-out infinite}
@keyframes rg2{50%{transform:scale(1.14)}}
/* boîte mail triée */
.ibx{display:grid;grid-template-columns:230px 1fr;gap:26px;height:100%}
.ibs{display:flex;flex-direction:column;gap:8px;font-size:20px;color:var(--mut)}.ibs b{color:var(--ink);font-size:21px;margin-bottom:6px}
.ibs span{padding:9px 14px;border-radius:12px}.ibs .s0{background:#E3F6EC;color:#13703A}.ibs .s1{background:#E4E7FB;color:#3B46B8}.ibs .s2{background:#FFE9E4;color:#B3321D}.ibs .s3{background:#FFF1D6;color:#8A5A00}
.ibl{display:flex;flex-direction:column;gap:10px;justify-content:center}
.ibl .mr{grid-template-columns:200px auto 1fr;background:#fff;border:1px solid rgba(2,3,8,.07)}
/* fil de réponse */
.thr{display:flex;flex-direction:column;gap:18px}
.thr p{margin:0;display:grid;grid-template-columns:48px 1fr;gap:16px;font-size:23px;line-height:1.45;color:var(--mut)}
.thr i{width:48px;height:48px;border-radius:50%;background:#E0763C;color:#fff;display:grid;place-items:center;font-style:normal;font-weight:600}
.thr .th2 i{background:#020308}.thr b{display:block;color:var(--ink);font-size:21px}
.thr .th2{padding:22px;border-radius:20px;background:#fff;border:1px solid rgba(2,3,8,.08);animation:pup .7s cubic-bezier(.16,1,.3,1) .5s both}
.site{background:#fff;border-radius:22px;border:1px solid rgba(2,3,8,.08);overflow:hidden;display:flex;flex-direction:column}
.site .chat{padding:26px}
/* fichier clients */
.crm{display:flex;flex-direction:column;font-size:21px;background:#fff;border-radius:20px;border:1px solid rgba(2,3,8,.08);overflow:hidden}
.crh,.crr{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:16px;padding:15px 24px;align-items:center}
.crh{font:400 19px var(--fm);color:var(--mut2);background:#F4F3F1}
.crr{border-top:1px solid rgba(2,3,8,.06);animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.2s + var(--i)*.12s)}
.crr.new{background:#F2F6FF}
.st{font-style:normal;font-size:19px;font-weight:500;padding:4px 14px;border-radius:8px;color:#fff}.st.n{background:#5B8DEF}.st.c{background:#D98A4B}.st.k{background:#4F7F52}
/* semainier */
.sem{display:grid;grid-template-columns:repeat(5,1fr);gap:0;height:100%;border-radius:20px;overflow:hidden;border:1px solid rgba(2,3,8,.08);background:#fff}
.sd{display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 12px;border-left:1px solid rgba(2,3,8,.06)}
.sd small{font:400 19px var(--fm);color:var(--mut2)}.sd b{font-size:34px;font-weight:500;width:66px;height:66px;display:grid;place-items:center;border-radius:50%}
.sd.on b{background:#2F6BFF;color:#fff}
.sd p{margin:14px 0 0;width:100%;padding:14px;border-radius:14px;background:#2F6BFF;color:#fff;font-size:19px;line-height:1.3;font-weight:500;animation:pup .6s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(.3s + var(--i)*.15s)}
/* texte surligné */
.hl{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:50px;line-height:1.28;letter-spacing:-.01em;color:rgba(2,3,8,.78)}
.hl mark{color:var(--ink);padding:0 .12em;border-radius:6px;background-size:0 100%;background-repeat:no-repeat;animation:surl 1s cubic-bezier(.16,1,.3,1) both}
.hl .m1{background-color:transparent;background-image:linear-gradient(#C9D6FF,#C9D6FF);animation-delay:.4s}.hl .m2{background-color:transparent;background-image:linear-gradient(#F3D9A6,#F3D9A6);animation-delay:.9s}.hl .m3{background-color:transparent;background-image:linear-gradient(#F6B9B9,#F6B9B9);animation-delay:1.4s}
@keyframes surl{to{background-size:100% 100%}}
.stg .vsl{height:100%}.stg .vsl div{aspect-ratio:auto;height:100%}
.stg .meet{padding:26px}
html.shot .hl mark{background-size:100% 100%}
/* ===== slides « storyboard » : la phrase éditoriale et la nuit ===== */
.edi{background:#E9E6DF}
.edi .frz{position:absolute;inset:0;display:grid;place-items:center}
.edi .frz>div{grid-area:1/1;display:flex;align-items:center;gap:44px;font-size:76px;font-weight:500;letter-spacing:-.04em;white-space:nowrap}
.edi .efan{display:flex}.edi .efan img{width:150px;height:190px;object-fit:cover;object-position:50% 10%;border-radius:18px;box-shadow:0 30px 50px -26px rgba(0,0,0,.6);border:4px solid #fff}
.edi .efan img:nth-child(1){transform:rotate(-7deg) translateX(18px)}.edi .efan img:nth-child(3){transform:rotate(7deg) translateX(-18px)}.edi .efan img:nth-child(2){z-index:2}
.edi .frz>div.shown~div.shown{}
.edi .frz>div:not(:last-child).shown:has(~.shown){opacity:0!important}
.nuit{background:#0E0C0A;color:#fff}
.nuit .bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.62);transition:opacity 1.6s}
.nuit .bg.j{opacity:0}.nuit:has(.mj.shown) .bg.j{opacity:1}
.nuit .mid{position:absolute;left:0;right:0;top:150px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.nuit .hh{font-size:150px;font-weight:300;letter-spacing:-.03em;line-height:1}
.nuit .tk{display:flex;flex-direction:column;gap:12px;margin-top:22px;align-items:flex-start}
.nuit .tk p{margin:0;display:flex;align-items:center;gap:14px;font-size:26px}
.nuit .tk .sp{border-color:rgba(255,255,255,.25);border-top-color:#fff}
.nuit .bil{position:absolute;right:128px;bottom:120px;display:flex;flex-direction:column;gap:12px;font-size:30px;font-weight:500}
.nuit .bil p{margin:0;display:flex;gap:14px;align-items:center}.nuit .bil p::before{content:"";width:14px;height:14px;border-radius:50%;background:#fff}
.nuit h2{position:absolute;left:128px;bottom:120px;color:#fff;font-size:64px}.edi .frz>div{transition:opacity .6s,transform .8s}
.edi .frz:has([data-f="1"].shown)>div:first-child{opacity:0!important}
.edi .frz:has([data-f="2"].shown)>[data-f="1"]{opacity:0!important}
.edi .efan{flex:none;align-items:center}.edi .efan img{flex:none;max-width:none}
.edi .frz>div{width:max-content}
.nuit .bg{filter:blur(16px) brightness(.5);transform:scale(1.08)}
.nuit:has(.mj.shown) .mid{opacity:0;transition:opacity .8s}
.nuit .mat{position:absolute;left:0;right:0;top:150px;text-align:center}
.nuit .mat .hh{display:block}

/* ===== v4 : les vrais écrans des hubs, le Cerveau Agentova, la porte, l'humain ===== */
.scb{grid-template-columns:380px 1fr;gap:48px;padding:0 90px 50px 128px}
.scl h2{font-size:50px;line-height:1.04}
.stg.ecr{background:#fff;padding:0;justify-content:flex-start;border:1px solid rgba(2,3,8,.08)}
.ecr .wb{flex:none;height:44px}
.ecr .vp{flex:1;overflow:hidden;position:relative;background:#0B0D12}
.ecr .vp img{position:absolute;left:0;top:0;width:100%;transform-origin:var(--fx) var(--fy);animation:zoomin 2.4s cubic-bezier(.65,0,.2,1) .35s both}
@keyframes zoomin{from{transform:scale(1) translateY(0)}to{transform:scale(var(--z)) translateY(calc((var(--fy) - 50%) * -.5))}}
html.shot .ecr .vp img{animation:none;transform:scale(var(--z)) translateY(calc((var(--fy) - 50%) * -.5))}
.ecr .cap{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);margin:0;display:flex;align-items:center;gap:14px;padding:12px 26px 12px 12px;border-radius:999px;background:#020308;color:#fff;font-size:25px;font-weight:500;white-space:nowrap;box-shadow:0 24px 50px -20px rgba(0,0,0,.7);animation:pup .7s cubic-bezier(.16,1,.3,1) 1.6s both}
.ecr .cap img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 12%;border:2px solid #fff}
.ecr .cap:not(:has(img)){padding-left:26px}
.par{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:50% 12%;border:2px solid #fff;box-shadow:0 0 0 2px #1F7A8C}
.ibl .mr{grid-template-columns:190px auto 1fr 40px}
.thr .th2 .par{width:48px;height:48px}
/* le Cerveau Agentova : les trois couches de l'illustration du site */
.cbr{position:relative;width:100%;height:100%}
.cbr img{position:absolute;left:50%;top:50%;width:150%;max-width:none;transform:translate(-50%,-50%)}
.cbr img:nth-child(2){animation:flt 5s ease-in-out infinite}.cbr img:nth-child(3){animation:flt 5s ease-in-out -2.5s infinite}
.orbw .core{width:330px;height:330px;background:none;box-shadow:none}
.orbw .core b{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%)}
.g8 .brain .cbr img{width:170%}
/* couverture : la porte */
.cvp .dr{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;mix-blend-mode:screen;-webkit-mask-image:linear-gradient(90deg,transparent 18%,#000 62%);mask-image:linear-gradient(90deg,transparent 18%,#000 62%)}
/* l'accompagnement : des visages */
.hum{display:flex}.hum img{width:120px;height:120px;border-radius:50%;object-fit:cover;object-position:50% 22%;border:5px solid #0C5C2C;box-shadow:0 16px 30px -14px rgba(0,0,0,.6)}
.hum img+img{margin-left:-26px}
.humrow{display:flex;gap:16px;margin-top:auto}.humrow img{width:74px;height:74px;border-radius:50%;object-fit:cover;object-position:50% 22%}.cbr{position:relative;width:100%;aspect-ratio:1192/864;height:auto}
.cbr img{position:absolute;left:0;top:0;width:100%;max-width:none;transform:none}
.cbr img:nth-child(2){animation:cbf 5s ease-in-out infinite}.cbr img:nth-child(3){animation:cbf 5s ease-in-out -2.5s infinite}
@keyframes cbf{50%{transform:translateY(-10px)}}
.orbw .core{width:500px;height:auto;display:block}
.orbw .core b{bottom:-22px}
.g8 .brain .cbr{position:absolute;left:50%;top:50%;width:150%;transform:translate(-50%,-50%)}
.g8 .brain .cbr img{width:100%}
.g8 .brain .glow{display:none}
/* ===== v5 : ce dont tu hérites ===== */
.her{position:absolute;inset:0}.her svg{position:absolute;inset:0;width:100%;height:100%}
.hc{position:absolute;left:960px;top:640px;translate:-50% -50%;padding:26px 44px;border-radius:999px;background:linear-gradient(135deg,#013916,#1A8A45);color:#fff;text-align:center;box-shadow:0 30px 60px -24px rgba(1,57,22,.7),0 0 0 14px rgba(34,170,124,.12)}
.hc b{display:block;font-size:36px;font-weight:600;letter-spacing:-.03em}.hc span{font:400 19px var(--fm);color:rgba(255,255,255,.8)}
.hn2{position:absolute;translate:-50% -50%;display:flex;align-items:center;gap:16px;padding:14px 24px 14px 14px;border-radius:26px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -24px rgba(0,0,0,.45);max-width:470px}
.hn2 p{margin:0;font-size:20px;line-height:1.3;color:var(--mut)}.hn2 b{display:block;font-size:24px;color:var(--ink);letter-spacing:-.02em}
.pile2{display:flex;flex:none}.pile2 img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 12%;border:3px solid #fff}.pile2 img+img{margin-left:-16px}
.ic2{flex:none;min-width:64px;height:64px;padding:0 12px;border-radius:20px;background:#E3F6EC;color:#13703A;display:grid;place-items:center;font-size:24px;font-weight:600}
.ph2{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 25%;flex:none}
/* ===== v5 : Charlotte en motion design ===== */
.mo1{display:flex;flex-direction:column;align-items:center;gap:22px;width:100%}
.pbar{width:88%;display:flex;align-items:center;gap:16px;padding:16px 16px 16px 18px;border-radius:24px;background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.45),0 0 0 1px rgba(2,3,8,.06)}
.pth{display:flex;gap:8px;flex:none}.pth img{width:64px;height:64px;border-radius:14px;object-fit:cover;animation:drop .9s cubic-bezier(.2,1.2,.4,1) both;animation-delay:calc(.3s + var(--i)*.35s)}
@keyframes drop{from{opacity:0;transform:translate(calc(-120px + var(--i)*60px),-260px) rotate(-18deg) scale(1.8)}}
.ptx{flex:1;font-size:24px;color:var(--ink);white-space:nowrap;overflow:hidden;border-right:3px solid #2F6BFF;animation:typ 2.2s steps(60,end) 1.5s both,blink .8s step-end infinite}
@keyframes typ{from{max-width:0}to{max-width:100%}}@keyframes blink{50%{border-color:transparent}}
.psd{flex:none;width:48px;height:48px;border-radius:14px;background:#020308;color:#fff;display:grid;place-items:center;font-size:24px}
.mcap{margin:0;font:400 19px var(--fm);color:var(--mut2)}
.mo2{display:flex;flex-direction:column;gap:16px;width:100%}
.mo2>p{margin:0;display:flex;align-items:center;gap:14px;font-size:24px;animation:pup .5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.5s)}
.pgb{height:10px;border-radius:9px;background:rgba(2,3,8,.08);overflow:hidden}.pgb i{display:block;height:100%;background:linear-gradient(90deg,#B0457A,#E0566C,#F9A03F);animation:prog 2.6s cubic-bezier(.65,0,.35,1) both}
@keyframes prog{from{width:0}to{width:100%}}
.skl{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:6px}.skl span{height:220px;border-radius:20px;background:linear-gradient(100deg,#ECEAE6 30%,#F7F6F3 50%,#ECEAE6 70%);background-size:300% 100%;animation:shim 1.4s linear infinite}
@keyframes shim{to{background-position:-150% 0}}
.mo3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;width:100%;align-items:start}
.ig{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -34px rgba(0,0,0,.5);animation:igin .8s cubic-bezier(.2,1.3,.4,1) both;animation-delay:calc(.2s + var(--i)*.35s)}
@keyframes igin{from{opacity:0;transform:translateY(40px) scale(.85)}}
.igh{margin:0;display:flex;align-items:center;gap:10px;padding:12px 14px;font-size:18px}.igh i{width:28px;height:28px;border-radius:50%;background:conic-gradient(#F9A03F,#E0566C,#8A4BD6,#F9A03F)}
.ig img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.igl{margin:0;padding:10px 14px 0;font-size:18px;color:#E0566C}.igc{margin:0;padding:4px 14px 14px;font-size:18px;color:var(--ink)}
@property --c{syntax:"<integer>";inherits:false;initial-value:0}
.cnt{--c:0;counter-reset:c var(--c);animation:cnt 2.4s cubic-bezier(.2,.8,.2,1) 1s forwards;color:var(--ink)}.cnt::after{content:counter(c)}
@keyframes cnt{to{--c:var(--n)}}
html.shot .cnt{--c:var(--n)}html.shot .ptx{max-width:100%}html.shot .pgb i{width:100%}
.mo2 .sp{width:26px;height:26px;border-radius:50%;border:3px solid rgba(176,69,122,.2);border-top-color:#B0457A;animation:spin .8s linear infinite;flex:none}@keyframes spin{to{transform:rotate(360deg)}}

.prv{display:block;width:100%;margin:4px 0 22px;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:#fff;font:500 18px var(--fs,inherit);color:var(--ink)}

.prlab{display:block;margin-top:14px;text-align:center;font-size:16px;color:var(--mut);text-decoration:underline}

/* ===== v6 : scènes sur les vraies interfaces ===== */
.sch .back{color:#020308}
.ecr .vp img{animation-duration:1.5s;animation-delay:.1s}.ecr .cap{animation-delay:.8s}
.stg.pap.xfull{padding:0;justify-content:stretch;background:#fff}
.stg .lg{width:1em;height:1em;flex:none;display:inline-block;vertical-align:-.15em}
.xcur{position:absolute;z-index:20;width:40px;height:40px;left:0;top:0;pointer-events:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35));opacity:0}
.xcur svg{width:100%;height:100%}
.xtp>span{display:block;clip-path:inset(0 100% 0 0);animation:xtyp .9s steps(28,end) var(--d) forwards}
@keyframes xtyp{to{clip-path:inset(0 0 0 0)}}
.xdots{display:inline-flex;gap:6px;padding:14px 18px;border-radius:22px;background:#EFEFEF;width:max-content;opacity:0;animation:xdot 1s var(--d) both}
.xdots i{width:9px;height:9px;border-radius:50%;background:#8E8E93;animation:xbl 1s infinite}.xdots i:nth-child(2){animation-delay:.15s}.xdots i:nth-child(3){animation-delay:.3s}
@keyframes xdot{0%{opacity:0}10%,85%{opacity:1}100%{opacity:0;height:0;padding:0;margin:0}}
@keyframes xbl{50%{opacity:.3}}
@keyframes xin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
html.shot .xtp>span{clip-path:none;animation:none}html.shot .xdots{display:none}

/* --- Charlotte : calendrier éditorial --- */
.xcal{position:relative;display:grid;grid-template-columns:230px 1fr;height:100%;font-size:15px;color:#020308;background:#fff}
.xcs{border-right:1px solid #EEE;padding:22px 14px;display:flex;flex-direction:column;gap:4px}
.xcs p{margin:0;padding:9px 12px;border-radius:12px;color:#6B6E76}.xcs .xcb{color:#020308;font-weight:500;margin-bottom:14px}.xcs .xch{font-size:13px;color:#9A9CA3;padding-bottom:2px}
.xcs p.on{background:#FCE8F6;color:#020308;font-weight:500}
.xcm{display:flex;flex-direction:column;min-width:0}
.xct{display:flex;align-items:center;gap:14px;padding:20px 22px}
.xct b{font-size:21px;font-weight:600}.xcn{width:26px;height:26px;border-radius:50%;border:1px solid #E5E5E5;display:grid;place-items:center;font-size:14px}
.xcf{margin-left:auto;display:flex;gap:8px;align-items:center}.xcf em{font-style:normal;color:#8E8E93;padding:5px 12px;border:1px solid #EEE;border-radius:999px}.xcf .lg{font-size:26px;padding:5px;border:1px solid #EEE;border-radius:50%;box-sizing:content-box}
.xcp{background:#020308;color:#fff;padding:10px 16px;border-radius:12px;font-weight:500}
.xcg{flex:1;display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid #EEE;min-height:0}
.xcd{border-right:1px solid #F1F1F1;display:flex;flex-direction:column;gap:10px;padding:0 0 10px;min-width:0}
.xcd>p{margin:0;text-align:center;padding:10px 0;color:#8E8E93;border-bottom:1px solid #EEE}.xcd.on>p{color:#020308;font-weight:600;background:#F7F7F7}
.xcc{margin:0 6px;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 8px 20px -12px rgba(0,0,0,.4);border:1px solid #EFEFEF;animation:xdrop .7s cubic-bezier(.2,1.3,.4,1) both;animation-delay:calc(.4s + var(--i)*1s)}
@keyframes xdrop{from{opacity:0;transform:translateY(-40px) scale(.9)}}
.xcc1{margin:0;display:flex;gap:4px;align-items:center;padding:7px 8px 2px;font-size:12px}.xcc1 em{font-style:normal;margin-left:auto}
.xcc2{margin:0;padding:0 8px 6px;font-size:12px;line-height:1.3;color:#3A3D44;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xcc img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.kcal{animation:kcal 2.2s ease-in-out var(--d) both}
@keyframes kcal{0%{opacity:0;transform:translate(1100px,520px)}30%{opacity:1}70%{transform:translate(1150px,36px)}80%{transform:translate(1150px,36px) scale(.85)}100%{opacity:1;transform:translate(1150px,36px)}}

/* --- Margot : Gmail --- */
.xgm{display:flex;flex-direction:column;height:100%;background:#F8FAFD;font:400 16px/1.35 "Google Sans",Roboto,Arial,sans-serif;color:#1F1F1F}
.xgt{display:flex;align-items:center;gap:12px;padding:12px 20px}.xgt .lg{font-size:30px;width:1.33em}.xgt b{font-size:22px;font-weight:400;color:#444746}
.xgb{font-size:22px;color:#444746;width:30px}
.xgs{margin-left:60px;flex:1;max-width:640px;background:#E9EEF6;border-radius:999px;padding:12px 22px;color:#444746}
.xgu{margin-left:auto;width:36px;height:36px;border-radius:50%;background:#1A8A45;color:#fff;display:grid;place-items:center;font-weight:500}
.xgw{flex:1;display:grid;grid-template-columns:230px 1fr;min-height:0}
.xgn{padding:4px 10px;display:flex;flex-direction:column;gap:2px}
.xgn p{margin:0;padding:8px 14px;border-radius:0 999px 999px 0;display:flex;justify-content:space-between;color:#444746}
.xgn .xgc{background:#C2E7FF;border-radius:16px;padding:16px 20px;margin:0 0 12px;width:max-content;color:#001D35;font-weight:500}
.xgn p.on{background:#D3E3FD;color:#001D35}.xgn em{font-style:normal;font-weight:600}
.xgl i{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:8px}.xgn .xgl{justify-content:flex-start;align-items:center;animation:xin .5s 1.2s both}
.xgl2{background:#fff;border-radius:16px;margin:0 16px 16px 0;overflow:hidden;display:flex;flex-direction:column}
.xgtab{display:flex;border-bottom:1px solid #EEE}.xgtab span{padding:14px 24px;color:#444746;flex:0 0 200px}.xgtab .on{color:#0B57D0;border-bottom:3px solid #0B57D0;font-weight:500}
.xgr{display:flex;align-items:center;gap:12px;padding:0 16px;height:52px;border-bottom:1px solid #F1F3F4;background:#F2F6FC;animation:xin .45s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*.18s)}
.xgr.un{background:#fff}.xgr.un b,.xgr.un strong{font-weight:700;color:#1F1F1F}
.xgr b{flex:0 0 190px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xgck{width:16px;height:16px;border:2px solid #A9ACAA;border-radius:3px;flex:none}.xgst{color:#A9ACAA;flex:none}
.xgsub{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#5E5E5E}.xgsub strong{font-weight:400;color:#1F1F1F}
.xglb{font-style:normal;font-size:13px;padding:2px 8px;border-radius:4px;margin-right:8px;color:#1F1F1F}
.xgr time{font-size:14px;font-weight:600;color:#1F1F1F}
.xgr.xok .xglb{animation:xin .4s both;animation-delay:calc(.8s + var(--i)*.3s)}
.xgm2{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:50% 12%;animation:xin .4s both;animation-delay:calc(1s + var(--i)*.3s)}
.xgdone{font-style:normal;font-size:13px;color:#1A8A45;font-weight:600;animation:xin .4s both;animation-delay:calc(1.1s + var(--i)*.3s)}
.xgo{flex:1;background:#fff;border-radius:16px;margin:0 16px 16px;padding:22px 34px;display:flex;flex-direction:column;gap:18px;min-height:0}
.xgo h4{margin:0;font-size:24px;font-weight:400;display:flex;align-items:center;gap:12px}
.xgmsg{display:flex;gap:14px}.xgmsg p{margin:0;color:#3C4043}.xgmsg small{color:#5E5E5E}
.xga{width:40px;height:40px;border-radius:50%;background:#7B61FF;color:#fff;display:grid;place-items:center;flex:none;font-weight:500}
.xgrep{border:1px solid #DADCE0;border-radius:14px;padding:16px 20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 2px 8px rgba(0,0,0,.06);animation:xin .5s .2s both}
.xgrh{margin:0;display:flex;align-items:center;gap:10px;color:#5E5E5E;font-size:15px}.xgrh img{width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:50% 12%}.xgrh b{color:#1F1F1F}
.xgrt{margin:0;font-size:18px;color:#1F1F1F;min-height:80px}
.xgbtn{margin:0;display:flex;align-items:center;gap:16px;opacity:0;animation:xin .5s var(--d) both}
.xgbtn span{background:#0B57D0;color:#fff;border-radius:999px;padding:10px 24px;font-weight:500;animation:xpulse 1.4s calc(var(--d) + .6s) 2}.xgbtn small{color:#5E5E5E;font-size:14px}
@keyframes xpulse{50%{box-shadow:0 0 0 10px rgba(11,87,208,.18)}}

/* --- le site du client (Margot et Lily) --- */
.xsite{display:flex;flex-direction:column;height:100%;background:#fff}
.xsite .wb{flex:none}
.xsb{position:relative;flex:1;padding:22px 40px;background:linear-gradient(180deg,#F6F3EE,#fff 60%);overflow:hidden;font-size:16px}
.xsn{display:flex;gap:28px;align-items:center;color:#5B5E66}.xsn b{color:#020308;font-size:20px;margin-right:auto;letter-spacing:-.02em}
.xsb h3{font-size:44px;letter-spacing:-.03em;font-weight:500;margin:34px 0 26px;max-width:620px;line-height:1.05}
.xscards{display:grid;grid-template-columns:repeat(3,230px);gap:18px}
.xsc{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 14px 30px -20px rgba(0,0,0,.4);padding-bottom:12px;transition:.4s}
.xsc i{display:block;height:150px;background:linear-gradient(135deg,#E9E4DA,#CFC6B6);background-size:cover;background-position:center}
.xsc i.im1{background-image:url(../assets/site/im1.jpg)}.xsc i.im2{background-image:url(../assets/site/im2.jpg)}.xsc i.im3{background-image:url(../assets/site/im3.jpg)}
.xsc b{display:block;padding:10px 14px 0;font-weight:600}.xsc span{padding:0 14px;color:#1A8A45;font-weight:600}
.xsc.hit{animation:xhit 1s 6.3s both}
@keyframes xhit{to{transform:translateY(-8px);box-shadow:0 0 0 4px #22AA7C,0 24px 40px -20px rgba(0,0,0,.5)}}
.xbot{position:absolute;right:26px;bottom:22px;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.xbb{width:64px;height:64px;border-radius:50%;background:#020308;display:grid;place-items:center;box-shadow:0 12px 26px -10px rgba(0,0,0,.5);overflow:hidden}.xbb img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:50% 12%}
.xbw{width:400px;background:#fff;border-radius:22px;box-shadow:0 30px 60px -24px rgba(0,0,0,.45);padding:16px;display:flex;flex-direction:column;gap:10px;transform-origin:bottom right;animation:xopen .45s cubic-bezier(.2,1.2,.4,1) 1s both}
@keyframes xopen{from{opacity:0;transform:scale(.3)}}
.xbh{margin:0 0 4px;display:flex;align-items:center;gap:10px}.xbh img{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:50% 12%}.xbh small{color:#8E8E93;margin-left:auto;font-size:12px}
.xbm{margin:0;padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.35;max-width:85%;animation:xin .4s var(--d) both}
.xbm.me{align-self:flex-end;background:#020308;color:#fff;border-bottom-right-radius:6px}.xbm.ag{background:#F1F1F1;border-bottom-left-radius:6px}
.xbl{margin:0;padding:10px 14px;border-radius:14px;border:1.5px solid #22AA7C;color:#13703A;font-weight:600;font-size:15px;animation:xin .4s var(--d) both}
.kbot{animation:kbot 1.1s ease-in-out both}
@keyframes kbot{0%{opacity:0;transform:translate(700px,250px)}40%{opacity:1}80%{transform:translate(1200px,600px)}90%{transform:translate(1200px,600px) scale(.8)}100%{opacity:0;transform:translate(1200px,600px)}}

/* --- Arthur : Instagram et le workflow --- */
.xig{position:relative;display:flex;flex-direction:column;height:100%;background:#fff;font:400 16px/1.35 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#000}
.xigh{display:flex;align-items:center;gap:12px;padding:14px 22px;border-bottom:1px solid #DBDBDB}.xigh .lg{font-size:30px}.xigh b{font-size:20px}
.xigex{margin-left:auto;font:400 15px var(--fm);color:#8E8E93}
.xigw{flex:1;display:grid;grid-template-columns:1fr 470px;min-height:0}
.xigimg{background:#000;display:grid;place-items:center;overflow:hidden}.xigimg img{height:100%;width:100%;object-fit:cover}
.xigc{display:flex;flex-direction:column;gap:14px;padding:16px 18px;border-left:1px solid #DBDBDB}
.xigc p{margin:0}
.xigu{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid #EFEFEF}.xigu span{color:#8E8E93;font-size:14px}
.xigu i,.xigcm i,.xdmh i{width:34px;height:34px;border-radius:50%;flex:none;background:conic-gradient(#F9A03F,#E0566C,#8A4BD6,#F9A03F)}
.xigcm i.c,.xdmh i.c{background:linear-gradient(135deg,#C9B8A6,#8C7A6B)}
.xigcm{display:flex;gap:10px;animation:xin .5s var(--d) both}.xigcm small{display:block;color:#8E8E93;font-size:13px;margin-top:4px}.xigcm em{font-style:normal;color:#1A8A45;font-weight:600}
.xigcm.rep{margin-left:44px}
.xigl{margin-top:auto!important;border-top:1px solid #EFEFEF;padding-top:12px;font-size:20px}.xigl b{font-size:15px}
.xnot{position:absolute;top:70px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;width:560px;padding:14px 18px;border-radius:22px;background:rgba(245,245,247,.92);backdrop-filter:blur(16px);box-shadow:0 24px 50px -20px rgba(0,0,0,.45);animation:xnot .6s cubic-bezier(.2,1.2,.4,1) var(--d) both}
@keyframes xnot{from{opacity:0;transform:translate(-50%,-40px)}}
.xnot .lg{font-size:40px}.xnot p{margin:0;flex:1;font-size:15px}.xnot p>b{display:block}.xnot em{font-style:normal;color:#8E8E93;font-size:13px;align-self:flex-start}
.xig.dm .xdmh{display:flex;align-items:center;gap:12px;padding:12px 22px;border-bottom:1px solid #EFEFEF}.xdmh p{margin:0}.xdmh small{display:block;color:#8E8E93;font-size:13px}
.xdmb{flex:1;display:flex;flex-direction:column;gap:8px;padding:18px 26px;justify-content:flex-end;overflow:hidden}
.xdm{margin:0;max-width:62%;padding:11px 16px;border-radius:22px;font-size:17px;animation:xin .4s var(--d) both}
.xdm.ag{align-self:flex-end;background:linear-gradient(135deg,#7B3FE4,#3797F0);color:#fff}.xdm.me{background:#EFEFEF}
.xdmb .xdots{align-self:flex-end}
.xdmi{margin:0 22px 16px;border:1px solid #DBDBDB;border-radius:999px;padding:12px 20px;color:#8E8E93}
.xwf{display:grid;grid-template-columns:330px 1fr;height:100%;font-size:15px;background:#fff}
.xwfp{padding:22px 20px;display:flex;flex-direction:column;gap:8px;border-right:1px solid #EEE}.xwfp p{margin:0}
.xwfb{font-weight:500;margin-bottom:10px!important}.xwfa{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #EEE;border-radius:12px}.xwfa .lg{font-size:20px}
.xwfq{margin-top:14px!important;font-weight:500}
.xwfo{padding:10px 14px 10px 36px;border:1px solid #EEE;border-radius:12px;position:relative}.xwfo::before{content:"";position:absolute;left:12px;top:50%;width:12px;height:12px;margin-top:-7px;border-radius:50%;border:1.5px solid #BBB}
.xwfo.on{background:#F1F1F1}.xwfo.on::before{background:#020308;border-color:#020308}
.xwfc{position:relative;background:#F7F7F7 radial-gradient(#DADADA 1px,transparent 1px) 0 0/22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;padding:20px}
.xwn{position:relative;width:400px;animation:xin .5s both;animation-delay:calc(.3s + var(--i)*.7s)}
.xwn em{font-style:normal;font-size:12px;color:#5B6BD9;background:#EEF0FF;padding:3px 10px;border-radius:999px;display:inline-block;margin-bottom:6px}
.xwn div{background:#fff;border-radius:14px;padding:12px 16px;box-shadow:0 8px 24px -14px rgba(0,0,0,.35)}.xwn p{margin:0 0 6px;display:flex;gap:8px;align-items:center}.xwn .lg{font-size:18px}
.xwn span{display:block;background:#F5F5F5;border-radius:10px;padding:8px 12px;color:#3A3D44;font-size:14px}
.xwn+.xwn::before{content:"";position:absolute;left:50%;top:-34px;height:30px;border-left:2px dashed #C9C9C9}
.xchan{display:flex;align-items:center;gap:16px;margin:0 0 26px;font-size:54px}.xchan span{font-size:22px;color:rgba(255,255,255,.8)}

/* --- Lily --- */
.xlt{display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center}
.xlav{position:relative;width:170px;height:170px;border-radius:50%;padding:6px;background:conic-gradient(#8A4BD6,#3797F0,#22AA7C,#8A4BD6);animation:xring 3s linear infinite}
.xlav img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:5px solid #15120F}
.xlav em{position:absolute;right:-14px;bottom:4px;font-size:58px;font-style:normal;transform-origin:70% 80%;animation:xwave 1.4s ease-in-out .5s 3}
@keyframes xwave{20%,60%{transform:rotate(18deg)}40%,80%{transform:rotate(-10deg)}}
@keyframes xring{to{filter:hue-rotate(360deg)}}
.xltx{margin:0;font-size:42px;font-weight:500;letter-spacing:-.02em}.xltx small{display:block;font-size:22px;color:rgba(255,255,255,.7);font-weight:400;margin-top:8px}
.xltb{display:inline-flex!important;align-items:center;gap:12px;font-size:26px!important;padding:18px 34px!important;background:#fff!important;color:#020308!important;animation:xpulse2 1.6s 1s infinite}
.xltb svg{width:26px;height:26px}
@keyframes xpulse2{50%{box-shadow:0 0 0 14px rgba(255,255,255,.15)}}
.xlw{position:absolute;right:26px;bottom:22px;font-size:15px}
.xlw1{display:flex;align-items:center;gap:10px;flex-wrap:wrap;width:330px;background:#fff;border-radius:22px;padding:14px;box-shadow:0 24px 50px -24px rgba(0,0,0,.45);animation:xlw1 4.4s both}
@keyframes xlw1{0%{opacity:0;transform:translateY(20px)}10%,38%{opacity:1;transform:none}45%,100%{opacity:0;transform:scale(.9);visibility:hidden}}
.xlw1 p{margin:0;display:flex;align-items:center;gap:10px;width:100%;font-size:17px}
.orb{width:36px;height:36px;border-radius:50%;flex:none;background:conic-gradient(from 40deg,#0E7CC1,#7FD3F2,#0E7CC1,#BDEBFA,#0E7CC1);animation:xring 3s linear infinite}
.xlcta{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;background:#020308;color:#fff;border-radius:999px;padding:12px;font-weight:600}.xlcta svg{width:18px;height:18px}
.xlch{width:44px;height:44px;border-radius:50%;border:1px solid #E5E5E5;display:grid;place-items:center}
.xlw2{position:absolute;right:0;bottom:0;width:360px;height:420px;background:#fff;border-radius:24px;padding:16px;box-shadow:0 30px 60px -24px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:14px;transform-origin:bottom right;animation:xopen .45s cubic-bezier(.2,1.2,.4,1) 1.9s both}
.xlst{margin:0;display:flex;align-items:center;gap:10px}.xlst span{background:#F1F1F1;border-radius:999px;padding:6px 14px;color:#5B5E66}
.wave{margin-left:auto;display:flex;gap:3px;align-items:center;height:24px}.wave i{width:4px;background:#0E7CC1;border-radius:3px;animation:xwv .9s ease-in-out infinite}
.wave i:nth-child(1){height:30%}.wave i:nth-child(2){height:70%;animation-delay:.1s}.wave i:nth-child(3){height:100%;animation-delay:.2s}.wave i:nth-child(4){height:60%;animation-delay:.3s}.wave i:nth-child(5){height:35%;animation-delay:.4s}
@keyframes xwv{50%{transform:scaleY(.35)}}
.xlg{margin:0;font-size:17px;flex:1}
.xlin{margin:0;border:1px solid #E5E5E5;border-radius:16px;padding:14px;color:#8E8E93;display:flex;justify-content:space-between}
.klily{animation:klily 1.6s ease-in-out .6s both}
@keyframes klily{0%{opacity:0;transform:translate(700px,250px)}40%{opacity:1}75%{transform:translate(1000px,620px)}85%{transform:translate(1000px,620px) scale(.8)}100%{opacity:0;transform:translate(1000px,620px)}}

/* --- Elisa --- */
.xorc{display:flex;flex-direction:column;gap:12px;padding:26px 40px;height:100%;background:#FBFAF8;font-size:18px}
.xorh{margin:0 0 6px;display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid #EEE}.xorh b{font-size:22px}
.xorh span{display:flex;align-items:center;gap:4px;color:#8E8E93}.xorh img{width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:50% 12%;margin-left:-8px;border:2px solid #fff}
.xom{display:flex;gap:14px;align-items:flex-start;animation:xin .5s var(--d) both}
.xom img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 12%;flex:none}
.xom p{margin:0;background:#fff;border:1px solid #EEE;border-radius:4px 18px 18px 18px;padding:10px 16px;line-height:1.4}.xom em{font-style:normal;color:#E0566C;font-weight:600}
.stg.xvis{background:#fff;padding:0}.xvis img{width:100%;height:100%;object-fit:cover;animation:xzm 6s ease-out both}
@keyframes xzm{from{transform:scale(1.06)}to{transform:none}}

/* --- Ethan --- */
.xeth{display:flex;flex-direction:column;gap:18px;padding:26px 34px;height:100%;background:#F7F6F3}
.xethh{margin:0;display:flex;align-items:center;gap:10px;font-size:20px;font-weight:500}.xethh .lg{font-size:26px}
.xeth .mo3 .ig img{aspect-ratio:1}
.xeth .ig{transition:.5s}.xeth .ig.xhit{animation:igin .8s both,xhit2 .8s 1s forwards}
@keyframes xhit2{to{transform:translateY(-10px) scale(1.04);box-shadow:0 0 0 4px #E0566C,0 40px 60px -30px rgba(0,0,0,.5)}}
.xbest{font-style:normal;background:#E0566C;color:#fff;border-radius:999px;padding:2px 10px;font-size:13px;margin-left:6px;animation:xin .4s 1.4s both}
.xcamp{display:grid;grid-template-columns:400px 1fr;gap:34px;padding:34px 40px;height:100%;background:#F7F6F3;align-items:center}
.xcl{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.45);animation:xin .6s both}
.xcl img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.xcl p{margin:0;padding:10px 14px}.xcl small{display:block;color:#8E8E93;font-size:13px}
.xcbtn{display:block;margin:0 14px 14px;padding:10px;border-radius:10px;background:#0064E0;color:#fff;text-align:center;font-weight:600}
.xcr{display:flex;flex-direction:column;gap:12px;font-size:19px}
.xck{margin:0 0 6px;font-weight:600;font-size:22px;display:flex;align-items:center;gap:12px}
.xsoon{font-style:normal;font-size:13px;font-weight:600;color:#9A6B00;background:#FFF4D6;border-radius:999px;padding:3px 10px}
.xcrow{margin:0;display:flex;justify-content:space-between;gap:20px;padding:14px 18px;background:#fff;border-radius:14px;animation:xin .5s both;animation-delay:calc(.4s + var(--i)*.45s)}.xcrow span{color:#8E8E93}
.xcgo{margin:6px 0 0;display:flex;align-items:center;gap:10px;padding:14px 18px;border-radius:14px;background:#E3F6EC;color:#13703A;font-weight:600;animation:xin .5s 2.6s both}.xcgo .lg{font-size:24px}

/* --- Benoît --- */
.xplan{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:32px;height:100%;background:#F7F6F3;align-content:center}
.xpm{background:#fff;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 40px -30px rgba(0,0,0,.4);animation:xin .6s both;animation-delay:calc(.2s + var(--i)*.6s)}
.xpk{margin:0;font:500 14px var(--fm);color:#8E8E93;text-transform:uppercase;letter-spacing:.06em}.xpm h4{margin:0 0 4px;font-size:26px;font-weight:600;letter-spacing:-.02em}
.xpr{margin:0;display:flex;align-items:center;gap:10px;font-size:17px;line-height:1.3}.xpr img{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:50% 12%;flex:none}
.xper{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:34px 40px;height:100%;background:#F7F6F3;align-content:center}
.xper>.xpk{grid-column:1/-1}
.xpc{background:#fff;border-radius:18px;padding:20px 22px;display:flex;flex-direction:column;gap:8px;animation:xin .5s both;animation-delay:calc(.2s + var(--i)*.4s)}
.xpc span{color:#8E8E93;font-size:16px}.xpc b{font-size:22px;font-weight:500;line-height:1.3}

.xgm{font-size:19px}.xgr{height:58px}.xgr b{flex-basis:220px}.xgtab span{flex-basis:220px}.xgn p{padding:9px 16px}
.xgo h4{font-size:30px}.xgmsg p{font-size:20px}.xgrt{font-size:24px;line-height:1.45}.xgrh{font-size:18px}.xgbtn span{font-size:20px;padding:12px 30px}.xgbtn small{font-size:17px}
.xpage{position:absolute;left:24px;top:20px;bottom:20px;right:470px;background:#fff;border-radius:18px;box-shadow:0 30px 60px -30px rgba(0,0,0,.5);display:grid;grid-template-columns:1fr 1fr;overflow:hidden;animation:xpage .6s cubic-bezier(.16,1,.3,1) 7.2s both}
@keyframes xpage{from{opacity:0;transform:translateY(30px) scale(.97)}}
.xpage>i{background-size:cover;background-position:center}.xpage>i.im2{background-image:url(../assets/site/im2.jpg)}
.xpage>div{padding:28px;display:flex;flex-direction:column;gap:10px}.xpage h4{margin:0;font-size:30px;letter-spacing:-.02em}.xpage b{color:#1A8A45;font-size:24px}.xpage p{margin:0;color:#5B5E66}
.xpbtn{margin-top:auto;background:#020308;color:#fff;border-radius:12px;padding:12px;text-align:center;font-weight:600}
.xig{font-size:19px}.xigc{font-size:18px}.xnot{width:640px;top:56px}.xnot p{font-size:17px}
.xdm{font-size:20px;width:max-content;max-width:62%}
.xart{margin-left:auto;display:flex;align-items:center;gap:10px;background:#E3F6EC;color:#13703A;font-weight:600;border-radius:999px;padding:6px 16px 6px 6px;font-size:16px}.xart img{width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:50% 12%}
.xwf{grid-template-columns:380px 1fr;font-size:18px}.xwn{width:540px}.xwn em{font-size:15px}.xwn span{font-size:17px}.xwn p{font-size:19px}.xwfc{gap:30px}

.xlt .xltb{flex-direction:row!important;white-space:nowrap;text-decoration:none!important;border-radius:999px!important;font-weight:600!important;font-family:var(--fs)}

.xlw2{gap:12px;width:400px;height:460px}.xlw2 .xlg{flex:none;font-size:18px}.xlw2 .xlin{margin-top:auto}.xlw2 .xbm{font-size:16px}.xlw2 .xbm.me{background:#0E7CC1}

.xorc{font-size:21px;gap:14px}.xom img{width:54px;height:54px}.xorh b{font-size:26px}

.xtxt{display:grid;place-items:center;aspect-ratio:1;background:linear-gradient(135deg,#B0457A,#E0566C 55%,#F9A03F);color:#fff;font:600 16px/1.1 var(--fs);text-align:center;letter-spacing:-.02em}.xtxt.big{font-size:34px}

.xpm{padding:28px;gap:18px}.xpm h4{font-size:36px}.xpk{font-size:16px}.xpr{font-size:22px;gap:14px}.xpr img{width:50px;height:50px}.xpc b{font-size:26px}.xpc span{font-size:18px}

.edi .frz>div{display:grid!important;grid-template-columns:1fr auto 1fr;width:1800px!important;gap:44px}.edi .frz .pa{text-align:right}.edi .frz .pb{text-align:left}

/* ===== v7 ===== */
/* Margot : les mails arrivent, puis les libellés tombent tout seuls */
.xauto{height:100%}
.xauto .xgr{background:#fff}.xauto .xgr b,.xauto .xgr strong{font-weight:700}
.xauto .xgr.xok{animation:xin .45s cubic-bezier(.16,1,.3,1) both,xread .4s forwards;animation-delay:calc(var(--i)*.18s),calc(2.6s + var(--i)*.3s)}
@keyframes xread{to{background:#F2F6FC}}
.xauto .xgr.xok .xglb{animation-delay:calc(2.2s + var(--i)*.3s)}
.xauto .xgm2{animation-delay:calc(2.3s + var(--i)*.3s)}
.xauto .xgdone{display:none}
.xauto .xgn .xgl{animation-delay:3.4s}
/* le widget de Margot, au design du vrai widget Agentova */
.xmav{width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:50% 12%;flex:none}
.xmp .xlst span{background:#E3F6EC;color:#13703A}
.xmx{margin-left:auto;font-style:normal;color:#8E8E93;font-size:18px}
.xmp .xlg{font-size:17px}
.xmp .xbm.me{background:#020308}
.xmic{letter-spacing:4px}.xmic b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#8E8E93;color:#fff;letter-spacing:0}
.xsite .xlw2.xmp{height:auto;min-height:420px}
/* Ethan */
.xads{position:relative;height:100%;background:#F7F8FA;font-size:18px}
.xadl{position:absolute;inset:0;padding:24px 30px;animation:xout .5s 2.4s forwards}
@keyframes xout{to{opacity:0;transform:scale(.97)}}
.xadh{margin:0 0 16px;display:flex;align-items:center;gap:12px}.xadh .lg{font-size:28px}.xadh b{font-size:22px}.xadh span{color:#8E8E93}
.xadh img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 12%}
.xadt{background:#fff;border-radius:16px;border:1px solid #E8E8E8;overflow:hidden}
.xadr{margin:0;display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;align-items:center;padding:14px 20px;border-top:1px solid #F0F0F0;animation:xin .45s both;animation-delay:calc(.2s + var(--i)*.2s)}
.xadr.hd{border-top:0;color:#8E8E93;font-size:15px;animation:none}
.xadr.sel{animation:xin .45s .2s both,xsel .3s 1.7s forwards}
@keyframes xsel{to{background:#EEF4FF;box-shadow:inset 3px 0 0 #0064E0}}
.xadi{display:flex;align-items:center;gap:14px;font-weight:600}.xadi img,.xadi .xtxt{width:60px;height:60px;border-radius:10px;object-fit:cover;flex:none}
.xtxt.sm{font-size:11px;font-style:normal}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#C9C9C9;margin-right:8px}.dot.on{background:#22AA7C}
.xadd{position:absolute;inset:0;padding:24px 30px;display:flex;flex-direction:column;gap:16px;animation:xin .6s cubic-bezier(.16,1,.3,1) 2.6s both}
.xkpi{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.xkpi div{background:#fff;border-radius:16px;padding:16px 20px;border:1px solid #E8E8E8;animation:xin .4s both;animation-delay:calc(2.9s + var(--i)*.2s)}
.xkpi span{display:block;color:#8E8E93;font-size:15px}.xkpi b{font-size:36px;letter-spacing:-.02em}
.xkpi .cnt{animation-delay:3.1s}
.xch{flex:1;width:100%;background:#fff;border-radius:16px;border:1px solid #E8E8E8}
.xch path{fill:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:xdraw 2s cubic-bezier(.65,0,.35,1) 3.2s forwards}
.xch .xl1{stroke:#B8BDC7}.xch .xl2{stroke:#22AA7C;stroke-width:5;animation-delay:3.5s}
@keyframes xdraw{to{stroke-dashoffset:0}}
.xleg{margin:0;display:flex;gap:24px;color:#5B5E66;font-size:15px}.xleg i{display:inline-block;width:14px;height:4px;border-radius:2px;margin-right:8px;vertical-align:middle}.xleg .g{background:#B8BDC7}.xleg .v{background:#22AA7C}
.kads{animation:kads 1.6s ease-in-out .4s both}
@keyframes kads{0%{opacity:0;transform:translate(800px,420px)}40%{opacity:1}75%{transform:translate(260px,190px)}85%{transform:translate(260px,190px) scale(.8)}100%{opacity:0;transform:translate(260px,190px)}}
html.shot .xadl{display:none}html.shot .xch path{stroke-dashoffset:0}
/* Amandine */
.xgg{height:100%;background:#fff;padding:26px 46px;display:flex;flex-direction:column;gap:16px;font-family:Arial,sans-serif}
.xggl{margin:0;font:500 44px/1 "Product Sans",Arial,sans-serif;letter-spacing:-1px}
.xggs{margin:0;display:flex;align-items:center;justify-content:space-between;width:640px;border:1px solid #DFE1E5;border-radius:999px;padding:12px 22px;font-size:19px;box-shadow:0 1px 6px rgba(32,33,36,.18)}.xggs>span:last-child{color:#4285F4;font-size:22px}
.xggr{position:relative;height:430px;overflow:hidden}
.xgi{position:absolute;left:0;right:0;height:86px;top:calc(var(--i)*86px);display:flex;flex-direction:column;gap:2px;max-width:720px}
.xgi small{color:#202124;font-size:14px}.xgi b{color:#1A0DAB;font-size:21px;font-weight:400}.xgi span{color:#4D5156;font-size:15px}
.xgi.oth{animation:xin .4s both,xdown .9s cubic-bezier(.65,0,.35,1) 2.6s forwards;animation-delay:calc(1.3s + var(--i)*.12s),2.6s}
@keyframes xdown{to{transform:translateY(86px)}}
.xgi.us{top:430px;padding:8px 14px;margin:-8px -14px;border-radius:14px;max-width:760px;animation:xclimb 1.2s cubic-bezier(.65,0,.35,1) 2.5s forwards}
@keyframes xclimb{to{top:0;background:#E3F6EC}}
.xup{position:absolute;right:14px;top:12px;font-style:normal;font-weight:700;color:#13703A;font-size:15px;animation:xin .4s 3.7s both}
.xggn{margin:auto 0 0;display:flex;align-items:center;gap:10px;color:#8E8E93;font:400 15px var(--fm)}.xggn img{width:32px;height:32px;border-radius:50%;object-fit:cover;object-position:50% 12%}
html.shot .xgi.us{top:0}html.shot .xgi.oth{transform:translateY(86px)}
.xart2{height:100%;display:grid;grid-template-columns:1fr 330px;gap:20px;padding:28px 34px;background:#F7F6F3}
.xae{background:#fff;border-radius:18px;padding:26px 30px;display:flex;flex-direction:column;gap:14px}
.xae h4{margin:0;font-size:32px;letter-spacing:-.02em;line-height:1.15}
.xap{margin:0;font-size:20px;line-height:1.5;color:#3A3D44;animation:xin .5s var(--d) both}
.xas{background:#fff;border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px;font-size:17px}
.xas>div span{display:block;color:#8E8E93;font-size:15px}.xas>div b{font-size:44px;color:#13703A}.xas .cnt{animation-delay:1.8s}
.xas p{margin:0;color:#13703A;animation:xin .4s var(--d) both}
.xpub{margin-top:auto;background:#020308;color:#fff;border-radius:12px;padding:12px;text-align:center;font-weight:600;animation:xin .5s 3.8s both}
/* Samy : pas encore disponible */
.ac .soon,.sch .soon{font-style:normal;font-size:13px;font-weight:600;color:#9A6B00;background:#FFF4D6;border-radius:999px;padding:3px 10px;margin-left:8px;vertical-align:middle}

i.cnt{font-style:normal}.xgi{height:104px;top:calc(var(--i)*104px);gap:4px}.xgi small{font-size:16px}.xgi b{font-size:25px}.xgi span{font-size:17px}.xggr{height:520px}.xgi.us{top:520px}@keyframes xdown{to{transform:translateY(104px)}}html.shot .xgi.oth{transform:translateY(104px)}.xggl{font-size:52px}.xggs{font-size:22px;width:720px}
.xae h4{font-size:38px}.xap{font-size:24px}.xae{gap:20px;padding:34px 38px}.xas{font-size:19px}

section[data-id="lampe"] .zpill{font-size:30px;padding:18px 34px}

/* ===== v8 ===== */
.prl small{font-weight:400;color:var(--mut)}
.prp{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 18px}
.prp input:not([type=file]){padding:13px 16px;border-radius:14px;border:1px solid var(--line);font:400 17px var(--fs,inherit);background:#fff}
.prph1{grid-column:1/-1;display:flex;align-items:center;gap:14px;padding:12px 16px;border:1.5px dashed rgba(2,3,8,.2);border-radius:14px;cursor:pointer;color:var(--mut);font-size:15px;background:#FAFAF8}
.prph1:focus{outline:2px solid #22AA7C}
.prph1 img{width:54px;height:54px;border-radius:50%;object-fit:cover;filter:grayscale(1) contrast(1.1)}
img.prph{width:100%;height:100%;border-radius:50%;object-fit:cover;filter:grayscale(1) contrast(1.12) brightness(1.03)}
.cov .ini:has(img){padding:0;overflow:hidden;background:#000}
.boss:has(img){padding:0;overflow:hidden}
#tmod{position:fixed;inset:0;z-index:999;background:rgba(2,3,8,.6);backdrop-filter:blur(6px);display:none;place-items:center}
#tmod.on{display:grid}
.tmb{position:relative;width:min(1100px,90vw);display:grid;grid-template-columns:1fr 340px;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.6);animation:xin .35s cubic-bezier(.16,1,.3,1) both}
.tmv{aspect-ratio:9/16;max-height:80vh;background:#000;justify-self:center;width:100%}.tmv iframe{width:100%;height:100%;border:0}
.tmb{grid-template-columns:auto 340px}.tmv{width:min(45vh,420px)}
.tmt{padding:28px;display:flex;flex-direction:column;gap:6px;font-size:16px}.tmt b{font-size:24px}.tmt span{color:var(--mut)}.tmt p{margin:14px 0 0;font-size:20px;line-height:1.45;font-weight:500}
.tmx{position:absolute;right:14px;top:10px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:#F1F1F1;font-size:24px;cursor:pointer}
.mq .c[data-temo]{cursor:pointer}.mq .c.v[data-temo]:hover img{transform:scale(1.04);transition:.4s}
.mq .q .tq{font-size:25px;line-height:1.4;font-weight:500;letter-spacing:-.015em}
.mq .q .wh2 img{object-fit:cover}
.pq{position:absolute;right:128px;bottom:130px;z-index:6;display:flex;gap:18px;align-items:center;max-width:620px;text-align:left;padding:16px 26px 16px 16px;border-radius:24px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.1);backdrop-filter:blur(10px);color:#fff;font:400 17px var(--fs,inherit);cursor:pointer}
.pq img{width:86px;height:86px;border-radius:18px;object-fit:cover;flex:none}
.pq q{display:block;font-size:23px;line-height:1.35;font-weight:500;margin-bottom:8px;quotes:"« " " »"}
.pq em{font-style:normal;color:#8FF0BF;margin-left:6px}
.tmb{width:min(1280px,92vw);grid-template-columns:1fr 330px}.tmv{aspect-ratio:16/9;width:100%;max-height:none;align-self:center}

section[data-id="temoignages"] .mq-t{animation-duration:220s}

section[data-id="temoignages"]:not(.cur) .mq-t{animation-play-state:paused}
.prph1 .prpo{width:72px;height:72px;filter:none}.prph1 .sp{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid #ccc;border-top-color:#22AA7C;animation:spin .8s linear infinite;vertical-align:-2px}.prk1{grid-column:1/-1}

.mo3 .ig img{aspect-ratio:auto}

/* v9 */
#prep{color-scheme:light}.prp input:not([type=file]){color:#020308!important;background:#fff!important;-webkit-text-fill-color:#020308}
.prp input::placeholder{color:#8E8E93;-webkit-text-fill-color:#8E8E93}
.mq.mqm{cursor:grab;touch-action:pan-y}.mq.mqm:active{cursor:grabbing}
.mqa{position:absolute;top:50%;translate:0 -50%;z-index:5;width:64px;height:64px;border-radius:50%;border:0;background:#fff;box-shadow:0 14px 30px -12px rgba(0,0,0,.45);font-size:34px;line-height:1;cursor:pointer;color:#020308}
.mqa.l{left:40px}.mqa.r{right:40px}
.boss.hasp{cursor:zoom-in;box-shadow:0 0 0 4px #22AA7C}
.tmb.tpo{grid-template-columns:auto 330px}.tmb.tpo>img{width:min(60vh,560px);aspect-ratio:1;object-fit:cover;display:block}
.mq img{-webkit-user-drag:none;user-select:none;pointer-events:none}

/* bandeau de logos sur la couverture */
.lgw{position:absolute;left:128px;right:128px;bottom:168px;display:flex;align-items:center;gap:26px;z-index:3}
.lgw>p{margin:0;flex:none;font:500 15px var(--fm);letter-spacing:.06em;text-transform:uppercase;color:var(--mut2,#8E8E93)}
.lgm{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.lgt{display:flex;gap:14px;width:max-content;animation:mq 60s linear infinite}
.lgp{flex:none;width:150px;height:64px;border-radius:16px;background:#fff;border:1px solid rgba(2,3,8,.08);display:grid;place-items:center;overflow:hidden;box-shadow:0 10px 22px -18px rgba(0,0,0,.4)}
.lgp img{max-width:120px;max-height:44px;object-fit:contain;filter:grayscale(1) contrast(1.05);opacity:.85}
.lgp img{filter:none;opacity:1;max-width:136px;max-height:54px;border-radius:6px}

.prgen{grid-column:1/-1;padding:14px;border-radius:14px;border:0;background:#020308;color:#fff;font:600 17px var(--fs,inherit);cursor:pointer}.prgen:hover{background:#22AA7C}

.prp .prn1{grid-column:1/-1}

/* le portrait agrandi : Charlotte en Sherlock, en bas à droite */
.tmt.tsh{position:relative;justify-content:flex-end;align-items:flex-end;padding:0;background:linear-gradient(180deg,#fff,#F6F3EE);min-height:min(60vh,560px)}
.shc{width:300px;max-width:100%;display:block;margin-right:-10px;animation:xin .6s cubic-bezier(.2,1.2,.4,1) .3s both}
.shb{position:absolute;left:22px;right:22px;top:26px;margin:0;padding:16px 18px;border-radius:20px;background:#020308;color:#fff;font:400 18px/1.4 var(--fs,inherit);box-shadow:0 18px 36px -18px rgba(0,0,0,.5);animation:xin .5s 1s both}
.shb b{font-weight:600;color:#8FF0BF}
.shb::after{content:"";position:absolute;right:120px;bottom:-12px;border:12px solid transparent;border-top-color:#020308;border-bottom:0}
.tmb.tpo{grid-template-columns:auto 400px}.shc{width:360px}.shb{font-family:Inter,system-ui,sans-serif;font-size:20px}.tmb.tpo>img{object-fit:cover;background:#000}

.shb{z-index:3}.shc{position:relative;z-index:1;width:auto!important;max-width:100%;max-height:calc(100% - 200px);object-fit:contain}.tmt.tsh{height:min(60vh,560px)}
.prraz{align-self:flex-start;margin-top:4px;padding:6px 12px;border:1px solid #ddd;border-radius:999px;background:#fff;color:#555;font:500 13px/1 Inter,system-ui,sans-serif;cursor:pointer}.prraz:hover{color:#c0392b;border-color:#c0392b}
.prraz{justify-self:start;width:fit-content}
#tmod .tmt{font-family:Inter,system-ui,sans-serif}#tmod .tmt span{font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal}