<svg width="920" height="460" viewBox="0 0 920 460" xmlns="http://www.w3.org/2000/svg" font-family="'Segoe UI', system-ui, sans-serif">

  <defs>
    <marker id="arrowTeal" markerWidth="8" markerHeight="8" refX="6" refY="3" orient="auto">
      <path d="M0,0 L0,6 L8,3 z" fill="#38bdf8"/>
    </marker>
    <filter id="glow" x="-20%" y="-40%" width="140%" height="180%">
      <feGaussianBlur stdDeviation="3" result="blur"/>
      <feMerge><feMergeNode in="blur"/><feMergeNode in="SourceGraphic"/></feMerge>
    </filter>
  </defs>

  <!-- Background -->
  <rect width="920" height="460" fill="#0d1320"/>

  <!-- ─── TITLE BAR ─── -->
  <rect x="16" y="14" width="888" height="36" fill="#0a1f2e" rx="6"/>
  <text x="460" y="37" text-anchor="middle" font-size="12" font-weight="700" fill="#38bdf8" letter-spacing="1.4">THE PIECE THAT CHANGED EVERYTHING — CAMUNDA 8.9 MCP GATEWAY</text>

  <!-- ─── LAYER 1: AI AGENTS ─── -->
  <text x="28" y="72" font-size="9" font-weight="700" fill="#64748b" letter-spacing="1.2">AI AGENTS</text>

  <!-- Agent 1 -->
  <rect x="16" y="78" width="180" height="44" fill="#1a2540" rx="7" stroke="#0ea5e9" stroke-width="1.5"/>
  <text x="106" y="97" text-anchor="middle" font-size="12" font-weight="600" fill="#e2e8f0">AI Agent</text>
  <text x="106" y="113" text-anchor="middle" font-size="10" fill="#94a3b8">LLM · reasoning · tools</text>

  <!-- Agent 2 -->
  <rect x="220" y="78" width="180" height="44" fill="#1a2540" rx="7" stroke="#0ea5e9" stroke-width="1.5"/>
  <text x="310" y="97" text-anchor="middle" font-size="12" font-weight="600" fill="#e2e8f0">AI Agent</text>
  <text x="310" y="113" text-anchor="middle" font-size="10" fill="#94a3b8">LLM · reasoning · tools</text>

  <!-- Agent 3 -->
  <rect x="424" y="78" width="180" height="44" fill="#1a2540" rx="7" stroke="#0ea5e9" stroke-width="1.5"/>
  <text x="514" y="97" text-anchor="middle" font-size="12" font-weight="600" fill="#e2e8f0">AI Agent</text>
  <text x="514" y="113" text-anchor="middle" font-size="10" fill="#94a3b8">LLM · reasoning · tools</text>

  <!-- "any LLM-native agent" label -->
  <text x="626" y="104" font-size="10" fill="#475569" font-style="italic">any LLM-native agent</text>

  <!-- MCP protocol labels + dashed arrows → gateway -->
  <text x="106" y="140" text-anchor="middle" font-size="9" fill="#0ea5e9" letter-spacing="0.8">MCP</text>
  <text x="310" y="140" text-anchor="middle" font-size="9" fill="#0ea5e9" letter-spacing="0.8">MCP</text>
  <text x="514" y="140" text-anchor="middle" font-size="9" fill="#0ea5e9" letter-spacing="0.8">MCP</text>

  <line x1="106" y1="122" x2="106" y2="154" stroke="#0ea5e9" stroke-width="1.5" stroke-dasharray="3,2" marker-end="url(#arrowTeal)"/>
  <line x1="310" y1="122" x2="310" y2="154" stroke="#0ea5e9" stroke-width="1.5" stroke-dasharray="3,2" marker-end="url(#arrowTeal)"/>
  <line x1="514" y1="122" x2="514" y2="154" stroke="#0ea5e9" stroke-width="1.5" stroke-dasharray="3,2" marker-end="url(#arrowTeal)"/>

  <!-- ─── LAYER 2: MCP GATEWAY (hero element) ─── -->
  <!-- Outer glow -->
  <rect x="14" y="158" width="668" height="56" fill="none" rx="9" stroke="#38bdf8" stroke-width="8" opacity="0.10"/>
  <!-- Main gateway box -->
  <rect x="14" y="158" width="668" height="56" fill="#0a1f2e" rx="9" stroke="#38bdf8" stroke-width="2"/>
  <text x="348" y="182" text-anchor="middle" font-size="14" font-weight="700" fill="#38bdf8" filter="url(#glow)">Camunda 8 MCP Gateway</text>
  <text x="348" y="202" text-anchor="middle" font-size="11" fill="#7dd3fc">query · claim · complete · signal · interrogate ownership</text>

  <!-- Arrow: gateway → process engine -->
  <line x1="348" y1="214" x2="348" y2="244" stroke="#38bdf8" stroke-width="2" marker-end="url(#arrowTeal)"/>
  <text x="358" y="232" font-size="9" fill="#475569" font-style="italic">Camunda Process API</text>

  <!-- ─── LAYER 3: PROCESS ENGINE ─── -->
  <rect x="14" y="248" width="668" height="138" fill="#0a1628" rx="8" stroke="#1e3a5f" stroke-width="1.5"/>
  <text x="30" y="268" font-size="9" font-weight="700" fill="#64748b" letter-spacing="1.2">CAMUNDA PROCESS ENGINE</text>

  <!-- Work Record A -->
  <rect x="36" y="276" width="186" height="96" fill="#0f172a" rx="6" stroke="#4ade80" stroke-width="1.5"/>
  <text x="129" y="296" text-anchor="middle" font-size="11" font-weight="600" fill="#e2e8f0">Work Record A</text>
  <text x="129" y="312" text-anchor="middle" font-size="10" fill="#4ade80">State · Open</text>
  <text x="129" y="328" text-anchor="middle" font-size="10" fill="#94a3b8">Actions: [claim, review]</text>
  <text x="129" y="344" text-anchor="middle" font-size="10" fill="#94a3b8">Owner: assigned</text>
  <text x="129" y="360" text-anchor="middle" font-size="10" fill="#8b9db5">Policies: enforced</text>

  <!-- Work Record B -->
  <rect x="248" y="276" width="186" height="96" fill="#0f172a" rx="6" stroke="#4ade80" stroke-width="1.5"/>
  <text x="341" y="296" text-anchor="middle" font-size="11" font-weight="600" fill="#e2e8f0">Work Record B</text>
  <text x="341" y="312" text-anchor="middle" font-size="10" fill="#4ade80">State · In Review</text>
  <text x="341" y="328" text-anchor="middle" font-size="10" fill="#94a3b8">Actions: [approve, signal]</text>
  <text x="341" y="344" text-anchor="middle" font-size="10" fill="#94a3b8">Owner: assigned</text>
  <text x="341" y="360" text-anchor="middle" font-size="10" fill="#8b9db5">Policies: enforced</text>

  <!-- Work Record C -->
  <rect x="460" y="276" width="186" height="96" fill="#0f172a" rx="6" stroke="#4ade80" stroke-width="1.5"/>
  <text x="553" y="296" text-anchor="middle" font-size="11" font-weight="600" fill="#e2e8f0">Work Record C</text>
  <text x="553" y="312" text-anchor="middle" font-size="10" fill="#4ade80">State · Pending</text>
  <text x="553" y="328" text-anchor="middle" font-size="10" fill="#94a3b8">Actions: [escalate]</text>
  <text x="553" y="344" text-anchor="middle" font-size="10" fill="#94a3b8">Owner: assigned</text>
  <text x="553" y="360" text-anchor="middle" font-size="10" fill="#8b9db5">Policies: enforced</text>

  <!-- ─── RIGHT ANNOTATION PANEL ─── -->
  <rect x="700" y="58" width="204" height="334" fill="#0a1628" rx="8" stroke="#1e3a5f" stroke-width="1"/>
  <text x="802" y="80" text-anchor="middle" font-size="9" font-weight="700" fill="#38bdf8" letter-spacing="1.2">WHAT AGENTS CAN DO</text>

  <text x="714" y="102" font-size="10" fill="#38bdf8">▸</text>
  <text x="728" y="102" font-size="10" fill="#e2e8f0">Query process instances</text>

  <text x="714" y="122" font-size="10" fill="#38bdf8">▸</text>
  <text x="728" y="122" font-size="10" fill="#e2e8f0">Claim and complete tasks</text>

  <text x="714" y="142" font-size="10" fill="#38bdf8">▸</text>
  <text x="728" y="142" font-size="10" fill="#e2e8f0">Signal with new information</text>

  <text x="714" y="162" font-size="10" fill="#38bdf8">▸</text>
  <text x="728" y="162" font-size="10" fill="#e2e8f0">Interrogate ownership</text>

  <text x="714" y="182" font-size="10" fill="#38bdf8">▸</text>
  <text x="728" y="182" font-size="10" fill="#e2e8f0">No BPM knowledge</text>
  <text x="728" y="196" font-size="10" fill="#8b9db5">required underneath</text>

  <line x1="714" y1="212" x2="890" y2="212" stroke="#1e3a5f" stroke-width="1"/>

  <text x="802" y="232" text-anchor="middle" font-size="10" fill="#38bdf8" font-style="italic">Jones' integration</text>
  <text x="802" y="248" text-anchor="middle" font-size="10" fill="#38bdf8" font-style="italic">substrate —</text>
  <text x="802" y="264" text-anchor="middle" font-size="10" fill="#38bdf8" font-style="italic">implemented as</text>
  <text x="802" y="280" text-anchor="middle" font-size="10" fill="#38bdf8" font-style="italic">a protocol.</text>

  <line x1="714" y1="296" x2="890" y2="296" stroke="#1e3a5f" stroke-width="1"/>

  <text x="802" y="320" text-anchor="middle" font-size="13" font-weight="700" fill="#4ade80">Shipped. 2026.</text>
  <text x="802" y="342" text-anchor="middle" font-size="10" fill="#94a3b8">Cost of attachment:</text>
  <text x="802" y="358" text-anchor="middle" font-size="11" font-weight="600" fill="#e2e8f0">very low.</text>
  <text x="802" y="378" text-anchor="middle" font-size="10" fill="#64748b" font-style="italic">"What processes</text>
  <text x="802" y="392" text-anchor="middle" font-size="10" fill="#64748b" font-style="italic">do we start with?"</text>

  <!-- Bottom caption -->
  <text x="350" y="442" text-anchor="middle" font-size="10" fill="#475569" font-style="italic">The infrastructure question is no longer "how do we build this?" — it's "what processes do we start with?"</text>

</svg>
