﻿:root{--ink:#071525;--deep:#0e2c3e;--lime:#c9ff4a;--aqua:#68ead7;--paper:#f4f1eb;--muted:#637583}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif}.top{height:78px;padding:0 7vw;display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:#fff;gap:25px}.brand{font-size:12px;font-weight:800;letter-spacing:1px}.brand b{color:var(--lime);font-size:20px}.top a{color:inherit;text-decoration:none;font-size:12px;font-weight:800}.top-links{display:flex;align-items:center;gap:22px}.home-link{color:var(--lime)!important}.article-hero{position:relative;isolation:isolate;padding:95px 7vw 85px;background:var(--deep);color:#fff;overflow:hidden}.article-hero:before,.article-hero:after{content:"";position:absolute;z-index:-1;left:42%;width:72vw;height:23vw;border:2px solid rgba(104,234,215,.22);border-radius:50%;transform:rotate(-16deg);pointer-events:none}.article-hero:before{top:138px}.article-hero:after{top:149px;left:41.4%;border-color:rgba(201,255,74,.14)}.eyebrow{font:11px "DM Mono",monospace;letter-spacing:1px;color:var(--aqua)}h1{max-width:900px;margin:24px 0;font-size:clamp(48px,7vw,96px);line-height:.9;letter-spacing:-.075em}h1 em{font:400 1em Georgia,serif;color:var(--lime)}.lead{max-width:820px;color:#d1dfe4;font-size:18px;line-height:1.7}.visual{margin:55px auto -145px;max-width:1150px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(120deg,#071525,#12354a);overflow:hidden}.diagram{position:relative;min-height:380px;padding:40px;display:flex;align-items:center;justify-content:space-between;gap:30px}.diagram:before{content:"";position:absolute;left:12%;right:12%;top:50%;height:2px;background:repeating-linear-gradient(90deg,var(--aqua) 0 10px,transparent 10px 22px);opacity:.72;animation:flow 2.8s linear infinite}.node{position:relative;z-index:2;display:grid;place-content:center;width:155px;min-height:112px;padding:16px;border:1px solid rgba(104,234,215,.6);background:#0b2233;color:#fff;text-align:center;font-size:12px;font-weight:800;letter-spacing:.04em;box-shadow:0 0 0 9px rgba(104,234,215,.06)}.node b{display:block;margin-bottom:8px;color:var(--lime);font-size:22px;letter-spacing:-.06em}.node.core{border-radius:50%;width:170px;height:170px;background:var(--aqua);color:var(--ink);border:0;box-shadow:0 0 0 18px rgba(104,234,215,.12),0 0 55px rgba(104,234,215,.35)}.node.core b{color:var(--ink);font-size:28px}.node.active{animation:nodePulse 2.8s ease-in-out infinite}.diagram .signal{position:absolute;z-index:3;width:13px;height:13px;border-radius:50%;background:var(--lime);box-shadow:0 0 18px var(--lime);animation:signal 3.8s linear infinite}
/* Architecture */.ecosystem{min-height:420px;display:grid;place-items:center}.ecosystem:before{display:none}.ecosystem .core{position:relative;z-index:3}.app-ring{position:absolute;inset:25px;z-index:1;border:2px solid rgba(104,234,215,.25);border-radius:50%;transform:scaleY(.55) rotate(-8deg)}.app-ring:after{content:"";position:absolute;inset:10px;border:2px solid rgba(201,255,74,.18);border-radius:50%}.app{position:absolute;z-index:3;display:grid;place-content:center;width:88px;height:88px;border-radius:50%;border:1px solid rgba(104,234,215,.7);background:#0b2233;color:white;text-align:center;font-size:11px;font-weight:800;cursor:default;transition:.25s}.app b{color:var(--lime);font-size:15px}.app small{display:none;position:absolute;left:50%;bottom:calc(100% + 12px);width:190px;padding:11px;background:#f4f1eb;color:var(--ink);font:600 11px/1.4 Manrope;box-shadow:0 10px 25px rgba(0,0,0,.25);transform:translateX(-50%)}.app:hover{z-index:7;transform:scale(1.16);background:var(--aqua);color:var(--ink);border-color:var(--aqua)}.app:hover b{color:var(--ink)}.app:hover small{display:block}.app.crm{left:9%;top:34%}.app.hcm{left:20%;top:68%}.app.cmms{left:35%;top:8%}.app.eqms{right:35%;bottom:8%}.app.lims{right:20%;top:68%}.app.tms{right:9%;top:34%}.app.tpl{right:30%;top:6%}.ecosystem .signal{animation:ecosignal 8s linear infinite}
/* ALM */.alm{min-height:360px;align-items:center;justify-content:center;gap:0}.alm:before{display:none}.alm-step{position:relative;z-index:2;display:grid;place-content:center;width:155px;height:125px;padding:18px 28px;background:#0b2233;color:#fff;text-align:center;border:1px solid rgba(104,234,215,.55);clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%,12% 50%);transition:.25s;cursor:default}.alm-step:first-child{clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%)}.alm-step b{color:var(--lime);font-size:18px}.alm-step small{display:none;font-size:11px;line-height:1.35}.alm-step:hover{z-index:5;transform:scale(1.13);background:var(--aqua);color:var(--ink);clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%,12% 50%)}.alm-step:hover b{color:var(--ink)}.alm-step:hover small{display:block}.alm-flow{position:absolute;left:11%;right:11%;top:50%;height:4px;background:repeating-linear-gradient(90deg,var(--lime) 0 22px,transparent 22px 44px);animation:flow 1.2s linear infinite;opacity:.9}
/* IA */.agentic{min-height:390px;justify-content:center;gap:80px}.agentic:before{display:none}.agentic .core{width:180px;height:180px}.agentic .agent-lobe{position:absolute;z-index:2;width:145px;min-height:105px;padding:16px;border:1px solid rgba(104,234,215,.65);background:#0b2233;color:#fff;text-align:center;font-size:12px;transition:.25s}.agentic .agent-lobe b{display:block;color:var(--lime);font-size:18px;margin-bottom:7px}.agentic .agent-lobe:hover{background:var(--aqua);color:var(--ink);transform:translateY(-8px) scale(1.06)}.agentic .agent-lobe:hover b{color:var(--ink)}.agentic .observe{left:10%;top:23%}.agentic .tools{right:10%;top:23%}.agentic .govern{left:calc(50% - 72px);bottom:7%}.agentic .agent-link{position:absolute;height:1px;background:rgba(104,234,215,.6);transform-origin:left}.agentic .link-a{width:30%;left:20%;top:45%;transform:rotate(14deg)}.agentic .link-b{width:30%;right:20%;top:45%;transform:rotate(166deg)}.agentic .link-c{width:17%;left:47%;top:66%;transform:rotate(90deg)}
main{max-width:1320px;margin:0 auto;padding:190px 7vw 100px}.content{display:grid;grid-template-columns:minmax(0,1fr) .34fr;gap:7vw}.content h2{font-size:34px;line-height:1.1;letter-spacing:-.05em;margin:0 0 18px}.content h3{margin:38px 0 12px;font-size:20px}.content p,.content li{font-size:17px;line-height:1.8;color:#425464}.points{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:38px 0}.points div{padding:24px;background:#d8eef3;border-top:3px solid var(--aqua);font-size:14px;line-height:1.6;color:#17384b}.points b{display:block;margin-bottom:9px;color:var(--ink);font-size:16px}.quote{margin:0;padding:29px;border-left:4px solid var(--aqua);background:#dbe7e6;color:#17384b;font:italic 25px/1.35 Georgia,serif}.cta{margin-top:75px;padding:42px;background:var(--lime);display:flex;justify-content:space-between;align-items:center;gap:20px}.cta h2{margin:0;font-size:34px;letter-spacing:-.05em}.cta a{color:var(--ink);font-weight:800}@keyframes flow{to{background-position:160px 0}}@keyframes nodePulse{50%{transform:translateY(-6px);box-shadow:0 15px 35px rgba(104,234,215,.22)}}@keyframes signal{0%{left:14%;top:calc(50% - 6px)}48%{left:84%;top:calc(50% - 6px)}100%{left:14%;top:calc(50% - 6px)}}@keyframes ecosignal{0%{left:11%;top:42%}20%{left:35%;top:14%}43%{left:70%;top:12%}64%{left:88%;top:42%}82%{left:60%;top:76%}100%{left:11%;top:42%}}@media(max-width:700px){.top{padding:0 6vw}.top-links{gap:12px}.article-hero{padding:65px 6vw}.article-hero:before,.article-hero:after{width:125vw;height:52vw;left:22%;top:225px}.article-hero:after{top:234px}.visual{margin:40px auto -75px}.diagram{min-height:440px;padding:25px;flex-direction:column;justify-content:space-between}.diagram .signal{display:none}.ecosystem{min-height:600px}.app{width:65px;height:65px;font-size:9px}.app b{font-size:12px}.app.crm{left:4%;top:38%}.app.hcm{left:12%;top:70%}.app.cmms{left:31%;top:9%}.app.eqms{right:31%;bottom:9%}.app.lims{right:12%;top:70%}.app.tms{right:4%;top:38%}.app.tpl{right:26%;top:12%}.alm{min-height:560px;padding:35px}.alm-step{width:185px;height:85px;clip-path:none!important}.alm-flow{left:50%;top:13%;bottom:13%;width:4px;height:auto;background:repeating-linear-gradient(180deg,var(--lime) 0 22px,transparent 22px 44px)}.agentic{min-height:560px}.agentic .agent-lobe{width:120px}.agentic .observe{left:4%;top:18%}.agentic .tools{right:4%;top:18%}.agentic .govern{bottom:8%}.agentic .agent-link{display:none}.content{grid-template-columns:1fr}.points{grid-template-columns:1fr}.cta{display:block}.cta a{display:block;margin-top:15px}main{padding:115px 6vw 75px}}

/* Keep the migration journey vertical. */
.diagram.vertical{justify-content:center;gap:48px}.diagram.vertical:before{left:50%;right:auto;top:11%;bottom:11%;height:auto;width:2px;background:repeating-linear-gradient(180deg,var(--aqua) 0 10px,transparent 10px 22px)}
@media(max-width:700px){.diagram.vertical{justify-content:space-between;gap:0}}

/* Insight banners reuse the oversized concentric arcs of the home hero. */
@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap");
.article-hero:before,.article-hero:after{left:auto;right:-310px;top:28px;width:880px;height:880px;transform:none;border:1px solid rgba(104,234,215,.16)}
.article-hero:before{box-shadow:0 0 0 90px rgba(104,234,215,.025),0 0 0 180px rgba(104,234,215,.018)}
.article-hero:after{display:none}.visual{margin:55px auto -190px;overflow:visible}.article-hero{padding-bottom:85px}main{padding-top:235px}
/* Architecture: centered ERP, unobstructed contextual cards and a real stream of data. */
.ecosystem{overflow:visible}.ecosystem .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.app small{font-family:Manrope,Arial,sans-serif;font-weight:600}.app.cmms small,.app.tpl small{bottom:auto;top:calc(100% + 12px)}.data-particles{position:absolute;inset:0;pointer-events:none;z-index:2}.data-particles span{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime);animation:particle 5s linear infinite}.data-particles span:nth-child(3n){background:var(--aqua);box-shadow:0 0 10px var(--aqua)}.data-particles span:nth-child(2){animation-delay:-.5s}.data-particles span:nth-child(3){animation-delay:-1s}.data-particles span:nth-child(4){animation-delay:-1.5s}.data-particles span:nth-child(5){animation-delay:-2s}.data-particles span:nth-child(6){animation-delay:-2.5s}.data-particles span:nth-child(7){animation-delay:-3s}.data-particles span:nth-child(8){animation-delay:-3.5s}.data-particles span:nth-child(9){animation-delay:-4s}.data-particles span:nth-child(10){animation-delay:-4.5s}.data-particles span:nth-child(11){animation-delay:-1.2s}.data-particles span:nth-child(12){animation-delay:-2.7s}.data-particles span:nth-child(13){animation-delay:-3.8s}.data-particles span:nth-child(14){animation-delay:-.9s}.data-particles span:nth-child(15){animation-delay:-2.1s}.data-particles span:nth-child(16){animation-delay:-4.2s}.data-particles span:nth-child(17){animation-delay:-3.1s}.data-particles span:nth-child(18){animation-delay:-1.8s}@keyframes particle{0%{left:10%;top:42%;opacity:0}8%{opacity:1}30%{left:35%;top:15%}52%{left:69%;top:13%}75%{left:89%;top:43%}92%{opacity:1}100%{left:10%;top:42%;opacity:0}}
/* ALM interaction */.alm:has(.alm-step:hover) .alm-step:not(:hover){transform:scale(.72);opacity:.36}.alm .alm-step:hover{transform:scale(1.36);box-shadow:0 0 0 7px rgba(104,234,215,.12),0 18px 40px rgba(0,0,0,.35)}
/* Agentic loop: three round capabilities orbit the D365 F&O core at the same velocity. */
.agentic{position:relative;display:block;overflow:hidden}.agentic .core{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%)}.agent-orbit{position:absolute;z-index:2;left:50%;top:50%;width:1px;height:1px;transform-origin:0 0;animation:agent-orbit 26s linear infinite}.agent-orbit:before{content:"";position:absolute;width:560px;height:200px;left:-280px;top:-100px;border:1px solid rgba(104,234,215,.27);border-radius:50%;pointer-events:none}.agent-orbit .agent-lobe{position:absolute;left:280px;top:-55px;width:110px;height:110px;min-height:0;padding:13px;border-radius:50%;display:grid;place-content:center;background:#0b2233;box-shadow:0 0 0 9px rgba(104,234,215,.08),0 0 20px rgba(104,234,215,.24);font-size:10px}.agent-orbit .agent-lobe b{font-size:15px}.agent-orbit .agent-lobe:hover{transform:scale(1.22);box-shadow:0 0 0 12px rgba(104,234,215,.16),0 0 35px rgba(104,234,215,.38)}.agent-orbit .agent-lobe{animation:agent-counter 26s linear infinite}.agent-orbit.two{animation-delay:-8.66s}.agent-orbit.two .agent-lobe{animation-delay:-8.66s}.agent-orbit.three{animation-delay:-17.33s}.agent-orbit.three .agent-lobe{animation-delay:-17.33s}.agentic .agent-link{display:none}@keyframes agent-orbit{from{transform:rotate(-14deg) scaleY(.58)}to{transform:rotate(346deg) scaleY(.58)}}@keyframes agent-counter{from{transform:rotate(14deg) scaleY(1.72)}to{transform:rotate(-346deg) scaleY(1.72)}}
/* Migration workflow */.migration-flow{min-height:355px;justify-content:center;gap:0}.migration-flow:before{display:none}.migration-step{position:relative;z-index:2;display:grid;place-content:center;width:190px;height:125px;padding:18px 28px;text-align:center;background:#0b2233;color:#fff;border:1px solid rgba(104,234,215,.55);clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%,12% 50%)}.migration-step:first-child{clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%)}.migration-step b{display:block;color:var(--lime);font-size:18px;margin-bottom:6px}.migration-flow .alm-flow{top:50%}
@media(max-width:700px){.article-hero:before{right:-460px;top:50px}.visual{margin-bottom:-115px}.article-hero{padding-bottom:65px}main{padding-top:155px}.app.cmms small,.app.tpl small{top:calc(100% + 12px);bottom:auto}.agentic{min-height:530px}.agent-orbit:before{width:410px;height:260px;left:-205px;top:-130px}.agent-orbit .agent-lobe{left:205px;top:-48px;width:96px;height:96px;font-size:9px}.migration-flow{min-height:520px;padding:30px}.migration-step{width:190px;height:78px;clip-path:none!important}.migration-flow .alm-flow{left:50%;top:12%;bottom:12%;width:4px;height:auto;background:repeating-linear-gradient(180deg,var(--lime) 0 22px,transparent 22px 44px)}}

/* Architecture: applications orbit with a depth cue; JavaScript keeps each data flow attached to its moving target. */
.ecosystem:not(.agentic-ecosystem) .app,.ecosystem:not(.agentic-ecosystem) .data-particles span{offset-path:none!important;-webkit-offset-path:none!important;animation:none!important}
.ecosystem:not(.agentic-ecosystem) .app{will-change:left,top,transform;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}
.ecosystem:not(.agentic-ecosystem) .data-particles span{will-change:left,top,opacity}
.ecosystem:not(.agentic-ecosystem).is-orbit-paused .app-ring{animation-play-state:paused!important}

/* Architecture orbit refinements: no belt, and contextual copy is rendered in a dedicated foreground layer. */
.ecosystem:not(.agentic-ecosystem) .app-ring{display:none!important}
.ecosystem:not(.agentic-ecosystem) .app:hover small{display:none!important}
.architecture-tooltip{position:absolute;z-index:30;width:210px;padding:11px;background:var(--paper);color:var(--ink);font:600 11px/1.4 Manrope,Arial,sans-serif;box-shadow:0 10px 25px rgba(0,0,0,.3);pointer-events:none;opacity:0;transform:translate(-50%,-100%);transition:opacity .14s ease}
.architecture-tooltip.below{transform:translate(-50%,0)}
.architecture-tooltip.is-visible{opacity:1}

/* Let the diagram intentionally cross the hero/content boundary. */
.article-hero{overflow:visible;z-index:1}.article-hero .visual{position:relative;z-index:4}.article-hero + main{position:relative;z-index:2}

/* Decorative hero arcs must never create a horizontal page overflow. */
html,body{width:100%;overflow-x:hidden}


/* Dense, non-linear data traffic: every particle travels only between D365 F&O and one satellite system. */
.data-particles span{left:50%;top:50%;animation-duration:6.5s;animation-timing-function:ease-in-out}.data-particles span:nth-child(7n+1){animation-name:to-crm}.data-particles span:nth-child(7n+2){animation-name:to-hcm}.data-particles span:nth-child(7n+3){animation-name:to-cmms}.data-particles span:nth-child(7n+4){animation-name:to-eqms}.data-particles span:nth-child(7n+5){animation-name:to-lims}.data-particles span:nth-child(7n+6){animation-name:to-tms}.data-particles span:nth-child(7n){animation-name:to-3pl}.data-particles span:nth-child(3n+1){animation-direction:reverse}.data-particles span:nth-child(4n+1){animation-duration:8.2s}.data-particles span:nth-child(5n+2){animation-duration:5.4s}@keyframes to-crm{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}26%{left:42%;top:42%}47%{left:31%;top:47%}68%{left:18%;top:43%}}@keyframes to-hcm{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}27%{left:44%;top:61%}48%{left:32%;top:69%}70%{left:23%;top:74%}}@keyframes to-cmms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}24%{left:47%;top:36%}48%{left:41%;top:23%}70%{left:37%;top:13%}}@keyframes to-eqms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}27%{left:54%;top:63%}49%{left:61%;top:74%}70%{left:67%;top:84%}}@keyframes to-lims{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}26%{left:58%;top:61%}48%{left:69%;top:70%}70%{left:78%;top:75%}}@keyframes to-tms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}25%{left:61%;top:44%}48%{left:73%;top:49%}70%{left:84%;top:43%}}@keyframes to-3pl{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}24%{left:54%;top:35%}47%{left:61%;top:22%}70%{left:68%;top:12%}}

