diff --git a/nuxt/components/AppHeader.vue b/nuxt/components/AppHeader.vue
index b03252573e..1aec8fd896 100644
--- a/nuxt/components/AppHeader.vue
+++ b/nuxt/components/AppHeader.vue
@@ -166,7 +166,7 @@ onMounted(() => {
               <li class="pl-3 title border-l-2 border-gray-200" :class="col.titleGrid"><span class="flex items-center gap-2"><span class="ff-nav-label">{{ col.title }}</span></span></li>
               <li class="contents">
                 <ul class="sub-menu grid grid-rows-subgrid ml-7 auto-rows-auto border-l-2 border-gray-200" :class="col.listClasses">
-                  <li v-for="item in col.links" :key="item.label"><a class="flex items-center gap-2" :href="resolveHref(item.href)"><NavIcon :name="item.icon" :solid="!!item.solid" /><span class="ff-nav-label">{{ item.label }}</span></a></li>
+                  <li v-for="item in col.links" :key="item.label" :class="{ 'nav-indent': item.indent }"><a class="flex items-center gap-2" :href="resolveHref(item.href)"><NavIcon :name="item.icon" :solid="!!item.solid" /><span class="ff-nav-label">{{ item.label }}</span></a></li>
                 </ul>
               </li>
             </template>
diff --git a/nuxt/components/CertifiedNodes.vue b/nuxt/components/CertifiedNodes.vue
index 3abcfc5017..c352163366 100644
--- a/nuxt/components/CertifiedNodes.vue
+++ b/nuxt/components/CertifiedNodes.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+const props = withDefaults(defineProps<{ defaultTier?: 'it' | 'ot' }>(), { defaultTier: 'it' })
+
 const { data } = await useAsyncData('certified-nodes', () => queryCollection('certifiedNodes').first())
 
 const bundles = computed(() => data.value?.bundles ?? [])
 type Bundle = typeof bundles.value[number]
 
-const active = ref<'it' | 'ot'>('it')
+const active = ref<'it' | 'ot'>(props.defaultTier)
 const activeBundle = computed(() => bundles.value.find(b => b.id === active.value) ?? bundles.value[0])
 const nodeCount = (b?: Bundle) => b ? b.groups.reduce((n, g) => n + g.nodes.length, 0) : 0
 
diff --git a/nuxt/content.config.ts b/nuxt/content.config.ts
index 5bf18a5620..be8e06e6f2 100644
--- a/nuxt/content.config.ts
+++ b/nuxt/content.config.ts
@@ -211,6 +211,41 @@ export default defineContentConfig({
                 bestFitFor: z.array(z.string()).optional(),
             })
         }),
