:root{font-family:'Segoe UI',Arial,sans-serif;color:#eae6ee;background:#09060c;color-scheme:dark;--accent:#9249dc;--muted:#9e95a8;--line:#cfb8e720;--ease:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;min-width:320px}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}a{color:inherit;text-decoration:none}button{color:inherit}.ambient{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 80% 0%,#2f114d36,transparent 48%),radial-gradient(ellipse at 8% 80%,#280d4420,transparent 45%)}.page-progress{position:fixed;left:0;top:0;height:2px;background:var(--accent);width:100%;transform:scaleX(0);transform-origin:left;z-index:10;box-shadow:0 0 10px #9249dc80}.header{max-width:1640px;margin:auto;min-height:100px;padding:20px 4.5%;display:flex;align-items:center;gap:36px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap;letter-spacing:-.8px;font-size:25px}.brand strong{font-weight:600}.brand-symbol{width:33px;height:36px;fill:none;stroke:var(--accent);stroke-width:3}.header nav{display:flex;margin-left:auto;gap:7px;background:#ccc0d905;border:1px solid var(--line);border-radius:8px;padding:4px}.nav-item{border:0;background:transparent;padding:10px 15px;border-radius:5px;font-size:14px;color:var(--muted);transition:background .25s,color .25s}.nav-item.active{background:#b79ad611;color:#eee7f4}.count{display:inline-block;font-family:Consolas,monospace;font-size:12px;margin-left:7px;color:#83788e}.header-right{display:flex;align-items:center;gap:17px}.organization{font-size:12px;letter-spacing:1px;color:#988da2}.preview{font-size:12px;color:#b5abc0;border:1px solid #cfb8e725;border-radius:4px;padding:5px 8px}.motion-toggle{background:transparent;border:1px solid #cfb8e725;border-radius:5px;min-width:35px;min-height:35px;color:#b8acc3}.motion-toggle:hover{color:var(--accent);border-color:var(--accent)}main{max-width:1640px;margin:auto;padding:0 4.5%}.hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;min-height:360px;padding:26px 0 28px;position:relative;border-bottom:1px solid var(--line);gap:16px}.eyebrow{font-family:Consolas,monospace;font-size:12px;letter-spacing:1.8px;color:#9b8ea8;margin:0 0 23px;display:flex;align-items:center;gap:11px}.eyebrow-line{width:23px;height:1px;background:var(--accent)}h1{font-size:clamp(36px,3.8vw,64px);line-height:1.1;font-weight:450;letter-spacing:-2px;margin:0 0 20px}h1 em{font-style:normal;color:var(--accent)}h1 span,h1 em{display:inline-block;animation:headline-in .95s var(--ease) both}h1 em{animation-delay:.14s}.intro{font-size:16px;line-height:1.65;color:var(--muted);margin:0;animation:rise-in .9s .25s var(--ease) both}.hero-link{display:inline-flex;align-items:center;gap:28px;font-size:14px;margin-top:21px;color:#dfd7e7}.hero-link>span{display:grid;place-items:center;width:30px;height:30px;background:var(--accent);color:#170925;border-radius:50%;transition:transform .3s var(--ease)}.hero-link:hover>span{transform:rotate(45deg)}.network{position:relative;aspect-ratio:600/340;width:100%;max-width:620px;justify-self:end;isolation:isolate;--px:0px;--py:0px;transform:translate(var(--px),var(--py));transition:transform .7s var(--ease)}.network:before{content:'';position:absolute;inset:5% 13%;background:radial-gradient(ellipse,#541b8e40,transparent 67%);animation:breathe 7s ease-in-out infinite}.network-grid{position:absolute;inset:0;background-image:linear-gradient(#bc98e00c 1px,transparent 1px),linear-gradient(90deg,#bc98e00c 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse,black 25%,transparent 72%)}.connections{width:100%;height:100%;position:absolute;inset:0;fill:none}.wires{stroke:#785f915c;stroke-width:1}.signals{stroke:var(--accent);stroke-width:1.6;stroke-dasharray:9 220;animation:signal-flow 7s linear infinite;filter:drop-shadow(0 0 4px #9249dc)}.hub-rings{stroke:#8d50ca24;stroke-dasharray:3 8;transform-origin:300px 170px;animation:orbit 65s linear infinite}.hub{position:absolute;left:50%;top:50%;width:93px;height:93px;transform:translate(-50%,-50%);display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #a160e277;background:linear-gradient(140deg,#311b48dc,#11081bed);box-shadow:0 0 50px #7422c61a,inset 0 0 24px #a364e20b;border-radius:18px;animation:hub-glow 6s ease-in-out infinite}.hub>span{font-size:49px;font-weight:450;line-height:1;color:#d8baf7}.hub small{font-family:Consolas,monospace;font-size:10px;letter-spacing:4px;margin-left:4px;margin-top:7px;color:#9679b3}.network-label{position:absolute;transform:translate(-50%,-50%);padding:10px 12px;background:linear-gradient(120deg,#21152dd9,#100b16ed);border:1px solid #cfb6e935;border-radius:5px;white-space:nowrap;font-size:12px;color:#c4bace;box-shadow:0 9px 20px #0003;animation:label-float 7s ease-in-out infinite}.network-label span{color:#76539a;font-family:Consolas,monospace;margin-right:7px}.label-one{left:19%;top:21%}.label-two{left:78%;top:16%;animation-delay:-2s}.label-three{left:85%;top:68%;animation-delay:-4s}.label-four{left:42%;top:85%;animation-delay:-1s}.label-five{left:12.5%;top:68%;animation-delay:-3s}.network-caption{position:absolute;right:3%;bottom:0;font-family:Consolas,monospace;font-size:10px;letter-spacing:1.5px;color:#70637e}.section-top{display:flex;justify-content:space-between;gap:24px;align-items:center;padding-top:26px}h2{font-size:23px;letter-spacing:-.5px;font-weight:450;margin:0}h2 .count{font-size:12px;vertical-align:middle;border:1px solid var(--line);padding:4px 7px;border-radius:4px;margin-left:12px}.search{display:flex;align-items:center;gap:12px;width:320px;padding:11px 14px;background:#f7f1fd04;border:1px solid #cfb8e728;border-radius:6px;transition:border-color .3s,box-shadow .3s}.search:focus-within{border-color:#9249dc77;box-shadow:0 0 18px #9249dc08}.search svg{width:18px;height:18px;fill:none;stroke:#9385a2;stroke-width:1.5;flex-shrink:0}.search input{min-width:0;width:100%;color:#ddd5e5;background:transparent;border:0;font-size:14px;outline:none}.search input::placeholder{color:#80768b}.search kbd{font-size:12px;color:#776c82;border:1px solid #cfb8e720;border-radius:3px;padding:1px 5px}.filters{display:flex;gap:6px;flex-wrap:wrap;margin:19px 0 22px}.filters button{font-size:14px;color:#978da1;border:1px solid transparent;background:transparent;padding:7px 13px;border-radius:5px;transition:background .25s,border-color .25s,color .25s}.filters button:hover{color:#e6daf2;background:#c291f30b}.filters button.selected{background:#9249dc14;border-color:#9249dc35;color:#b37ee8}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;perspective:1000px}.card{--mx:50%;--my:50%;--rx:0deg;--ry:0deg;--lift:0px;position:relative;isolation:isolate;overflow:hidden;border:1px solid #ad95c62b;background:linear-gradient(120deg,#25183247,#0d0912);border-radius:9px;padding:22px 23px 0;transform:translateY(var(--lift)) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .4s var(--ease),border-color .35s,box-shadow .35s;animation:rise-in .65s var(--ease) both;animation-delay:calc(var(--order,0)*65ms)}.card:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(260px circle at var(--mx) var(--my),#9249dc18,transparent 75%);opacity:0;transition:opacity .35s}.card:after{content:'';position:absolute;left:23px;right:23px;top:0;height:1px;background:linear-gradient(90deg,transparent,#a660ec,transparent);transform:scaleX(0);transition:transform .5s var(--ease)}.card:hover{--lift:-4px;border-color:#9249dc66;box-shadow:0 15px 50px #0005,0 0 22px #9249dc06}.card:hover:before{opacity:1}.card:hover:after{transform:scaleX(1)}.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.icon{width:44px;height:44px;display:grid;place-items:center;background:#aa70e40b;border:1px solid #b698d420;border-radius:9px;color:#b99cd6;transition:background .3s,color .3s,transform .4s var(--ease)}.icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.card:hover .icon{background:#9249dc1c;color:#aa6aea;transform:rotate(-7deg)}.favorite{font-size:24px;color:#685b75;background:transparent;border:0;width:35px;height:35px;border-radius:5px;transition:color .25s,transform .3s}.favorite:hover{color:#cfb0ef;transform:scale(1.16)}.favorite[aria-pressed=true]{color:var(--accent)}.card h3{font-size:21px;font-weight:500;letter-spacing:-.45px;margin:0 0 10px}.card p{font-size:14px;color:#998fa3;line-height:1.65;min-height:69px;margin:0;max-width:380px}.card-bottom{margin-top:21px;padding:14px 0;display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #d5c4e613}.category{font-family:Consolas,monospace;font-size:12px;color:#80728e}.open{border:0;background:transparent;color:#c6b9d3;font-size:14px;padding:5px 0 5px 5px}.open span{display:inline-block;margin-left:17px;color:#966fbe;font-size:20px;transition:transform .25s}.open:hover{color:var(--accent)}.open:hover span{transform:translate(3px,-3px);color:var(--accent)}.note{font-size:12px;color:#80768b;margin:19px 0}.empty{border:1px dashed #947bae44;padding:40px 20px;color:#aea2b9;text-align:center;border-radius:8px;font-size:16px}footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;color:#7b7086;padding:24px 0;margin-top:28px}footer>span:last-child{font-family:Consolas,monospace;font-size:12px;letter-spacing:1px}footer>span:last-child>span{color:var(--accent);margin-left:20px;font-size:18px}.footer-separator{padding:0 12px;color:#4b3e58}dialog{width:calc(100% - 36px);max-width:450px;border:1px solid #a77ad466;border-radius:13px;padding:34px;background:linear-gradient(135deg,#1e1428,#0b070f);color:#eae6ee;box-shadow:0 0 85px #9249dc11,0 24px 100px #0009}dialog[open]{animation:dialog-in .35s var(--ease)}dialog::backdrop{background:#040207b8;backdrop-filter:blur(8px)}dialog h2{font-size:27px}dialog p:not(.eyebrow){font-size:16px;line-height:1.7;color:#aca2b7}.close{position:absolute;right:13px;top:10px;background:transparent;border:0;color:#a395b2;font-size:28px}.dialog-note{font-size:14px;line-height:1.7;background:#a264e008;border:1px solid var(--line);border-radius:6px;padding:15px;color:#aca2b7}.done{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--accent);border:0;color:#13081e;border-radius:5px;margin-top:22px;padding:13px 18px;font-size:14px;font-weight:600}.done span{font-size:20px}.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important;transition:none!important}.motion-paused .card{transform:none!important}.motion-paused .network{transform:none!important}@keyframes headline-in{from{opacity:0;transform:translateY(20px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes rise-in{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}@keyframes signal-flow{to{stroke-dashoffset:-458}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes breathe{50%{opacity:.45;transform:scale(1.13)}}@keyframes hub-glow{50%{box-shadow:0 0 60px #7422c635,inset 0 0 24px #a364e213;border-color:#a160e2aa}}@keyframes label-float{50%{translate:0 -5px}}@keyframes dialog-in{from{opacity:0;transform:translateY(15px) scale(.97)}to{opacity:1;transform:none}}@media(min-width:1600px){.hero{min-height:410px}.card p{min-height:48px}}@media(max-width:1150px){.organization{display:none}.header{gap:20px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1.1fr 1fr}.network-label{font-size:10px;padding:8px}.network-label span{display:none}.network-caption{font-size:8px}.hub{width:70px;height:70px;border-radius:14px}.hub>span{font-size:37px}.hub small{font-size:8px}.card p{min-height:46px}h1{font-size:clamp(35px,4vw,48px)}}@media(max-width:800px){.header{flex-wrap:wrap;min-height:90px;padding-top:18px;padding-bottom:18px;gap:15px}.header nav{order:3;margin:0;width:100%}.nav-item{flex:1}.header-right{margin-left:auto}.hero{min-height:335px;grid-template-columns:1.2fr .8fr;gap:0}.hero-copy{position:relative;z-index:1}.network{opacity:.6;min-width:300px;margin-left:-80px;justify-self:center}.network-label{display:none}.network-caption{display:none}h1{font-size:clamp(34px,5.3vw,44px);letter-spacing:-1.3px}.eyebrow{font-size:12px;letter-spacing:1px}.section-top{flex-direction:column;align-items:stretch;gap:17px}.search{width:100%}.card{padding:20px 19px 0}.card p{min-height:70px}footer>span:last-child{display:none}}@media(max-width:540px){main{padding:0 20px}.header{padding:17px 20px}.brand{font-size:23px;gap:9px}.header-right{gap:9px}.hero{display:block;min-height:345px;padding:30px 0;overflow:hidden}.hero-copy{z-index:1}.network{position:absolute;right:-165px;top:30px;width:340px;opacity:.25;z-index:0;pointer-events:none}h1{font-size:36px;line-height:1.15}.intro{font-size:16px;max-width:290px}.hero-link{margin-top:22px}.grid{grid-template-columns:1fr}.card p{min-height:0}.card{padding:24px 24px 0}.card h3{font-size:23px}.card p{font-size:16px}.card-top{margin-bottom:20px}.card-bottom{padding:16px 0}.filters{gap:3px}.filters button{font-size:13px;padding:8px 9px}h2{font-size:22px}.note{line-height:1.7}footer{line-height:1.8;margin-top:25px}.footer-separator{padding:0 7px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.card,.network{transform:none!important}}@media(hover:none){.card:hover{--lift:0px}.card{transform:none!important}}
/* Deux thèmes complets; le vert reste la couleur de repère. */
.theme-toggle{display:grid;place-items:center;background:transparent;border:1px solid #cfb8e725;border-radius:5px;min-width:35px;min-height:35px;color:#b8acc3;transition:color .25s,border-color .25s,background .25s}.theme-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.theme-toggle:hover{color:var(--accent);border-color:var(--accent);background:#9249dc0a}.header,body,.card,.search,.nav-item,dialog{transition:background-color .35s,color .35s,border-color .35s,box-shadow .35s}.card{transition:transform .4s var(--ease),border-color .35s,box-shadow .35s,background-color .35s}
:root[data-theme=light]{color-scheme:light;background:#f6f4f8;color:#20152c;--accent:#421470;--muted:#60566b;--line:#2a193b25}
[data-theme=light] .ambient{background:radial-gradient(ellipse at 80% 0%,#cfbae56b,transparent 48%),radial-gradient(ellipse at 8% 80%,#e6deef85,transparent 45%)}
[data-theme=light] .header nav{background:#fff9;border-color:#2a193b25}
[data-theme=light] .nav-item.active{background:#e5deec;color:#301a46}
[data-theme=light] .count{color:#63576f}
[data-theme=light] .preview{color:#5f546b;border-color:#46355830;background:#ffffff80}
[data-theme=light] .motion-toggle,[data-theme=light] .theme-toggle{color:#564566;border-color:#46355835;background:#ffffff70}
[data-theme=light] .motion-toggle:hover,[data-theme=light] .theme-toggle:hover{border-color:#421470;color:#421470;background:#e8e2ef}
[data-theme=light] .organization{color:#63576f}
[data-theme=light] .eyebrow{color:#645871}
[data-theme=light] .hero-link{color:#3b2c4a}
[data-theme=light] .hero-link>span{color:white;background:#421470}
[data-theme=light] .network:before{background:radial-gradient(ellipse,#9b69ce55,transparent 67%)}
[data-theme=light] .network-grid{background-image:linear-gradient(#46206c15 1px,transparent 1px),linear-gradient(90deg,#46206c15 1px,transparent 1px)}
[data-theme=light] .wires{stroke:#6d4e8d65}
[data-theme=light] .hub-rings{stroke:#4f227d38}
[data-theme=light] .signals{filter:drop-shadow(0 0 3px #571f9070)}
[data-theme=light] .hub{background:linear-gradient(140deg,#f3eafd,#cebae3);border-color:#42147080;box-shadow:0 0 45px #6429a025}
[data-theme=light] .hub>span{color:#33174f}
[data-theme=light] .hub small{color:#5c4376}
[data-theme=light] .network-label{background:linear-gradient(120deg,#fffffff2,#eae4f0f5);color:#483957;border-color:#62457e3f;box-shadow:0 9px 20px #321d4810}
[data-theme=light] .network-label span{color:#6e5c81}
[data-theme=light] .network-caption{color:#665775}
[data-theme=light] .search{background:#fff9;border-color:#38224e2c}
[data-theme=light] .search input{color:#291b37}
[data-theme=light] .search input::placeholder{color:#6e6478}
[data-theme=light] .search svg{stroke:#6e6478}
[data-theme=light] .search kbd{color:#6e6478;border-color:#38224e2c}
[data-theme=light] .filters button{color:#5e5469}
[data-theme=light] .filters button:hover{color:#301c45;background:#e5deec}
[data-theme=light] .filters button.selected{color:#391261;background:#e2d9eb;border-color:#866ca050}
[data-theme=light] .card{background:linear-gradient(120deg,#ffffff,#f3f0f6);border-color:#47325c29;box-shadow:0 4px 15px #3e285405}
[data-theme=light] .card:before{background:radial-gradient(260px circle at var(--mx) var(--my),#7a38bc20,transparent 75%)}
[data-theme=light] .card:after{background:linear-gradient(90deg,transparent,#542187,transparent)}
[data-theme=light] .card:hover{border-color:#42147070;box-shadow:0 15px 40px #40245c18}
[data-theme=light] .icon{background:#eae4f0;border-color:#907ba52a;color:#5b3b7b}
[data-theme=light] .card:hover .icon{background:#dbcde9;color:#421470}
[data-theme=light] .favorite{color:#7c6e89}
[data-theme=light] .favorite[aria-pressed=true]{color:#421470}
[data-theme=light] .card p{color:#63596d}
[data-theme=light] .card-bottom{border-color:#3a294b19}
[data-theme=light] .category{color:#6f647a}
[data-theme=light] .open{color:#493360}
[data-theme=light] .open span{color:#532a7c}
[data-theme=light] .open:hover{color:#35105a}
[data-theme=light] .note,[data-theme=light] footer{color:#6a5f75}
[data-theme=light] .empty{color:#60566b;border-color:#8c79a0}
[data-theme=light] dialog{background:linear-gradient(135deg,#fff,#f2eef7);color:#2b1c3b;border-color:#63477f66;box-shadow:0 24px 100px #2c1d3b40}
[data-theme=light] dialog::backdrop{background:#21172b5c}
[data-theme=light] dialog p:not(.eyebrow){color:#5f536b}
[data-theme=light] .dialog-note{color:#5f536b;background:#ebe5f0;border-color:#46355825}
[data-theme=light] .close{color:#594969}
[data-theme=light] .done{color:white;background:#421470}
.motion-paused .card,.motion-paused h1 span,.motion-paused h1 em,.motion-paused .intro,.motion-paused dialog[open]{animation:none!important;opacity:1;translate:none;filter:none}
@media(max-width:380px){.brand{font-size:20px}.brand-symbol{width:27px}.header-right{gap:6px}.preview{display:none}}
/* Deux écrans qui se superposent au défilement natif. */
:root{--header-height:100px;--page-surface:#0c0810;--intro-scale:1;--intro-opacity:1;--intro-shift:0px;--intro-blur:0px;--sheet-radius:32px}
:root[data-theme=light]{--page-surface:#f6f4f8}
.header{position:sticky;top:0;z-index:8;background:#09060ce8;backdrop-filter:blur(18px)}
[data-theme=light] .header{background:#f6f4f8eb}
.intro-stage{position:relative;height:calc(140svh - var(--header-height));min-height:680px}
.intro-stage .hero{position:sticky;top:var(--header-height);min-height:calc(100svh - var(--header-height));border:0;padding-bottom:85px;transform-origin:50% 40%;transform:translateY(var(--intro-shift)) scale(var(--intro-scale));opacity:var(--intro-opacity);filter:blur(var(--intro-blur));will-change:transform,opacity}
.intro-stage h1{font-size:clamp(38px,4.65vw,76px)}
.scroll-cue{position:absolute;bottom:30px;left:0;display:flex;align-items:center;gap:14px;color:var(--muted);font-size:12px;letter-spacing:.4px}
.scroll-cue>span:last-child{color:var(--accent);font-size:21px;animation:scroll-nudge 1.8s ease-in-out infinite}
.scroll-track{width:21px;height:32px;border:1px solid #806e9280;border-radius:11px;position:relative}
.scroll-track:after{content:'';position:absolute;top:6px;left:9px;width:2px;height:7px;border-radius:2px;background:var(--accent);animation:scroll-nudge 1.8s ease-in-out infinite}
#applications{position:relative;z-index:3;margin-top:-40svh;min-height:calc(100svh - var(--header-height));padding:32px 28px 10px;background:var(--page-surface);border:1px solid var(--line);border-radius:var(--sheet-radius) var(--sheet-radius) 12px 12px;box-shadow:0 -28px 80px #00000025;scroll-margin-top:calc(var(--header-height) + 18px);isolation:isolate}
#applications:before{content:'';position:absolute;left:32px;right:32px;top:-1px;height:1px;background:linear-gradient(90deg,transparent,#9249dc90,transparent)}
#applications .section-top{padding-top:5px}
.scroll-story #applications .card{animation:none;opacity:var(--reveal-opacity,1);translate:0 var(--reveal-y,0px);scale:var(--reveal-scale,1);will-change:translate,opacity}
.scroll-story #applications .card:focus-within{opacity:1!important;translate:0 0!important;scale:1!important}
[data-theme=light] #applications{box-shadow:0 -28px 80px #3e285410}
@keyframes scroll-nudge{0%,100%{transform:translateY(0);opacity:.55}55%{transform:translateY(5px);opacity:1}}
@media(max-width:800px){:root{--header-height:150px}.intro-stage .hero{min-height:calc(100svh - var(--header-height));padding-bottom:90px}.intro-stage h1{font-size:clamp(35px,5.5vw,48px)}#applications{padding:28px 20px 10px}.intro-stage{min-height:640px}}
@media(max-width:540px){.intro-stage .hero{display:flex;align-items:center;min-height:max(440px,calc(100svh - var(--header-height)));overflow:visible;padding:30px 0 90px}.intro-stage .network{top:24%;right:-15px;width:260px;min-width:0;opacity:.16}.intro-stage h1{font-size:clamp(32px,8.6vw,43px)}.intro-stage{height:calc(140svh - var(--header-height));min-height:620px}.scroll-cue{bottom:32px;font-size:12px;gap:10px}#applications{margin-left:-8px;margin-right:-8px;padding:26px 16px 10px;border-radius:24px 24px 10px 10px}.scroll-story #applications .card{will-change:auto}}
.motion-paused .intro-stage .hero{transform:none!important;opacity:1!important;filter:none!important}
.motion-paused #applications .card{opacity:1!important;translate:0 0!important;scale:1!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.intro-stage .hero{transform:none!important;opacity:1!important;filter:none!important}.scroll-story #applications .card{opacity:1!important;translate:0 0!important;scale:1!important}}
@media(max-height:600px){.intro-stage{height:auto;min-height:0}.intro-stage .hero{position:relative;top:0;min-height:440px;transform:none!important;opacity:1!important;filter:none!important}#applications{margin-top:0}.scroll-cue{bottom:24px}}

/* Identité OPCO fournie : violet #381360, mauve #8872a0, lavande #b8a9c6.
   Le fichier photographique original reste intact; seul son cadrage CSS/SVG est utilisé. */
:root{--accent:#c5a6ed;--muted:#b8a9c6;--line:#b8a9c62b;--page-surface:#160d23;background:#10091a;color:#f3edf9}
:root[data-theme=light]{--accent:#381360;--muted:#695878;--line:#8872a036;--page-surface:#fbf9fd;background:#fbf9fd;color:#29143f}
.header{background:#10091aeb}
[data-theme=light] .header{background:#fbf9fdeb}
.ambient{background:radial-gradient(ellipse at 80% 0%,#38136075,transparent 48%),radial-gradient(ellipse at 8% 80%,#8872a01c,transparent 45%)}
[data-theme=light] .ambient{background:radial-gradient(ellipse at 80% 0%,#b8a9c65c,transparent 48%),radial-gradient(ellipse at 8% 80%,#8872a017,transparent 45%)}
.brand{gap:17px}.opco-logo{display:block;width:124px;height:auto;aspect-ratio:640/250;flex-shrink:0;overflow:hidden;filter:grayscale(1) contrast(3) invert(1);mix-blend-mode:screen}
[data-theme=light] .opco-logo{filter:none;mix-blend-mode:multiply}
.brand-divider{height:32px;width:1px;background:var(--line)}
.nexus-wordmark{font-size:25px;font-weight:450;letter-spacing:-.8px}
.hub .hub-logo{width:76px;max-width:84%;margin:7px auto 3px}
.hub small{color:#c6b1df}
[data-theme=light] .hub small{color:#6b488b}
h1 em{color:#c5a6ed}
[data-theme=light] h1 em{color:#381360}
[data-theme=light] .done,[data-theme=light] .hero-link>span{background:#381360;color:#fff}
[data-theme=light] .filters button.selected{color:#381360;background:#eee6f6;border-color:#8872a066}
[data-theme=light] .card:hover .icon,[data-theme=light] .favorite[aria-pressed=true]{color:#381360}
[data-theme=light] .network-label{background:linear-gradient(120deg,#fff,#eee7f5);color:#513469;border-color:#8872a05c}
[data-theme=light] .hub{background:linear-gradient(140deg,#fbf8ff,#d4c5e5);border-color:#8872a088}
@media(max-width:800px){.brand{gap:12px}.opco-logo{width:110px}.nexus-wordmark{font-size:23px}.hub .hub-logo{width:56px}}
@media(max-width:540px){.opco-logo{width:98px}.brand{gap:10px}.nexus-wordmark{font-size:22px}.brand-divider{height:27px}.header-right .preview{display:none}}
@media(max-width:380px){.opco-logo{width:85px}.brand{gap:8px}.nexus-wordmark{font-size:20px}}

/* Reflet au clic, indépendant du halo de survol. */
.card{cursor:pointer}
.click-reflection{position:absolute;pointer-events:none;z-index:2;border-radius:50%;background:radial-gradient(circle,transparent 12%,#e5d6ff14 29%,#d8baff28 39%,#c5a6ed08 49%,transparent 63%);transform:translate(-50%,-50%) scale(0);animation:click-reflection .85s cubic-bezier(.16,.65,.3,1) forwards;mix-blend-mode:screen}
[data-theme=light] .click-reflection{background:radial-gradient(circle,transparent 12%,#8872a00a 29%,#8872a01c 39%,#38136005 49%,transparent 63%);mix-blend-mode:multiply}
@keyframes click-reflection{0%{transform:translate(-50%,-50%) scale(0);opacity:0}12%{opacity:1}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}
.motion-paused .click-reflection{display:none}
@media(prefers-reduced-motion:reduce){.click-reflection{display:none}}

/* Le catalogue émerge d’un second plan puis se redresse devant l’accueil. */
:root{--sheet-scale:1;--sheet-tilt:0deg;--sheet-lift:0px;--sheet-shade:0;--sheet-shadow:0;--sheet-edge:0;--sheet-layer:3}
.intro-stage{z-index:2;pointer-events:none}
.intro-stage .hero{pointer-events:auto}
.apps-stage{position:relative;z-index:var(--sheet-layer);margin-top:-40svh}
.apps-stage #applications{margin-top:0;transform-origin:50% 0;transform:perspective(1600px) translateY(var(--sheet-lift)) rotateX(var(--sheet-tilt)) scale(var(--sheet-scale));box-shadow:0 -30px 95px rgb(0 0 0 / var(--sheet-shadow)),0 -1px 0 #c5a6ed50;will-change:transform;transition:background-color .35s,color .35s;backface-visibility:hidden}
.apps-stage #applications:after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgb(7 2 14 / var(--sheet-shade)),transparent 72%);pointer-events:none;z-index:5}
.apps-stage #applications:before{inset:0 0 auto;height:100px;border-radius:inherit;background:linear-gradient(180deg,#c5a6ed35,transparent);opacity:var(--sheet-edge);pointer-events:none;z-index:4}
[data-theme=light] .apps-stage #applications{box-shadow:0 -24px 85px rgb(56 19 96 / var(--sheet-shadow)),0 -1px 0 #8872a060}
[data-theme=light] .apps-stage #applications:after{background:linear-gradient(180deg,rgb(136 114 160 / var(--sheet-shade)),transparent 72%)}
[data-theme=light] .apps-stage #applications:before{background:linear-gradient(180deg,#ffffffbb,transparent)}
.apps-stage #applications:focus-within{transform:none!important}
.motion-paused .apps-stage #applications{transform:none!important;box-shadow:none!important}
.motion-paused .apps-stage #applications:before,.motion-paused .apps-stage #applications:after{display:none}
@media(prefers-reduced-motion:reduce){.apps-stage #applications{transform:none!important;box-shadow:none!important}.apps-stage #applications:before,.apps-stage #applications:after{display:none}}
@media(max-height:600px){.apps-stage{margin-top:0}.apps-stage #applications{transform:none!important;box-shadow:none!important}.apps-stage #applications:before,.apps-stage #applications:after{display:none}}


/* Cascade et passage carte → fiche d’accès. */
.scroll-story .card>*:not(.click-reflection){animation:card-content-in .55s var(--ease) both;animation-delay:calc(var(--order,0)*75ms)}
@keyframes card-content-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
#app-dialog[open]{animation:none;transform-origin:center;max-width:640px;width:calc(100% - 40px);padding:clamp(28px,5vw,52px);border-radius:18px}
#app-dialog h2{font-size:clamp(27px,4vw,38px)}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-new(root){z-index:2}
::view-transition-old(root){z-index:1}
.network{--depth-x:0px;--depth-y:0px;--depth-rx:0deg;--depth-ry:0deg;transform:perspective(1000px) translate(var(--px),var(--py)) rotateX(var(--depth-rx)) rotateY(var(--depth-ry));transform-style:preserve-3d}
.network-grid{translate:calc(var(--depth-x)*-.6) calc(var(--depth-y)*-.6);transition:translate .7s var(--ease)}
.connections{translate:calc(var(--depth-x)*.25) calc(var(--depth-y)*.25);transition:translate .7s var(--ease)}
.hub{translate:var(--depth-x) var(--depth-y);transition:translate .7s var(--ease),border-color .3s}
.network-label{font-family:inherit;translate:calc(var(--depth-x)*1.3) calc(var(--depth-y)*1.3);animation:none;transition:translate .7s var(--ease),background .3s,border-color .3s,box-shadow .3s;color:inherit;cursor:pointer}
.network-label.lit{border-color:var(--accent);background:#381360;box-shadow:0 0 22px #c5a6ed24;color:#fff}
[data-theme=light] .network-label.lit{background:#e6d7f4;color:#381360;border-color:#8872a0}
.hub.connected{border-color:var(--accent)}
.interactive-connections path{stroke:var(--accent);stroke-width:2.5;opacity:0;stroke-dasharray:12 88;filter:drop-shadow(0 0 3px #c5a6ed);transition:opacity .25s}
.interactive-connections path.lit{opacity:1;stroke-dasharray:none;animation:none}
@keyframes connection-pulse{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
.motion-paused .network-grid,.motion-paused .connections,.motion-paused .hub,.motion-paused .network-label{translate:0 0!important}
.motion-paused .card>*:not(.click-reflection){animation:none!important;opacity:1;transform:none}
.motion-paused .interactive-connections path.lit{stroke-dasharray:none}
@media(prefers-reduced-motion:reduce){.network-grid,.connections,.hub,.network-label{translate:0 0!important}.scroll-story .card>*:not(.click-reflection){animation:none!important;opacity:1;transform:none}.interactive-connections path.lit{stroke-dasharray:none}}

/* Cascade temporelle au moment de l’apparition, pas au chargement hors écran. */
.scroll-story .card>*:not(.click-reflection){animation:none}
.scroll-story #applications .card{rotate:x var(--entrance-tilt,0deg);transform-origin:50% 100%}
.scroll-story #applications .card:focus-within{rotate:none!important}
.motion-paused .scroll-story #applications .card,.motion-paused #applications .card{rotate:none!important}
@media(prefers-reduced-motion:reduce){.scroll-story #applications .card{rotate:none!important}}

/* Signature OPCO Nexus : mouvement discret au survol et au clavier. */
.header .brand{position:relative;border-radius:8px;isolation:isolate}
.header .brand .opco-logo,.header .brand .nexus-wordmark{transition:translate .32s var(--ease),filter .32s var(--ease),color .32s}
.header .brand:after{content:'';position:absolute;inset:-5px -8px;z-index:2;pointer-events:none;border-radius:8px;background:linear-gradient(110deg,transparent 25%,#c5a6ed16 45%,#ffffff22 50%,#c5a6ed16 55%,transparent 75%);background-size:250% 100%;background-position:150% 0;opacity:0}
@media(hover:hover){.header .brand:hover .opco-logo{translate:0 -2px}.header .brand:hover .nexus-wordmark{translate:2px -1px;color:var(--accent)}.header .brand:hover:after{animation:brand-shimmer .8s ease-out both}}
.header .brand:focus-visible .opco-logo{translate:0 -2px}
.header .brand:focus-visible .nexus-wordmark{translate:2px -1px;color:var(--accent)}
.header .brand:focus-visible:after{animation:brand-shimmer .8s ease-out both}
[data-theme=light] .header .brand:after{background-image:linear-gradient(110deg,transparent 25%,#8872a00a 45%,#8872a020 50%,#8872a00a 55%,transparent 75%)}
@keyframes brand-shimmer{0%{background-position:150% 0;opacity:0}20%{opacity:1}85%{opacity:.7}100%{background-position:-50% 0;opacity:0}}
.motion-paused .header .brand .opco-logo,.motion-paused .header .brand .nexus-wordmark{translate:0 0!important}
.motion-paused .header .brand:after{display:none}
@media(prefers-reduced-motion:reduce){.header .brand .opco-logo,.header .brand .nexus-wordmark{translate:0 0!important}.header .brand:after{display:none}}

/* Accueil : texte plus compact, réseau plus présent et légèrement abaissé. */
@media(min-width:801px){
 .intro-stage .hero{grid-template-columns:.85fr 1.15fr;gap:30px}
 .intro-stage h1{font-size:clamp(34px,3.5vw,57px);letter-spacing:-1.5px}
 .intro-stage .intro{font-size:15px;max-width:360px}
 .intro-stage .network{width:100%;max-width:760px;margin-top:65px;justify-self:center}
}
@media(min-width:541px) and (max-width:800px){
 .intro-stage .hero{grid-template-columns:1fr 1fr;gap:10px}
 .intro-stage h1{font-size:clamp(29px,4.4vw,36px);letter-spacing:-1px}
 .intro-stage .network{min-width:320px;margin-left:-35px;margin-top:45px;opacity:.8}
}
@media(max-width:540px){
 .intro-stage h1{font-size:clamp(29px,7.6vw,37px)}
 .intro-stage .network{width:290px;top:32%;right:-20px}
}

/* Onglets indépendants et déconnexion à l’extrémité droite. */
.header nav{background:transparent;border:0;padding:0;gap:8px}
.header nav [data-view]{position:relative;border:1px solid var(--line);border-radius:8px;padding:10px 16px;background:#8872a00a;color:var(--muted);transition:background .2s,border-color .2s,color .2s}
.header nav [data-view]:hover{background:#8872a01c;border-color:#8872a080;color:var(--accent)}
.header nav [data-view].active{background:#38136055;border-color:#b8a9c670;color:#efe4fc;box-shadow:inset 0 -2px 0 #c5a6ed}
[data-theme=light] .header nav{background:transparent;border:0}
[data-theme=light] .header nav [data-view]{background:#ffffff80;color:#695878}
[data-theme=light] .header nav [data-view].active{background:#eee6f6;color:#381360;border-color:#8872a060;box-shadow:inset 0 -2px 0 #381360}
.header-right{margin-left:auto}
.logout-button{flex-shrink:0;background:transparent;border:1px solid var(--line);border-radius:7px;padding:10px 13px;color:var(--muted);font-size:13px;cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.logout-button:hover{color:var(--accent);border-color:#8872a080;background:#8872a01a}
@media(max-width:1100px){.header{gap:18px}.header-right{gap:10px}.header-right .organization{display:none}}
@media(max-width:800px){.header nav{width:100%;order:3}.header nav [data-view]{flex:1}.header-right{gap:8px}}
@media(max-width:540px){.header .brand{flex:1}.header-right{width:100%;order:2;margin-left:0}.header-right .logout-button{margin-left:auto}.header nav{order:3}.header-right .organization{display:none}}

/* Réseau OPCO agrandi et accès applicatifs plus lisibles. */
@media(min-width:801px){
 .intro-stage .hero{grid-template-columns:.72fr 1.28fr;gap:24px}
 .intro-stage .network{max-width:900px;width:100%;min-height:390px}
 .intro-stage .network-label{font-size:15px;padding:15px 18px;border-radius:8px;min-height:48px}
 .intro-stage .network-label span{display:inline;font-size:12px}
 .intro-stage .hub{width:120px;height:120px;border-radius:24px}
 .intro-stage .hub .hub-logo{width:98px;max-width:86%}
 .intro-stage .hub small{font-size:12px;letter-spacing:4px;margin-top:9px}
 .intro-stage .network-caption{font-size:11px}
}
@media(min-width:801px) and (max-width:1150px){
 .intro-stage .network-label{font-size:13px;padding:12px;min-height:43px}
 .intro-stage .network-label span{display:none}
 .intro-stage .hub{width:100px;height:100px}
 .intro-stage .hub .hub-logo{width:82px}
 .intro-stage .label-five{left:16%}
 .intro-stage .label-three{left:82%}
}
@media(min-width:541px) and (max-width:800px){
 .intro-stage .network{min-width:350px;opacity:.9}
 .intro-stage .hub{width:96px;height:96px}
 .intro-stage .hub .hub-logo{width:78px}
}
@media(max-width:540px){
 .intro-stage .network{width:320px}
 .intro-stage .hub{width:92px;height:92px}
 .intro-stage .hub .hub-logo{width:75px}
}

/* Respiration du titre et appel à explorer adapté au nouveau réseau. */
.intro-stage h1 em{margin-top:.23em}
.intro-stage .hero-link{gap:18px;margin-top:27px;min-height:46px;align-items:center;line-height:1.35}
.intro-stage .hero-link>span{width:44px;height:44px;min-width:44px;flex:0 0 44px;border-radius:50%;font-size:0;position:relative;background:transparent;border:1px solid #b8a9c680;color:var(--accent);box-shadow:0 0 0 5px #8872a00a;transition:background .25s,border-color .25s,box-shadow .25s}
.intro-stage .hero-link>span:before{content:'';position:absolute;width:13px;height:13px;border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:translate(-2px,-2px);transition:translate .25s}
.intro-stage .hero-link>span:after{content:'';position:absolute;width:18px;height:1.7px;background:currentColor;transform:rotate(45deg);transition:translate .25s}
.intro-stage .hero-link:hover>span,.intro-stage .hero-link:focus-visible>span{transform:none;background:#8872a024;border-color:var(--accent);box-shadow:0 0 0 6px #8872a00e}
.intro-stage .hero-link:hover>span:before,.intro-stage .hero-link:hover>span:after{translate:2px 2px}
[data-theme=light] .intro-stage .hero-link>span{background:#ffffff80;color:#381360;border-color:#8872a080}
[data-theme=light] .intro-stage .hero-link:hover>span{background:#eee6f6}
@media(max-width:540px){.intro-stage h1 em{margin-top:.2em}.intro-stage .hero-link{gap:15px;margin-top:24px}}
.motion-paused .intro-stage .hero-link>span:before,.motion-paused .intro-stage .hero-link>span:after{translate:0 0!important}
@media(prefers-reduced-motion:reduce){.intro-stage .hero-link>span:before,.intro-stage .hero-link>span:after{translate:0 0!important}}

/* Onglets discrets au repos, contour révélé au survol. */
.header nav [data-view]{border-color:#b8a9c610;background:transparent}
.header nav [data-view].active{border-color:#b8a9c61b;background:#8872a008;box-shadow:none}
.header nav [data-view]:hover,.header nav [data-view]:focus-visible{border-color:#b8a9c670;background:#8872a018}
[data-theme=light] .header nav [data-view]{border-color:#8872a012;background:transparent}
[data-theme=light] .header nav [data-view].active{border-color:#8872a01c;background:#8872a007;box-shadow:none}
[data-theme=light] .header nav [data-view]:hover,[data-theme=light] .header nav [data-view]:focus-visible{border-color:#8872a060;background:#8872a012}

/* Accents lime ponctuels, identité OPCO mauve conservée. */
:root{--lime-accent:#d4ed85}
:root[data-theme=light]{--lime-accent:#637b16}
.intro-stage .hero-link:hover>span,.intro-stage .hero-link:focus-visible>span{color:var(--lime-accent);border-color:var(--lime-accent);background:#d4ed8510;box-shadow:0 0 0 6px #d4ed8508}
[data-theme=light] .intro-stage .hero-link:hover>span,[data-theme=light] .intro-stage .hero-link:focus-visible>span{color:var(--lime-accent);border-color:var(--lime-accent);background:#e9f3cd}
.signals{stroke:var(--lime-accent);filter:drop-shadow(0 0 3px #d4ed8540)}
.interactive-connections path{stroke:var(--lime-accent);filter:drop-shadow(0 0 3px #d4ed8540)}
[data-theme=light] .signals,[data-theme=light] .interactive-connections path{filter:none}
.favorite[aria-pressed=true],[data-theme=light] .favorite[aria-pressed=true]{color:var(--lime-accent)}

/* Retour au bouton plein d’origine, sans écrasement du cercle. */
.intro-stage .hero-link>span{display:grid;place-items:center;width:40px;height:40px;min-width:40px;flex:0 0 40px;aspect-ratio:1;border:0;border-radius:50%;background:#c5a6ed;color:#28143f;font-family:'Segoe UI',sans-serif;font-size:24px;line-height:1;box-shadow:none;transition:background .25s,color .25s,transform .25s}
.intro-stage .hero-link>span:before,.intro-stage .hero-link>span:after{content:none}
.intro-stage .hero-link:hover>span,.intro-stage .hero-link:focus-visible>span{background:#d4ed85;color:#28320d;box-shadow:none;transform:translate(2px,2px)}
[data-theme=light] .intro-stage .hero-link>span{background:#381360;color:#fff;border:0}
[data-theme=light] .intro-stage .hero-link:hover>span,[data-theme=light] .intro-stage .hero-link:focus-visible>span{background:#d4ed85;color:#28320d;box-shadow:none}
.motion-paused .intro-stage .hero-link>span{transform:none!important}
@media(prefers-reduced-motion:reduce){.intro-stage .hero-link>span{transform:none!important}}

/* Onglet sélectionné légèrement plus marqué que l’onglet inactif. */
.header nav [data-view].active{border-color:#b8a9c665;background:#8872a013;box-shadow:none}
[data-theme=light] .header nav [data-view].active{border-color:#8872a060;background:#8872a00d;box-shadow:none}
.header nav [data-view].active:hover{border-color:#b8a9c690}
[data-theme=light] .header nav [data-view].active:hover{border-color:#8872a085}

/* Budget de rendu : transformations courtes, sans flou plein écran animé. */
.intro-stage .hero{filter:none!important;will-change:auto}
.apps-stage #applications{box-shadow:0 -10px 32px #10091a22!important;will-change:auto;backface-visibility:visible}
.header{backdrop-filter:none;background:#10091af8}
[data-theme=light] .header{background:#fbf9fdf8}
.hub{animation:none;box-shadow:0 0 28px #8872a019}
.network:before{animation:none}
.hub-rings{animation-duration:100s}
.signals,.interactive-connections path{filter:none!important}
.card,.scroll-story #applications .card{will-change:auto}
.card:hover{box-shadow:0 8px 22px #0002}
.effects-offscreen,.effects-offscreen *,.effects-offscreen:before,.effects-background *,.effects-background *:before,.effects-background *:after{animation-play-state:paused!important}
dialog::backdrop{backdrop-filter:none}

/* Flèche dessinée et impulsions discrètes, transform/opacity uniquement. */
.intro-stage .hero-link>span svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s ease}
.intro-stage .hero-link:hover>span{transform:none}
.intro-stage .hero-link:hover>span svg{transform:translate(1px,1px)}
.network{container-type:size}
.effects-covered *,.effects-covered *:before,.effects-covered *:after{animation-play-state:paused!important}

@media(min-width:801px) and (max-width:1150px){
 .intro-stage .hero{grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr);gap:22px}
 .intro-stage .network{min-width:0;min-height:0;aspect-ratio:600/340}
 .intro-stage .network-label{font-size:11px;padding:9px;min-height:36px}
 .intro-stage .hub{width:78px;height:78px;border-radius:18px}
 .intro-stage .network-caption{font-size:8px;letter-spacing:.7px;right:0;bottom:-30px}
 .intro-stage .label-five{left:21%}
 .intro-stage .label-three{left:79%}
}

/* Ombre de transition prépeinte : seule son opacité change au défilement. */
.apps-stage #applications{border-radius:24px 24px 12px 12px}
.apps-stage #applications:after{background:linear-gradient(180deg,#07020e,transparent 72%);opacity:var(--sheet-shade)}
[data-theme=light] .apps-stage #applications:after{background:linear-gradient(180deg,#8872a0,transparent 72%)}
:root:not([data-theme=light]) .network-label{box-shadow:none;background:#201329}
:root:not([data-theme=light]) .hub{box-shadow:none}
:root:not([data-theme=light]) .card{background:#1a1024}
.opco-logo{contain:paint}

/* Logo, branches et impulsions partagent exactement le même plan. */
.network .connections,.network .hub,.network .network-label{translate:var(--depth-x) var(--depth-y)}

/* Réponse au survol du titre, sans boucle ni mesure de souris. */
.intro-stage h1>span,.intro-stage h1>em{position:relative;transition:translate .35s cubic-bezier(.2,.8,.2,1),color .3s}
.intro-stage h1>span:after,.intro-stage h1>em:after{content:'';position:absolute;left:0;right:0;bottom:-.09em;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--accent),var(--lime-accent));opacity:0;transform:scaleX(.15);transform-origin:left;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s;pointer-events:none}
@media(hover:hover) and (pointer:fine){
 .intro-stage h1>span:hover,.intro-stage h1>em:hover{translate:4px -2px;color:var(--accent)}
 .intro-stage h1>span:hover:after,.intro-stage h1>em:hover:after{opacity:.7;transform:scaleX(1)}
}
.motion-paused .intro-stage h1>span,.motion-paused .intro-stage h1>em{translate:none!important}
.motion-paused .intro-stage h1>span:after,.motion-paused .intro-stage h1>em:after{display:none}
@media(prefers-reduced-motion:reduce){.intro-stage h1>span,.intro-stage h1>em{translate:none!important}.intro-stage h1>span:after,.intro-stage h1>em:after{display:none}}

/* Identité centrale : logo OPCO seul, centré dans sa tuile. */
.intro-stage .hub .hub-logo{margin:0 auto}

/* Les phrases mènent à la liste, au clic comme au clavier. */
.intro-stage .headline-link{display:inline-block;color:inherit;text-decoration:none;border-radius:3px;cursor:pointer}
.intro-stage .headline-link:focus-visible{outline:2px solid var(--accent);outline-offset:7px}
.intro-stage h1>span:focus-within:after,.intro-stage h1>em:focus-within:after{opacity:.7;transform:scaleX(1)}

/* Diagramme en réseau agrandi dans son ensemble. */
@media(min-width:1151px){
 .intro-stage .hero{grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr);gap:24px}
 .intro-stage .network{max-width:1100px;width:100%;min-height:0;aspect-ratio:600/340}
 .intro-stage .hub{width:clamp(110px,17cqw,150px);height:clamp(110px,17cqw,150px)}
 .intro-stage .hub .hub-logo{width:82%;max-width:86%}
 .intro-stage .network-label{font-size:clamp(14px,1.85cqw,18px);padding:clamp(12px,1.8cqw,20px)}
}
@media(min-width:801px) and (max-width:1150px){
 .intro-stage .hero{grid-template-columns:minmax(225px,.6fr) minmax(0,1.4fr);gap:22px}
 .intro-stage .network{min-width:0;min-height:0;width:100%;aspect-ratio:600/340}
 .intro-stage .hub{width:clamp(78px,18cqw,100px);height:clamp(78px,18cqw,100px)}
 .intro-stage .hub .hub-logo{width:82%;max-width:86%}
 .intro-stage .network-label{font-size:clamp(11px,2.6cqw,14px);padding:clamp(9px,2.2cqw,13px)}
}

/* Halo prépeint : déplacer la lumière sans recalculer son dégradé à chaque mouvement. */
.card:before{inset:auto;left:0;top:0;width:520px;height:520px;background:radial-gradient(260px circle at center,#9249dc18,transparent 75%);transform:translate(calc(var(--mx) - 260px),calc(var(--my) - 260px));pointer-events:none}
[data-theme=light] .card:before{background:radial-gradient(260px circle at center,#7a38bc20,transparent 75%)}

/* Survol des commandes de la liste : effet local, sans animation continue. */
#apps-title #view-title{transition:color .22s ease}
#apps-title:hover #view-title{color:var(--accent)}
#applications .search{position:relative}
#applications .search:after{content:'';position:absolute;inset:-1px;border:1px solid var(--accent);border-radius:inherit;box-shadow:0 0 0 3px #8872a00c,0 0 17px #a878df30;opacity:0;transition:opacity .22s ease;pointer-events:none}
#applications .search:hover,#applications .search:focus-within{border-color:var(--accent);box-shadow:none}
#applications .search:hover:after{opacity:.65}
#applications .search:focus-within:after{opacity:1}
#applications .search svg{transition:stroke .22s ease}
#applications .search:hover svg,#applications .search:focus-within svg{stroke:var(--accent)}
[data-theme=light] #applications .search:after{box-shadow:0 0 0 3px #8872a00a,0 0 15px #64348c20}
.motion-paused #apps-title #view-title,.motion-paused #applications .search:after,.motion-paused #applications .search svg{transition:none}
@media(prefers-reduced-motion:reduce){#apps-title #view-title,#applications .search:after,#applications .search svg{transition:none}}

#apps-title #view-title{color:inherit;text-decoration:none;cursor:pointer;border-radius:3px}
#apps-title:hover #view-title,#apps-title #view-title:focus-visible{color:var(--accent)}
#apps-title #view-title:focus-visible{outline:2px solid var(--accent);outline-offset:6px}

/* Petits traits verts mobiles sur les branches, palette Nexus conservée. */
.network .network-flow{fill:none;stroke:var(--lime-accent);stroke-width:2.3;stroke-linecap:round;stroke-dasharray:12 188;pointer-events:none;animation:network-line-travel 5.5s linear infinite}
.network .interactive-connections path.lit{stroke-dasharray:12 188;animation:network-line-travel 5.5s linear infinite}
@keyframes network-line-travel{0%{stroke-dashoffset:12;opacity:0}15%{opacity:.9}75%{opacity:.9}100%{stroke-dashoffset:-100;opacity:0}}
.motion-paused .network .network-flow,.motion-paused .network .interactive-connections path.lit{animation:none!important;opacity:0}
@media(prefers-reduced-motion:reduce){.network .network-flow,.network .interactive-connections path.lit{animation:none!important;opacity:0}}