/* Keep lower orbital applications above the white content: the entire circle is interactive. */
.article-hero{z-index:3}.article-hero + main{z-index:2}.ecosystem .app{z-index:6;box-shadow:0 0 0 8px rgba(104,234,215,.06),0 0 24px rgba(104,234,215,.22)}.ecosystem .app:hover{z-index:9;box-shadow:0 0 0 12px rgba(104,234,215,.14),0 0 34px rgba(104,234,215,.45)}
/* A moving, open double orbital trail, always below the application bubbles. */
.app-ring{z-index:1;border:0!important;transform:scaleY(.55) rotate(-8deg);background:conic-gradient(from 12deg,transparent 0 12%,rgba(104,234,215,.48) 18% 44%,transparent 54% 100%);-webkit-mask:radial-gradient(transparent 0 61%,#000 62% 64%,transparent 65%);mask:radial-gradient(transparent 0 61%,#000 62% 64%,transparent 65%);animation:orbit-trail 12s linear infinite}.app-ring:after{inset:10px;border:0!important;background:conic-gradient(from 192deg,transparent 0 14%,rgba(201,255,74,.42) 20% 47%,transparent 57% 100%);-webkit-mask:radial-gradient(transparent 0 61%,#000 62% 64%,transparent 65%);mask:radial-gradient(transparent 0 61%,#000 62% 64%,transparent 65%);animation:orbit-trail 9s linear infinite reverse}@keyframes orbit-trail{to{transform:rotate(360deg)}}

/* Single orbital comet trail: one ellipse, half-circumference and no second belt. */
.app-ring{background:conic-gradient(from 18deg,transparent 0 7%,rgba(104,234,215,.12) 12%,rgba(104,234,215,.55) 28%,rgba(104,234,215,.38) 47%,rgba(104,234,215,.05) 57%,transparent 60% 100%)!important;animation:orbit-trail 12s linear infinite}.app-ring:after{display:none!important}

/* Calibrated orbital geometry: the trail crosses the centre of every satellite bubble. */
.app-ring{transform:scaleY(.55)!important;background:conic-gradient(from 18deg,transparent 0 4%,rgba(104,234,215,.10) 8%,rgba(104,234,215,.54) 26%,rgba(104,234,215,.42) 58%,rgba(104,234,215,.08) 77%,transparent 82% 100%)!important}.app.crm{top:24%}.app.hcm{top:60%}.app.cmms{top:15%}.app.eqms{top:64%;bottom:auto}.app.lims{top:60%;bottom:auto}.app.tms{top:24%;bottom:auto}.app.tpl{top:17%}

/* Preserve the ellipse while the comet trail completes its rotation. */
@keyframes orbit-trail{from{transform:scaleY(.55) rotate(0deg)}to{transform:scaleY(.55) rotate(360deg)}}

/* Rotate the open section of the trail itself, independently from the ellipse geometry. */
@property --trail-angle{syntax:"<angle>";inherits:false;initial-value:18deg}.app-ring{--trail-angle:18deg;transform:scaleY(.55)!important;animation:trail-sweep 12s linear infinite!important;background:conic-gradient(from var(--trail-angle),transparent 0 4%,rgba(104,234,215,.10) 8%,rgba(104,234,215,.54) 26%,rgba(104,234,215,.42) 58%,rgba(104,234,215,.08) 77%,transparent 82% 100%)!important}@keyframes trail-sweep{to{--trail-angle:378deg}}
/* Re-synchronised routes from the ERP core to the recalibrated satellite centres. */
@keyframes to-crm{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}26%{left:42%;top:42%}47%{left:31%;top:38%}68%{left:18%;top:35%}}@keyframes to-hcm{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}27%{left:44%;top:61%}48%{left:32%;top:67%}70%{left:23%;top:71%}}@keyframes to-cmms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}24%{left:47%;top:36%}48%{left:41%;top:29%}70%{left:37%;top:25%}}@keyframes to-eqms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}27%{left:54%;top:63%}49%{left:61%;top:70%}70%{left:67%;top:75%}}@keyframes to-lims{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}26%{left:58%;top:61%}48%{left:69%;top:67%}70%{left:78%;top:71%}}@keyframes to-tms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}25%{left:61%;top:42%}48%{left:73%;top:38%}70%{left:84%;top:35%}}@keyframes to-3pl{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}24%{left:54%;top:38%}47%{left:61%;top:31%}70%{left:68%;top:28%}}
/* Perspective: close applications grow, distant ones recede. */
.ecosystem .app{--depth:1;transform:scale(var(--depth))}.ecosystem .app:hover{transform:scale(calc(var(--depth) * 1.16))}.ecosystem .app.hcm,.ecosystem .app.eqms,.ecosystem .app.lims{--depth:1.18;z-index:7}.ecosystem .app.crm,.ecosystem .app.tms{--depth:1.07}.ecosystem .app.cmms,.ecosystem .app.tpl{--depth:.84;opacity:.88}

