diff --git a/astro.config.mjs b/astro.config.mjs
index 2592aa5..d677740 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -6,6 +6,9 @@ export default defineConfig({
   integrations: [tailwind(), sitemap()],
   site: 'https://barbacane.dev',
   trailingSlash: 'always',
+  redirects: {
+    '/mcp/': '/ai/',
+  },
   markdown: {
     shikiConfig: {
       themes: {
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 0d464e0..e327dc9 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -15,7 +15,7 @@ interface Props {
 
 const {
   title,
-  description = "Barbacane - The spec-driven API gateway built in Rust. Your OpenAPI and AsyncAPI specs become your gateway configuration.",
+  description = "Barbacane is the open-source AI gateway, both directions. Route LLM calls through OpenAI, Anthropic, or Ollama outbound. Expose your APIs to AI agents as typed MCP tools inbound. Rust-native, spec-first, composed from dispatchers and middlewares.",
   type = 'website',
   article,
   ogImage: customOgImage,
@@ -134,8 +134,9 @@ const structuredData = type === 'article' && article
 
           <!-- Desktop navigation -->
           <div class="hidden md:flex items-center gap-8">
-            <a href="/#features" class="text-foreground-muted hover:text-primary transition-colors">Features</a>
-            <a href="/#use-cases" class="text-foreground-muted hover:text-primary transition-colors">Use Cases</a>
+            <a href="/ai/" class="text-foreground-muted hover:text-primary transition-colors">AI teams</a>
+            <a href="/platform/" class="text-foreground-muted hover:text-primary transition-colors">Platform teams</a>
+            <a href="https://docs.barbacane.dev" class="text-foreground-muted hover:text-primary transition-colors">Docs</a>
             <a href="/blog/" class="text-foreground-muted hover:text-primary transition-colors">Blog</a>
             <div class="relative group">
               <button class="text-foreground-muted hover:text-primary transition-colors flex items-center gap-1">
@@ -153,8 +154,7 @@ const structuredData = type === 'article' && article
           <!-- Desktop actions -->
           <div class="hidden md:flex items-center gap-4">
             <ThemeToggle />
-            <a href="https://docs.barbacane.dev" class="btn-secondary">Documentation</a>
-            <a href="/#get-started" class="btn-primary">Get Started</a>
+            <a href="/#get-started" class="btn-primary">Get started</a>
           </div>
 
           <!-- Mobile: burger button -->
@@ -179,14 +179,14 @@ const structuredData = type === 'article' && article
       <!-- Mobile menu -->
       <div id="mobile-menu" class="hidden md:hidden border-t border-themed">
         <div class="container-custom py-4 space-y-4">
-          <a href="/#features" class="block text-foreground-muted hover:text-primary transition-colors py-2">Features</a>
-          <a href="/#use-cases" class="block text-foreground-muted hover:text-primary transition-colors py-2">Use Cases</a>
+          <a href="/ai/" class="block text-foreground-muted hover:text-primary transition-colors py-2">AI teams</a>
+          <a href="/platform/" class="block text-foreground-muted hover:text-primary transition-colors py-2">Platform teams</a>
+          <a href="https://docs.barbacane.dev" class="block text-foreground-muted hover:text-primary transition-colors py-2">Docs</a>
           <a href="/blog/" class="block text-foreground-muted hover:text-primary transition-colors py-2">Blog</a>
           <a href="/pricing/" class="block text-foreground-muted hover:text-primary transition-colors py-2">Licensing</a>
           <a href="/pricing/#services" class="block text-foreground-muted hover:text-primary transition-colors py-2">Services</a>
           <a href="https://github.com/barbacane-dev/barbacane" target="_blank" rel="noopener" class="block text-foreground-muted hover:text-primary transition-colors py-2">GitHub</a>
-          <a href="https://docs.barbacane.dev" class="block text-foreground-muted hover:text-primary transition-colors py-2">Documentation</a>
-          <a href="/#get-started" class="block text-foreground-muted hover:text-primary transition-colors py-2">Get Started</a>
+          <a href="/#get-started" class="block text-foreground-muted hover:text-primary transition-colors py-2">Get started</a>
           <button class="theme-toggle w-full flex items-center justify-between py-2 text-foreground-muted hover:text-primary transition-colors">
             <span>Theme</span>
             <svg class="theme-sun-icon w-5 h-5 hidden" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -237,14 +237,16 @@ const structuredData = type === 'article' && article
               <span class="font-bold text-xl text-gradient">Barbacane</span>
             </a>
             <p class="text-foreground-muted max-w-md">
-              The spec-driven API gateway built in Rust. Your OpenAPI and AsyncAPI specs become your gateway configuration.
+              The open-source AI gateway, both directions. Route LLM calls outbound,
+              expose your APIs to agents inbound. Rust-native, spec-first, AGPLv3.
             </p>
           </div>
 
           <div>
             <h4 class="font-semibold mb-4">Product</h4>
             <ul class="space-y-2 text-foreground-muted">
-              <li><a href="/#features" class="hover:text-primary transition-colors">Features</a></li>
+              <li><a href="/ai/" class="hover:text-primary transition-colors">AI teams</a></li>
+              <li><a href="/platform/" class="hover:text-primary transition-colors">Platform teams</a></li>
               <li><a href="/blog/" class="hover:text-primary transition-colors">Blog</a></li>
               <li><a href="https://docs.barbacane.dev" class="hover:text-primary transition-colors">Documentation</a></li>
               <li><a href="https://github.com/barbacane-dev/barbacane" class="hover:text-primary transition-colors">GitHub</a></li>
diff --git a/src/pages/ai.astro b/src/pages/ai.astro
new file mode 100644
index 0000000..b4468f1
--- /dev/null
+++ b/src/pages/ai.astro
@@ -0,0 +1,605 @@
+---
+import { Code } from 'astro:components';
+import Layout from '../layouts/Layout.astro';
+
+const outboundYaml = `paths:
+  /v1/chat/completions:
+    post:
+      operationId: chatCompletion
+      summary: Route LLM chat completion requests
+      x-barbacane-dispatch:
+        name: ai-proxy
+        config:
+          provider: openai
+          model: gpt-4o
+          api_key: "\${OPENAI_API_KEY}"
+          timeout: 120
+
+          # Tried in order on 5xx / timeout
+          fallback:
+            - provider: anthropic
+              model: claude-sonnet-4-20250514
+              api_key: "\${ANTHROPIC_API_KEY}"
+            - provider: ollama
+              model: llama3
+              base_url: http://ollama:11434
+
+          # Named targets for policy-driven routing
+          targets:
+            local:
+              provider: ollama
+              model: mistral
+              base_url: http://ollama:11434
+            premium:
+              provider: anthropic
+              model: claude-opus-4-6
+              api_key: "\${ANTHROPIC_API_KEY}"
+          default_target: local
+`;
+
+const inboundYaml = `# Enable MCP for the whole API
+x-barbacane-mcp:
+  enabled: true
+  server_name: Orders API
+  server_version: 1.0.0
+
+paths:
+  /orders/{id}:
+    get:
+      operationId: getOrder
+      summary: Fetch an order by id
+      security:
+        - bearerAuth: []
+      parameters:
+        - name: id
+          in: path
+          required: true
+          schema: { type: string }
+      responses:
+        '200':
+          description: Order
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Order'
+
+  /admin/orders/purge:
+    delete:
+      operationId: purgeOrders
+      summary: Purge archived orders
+      # Hide this one from agents
+      x-barbacane-mcp:
+        enabled: false
+`;
+
+const codeThemes = { light: 'github-light', dark: 'github-dark' };
+---
+
+<Layout
+  title="AI gateway for MCP and LLMs - Barbacane"
+  description="Barbacane is the open-source AI gateway that handles both directions. Outbound: route LLM calls through OpenAI, Anthropic, or Ollama with provider fallback and policy routing. Inbound: expose your APIs to AI agents as typed MCP tools. Rust-native, spec-first, composed from dispatchers and middlewares."
+>
+  <!-- Hero -->
+  <section class="section relative overflow-hidden">
+    <div class="absolute inset-0 hero-gradient"></div>
+    <div class="container-custom relative">
+      <div class="max-w-4xl mx-auto text-center">
+        <div class="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-background-light border border-themed mb-8">
+          <span class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></span>
+          <span class="text-sm text-foreground-muted">AI gateway &middot; MCP native &middot; AGPLv3</span>
+        </div>
+
+        <h1 class="text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-extrabold mb-6 leading-tight">
+          One AI gateway,
+          <span class="text-gradient">both directions</span>
+        </h1>
+
+        <p class="text-lg sm:text-xl text-foreground-muted max-w-3xl mx-auto mb-10">
+          Barbacane is the open-source, Rust-native AI gateway that handles AI traffic on
+          the way out and on the way in. Route your application's LLM calls through OpenAI,
+          Anthropic, or Ollama with provider fallback and policy routing. Expose your
+          existing APIs to AI agents as typed MCP tools. Same gateway, same middleware,
+          same spec.
+        </p>
+
+        <div class="flex flex-col sm:flex-row gap-4 justify-center">
+          <a href="#outbound" class="btn-primary text-lg px-8 py-4">
+            See how it works
+            <svg class="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"></path>
+            </svg>
+          </a>
+          <a href="https://github.com/barbacane-dev/barbacane" target="_blank" rel="noopener" class="btn-secondary text-lg px-8 py-4">
+            <svg class="mr-2 w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+            </svg>
+            View on GitHub
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- At a glance -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            AI traffic has two directions
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Most AI gateways only handle one. Barbacane handles both, from the same spec,
+            with the same middleware chain.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-2 gap-8">
+          <a href="#outbound" class="card hover:border-primary/50 transition-colors">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
+              </svg>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">Outbound: your app calls LLMs</h3>
+            <p class="text-foreground-muted mb-4">
+              The <code class="text-primary">ai-proxy</code> dispatcher routes requests to
+              OpenAI, Anthropic, Ollama, or any OpenAI-compatible endpoint. Unified
+              OpenAI-compatible API surface, pinned provider contracts, provider fallback,
+              named targets for policy routing.
+            </p>
+            <span class="text-primary text-sm inline-flex items-center gap-1">
+              Jump to outbound
+              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
+              </svg>
+            </span>
+          </a>
+
+          <a href="#inbound" class="card hover:border-accent/50 transition-colors">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16l-4-4m0 0l4-4m-4 4h18"></path>
+              </svg>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">Inbound: agents call your APIs</h3>
+            <p class="text-foreground-muted mb-4">
+              Your OpenAPI spec compiles into an MCP tool server. Agents discover tools
+              via JSON-RPC 2.0, tool calls pass through your existing auth and rate-limit
+              middleware as regular HTTP requests. Opt-out per operation.
+            </p>
+            <span class="text-accent text-sm inline-flex items-center gap-1">
+              Jump to inbound
+              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
+              </svg>
+            </span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Outbound section -->
+  <section id="outbound" class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="mb-12">
+          <span class="text-sm font-semibold text-primary uppercase tracking-wide">Outbound</span>
+          <h2 class="text-3xl sm:text-4xl font-bold mt-2 mb-4">
+            Route your LLM calls, with <span class="text-gradient">fallback and policy</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl">
+            Clients send OpenAI-format requests. Barbacane's <code class="text-primary">ai-proxy</code>
+            dispatcher translates per provider, handles streaming where the provider
+            supports it, pins the upstream API version, and falls back to a secondary
+            provider when the primary fails.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-2 gap-8 items-start mb-12">
+          <div class="code-block-shiki rounded-lg text-sm overflow-auto">
+            <Code code={outboundYaml} lang="yaml" themes={codeThemes} />
+          </div>
+
+          <div class="space-y-6">
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Providers</h3>
+              <p class="text-foreground-muted">
+                OpenAI, Anthropic, and Ollama out of the box. Any OpenAI-compatible server
+                (vLLM, TGI, LocalAI, Azure OpenAI) works via <code class="text-primary">provider: openai</code>
+                plus a custom <code class="text-primary">base_url</code>.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Pinned contracts</h3>
+              <p class="text-foreground-muted">
+                Provider adapters are built against a pinned API version. Upstream breaking
+                changes are a conscious, tested plugin upgrade, not a silent production
+                surprise.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Policy-driven routing</h3>
+              <p class="text-foreground-muted">
+                Named targets combine with the <code class="text-primary">cel</code>
+                middleware: stack CEL rules (consumer tier, scopes, headers) that set
+                <code class="text-primary">ai.target</code> in context, and the dispatcher
+                picks the matching target. Credentials stay in dispatcher config, never
+                in context.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Observability</h3>
+              <p class="text-foreground-muted">
+                Prometheus metrics for requests per provider, latency, token usage, and
+                fallback events. OpenTelemetry spans linked to the upstream call.
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Inbound section -->
+  <section id="inbound" class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="mb-12">
+          <span class="text-sm font-semibold text-accent uppercase tracking-wide">Inbound</span>
+          <h2 class="text-3xl sm:text-4xl font-bold mt-2 mb-4">
+            Expose your APIs to agents as <span class="text-gradient">MCP tools</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl">
+            Enable MCP once at the spec root and every operation becomes an agent-callable
+            tool. Authentication, rate limits, validation, and audit logging all apply to
+            tool calls, because they are just HTTP requests in disguise.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-2 gap-8 items-start mb-12">
+          <div class="code-block-shiki rounded-lg text-sm overflow-auto">
+            <Code code={inboundYaml} lang="yaml" themes={codeThemes} />
+          </div>
+
+          <div class="space-y-6">
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Agents discover your tools</h3>
+              <p class="text-foreground-muted">
+                Barbacane exposes a JSON-RPC 2.0 MCP endpoint at
+                <code class="text-primary">/__barbacane/mcp</code>. Each operation becomes
+                a typed tool, with the name taken from <code class="text-primary">operationId</code>,
+                the description from <code class="text-primary">summary</code>, and input
+                and output schemas merged from your parameters, body, and responses.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Calls run through your middleware</h3>
+              <p class="text-foreground-muted">
+                Tool calls are HTTP requests. They pass through authentication, authorization,
+                rate limits, validation, transformations, and observability like any other
+                request. No shadow stack, no drift.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Opt out what agents should not see</h3>
+              <p class="text-foreground-muted">
+                By default every operation is a tool. Add
+                <code class="text-primary">x-barbacane-mcp: &#123; enabled: false &#125;</code>
+                to any operation you want to hide, such as admin endpoints or destructive
+                actions.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Shift-left lint</h3>
+              <p class="text-foreground-muted">
+                The <a href="https://docs.barbacane.dev/guide/vacuum.html" class="text-primary hover:underline">vacuum ruleset</a>
+                runs in your editor, pre-commit, or CI. Missing
+                <code class="text-primary">operationId</code>s and descriptions fail at
+                lint time, not at call time.
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- AI governance (shared) -->
+  <section class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            AI governance, <span class="text-gradient">both directions</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Four middlewares compose around the dispatcher, regardless of whether traffic
+            is outbound to an LLM or inbound from an agent. Named profiles, CEL expressions,
+            fail-closed on misconfiguration.
+          </p>
+        </div>
+
+        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">ai-prompt-guard</h3>
+            <p class="text-foreground-muted text-sm">
+              PII redaction, regex allow and deny lists, message count and length limits,
+              managed system-prompt templates with variable substitution. Regex is compiled
+              at lint time.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">ai-token-limit</h3>
+            <p class="text-foreground-muted text-sm">
+              Token-based sliding-window rate limiting per consumer, per model, per window.
+              Stack instances for minute-and-hour caps. Same partition keys on
+              <code class="text-primary">on_request</code> and
+              <code class="text-primary">on_response</code>.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">ai-cost-tracker</h3>
+            <p class="text-foreground-muted text-sm">
+              Per-request USD metric derived from a configurable price table. Emits the
+              <code class="text-primary">cost_dollars</code> Prometheus counter labelled
+              by provider, model, and consumer.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">ai-response-guard</h3>
+            <p class="text-foreground-muted text-sm">
+              PII regex redaction and blocked-pattern 502 rewrite on responses. Schema
+              re-validation before the response leaves the gateway. Fail-closed on
+              misconfiguration or invalid regex.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- One gateway argument -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-3xl mx-auto">
+        <h2 class="text-3xl sm:text-4xl font-bold mb-8 text-center">
+          One gateway, not three
+        </h2>
+        <p class="text-lg text-foreground-muted mb-5">
+          Most AI-gateway products specialize in one direction. The outbound specialists
+          (Portkey, LiteLLM, Cloudflare AI Gateway) are good at LLM routing and cost
+          control, and nothing else. The inbound specialists (the small but growing MCP
+          gateway category) handle agent tool calls and ignore outbound traffic. The API
+          gateways you already run (Kong, Tyk, Apigee) handle neither.
+        </p>
+        <p class="text-lg text-foreground-muted mb-5">
+          Running three separate products in the request path is a valid architecture. It
+          is also three config files, three observability stacks, three blast radiuses, and
+          three sets of middleware that look similar but are not composable with each
+          other. Shadow stacks grow in that gap.
+        </p>
+        <p class="text-lg text-foreground-muted">
+          Barbacane collapses the three into one by treating AI gateway as composition:
+          the same dispatchers, the same middleware plugins, the same spec-first config
+          surface cover API gateway fundamentals, outbound AI proxy, and inbound MCP. You
+          can still adopt one direction at a time. You do not have to adopt three separate
+          products to do it.
+        </p>
+      </div>
+    </div>
+  </section>
+
+  <!-- Use cases -->
+  <section class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">Built for these teams</h2>
+        </div>
+
+        <div class="grid lg:grid-cols-3 gap-8">
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-primary">AI product builders</h3>
+            <p class="text-foreground-muted mb-4">
+              Ship agents that call your production APIs safely and call LLMs cost-effectively.
+              One gateway for both sides of the agent loop.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Provider fallback on the outbound side</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Typed MCP tools from OpenAPI on the inbound side</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Single cost dashboard across both</span>
+              </li>
+            </ul>
+          </div>
+
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-secondary">Platform teams</h3>
+            <p class="text-foreground-muted mb-4">
+              Give every product team policy-compliant AI infrastructure: outbound for
+              their app's LLM calls, inbound for their APIs' agent exposure. One control
+              plane, one audit trail.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Central policy via CEL, OPA, or consumer ACLs</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Per-tenant cost attribution end-to-end</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>No per-team MCP server sprawl</span>
+              </li>
+            </ul>
+          </div>
+
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-accent">Regulated-industry CIOs</h3>
+            <p class="text-foreground-muted mb-4">
+              AI traffic your security, audit, and compliance teams can approve. Single
+              gateway, clear blast radius, fail-closed defaults, FIPS 140-3 option.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>AGPLv3, no vendor lock-in</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Self-hostable on-prem or air-gapped</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Artifact provenance and drift detection</span>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- FAQ -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-3xl mx-auto">
+        <h2 class="text-3xl sm:text-4xl font-bold mb-10 text-center">Frequently asked</h2>
+
+        <div class="space-y-6">
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">How is this different from Portkey or LiteLLM?</h3>
+            <p class="text-foreground-muted">
+              They are outbound-only AI gateways. Barbacane handles both directions plus
+              API gateway fundamentals, from one spec, with one middleware chain. Full
+              comparison in
+              <a href="/blog/barbacane-vs-portkey-litellm/" class="text-primary hover:underline">this post</a>.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Which LLM providers are supported on the outbound side?</h3>
+            <p class="text-foreground-muted">
+              OpenAI, Anthropic, and Ollama out of the box, with pinned upstream API
+              versions. Any OpenAI-compatible server (vLLM, TGI, LocalAI, Azure OpenAI,
+              self-hosted inference) works via <code class="text-primary">provider: openai</code>
+              plus a custom <code class="text-primary">base_url</code>.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Which MCP transport is supported on the inbound side?</h3>
+            <p class="text-foreground-muted">
+              JSON-RPC 2.0 over HTTP POST on <code class="text-primary">/__barbacane/mcp</code>.
+              Session termination via DELETE on the same path.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Can I adopt one direction without the other?</h3>
+            <p class="text-foreground-muted">
+              Yes. The two directions are independent. You can run Barbacane as an
+              outbound-only AI proxy, an inbound-only MCP gateway, or both, depending on
+              which <code class="text-primary">x-barbacane-*</code> extensions your spec
+              uses.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Do the AI governance middlewares apply to both directions?</h3>
+            <p class="text-foreground-muted">
+              Yes. <code class="text-primary">ai-prompt-guard</code>,
+              <code class="text-primary">ai-token-limit</code>,
+              <code class="text-primary">ai-cost-tracker</code>, and
+              <code class="text-primary">ai-response-guard</code> compose around any
+              dispatcher. The same four middlewares govern outbound LLM calls and inbound
+              MCP tool calls, so your cost attribution, token caps, and scrubbing policies
+              live in one place.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Do I have to rewrite my existing APIs?</h3>
+            <p class="text-foreground-muted">
+              No. Add <code class="text-primary">x-barbacane-*</code> extensions to your
+              existing OpenAPI spec. Barbacane compiles it into an artifact that speaks
+              both regular HTTP and MCP to the same upstream services.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Does authentication pass through?</h3>
+            <p class="text-foreground-muted">
+              On the inbound side, the <code class="text-primary">Authorization</code>
+              header from the MCP request is forwarded into the internal dispatch; your
+              <code class="text-primary">jwt-auth</code>,
+              <code class="text-primary">apikey-auth</code>, or OAuth2 middleware
+              validates it like any other request. On the outbound side, provider
+              credentials stay in dispatcher config and never leave it.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="section">
+    <div class="container-custom">
+      <div class="max-w-4xl mx-auto">
+        <div class="card cta-gradient text-center p-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            Ready to make AI one of your gateway's concerns, not a parallel stack?
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-2xl mx-auto mb-8">
+            Read the docs, star the repo, or bring Barbacane into an internal platform
+            pilot.
+          </p>
+
+          <div class="flex flex-col sm:flex-row gap-4 justify-center">
+            <a href="https://docs.barbacane.dev/guide/dispatchers.html#ai-proxy" class="btn-primary text-lg px-8 py-4">
+              Read the docs
+            </a>
+            <a href="https://github.com/barbacane-dev/barbacane" target="_blank" rel="noopener" class="btn-secondary text-lg px-8 py-4">
+              View on GitHub
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</Layout>
diff --git a/src/pages/blog/[slug].astro b/src/pages/blog/[slug].astro
index 8a8e54c..d8702a1 100644
--- a/src/pages/blog/[slug].astro
+++ b/src/pages/blog/[slug].astro
@@ -25,7 +25,7 @@ function formatDate(date: Date): string {
 }
 
 const readingTime = Math.ceil((post.body?.split(/\s+/).length ?? 0) / 200);
-const postUrl = `https://barbacane.dev/blog/${post.id}`;
+const postUrl = `https://barbacane.dev/blog/${post.id}/`;
 ---
 
 <Layout
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
index bebffa2..62f1bec 100644
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@@ -21,7 +21,7 @@ function formatDate(date: Date): string {
 
 <Layout
   title="Blog - Barbacane"
-  description="Articles about API gateways, OpenAPI, AsyncAPI, Rust, WASM, and spec-driven development."
+  description="Articles about MCP gateways, AI governance, API gateways, OpenAPI, AsyncAPI, Rust, WASM, and spec-driven development."
 >
   <section class="section">
     <div class="container-custom">
@@ -30,7 +30,8 @@ function formatDate(date: Date): string {
           Blog
         </h1>
         <p class="text-xl text-foreground-muted">
-          Articles about API gateways, spec-driven development, and building with Rust and WASM.
+          Articles on MCP gateways, AI governance, API gateways, spec-driven development,
+          and building with Rust and WASM.
         </p>
       </div>
 
@@ -42,7 +43,7 @@ function formatDate(date: Date): string {
                 {formatDate(post.data.publishDate)}
               </time>
               <h2 class="text-xl font-bold mt-2 mb-3">
-                <a href={`/blog/${post.id}`} class="hover:text-primary transition-colors">
+                <a href={`/blog/${post.id}/`} class="hover:text-primary transition-colors">
                   {post.data.title}
                 </a>
               </h2>
@@ -61,7 +62,7 @@ function formatDate(date: Date): string {
                 </div>
               )}
               <a
-                href={`/blog/${post.id}`}
+                href={`/blog/${post.id}/`}
                 class="inline-flex items-center text-sm text-primary hover:underline"
               >
                 Read more
diff --git a/src/pages/index.astro b/src/pages/index.astro
index b56581a..eebbede 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,8 +1,68 @@
 ---
+import { Code } from 'astro:components';
 import Layout from '../layouts/Layout.astro';
+
+const mcpYaml = `# Enable MCP for the whole API
+x-barbacane-mcp:
+  enabled: true
+  server_name: Orders API
+  server_version: 1.0.0
+
+paths:
+  /orders/{id}:
+    get:
+      operationId: getOrder
+      summary: Fetch an order by id
+      security:
+        - bearerAuth: []
+      parameters:
+        - name: id
+          in: path
+          required: true
+          schema: { type: string }
+      responses:
+        '200':
+          description: Order
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Order'
+
+  /admin/orders/purge:
+    delete:
+      operationId: purgeOrders
+      summary: Purge archived orders
+      # Hide this one from agents
+      x-barbacane-mcp:
+        enabled: false
+`;
+
+const aiProxyYaml = `paths:
+  /v1/chat/completions:
+    post:
+      operationId: chatCompletion
+      summary: Route LLM chat completion
+      x-barbacane-dispatch:
+        name: ai-proxy
+        config:
+          provider: openai
+          model: gpt-4o
+          api_key: "\${OPENAI_API_KEY}"
+
+          # Tried in order on 5xx / timeout
+          fallback:
+            - provider: anthropic
+              model: claude-sonnet-4-20250514
+              api_key: "\${ANTHROPIC_API_KEY}"
+            - provider: ollama
+              model: llama3
+              base_url: http://ollama:11434
+`;
+
+const codeThemes = { light: 'github-light', dark: 'github-dark' };
 ---
 
-<Layout title="Barbacane - The Spec-Driven API Gateway">
+<Layout title="Barbacane - Open-source AI gateway for LLMs and MCP">
   <!-- Hero Section -->
   <section class="section relative overflow-hidden">
     <div class="absolute inset-0 hero-gradient"></div>
@@ -10,22 +70,24 @@ import Layout from '../layouts/Layout.astro';
       <div class="max-w-4xl mx-auto text-center">
         <div class="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-background-light border border-themed mb-8">
           <span class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></span>
-          <span class="text-sm text-foreground-muted">Open Source &middot; AGPLv3</span>
+          <span class="text-sm text-foreground-muted">Open source &middot; AI gateway &middot; AGPLv3</span>
         </div>
 
         <h1 class="text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-extrabold mb-6 leading-tight">
-          Your spec is your
-          <span class="text-gradient">gateway</span>
+          One AI gateway,
+          <span class="text-gradient">both directions</span>
         </h1>
 
-        <p class="text-lg sm:text-xl text-foreground-muted max-w-2xl mx-auto mb-10">
-          Stop maintaining two sources of truth. Barbacane uses your OpenAPI and AsyncAPI
-          specifications as the single source of truth for routing, validation, authentication, authorization, and event bridging.
+        <p class="text-lg sm:text-xl text-foreground-muted max-w-3xl mx-auto mb-10">
+          Barbacane handles AI traffic on the way out and on the way in. Route your
+          application's LLM calls through OpenAI, Anthropic, or Ollama with provider
+          fallback and policy routing. Expose your existing APIs to AI agents as typed
+          MCP tools. Same gateway, same middleware, same spec.
         </p>
 
         <div class="flex flex-col sm:flex-row gap-4 justify-center">
-          <a href="#get-started" class="btn-primary text-lg px-8 py-4">
-            Get Started
+          <a href="/ai/" class="btn-primary text-lg px-8 py-4">
+            Explore the AI gateway
             <svg class="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"></path>
             </svg>
@@ -41,6 +103,188 @@ import Layout from '../layouts/Layout.astro';
     </div>
   </section>
 
+  <!-- MCP Quickstart Section -->
+  <section id="mcp-quickstart" class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            Your OpenAPI becomes an <span class="text-gradient">MCP server</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Enable MCP once at the spec root and your existing API is agent-callable.
+            Authentication, rate limits, validation, and audit logging all apply to tool
+            calls, because they are just HTTP requests in disguise.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-2 gap-8 items-start">
+          <div class="code-block-shiki rounded-lg text-sm overflow-auto">
+            <Code code={mcpYaml} lang="yaml" themes={codeThemes} />
+          </div>
+
+          <div class="space-y-6">
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Agents discover your tools</h3>
+              <p class="text-foreground-muted">
+                Barbacane exposes a JSON-RPC 2.0 MCP endpoint at
+                <code class="text-primary">/__barbacane/mcp</code>. Each operation becomes a
+                typed tool, with the name taken from <code class="text-primary">operationId</code>,
+                the description from <code class="text-primary">summary</code>, and input and
+                output schemas merged from your parameters, body, and responses.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Calls run through your middleware</h3>
+              <p class="text-foreground-muted">
+                Tool calls are HTTP requests. They pass through authentication, authorization,
+                rate limits, validation, transformations, and observability like any other
+                request. No shadow stack, no drift.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Opt out what agents should not see</h3>
+              <p class="text-foreground-muted">
+                By default every operation is a tool. Add
+                <code class="text-primary">x-barbacane-mcp: &#123; enabled: false &#125;</code>
+                to any operation you want to hide, such as admin endpoints or destructive
+                actions.
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Outbound AI Proxy Section -->
+  <section id="ai-proxy-outbound" class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            Your app calls LLMs through <span class="text-gradient">one dispatcher</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Route outbound LLM requests through OpenAI, Anthropic, or Ollama with provider
+            fallback, policy-driven targets, and the same middleware chain you use for
+            every other request.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-2 gap-8 items-start">
+          <div class="code-block-shiki rounded-lg text-sm overflow-auto">
+            <Code code={aiProxyYaml} lang="yaml" themes={codeThemes} />
+          </div>
+
+          <div class="space-y-6">
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Clients send OpenAI format</h3>
+              <p class="text-foreground-muted">
+                The <code class="text-primary">ai-proxy</code> dispatcher exposes a
+                unified OpenAI-compatible API surface and translates per provider
+                internally. Pinned upstream API versions make breaking changes a
+                deliberate plugin upgrade, not a silent production incident.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Fallback on failure</h3>
+              <p class="text-foreground-muted">
+                When the primary provider returns 5xx or times out, the dispatcher tries
+                the next target in the fallback chain. 4xx errors (content policy, invalid
+                model) return directly to the client.
+              </p>
+            </div>
+            <div>
+              <h3 class="text-xl font-semibold mb-2">Policy-driven targets</h3>
+              <p class="text-foreground-muted">
+                Stack <code class="text-primary">cel</code> middleware rules to set
+                <code class="text-primary">ai.target</code> in context based on consumer
+                tier, scopes, or headers. Credentials stay in dispatcher config, never in
+                context.
+              </p>
+            </div>
+          </div>
+        </div>
+
+        <div class="mt-10 text-center">
+          <a href="/ai/" class="btn-secondary">Read the full AI gateway story</a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- AI Governance Section -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            AI governance, built in
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Four middlewares compose like any other Barbacane plugin. Named profiles,
+            CEL expressions, fail-closed on misconfiguration.
+          </p>
+        </div>
+
+        <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Prompt guard</h3>
+            <p class="text-foreground-muted text-sm">
+              PII redaction, regex allow and deny lists, shape constraints on inbound prompts.
+              Shift-left validation at lint time.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Token limits</h3>
+            <p class="text-foreground-muted text-sm">
+              Token-based sliding windows per consumer, per operation, per tenant.
+              Stop runaway agents before they cost you money.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Cost tracking</h3>
+            <p class="text-foreground-muted text-sm">
+              Per-operation spend observability as Prometheus metrics. Budget alerts and
+              cost attribution across tenants and agents.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Response guard</h3>
+            <p class="text-foreground-muted text-sm">
+              Output scrubbing, schema re-validation, and policy checks before responses
+              reach the agent. Fail closed on misconfiguration.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
   <!-- Problem Section -->
   <section class="section bg-background-light">
     <div class="container-custom">
@@ -134,14 +378,28 @@ import Layout from '../layouts/Layout.astro';
     <div class="container-custom">
       <div class="max-w-4xl mx-auto text-center mb-16">
         <h2 class="text-3xl sm:text-4xl font-bold mb-4">
-          Everything you need in an API gateway
+          One gateway for your <span class="text-gradient">APIs</span> and your <span class="text-gradient">agents</span>
         </h2>
         <p class="text-xl text-foreground-muted">
-          Built in Rust for speed and safety. Extended with WebAssembly for flexibility.
+          AI-native features on top of a production-grade, spec-first gateway.
+          Rust for speed and safety, WebAssembly plugins for extensibility.
         </p>
       </div>
 
       <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div class="card">
+          <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+            <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714a2.25 2.25 0 00.659 1.591L19 14.5M14.25 3.104c.251.023.501.05.75.082M19 14.5l-2.47 2.47a2.25 2.25 0 01-1.591.659H9.061a2.25 2.25 0 01-1.591-.659L5 14.5m14 0V17a2 2 0 01-2 2H7a2 2 0 01-2-2v-2.5"></path>
+            </svg>
+          </div>
+          <h3 class="text-xl font-semibold mb-2">MCP server for AI agents</h3>
+          <p class="text-foreground-muted">
+            Expose your API operations as AI-callable tools via the Model Context Protocol.
+            AI agents discover and call endpoints through JSON-RPC 2.0, one extension to enable.
+          </p>
+        </div>
+
         <div class="card">
           <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
             <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -187,10 +445,11 @@ import Layout from '../layouts/Layout.astro';
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"></path>
             </svg>
           </div>
-          <h3 class="text-xl font-semibold mb-2">29 WASM Plugins</h3>
+          <h3 class="text-xl font-semibold mb-2">Every plugin you need</h3>
           <p class="text-foreground-muted">
-            29 official plugins covering auth, security, traffic control, transformations, and observability.
-            Sandboxed WebAssembly execution means plugins can't crash your gateway.
+            A full suite of built-in WebAssembly plugins for auth, security, traffic
+            control, transformations, and observability. Sandboxed execution means a
+            faulty plugin cannot crash the gateway.
           </p>
         </div>
 
@@ -249,13 +508,13 @@ import Layout from '../layouts/Layout.astro';
         <div class="card">
           <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
             <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
             </svg>
           </div>
-          <h3 class="text-xl font-semibold mb-2">Edge Ready</h3>
+          <h3 class="text-xl font-semibold mb-2">AI prompt guard</h3>
           <p class="text-foreground-muted">
-            Service planes are lightweight compiled artifacts. Deploy anywhere &mdash;
-            cloud, on-prem, edge locations, or embedded devices.
+            PII redaction, regex allow and deny lists, and schema constraints on inbound
+            prompts. Shift-left validation at lint time, fail-closed in production.
           </p>
         </div>
 
@@ -288,13 +547,13 @@ import Layout from '../layouts/Layout.astro';
         <div class="card">
           <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
             <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4"></path>
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
             </svg>
           </div>
-          <h3 class="text-xl font-semibold mb-2">S3 Storage Proxy</h3>
+          <h3 class="text-xl font-semibold mb-2">AI token limits</h3>
           <p class="text-foreground-muted">
-            Proxy requests to AWS S3 or S3-compatible storage (MinIO, RustFS, Ceph) with
-            SigV4 signing. Single-bucket CDN or multi-bucket routing.
+            Token-based sliding windows per consumer, per operation, per tenant. Stop
+            runaway agents before they cost you money.
           </p>
         </div>
 
@@ -314,26 +573,13 @@ import Layout from '../layouts/Layout.astro';
         <div class="card">
           <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
             <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 11c0 3.517-1.009 6.799-2.753 9.571m-3.44-2.04l.054-.09A13.916 13.916 0 008 11a4 4 0 118 0c0 1.017-.07 2.019-.203 3m-2.118 6.844A21.88 21.88 0 0015.171 17m3.839 1.132c.645-2.266.99-4.659.99-7.132A8 8 0 008 4.07M3 15.364c.64-1.319 1-2.8 1-4.364 0-1.457.39-2.823 1.07-4"></path>
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
             </svg>
           </div>
-          <h3 class="text-xl font-semibold mb-2">Bot Detection</h3>
+          <h3 class="text-xl font-semibold mb-2">AI cost tracking</h3>
           <p class="text-foreground-muted">
-            Block scrapers and unwanted bots by User-Agent pattern matching.
-            Allow/deny lists with configurable responses.
-          </p>
-        </div>
-
-        <div class="card">
-          <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
-            <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714a2.25 2.25 0 00.659 1.591L19 14.5M14.25 3.104c.251.023.501.05.75.082M19 14.5l-2.47 2.47a2.25 2.25 0 01-1.591.659H9.061a2.25 2.25 0 01-1.591-.659L5 14.5m14 0V17a2 2 0 01-2 2H7a2 2 0 01-2-2v-2.5"></path>
-            </svg>
-          </div>
-          <h3 class="text-xl font-semibold mb-2">MCP Server for AI Agents</h3>
-          <p class="text-foreground-muted">
-            Expose your API operations as AI-callable tools via the Model Context Protocol.
-            AI agents discover and call endpoints through JSON-RPC 2.0 &mdash; one extension to enable.
+            Per-operation LLM spend as Prometheus metrics. Budget alerts and cost
+            attribution across tenants, teams, and agents.
           </p>
         </div>
 
@@ -366,13 +612,13 @@ import Layout from '../layouts/Layout.astro';
         <div class="card">
           <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
             <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path>
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
             </svg>
           </div>
-          <h3 class="text-xl font-semibold mb-2">Remote Plugin Loading</h3>
+          <h3 class="text-xl font-semibold mb-2">AI response guard</h3>
           <p class="text-foreground-muted">
-            Load plugins from HTTPS URLs at compile time with optional SHA-256 integrity verification.
-            Local cache with checksum-based invalidation for fast rebuilds.
+            Output scrubbing, schema re-validation, and policy checks before responses
+            reach the agent. Fail closed on misconfiguration.
           </p>
         </div>
       </div>
diff --git a/src/pages/platform.astro b/src/pages/platform.astro
new file mode 100644
index 0000000..5fac795
--- /dev/null
+++ b/src/pages/platform.astro
@@ -0,0 +1,454 @@
+---
+import Layout from '../layouts/Layout.astro';
+---
+
+<Layout
+  title="Spec-first API gateway for platform teams - Barbacane"
+  description="Barbacane turns your OpenAPI and AsyncAPI specs into your API gateway. No config drift, no reconciliation work, no hidden policy gaps. Rust-native, extensible via sandboxed WebAssembly plugins, control and data plane split."
+>
+  <!-- Hero -->
+  <section class="section relative overflow-hidden">
+    <div class="absolute inset-0 hero-gradient"></div>
+    <div class="container-custom relative">
+      <div class="max-w-4xl mx-auto text-center">
+        <div class="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-background-light border border-themed mb-8">
+          <span class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></span>
+          <span class="text-sm text-foreground-muted">Spec-first &middot; Open source &middot; AGPLv3</span>
+        </div>
+
+        <h1 class="text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-extrabold mb-6 leading-tight">
+          The spec-first API gateway for
+          <span class="text-gradient">platform teams</span>
+        </h1>
+
+        <p class="text-lg sm:text-xl text-foreground-muted max-w-2xl mx-auto mb-10">
+          Your OpenAPI spec is your gateway configuration. Authentication, authorization,
+          rate limits, validation, and transformations compile from the same file your API
+          is documented in. No drift, no reconciliation work, no silent security gaps.
+        </p>
+
+        <div class="flex flex-col sm:flex-row gap-4 justify-center">
+          <a href="#how-it-works" class="btn-primary text-lg px-8 py-4">
+            See how it works
+            <svg class="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"></path>
+            </svg>
+          </a>
+          <a href="https://github.com/barbacane-dev/barbacane" target="_blank" rel="noopener" class="btn-secondary text-lg px-8 py-4">
+            <svg class="mr-2 w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
+              <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+            </svg>
+            View on GitHub
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- The problem -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-3xl mx-auto">
+        <h2 class="text-3xl sm:text-4xl font-bold mb-8 text-center">Two sources of truth, one problem</h2>
+        <p class="text-lg text-foreground-muted mb-5">
+          Most platform teams maintain an OpenAPI spec (what the API is supposed to do) and
+          a gateway config (what the API actually does at the edge). The two drift apart
+          the day they are both written, and stay drifted.
+        </p>
+        <p class="text-lg text-foreground-muted mb-5">
+          Every drift is either wasted time reconciling, a bug shipping to production, or a
+          silent policy gap waiting to become a security incident. At a certain size, the
+          reconciliation <em>is</em> the platform team's day job.
+        </p>
+        <p class="text-lg text-foreground-muted">
+          Barbacane has one source: the spec. Auth, rate limits, validation,
+          transformations, and routing all compile from it. Drift is impossible because
+          there is only one place to change anything.
+        </p>
+      </div>
+    </div>
+  </section>
+
+  <!-- How it works -->
+  <section id="how-it-works" class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            One spec, one compile, <span class="text-gradient">zero drift</span>
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Three steps, fully reproducible, all in your version control.
+          </p>
+        </div>
+
+        <div class="grid lg:grid-cols-3 gap-6">
+          <div class="card text-center">
+            <div class="w-16 h-16 rounded-2xl bg-primary-subtle flex items-center justify-center mx-auto mb-6">
+              <span class="text-3xl">1</span>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">Write your spec</h3>
+            <p class="text-foreground-muted">
+              OpenAPI or AsyncAPI, annotated with
+              <code class="text-primary">x-barbacane-*</code> extensions for auth, rate
+              limits, routing, and policy. One file per service.
+            </p>
+          </div>
+
+          <div class="card text-center">
+            <div class="w-16 h-16 rounded-2xl bg-secondary-subtle flex items-center justify-center mx-auto mb-6">
+              <span class="text-3xl">2</span>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">Compile the artifact</h3>
+            <p class="text-foreground-muted">
+              <code class="text-secondary">barbacane compile</code> validates, resolves
+              references, and packages your spec into one deployable binary. Invalid specs
+              never reach production.
+            </p>
+          </div>
+
+          <div class="card text-center">
+            <div class="w-16 h-16 rounded-2xl bg-accent-subtle flex items-center justify-center mx-auto mb-6">
+              <span class="text-3xl">3</span>
+            </div>
+            <h3 class="text-xl font-semibold mb-3">Deploy and serve</h3>
+            <p class="text-foreground-muted">
+              Push the artifact to a data plane. Hot-reload, zero-downtime deploys, and
+              drift detection. Data planes keep serving even if the control plane is
+              offline.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- What you get -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-6xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">Everything platform teams need</h2>
+          <p class="text-xl text-foreground-muted max-w-3xl mx-auto">
+            Compiled from the spec, enforced at the edge. No extra config files, no shadow
+            policies.
+          </p>
+        </div>
+
+        <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Request validation</h3>
+            <p class="text-foreground-muted text-sm">
+              Automatic JSON Schema validation for bodies, parameters, and headers, with
+              full <code class="text-primary">$ref</code> resolution. Invalid requests
+              never reach your upstreams.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Authentication</h3>
+            <p class="text-foreground-muted text-sm">
+              Five built-in auth plugins: JWT, OIDC, OAuth2, API Key, Basic. Configured
+              directly in your OpenAPI security schemes.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Authorization</h3>
+            <p class="text-foreground-muted text-sm">
+              Policy-driven access control with inline CEL expressions, Open Policy Agent
+              integration, and consumer-based ACLs. Zero-trust at the gateway.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Rust performance</h3>
+            <p class="text-foreground-muted text-sm">
+              Sub-microsecond routing and validation. Built on Tokio and Hyper. Memory
+              safety without a garbage collector.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Every plugin you need</h3>
+            <p class="text-foreground-muted text-sm">
+              Built-in WebAssembly plugins for auth, security, traffic control,
+              transformations, and observability. Sandboxed execution means a faulty
+              plugin cannot crash the gateway; write your own when the built-ins do not
+              cover your case.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Observability</h3>
+            <p class="text-foreground-muted text-sm">
+              Prometheus metrics, OpenTelemetry traces, structured logging. Full visibility
+              into every request with no extra instrumentation on your upstreams.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-primary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Control and data plane split</h3>
+            <p class="text-foreground-muted text-sm">
+              Autonomous data planes that keep serving traffic even if the control plane is
+              offline. Push deployments, hot-reload, drift detection, provenance in every
+              artifact.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-secondary-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-secondary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7h12m0 0l-4-4m4 4l-4 4m0 6H4m0 0l4 4m-4-4l4-4"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">Request transformation</h3>
+            <p class="text-foreground-muted text-sm">
+              Declarative transformations on headers, query params, paths, and JSON bodies
+              before requests reach your upstreams. Variable interpolation with capture
+              groups.
+            </p>
+          </div>
+
+          <div class="card">
+            <div class="w-12 h-12 rounded-lg bg-accent-subtle flex items-center justify-center mb-4">
+              <svg class="w-6 h-6 text-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
+              </svg>
+            </div>
+            <h3 class="text-lg font-semibold mb-2">FIPS 140-3 ready</h3>
+            <p class="text-foreground-muted text-sm">
+              Built on rustls with AWS-LC, a NIST-certified FIPS 140-3 cryptographic
+              module. Enable FIPS mode with a single feature flag. No OpenSSL dependency.
+            </p>
+          </div>
+        </div>
+
+        <div class="text-center mt-10">
+          <a href="/#features" class="btn-secondary">See the full feature list</a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Use cases -->
+  <section class="section">
+    <div class="container-custom">
+      <div class="max-w-5xl mx-auto">
+        <div class="text-center mb-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">Built for these teams</h2>
+        </div>
+
+        <div class="grid lg:grid-cols-3 gap-8">
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-primary">Internal developer platforms</h3>
+            <p class="text-foreground-muted mb-4">
+              Product teams write OpenAPI specs. The platform does the rest: auth, rate
+              limits, validation, observability. Self-service without the governance
+              compromises.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Spec-first publishing workflow</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Centralized policy, distributed ownership</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-primary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>One audit trail across services</span>
+              </li>
+            </ul>
+          </div>
+
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-secondary">API governance at scale</h3>
+            <p class="text-foreground-muted mb-4">
+              Express and enforce consistent auth, rate limits, and security policies
+              across hundreds of services. Changes ship by PR, not by ticket.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Shift-left lint with vacuum rulesets</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Fail-closed defaults on misconfiguration</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-secondary mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Artifact provenance and drift detection</span>
+              </li>
+            </ul>
+          </div>
+
+          <div class="card">
+            <h3 class="text-xl font-bold mb-3 text-accent">Legacy gateway modernization</h3>
+            <p class="text-foreground-muted mb-4">
+              Migrating from Kong, Apigee, or Tyk? The
+              <a href="/blog/strangler-fig-pattern-api-gateway/" class="text-primary hover:underline">strangler fig pattern</a>
+              works naturally. Add Barbacane in front, migrate routes one by one, retire
+              the legacy stack when you are ready.
+            </p>
+            <ul class="space-y-2 text-foreground-muted text-sm">
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>Incremental migration path</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>No vendor lock-in, AGPLv3</span>
+              </li>
+              <li class="flex items-start gap-2">
+                <svg class="w-4 h-4 text-accent mt-0.5 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
+                <span>On-prem, cloud, edge, or air-gapped</span>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- FAQ -->
+  <section class="section bg-background-light">
+    <div class="container-custom">
+      <div class="max-w-3xl mx-auto">
+        <h2 class="text-3xl sm:text-4xl font-bold mb-10 text-center">Frequently asked</h2>
+
+        <div class="space-y-6">
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">How is this different from Kong, Apigee, or Tyk?</h3>
+            <p class="text-foreground-muted">
+              Those gateways ship with their own config DSL. Your OpenAPI spec is a
+              parallel document you have to keep in sync with the gateway. Barbacane
+              inverts that: the spec <em>is</em> the config. There is no second source of
+              truth to drift from.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Does it work with my existing OpenAPI specs?</h3>
+            <p class="text-foreground-muted">
+              Yes. Add <code class="text-primary">x-barbacane-*</code> extensions where you
+              need gateway behaviour. Existing fields (security schemes, parameters,
+              responses) are already interpreted. Specs stay portable to other tools.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Can I add custom logic?</h3>
+            <p class="text-foreground-muted">
+              Yes, via WebAssembly plugins. Barbacane ships a full suite of official
+              plugins and lets you write your own in any WASM-compiling language. Plugins
+              are sandboxed, so a faulty plugin cannot crash the gateway.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">How does it deploy?</h3>
+            <p class="text-foreground-muted">
+              A compiled artifact is a single binary. Run it anywhere: Kubernetes, bare
+              metal, on-prem VMs, edge locations, air-gapped environments. The control
+              plane and data planes are independent, so data planes keep serving even if
+              the control plane is offline.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">AGPLv3. Can I use it commercially?</h3>
+            <p class="text-foreground-muted">
+              Yes. Small teams and non-profits get a free commercial license. Larger
+              organisations can buy a paid commercial license. Either way, every feature is
+              open source, no gated enterprise tier.
+              See <a href="/pricing/" class="text-primary hover:underline">pricing</a> for
+              details.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Does it support event-driven systems?</h3>
+            <p class="text-foreground-muted">
+              Yes. Barbacane reads AsyncAPI specs and bridges HTTP to Kafka, NATS, or AWS
+              Lambda. The same spec-first, compile-safe workflow applies.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Does this extend to AI traffic?</h3>
+            <p class="text-foreground-muted">
+              Yes. The same spec-first model covers outbound LLM routing (via the
+              <code class="text-primary">ai-proxy</code> dispatcher) and inbound MCP for
+              AI agents. Platform teams often use Barbacane for all three on the same
+              gateway. See <a href="/ai/" class="text-primary hover:underline">the AI
+              gateway page</a> for that side of the story.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- CTA -->
+  <section class="section">
+    <div class="container-custom">
+      <div class="max-w-4xl mx-auto">
+        <div class="card cta-gradient text-center p-12">
+          <h2 class="text-3xl sm:text-4xl font-bold mb-4">
+            Ready to cut your gateway drift to zero?
+          </h2>
+          <p class="text-xl text-foreground-muted max-w-2xl mx-auto mb-8">
+            Read the docs, star the repo, or bring Barbacane into a platform pilot.
+          </p>
+
+          <div class="flex flex-col sm:flex-row gap-4 justify-center">
+            <a href="https://docs.barbacane.dev/guide/getting-started.html" class="btn-primary text-lg px-8 py-4">
+              Read the docs
+            </a>
+            <a href="https://github.com/barbacane-dev/barbacane" target="_blank" rel="noopener" class="btn-secondary text-lg px-8 py-4">
+              View on GitHub
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</Layout>
diff --git a/src/pages/pricing.astro b/src/pages/pricing.astro
index 09450ea..bd46920 100644
--- a/src/pages/pricing.astro
+++ b/src/pages/pricing.astro
@@ -2,7 +2,7 @@
 import Layout from '../layouts/Layout.astro';
 ---
 
-<Layout title="Pricing - Barbacane" description="Licensing and professional services for Barbacane - the spec-driven API gateway.">
+<Layout title="Pricing - Barbacane" description="Licensing and professional services for Barbacane - the open-source AI gateway for LLMs and MCP, built on a Rust-native spec-first API gateway.">
   <!-- Hero -->
   <section class="section">
     <div class="container-custom">
@@ -11,8 +11,10 @@ import Layout from '../layouts/Layout.astro';
           Licensing &amp; <span class="text-gradient">Pricing</span>
         </h1>
         <p class="text-xl text-foreground-muted max-w-2xl mx-auto">
-          Barbacane is open source under AGPLv3. A commercial license is free for small
-          teams and non-profits &mdash; paid for larger organisations.
+          Whether you run Barbacane as an API gateway, an outbound LLM proxy, an inbound
+          MCP gateway, or all three, the licensing is the same. Open source under AGPLv3.
+          A commercial license is free for small teams and non-profits, paid for larger
+          organisations.
         </p>
       </div>
     </div>
@@ -154,7 +156,7 @@ import Layout from '../layouts/Layout.astro';
                 </svg>
                 <div>
                   <strong class="text-foreground">Architecture reviews</strong>
-                  <p class="text-sm text-foreground-muted">Deep-dive into your API landscape and gateway requirements</p>
+                  <p class="text-sm text-foreground-muted">Deep-dive into your API landscape, gateway requirements, and AI traffic patterns (outbound LLM, inbound MCP)</p>
                 </div>
               </li>
               <li class="flex items-start gap-3">
@@ -163,7 +165,7 @@ import Layout from '../layouts/Layout.astro';
                 </svg>
                 <div>
                   <strong class="text-foreground">Migration planning</strong>
-                  <p class="text-sm text-foreground-muted">Structured path from legacy gateways to Barbacane</p>
+                  <p class="text-sm text-foreground-muted">Structured path from legacy API gateways or standalone LLM proxies onto Barbacane</p>
                 </div>
               </li>
               <li class="flex items-start gap-3">
@@ -172,7 +174,7 @@ import Layout from '../layouts/Layout.astro';
                 </svg>
                 <div>
                   <strong class="text-foreground">Custom plugin development</strong>
-                  <p class="text-sm text-foreground-muted">WASM plugins tailored to your specific needs</p>
+                  <p class="text-sm text-foreground-muted">WASM plugins tailored to your traffic patterns, including AI governance middlewares</p>
                 </div>
               </li>
               <li class="flex items-start gap-3">
@@ -269,7 +271,7 @@ import Layout from '../layouts/Layout.astro';
                 </svg>
                 <div>
                   <strong class="text-foreground">Spec-driven API design</strong>
-                  <p class="text-sm text-foreground-muted">OpenAPI & AsyncAPI best practices with Barbacane extensions</p>
+                  <p class="text-sm text-foreground-muted">OpenAPI and AsyncAPI best practices, including MCP extensions for exposing APIs to AI agents</p>
                 </div>
               </li>
               <li class="flex items-start gap-3">
@@ -343,16 +345,27 @@ import Layout from '../layouts/Layout.astro';
             <p class="text-foreground-muted">
               Absolutely. Our consulting packages include compliance reviews for SOC 2, GDPR,
               HIPAA, and other frameworks. We help you configure Barbacane's logging, security
-              policies, and audit trails to meet your requirements.
+              policies, AI governance middlewares, and audit trails to meet your requirements.
+            </p>
+          </div>
+
+          <div class="card">
+            <h3 class="text-lg font-semibold mb-2">Does this cover AI and MCP workloads?</h3>
+            <p class="text-foreground-muted">
+              Yes. Barbacane's AI gateway capabilities (<code class="text-primary">ai-proxy</code>
+              dispatcher, AI governance middlewares) and MCP gateway capabilities are part of
+              the same software. The same licensing and services apply, whether you are using
+              Barbacane for outbound LLM routing, inbound agent tool exposure, or as a full API
+              gateway.
             </p>
           </div>
 
           <div class="card">
             <h3 class="text-lg font-semibold mb-2">Do you offer on-premise deployment?</h3>
             <p class="text-foreground-muted">
-              Barbacane is designed to run anywhere &mdash; on-prem, in your cloud, at the edge.
-              We can help you design and implement the deployment architecture that fits your
-              infrastructure and security requirements.
+              Barbacane is designed to run anywhere: on-prem, in your cloud, at the edge, or
+              air-gapped. We can help you design and implement the deployment architecture that
+              fits your infrastructure and security requirements.
             </p>
           </div>
         </div>