/* The diagram scales within its own column, including its labels and hub. */
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.hero-visual.ecosystem{container-type:inline-size;width:100%;max-height:none;aspect-ratio:1.04;min-width:0}
.ecosystem .visual-caption{left:4.5%;right:4.5%;top:3.5%;font-size:clamp(6px,1.5cqw,9px);align-items:center;gap:12px;z-index:2}
.ecosystem-controls{display:flex;align-items:center;gap:12px}
.ecosystem .connection-orbit{top:48%;pointer-events:none}
.ecosystem .center-brand{top:48%;width:42%;gap:clamp(9px,3cqw,18px);border-radius:clamp(8px,2cqw,12px)}
.ecosystem .center-brand>span{font-size:clamp(5px,1.2cqw,7px)}
.hero-visual.ecosystem .orbit-label{left:var(--node-x);top:var(--node-y);right:auto;transform:translate(-50%,-50%);font-size:clamp(8px,1.85cqw,11px);padding:clamp(9px,2.2cqw,13px) clamp(7px,2cqw,12px);gap:clamp(5px,1.5cqw,9px);max-width:45%}
.ecosystem .orbit-label b{font-size:clamp(7px,1.5cqw,9px)}
.ecosystem .node-one{--node-x:20%;--node-y:24%}.ecosystem .node-two{--node-x:80%;--node-y:24%}
.ecosystem .node-three{--node-x:81%;--node-y:66%}.ecosystem .node-four{--node-x:50%;--node-y:81%}.ecosystem .node-five{--node-x:19%;--node-y:66%}
.hero-visual.ecosystem .visual-bottom{bottom:4%;font-size:clamp(6px,1.5cqw,9px);gap:7px}
.ecosystem .connection-lines{stroke:#b8efd78c;stroke-width:1;pointer-events:none}
.hero-visual.ecosystem .connection-lines path{stroke-dasharray:6 8}
.motion-toggle{display:inline-grid;place-items:center;flex-shrink:0;width:30px;height:30px;padding:6px;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;opacity:.65}
.motion-toggle[hidden]{display:none}.motion-toggle:hover,.motion-toggle:focus-visible{opacity:1}
.motion-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5;display:block}
.motion-toggle .motion-play{display:none}
.motion-toggle[aria-pressed="true"] .motion-play{display:block}.motion-toggle[aria-pressed="true"] .motion-pause{display:none}

/* One continuous strip; the second group is visual only, never read twice. */
.clients-section{padding:24px 0 28px;background:#fff;border-block:1px solid var(--line)}
.clients-strip-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;color:var(--green)}
.clients-strip-heading h2{font-size:10px;letter-spacing:.13em;font-weight:700;line-height:1.5;margin:0;text-transform:uppercase}
.clients-window{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c5d1ca transparent}
.clients-track{display:flex;width:max-content}
.client-logos{list-style:none;display:flex;flex:none;align-items:center;gap:42px;margin:0;padding:0 42px 0 0}
.client-logos li{display:flex;flex:0 0 158px;width:158px;height:72px;min-height:0;align-items:center;justify-content:center;border:0;padding:10px 0}
.client-logos img{max-width:150px;max-height:46px;width:auto;height:auto;object-fit:contain;opacity:.9}
.client-logos[aria-hidden="true"]{display:none}
.clients-section[data-motion-ready="true"] .clients-window{overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent)}
.clients-section[data-motion-ready="true"] .client-logos[aria-hidden="true"]{display:flex}
@media(max-width:650px){.hero-grid{grid-template-columns:minmax(0,1fr)}.clients-section{padding:20px 0 23px}.client-logos{gap:28px;padding-right:28px}.client-logos li{flex-basis:130px;width:130px;height:64px}.client-logos img{max-width:124px;max-height:40px}}
@media(prefers-reduced-motion:no-preference){
  .hero-visual.ecosystem .connection-lines path{animation:ecosystem-flow 2s linear infinite;animation-play-state:paused}
  .ecosystem[data-moving="true"] .connection-lines path{animation-play-state:running}
  .clients-section[data-motion-ready="true"] .clients-track{animation:clients-flow 45s linear infinite;animation-play-state:paused}
  .clients-section[data-moving="true"] .clients-track{animation-play-state:running}
  @keyframes ecosystem-flow{to{stroke-dashoffset:-28}}
  @keyframes clients-flow{to{transform:translateX(-50%)}}
}
@media(hover:hover){.clients-section:hover .clients-track{animation-play-state:paused}}
@media(prefers-reduced-motion:reduce){.clients-window{mask-image:none!important;overflow-x:auto!important}.client-logos[aria-hidden="true"]{display:none!important}.motion-toggle{display:none!important}}
@media print{.clients-window{overflow:visible!important;mask-image:none!important}.clients-track{width:auto;transform:none!important}.client-logos{flex-wrap:wrap;padding:0;gap:20px}.client-logos[aria-hidden="true"],.motion-toggle{display:none!important}}