/* Keep EQMS deliveries contained within the enlarged foreground bubble. */
@keyframes to-eqms{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}27%{left:54%;top:62%}49%{left:60%;top:68%}70%{left:64%;top:72%}}

/* Agentic insight reuses the orbital ecosystem model. */
.agentic-ecosystem .agent-observe{left:14%;top:24%}.agentic-ecosystem .agent-tools{right:14%;top:24%}.agentic-ecosystem .agent-govern{left:calc(50% - 44px);top:64%}.agentic-ecosystem .agent-govern small{bottom:calc(100% + 12px);top:auto}.agentic-ecosystem .agent-observe{--depth:1.06}.agentic-ecosystem .agent-tools{--depth:1.06}.agentic-ecosystem .agent-govern{--depth:1.2;z-index:7}.agent-data span:nth-child(3n+1){animation-name:to-agent-observe}.agent-data span:nth-child(3n+2){animation-name:to-agent-tools}.agent-data span:nth-child(3n){animation-name:to-agent-govern}@keyframes to-agent-observe{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}28%{left:42%;top:42%}50%{left:30%;top:37%}70%{left:18%;top:35%}}@keyframes to-agent-tools{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}28%{left:58%;top:42%}50%{left:70%;top:37%}70%{left:82%;top:35%}}@keyframes to-agent-govern{0%,100%{left:50%;top:50%;opacity:0}10%,90%{opacity:1}28%{left:50%;top:57%}50%{left:50%;top:66%}70%{left:50%;top:73%}}@media(max-width:700px){.agentic-ecosystem .agent-observe{left:8%;top:29%}.agentic-ecosystem .agent-tools{right:8%;top:29%}.agentic-ecosystem .agent-govern{top:62%}}