+        products: defineCollection({
+            type: 'data',
+            source: 'products/*.yml',
+            schema: z.object({
+                tierId: z.string(),
+                label: z.string(),
+                metaDescription: z.string(),
+                eyebrow: z.string(),
+                headingLead: z.string(),
+                headingHighlight: z.string(),
+                description: z.string(),
+                heroImage: z.object({
+                    src: z.string(),
+                    alt: z.string(),
+                }),
+                quote: z.object({
+                    text: z.string(),
+                    author: z.string(),
+                    role: z.string(),
+                    avatar: z.string().optional(),
+                }),
+                fitYes: z.array(z.string()),
+                fitNo: z.array(z.string()),
+                included: z.array(z.object({
+                    title: z.string(),
+                    chips: z.array(z.union([
+                        z.string(),
+                        z.object({ label: z.string(), href: z.string() }),
+                    ])),
+                })),
+                certifiedDefault: z.enum(['it', 'ot']).optional(),
+                crossLinkEyebrow: z.string(),
+                crossLinkDescription: z.string(),
+            })
+        }),
         featureCatalog: defineCollection({
             type: 'data',
             source: 'feature-catalog.yml',
diff --git a/nuxt/content/products/edge.yml b/nuxt/content/products/edge.yml
new file mode 100644
index 0000000000..bf9db16721
--- /dev/null
+++ b/nuxt/content/products/edge.yml
@@ -0,0 +1,58 @@
+tierId: edge
+label: FlowFuse Edge
+metaDescription: "Run the plant floor and standardize it everywhere. FlowFuse Edge connects your PLCs, machines, and controllers and governs the data between them, built for how OT teams work."
+eyebrow: "For OT & Digitalization Leadership"
+headingLead: "Run the plant floor."
+headingHighlight: "Standardize it everywhere."
+description: "FlowFuse Edge connects your PLCs, machines, and controllers and governs the data between them. Designed for how OT teams work. If you're looking for an IT solution instead, check out <a class=\"text-indigo-600 hover:underline\" href=\"/product/hub/\">FlowFuse Hub</a>."
+heroImage:
+  src: /images/home/home-scada.png
+  alt: "FlowFuse Edge: industrial edge connectivity"
+quote:
+  text: "The ability to edit once and deploy everywhere has added real efficiency to how we manage integrations. This is how enterprises scale automation."
+  author: "Sevan Petrosian"
+  role: "Sr. Application Engineer, Arch Systems"
+  avatar: /images/customer-headshots/servan-petrosian-arch-systems.png
+fitYes:
+  - "Data originates at machines on the plant floor: PLCs, SCADA, sensors, and controllers."
+  - "You need OT-certified industrial protocol connectivity: OPC-UA, Modbus, EtherNet/IP, and more."
+  - "OT or digitalization teams are standardizing production across multiple sites."
+fitNo:
+  - "Your data moves purely between software systems, like ERPs, databases, and cloud APIs. That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/hub/\">FlowFuse Hub</a>."
+  - "Managing large fleets of distributed devices is your primary unit of scale. That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/fleet/\">FlowFuse Fleet</a>."
+  - "You have no industrial hardware to connect. A pure IT integration project belongs on <a class=\"text-indigo-600 hover:underline\" href=\"/product/hub/\">FlowFuse Hub</a>."
+included:
+  - title: "Connect the plant floor"
+    chips:
+      - label: "Certified OT Connections (OPC-UA, Modbus, EtherNet/IP, RTSP)"
+        href: "/integrations/?product=edge&certified=1"
+      - label: "MQTT Broker"
+        href: "/docs/user/teambroker/"
+      - label: "HTTP Request"
+        href: "/node-red/core-nodes/http-request/"
+  - title: "Develop & deploy at the edge"
+    chips:
+      - label: "Edge Development (remote editor proxy)"
+        href: "/docs/device-agent/running/"
+      - label: "Edge Instances"
+        href: "/docs/device-agent/deploy/"
+      - label: "Snapshots & Rollback"
+        href: "/docs/user/snapshots/"
+  - title: "Manage devices across sites"
+    chips:
+      - label: "Device Fleet Updates"
+        href: "/docs/device-agent/deploy/"
+      - label: "Device Group Management"
+        href: "/docs/user/device-groups/"
+      - "Performance Monitoring & Alerts"
+  - title: "Built to collaborate"
+    chips:
+      - label: "OT App Blueprints"
+        href: "/blueprints/"
+      - label: "Team Library"
+        href: "/docs/user/shared-library/"
+      - label: "Everything in the core FlowFuse platform"
+        href: "/product/"
+certifiedDefault: ot
+crossLinkEyebrow: "For OT Teams"
+crossLinkDescription: "Connect PLCs, machines, and controllers and standardize automation across every site."
diff --git a/nuxt/content/products/fleet.yml b/nuxt/content/products/fleet.yml
new file mode 100644
index 0000000000..660074a102
--- /dev/null
+++ b/nuxt/content/products/fleet.yml
@@ -0,0 +1,56 @@
+tierId: fleet
+label: FlowFuse Fleet
+metaDescription: "Manage a Node-RED fleet and ship updates everywhere. FlowFuse Fleet runs Node-RED across thousands of distributed devices with remote updates, rollback, and fleet-wide visibility, built for hardware OEMs, partners, and asset operators."
+eyebrow: "For Hardware OEMs & Asset Operators"
+headingLead: "Manage a Node-RED fleet."
+headingHighlight: "Ship updates everywhere."
+description: "FlowFuse Fleet runs Node-RED across thousands of distributed devices in the field, with remote updates, rollback, and fleet-wide visibility. Built for hardware OEMs, partners, and asset operators. If you're connecting a single plant floor, see <a class=\"text-indigo-600 hover:underline\" href=\"/product/edge/\">FlowFuse Edge</a>."
+heroImage:
+  src: /images/product/fleet.jpg
+  alt: "FlowFuse Fleet: device fleet management console"
+quote:
+  text: "We knew we needed a solution to help us manage our edge devices as well as our central control system. FlowFuse has helped us take our Node-RED from proof-of-concept through to a reliable, scalable solution for the future."
+  author: "Robert VanHofwegen"
+  role: "Paloma Irrigation District"
+fitYes:
+  - "You operate large numbers of distributed devices across remote sites."
+  - "You ship Node-RED inside your own product, as an OEM or solution builder."
+  - "You need remote updates, rollback, and fleet-wide visibility without firmware releases."
+fitNo:
+  - "Your work is integrating software systems centrally, like ERPs, databases, and APIs. That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/hub/\">FlowFuse Hub</a>."
+  - "You're connecting machines on a single plant floor. That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/edge/\">FlowFuse Edge</a>."
+  - "You manage a handful of instances, not a fleet. The core platform likely already covers you."
+included:
+  - title: "Manage devices at scale"
+    chips:
+      - label: "Remote Device & Instance Management"
+        href: "/docs/device-agent/deploy/"
+      - label: "Device Fleet Updates"
+        href: "/docs/device-agent/deploy/"
+      - label: "Device Group Management"
+        href: "/docs/user/device-groups/"
+  - title: "Ship & roll back safely"
+    chips:
+      - label: "Snapshot & Rollback"
+        href: "/docs/user/snapshots/"
+      - label: "DevOps Pipelines"
+        href: "/docs/user/devops-pipelines/"
+      - label: "Edge Development"
+        href: "/docs/device-agent/running/"
+  - title: "Monitor the fleet"
+    chips:
+      - label: "Live Monitoring"
+        href: "/docs/user/instance-states/"
+      - "Performance Monitoring & Alerts"
+      - label: "Audit Log"
+        href: "/docs/user/logs/#team-audit-log"
+  - title: "Built to collaborate"
+    chips:
+      - label: "Team Library"
+        href: "/docs/user/shared-library/"
+      - label: "Blueprints"
+        href: "/blueprints/"
+      - label: "Everything in the core FlowFuse platform"
+        href: "/product/"
+crossLinkEyebrow: "For Device Fleets"
+crossLinkDescription: "Push flows, ship updates, and roll back remotely across thousands of distributed devices."
diff --git a/nuxt/content/products/hub.yml b/nuxt/content/products/hub.yml
new file mode 100644
index 0000000000..544ca7d072
--- /dev/null
+++ b/nuxt/content/products/hub.yml
@@ -0,0 +1,67 @@
+tierId: hub
+label: FlowFuse Hub
+metaDescription: "Move data across the business and govern it centrally. FlowFuse Hub connects your ERPs, databases, and cloud APIs into one governed system, built for central IT and enterprise architecture teams."
+eyebrow: "For IT & Integration Teams"
+headingLead: "Move data across the business."
+headingHighlight: "Govern it centrally."
+description: "FlowFuse Hub connects your ERPs, databases, and cloud APIs into one governed system. Built for central IT and enterprise architecture teams. If you're looking for plant floor connectivity, see <a class=\"text-indigo-600 hover:underline\" href=\"/product/edge/\">FlowFuse Edge</a>."
+heroImage:
+  src: /images/product/hub.jpg
+  alt: "FlowFuse Hub: enterprise data integration"
+quote:
+  text: "FlowFuse allows us to rapidly roll out updates to clients without burdening our development team. We can deliver custom dashboards to customers without involving any of our core developers."
+  author: "Dave Olsen"
+  role: "Product Manager, Wenco"
+  avatar: /images/customer-headshots/dave-olsen-wenco.png
+fitYes:
+  - "Data moves between software systems: ERPs, databases, cloud APIs, message queues."
+  - "You're building governed integration, not point-to-point scripts."
+  - "Central IT or an integration team is sponsoring the project."
+fitNo:
+  - "Data originates at machines on a plant floor. That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/edge/\">FlowFuse Edge</a>, even if an ERP sits at the far end of the pipeline."
+  - "Devices are your primary unit of scale (fleets of sensors, remote sites). That's <a class=\"text-indigo-600 hover:underline\" href=\"/product/fleet/\">FlowFuse Fleet</a>."
+  - "You need PLC, SCADA, or industrial protocol connectivity. Hub doesn't include OT-certified nodes."
+included:
+  - title: "Move data, reliably"
+    chips:
+      - label: "Git Integration"
+        href: "/docs/user/devops-pipelines/#git-repository-stage"
+      - label: "High Availability"
+        href: "/docs/user/high-availability/"
+      - label: "DevOps Pipelines"
+        href: "/docs/user/devops-pipelines/"
+      - label: "Private NPM Registry"
+        href: "/docs/user/custom-npm-packages/"
+      - label: "FlowFuse Tables"
+        href: "/docs/user/ff-tables/"
+  - title: "Certified for IT systems"
+    chips:
+      - label: "MQTT"
+        href: "/node-red/flowfuse/mqtt/"
+      - label: "HTTP Request"
+        href: "/node-red/core-nodes/http-request/"
+      - "Kafka"
+      - label: "Redis"
+        href: "/node-red/flowfuse/hub/redis/"
+      - label: "AI nodes (Gemini, Claude, ChatGPT, Ollama)"
+        href: "/node-red/flowfuse/ai/llm-nodes/"
+  - title: "Governed by default"
+    chips:
+      - label: "Application-Level RBAC"
+        href: "/docs/user/role-based-access-control/"
+      - label: "Endpoint Security"
+        href: "/docs/user/instance-settings/#flowfuse-user-authentication"
+      - "BAA for HIPAA"
+      - label: "Protected Instances"
+        href: "/docs/user/devops-pipelines/#protected-instances"
+  - title: "Built to collaborate"
+    chips:
+      - label: "Team Library"
+        href: "/docs/user/shared-library/"
+      - label: "IT App Blueprints"
+        href: "/blueprints/"
+      - label: "Everything in the core FlowFuse platform"
+        href: "/product/"
+certifiedDefault: it
+crossLinkEyebrow: "For IT Teams"
+crossLinkDescription: "Integrate and orchestrate data across ERPs, databases, and cloud APIs, governed centrally."
diff --git a/nuxt/nuxt.config.ts b/nuxt/nuxt.config.ts
index 8ee026c7db..5e0f813663 100644
--- a/nuxt/nuxt.config.ts
+++ b/nuxt/nuxt.config.ts
@@ -56,6 +56,20 @@ function collectApplicationGuideRoutes(dir: string): string[] {
     return routes
 }
 
+// The product tier pages (/product/[tier]/) are a `data` collection (see content.config.ts),
+// so their routes aren't discoverable from @nuxt/content page paths either. Derive them from
+// each file's `tierId` field rather than the filename, since that's the field the page route
+// actually queries on.
+function collectProductRoutes (dir: string): string[] {
+    const routes: string[] = []
+    for (const file of readdirSync(dir)) {
+        if (!file.endsWith('.yml')) continue
+        const { tierId } = parseYaml(readFileSync(join(dir, file), 'utf8'))
+        routes.push(`/product/${tierId}/`)
+    }
+    return routes
+}
+
 // Same idea for blog posts. Each entry also carries its `tags` so the 13 tag-listing
 // pages (and their own pagination, 19 entries/page) can be sized correctly, and its
 // `authors` so the /blog/author/{slug}/ pages can be enumerated.
@@ -320,6 +334,7 @@ export default defineNuxtConfig({
                     '/integrations',
                     '/pricing',
                     '/product',
+                    ...collectProductRoutes(join(__dirname, 'content/products')),
                     // Without this, @nuxtjs/sitemap only bakes /sitemap.xml statically when
                     // isNuxtGenerate() is true, which checks for nitro.static/preset "static" -
                     // the netlify preset here is hybrid (prerendered pages + a fallback
diff --git a/nuxt/pages/product/[tier].vue b/nuxt/pages/product/[tier].vue
new file mode 100644
index 0000000000..2278576cae
--- /dev/null
+++ b/nuxt/pages/product/[tier].vue
@@ -0,0 +1,160 @@
+<script setup lang="ts">
+const route = useRoute()
+const tierId = route.params.tier as string
+
+const { data: tier } = await useAsyncData(`product-${tierId}`, () =>
+    queryCollection('products').where('tierId', '=', tierId).first()
+)
+
+if (!tier.value) {
+    throw createError({ statusCode: 404, statusMessage: 'Product not found' })
+}
+
+const { data: allProducts } = await useAsyncData('products-all', () =>
+    queryCollection('products').all()
+)
+
+const otherProducts = computed(() => (allProducts.value ?? [])
+    .filter(t => t.tierId !== tierId)
+    .map(t => ({
+        eyebrow: t.crossLinkEyebrow,
+        title: t.label,
+        description: t.crossLinkDescription,
+        image: t.heroImage,
+        to: `/product/${t.tierId}/`,
+    })))
+
+useSeoMeta({
+    title: tier.value.label,
+    description: tier.value.metaDescription,
+    ogUrl: `https://flowfuse.com/product/${tierId}/`,
+    twitterSite: '@FlowFuseinc',
+})
+
+const capture = useCapture()
+</script>
+
+<template>
+  <div class="w-full px-6">
+    <div class="max-w-screen-lg mx-auto pt-12">
+      <!-- Hero -->
+      <div class="grid md:grid-cols-2 gap-12 items-stretch">
+        <div class="text-center md:text-left">
+          <div class="mb-4 flex justify-center md:justify-start">
+            <span class="inline-flex items-center gap-2 rounded-lg border border-gray-200 bg-gray-50 px-3 py-1.5 text-gray-800">
+              <span class="font-medium">{{ tier.eyebrow }}</span>
+            </span>
+          </div>
+          <h1 class="text-4xl sm:text-5xl font-medium">{{ tier.headingLead }} <span class="text-red-600">{{ tier.headingHighlight }}</span></h1>
+          <p class="mt-6 text-lg max-w-xl mx-auto md:mx-0" v-html="tier.description" />
+          <div class="mt-8 flex flex-row flex-wrap gap-4 items-center justify-center md:justify-start">
+            <CtaBookDemo variant="highlight" :position="`${tierId}-hero`" />
+            <a class="ff-btn group flex flex-col" href="/pricing/" @click="capture('cta-pricing', { position: `${tierId}-hero` })">
+              <span class="flex items-center justify-center gap-2 text-base uppercase text-indigo-600 hover:text-indigo-800">
+                <span>VIEW PRICING</span>
+                <IconsArrowRightIcon class="w-5 h-5" />
+              </span>
+            </a>
+          </div>
+        </div>
+        <div class="rounded-lg shadow-2xl border-2 border-red-100 overflow-hidden">
+          <img :src="tier.heroImage.src" :alt="tier.heroImage.alt" class="w-full h-full object-cover" loading="eager">
+        </div>
+      </div>
+
+      <!-- Quote -->
+      <figure class="mt-24 border-l-4 border-red-100 pl-6">
+        <blockquote class="font-normal italic text-2xl m-0">
+          "{{ tier.quote.text }}"
+        </blockquote>
+        <figcaption class="mt-4 flex items-center gap-3 text-sm text-gray-500">
+          <span v-if="tier.quote.avatar" class="w-14 h-14 rounded-full bg-red-200 border-2 border-white shadow-md overflow-hidden shrink-0">
+            <img :src="tier.quote.avatar" :alt="tier.quote.author" class="w-full h-full object-cover">
+          </span>
+          <span>
+            <span class="font-semibold text-gray-700">{{ tier.quote.author }}</span> · {{ tier.quote.role }}
+          </span>
+        </figcaption>
+      </figure>
+
+      <!-- Fit -->
+      <div class="mt-24 grid md:grid-cols-2 gap-6">
+        <div class="rounded-lg bg-gradient-to-br to-indigo-50/50 from-red-50/50 border border-red-50 p-8">
+          <h3 class="text-lg font-semibold m-0 mb-8 text-center md:text-left">{{ tier.label }} is ideal for you if:</h3>
+          <ul class="m-0 p-0 flex flex-col gap-6">
+            <li v-for="(item, i) in tier.fitYes" :key="i" class="flex items-start gap-2 font-light text-gray-700">
+              <UIcon name="i-lucide-check" class="size-5 shrink-0 mt-0.5 text-red-600" />
+              <span v-html="item" />
+            </li>
+          </ul>
+        </div>
+        <div class="rounded-lg bg-gray-50 border border-gray-200 p-8">
+          <h3 class="text-lg font-semibold m-0 mb-8 text-center md:text-left">Don't pick {{ tier.label }} if:</h3>
+          <ul class="m-0 p-0 flex flex-col gap-6">
+            <li v-for="(item, i) in tier.fitNo" :key="i" class="flex items-start gap-2 font-light text-gray-700">
+              <UIcon name="i-lucide-x" class="size-5 shrink-0 mt-0.5 text-gray-400" />
+              <span v-html="item" />
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <!-- What's included -->
+      <div class="mt-24">
+        <div class="text-center md:text-left">
+          <h2 class="mb-3">What's Included in <span class="text-indigo-600">{{ tier.label }}</span></h2>
+          <p class="max-w-3xl mx-auto md:mx-0 mb-8">Every {{ tier.label }} deployment includes the core FlowFuse platform capabilities (governance, hosting, DevOps, security) plus these capabilities on top.</p>
+        </div>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <div v-for="group in tier.included" :key="group.title" class="rounded-lg border border-indigo-200 p-6">
+            <h3 class="text-lg font-semibold m-0 text-indigo-600 text-center md:text-left">{{ group.title }}</h3>
+            <div class="mt-4 flex flex-wrap gap-2 justify-center md:justify-start">
+              <template v-for="chip in group.chips" :key="typeof chip === 'string' ? chip : chip.label">
+                <NuxtLink
+                  v-if="typeof chip !== 'string'"
+                  :to="chip.href"
+                  class="inline-flex items-center gap-1 py-1.5 px-3 border border-gray-200 rounded-full text-sm font-medium text-gray-700 bg-white no-underline hover:no-underline transition-colors duration-150 after:text-indigo-300 hover:border-indigo-600 hover:text-indigo-600 hover:bg-indigo-50 hover:after:text-indigo-600"
+                >{{ chip.label }}</NuxtLink>
+                <span
+                  v-else
+                  class="inline-flex items-center py-1.5 px-3 rounded-full border border-gray-200 text-sm font-regular bg-gray-50"
+                >{{ chip }}</span>
+              </template>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Certified Nodes -->
+      <CertifiedNodes v-if="tier.certifiedDefault" class="mt-20" :default-tier="tier.certifiedDefault" />
+
+      <!-- Not sure -->
+      <div class="mt-24">
+        <h2 class="mb-6 text-center md:text-left">Not sure {{ tier.label }} is the right fit?</h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <NuxtLink v-for="product in otherProducts" :key="product.to" :to="product.to" class="group rounded-lg border border-indigo-100 bg-gradient-to-br from-white to-indigo-50/50 flex flex-col sm:flex-row gap-4 hover:no-underline">
+            <div class="ff-image-cover scale w-full h-40 sm:w-36 sm:h-auto shrink-0 sm:self-stretch rounded-t-lg sm:rounded-l-lg sm:rounded-tr-none">
+              <img :src="product.image.src" :alt="product.image.alt" loading="eager">
+            </div>
+            <div class="px-6 pb-6 sm:px-0 sm:py-6 sm:pr-6 text-center sm:text-left">
+              <div class="text-sm font-semibold uppercase tracking-wide text-red-300">{{ product.eyebrow }}</div>
+              <h3 class="text-2xl font-medium mt-2 mb-1">{{ product.title }}</h3>
+              <p class="m-0">{{ product.description }}</p>
+              <span class="mt-4 block text-indigo-600 group-hover:underline">See if {{ product.title }} fits better &rarr;</span>
+            </div>
+          </NuxtLink>
+        </div>
+      </div>
+    </div>
+
+    <div class="max-w-screen-lg mx-auto py-24">
+      <div class="rounded-xl px-9 py-12 flex flex-col items-center gap-8 text-center ff-get-started-bg">
+        <h2 class="text-white font-medium m-0 max-w-2xl">Join hundreds of global organizations building, governing, and deploying operational applications.</h2>
+        <div class="flex flex-col sm:flex-row gap-4 items-center">
+          <CtaBookDemo variant="highlight" :position="`${tierId}-final`" />
+          <CtaSignUp variant="ghost" color="white" icon="i-lucide-arrow-right" :position="`${tierId}-final`" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/nuxt/pages/product/index.vue b/nuxt/pages/product/index.vue
index fe7a445699..60eb7d3481 100644
--- a/nuxt/pages/product/index.vue
+++ b/nuxt/pages/product/index.vue
@@ -116,7 +116,7 @@ onUnmounted(() => {
               <h1 class="text-4xl md:text-5xl font-medium">
                 Build, deploy, and govern industrial applications - <span class="text-red-600">in record time</span>
               </h1>
-              <p class="mt-6 text-lg text-gray-500 max-w-xl mx-auto lg:mx-0">Bridge the gap between OT and IT teams using FlowFuse, the only comprehensive application platform with industrial AI and governance baked in.</p>
+              <p class="mt-6 text-lg max-w-xl mx-auto lg:mx-0">Bridge the gap between OT and IT teams using FlowFuse, the only comprehensive application platform with industrial AI and governance baked in.</p>
               <div class="mt-8 flex flex-row flex-wrap gap-4 items-center justify-center lg:justify-start">
                 <CtaBookDemo variant="highlight" position="hero" />
                 <a class="ff-btn group flex flex-col" href="/pricing/" @click="capture('cta-pricing', { position: 'hero' })">
@@ -182,7 +182,7 @@ onUnmounted(() => {
                     <h3 class="text-3xl mt-2">{{ tier.heading }}</h3>
                     <p class="mt-4 text-gray-500" v-html="tier.description" />
                     <ProseNote class="mt-4"><span v-html="tier.idealFit" /></ProseNote>
-                    <a class="mt-6 inline-flex items-center gap-1 font-medium blue-600 hover:underline" href="/pricing/" @click="capture('cta-learn-more', { position: `features-${tier.id}` })">Learn more about {{ tier.label }} &rarr;</a>
+                    <NuxtLink class="mt-6 inline-flex items-center gap-1 font-medium text-indigo-600 hover:underline" :to="`/product/${tier.id}/`" @click="capture('cta-learn-more', { position: `features-${tier.id}` })">Learn more about {{ tier.label }} &rarr;</NuxtLink>
                   </div>
                   <div class="min-h-64 rounded-lg overflow-hidden border border-gray-200">
                     <img :src="tier.image.src" :alt="tier.image.alt" class="block w-full h-full object-cover" loading="lazy">
diff --git a/nuxt/public/images/customer-headshots/dave-olsen-wenco.png b/nuxt/public/images/customer-headshots/dave-olsen-wenco.png
new file mode 100644
index 0000000000..45263e3440
Binary files /dev/null and b/nuxt/public/images/customer-headshots/dave-olsen-wenco.png differ
diff --git a/nuxt/public/images/customer-headshots/servan-petrosian-arch-systems.png b/nuxt/public/images/customer-headshots/servan-petrosian-arch-systems.png
new file mode 100644
index 0000000000..d50848c9f7
Binary files /dev/null and b/nuxt/public/images/customer-headshots/servan-petrosian-arch-systems.png differ
diff --git a/src/_data/chrome.json b/src/_data/chrome.json
index e5393f1485..6ba6b99864 100644
--- a/src/_data/chrome.json
+++ b/src/_data/chrome.json
@@ -6,15 +6,33 @@
                 "label": "Platform",
                 "columns": [
                     {
-                        "title": "Product",
+                        "title": "Overview",
                         "titleGrid": "xl:col-start-2 xl:row-start-1",
-                        "listClasses": "row-span-3 xl:col-start-2 xl:row-start-2",
+                        "listClasses": "row-span-6 xl:col-start-2 xl:row-start-2",
                         "links": [
                             {
-                                "label": "Features",
+                                "label": "Product",
                                 "href": "/product/",
                                 "icon": "star"
                             },
+                            {
+                                "label": "FlowFuse Edge",
+                                "href": "/product/edge/",
+                                "icon": "chip",
+                                "indent": true
+                            },
+                            {
+                                "label": "FlowFuse Hub",
+                                "href": "/product/hub/",
+                                "icon": "circle-stack",
+                                "indent": true
+                            },
+                            {
+                                "label": "FlowFuse Fleet",
+                                "href": "/product/fleet/",
+                                "icon": "server-stack",
+                                "indent": true
+                            },
                             {
                                 "label": "Security Statement",
                                 "href": "/platform/security/",
@@ -417,12 +435,24 @@
                 "gridClasses": "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-2 gap-x-8 gap-y-8",
                 "groups": [
                     {
-                        "title": "Product",
+                        "title": "Overview",
                         "links": [
                             {
-                                "label": "Features",
+                                "label": "Product",
                                 "href": "/product/"
                             },
+                            {
+                                "label": "FlowFuse Edge",
+                                "href": "/product/edge/"
+                            },
+                            {
+                                "label": "FlowFuse Hub",
+                                "href": "/product/hub/"
+                            },
+                            {
+                                "label": "FlowFuse Fleet",
+                                "href": "/product/fleet/"
+                            },
                             {
                                 "label": "Security Statement",
                                 "href": "/platform/security/"
diff --git a/src/_includes/layouts/base.njk b/src/_includes/layouts/base.njk
index 1d578f0e86..bf62556b3b 100644
--- a/src/_includes/layouts/base.njk
+++ b/src/_includes/layouts/base.njk
@@ -199,7 +199,7 @@ eleventyComputed:
                                 <li class="contents">
                                     <ul class="sub-menu grid grid-rows-subgrid ml-7 auto-rows-auto border-l-2 {{ col.listClasses }}">
                                         {%- for item in col.links %}
-                                        {% navoption item.label, item.href | resolveHref(site), 1, item.icon, item.solid %}{% endnavoption %}
+                                        {% navoption item.label, item.href | resolveHref(site), 1, item.icon, item.solid, item.indent and "nav-indent" %}{% endnavoption %}
                                         {%- endfor %}
                                     </ul>
                                 </li>
diff --git a/src/css/style.css b/src/css/style.css
index 93f8b06c49..a8ce5913c2 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -2896,6 +2896,17 @@ lite-youtube::before {
     margin-left: 0 !important;
     border-left: 0 !important;
 }
+/* Nested sub-items (e.g. product tiers under "Product"). Needs a dedicated
+   rule since #nav-content li's `border-none` reset above beats a bare
+   Tailwind border utility on layer order. */
+.ff-website header .ff-nav-dropdown > ul.mega ul.sub-menu li.nav-indent {
+    margin-left: 0.6rem !important;
+    padding-left: 0 !important;
+    border-left: 2px solid var(--color-gray-200) !important;
+}
+.ff-website header .ff-nav-dropdown > ul.mega ul.sub-menu li.nav-indent > a {
+    padding-left: 1rem !important;
+}
 /* Mobile accordion: eyebrows indent to the link icon column, moderate row
    height, and tap feedback via a text-hugging underline (the desktop
    animated line needs a text span the link markup does not have) */
@@ -2911,6 +2922,14 @@ lite-youtube::before {
         padding-bottom: 0.5rem !important;
         padding-left: 2.5rem !important; /* indent links under the section eyebrow (1.5rem) */
     }
+    /* Same centering math as the desktop rule above, but against this
+       breakpoint's pl-2.5rem (40px) icon column: 40px + 10px = 50px = 3.125rem. */
+    .ff-website header .ff-nav-dropdown > ul.mega ul.sub-menu li.nav-indent {
+        margin-left: 3.125rem !important;
+    }
+    .ff-website header .ff-nav-dropdown > ul.mega ul.sub-menu li.nav-indent > a {
+        padding-left: 0.75rem !important;
+    }
     /* Roomier mobile drawer: inset the whole menu and enlarge the top-level item
        labels for easier tapping. Scoped to mobile only; desktop nav unaffected.
        NOTE: horizontal padding is always safe, but vertical padding must apply