/* AxoHost - site vitrine. Styles repris tels quels de la maquette validee (Main.dc.html), puis ajouts de production en fin de fichier. */

:root{--ac:#3A33FF}
@property --s{syntax:'<integer>';initial-value:60;inherits:false}
body{margin:0;background:#050507}
*{box-sizing:border-box}
a{color:inherit;text-decoration:none}a:hover{color:inherit}
button{font:inherit;cursor:pointer;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #fff;outline-offset:3px}
.dp{font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:800;text-transform:uppercase;line-height:.88;letter-spacing:-0.01em}
.mono{font-family:'Geist Mono',monospace}
.mu{color:rgba(255,255,255,.7)}
.ey{font-family:'Geist Mono',monospace;font-size:13px;letter-spacing:.08em;color:rgba(255,255,255,.7);text-transform:uppercase}
.wrap{max-width:1280px;margin:0 auto;padding-left:24px;padding-right:24px}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;border:1.5px solid #fff;font-weight:600;font-size:15px;transition:transform .25s cubic-bezier(.2,.8,.2,1),background .25s,color .25s}
.btn:active{transform:scale(.96)}
.bw{background:#fff;color:#050507}.bw:hover{color:#050507;transform:translateY(-2px)}
.bo{background:transparent;color:#fff}.bo:hover{background:#fff;color:#050507}
.bk{background:#050507;color:#fff;border-color:#050507}.bk:hover{color:#fff;transform:translateY(-2px)}
.nl{background:transparent;border:0;font-size:14px;font-weight:500;color:rgba(255,255,255,.7);padding:12px 2px;text-align:left;transition:color .2s}.nl:hover{color:#fff}
.nl.on{color:#fff}
.seg{display:inline-flex;padding:4px;border:1.5px solid rgba(255,255,255,.22);border-radius:999px;gap:4px;flex-wrap:wrap}
.seg button{min-height:40px;padding:0 18px;border-radius:999px;border:0;background:transparent;color:rgba(255,255,255,.7);font-weight:600;font-size:14px;transition:background .25s,color .25s}
.seg button.on{background:#fff;color:#050507}
.pl{border:1.5px solid rgba(255,255,255,.16);border-radius:28px;background:#0C0C11;color:#fff;transition:border-color .3s}
.pl:hover{border-color:#fff}
.pl.pop{background:#fff;color:#050507;border-color:#fff}
.pl .cta{border:1.5px solid currentColor;background:transparent;color:inherit}
.pl .cta:hover{background:#fff;color:#050507}
.pl.pop .cta{background:#050507;color:#fff;border-color:#050507}
.box{border:1.5px solid rgba(255,255,255,.16);border-radius:28px;background:#0C0C11}
.tile{display:flex;flex-direction:column;gap:6px;text-align:left;min-height:64px;padding:16px;border-radius:18px;border:1.5px solid rgba(255,255,255,.16);background:#0C0C11;color:#fff;transition:border-color .25s,background .25s,color .25s,transform .25s cubic-bezier(.2,.8,.2,1)}
.tile:hover{border-color:#fff;transform:translateY(-2px)}
.tile.on{background:#fff;color:#050507;border-color:#fff}
.tile .mu{color:inherit;opacity:.7}
.gt{display:flex;align-items:baseline;justify-content:space-between;gap:16px;width:100%;min-height:76px;padding:0;border:0;border-top:1.5px solid rgba(255,255,255,.16);background:transparent;color:rgba(255,255,255,.4);text-align:left;font-size:54px;transition:color .3s,padding .4s cubic-bezier(.2,.8,.2,1)}
.gt:hover{color:#fff}
.gt.on{color:#fff;padding-left:22px}
.tier{border-top:1.5px solid rgba(255,255,255,.2);padding:20px 0 0;opacity:.38;transition:opacity .4s,transform .4s cubic-bezier(.2,.8,.2,1)}
.tier.on{opacity:1;border-top-color:#fff;transform:translateY(-10px)}
.fq{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;min-height:72px;padding:0;border:0;background:transparent;color:#fff;font-size:19px;font-weight:500;text-align:left}
.fq .ic{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.fq.on .ic{transform:rotate(45deg)}
.sw{width:52px;height:30px;border-radius:999px;border:0;padding:3px;background:rgba(255,255,255,.2);transition:background .3s;display:flex;flex:none}
.sw span{width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.sw.on{background:var(--ac)}.sw.on span{transform:translateX(22px)}
.rg{position:relative;height:44px;display:flex;align-items:center}
.rg .tr{position:absolute;left:4px;right:4px;height:10px;background:rgba(255,255,255,.16);transform:skewX(-17deg);overflow:hidden}
.rg .fl{height:100%;background:#fff}
.rg input{position:relative;width:100%;height:44px;margin:0;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}
.rg input::-webkit-slider-runnable-track{height:44px;background:transparent}
.rg input::-moz-range-track{height:44px;background:transparent}
.rg input::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:32px;margin-top:6px;background:#fff;border:3px solid #050507;border-radius:5px;transform:skewX(-17deg);box-shadow:0 0 0 1.5px #fff}
.rg input::-moz-range-thumb{width:16px;height:26px;background:#fff;border:3px solid #050507;border-radius:5px;transform:skewX(-17deg);box-shadow:0 0 0 1.5px #fff}
.mi{display:block;width:100%;padding:12px 10px;border:0;border-radius:14px;background:transparent;text-align:left;transition:background .2s}
.mi:hover{background:rgba(255,255,255,.07)}
.gI{--g:#DEC431}.gC{--g:#12B854}
.sg{position:relative;display:inline-block;flex:none;font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:800;font-size:56px;line-height:.86;text-transform:uppercase;letter-spacing:-.005em;white-space:nowrap;color:var(--g,#fff);transform:skewX(-17deg);transform-origin:0 100%}
.sg>span{display:block}.sg>span+span{display:none}
.sg.gI,.gI>.sg,.gI>span>.sg{margin-top:.3em}
.sg.gI::before,.gI>.sg::before,.gI>span>.sg::before{content:"";position:absolute;left:-.05em;top:-.2em;width:.31em;height:.21em;background:currentColor;clip-path:polygon(0 100%,0 12%,27% 56%,50% 0,73% 56%,100% 12%,100% 100%)}
.sg.sm{font-size:1.55em;margin:0 .1em 0 .05em;vertical-align:-.06em;line-height:.8}
.dk{opacity:0;animation:dk3 3s cubic-bezier(.3,.1,.6,1) infinite}
.dk.ok{fill:#fff;animation-name:dkOk}.dk.b3,.dk.b4,.dk.b5,.dk.b7{fill:#F87171}.dk.b4{animation-name:dk4}.dk.b5{animation-name:dk5}.dk.b7{animation-name:dk7}
@keyframes dk3{0%{transform:translateX(112px);opacity:0}15%{opacity:1}55%{transform:translateX(90px);opacity:1}75%,100%{transform:translateX(94px);opacity:0}}
@keyframes dk4{0%{transform:translateX(112px);opacity:0}15%{opacity:1}60%{transform:translateX(70px);opacity:1}80%,100%{transform:translateX(74px);opacity:0}}
@keyframes dk5{0%{transform:translateX(112px);opacity:0}15%{opacity:1}65%{transform:translateX(50px);opacity:1}85%,100%{transform:translateX(54px);opacity:0}}
@keyframes dk7{0%{transform:translateX(112px);opacity:0}15%{opacity:1}70%{transform:translateX(32px);opacity:1}88%,100%{transform:translateX(36px);opacity:0}}
@keyframes dkOk{0%{transform:translateX(112px);opacity:0}15%{opacity:1}80%{transform:translateX(18px);opacity:1}90%,100%{transform:translateX(14px);opacity:0}}
.dkl{font-family:"Geist Mono",monospace;font-size:7px;fill:#fff;paint-order:stroke;stroke:#0C0C11;stroke-width:4px}
.ring{animation:ringIn 1.6s cubic-bezier(.2,.8,.2,1) .2s both}
@keyframes ringIn{from{stroke-dashoffset:540}}
.wpan.box{animation:none}
.proof{display:flex;flex-wrap:wrap;gap:8px}
.pf{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;font-size:14px;font-weight:500;transition:border-color .2s,background .2s}
.pf:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.pf b{font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:800;font-size:22px;text-transform:uppercase;line-height:1}
.wtabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.wt{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:112px;padding:16px 18px;border-radius:20px;border:1.5px solid rgba(255,255,255,.14);background:#0C0C11;color:#fff;text-align:left;transition:background .25s,border-color .25s,color .25s,transform .25s cubic-bezier(.2,.8,.2,1)}
.wt:hover{border-color:rgba(255,255,255,.6);transform:translateY(-2px)}
.wt.on{background:#fff;color:#050507;border-color:#fff}
.wt.on .mu{color:#3A3A44}
.wpan{display:flex;flex-wrap:wrap;gap:36px 48px;align-items:center;padding:clamp(22px,3.4vw,44px);animation:fadeUp .45s cubic-bezier(.2,.8,.2,1) both}
.pwt{flex:1;min-width:0;height:16px;margin:0 6px;background:rgba(255,255,255,.1);transform:skewX(-17deg);overflow:hidden}
.pwt i{display:block;height:100%;border-radius:0 4px 4px 0;transform-origin:0 50%;animation:fillx .9s cubic-bezier(.2,.8,.2,1) both}
.upg{position:relative;width:100%;aspect-ratio:50/20;background-color:rgba(255,255,255,.85);background-image:repeating-linear-gradient(90deg,transparent 0 calc(2% - 2px),#0C0C11 calc(2% - 2px) 2%),repeating-linear-gradient(180deg,transparent 0 calc(5% - 2px),#0C0C11 calc(5% - 2px) 5%)}
.upg i{position:absolute;right:2px;bottom:2px;width:calc(2% - 2px);height:calc(5% - 2px);background:var(--ac);box-shadow:0 0 0 6px rgba(58,51,255,.35);animation:pulseA 1.8s ease-out infinite}
@keyframes pulseA{0%{box-shadow:0 0 0 0 rgba(58,51,255,.7)}100%{box-shadow:0 0 0 18px rgba(58,51,255,0)}}
.frp{animation:pulseW 2s ease-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes pulseW{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(2.6)}}
@media (max-width:900px){.wtabs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -24px;padding:0 24px 6px;scrollbar-width:none}.wtabs::-webkit-scrollbar{display:none}.wt{flex:0 0 62%;scroll-snap-align:start;min-height:96px}.pzg{grid-template-columns:1fr!important}.pwl{width:82px!important}.pwv{width:86px!important;font-size:12px!important}.pwn{display:none}}
.gseg button.on{background:rgba(255,255,255,.14);color:#fff}
.gseg button{display:inline-flex;align-items:center}
.gseg .sg{font-size:22px;margin-top:0;opacity:.55;transition:opacity .25s}
.gseg button.on .sg{opacity:1}
.gm{display:flex;flex-direction:column;gap:22px;text-align:left;padding:clamp(22px,2.6vw,34px);border-radius:28px;border:1.5px solid rgba(255,255,255,.16);background:#0C0C11;color:#fff;transition:border-color .3s,background .3s,transform .3s cubic-bezier(.2,.8,.2,1)}
.gm:hover{border-color:var(--g);transform:translateY(-3px)}
.gm.on{border-color:var(--g);background:color-mix(in srgb,var(--g) 10%,#0C0C11)}
.gm .st8{flex:none;display:inline-flex;align-items:center;min-height:32px;padding:0 14px;border:1.5px solid rgba(255,255,255,.3);font-size:13px;font-weight:600;transform:skewX(-17deg);transition:background .3s,color .3s,border-color .3s}
.gm .st8>span{display:block;transform:skewX(17deg)}
.gm.on .st8{background:var(--g);border-color:var(--g);color:#050507}
.gm .hw{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;padding:13px 0;border-top:1.5px solid rgba(255,255,255,.14)}
.gm .hw .k{font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.gm .hw .v{font-size:clamp(30px,3.1vw,46px);color:rgba(255,255,255,.62);transition:color .3s}
.gm.on .hw .v{color:#fff}
.swI .pl,.swC .pl{position:relative;overflow:hidden}
.swI .pl::before,.swC .pl::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--g);transform-origin:0 50%;pointer-events:none}
.swI .pl::before{animation:gLineA .9s cubic-bezier(.2,.8,.2,1) both}.swC .pl::before{animation:gLineB .9s cubic-bezier(.2,.8,.2,1) both}
.swI .pr{animation:gUpA .55s cubic-bezier(.2,.8,.2,1) both}.swC .pr{animation:gUpB .55s cubic-bezier(.2,.8,.2,1) both}
.swI .hwl{animation:gInA .5s ease-out .12s both}.swC .hwl{animation:gInB .5s ease-out .12s both}
.t2 .pr,.t2::before{animation-delay:.06s!important}.t3 .pr,.t3::before{animation-delay:.12s!important}.t4 .pr,.t4::before{animation-delay:.18s!important}
@keyframes gLineA{0%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes gLineB{0%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes gUpA{from{transform:translateY(22px);opacity:0}}@keyframes gUpB{from{transform:translateY(22px);opacity:0}}
@keyframes gInA{from{transform:translateX(-8px);opacity:0}to{opacity:.72}}@keyframes gInB{from{transform:translateX(-8px);opacity:0}to{opacity:.72}}
@media (prefers-reduced-motion:reduce){.swI .pl::before,.swC .pl::before{display:none}.swI .pr,.swC .pr,.swI .hwl,.swC .hwl{animation:none}}
.gm.cp{gap:14px;padding:20px 24px;border-radius:22px}
.gm.cp .hw{flex-direction:column;align-items:flex-start;gap:3px;padding:0;border:0}
.gm.cp .hw .k{font-size:11px}
.gm.cp .hw .v{font-size:25px}
.gm.cp .st8{min-height:28px;font-size:12px}
.gm.cp>span>.sg{margin-top:.3em}
.cnt{counter-reset:s var(--s)}
.cnt::after{content:counter(s,decimal-leading-zero)}
.bar{transform-origin:0 50%}
.mask{display:block;overflow:hidden;padding-top:.06em}
.mask>span{display:block;animation:lineUp .9s cubic-bezier(.2,.8,.2,1) both}
.m2>span{animation-delay:.1s}.m3>span{animation-delay:.2s}
@keyframes lineUp{from{transform:translateY(105%)}to{transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.fu{animation:fadeUp .7s cubic-bezier(.2,.8,.2,1) .35s both}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes blink{50%{opacity:0}}
@keyframes lgL{from{transform:translate(-34%,34%);opacity:0}to{transform:none;opacity:1}}
@keyframes lgR{from{transform:translate(22%,-46%);opacity:0}to{transform:none;opacity:1}}
.lgL{animation:lgL 1.1s cubic-bezier(.2,.8,.2,1) .15s both}
.lgR{animation:lgR 1.1s cubic-bezier(.2,.8,.2,1) .3s both}
@keyframes splitL{to{transform:translate(-46%,18%) rotate(-16deg);opacity:0}}
@keyframes splitR{to{transform:translate(46%,-18%) rotate(16deg);opacity:0}}
@keyframes joinL{from{transform:translate(-60%,40%) rotate(-18deg);opacity:0}to{transform:none;opacity:1}}
@keyframes joinR{from{transform:translate(60%,-40%) rotate(18deg);opacity:0}to{transform:none;opacity:1}}
.sk{transform:skewX(-17deg)}
@keyframes cue{0%{transform:scaleY(0);transform-origin:50% 0}50%{transform:scaleY(1);transform-origin:50% 0}51%{transform-origin:50% 100%}100%{transform:scaleY(0);transform-origin:50% 100%}}
@keyframes cnt{from{--s:0}to{--s:60}}
@keyframes bg{0%,66%{background-color:#050507}100%{background-color:var(--ac)}}
@keyframes fillx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes rise{from{opacity:0;transform:translateY(70px)}to{opacity:1;transform:none}}
@keyframes tilt{from{opacity:0;transform:perspective(1100px) rotateX(38deg) translateY(110px) scale(.9)}to{opacity:1;transform:none}}
@keyframes lit{from{opacity:.14}to{opacity:1}}
@keyframes heroOut{to{opacity:0;transform:scale(.84) translateY(-70px);filter:blur(10px)}}
@keyframes ml{from{transform:translateX(4%)}to{transform:translateX(-34%)}}
@keyframes mr{from{transform:translateX(-34%)}to{transform:translateX(4%)}}
@keyframes zoom{from{transform:scale(.55);opacity:.2}to{transform:none;opacity:1}}
@supports (animation-timeline:view()){
.cnt{animation:cnt linear both;animation-timeline:scroll(nearest)}
.bar{animation:fillx linear both;animation-timeline:scroll(nearest)}
.rise{animation:rise linear both;animation-timeline:view();animation-range:entry 0% cover 26%}
.tilt{animation:tilt linear both;animation-timeline:view();animation-range:entry 0% cover 26%}
.t2{animation-range:entry 12% cover 30%}.t3{animation-range:entry 24% cover 34%}.t4{animation-range:entry 36% cover 38%}
.lit{animation:lit linear both;animation-timeline:view();animation-range:cover 18% cover 42%}
.hout{animation:heroOut linear both;animation-timeline:view();animation-range:exit 5% exit 95%}
.ml{animation:ml linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.mr{animation:mr linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.zoom{animation:zoom linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
.sL{animation:splitL linear both;animation-timeline:view();animation-range:exit 0% exit 80%}
.sR{animation:splitR linear both;animation-timeline:view();animation-range:exit 0% exit 80%}
.jL{animation:joinL linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
.jR{animation:joinR linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
}
.ld{position:fixed;inset:0;z-index:200;background:#050507;display:flex;flex-direction:column;align-items:center;justify-content:center;animation:ldOut .3s cubic-bezier(.7,0,.3,1) .68s both}
.ld svg{width:92px;height:104px;overflow:visible}
.ld .a{animation:ldL .5s cubic-bezier(.2,.8,.2,1) both}
.ld .b{animation:ldR .5s cubic-bezier(.2,.8,.2,1) .08s both}
.ld .ln{width:120px;height:4px;margin-top:28px;background:rgba(255,255,255,.16);transform:skewX(-17deg);overflow:hidden}
.ld .ln i{display:block;height:100%;background:#fff;transform-origin:0 50%;animation:ldBar .66s cubic-bezier(.6,0,.2,1) both}
@keyframes ldL{from{transform:translate(-90px,60px);opacity:0}}
@keyframes ldR{from{transform:translate(90px,-60px);opacity:0}}
@keyframes ldBar{from{transform:scaleX(0)}}
@keyframes ldOut{from{clip-path:polygon(0 0,100% 0,100% 100%,0 130%)}to{clip-path:polygon(0 0,100% 0,100% -30%,0 0)}}
.pov{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-start;justify-content:center;padding:56px 16px 40px;overflow-y:auto;background:rgba(5,5,7,.84);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .2s both}
.pdl{position:relative;width:100%;max-width:820px;padding:clamp(20px,3vw,34px);display:flex;flex-direction:column;gap:22px;border-radius:28px;border:1.5px solid rgba(255,255,255,.2);background:#0C0C11;animation:popIn .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes fadeIn{from{opacity:0}}@keyframes popIn{from{opacity:0;transform:translateY(18px) scale(.98)}}
.sb{display:flex;gap:1px;height:36px}
.sb i{flex:1;min-width:0;background:#22C55E;opacity:.85}
.sb i.w{background:#FBBF24;opacity:1}.sb i.m{background:#8E8EFF;opacity:1}
.pulse{animation:pulse 1.8s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}100%{box-shadow:0 0 0 12px rgba(34,197,94,0)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.tpc{font-size:132px}.tpc span{font-size:56px}
.mo{display:none}
@media (max-width:900px){.hm{display:none!important}.gt{font-size:38px}}
@media (max-width:620px){
.seg{border-radius:22px}
section.wrap{padding-top:96px!important}
.mo{display:block}
.plans{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 24px;margin:0 -24px;padding:0 24px 12px;gap:12px!important;scrollbar-width:none}
.plans::-webkit-scrollbar{display:none}
.plans>.pl{flex:0 0 84%;scroll-snap-align:start}
.gt{font-size:30px;min-height:64px}
.stk{position:static!important;min-height:0!important;padding:26px!important;gap:24px!important}
.tier{flex:1 1 40%}
.tpc{font-size:84px}.tpc span{font-size:36px}
.pdl .seg button{padding:0 12px}
}

/* ---- Ajouts de production ---- */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{font-family:Geist,system-ui,sans-serif;color:#fff;line-height:1.5}
.site{background-color:#050507;color:#fff;font-family:Geist,system-ui,sans-serif;line-height:1.5;overflow-x:clip;min-height:900px}
main{display:block}
main:focus{outline:none}
img{max-width:100%}
.skip{position:fixed;left:16px;top:-80px;z-index:300;padding:12px 18px;border-radius:999px;background:#fff;color:#050507;font:600 14px Geist,system-ui,sans-serif;transition:top .2s}
.skip:focus,.skip:focus-visible{top:16px;color:#050507}
body.lock{overflow:hidden}
.ld.done{display:none}
.lt :focus-visible,.pl.pop :focus-visible{outline-color:#050507}
.lk:hover{text-decoration-thickness:2px}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Animations au scroll : repli IntersectionObserver pour les navigateurs sans animation-timeline (classe io posee par site.js) */
.io .rise,.io .tilt,.io .zoom,.io .lit{transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.io .rise:not(.in){opacity:0;transform:translateY(70px)}
.io .tilt:not(.in){opacity:0;transform:perspective(1100px) rotateX(20deg) translateY(80px) scale(.94)}
.io .zoom:not(.in){opacity:.2;transform:scale(.7)}
.io .lit:not(.in){opacity:.14}
.io .t2{transition-delay:.08s}.io .t3{transition-delay:.16s}.io .t4{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.io .rise,.io .tilt,.io .zoom,.io .lit{opacity:1!important;transform:none!important}}
/* Page d'etat : etats supplementaires */
.sb i.o{background:#EF4444;opacity:1}.sb i.n{background:rgba(255,255,255,.16);opacity:1}
.stb{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;padding:22px 26px;border-radius:24px;border:1.5px solid rgba(34,197,94,.5);background:rgba(34,197,94,.08)}
.stb .dot{width:14px;height:14px;border-radius:50%;background:#22C55E;flex:none}
.stb.w{border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.08)}.stb.w .dot{background:#FBBF24;animation:none}
.stb.m{border-color:rgba(142,142,255,.5);background:rgba(142,142,255,.08)}.stb.m .dot{background:#8E8EFF;animation:none}
.stb.o{border-color:rgba(239,68,68,.55);background:rgba(239,68,68,.08)}.stb.o .dot{background:#EF4444;animation:none}
.stb.n{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.04)}.stb.n .dot{background:rgba(255,255,255,.4);animation:none}
.stp{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 14px;border-radius:999px;background:rgba(34,197,94,.14);color:#4ADE80;font-size:14px;font-weight:600;white-space:nowrap}
.stp i{width:8px;height:8px;border-radius:50%;background:#22C55E}
.stp.w{background:rgba(251,191,36,.14);color:#FCD34D}.stp.w i{background:#FBBF24}
.stp.m{background:rgba(142,142,255,.16);color:#B4B4FF}.stp.m i{background:#8E8EFF}
.stp.o{background:rgba(239,68,68,.14);color:#FCA5A5}.stp.o i{background:#EF4444}
.stp.n{background:rgba(255,255,255,.08);color:rgba(255,255,255,.75)}.stp.n i{background:rgba(255,255,255,.4)}
@media (prefers-reduced-motion:reduce){.ld{display:none}}