/* IA diagram: keep the orbital model without data particles. */
.agentic-ecosystem .agent-data{display:none}


/* Architecture ecosystem: satellites and data particles share one orbital clock. */
.ecosystem:not(.agentic-ecosystem) .app{left:0!important;right:auto!important;top:0!important;bottom:auto!important;offset-path:ellipse(43% 31% at 50% 50%);-webkit-offset-path:ellipse(43% 31% at 50% 50%);offset-rotate:0deg;-webkit-offset-rotate:0deg;animation:architecture-orbit 36s linear infinite!important}
.ecosystem:not(.agentic-ecosystem) .app.crm{animation-delay:-18s!important}.ecosystem:not(.agentic-ecosystem) .app.hcm{animation-delay:-23.15s!important}.ecosystem:not(.agentic-ecosystem) .app.cmms{animation-delay:-28.3s!important}.ecosystem:not(.agentic-ecosystem) .app.eqms{animation-delay:-2.6s!important}.ecosystem:not(.agentic-ecosystem) .app.lims{animation-delay:-7.7s!important}.ecosystem:not(.agentic-ecosystem) .app.tms{animation-delay:-12.85s!important}.ecosystem:not(.agentic-ecosystem) .app.tpl{animation-delay:-33.45s!important}
.ecosystem:not(.agentic-ecosystem) .data-particles span{left:0;top:0;offset-path:ellipse(43% 31% at 50% 50%);-webkit-offset-path:ellipse(43% 31% at 50% 50%);offset-rotate:0deg;-webkit-offset-rotate:0deg;animation:architecture-orbit 36s linear infinite!important}
.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+1){animation-delay:-1.2s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+2){animation-delay:-6.35s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+3){animation-delay:-11.5s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+4){animation-delay:-16.65s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+5){animation-delay:-21.8s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n+6){animation-delay:-26.95s!important}.ecosystem:not(.agentic-ecosystem) .data-particles span:nth-child(7n){animation-delay:-32.1s!important}
.ecosystem:not(.agentic-ecosystem):has(.app:hover) .app,.ecosystem:not(.agentic-ecosystem):has(.app:hover) .data-particles span,.ecosystem:not(.agentic-ecosystem):has(.app:hover) .app-ring{animation-play-state:paused!important}
@keyframes architecture-orbit{from{offset-distance:0%;-webkit-offset-distance:0%}to{offset-distance:100%;-webkit-offset-distance:100%}}
@media(max-width:700px){.ecosystem:not(.agentic-ecosystem) .app,.ecosystem:not(.agentic-ecosystem) .data-particles span{offset-path:ellipse(43% 33% at 50% 50%);-webkit-offset-path:ellipse(43% 33% at 50% 50%)}}

