/* Each industry gets a different dependency topology with the same visual language. */
.sector-visual{margin:0;background:#123746;border:1px solid #416371;border-radius:12px;padding:24px clamp(16px,2vw,28px) 12px;min-width:0}
.visual-topline{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:16px}
.visual-kicker{font-size:10px;letter-spacing:1.3px;color:var(--mint);font-weight:600}
.visual-example{font-size:10px;color:#bdd0d1}
.sector-visual figcaption{font-size:clamp(21px,2vw,27px);font-weight:500;line-height:1.35;color:#fff;text-wrap:balance}
.sector-diagram{display:block;width:100%;height:auto;margin:24px 0 0;overflow:visible;font-family:Arial,Helvetica,sans-serif}
.diagram-node rect{fill:#193f4e;stroke:#628678;stroke-width:1.4}
.diagram-node .node-title{fill:#eef7f1;font-size:21px;font-weight:500}
.diagram-node .node-detail{fill:#bfd2d1;font-size:15px}
.diagram-hub rect{fill:#d0ecdd;stroke:#a9d5bd}
.diagram-hub .node-title{fill:#133b32}
.diagram-hub .node-detail{fill:#3b5f50}
.diagram-attention rect{stroke:#d3ad6c}
.diagram-route{fill:none;stroke:#8fbaa4;stroke-width:1.5;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;color:#8fbaa4}
.diagram-feedback{opacity:.65}
.diagram-center-note{fill:#a8c1be;font-size:11px;letter-spacing:1px}
.diagram-node .chip-outline{fill:none;stroke:#2d634e}
.chip-pins{fill:none;stroke:#2d634e;stroke-width:1.4}
.diagram-node .assembly-mark rect{fill:none;stroke:#386d58;stroke-width:1.3}
.diagram-gate>path{fill:#263f42;stroke:#d2ad6f;stroke-width:1.4}
.diagram-gate .node-title{fill:#f6e1b6}
.sector-visual .sector-visual-note{margin:0;padding-top:17px;border-top:1px solid #3e6270;font-size:12px;line-height:1.65;color:#c1d1d5}

/* Gentle continuous movement; connections and labels stay visible at all times. */
.diagram-route{stroke-dasharray:none;stroke-dashoffset:0}
.diagram-flow{display:none;fill:none;stroke:#d5f7e3;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:.18 .82;stroke-dashoffset:1;pointer-events:none}
.sector-visual{position:relative;padding-bottom:24px}
.sector-visual .sector-visual-note{padding-right:48px}
.motion-toggle{position:absolute;right:14px;bottom:15px;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:#b7e7d1;cursor:pointer}
.motion-toggle:hover{background:#244c59}
.motion-toggle[hidden]{display:none}
.motion-toggle svg{width:17px;height:17px;fill:currentColor}
.motion-toggle .motion-play{display:none}
.motion-toggle[aria-pressed="true"] .motion-play{display:block}
.motion-toggle[aria-pressed="true"] .motion-pause{display:none}
@media(prefers-reduced-motion:no-preference){
 .is-motion-ready .diagram-flow{display:block;animation:diagram-flow 3.6s linear infinite;animation-delay:calc(var(--step,0)*-.3s)}
 .is-motion-ready .diagram-node>rect,.is-motion-ready .diagram-gate>path{animation:diagram-accent 4.8s ease-in-out infinite;animation-delay:calc(var(--step,0)*-.45s)}
 .motion-paused *{animation-play-state:paused!important}
}
@keyframes diagram-flow{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes diagram-accent{0%,100%{stroke-width:1.4;stroke-opacity:.75}50%{stroke-width:2.2;stroke-opacity:1}}
@media(max-width:820px){.sector-visual{max-width:580px;width:100%}}
@media(max-width:520px){.sector-visual{padding:20px 14px 24px}.sector-visual figcaption{font-size:23px}.sector-diagram{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.motion-figure *{animation:none!important}.diagram-flow,.motion-toggle{display:none}.sector-visual .sector-visual-note{padding-right:0}}
@media print{.motion-toggle,.diagram-flow{display:none}.motion-figure *{animation:none!important}}
