/* Moneth's : animations des outils */
.mo-anim .mo-hide{opacity:0;transform:translateY(28px)}
.mo-anim .mo-in{animation:moUp .9s var(--ease) both}
.mo-anim .mo-chap-t.mo-in{animation-name:moLeft}.mo-anim .mo-chap.rev .mo-chap-t.mo-in{animation-name:moRight}
.mo-anim .mo-chap-v.mo-in{animation:moScale 1s var(--ease) .12s both}
@keyframes moUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes moLeft{from{opacity:0;transform:translateX(-36px)}to{opacity:1;transform:none}}
@keyframes moRight{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:none}}
@keyframes moScale{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
/* titres qui se lèvent mot à mot */
.mo-words .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em}
.mo-words .w>span{display:inline-block;animation:moWord 1s var(--ease) both;animation-delay:calc(var(--i) * 70ms + 150ms)}
@keyframes moWord{from{transform:translateY(105%)}to{transform:none}}
.mo-fade{animation:moUp 1s var(--ease) both;animation-delay:var(--d,.5s)}
/* en-tête d'outil sur deux colonnes */
.mo-hero2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center;max-width:1120px;margin:0 auto;padding:64px 6vw 40px}
.mo-hero2 .mo-h1{text-align:left}.mo-hero2 .mo-h1::after{margin:18px 0 0}
.mo-hero2 .mo-lead{text-align:left;margin:20px 0 0;max-width:none}
.mo-hero2 .mo-actions{justify-content:flex-start}
@media (max-width:900px){.mo-hero2{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:44px}}
/* cadre des animations */
.mo-vis{position:relative;background:#fff;border:1px solid var(--line2);border-radius:14px;box-shadow:0 18px 50px rgba(0,21,49,.12);padding:26px 26px 22px;overflow:hidden}
.mo-vis::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--filet)}
.mo-vis .vk{font-family:var(--serif);font-style:italic;font-weight:700;font-size:17px}
.mo-vis .vb{font-family:var(--serif);font-weight:700;font-size:clamp(40px,5vw,54px);line-height:1.05;margin-top:6px;font-variant-numeric:lining-nums tabular-nums}
.mo-vis .vs{font-size:16px;color:var(--ink2)}
.mo-vis .vs b{color:var(--navy)}
.vsvg{display:block;width:100%;height:auto;margin-top:14px}
.vax{stroke:rgba(0,21,49,.25)}
.vline{fill:none;stroke:var(--navy);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}
.varea{fill:rgba(0,21,49,.07);opacity:0}
.vdot{fill:var(--green);opacity:0;transform-origin:center;transform-box:fill-box;transform:scale(0)}
.mo-vis.play .vline{animation:moDraw 2.4s cubic-bezier(.45,.05,.2,1) forwards}
.mo-vis.play .varea{animation:moFadeIn 1.2s ease 1.4s forwards}
.mo-vis.play .vdot{animation:moPop .6s var(--ease) 2.3s forwards}
@keyframes moDraw{to{stroke-dashoffset:0}}
@keyframes moFadeIn{to{opacity:1}}
@keyframes moPop{to{opacity:1;transform:scale(1)}}
.vbar{height:14px;background:rgba(0,21,49,.08);margin-top:14px;overflow:hidden}
.vbar i{display:block;height:100%;width:100%;background:var(--navy);transition:width 2.4s cubic-bezier(.45,.05,.2,1)}
.vbar.g i{background:rgba(0,21,49,.35)}
.vleg{display:flex;justify-content:space-between;gap:10px;font-size:16px;color:var(--ink2);margin-top:8px}
.vleg b{color:var(--navy);font-variant-numeric:tabular-nums}
.vrow{margin-top:16px}.vrow .vbar{margin-top:6px}
.vdonut{display:flex;align-items:center;gap:20px;margin-top:10px}
.vdonut svg{width:150px;height:150px;flex:0 0 auto}
.vdonut circle{transition:stroke-dasharray 1.2s var(--ease)}
.vdonut .vb{font-size:40px}
.vleg3{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font-size:16px;color:var(--ink2)}
.vleg3 i{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px}
.vtab{font-size:16px}
.vth,.vtr{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:11px 0;border-top:1px solid var(--line)}
.vth{border-top:0;font-family:var(--serif);font-size:20px}
.vth b:last-child,.vtr em:last-child{color:var(--green)}
.vtr span{color:var(--ink2)}.vtr em{font-style:normal;font-weight:600}
.vtr{opacity:0;transform:translateX(-14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.mo-vis.play .vtr{opacity:1;transform:none}
.vcols{display:flex;align-items:flex-end;justify-content:center;gap:22px;margin-top:16px;text-align:center}
.vcols p{font-size:16px;color:var(--ink2);margin-top:8px}.vcols b{font-variant-numeric:tabular-nums}
.vcol{width:86px;height:170px;background:rgba(0,21,49,.05);display:flex;align-items:flex-end;margin:0 auto}
.vcol i{display:block;width:100%;background:var(--navy);transition:height .9s var(--ease)}
.vcol.g i{background:rgba(0,21,49,.3)}
.varrow{font-size:30px;color:rgba(0,21,49,.2);padding-bottom:70px;transition:color .4s,transform .6s var(--ease)}
.varrow.on{color:var(--green);transform:scale(1.25)}
.mo-vis [data-t]{min-height:2.6em;transition:opacity .3s}
/* jauge */
.mo-gsvg{display:block;width:100%;height:auto}
.mo-gt{stroke:rgba(0,21,49,.25);stroke-width:1.5}
.mo-gn{stroke:var(--navy);stroke-width:4;stroke-linecap:round}
.mo-gc{fill:var(--navy)}
.mo-needle{transform-origin:160px 160px}
.mo-gl{font:600 13px var(--sans);fill:var(--ink2)}
/* vitrine des outils */
.mo-show-hero{max-width:980px;margin:0 auto;padding:84px 6vw 40px;text-align:center}
.mo-show-hero .mo-h1{font-size:clamp(40px,6.4vw,76px);line-height:1.02}
.mo-show-hero .mo-lead{max-width:640px}
.mo-show-stats{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 34px;margin-top:28px}
.mo-show-stats div{text-align:center}.mo-show-stats b{display:block;font-family:var(--serif);font-weight:700;font-size:40px;line-height:1}
.mo-show-stats span{font-size:16px;color:var(--ink2)}
.mo-scroll{display:inline-flex;flex-direction:column;align-items:center;gap:8px;margin-top:40px;font-size:16px;color:var(--ink2);text-decoration:none}
.mo-scroll i{display:block;width:1.5px;height:44px;background:linear-gradient(var(--navy),transparent);animation:moCue 2.2s ease-in-out infinite;transform-origin:top}
@keyframes moCue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.mo-show{display:grid;grid-template-columns:200px minmax(0,1fr);gap:48px;max-width:1240px;margin:0 auto;padding:0 6vw 40px}
.mo-idx{position:sticky;top:110px;align-self:start;list-style:none;padding-top:80px}
.mo-idx a{display:grid;grid-template-columns:36px 1fr;padding:9px 0;font-size:16px;color:rgba(0,21,49,.45);text-decoration:none;border-left:2px solid transparent;padding-left:12px;transition:color .3s,border-color .3s}
.mo-idx a b{font-family:var(--serif);font-weight:700}
.mo-idx a.on{color:var(--navy);border-left-color:var(--navy)}
@media (max-width:1100px){.mo-show{grid-template-columns:minmax(0,1fr)}.mo-idx{display:none}}
.mo-chap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;min-height:82vh;padding:72px 0;border-top:1px solid var(--line);scroll-margin-top:64px}
.mo-chap.rev .mo-chap-t{order:2}
@media (max-width:900px){.mo-chap{grid-template-columns:minmax(0,1fr);gap:30px;min-height:0;padding:56px 0}.mo-chap.rev .mo-chap-t{order:0}}
.mo-chap .num{font-family:var(--serif);font-weight:700;font-size:clamp(64px,8vw,104px);line-height:.85;color:rgba(0,21,49,.1)}
.mo-chap h2{font-family:var(--serif);font-weight:700;font-size:clamp(32px,4vw,46px);line-height:1.08;margin-top:6px}
.mo-chap h2::after{content:"";display:block;width:54px;height:3px;margin-top:16px;background:var(--filet)}
.mo-chap .q{font-family:var(--serif);font-style:italic;font-weight:700;font-size:24px;line-height:1.3;margin-top:20px}
.mo-chap p.d{font-size:18px;color:var(--ink2);margin-top:12px}
.mo-chap ul{list-style:none;margin-top:16px}
.mo-chap li{position:relative;padding:8px 0 8px 22px;border-top:1px solid var(--line);font-size:17px;color:var(--ink2)}
.mo-chap li::before{content:"";position:absolute;left:0;top:1.15em;width:10px;height:1.5px;background:var(--navy)}
.mo-chap .go{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:24px}
.mo-chap .go span{font-size:16px;color:var(--ink2)}
.mo-btn .arw{display:inline-block;transition:transform .3s var(--ease)}
.mo-btn:hover .arw{transform:translateX(4px)}
/* courbes : tracé à l'apparition */
.mo-chart svg.pre .c1,.mo-chart svg.pre .c2,.mo-chart svg.pre .c3{stroke-dasharray:1;stroke-dashoffset:1}
.mo-chart svg.pre .a1{opacity:0}
.mo-chart svg.go .c1,.mo-chart svg.go .c2,.mo-chart svg.go .c3{animation:moDraw 1.6s cubic-bezier(.45,.05,.2,1) forwards}
.mo-chart svg.go .c3{stroke-dasharray:1}
.mo-chart svg.go .a1{animation:moFadeIn .8s ease .9s forwards}
.mo-big{transition:color .3s}
@media (prefers-reduced-motion:reduce){.mo-words .w>span,.mo-fade,.mo-anim .mo-in,.mo-scroll i{animation:none!important}.vline{stroke-dasharray:none;stroke-dashoffset:0}.varea,.vdot{opacity:1;transform:none}.vtr{opacity:1;transform:none}}
/* météo des marchés */
.mt-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}
@media (max-width:900px){.mt-top{grid-template-columns:minmax(0,1fr)}}
.mt-gauge{position:relative;background:var(--navy);border-radius:14px;padding:26px 26px 22px;text-align:center;box-shadow:0 18px 50px rgba(0,21,49,.22)}
.mt-gauge .mo-gt{stroke:rgba(239,227,219,.35)}
.mt-gauge .mo-gn{stroke:#D89B7F}.mt-gauge .mo-gc{fill:#D89B7F}
.mt-gauge .mo-gl{fill:rgba(239,227,219,.6)}
.mt-score{font-family:var(--serif);font-weight:700;font-size:clamp(56px,7vw,76px);line-height:1;color:#D89B7F;margin-top:2px;position:relative;font-variant-numeric:tabular-nums}
.mt-niv{font-family:var(--serif);font-style:italic;font-weight:700;font-size:26px;color:#D89B7F;margin-top:8px}
.mt-maj{font-size:16px;color:#EFE3DB;margin-top:10px}
.mt-live{display:inline-block;width:9px;height:9px;border-radius:50%;background:rgba(0,21,49,.25);margin-right:8px;vertical-align:1px}
.mt-live.on{background:#1A4D2E;box-shadow:0 0 0 0 rgba(26,77,46,.5);animation:moPulse 1.8s infinite}
@keyframes moPulse{0%{box-shadow:0 0 0 0 rgba(26,77,46,.45)}70%{box-shadow:0 0 0 10px rgba(26,77,46,0)}100%{box-shadow:0 0 0 0 rgba(26,77,46,0)}}
.mt-read{position:static!important}
.mt-txt{font-size:18px;color:var(--ink2);margin:8px 0 18px;min-height:3.2em}
.mt-ruler{position:relative;display:grid;grid-template-columns:16fr 20fr 25fr 20fr 19fr;height:12px;margin:26px 0 8px}
.mt-ruler>i{display:block}
.mt-mk{position:absolute;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:#fff;border:3px solid var(--navy);left:0;transition:left 1.8s cubic-bezier(.2,.8,.2,1)}
.mt-mk.big{width:24px;height:24px;margin:-12px 0 0 -12px;box-shadow:0 4px 12px rgba(0,21,49,.25);z-index:2}
.mt-mk.ghost{border-color:rgba(0,21,49,.35);background:rgba(255,255,255,.7)}
.mt-sl{display:flex;justify-content:space-between;gap:6px;font-size:14px;color:var(--ink2)}
.mt-comp{display:flex;height:16px;background:rgba(0,21,49,.06);margin-top:10px;overflow:hidden}
.mt-comp i{display:block;height:100%;width:0;transition:width 1.6s var(--ease)}
#c-vxx,.c-vxx{background:#001531}#c-dd,.c-dd{background:#2C5F86}#c-cred,.c-cred{background:#7FA3C4}#c-rsi,.c-rsi{background:#D89B7F}
.mt-cl{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:16px;color:var(--ink2)}
.mt-cl i{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px}
.mt-cl b{color:var(--navy);font-weight:600}
.mt-ind{background:#fff;border:1px solid var(--line2);border-top:3px solid var(--navy);padding:22px 20px}
.mt-ind h3{font-family:var(--serif);font-weight:700;font-size:24px;line-height:1.2;margin:4px 0}
.mt-ind .mo-rv b{font-size:32px;font-variant-numeric:tabular-nums}
.mt-scale{position:relative;height:10px;margin:16px 0 6px;background:linear-gradient(90deg,#4C8A63,#7FA3C4 30%,#C9B98F 55%,#D89B7F 75%,#C0573A)}
.mt-scale .mt-mk{width:20px;height:20px;margin:-10px 0 0 -10px}
.mt-pts{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:14px;font-size:16px;color:var(--ink2)}
.mt-pb{height:6px;background:rgba(0,21,49,.08)}.mt-pb i{display:block;height:100%;width:0;background:var(--navy);transition:width 1.4s var(--ease)}
.mt-pts b{color:var(--navy);font-weight:600}
.mt-desc{font-size:16px;color:var(--ink2);margin-top:10px}
.mt-zones{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:28px}
.mt-zones .mo-tile{border-radius:0;border-top-width:4px}.mt-zones h3{font-size:22px}
@media (max-width:900px){.mt-zones{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:520px){.mt-zones{grid-template-columns:minmax(0,1fr)}}