/* Architecture only: remove the remaining decorative hero ellipse around the orbital applications. */
.article-hero:has(.ecosystem:not(.agentic-ecosystem)):before,.article-hero:has(.ecosystem:not(.agentic-ecosystem)):after{display:none}

/* Agentic insight: same depth-based satellite orbit, without the data particles. */
.agentic-ecosystem .app-ring{display:none!important}
.agentic-ecosystem .app{will-change:left,top,transform;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease}
.agentic-ecosystem .app:hover small{display:none!important}
.agentic-ecosystem .agent-data{display:block!important}
.agentic-ecosystem .data-particles span{left:0;top:0;animation:none!important;will-change:left,top,opacity}

/* Match the primary site logo in every Insights header. */
.top .brand{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;letter-spacing:1.8px}
.top .brand img{width:26px;height:26px;margin-right:4px}
.top .brand span{font-size:21px;letter-spacing:-1px}
.top .brand i{display:inline-block;width:5px;height:5px;margin:0 3px 4px;background:var(--lime);border-radius:50%}
/* Keep the IA communication stream visually aligned with the Architecture diagram. */
.agentic-ecosystem .agent-data span:nth-child(odd){background:var(--lime);box-shadow:0 0 10px var(--lime)}
.agentic-ecosystem .agent-data span:nth-child(even){background:var(--aqua);box-shadow:0 0 10px var(--aqua)}
/* DevOps and migration workflows use the same bi-colour data particles as the orbital diagrams. */
.alm-flow{z-index:1;height:14px;background:radial-gradient(circle at center,var(--lime) 0 3px,transparent 4px) 0 50%/36px 14px repeat-x;filter:drop-shadow(0 0 3px var(--lime));animation:workflow-particle-lime .92s linear infinite!important;opacity:1}
.alm-flow:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,var(--aqua) 0 3px,transparent 4px) 18px 50%/36px 14px repeat-x;filter:drop-shadow(0 0 3px var(--aqua));animation:workflow-particle-aqua .92s linear infinite}
@keyframes workflow-particle-lime{to{background-position:36px 50%}}@keyframes workflow-particle-aqua{to{background-position:54px 50%}}
@media(max-width:700px){.alm-flow{width:14px;height:auto;background-size:14px 36px;background-position:50% 0;animation-name:workflow-particle-lime-y!important}.alm-flow:before{background-size:14px 36px;background-position:50% 18px;animation-name:workflow-particle-aqua-y}@keyframes workflow-particle-lime-y{to{background-position:50% 36px}}@keyframes workflow-particle-aqua-y{to{background-position:50% 54px}}}
/* Highlight the active workflow step without changing the geometry of the process. */
.alm-step.is-intro-active{z-index:5;transform:scale(1.13);background:var(--aqua);color:var(--ink)}
.alm-step.is-intro-active b{color:var(--ink)}.alm-step.is-intro-active small{display:block}
.alm-step.is-intro-active{clip-path:polygon(0 0,86% 0,100% 50%,86% 100%,0 100%,12% 50%)}
.alm:has(.alm-step.is-intro-active) .alm-step:not(.is-intro-active){transform:scale(.72);opacity:.36}
.alm .alm-step.is-intro-active{transform:scale(1.36)}
.alm.is-intro-running .alm-step{pointer-events:none}
@media(max-width:700px){.alm-flow{top:4%;bottom:4%}}
@media(max-width:700px){.alm-flow{display:none}.mobile-workflow-particles{display:block!important;position:absolute;inset:0;z-index:1;visibility:visible!important;pointer-events:none}.mobile-workflow-particles i{display:block!important;position:absolute;width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);transform:translate(-50%,-50%)}.mobile-workflow-particles i:nth-child(even){background:var(--aqua);box-shadow:0 0 12px var(--aqua)}}

/* Double ceinture orbitale de l’accueil, visible sur tous les en-têtes Insights. */
.article-hero:before,.article-hero:after{display:block!important;z-index:0!important;left:auto!important;right:-310px!important;top:28px!important;width:880px!important;height:880px!important;transform:none!important;border:1px solid rgba(104,234,215,.16)!important}.article-hero:before{box-shadow:0 0 0 90px rgba(104,234,215,.025),0 0 0 180px rgba(104,234,215,.018)}.article-hero:after{display:none!important}.article-hero>.eyebrow,.article-hero>h1,.article-hero>.lead{position:relative;z-index:1}@media(max-width:700px){.article-hero:before{right:-460px!important;top:50px!important}}

