/* global React */ /* Abstract, on-brand vector illustrations for the Solutions panel. No people, no stock — pure geometric SVG tuned to the site palette. */ const SOL_C = { ink: '#0a1628', ink2: '#0f1d35', line: '#e3e7ee', blue: '#3b82f6', blue2: '#60a5fa', dim: '#1d4ed8', soft: '#dbeafe', paper: '#f7f8fa', }; // shared 480x140 band viewBox const band = { viewBox: '0 0 480 140', preserveAspectRatio: 'xMidYMid slice', width: '100%', height: '100%' }; function BandBG({ from = SOL_C.ink, to = SOL_C.ink2, id }) { return ( ); } const SolVisuals = { // Managed IT — network of nodes / named pod managed: () => ( {[[110,40],[200,90],[300,42],[380,96],[240,32],[150,104]].map((p,i)=>( ))} {[[110,40],[200,90],[300,42],[380,96],[150,104]].map((p,i)=>( ))} ), // Intune — device enrolment / shield over laptop intune: () => ( {[130,240,350].map((cx,i)=>( ))} ), // Cloud & M365 — cloud + orbiting service tiles cloud: () => ( {[[120,50],[360,52],[130,104],[352,100]].map((p,i)=>( ))} {[[120,50],[360,52],[130,104],[352,100]].map((p,i)=>( ))} ), // Security — layered shield + lock security: () => ( {[46,34,22].map((s,i)=>( ))} ), // AI — neural / node graph feeding a spark ai: () => ( {(() => { const L=[ [110,44],[110,96] ], M=[ [200,32],[200,70],[200,108] ], R=[ [290,44],[290,96] ]; const lines=[]; L.forEach((a,i)=>M.forEach((b,j)=>lines.push())); M.forEach((a,i)=>R.forEach((b,j)=>lines.push())); R.forEach((a,i)=>lines.push()); const dots=[...L,...M,...R].map((p,i)=>); return [...lines,...dots]; })()} ), }; function SolVisual({ id }) { const V = SolVisuals[id] || SolVisuals.managed; return ; } Object.assign(window, { SolVisual, SolVisuals });