/* Architecture insight: the photographic lead visual introduces the article; the interactive model belongs to the content. */
.architecture-hero-image{position:relative;z-index:4;max-width:1180px;margin:55px auto -190px;overflow:hidden;border:1px solid rgba(255,255,255,.17);box-shadow:0 24px 55px rgba(0,0,0,.22)}
.architecture-hero-image img{display:block;width:100%;height:clamp(260px,31vw,480px);object-fit:cover;object-position:center}
.architecture-hero + main{padding-top:235px}
.architecture-scheme{margin:94px 0 0;padding:58px;overflow:hidden;background:linear-gradient(130deg,#071525,#12354a);color:#fff}
.architecture-scheme-copy{max-width:790px;margin:0 auto 34px;text-align:center}
.architecture-scheme-copy .eyebrow{margin:0 0 14px}
.architecture-scheme-copy h2{margin:0 0 16px;font-size:clamp(30px,4vw,48px);line-height:1;letter-spacing:-.06em}
.architecture-scheme-copy p:last-child{margin:0;color:#d1dfe4;font-size:16px;line-height:1.7}
.architecture-scheme .ecosystem{max-width:1120px;margin:0 auto;min-height:465px;border:1px solid rgba(255,255,255,.16);background:rgba(5,22,37,.3)}
.architecture-scheme .architecture-tooltip{z-index:40}
/* Architecture data streams: denser, faster, and intentionally less fluorescent than the main visual palette. */
.architecture-scheme .data-particles span{background:#98b943;box-shadow:0 0 8px rgba(152,185,67,.78)}
.architecture-scheme .data-particles span:nth-child(3n){background:#3aa69c;box-shadow:0 0 8px rgba(58,166,156,.8)}
@media(max-width:700px){.architecture-hero-image{margin:40px -1vw -115px}.architecture-hero-image img{height:235px;object-position:center}.architecture-hero + main{padding-top:155px}.architecture-scheme{margin-top:64px;padding:38px 16px}.architecture-scheme-copy{margin-bottom:26px;text-align:left}.architecture-scheme .ecosystem{min-height:570px}}

/* Architecture applications inherit the glass-sphere treatment from the home atom. */
.architecture-scheme .ecosystem .core,.architecture-scheme .ecosystem .app{overflow:hidden;border:0!important}
.architecture-scheme .ecosystem .core{background:radial-gradient(circle at 22% 15%,rgba(255,255,255,.97) 0 4%,rgba(232,255,250,.72) 10%,rgba(187,255,246,.20) 19%,transparent 34%),radial-gradient(ellipse at 70% 76%,rgba(0,42,62,.54) 0,rgba(0,77,88,.22) 38%,transparent 70%),radial-gradient(circle at 48% 48%,rgba(113,241,224,.94) 0 27%,rgba(63,207,197,.78) 62%,rgba(22,124,134,.62) 100%);box-shadow:inset 9px 10px 16px rgba(255,255,255,.20),inset -13px -14px 20px rgba(0,54,70,.38),0 0 0 18px rgba(99,214,206,.16),0 0 52px rgba(99,214,206,.62),0 0 104px rgba(99,214,206,.28)}
.architecture-scheme .ecosystem .core:before,.architecture-scheme .ecosystem .app:before{content:"";position:absolute;inset:4%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 27% 17%,rgba(255,255,255,.32),transparent 28%),linear-gradient(145deg,rgba(255,255,255,.10),transparent 38%,rgba(0,25,47,.24))}
.architecture-scheme .ecosystem .app{--app-glass:#49a9a2;background:radial-gradient(circle at 22% 15%,rgba(255,255,255,.95) 0 5%,rgba(235,255,252,.62) 11%,rgba(220,255,250,.16) 20%,transparent 35%),radial-gradient(ellipse at 72% 78%,rgba(0,28,49,.50),transparent 67%),radial-gradient(circle at 48% 48%,color-mix(in srgb,var(--app-glass) 92%,white) 0 28%,color-mix(in srgb,var(--app-glass) 76%,#0d6c76) 66%,color-mix(in srgb,var(--app-glass) 56%,#063047) 100%);box-shadow:inset 5px 6px 10px rgba(255,255,255,.18),inset -8px -9px 14px rgba(0,23,39,.35),0 0 0 7px color-mix(in srgb,var(--app-glass) 17%,transparent),0 0 25px color-mix(in srgb,var(--app-glass) 68%,transparent)}
.architecture-scheme .ecosystem .app.crm{--app-glass:#5f9fe1}.architecture-scheme .ecosystem .app.hcm{--app-glass:#8fbd5c}.architecture-scheme .ecosystem .app.cmms{--app-glass:#d0a761}.architecture-scheme .ecosystem .app.eqms{--app-glass:#d97f8c}.architecture-scheme .ecosystem .app.lims{--app-glass:#ad98df}.architecture-scheme .ecosystem .app.tms{--app-glass:#55b7a8}.architecture-scheme .ecosystem .app.tpl{--app-glass:#e2a75c}
.architecture-scheme .ecosystem .app.agent-observe{--app-glass:#5f9fe1}.architecture-scheme .ecosystem .app.agent-tools{--app-glass:#79b95d}.architecture-scheme .ecosystem .app.agent-govern{--app-glass:#ad98df}
.architecture-scheme .ecosystem .core b,.architecture-scheme .ecosystem .app b{position:relative;z-index:1}.architecture-scheme .ecosystem .app:hover{background:radial-gradient(circle at 22% 15%,rgba(255,255,255,.98) 0 6%,rgba(235,255,252,.7) 13%,transparent 35%),radial-gradient(ellipse at 72% 78%,rgba(0,28,49,.36),transparent 67%),radial-gradient(circle at 48% 48%,color-mix(in srgb,var(--app-glass) 94%,white) 0 28%,color-mix(in srgb,var(--app-glass) 86%,#0d6c76) 66%,color-mix(in srgb,var(--app-glass) 66%,#063047) 100%)!important;filter:brightness(1.18) saturate(1.12);box-shadow:inset 5px 6px 10px rgba(255,255,255,.34),inset -8px -9px 14px rgba(0,23,39,.22),0 0 0 10px color-mix(in srgb,var(--app-glass) 25%,transparent),0 0 36px color-mix(in srgb,var(--app-glass) 94%,transparent)!important}
.architecture-scheme .ecosystem .core b,.architecture-scheme .ecosystem .app b,.architecture-scheme .ecosystem .app:hover b{color:#fff!important}
/* On mobile, keep the ecosystem airy by scaling the opaque core and satellites down. */
@media(max-width:700px){.architecture-scheme .ecosystem .core{width:120px;height:120px}.architecture-scheme .ecosystem .app{width:52px;height:52px}.architecture-scheme .ecosystem .app b{font-size:10px}.architecture-scheme .ecosystem .core b{font-size:23px}}

/* The bodies are fully opaque: moving data is never visible through a core or satellite, only through its glow. */
.architecture-scheme .ecosystem .core{background-color:#35bbb4!important;opacity:1!important}
.architecture-scheme .ecosystem .app{background-color:var(--app-glass)!important;opacity:1!important}

/* DevOps / ALM uses the same end-of-content stage while preserving its original workflow interactions. */
.workflow-scheme .workflow-diagram{max-width:1120px;margin:0 auto;min-height:390px;border:1px solid rgba(255,255,255,.16);background:rgba(5,22,37,.3);overflow:visible}
@media(max-width:700px){.workflow-scheme .workflow-diagram{min-height:570px}}

/* Workflow diagrams: restrained enterprise finish, clearer hierarchy and controlled interaction. */
.workflow-diagram{counter-reset:workflow-step;isolation:isolate;background:radial-gradient(circle at 50% 46%,rgba(104,234,215,.08),transparent 48%),linear-gradient(135deg,rgba(4,18,31,.68),rgba(15,48,67,.48))!important}
.workflow-diagram .alm-step{counter-increment:workflow-step;min-height:132px;padding:30px 30px 24px;background:linear-gradient(145deg,rgba(17,52,72,.98),rgba(7,27,44,.98));border-color:rgba(104,234,215,.34);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 28px rgba(0,0,0,.2);transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .24s ease,background .24s ease,box-shadow .24s ease}
.workflow-diagram .alm-step:before{content:"0" counter(workflow-step);position:absolute;left:28px;top:15px;color:rgba(104,234,215,.68);font:500 10px/1 "DM Mono",monospace;letter-spacing:.12em}
.workflow-diagram .alm-step b{font-size:17px;letter-spacing:-.025em}.workflow-diagram .alm-step small{margin-top:8px;font-size:11px;line-height:1.45}
.workflow-diagram:has(.alm-step:hover) .alm-step:not(:hover),.workflow-diagram:has(.alm-step.is-intro-active) .alm-step:not(.is-intro-active){transform:scale(.88);opacity:.48}
.workflow-diagram .alm-step:hover,.workflow-diagram .alm-step.is-intro-active{z-index:6;transform:scale(1.18);background:linear-gradient(145deg,#76eadb,#4dc8c2);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 0 0 7px rgba(104,234,215,.1),0 22px 44px rgba(0,0,0,.32)}
.workflow-diagram .alm-step:hover:before,.workflow-diagram .alm-step.is-intro-active:before{color:rgba(7,21,37,.6)}
.workflow-diagram .alm-step:hover b,.workflow-diagram .alm-step.is-intro-active b{color:var(--ink)}
@media(max-width:700px){.workflow-diagram .alm-step{min-height:82px;padding:22px 24px 15px}.workflow-diagram .alm-step:before{left:18px;top:10px;font-size:8px}.workflow-diagram .alm-step:hover,.workflow-diagram .alm-step.is-intro-active{transform:scale(1.1)}.workflow-diagram:has(.alm-step:hover) .alm-step:not(:hover),.workflow-diagram:has(.alm-step.is-intro-active) .alm-step:not(.is-intro-active){transform:scale(.93);opacity:.56}}

/* Architecture ecosystem: restrained enterprise treatment, with movement kept secondary to the information. */
.architecture-scheme:not(.agentic-scheme){background:linear-gradient(135deg,#081827,#102d3f)}
.architecture-scheme:not(.agentic-scheme) .ecosystem{background:linear-gradient(145deg,rgba(8,27,43,.9),rgba(12,43,59,.72));border-color:rgba(162,194,205,.15)}
.architecture-scheme:not(.agentic-scheme) .ecosystem .core{background-color:#2b9f9b!important;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.52) 0 5%,rgba(255,255,255,.12) 15%,transparent 30%),linear-gradient(145deg,#55c6bd,#237a82)!important;box-shadow:inset 7px 8px 13px rgba(255,255,255,.14),inset -10px -11px 16px rgba(0,35,52,.32),0 0 0 10px rgba(104,234,215,.08),0 0 32px rgba(104,234,215,.25)!important}
.architecture-scheme:not(.agentic-scheme) .ecosystem .core:before,.architecture-scheme:not(.agentic-scheme) .ecosystem .app:before{background:linear-gradient(145deg,rgba(255,255,255,.09),transparent 42%,rgba(0,25,47,.16))}
.architecture-scheme:not(.agentic-scheme) .ecosystem .app{background-color:color-mix(in srgb,var(--app-glass) 42%,#17384b)!important;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.46) 0 5%,rgba(255,255,255,.1) 15%,transparent 30%),linear-gradient(145deg,color-mix(in srgb,var(--app-glass) 54%,#496476),color-mix(in srgb,var(--app-glass) 25%,#0b2233))!important;box-shadow:inset 4px 5px 8px rgba(255,255,255,.12),inset -6px -7px 11px rgba(0,23,39,.28),0 0 0 5px color-mix(in srgb,var(--app-glass) 9%,transparent),0 0 17px color-mix(in srgb,var(--app-glass) 32%,transparent)!important;filter:saturate(.78)}
.architecture-scheme:not(.agentic-scheme) .ecosystem .app:hover{background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.58) 0 5%,rgba(255,255,255,.14) 15%,transparent 31%),linear-gradient(145deg,color-mix(in srgb,var(--app-glass) 62%,#587184),color-mix(in srgb,var(--app-glass) 31%,#102b3e))!important;filter:brightness(1.07) saturate(.88);box-shadow:inset 4px 5px 8px rgba(255,255,255,.17),inset -6px -7px 11px rgba(0,23,39,.24),0 0 0 6px color-mix(in srgb,var(--app-glass) 11%,transparent),0 0 22px color-mix(in srgb,var(--app-glass) 42%,transparent)!important}
.architecture-scheme:not(.agentic-scheme) .data-particles span{width:4px;height:4px;background:#819d43;box-shadow:0 0 6px rgba(129,157,67,.6)}
.architecture-scheme:not(.agentic-scheme) .data-particles span:nth-child(3n){background:#328d87;box-shadow:0 0 6px rgba(50,141,135,.62)}
.architecture-scheme:not(.agentic-scheme) .architecture-tooltip{padding:14px 16px;border:1px solid rgba(162,194,205,.22);background:rgba(6,22,36,.96);color:#e7eff2;font-size:12px;line-height:1.55;box-shadow:0 16px 32px rgba(0,0,0,.28)}

/* Agentic ecosystem mirrors the restrained Architecture treatment. */
.architecture-scheme.agentic-scheme{background:linear-gradient(135deg,#081827,#102d3f)}
.architecture-scheme.agentic-scheme .ecosystem{background:linear-gradient(145deg,rgba(8,27,43,.9),rgba(12,43,59,.72));border-color:rgba(162,194,205,.15)}
.architecture-scheme.agentic-scheme .ecosystem .core{background-color:#2b9f9b!important;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.52) 0 5%,rgba(255,255,255,.12) 15%,transparent 30%),linear-gradient(145deg,#55c6bd,#237a82)!important;box-shadow:inset 7px 8px 13px rgba(255,255,255,.14),inset -10px -11px 16px rgba(0,35,52,.32),0 0 0 10px rgba(104,234,215,.08),0 0 32px rgba(104,234,215,.25)!important}
.architecture-scheme.agentic-scheme .ecosystem .core:before,.architecture-scheme.agentic-scheme .ecosystem .app:before{background:linear-gradient(145deg,rgba(255,255,255,.09),transparent 42%,rgba(0,25,47,.16))}
.architecture-scheme.agentic-scheme .ecosystem .app{background-color:color-mix(in srgb,var(--app-glass) 42%,#17384b)!important;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.46) 0 5%,rgba(255,255,255,.1) 15%,transparent 30%),linear-gradient(145deg,color-mix(in srgb,var(--app-glass) 54%,#496476),color-mix(in srgb,var(--app-glass) 25%,#0b2233))!important;box-shadow:inset 4px 5px 8px rgba(255,255,255,.12),inset -6px -7px 11px rgba(0,23,39,.28),0 0 0 5px color-mix(in srgb,var(--app-glass) 9%,transparent),0 0 17px color-mix(in srgb,var(--app-glass) 32%,transparent)!important;filter:saturate(.78)}
.architecture-scheme.agentic-scheme .ecosystem .app:hover{background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.58) 0 5%,rgba(255,255,255,.14) 15%,transparent 31%),linear-gradient(145deg,color-mix(in srgb,var(--app-glass) 62%,#587184),color-mix(in srgb,var(--app-glass) 31%,#102b3e))!important;filter:brightness(1.07) saturate(.88);box-shadow:inset 4px 5px 8px rgba(255,255,255,.17),inset -6px -7px 11px rgba(0,23,39,.24),0 0 0 6px color-mix(in srgb,var(--app-glass) 11%,transparent),0 0 22px color-mix(in srgb,var(--app-glass) 42%,transparent)!important}
.architecture-scheme.agentic-scheme .data-particles span{width:4px;height:4px;background:#819d43;box-shadow:0 0 6px rgba(129,157,67,.6)}
.architecture-scheme.agentic-scheme .data-particles span:nth-child(even){background:#328d87;box-shadow:0 0 6px rgba(50,141,135,.62)}
.architecture-scheme.agentic-scheme .architecture-tooltip{padding:14px 16px;border:1px solid rgba(162,194,205,.22);background:rgba(6,22,36,.96);color:#e7eff2;font-size:12px;line-height:1.55;box-shadow:0 16px 32px rgba(0,0,0,.28)}

/* Real architecture proof — Salesforce to D365 F&O. */
.integration-hero-diagram{min-height:310px;padding:34px;background:linear-gradient(135deg,#071525,#10384c);color:#fff;box-shadow:0 32px 70px rgba(7,21,37,.28)}
.integration-flow{display:grid;grid-template-columns:minmax(135px,1fr) 82px minmax(135px,1fr) 82px minmax(135px,1fr) 82px minmax(135px,1fr);align-items:center;gap:10px}
.integration-node{position:relative;min-height:152px;padding:22px 18px;border:1px solid rgba(104,234,215,.34);background:rgba(7,21,37,.74);display:flex;flex-direction:column;justify-content:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.integration-node:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--aqua)}
.integration-node span,.integration-foundation span,.tradeoff-grid span,.operations-grid>article>span{color:var(--aqua);font:500 9px "DM Mono",monospace;letter-spacing:.9px}
.integration-node strong{display:block;margin:13px 0 7px;font-size:21px;letter-spacing:-.045em}
.integration-node small{color:#b9cbd3;font-size:11px;line-height:1.5}
.integration-node.d365-node:before{background:var(--lime)}.integration-node.d365-node strong{color:var(--lime)}
.integration-link{text-align:center;color:var(--lime)}.integration-link b{display:block;font-size:25px}.integration-link small{display:block;margin-top:7px;color:#9eb0ba;font:500 8px/1.4 "DM Mono",monospace}
.integration-foundation{display:grid;grid-template-columns:.42fr 1fr .8fr;gap:24px;align-items:center;margin-top:28px;padding:17px 20px;border-top:1px solid rgba(255,255,255,.18);background:rgba(104,234,215,.06)}
.integration-foundation b{font-size:12px}.integration-foundation small{color:#aebdc5;font-size:10px;text-align:right}
.integration-proof-main{padding-top:235px}
.proof-section{margin-top:105px}.proof-heading{display:grid;grid-template-columns:minmax(0,1fr) .45fr;gap:8vw;align-items:end;margin-bottom:42px}.proof-heading h2,.proof-conclusion h2{max-width:760px;margin:12px 0 0;font-size:clamp(35px,4.3vw,61px);line-height:.98;letter-spacing:-.065em}.proof-heading>p{margin:0;color:#526676;font-size:15px;line-height:1.75}.proof-index{color:#087c88;font:500 10px "DM Mono",monospace;letter-spacing:1px}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(7,21,37,.16);border:1px solid rgba(7,21,37,.16)}.proof-grid article{min-height:185px;padding:25px;background:#eef1ed}.proof-grid b{font-size:20px;letter-spacing:-.04em}.proof-grid p{margin:35px 0 0;color:#536674;font-size:13px;line-height:1.65}
.proof-section-dark{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:100px max(7vw,calc((100vw - 1320px)/2 + 7vw));background:#0e2c3e;color:#fff}.proof-section-dark .proof-index{color:var(--aqua)}.proof-section-dark .proof-heading>p{color:#b8c9d0}
.decision-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16)}.decision-timeline article{min-height:230px;padding:23px;background:#0a2233}.decision-timeline article>span{color:var(--lime);font:500 11px "DM Mono",monospace}.decision-timeline h3{margin:60px 0 10px;font-size:21px}.decision-timeline p{margin:0;color:#b8c9d0;font-size:12px;line-height:1.65}
.tradeoff-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.tradeoff-grid article{padding:29px;background:#e6e8e2;border-top:3px solid #96a9ad}.tradeoff-grid .chosen-path{background:#d8eef3;border-color:var(--aqua)}.tradeoff-grid ul{margin:25px 0 0;padding:0;list-style:none}.tradeoff-grid li{padding:11px 0;border-top:1px solid rgba(7,21,37,.13);color:#425464;font-size:14px}.tradeoff-grid li:before{content:"— ";color:#087c88}.tradeoff-statement{margin-top:18px;padding:34px;background:var(--lime)}.tradeoff-statement small{font:500 9px "DM Mono",monospace;letter-spacing:1px}.tradeoff-statement strong{display:block;max-width:900px;margin:16px 0 10px;font-size:clamp(26px,3vw,42px);line-height:1.06;letter-spacing:-.055em}.tradeoff-statement p{max-width:850px;margin:0;color:#294023;font-size:14px;line-height:1.7}
.operations-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(7,21,37,.16);border:1px solid rgba(7,21,37,.16)}.operations-grid article{min-height:280px;padding:32px;background:#f0eee8}.operations-grid h3{margin:54px 0 12px;font-size:25px;letter-spacing:-.05em}.operations-grid p{color:#4d6170;font-size:14px;line-height:1.75}.operations-grid small{display:block;margin-top:25px;padding-top:18px;border-top:1px solid rgba(7,21,37,.14);color:#087c88;font-size:11px;line-height:1.55}
.proof-conclusion{margin:105px 0 0;padding:68px;background:#0e2c3e;color:#fff}.proof-conclusion .proof-index{color:var(--aqua)}.proof-conclusion h2 em{font:400 1em Georgia,serif;color:var(--lime)}.proof-conclusion p{max-width:880px;margin:28px 0 0;color:#c1d0d6;font-size:17px;line-height:1.8}
@media(max-width:980px){.integration-flow{grid-template-columns:minmax(100px,1fr) 34px minmax(100px,1fr) 34px minmax(100px,1fr) 34px minmax(100px,1fr);gap:5px}.integration-node{min-height:132px;padding:18px 12px}.integration-node strong{font-size:17px}.integration-link small{font-size:7px}.decision-timeline{grid-template-columns:repeat(3,1fr)}.decision-timeline article{min-height:205px}}
@media(max-width:700px){.integration-hero-diagram{padding:18px;min-height:0}.integration-flow{grid-template-columns:1fr}.integration-link b{transform:rotate(90deg)}.integration-link small{margin:0}.integration-node{min-height:105px}.integration-foundation{grid-template-columns:1fr;gap:8px}.integration-foundation small{text-align:left}.integration-proof-main{padding-top:155px}.proof-heading{grid-template-columns:1fr;gap:20px}.proof-grid,.decision-timeline,.tradeoff-grid,.operations-grid{grid-template-columns:1fr}.proof-grid article,.decision-timeline article{min-height:0}.proof-grid p{margin-top:20px}.decision-timeline h3{margin-top:28px}.proof-section-dark{padding:75px 6vw}.proof-conclusion{padding:38px 25px}.proof-section{margin-top:75px}}
