From 51257e004f3bf8e1d0e1a101ca8529b01a7833fd Mon Sep 17 00:00:00 2001
From: yusufipk <yusufipek@protonmail.com>
Date: Sun, 14 Jun 2026 16:36:26 +0200
Subject: [PATCH] Add SEO comparison landing pages and footer compare links.

Introduces dynamic marketing comparison routes, competitor data, and Compare sections on the homepage and marketing footer.
---
 app/(marketing)/[slug]/page.tsx               |  58 ++
 app/sitemap.ts                                |  25 +
 components/LandingPage.tsx                    |  57 +-
 components/marketing/comparison-page.tsx      | 224 ++++++
 .../marketing/feature-comparison-table.tsx    |  68 ++
 .../marketing/marketing-compare-links.tsx     |  23 +
 components/marketing/marketing-footer.tsx     |  48 ++
 components/marketing/marketing-header.tsx     |  77 ++
 components/marketing/pricing-comparison.tsx   |  34 +
 components/marketing/product-visual.tsx       | 175 +++++
 lib/marketing/comparison-pages.ts             | 716 ++++++++++++++++++
 lib/marketing/comparison-sources.ts           | 571 ++++++++++++++
 lib/marketing/comparison-types.ts             |  91 +++
 lib/marketing/metadata.ts                     | 106 +++
 14 files changed, 2248 insertions(+), 25 deletions(-)
 create mode 100644 app/(marketing)/[slug]/page.tsx
 create mode 100644 components/marketing/comparison-page.tsx
 create mode 100644 components/marketing/feature-comparison-table.tsx
 create mode 100644 components/marketing/marketing-compare-links.tsx
 create mode 100644 components/marketing/marketing-footer.tsx
 create mode 100644 components/marketing/marketing-header.tsx
 create mode 100644 components/marketing/pricing-comparison.tsx
 create mode 100644 components/marketing/product-visual.tsx
 create mode 100644 lib/marketing/comparison-pages.ts
 create mode 100644 lib/marketing/comparison-sources.ts
 create mode 100644 lib/marketing/comparison-types.ts
 create mode 100644 lib/marketing/metadata.ts

diff --git a/app/(marketing)/[slug]/page.tsx b/app/(marketing)/[slug]/page.tsx
new file mode 100644
index 0000000..d62d136
--- /dev/null
+++ b/app/(marketing)/[slug]/page.tsx
@@ -0,0 +1,58 @@
+import type { Metadata } from 'next';
+import { notFound } from 'next/navigation';
+import { ComparisonPage } from '@/components/marketing/comparison-page';
+import { auth } from '@/lib/auth';
+import { comparisonPages, getComparisonPage } from '@/lib/marketing/comparison-pages';
+import { buildComparisonJsonLd, buildComparisonMetadata } from '@/lib/marketing/metadata';
+
+interface MarketingSlugPageProps {
+  params: Promise<{ slug: string }>;
+}
+
+export function generateStaticParams() {
+  return comparisonPages.map((page) => ({ slug: page.slug }));
+}
+
+export async function generateMetadata({ params }: MarketingSlugPageProps): Promise<Metadata> {
+  const { slug } = await params;
+  const page = getComparisonPage(slug);
+
+  if (!page) {
+    return {};
+  }
+
+  return buildComparisonMetadata({
+    title: page.title,
+    description: page.metaDescription,
+    path: `/${page.slug}`,
+    keywords: page.keywords,
+  });
+}
+
+export default async function MarketingSlugPage({ params }: MarketingSlugPageProps) {
+  const { slug } = await params;
+  const page = getComparisonPage(slug);
+
+  if (!page) {
+    notFound();
+  }
+
+  const session = await auth();
+  const structuredData = buildComparisonJsonLd({
+    title: page.title,
+    description: page.metaDescription,
+    path: `/${page.slug}`,
+    faq: page.faq,
+  });
+  const safeStructuredData = JSON.stringify(structuredData).replace(/</g, '\\u003c');
+
+  return (
+    <>
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{ __html: safeStructuredData }}
+      />
+      <ComparisonPage page={page} isLoggedIn={Boolean(session?.user)} />
+    </>
+  );
+}
diff --git a/app/sitemap.ts b/app/sitemap.ts
index 4d5eb7f..abb5488 100644
--- a/app/sitemap.ts
+++ b/app/sitemap.ts
@@ -1,4 +1,5 @@
 import type { MetadataRoute } from 'next';
+import { comparisonPages } from '@/lib/marketing/comparison-pages';
 import { seoConfig } from '@/lib/seo';
 
 export default function sitemap(): MetadataRoute.Sitemap {
@@ -11,6 +12,12 @@ export default function sitemap(): MetadataRoute.Sitemap {
       changeFrequency: 'daily',
       priority: 1,
     },
+    ...comparisonPages.map((page) => ({
+      url: `${seoConfig.url}/${page.slug}`,
+      lastModified,
+      changeFrequency: 'monthly' as const,
+      priority: 0.8,
+    })),
     {
       url: `${seoConfig.url}/login`,
       lastModified,
@@ -23,5 +30,23 @@ export default function sitemap(): MetadataRoute.Sitemap {
       changeFrequency: 'monthly',
       priority: 0.7,
     },
+    {
+      url: `${seoConfig.url}/terms`,
+      lastModified,
+      changeFrequency: 'yearly',
+      priority: 0.3,
+    },
+    {
+      url: `${seoConfig.url}/privacy`,
+      lastModified,
+      changeFrequency: 'yearly',
+      priority: 0.3,
+    },
+    {
+      url: `${seoConfig.url}/refund`,
+      lastModified,
+      changeFrequency: 'yearly',
+      priority: 0.3,
+    },
   ];
 }
diff --git a/components/LandingPage.tsx b/components/LandingPage.tsx
index e92618f..b97b21b 100644
--- a/components/LandingPage.tsx
+++ b/components/LandingPage.tsx
@@ -2,6 +2,7 @@
 
 import Image from 'next/image';
 import Link from 'next/link';
+import { MarketingCompareLinks } from '@/components/marketing/marketing-compare-links';
 import { useEffect, useRef } from 'react';
 import { gsap } from 'gsap';
 import {
@@ -880,35 +881,41 @@ export function LandingPage({ isLoggedIn }: LandingPageProps) {
       </main>
 
       <footer className="border-t border-border bg-background px-4 py-8 sm:px-6 lg:px-8">
-        <div className="mx-auto flex max-w-[1200px] flex-col items-center justify-between gap-4 sm:flex-row">
-          <div className="flex items-center gap-2">
-            <Video className="h-4 w-4 text-primary" />
+        <div className="mx-auto grid max-w-[1200px] gap-8 sm:grid-cols-2 lg:grid-cols-3">
+          <div className="flex items-start gap-2">
+            <Video className="mt-0.5 h-4 w-4 shrink-0 text-primary" />
             <span className="font-mono text-xs text-muted-foreground">
               © 2026 IPEK TECH LLC. All rights reserved.
             </span>
           </div>
-          <div className="flex flex-wrap justify-center gap-4">
-            <a
-              href="mailto:info@open-frame.net"
-              className="text-xs text-muted-foreground hover:text-foreground"
-            >
-              info@open-frame.net
-            </a>
-            <a
-              href="https://github.com/yusufipk/OpenFrame"
-              className="text-xs text-muted-foreground hover:text-foreground"
-            >
-              GitHub
-            </a>
-            <Link href="/terms" className="text-xs text-muted-foreground hover:text-foreground">
-              Terms
-            </Link>
-            <Link href="/privacy" className="text-xs text-muted-foreground hover:text-foreground">
-              Privacy
-            </Link>
-            <Link href="/refund" className="text-xs text-muted-foreground hover:text-foreground">
-              Refund Policy
-            </Link>
+          <MarketingCompareLinks />
+          <div className="flex flex-col gap-2">
+            <span className="font-mono text-[10px] uppercase tracking-wider text-muted-foreground">
+              Legal
+            </span>
+            <div className="flex flex-col gap-1.5">
+              <a
+                href="mailto:info@open-frame.net"
+                className="text-xs text-muted-foreground hover:text-foreground"
+              >
+                info@open-frame.net
+              </a>
+              <a
+                href="https://github.com/yusufipk/OpenFrame"
+                className="text-xs text-muted-foreground hover:text-foreground"
+              >
+                GitHub
+              </a>
+              <Link href="/terms" className="text-xs text-muted-foreground hover:text-foreground">
+                Terms
+              </Link>
+              <Link href="/privacy" className="text-xs text-muted-foreground hover:text-foreground">
+                Privacy
+              </Link>
+              <Link href="/refund" className="text-xs text-muted-foreground hover:text-foreground">
+                Refund Policy
+              </Link>
+            </div>
           </div>
         </div>
       </footer>
diff --git a/components/marketing/comparison-page.tsx b/components/marketing/comparison-page.tsx
new file mode 100644
index 0000000..7c7a431
--- /dev/null
+++ b/components/marketing/comparison-page.tsx
@@ -0,0 +1,224 @@
+import Link from 'next/link';
+import { ArrowRight, Github, MoveRight } from 'lucide-react';
+import { FeatureComparisonTable } from '@/components/marketing/feature-comparison-table';
+import { MarketingFooter } from '@/components/marketing/marketing-footer';
+import { MarketingHeader } from '@/components/marketing/marketing-header';
+import { PricingComparison } from '@/components/marketing/pricing-comparison';
+import { ProductVisual } from '@/components/marketing/product-visual';
+import type { ComparisonPageDefinition } from '@/lib/marketing/comparison-types';
+import { getCompetitorName, comparisonPageMap } from '@/lib/marketing/comparison-pages';
+import { seoConfig } from '@/lib/seo';
+
+interface ComparisonPageProps {
+  page: ComparisonPageDefinition;
+  isLoggedIn: boolean;
+}
+
+export function ComparisonPage({ page, isLoggedIn }: ComparisonPageProps) {
+  const hostedCtaHref = isLoggedIn ? '/dashboard' : '/register';
+  const competitorName = getCompetitorName(page) ?? 'Alternatives';
+  const relatedSlugs = page.relatedSlugs.filter((slug) => slug in comparisonPageMap);
+
+  return (
+    <div className="min-h-screen bg-background text-foreground font-sans">
+      <MarketingHeader isLoggedIn={isLoggedIn} />
+
+      <main>
+        <section className="border-b border-border px-4 py-16 sm:px-6 lg:px-8 lg:py-24">
+          <div className="mx-auto grid w-full max-w-[1200px] gap-12 lg:grid-cols-[1.1fr_0.9fr] lg:items-center">
+            <div>
+              <p className="text-xs font-medium uppercase tracking-[0.16em] text-primary">
+                {page.eyebrow}
+              </p>
+              <h1 className="mt-4 text-4xl font-semibold tracking-[-0.03em] md:text-6xl">
+                {page.headline}
+              </h1>
+              <p className="mt-6 max-w-2xl text-base text-muted-foreground md:text-lg">
+                {page.subheadline}
+              </p>
+              <p className="mt-4 max-w-2xl border border-primary/30 bg-primary/5 px-4 py-3 text-sm text-foreground/90 md:text-base">
+                <span className="font-medium text-primary">No per-member or guest fees.</span> One
+                $10/month hosted plan covers your whole team and every client reviewer link.
+              </p>
+              <div className="mt-8 flex flex-col gap-3 sm:flex-row">
+                <Link
+                  href={hostedCtaHref}
+                  className="group relative isolate inline-flex h-12 items-center justify-center overflow-hidden border border-primary bg-primary px-8 text-sm font-medium text-primary-foreground transition-transform duration-300 hover:scale-[1.02]"
+                >
+                  Start free trial
+                  <MoveRight className="ml-2 h-4 w-4 transition-transform group-hover:translate-x-1" />
+                </Link>
+                <a
+                  href={seoConfig.githubUrl}
+                  target="_blank"
+                  rel="noreferrer"
+                  className="inline-flex h-12 items-center justify-center border border-border bg-background px-8 text-sm font-medium text-foreground transition-colors hover:bg-card"
+                >
+                  <Github className="mr-2 h-4 w-4" />
+                  View GitHub
+                </a>
+              </div>
+            </div>
+            <ProductVisual variant={page.visualVariant} />
+          </div>
+        </section>
+
+        <section className="border-b border-border px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto w-full max-w-[1200px]">
+            <h2 className="text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
+              {page.solutionTitle}
+            </h2>
+            <p className="mt-4 max-w-3xl text-base text-muted-foreground md:text-lg">
+              {page.solutionNarrative}
+            </p>
+          </div>
+        </section>
+
+        <section className="border-b border-border bg-background px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto grid w-full max-w-[1200px] gap-8 lg:grid-cols-2">
+            <div className="border border-primary/30 bg-primary/5 p-6">
+              <h3 className="text-xl font-semibold">Where OpenFrame fits best</h3>
+              <ul className="mt-4 space-y-3 text-sm text-foreground/90 md:text-base">
+                {page.bestForOpenFrame.map((item) => (
+                  <li key={item}>- {item}</li>
+                ))}
+              </ul>
+            </div>
+            <div className="border border-border bg-card p-6">
+              <h3 className="text-xl font-semibold">Where {competitorName} may still fit</h3>
+              <ul className="mt-4 space-y-3 text-sm text-muted-foreground md:text-base">
+                {page.bestForCompetitor.map((item) => (
+                  <li key={item}>- {item}</li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <section className="border-b border-border bg-card/10 px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto grid w-full max-w-[1200px] gap-8 lg:grid-cols-2">
+            <div>
+              <h3 className="text-2xl font-semibold">OpenFrame advantages</h3>
+              <ul className="mt-4 space-y-3 text-sm md:text-base">
+                {page.openframeWins.map((item) => (
+                  <li key={item} className="border border-border bg-background p-4">
+                    {item}
+                  </li>
+                ))}
+              </ul>
+            </div>
+            <div>
+              <h3 className="text-2xl font-semibold">{competitorName} advantages</h3>
+              <ul className="mt-4 space-y-3 text-sm text-muted-foreground md:text-base">
+                {page.competitorWins.map((item) => (
+                  <li key={item} className="border border-border bg-background p-4">
+                    {item}
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <section className="border-b border-border px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto w-full max-w-[1200px] space-y-8">
+            <div>
+              <h2 className="text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
+                Feature comparison
+              </h2>
+              <p className="mt-3 max-w-3xl text-sm text-muted-foreground md:text-base">
+                Honest tradeoffs based on official product, pricing, and help documentation. Verify
+                current plans before buying.
+              </p>
+            </div>
+            <FeatureComparisonTable rows={page.featureRows} competitorName={competitorName} />
+          </div>
+        </section>
+
+        <section className="border-b border-border bg-[#0a0a0a] px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto w-full max-w-[1200px] space-y-8">
+            <div>
+              <h2 className="text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
+                Pricing comparison
+              </h2>
+              <p className="mt-3 max-w-3xl text-sm text-muted-foreground md:text-base">
+                OpenFrame is $10/month flat with a 7-day free trial. You do not pay per team member,
+                collaborator, or guest reviewer. Self-hosting is free with Docker.
+              </p>
+            </div>
+            <PricingComparison
+              rows={page.pricingRows}
+              footnote={page.pricingFootnote}
+              competitorName={competitorName}
+            />
+          </div>
+        </section>
+
+        <section className="border-b border-border px-4 py-16 sm:px-6 lg:px-8 lg:py-20">
+          <div className="mx-auto w-full max-w-[1200px]">
+            <h2 className="text-3xl font-semibold tracking-[-0.02em] md:text-4xl">FAQ</h2>
+            <div className="mt-8 space-y-4">
+              {page.faq.map((item) => (
+                <div key={item.question} className="border border-border bg-card p-6">
+                  <h3 className="text-lg font-semibold">{item.question}</h3>
+                  <p className="mt-2 text-sm text-muted-foreground md:text-base">{item.answer}</p>
+                </div>
+              ))}
+            </div>
+          </div>
+        </section>
+
+        {relatedSlugs.length > 0 ? (
+          <section className="border-b border-border bg-card/10 px-4 py-12 sm:px-6 lg:px-8">
+            <div className="mx-auto w-full max-w-[1200px]">
+              <h2 className="text-xl font-semibold">Related comparisons</h2>
+              <div className="mt-4 flex flex-wrap gap-3">
+                {relatedSlugs.map((slug) => (
+                  <Link
+                    key={slug}
+                    href={`/${slug}`}
+                    className="inline-flex items-center gap-2 border border-border bg-background px-4 py-2 text-sm text-muted-foreground transition-colors hover:text-foreground"
+                  >
+                    {slug.replaceAll('-', ' ')}
+                    <ArrowRight className="h-3.5 w-3.5" />
+                  </Link>
+                ))}
+              </div>
+            </div>
+          </section>
+        ) : null}
+
+        <section className="px-4 py-16 sm:px-6 lg:px-8">
+          <div className="mx-auto flex w-full max-w-[1200px] flex-col items-center justify-between gap-4 border border-border bg-card p-8 text-center md:flex-row md:text-left">
+            <div>
+              <h2 className="text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
+                Start your free trial
+              </h2>
+              <p className="mt-2 text-sm text-muted-foreground">
+                Your first client review link takes minutes.
+              </p>
+            </div>
+            <div className="flex flex-col gap-3 sm:flex-row">
+              <Link
+                href={hostedCtaHref}
+                className="inline-flex h-12 items-center justify-center border border-primary bg-primary px-8 text-sm font-medium text-primary-foreground"
+              >
+                Start free trial
+              </Link>
+              <a
+                href={seoConfig.githubUrl}
+                target="_blank"
+                rel="noreferrer"
+                className="inline-flex h-12 items-center justify-center border border-border bg-background px-8 text-sm font-medium text-foreground"
+              >
+                View GitHub
+              </a>
+            </div>
+          </div>
+        </section>
+      </main>
+
+      <MarketingFooter />
+    </div>
+  );
+}
diff --git a/components/marketing/feature-comparison-table.tsx b/components/marketing/feature-comparison-table.tsx
new file mode 100644
index 0000000..e9144c5
--- /dev/null
+++ b/components/marketing/feature-comparison-table.tsx
@@ -0,0 +1,68 @@
+import { Check, Minus, X } from 'lucide-react';
+import type { FeatureRow } from '@/lib/marketing/comparison-types';
+
+function renderStatus(value: FeatureRow['openframe']) {
+  if (value === 'yes') {
+    return (
+      <span className="inline-flex items-center gap-1 text-emerald-400">
+        <Check className="h-4 w-4" />
+        Yes
+      </span>
+    );
+  }
+
+  if (value === 'no') {
+    return (
+      <span className="inline-flex items-center gap-1 text-red-400/90">
+        <X className="h-4 w-4" />
+        No
+      </span>
+    );
+  }
+
+  if (value === 'partial') {
+    return (
+      <span className="inline-flex items-center gap-1 text-amber-300">
+        <Minus className="h-4 w-4" />
+        Partial
+      </span>
+    );
+  }
+
+  return <span className="text-foreground/90">{value}</span>;
+}
+
+interface FeatureComparisonTableProps {
+  rows: FeatureRow[];
+  competitorName: string;
+}
+
+export function FeatureComparisonTable({ rows, competitorName }: FeatureComparisonTableProps) {
+  return (
+    <div className="overflow-x-auto border border-border bg-card">
+      <table className="min-w-full text-left text-sm">
+        <thead className="border-b border-border bg-background/60">
+          <tr>
+            <th className="px-4 py-3 font-medium text-muted-foreground">Feature</th>
+            <th className="px-4 py-3 font-medium text-primary">OpenFrame</th>
+            <th className="px-4 py-3 font-medium text-muted-foreground">{competitorName}</th>
+          </tr>
+        </thead>
+        <tbody>
+          {rows.map((row) => (
+            <tr key={row.label} className="border-b border-border/60 last:border-b-0">
+              <td className="px-4 py-3 align-top">
+                <div className="font-medium text-foreground">{row.label}</div>
+                {row.note ? (
+                  <div className="mt-1 text-xs text-muted-foreground">{row.note}</div>
+                ) : null}
+              </td>
+              <td className="px-4 py-3 align-top">{renderStatus(row.openframe)}</td>
+              <td className="px-4 py-3 align-top">{renderStatus(row.competitor)}</td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+}
diff --git a/components/marketing/marketing-compare-links.tsx b/components/marketing/marketing-compare-links.tsx
new file mode 100644
index 0000000..11a1e83
--- /dev/null
+++ b/components/marketing/marketing-compare-links.tsx
@@ -0,0 +1,23 @@
+import Link from 'next/link';
+import { compareFooterLinks } from '@/lib/marketing/comparison-pages';
+
+export function MarketingCompareLinks() {
+  return (
+    <div className="flex flex-col gap-2">
+      <span className="font-mono text-[10px] uppercase tracking-wider text-muted-foreground">
+        Compare
+      </span>
+      <nav className="flex flex-col gap-1.5">
+        {compareFooterLinks.map((link) => (
+          <Link
+            key={link.href}
+            href={link.href}
+            className="text-xs text-muted-foreground hover:text-foreground"
+          >
+            {link.label}
+          </Link>
+        ))}
+      </nav>
+    </div>
+  );
+}
diff --git a/components/marketing/marketing-footer.tsx b/components/marketing/marketing-footer.tsx
new file mode 100644
index 0000000..1b25128
--- /dev/null
+++ b/components/marketing/marketing-footer.tsx
@@ -0,0 +1,48 @@
+import Link from 'next/link';
+import { Video } from 'lucide-react';
+import { seoConfig } from '@/lib/seo';
+import { MarketingCompareLinks } from '@/components/marketing/marketing-compare-links';
+
+export function MarketingFooter() {
+  return (
+    <footer className="border-t border-border bg-background px-4 py-8 sm:px-6 lg:px-8">
+      <div className="mx-auto grid max-w-[1200px] gap-8 sm:grid-cols-2 lg:grid-cols-3">
+        <div className="flex items-start gap-2">
+          <Video className="mt-0.5 h-4 w-4 shrink-0 text-primary" />
+          <span className="font-mono text-xs text-muted-foreground">
+            © 2026 IPEK TECH LLC. All rights reserved.
+          </span>
+        </div>
+        <MarketingCompareLinks />
+        <div className="flex flex-col gap-2">
+          <span className="font-mono text-[10px] uppercase tracking-wider text-muted-foreground">
+            Legal
+          </span>
+          <div className="flex flex-col gap-1.5">
+            <a
+              href="mailto:info@open-frame.net"
+              className="text-xs text-muted-foreground hover:text-foreground"
+            >
+              info@open-frame.net
+            </a>
+            <a
+              href={seoConfig.githubUrl}
+              className="text-xs text-muted-foreground hover:text-foreground"
+            >
+              GitHub
+            </a>
+            <Link href="/terms" className="text-xs text-muted-foreground hover:text-foreground">
+              Terms
+            </Link>
+            <Link href="/privacy" className="text-xs text-muted-foreground hover:text-foreground">
+              Privacy
+            </Link>
+            <Link href="/refund" className="text-xs text-muted-foreground hover:text-foreground">
+              Refund Policy
+            </Link>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+}
diff --git a/components/marketing/marketing-header.tsx b/components/marketing/marketing-header.tsx
new file mode 100644
index 0000000..85c7286
--- /dev/null
+++ b/components/marketing/marketing-header.tsx
@@ -0,0 +1,77 @@
+import Link from 'next/link';
+import { MoveRight, Video } from 'lucide-react';
+import { seoConfig } from '@/lib/seo';
+
+const controlButtonClass =
+  'group relative isolate inline-flex h-8 items-center justify-center overflow-hidden border border-border bg-background px-2.5 text-[11px] font-medium text-foreground transition-colors duration-300 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring sm:h-9 sm:px-4 sm:text-xs';
+
+interface MarketingHeaderProps {
+  isLoggedIn: boolean;
+}
+
+export function MarketingHeader({ isLoggedIn }: MarketingHeaderProps) {
+  const hostedCtaHref = isLoggedIn ? '/dashboard' : '/register';
+
+  return (
+    <header className="border-b border-border bg-background/90 backdrop-blur-md">
+      <div className="mx-auto flex h-14 w-full max-w-[1200px] items-center justify-between px-4 sm:h-16 sm:px-6 lg:px-10">
+        <Link
+          href="/"
+          className="group relative isolate inline-flex items-center gap-2 overflow-hidden border border-border bg-background px-3 py-2"
+        >
+          <span className="pointer-events-none absolute inset-0 -translate-x-[101%] bg-primary/10 transition-transform duration-300 group-hover:translate-x-0" />
+          <Video className="relative z-10 h-4 w-4 text-primary" />
+          <span className="relative z-10 text-xs font-semibold tracking-[0.12em]">OPENFRAME</span>
+        </Link>
+
+        <nav className="hidden items-center gap-6 text-[11px] font-medium uppercase tracking-[0.14em] md:flex">
+          <Link
+            className="text-muted-foreground transition-colors hover:text-foreground"
+            href="/#features"
+          >
+            Features
+          </Link>
+          <Link
+            className="text-muted-foreground transition-colors hover:text-foreground"
+            href="/#pricing"
+          >
+            Pricing
+          </Link>
+          <a
+            className="text-muted-foreground transition-colors hover:text-foreground"
+            href={seoConfig.githubUrl}
+            target="_blank"
+            rel="noreferrer"
+          >
+            GitHub
+          </a>
+        </nav>
+
+        <div className="flex items-center gap-2">
+          {isLoggedIn ? (
+            <Link href="/dashboard" className={controlButtonClass}>
+              <span className="pointer-events-none absolute inset-0 -translate-x-[101%] bg-primary/10 transition-transform duration-300 group-hover:translate-x-0" />
+              <span className="relative z-10 inline-flex items-center gap-2">
+                Dashboard
+                <MoveRight className="h-3.5 w-3.5" />
+              </span>
+            </Link>
+          ) : (
+            <>
+              <Link
+                href="/login"
+                className="mr-4 hidden text-xs font-medium text-muted-foreground hover:text-foreground sm:block"
+              >
+                Log in
+              </Link>
+              <Link href={hostedCtaHref} className={controlButtonClass}>
+                <span className="pointer-events-none absolute inset-0 -translate-x-[101%] bg-primary/10 transition-transform duration-300 group-hover:translate-x-0" />
+                <span className="relative z-10">Start free trial</span>
+              </Link>
+            </>
+          )}
+        </div>
+      </div>
+    </header>
+  );
+}
diff --git a/components/marketing/pricing-comparison.tsx b/components/marketing/pricing-comparison.tsx
new file mode 100644
index 0000000..e2b4d4e
--- /dev/null
+++ b/components/marketing/pricing-comparison.tsx
@@ -0,0 +1,34 @@
+import type { PricingRow } from '@/lib/marketing/comparison-types';
+
+interface PricingComparisonProps {
+  rows: PricingRow[];
+  footnote?: string;
+  competitorName: string;
+}
+
+export function PricingComparison({ rows, footnote, competitorName }: PricingComparisonProps) {
+  return (
+    <div className="space-y-4">
+      <div className="grid gap-4 md:grid-cols-2">
+        {rows.map((row) => (
+          <div key={row.label} className="border border-border bg-card p-5">
+            <p className="text-xs uppercase tracking-[0.14em] text-muted-foreground">{row.label}</p>
+            <div className="mt-4 grid gap-3 sm:grid-cols-2">
+              <div>
+                <p className="text-[10px] uppercase tracking-[0.12em] text-primary">OpenFrame</p>
+                <p className="mt-1 text-sm text-foreground">{row.openframe}</p>
+              </div>
+              <div>
+                <p className="text-[10px] uppercase tracking-[0.12em] text-muted-foreground">
+                  {competitorName}
+                </p>
+                <p className="mt-1 text-sm text-foreground/90">{row.competitor}</p>
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+      {footnote ? <p className="text-xs text-muted-foreground">{footnote}</p> : null}
+    </div>
+  );
+}
diff --git a/components/marketing/product-visual.tsx b/components/marketing/product-visual.tsx
new file mode 100644
index 0000000..973c489
--- /dev/null
+++ b/components/marketing/product-visual.tsx
@@ -0,0 +1,175 @@
+import Image from 'next/image';
+import { CheckCircle, Link as LinkIcon, MessageSquare, Mic, PenTool } from 'lucide-react';
+import type { VisualVariant } from '@/lib/marketing/comparison-types';
+
+interface ProductVisualProps {
+  variant: VisualVariant;
+}
+
+export function ProductVisual({ variant }: ProductVisualProps) {
+  if (variant === 'landing-compare') {
+    return (
+      <div className="relative aspect-[16/10] overflow-hidden border border-border bg-card">
+        <Image
+          src="/landing/compare-v2.webp"
+          alt="OpenFrame side-by-side version compare"
+          fill
+          className="object-cover object-top"
+          sizes="(max-width: 768px) 100vw, 540px"
+          priority
+        />
+      </div>
+    );
+  }
+
+  if (variant === 'landing-dashboard') {
+    return (
+      <div className="relative aspect-[16/10] overflow-hidden border border-border bg-card">
+        <Image
+          src="/landing/deep-dive-dashboard-2.webp"
+          alt="OpenFrame video review dashboard"
+          fill
+          className="object-cover object-top"
+          sizes="(max-width: 768px) 100vw, 540px"
+          priority
+        />
+      </div>
+    );
+  }
+
+  if (variant === 'version-compare') {
+    return (
+      <div className="border border-border bg-card p-4">
+        <div className="grid gap-3 md:grid-cols-2">
+          {['V2', 'V3'].map((version) => (
+            <div key={version} className="border border-border/60 bg-background p-3">
+              <div className="mb-3 flex items-center justify-between text-[10px] uppercase tracking-[0.14em] text-muted-foreground">
+                <span>{version}</span>
+                <span className="text-primary">Compare mode</span>
+              </div>
+              <div className="aspect-video bg-gradient-to-br from-zinc-900 via-zinc-800 to-zinc-900" />
+              <div className="mt-3 space-y-2">
+                <div className="h-1.5 w-full rounded-full bg-border">
+                  <div
+                    className={`h-1.5 rounded-full bg-primary ${version === 'V2' ? 'w-1/3' : 'w-2/3'}`}
+                  />
+                </div>
+                <p className="font-mono text-[10px] text-muted-foreground">
+                  {version === 'V2' ? '00:01:12 color too cool' : '00:01:12 warmed up +2'}
+                </p>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+    );
+  }
+
+  if (variant === 'approval-workflow') {
+    return (
+      <div className="border border-border bg-card p-5">
+        <div className="flex items-center justify-between border-b border-border pb-4">
+          <div>
+            <p className="text-xs uppercase tracking-[0.14em] text-muted-foreground">
+              Client Cut V3
+            </p>
+            <p className="mt-1 text-lg font-semibold">Approval requests</p>
+          </div>
+          <span className="inline-flex items-center gap-2 border border-emerald-500/30 bg-emerald-500/10 px-3 py-1 text-xs text-emerald-300">
+            <CheckCircle className="h-3.5 w-3.5" />2 of 3 approved
+          </span>
+        </div>
+        <div className="mt-4 space-y-3">
+          {[
+            { name: 'Client Producer', status: 'Approved', tone: 'text-emerald-300' },
+            { name: 'Brand Manager', status: 'Approved', tone: 'text-emerald-300' },
+            { name: 'Legal Review', status: 'Pending', tone: 'text-amber-300' },
+          ].map((item) => (
+            <div
+              key={item.name}
+              className="flex items-center justify-between border border-border/60 bg-background px-4 py-3"
+            >
+              <span className="text-sm">{item.name}</span>
+              <span className={`text-xs uppercase tracking-[0.12em] ${item.tone}`}>
+                {item.status}
+              </span>
+            </div>
+          ))}
+        </div>
+      </div>
+    );
+  }
+
+  if (variant === 'guest-review') {
+    return (
+      <div className="border border-border bg-card p-5">
+        <div className="flex items-start gap-3 border border-primary/30 bg-primary/5 p-4">
+          <LinkIcon className="mt-0.5 h-5 w-5 text-primary" />
+          <div>
+            <p className="text-sm font-medium">open-frame.net/watch/share-7f3a</p>
+            <p className="mt-1 text-sm text-muted-foreground">
+              Client opens the link, enters a name, and reviews in the browser. No account required.
+            </p>
+          </div>
+        </div>
+        <div className="mt-4 aspect-video border border-border/60 bg-gradient-to-br from-zinc-900 via-zinc-800 to-zinc-950" />
+        <div className="mt-4 flex items-center gap-3 border border-border/60 bg-background p-3">
+          <MessageSquare className="h-4 w-4 text-primary" />
+          <div>
+            <p className="text-sm font-medium">Client note at 00:02:14</p>
+            <p className="text-xs text-muted-foreground">Lower the music under the VO here.</p>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  if (variant === 'voice-notes') {
+    return (
+      <div className="border border-border bg-card p-5">
+        <div className="flex items-start justify-between">
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center bg-secondary font-mono text-xs">
+              C
+            </div>
+            <div>
+              <p className="font-mono text-[11px] font-medium">Client</p>
+              <p className="font-mono text-[10px] text-muted-foreground">00:03:45</p>
+            </div>
+          </div>
+          <Mic className="h-4 w-4 text-primary" />
+        </div>
+        <div className="mt-6 flex h-16 items-center gap-1 overflow-hidden">
+          {Array.from({ length: 36 }).map((_, index) => (
+            <span
+              key={index}
+              className="w-full flex-1 bg-primary/60"
+              style={{
+                height: `${[30, 80, 50, 90, 40, 70, 60, 45, 85, 55][index % 10]}%`,
+              }}
+            />
+          ))}
+        </div>
+        <p className="mt-4 text-sm text-muted-foreground">
+          Voice note pinned to the exact frame—no more typing long explanations.
+        </p>
+      </div>
+    );
+  }
+
+  return (
+    <div className="border border-border bg-card p-5">
+      <div className="aspect-video border border-border/60 bg-gradient-to-br from-zinc-900 via-zinc-800 to-zinc-950" />
+      <div className="relative mt-4 border border-border/60 bg-background p-4">
+        <div className="absolute right-4 top-4 rounded-full border border-primary/40 p-2 text-primary">
+          <PenTool className="h-4 w-4" />
+        </div>
+        <p className="font-mono text-[10px] text-muted-foreground">00:01:48</p>
+        <p className="mt-2 text-sm">Move the lower third up one line so it clears the subject.</p>
+        <div className="mt-4 h-1.5 w-full rounded-full bg-border">
+          <div className="h-1.5 w-[42%] rounded-full bg-primary" />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/lib/marketing/comparison-pages.ts b/lib/marketing/comparison-pages.ts
new file mode 100644
index 0000000..a94cd6e
--- /dev/null
+++ b/lib/marketing/comparison-pages.ts
@@ -0,0 +1,716 @@
+import type {
+  ComparisonPageDefinition,
+  FeatureRow,
+  PricingRow,
+} from '@/lib/marketing/comparison-types';
+import { competitorProfiles, openFrameProfile } from '@/lib/marketing/comparison-sources';
+
+const commonOpenFrameWins = [
+  '$10/month flat hosted pricing — no per-member or per-guest fees',
+  '7-day free trial, then unlimited collaborators on one plan',
+  'Self-host for free with Docker when you need full data control',
+  'Voice notes and drawn annotations on the timeline',
+  'Formal approval requests with per-reviewer status',
+  'PDF and CSV exports for client handoff',
+  'Unlimited YouTube imports on the hosted plan',
+];
+
+const commonFreelancerPain = {
+  painTitle: 'Feedback should not live in five different apps',
+  painNarrative:
+    'Freelancers lose hours when clients send vague notes in email, WhatsApp, and screenshots. You end up guessing timecodes, re-uploading cuts, and chasing approvals that never feel final.',
+  painBullets: [
+    'Comments scattered across email threads and chat apps',
+    'Vague notes like "fix the intro around 1:12"',
+    'No clear record of which version was approved',
+    'Clients stall when the review tool feels complicated',
+  ],
+};
+
+const commonClientApprovalPain = {
+  painTitle: 'Clients do not want another login',
+  painNarrative:
+    'Approval delays usually start before the first note. If a client has to create an account, install software, or decode a complex interface, the review slows down before it starts.',
+  painBullets: [
+    'Clients abandon review flows that require signup',
+    'Stakeholders comment on the wrong version',
+    'There is no single place to see approval status',
+    'Handoff reports get rebuilt manually after the fact',
+  ],
+};
+
+const competitorFeatureRows: Record<string, FeatureRow[]> = {
+  'frame-io': [
+    { label: 'Timestamped comments', openframe: 'yes', competitor: 'yes' },
+    { label: 'Voice notes on timeline', openframe: 'yes', competitor: 'no' },
+    { label: 'Drawn frame annotations', openframe: 'yes', competitor: 'yes' },
+    { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+    { label: 'Approval workflow', openframe: 'yes', competitor: 'yes' },
+    { label: 'Guest review without account', openframe: 'yes', competitor: 'yes' },
+    { label: 'Comment export', openframe: 'yes', competitor: 'yes' },
+    { label: 'Self-hosting option', openframe: 'yes', competitor: 'no' },
+    {
+      label: 'Flat pricing without per-member fees',
+      openframe: 'yes',
+      competitor: 'no',
+      note: 'Frame.io guests review free via links, but team seats are billed per member.',
+    },
+  ],
+  wipster: [
+    { label: 'Timestamped comments', openframe: 'yes', competitor: 'yes' },
+    { label: 'Voice notes on timeline', openframe: 'yes', competitor: 'no' },
+    { label: 'Drawn frame annotations', openframe: 'yes', competitor: 'yes' },
+    { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+    { label: 'Approval workflow', openframe: 'yes', competitor: 'yes' },
+    { label: 'Guest review without account', openframe: 'yes', competitor: 'yes' },
+    { label: 'Comment export', openframe: 'yes', competitor: 'partial' },
+    { label: 'Self-hosting option', openframe: 'yes', competitor: 'no' },
+    {
+      label: 'Flat pricing without per-member fees',
+      openframe: 'yes',
+      competitor: 'partial',
+      note: 'Wipster reviewers are free, but Team plans bill per user seat.',
+    },
+  ],
+  'dropbox-replay': [
+    { label: 'Timestamped comments', openframe: 'yes', competitor: 'yes' },
+    { label: 'Voice notes on timeline', openframe: 'yes', competitor: 'no' },
+    { label: 'Drawn frame annotations', openframe: 'yes', competitor: 'yes' },
+    { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+    { label: 'Approval workflow', openframe: 'yes', competitor: 'yes' },
+    { label: 'Guest review without account', openframe: 'yes', competitor: 'yes' },
+    { label: 'Comment export', openframe: 'yes', competitor: 'partial' },
+    { label: 'Self-hosting option', openframe: 'yes', competitor: 'no' },
+    {
+      label: 'Flat pricing without per-member fees',
+      openframe: 'yes',
+      competitor: 'no',
+      note: 'Replay Add-On is priced per user on top of a Dropbox plan.',
+    },
+  ],
+  flask: [
+    { label: 'Voice feedback', openframe: 'yes', competitor: 'yes' },
+    { label: 'Auto-structured spoken notes', openframe: 'partial', competitor: 'yes' },
+    { label: 'Formal approval workflow', openframe: 'yes', competitor: 'partial' },
+    { label: 'Guest review links', openframe: 'yes', competitor: 'yes' },
+    { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+    { label: 'Self-hosting', openframe: 'yes', competitor: 'no' },
+    {
+      label: 'Flat pricing without per-member fees',
+      openframe: 'yes',
+      competitor: 'partial',
+      note: 'Flask charges $0 per guest on Pro, but team seats are $15/user/month billed yearly.',
+    },
+    { label: 'Published pricing', openframe: 'yes', competitor: 'yes' },
+    { label: 'PDF/CSV export', openframe: 'yes', competitor: 'partial' },
+  ],
+  'vimeo-review': [
+    { label: 'Timestamped comments', openframe: 'yes', competitor: 'yes' },
+    { label: 'Voice notes on timeline', openframe: 'yes', competitor: 'no' },
+    { label: 'Drawn frame annotations', openframe: 'yes', competitor: 'partial' },
+    { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+    { label: 'Approval workflow', openframe: 'yes', competitor: 'yes' },
+    { label: 'Guest review without account', openframe: 'yes', competitor: 'yes' },
+    { label: 'Comment export', openframe: 'yes', competitor: 'no' },
+    { label: 'Self-hosting option', openframe: 'yes', competitor: 'no' },
+    {
+      label: 'Flat pricing without per-member fees',
+      openframe: 'yes',
+      competitor: 'partial',
+      note: 'Vimeo review guests are free via links, but team hosting plans scale by seat.',
+    },
+  ],
+};
+
+function defaultFeatureRows(competitorId: string): FeatureRow[] {
+  return competitorFeatureRows[competitorId] ?? [];
+}
+
+function competitorPricingRows(competitorId: string): PricingRow[] {
+  const profile = competitorProfiles[competitorId];
+  if (!profile) return [];
+
+  return [
+    {
+      label: 'Per-member or guest fees',
+      openframe: '$10/mo flat — no per-seat or guest charges',
+      competitor: profile.pricingSummary,
+    },
+    {
+      label: 'External reviewer access',
+      openframe: 'Share link, no account required',
+      competitor: profile.reviewerAccess,
+    },
+    {
+      label: 'Self-hosted option',
+      openframe: 'Free (Docker)',
+      competitor: profile.selfHosted ? 'Yes' : 'No',
+    },
+    {
+      label: 'Trial',
+      openframe: '7-day free trial on hosted',
+      competitor: profile.pricingNotes[0] ?? 'See vendor site',
+    },
+  ];
+}
+
+function competitorPage(
+  slug: string,
+  competitorId: string,
+  overrides: Partial<ComparisonPageDefinition> &
+    Pick<
+      ComparisonPageDefinition,
+      | 'title'
+      | 'metaDescription'
+      | 'keywords'
+      | 'headline'
+      | 'subheadline'
+      | 'solutionTitle'
+      | 'solutionNarrative'
+      | 'openframeWins'
+      | 'competitorWins'
+      | 'faq'
+    >
+): ComparisonPageDefinition {
+  const profile = competitorProfiles[competitorId];
+
+  return {
+    slug,
+    competitorId,
+    pageType: 'competitor',
+    eyebrow: `${profile.name} alternative`,
+    painTitle: commonFreelancerPain.painTitle,
+    painNarrative: commonFreelancerPain.painNarrative,
+    painBullets: commonFreelancerPain.painBullets,
+    bestForOpenFrame: openFrameProfile.bestFor,
+    bestForCompetitor: profile.bestFor,
+    featureRows: defaultFeatureRows(competitorId),
+    pricingRows: competitorPricingRows(competitorId),
+    pricingFootnote: 'Pricing and features change. Verify current plans on each vendor website.',
+    visualVariant: 'landing-dashboard',
+    relatedSlugs: [
+      'frame-io-alternative',
+      'video-review-tool-for-freelancers',
+      'client-video-approval-tool',
+    ],
+    ...overrides,
+  };
+}
+
+export const comparisonPages: ComparisonPageDefinition[] = [
+  competitorPage('frame-io-alternative', 'frame-io', {
+    title: 'Frame.io Alternative for Small Teams',
+    metaDescription:
+      'Compare OpenFrame vs Frame.io for freelancers and small teams. Get timestamped review, approvals, guest links, and self-hosting without per-seat enterprise pricing.',
+    keywords: ['frame.io alternative', 'frame io alternative', 'open source frame.io alternative'],
+    headline: 'Frame.io power without the enterprise bill',
+    subheadline:
+      'Frame.io is the industry standard for large post teams. OpenFrame gives freelancers and small studios the review workflow they actually need: one link, one timeline, clear approvals, and optional self-hosting.',
+    solutionTitle: 'Built for small teams, not studio overhead',
+    solutionNarrative:
+      'OpenFrame keeps the parts that save approval time—timestamped comments, voice notes, annotations, version compare, and sign-off tracking—without tying you to per-member pricing or a full creative-ops platform.',
+    openframeWins: [...commonOpenFrameWins, 'Fair-source codebase you can inspect and self-host'],
+    competitorWins: [
+      'Deep Adobe Premiere, Final Cut, and enterprise media workflows',
+      'Camera to Cloud, DRM, forensic watermarking, and SSO at enterprise scale',
+      'Mature metadata, collections, and multi-workspace operations',
+    ],
+    faq: [
+      {
+        question: 'Do clients need a Frame.io account?',
+        answer:
+          'Not for share-link review. Frame.io supports external reviewers via links without accounts, but internal project management still uses paid member seats.',
+      },
+      {
+        question: 'Why switch from Frame.io to OpenFrame?',
+        answer:
+          'If you are a freelancer or small team paying for features you never touch, OpenFrame offers a simpler approval workflow, lower hosted pricing, and a free self-hosted path.',
+      },
+      {
+        question: 'Can OpenFrame replace Frame.io for enterprise MAM?',
+        answer:
+          'Not today. OpenFrame is focused on review, versioning, and approvals—not large-scale media asset management or Adobe enterprise controls.',
+      },
+    ],
+    visualVariant: 'landing-compare',
+    relatedSlugs: [
+      'self-hosted-frame-io-alternative',
+      'wipster-alternative',
+      'client-video-approval-tool',
+    ],
+  }),
+  {
+    slug: 'self-hosted-frame-io-alternative',
+    competitorId: 'frame-io',
+    pageType: 'use-case',
+    title: 'Self-Hosted Frame.io Alternative',
+    metaDescription:
+      'OpenFrame is a self-hosted Frame.io alternative with timestamped review, approvals, guest links, and Docker deployment for teams that need full data control.',
+    keywords: [
+      'self hosted frame.io alternative',
+      'self-hosted video review',
+      'open source video review',
+    ],
+    eyebrow: 'Self-hosted review',
+    headline: 'Keep client footage on your infrastructure',
+    subheadline:
+      'If Frame.io’s cloud-only model is the blocker, OpenFrame gives you the same core review loop—comments, versions, approvals, and share links—on hardware you control.',
+    painTitle: 'Cloud review tools are not always a fit',
+    painNarrative:
+      'Some teams cannot upload client masters to US-hosted SaaS by policy, budget, or principle. They still need timestamped review and approvals—not a return to email chaos.',
+    painBullets: [
+      'Client contracts restrict third-party cloud storage',
+      'Per-seat SaaS costs add up across occasional collaborators',
+      'You want auditability over where footage lives',
+      'You need a review tool that works air-gapped or on-prem',
+    ],
+    solutionTitle: 'Self-host without giving up the workflow',
+    solutionNarrative:
+      'OpenFrame ships with Docker Compose, PostgreSQL, and S3-compatible storage. Optionally wire up your own Bunny CDN instance for streaming. Run on your server, keep projects private by default, and still send clients a simple browser review link.',
+    bestForOpenFrame: [
+      'Teams with Docker ops capacity',
+      'Privacy-sensitive client work',
+      'Studios comparing Frame.io to open/fair-source options',
+    ],
+    bestForCompetitor: [
+      'Teams needing Adobe enterprise integrations out of the box',
+      'Studios without any infrastructure maintenance capacity',
+      'Large distributed teams needing vendor-managed scale',
+    ],
+    openframeWins: [
+      'Free self-hosted deployment with full review features',
+      'Docker Compose setup with PostgreSQL and MinIO',
+      'Optional Bunny CDN integration for self-hosted streaming',
+      'Optional hosted cloud if you want zero ops later',
+      'Guest share links and approval workflow included',
+    ],
+    competitorWins: [
+      'Fully managed transcoding and delivery without running your own stack',
+      'Enterprise security certifications and Adobe ecosystem depth',
+      'No server maintenance required',
+    ],
+    featureRows: [
+      { label: 'Self-hosting', openframe: 'yes', competitor: 'no' },
+      { label: 'Docker deployment', openframe: 'yes', competitor: 'no' },
+      { label: 'Guest review links', openframe: 'yes', competitor: 'yes' },
+      { label: 'Approval workflow', openframe: 'yes', competitor: 'yes' },
+      { label: 'Version compare', openframe: 'yes', competitor: 'yes' },
+      { label: 'Enterprise DRM / SSO', openframe: 'no', competitor: 'yes' },
+      { label: 'Adobe NLE integrations', openframe: 'no', competitor: 'yes' },
+      { label: 'Open/fair-source codebase', openframe: 'yes', competitor: 'no' },
+    ],
+    pricingRows: [
+      { label: 'Self-hosted software cost', openframe: 'Free', competitor: 'Not available' },
+      {
+        label: 'Per-member or guest fees',
+        openframe: '$10/mo flat — no per-seat or guest charges',
+        competitor: 'From $15/member/mo for team seats',
+      },
+      {
+        label: 'CDN / streaming',
+        openframe: 'Optional self-hosted Bunny CDN',
+        competitor: 'Vendor-managed CDN',
+      },
+      { label: 'Data residency', openframe: 'Your servers', competitor: 'Vendor cloud' },
+    ],
+    pricingFootnote: 'Self-hosting still requires your own compute, storage, and maintenance.',
+    faq: [
+      {
+        question: 'Is OpenFrame really self-hostable?',
+        answer:
+          'Yes. The repository includes Docker Compose, migrations on boot, and optional S3-compatible storage. You can also use the hosted plan if you do not want to operate infrastructure.',
+      },
+      {
+        question: 'Can I use a CDN with self-hosted OpenFrame?',
+        answer:
+          'Yes. You can integrate your own Bunny CDN instance for streaming on self-hosted deployments, keeping delivery on infrastructure you control.',
+      },
+      {
+        question: 'Do clients still need accounts on self-hosted OpenFrame?',
+        answer:
+          'No. Clients can review via share links in the browser without creating an account.',
+      },
+    ],
+    visualVariant: 'landing-dashboard',
+    relatedSlugs: [
+      'frame-io-alternative',
+      'video-review-tool-for-freelancers',
+      'client-video-approval-tool',
+    ],
+  },
+  {
+    slug: 'video-review-tool-for-freelancers',
+    competitorId: null,
+    pageType: 'use-case',
+    title: 'Video Review Tool for Freelancers',
+    metaDescription:
+      'OpenFrame is a video review tool for freelancers with timestamped comments, voice notes, guest links, version compare, and affordable hosted or free self-hosted pricing.',
+    keywords: [
+      'video review tool for freelancers',
+      'freelance video review',
+      'client video feedback',
+    ],
+    eyebrow: 'For freelancers',
+    headline: 'Stop chasing timecodes. Start shipping cuts.',
+    subheadline:
+      'You do not need enterprise creative ops to get professional client review. OpenFrame gives freelancers one link, one timeline, and a clear approval state.',
+    painTitle: commonFreelancerPain.painTitle,
+    painNarrative: commonFreelancerPain.painNarrative,
+    painBullets: commonFreelancerPain.painBullets,
+    solutionTitle: 'A freelancer-sized review stack',
+    solutionNarrative:
+      'Upload or import a cut, share a link, collect timestamped feedback with text or voice, compare versions, and export a report when the client signs off.',
+    bestForOpenFrame: openFrameProfile.bestFor,
+    bestForCompetitor: [
+      'Full-time post houses needing Adobe-native enterprise tooling',
+      'Teams already standardized on Frame.io or Dropbox',
+      'Studios needing storyboard-to-delivery production suites',
+    ],
+    openframeWins: commonOpenFrameWins,
+    competitorWins: [
+      'Mature NLE integrations for large facility workflows',
+      'Specialized tools for EU-only hosting or voice-first feedback',
+      'All-in-one suites if you already pay for Vimeo or Dropbox',
+    ],
+    featureRows: [
+      { label: 'Timestamped comments', openframe: 'yes', competitor: 'Varies' },
+      { label: 'Voice notes on timeline', openframe: 'yes', competitor: 'Rare' },
+      { label: 'Guest review without account', openframe: 'yes', competitor: 'Varies' },
+      { label: 'Approval workflow', openframe: 'yes', competitor: 'Varies' },
+      { label: 'Self-hosting option', openframe: 'yes', competitor: 'Rare' },
+      {
+        label: 'Flat pricing without per-member fees',
+        openframe: 'yes',
+        competitor: 'Rare',
+      },
+    ],
+    pricingRows: [
+      {
+        label: 'Per-member or guest fees',
+        openframe: '$10/mo flat — no per-seat or guest charges',
+        competitor: 'Often per-seat or bundled with hosting',
+      },
+      { label: 'Self-hosted', openframe: 'Free', competitor: 'Rare' },
+      { label: 'Client accounts', openframe: 'Not required', competitor: 'Varies by tool' },
+      { label: 'YouTube imports', openframe: 'Unlimited on hosted', competitor: 'Varies' },
+    ],
+    faq: [
+      {
+        question: 'What makes a good freelancer video review tool?',
+        answer:
+          'Clients should review in the browser without friction, every note should land on a timestamp, and you should always know which version is approved.',
+      },
+      {
+        question: 'Can I start free?',
+        answer: 'Yes. Use the 7-day hosted trial or self-host for free with Docker.',
+      },
+      {
+        question: 'Is OpenFrame only for video?',
+        answer:
+          'OpenFrame is video-first: comments, voice notes, annotations, versions, and approvals are built around the timeline.',
+      },
+    ],
+    visualVariant: 'landing-dashboard',
+    relatedSlugs: ['client-video-approval-tool', 'frame-io-alternative', 'wipster-alternative'],
+  },
+  {
+    slug: 'client-video-approval-tool',
+    competitorId: null,
+    pageType: 'use-case',
+    title: 'Client Video Approval Tool',
+    metaDescription:
+      'OpenFrame is a client video approval tool with share links, timestamped feedback, approval requests, and PDF/CSV exports for freelancers and small teams.',
+    keywords: ['client video approval tool', 'video approval software', 'client sign off video'],
+    eyebrow: 'Client approvals',
+    headline: 'Get to “approved” without another login wall',
+    subheadline:
+      'Clients review in the browser, leave timestamped notes, and approve the exact version you need to ship.',
+    painTitle: commonClientApprovalPain.painTitle,
+    painNarrative: commonClientApprovalPain.painNarrative,
+    painBullets: commonClientApprovalPain.painBullets,
+    solutionTitle: 'Approvals that clients actually complete',
+    solutionNarrative:
+      'Send one link, collect precise feedback on the timeline, request approval from specific reviewers, and keep a record of who signed off on which version.',
+    bestForOpenFrame: [
+      'Editors and producers who need formal sign-off',
+      'Agencies with non-technical clients',
+      'Teams that export approval records for delivery',
+    ],
+    bestForCompetitor: [
+      'Marketing orgs needing multi-asset proofing across PDFs and websites',
+      'Large teams with compliance-heavy approval chains',
+      'Studios standardized on incumbent review platforms',
+    ],
+    openframeWins: [
+      'Approval requests with pending, approved, and rejected states',
+      'Guest share links with optional password and expiry',
+      'Timestamped comments, voice notes, and annotations',
+      'PDF/CSV exports for delivery documentation',
+    ],
+    competitorWins: [
+      'Enterprise proofing suites with reviewer groups and automations',
+      'Deep Adobe integrations for facility-scale post',
+      'Voice-first feedback tools for spoken review sessions',
+    ],
+    featureRows: [
+      { label: 'Explicit approval states', openframe: 'yes', competitor: 'partial' },
+      { label: 'Per-reviewer approval tracking', openframe: 'yes', competitor: 'partial' },
+      { label: 'Guest review without account', openframe: 'yes', competitor: 'partial' },
+      { label: 'Password-protected share links', openframe: 'yes', competitor: 'partial' },
+      { label: 'Export approval history', openframe: 'yes', competitor: 'partial' },
+      { label: 'Multi-asset marketing proofing', openframe: 'no', competitor: 'partial' },
+    ],
+    pricingRows: [
+      {
+        label: 'Per-member or guest fees',
+        openframe: '$10/mo flat — no per-seat or guest charges',
+        competitor: 'Varies by platform',
+      },
+      { label: 'Self-hosted', openframe: 'Free', competitor: 'Rare' },
+      {
+        label: 'Client seats',
+        openframe: 'Free via share links',
+        competitor: 'Often free via links',
+      },
+      { label: 'Export reports', openframe: 'PDF/CSV included', competitor: 'Varies' },
+    ],
+    faq: [
+      {
+        question: 'Do clients need an account to approve a video?',
+        answer:
+          'No. Clients open a share link, enter a name if needed, and can approve from the browser.',
+      },
+      {
+        question: 'Can I see who approved which version?',
+        answer: 'Yes. Approval requests track reviewer decisions per version.',
+      },
+      {
+        question: 'Can I send a password-protected review link?',
+        answer: 'Yes. Share links support optional password and expiry settings.',
+      },
+    ],
+    visualVariant: 'landing-compare',
+    relatedSlugs: [
+      'video-review-tool-for-freelancers',
+      'frame-io-alternative',
+      'wipster-alternative',
+    ],
+  },
+  competitorPage('wipster-alternative', 'wipster', {
+    title: 'Wipster Alternative for Video Review',
+    metaDescription:
+      'Compare OpenFrame vs Wipster for freelancers and small teams. Get guest review links, version compare, approvals, and lower pricing with optional self-hosting.',
+    keywords: ['wipster alternative', 'wipster vs openframe', 'video review alternative'],
+    headline: 'Wipster-style review without agency-scale pricing',
+    subheadline:
+      'Wipster is a solid video-first review tool. OpenFrame matches the core approval loop while adding voice notes, exports, and a free self-hosted path.',
+    solutionTitle: 'Same review outcome, simpler economics',
+    solutionNarrative:
+      'If you mainly need clients to comment on timecodes, compare versions, and approve a cut, OpenFrame covers that workflow at a lower monthly cost.',
+    openframeWins: [...commonOpenFrameWins, 'Lower hosted entry price for solo operators'],
+    competitorWins: [
+      'Mature NLE review panels for Premiere and After Effects',
+      'Long track record with agencies and universities',
+      'Supports audio, PDF, and image review in one place',
+    ],
+    faq: [
+      {
+        question: 'Does Wipster charge for reviewers?',
+        answer:
+          'No. Wipster includes unlimited reviewers. OpenFrame also supports guest review links without client seats.',
+      },
+      {
+        question: 'When is Wipster still the better fit?',
+        answer:
+          'If you rely heavily on Wipster’s NLE panels and agency workflows already in production.',
+      },
+      {
+        question: 'Does OpenFrame support version compare?',
+        answer: 'Yes. You can compare two versions side by side on one timeline.',
+      },
+    ],
+    relatedSlugs: [
+      'frame-io-alternative',
+      'client-video-approval-tool',
+      'dropbox-replay-alternative',
+    ],
+  }),
+  competitorPage('dropbox-replay-alternative', 'dropbox-replay', {
+    title: 'Dropbox Replay Alternative',
+    metaDescription:
+      'Compare OpenFrame vs Dropbox Replay for video review. Get a dedicated approval workflow, guest links, and optional self-hosting without Dropbox plan lock-in.',
+    keywords: ['dropbox replay alternative', 'dropbox replay vs', 'video review without dropbox'],
+    headline: 'Video review without Dropbox lock-in',
+    subheadline:
+      'Dropbox Replay is convenient if your files already live in Dropbox. OpenFrame is a focused review platform that does not require a storage suite to function.',
+    solutionTitle: 'A review tool, not a storage add-on',
+    solutionNarrative:
+      'OpenFrame is built around review, versions, and approvals first—so you are not paying for a file-sync platform just to collect timestamped client notes.',
+    openframeWins: [
+      ...commonOpenFrameWins,
+      'No Dropbox plan or Replay Add-On required',
+      'Dedicated project and approval model',
+    ],
+    competitorWins: [
+      'Native if your pipeline already lives in Dropbox',
+      'NLE integrations tied to Dropbox storage',
+      'Large file transfer and archive features via Dropbox',
+    ],
+    faq: [
+      {
+        question: 'Is Dropbox Replay free?',
+        answer:
+          'Replay is included with limits on most plans. Full usage typically requires a paid Dropbox plan and often the Replay Add-On.',
+      },
+      {
+        question: 'Can OpenFrame replace Replay for NLE markers?',
+        answer:
+          'OpenFrame focuses on browser review, approvals, and exports rather than in-editor marker sync.',
+      },
+      {
+        question: 'Do clients need Dropbox accounts?',
+        answer:
+          'Not necessarily for all Replay flows, but the product assumes Dropbox storage context. OpenFrame uses standalone share links.',
+      },
+    ],
+    relatedSlugs: [
+      'frame-io-alternative',
+      'vimeo-review-alternative',
+      'video-review-tool-for-freelancers',
+    ],
+  }),
+  competitorPage('vimeo-review-alternative', 'vimeo-review', {
+    title: 'Vimeo Review Alternative',
+    metaDescription:
+      'Compare OpenFrame vs Vimeo Review. Get dedicated approvals, voice notes, exports, and self-hosting without tying review to Vimeo hosting plans.',
+    keywords: ['vimeo review alternative', 'vimeo video review alternative'],
+    headline: 'Review workflow without Vimeo plan lock-in',
+    subheadline:
+      'Vimeo Review is convenient when you already host on Vimeo. OpenFrame is a standalone review platform with its own hosted and self-hosted options.',
+    solutionTitle: 'Decouple review from distribution',
+    solutionNarrative:
+      'You should not need a video hosting subscription to run a professional approval loop. OpenFrame works whether your master lives on YouTube, direct upload, or self-hosted storage.',
+    openframeWins: [
+      ...commonOpenFrameWins,
+      'Standalone product—not a hosting bundle',
+      'Unlimited YouTube imports on hosted plan',
+    ],
+    competitorWins: [
+      'Built into Vimeo when you already distribute there',
+      'Premiere integration and Vimeo player polish',
+      'Review links tied to hosted library and version history',
+    ],
+    faq: [
+      {
+        question: 'Do Vimeo reviewers need accounts?',
+        answer: 'No for review links. Guests can comment after providing name and email.',
+      },
+      {
+        question: 'Can OpenFrame import YouTube videos?',
+        answer: 'Yes. Hosted OpenFrame supports unlimited YouTube URL imports.',
+      },
+      {
+        question: 'When is Vimeo Review enough?',
+        answer: 'If your team already hosts, delivers, and reviews entirely inside Vimeo.',
+      },
+    ],
+    visualVariant: 'landing-dashboard',
+    relatedSlugs: [
+      'dropbox-replay-alternative',
+      'video-review-tool-for-freelancers',
+      'frame-io-alternative',
+    ],
+  }),
+  competitorPage('flask-alternative', 'flask', {
+    title: 'Flask Alternative for Video Feedback',
+    metaDescription:
+      'Compare OpenFrame vs Flask for video feedback. Get structured approvals, guest review links, exports, and self-hosting alongside spoken-note workflows.',
+    keywords: ['flask.do alternative', 'flask video feedback alternative'],
+    headline: 'Structured approvals beyond spoken feedback',
+    subheadline:
+      'Flask is compelling for voice-first review. OpenFrame is for teams that also need formal approvals, exports, guest links, and optional self-hosting.',
+    solutionTitle: 'Capture feedback and close the approval loop',
+    solutionNarrative:
+      'OpenFrame supports voice notes too—but it also tracks approval status per reviewer, compares versions, and exports a handoff record when the cut is cleared.',
+    openframeWins: [
+      ...commonOpenFrameWins,
+      'Formal approval requests and status tracking',
+      'Self-host or use managed hosting',
+      '$10/mo flat for the whole team — not per seat',
+    ],
+    competitorWins: [
+      'Best-in-class spoken feedback that auto-structures into notes',
+      'Free tier with all features (1 asset at a time, no card)',
+      'MCP/agent workflow integrations',
+      'Premiere export and upmarket production focus',
+    ],
+    pricingRows: [
+      {
+        label: 'Team pricing',
+        openframe: '$10/mo flat — unlimited members and guests',
+        competitor: 'Free (1 asset) · Pro $15/user/mo (yearly) · Enterprise from 15 seats',
+      },
+      {
+        label: 'Per-guest fees',
+        openframe: 'None',
+        competitor: '$0 per guest on Pro',
+      },
+      {
+        label: 'Self-hosted option',
+        openframe: 'Free (Docker)',
+        competitor: 'No',
+      },
+      {
+        label: 'Trial',
+        openframe: '7-day free trial on hosted',
+        competitor: 'Free plan — no card required',
+      },
+    ],
+    faq: [
+      {
+        question: 'Does OpenFrame support voice notes?',
+        answer: 'Yes. Reviewers can leave voice notes anchored to timestamps on the timeline.',
+      },
+      {
+        question: 'How much does Flask cost?',
+        answer:
+          'Flask offers a free plan (1 asset at a time, no card), Pro at $15/user/month billed yearly with $0 per guest, and custom enterprise pricing from 15 seats.',
+      },
+      {
+        question: 'When is Flask the better fit?',
+        answer:
+          'When your reviewers primarily talk through notes and you want AI-structured feedback capture.',
+      },
+      {
+        question: 'Can clients approve without an account in OpenFrame?',
+        answer: 'Yes. Share links support guest review and approval flows.',
+      },
+    ],
+    visualVariant: 'landing-dashboard',
+    relatedSlugs: [
+      'client-video-approval-tool',
+      'video-review-tool-for-freelancers',
+      'frame-io-alternative',
+    ],
+  }),
+];
+
+export const comparisonPageMap = Object.fromEntries(
+  comparisonPages.map((page) => [page.slug, page])
+) as Record<string, ComparisonPageDefinition>;
+
+export const comparisonSlugs = comparisonPages.map((page) => page.slug);
+
+export const compareFooterLinks = comparisonPages.map((page) => ({
+  href: `/${page.slug}`,
+  label: page.eyebrow,
+}));
+
+export function getComparisonPage(slug: string): ComparisonPageDefinition | undefined {
+  return Object.hasOwn(comparisonPageMap, slug) ? comparisonPageMap[slug] : undefined;
+}
+
+export function getCompetitorName(page: ComparisonPageDefinition): string | null {
+  if (!page.competitorId) return null;
+  return competitorProfiles[page.competitorId]?.name ?? null;
+}
diff --git a/lib/marketing/comparison-sources.ts b/lib/marketing/comparison-sources.ts
new file mode 100644
index 0000000..5078930
--- /dev/null
+++ b/lib/marketing/comparison-sources.ts
@@ -0,0 +1,571 @@
+import type { CompetitorProfile, CompetitorSource } from '@/lib/marketing/comparison-types';
+
+const LAST_CHECKED = '2026-06-14';
+
+export const competitorSources: CompetitorSource[] = [
+  {
+    competitor: 'frame-io',
+    sourceUrl: 'https://frame.io/pricing',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Free plan: 2 members, 2GB storage, 2 projects.',
+      'Pro: $15/member/month with 2TB included + 2TB per additional member.',
+      'Team: $25/member/month with 3TB included + 2TB per additional member.',
+    ],
+    caveats: ['Pricing excludes tax. Enterprise is custom.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'frame-io',
+    sourceUrl: 'https://help.frame.io/en/articles/9090642-getting-started-what-is-a-user',
+    sourceType: 'help',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Reviewers can access media via share links without a Frame.io account.',
+      'Reviewers are free and unlimited for external link-based review.',
+      'Paid member seats are required for internal project management roles.',
+    ],
+    caveats: ['Guest users inside the account are limited on some plans.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'frame-io',
+    sourceUrl: 'https://help.frame.io/en/articles/9105242-share-links-explained-for-clients',
+    sourceType: 'help',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Share links support passphrase protection, expiration, download controls, and approval status.',
+      'Commenting can be disabled per share link.',
+    ],
+    caveats: ['Some enterprise security features require higher tiers.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'wipster',
+    sourceUrl: 'https://wipster.io/pricing',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Light plan: $9.95/month annually or $11.95 monthly with 50GB storage.',
+      'Team plan: $19.95/user/month annually or $25 monthly starting at 250GB.',
+      'Unlimited reviewers on all plans.',
+    ],
+    caveats: ['Enterprise pricing is custom.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'wipster',
+    sourceUrl: 'https://wipster.io/product',
+    sourceType: 'product',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Supports video, image, PDF, and audio review.',
+      'Version comparison, approval tracking, and NLE panel integrations.',
+      'Public URL or private email sharing for reviewers.',
+    ],
+    caveats: ['SSO and org controls are enterprise features.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'dropbox-replay',
+    sourceUrl: 'https://help.dropbox.com/create-upload/dropbox-replay-faq',
+    sourceType: 'faq',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Replay is available on all Dropbox plans but free tiers have 4–10 file limits.',
+      'Replay Add-On removes file creation/upload limits.',
+      'Files uploaded from outside Dropbox count against Dropbox storage.',
+    ],
+    caveats: ['Replay Add-On requires a paid Dropbox plan.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'dropbox-replay',
+    sourceUrl: 'https://www.dropbox.com/replay',
+    sourceType: 'product',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Replay Add-On is about €9/user/month annually or €11 monthly.',
+      'Integrates with Premiere Pro, After Effects, Final Cut Pro, DaVinci Resolve, and Avid Pro Tools.',
+      'Supports version comparison, transcriptions, due dates, and password-protected links on paid add-on.',
+    ],
+    caveats: ['Requires Dropbox ecosystem buy-in.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'krock',
+    sourceUrl: 'https://krock.io/pricing/',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Free: 1 user, 2GB, 2 projects, unlimited reviewers.',
+      'Pro: $10/user/month with 2TB storage and unlimited projects.',
+      'Unlimited plan: flat $400/month for large teams.',
+    ],
+    caveats: ['Storage add-ons are $10/month per TB.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'krock',
+    sourceUrl: 'https://krock.io/help-center/how-to-manage-team-members-collaborators-reviewers/',
+    sourceType: 'help',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Reviewers can access projects via links without paid seats.',
+      'Includes storyboard, animatic, and production workflow tooling.',
+    ],
+    caveats: ['Storyboard AI is newer and may not fit every pipeline.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'revcut',
+    sourceUrl: 'https://revcut.io/pricing',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Crew: €69/month with 8 seats and 3TB active storage.',
+      'Studio: €149/month with 15 seats and 5TB active storage.',
+      '14-day free trial with no credit card required.',
+    ],
+    caveats: ['Storage is designed for active review cycles, not long-term archiving.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'revcut',
+    sourceUrl: 'https://revcut.io/client-video-review',
+    sourceType: 'product',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Clients review via secure links with name-only access, no account required.',
+      'Native DaVinci Resolve plugin for marker export.',
+      'EU-hosted with GDPR-minded positioning.',
+    ],
+    caveats: ['Premiere/FCP integrations listed as coming later.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'vimeo-review',
+    sourceUrl:
+      'https://help.vimeo.com/hc/en-us/articles/12426192100113-How-to-use-and-manage-video-review-links',
+    sourceType: 'help',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Review links work for people without a Vimeo account.',
+      'Supports passwords, expiration, downloads, commenting, and approval status toggles.',
+      'Guests provide name and email before commenting.',
+    ],
+    caveats: ['Folder review links require Standard plan or higher.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'vimeo-review',
+    sourceUrl: 'https://vimeo.com/features/video-collaboration',
+    sourceType: 'product',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Review is built into Vimeo hosting with version history and Premiere integration.',
+      'Time-stamped comments with resolve workflow.',
+    ],
+    caveats: ['Best fit when you already host video on Vimeo.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'vitransfer',
+    sourceUrl: 'https://www.vitransfer.com/docs',
+    sourceType: 'docs',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'AGPL-3.0 self-hosted video review and approval platform.',
+      'Share links support password, email OTP, guest mode, and approval workflows.',
+      'Guests are view-only by default; downloads gated until approval.',
+    ],
+    caveats: ['Requires Docker infrastructure and ongoing maintenance.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'freeframe',
+    sourceUrl: 'https://github.com/Techiebutler/freeframe',
+    sourceType: 'github',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Self-hosted open-source media review for video, image, and audio.',
+      'Frame-accurate comments, annotations, approvals, version compare, and guest share links.',
+      'Uses FastAPI backend with Next.js frontend and S3-compatible storage.',
+    ],
+    caveats: ['Requires external S3, SMTP, and production ops setup.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'flask',
+    sourceUrl: 'https://flask.do/pricing',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Free: $0, no card required, all features, 1 asset at a time.',
+      'Pro: $15/user/month billed yearly; $0 per guest; unlimited uploads.',
+      'Pro includes original file downloads for 30 days; enterprise from 15 seats.',
+    ],
+    caveats: ['Pro is billed yearly; enterprise pricing is custom.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'flask',
+    sourceUrl: 'https://flask.do/',
+    sourceType: 'product',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Voice-first feedback: record spoken notes while watching and Flask structures timestamped comments.',
+      'Supports drawing, references, version compare, Drive import, and Premiere export.',
+      'Positions upmarket for production teams of 5–100 people.',
+    ],
+    caveats: ['Free tier limits you to one active asset at a time.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'aligno',
+    sourceUrl: 'https://aligno.io/pricing',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Pro: $18/month or $180/year flat rate per creator.',
+      'Clients never need accounts and do not count toward limits.',
+      'Supports images, PDFs, videos, and webpages with explicit approval states.',
+    ],
+    caveats: ['Video review is one part of a broader multi-asset approval tool.'],
+    confidence: 'high',
+  },
+  {
+    competitor: 'videoreview-pro',
+    sourceUrl: 'https://videoreview.pro/',
+    sourceType: 'pricing',
+    lastChecked: LAST_CHECKED,
+    claims: [
+      'Free forever with 30 minutes total video storage.',
+      'Pro: $99/year with 10 hours of storage.',
+      'All features included on both plans; only storage differs.',
+    ],
+    caveats: ['Very limited storage compared to production workflows.'],
+    confidence: 'high',
+  },
+];
+
+export const competitorProfiles: Record<string, CompetitorProfile> = {
+  'frame-io': {
+    id: 'frame-io',
+    name: 'Frame.io',
+    tagline: 'Enterprise creative operations platform with deep Adobe integration.',
+    bestFor: [
+      'Large post-production teams in Adobe Creative Cloud',
+      'Studios needing enterprise security, DRM, and MAM workflows',
+      'Teams that need Camera to Cloud and hardware integrations',
+    ],
+    strengths: [
+      'Industry-standard Adobe Premiere and Final Cut integrations',
+      'Mature share-link review with approvals, watermarks, and enterprise controls',
+      'Transcription, captions, metadata, and broad asset management',
+    ],
+    limitations: [
+      'Per-member pricing scales quickly for small teams',
+      'Heavier platform than freelancers need for simple client approvals',
+      'No self-hosting option for teams that need full data control',
+    ],
+    pricingSummary: 'Free (2GB) · Pro $15/member/mo · Team $25/member/mo',
+    pricingNotes: [
+      'External reviewers via share links are free.',
+      'Paid seats are for team members managing projects inside Frame.io.',
+    ],
+    reviewerAccess:
+      'Share links allow review without a Frame.io account; internal roles require paid seats.',
+    selfHosted: false,
+    sources: [
+      'https://frame.io/pricing',
+      'https://help.frame.io/en/articles/9090642-getting-started-what-is-a-user',
+    ],
+  },
+  wipster: {
+    id: 'wipster',
+    name: 'Wipster',
+    tagline: 'Video-first review and approval for agencies and production teams.',
+    bestFor: [
+      'Agencies managing multiple client review cycles',
+      'Video teams wanting NLE panel integrations',
+      'Teams that need unlimited external reviewers',
+    ],
+    strengths: [
+      'Unlimited reviewers on every plan',
+      'Side-by-side version comparison and approval tracking',
+      'Premiere Pro and After Effects panel integrations',
+    ],
+    limitations: [
+      'Per-user pricing on Team plans',
+      'US-hosted SaaS with no self-host option',
+      'Broader creative-ops features are lighter than Frame.io enterprise',
+    ],
+    pricingSummary: 'Light $9.95/mo · Team from $19.95/user/mo',
+    pricingNotes: ['Free trial with no credit card required.', 'Enterprise is custom.'],
+    reviewerAccess: 'Reviewers can use public links or email invites without paid seats.',
+    selfHosted: false,
+    sources: ['https://wipster.io/pricing', 'https://wipster.io/product'],
+  },
+  'dropbox-replay': {
+    id: 'dropbox-replay',
+    name: 'Dropbox Replay',
+    tagline: 'Review and approval add-on inside the Dropbox ecosystem.',
+    bestFor: [
+      'Teams already storing and delivering files in Dropbox',
+      'Editors who want NLE integrations tied to Dropbox storage',
+      'Lightweight review without adopting a separate platform',
+    ],
+    strengths: [
+      'Native integrations with Premiere, After Effects, FCP, Resolve, and Pro Tools',
+      'Version comparison, transcriptions, and due dates on paid add-on',
+      'Familiar Dropbox security and link management',
+    ],
+    limitations: [
+      'Requires Dropbox plan plus Replay Add-On for full usage',
+      'Free Replay tiers cap active files at 4–10 uploads',
+      'Not a standalone review platform with its own project model',
+    ],
+    pricingSummary: 'Replay Add-On ~€9/user/mo annually',
+    pricingNotes: [
+      'Basic Replay is included but file-limited on most plans.',
+      'Password protection and transcription require the paid add-on.',
+    ],
+    reviewerAccess: 'Collaborators review in browser; full value assumes Dropbox account context.',
+    selfHosted: false,
+    sources: [
+      'https://www.dropbox.com/replay',
+      'https://help.dropbox.com/create-upload/dropbox-replay-faq',
+    ],
+  },
+  krock: {
+    id: 'krock',
+    name: 'Krock.io',
+    tagline: 'Creative production workspace with storyboards, animatics, and review.',
+    bestFor: [
+      'Animation studios and pre-to-post production pipelines',
+      'Teams wanting storyboard and animatic review in one tool',
+      'Studios needing unlimited external reviewers',
+    ],
+    strengths: [
+      'Storyboard and animatic tooling upstream of video review',
+      'Unlimited reviewers on all plans',
+      'Integrations with Adobe CC, Resolve, FCP, and Slack',
+    ],
+    limitations: [
+      'Per-user pricing on Pro plan',
+      'Broader production tooling may be more than solo freelancers need',
+      'No self-hosting option',
+    ],
+    pricingSummary: 'Free · Pro $10/user/mo · Unlimited $400/mo flat',
+    pricingNotes: ['7-day trial on paid plans.', 'Storage add-ons available.'],
+    reviewerAccess: 'Guest review links without account creation.',
+    selfHosted: false,
+    sources: [
+      'https://krock.io/pricing/',
+      'https://krock.io/help-center/how-to-manage-team-members-collaborators-reviewers/',
+    ],
+  },
+  revcut: {
+    id: 'revcut',
+    name: 'RevCut',
+    tagline: 'EU-hosted video review built for editors and small post teams.',
+    bestFor: [
+      'EU-based editors needing GDPR-minded hosting',
+      'DaVinci Resolve-first workflows',
+      'Small teams wanting client review without logins',
+    ],
+    strengths: [
+      'Clients review via secure links with name-only access',
+      'Native DaVinci Resolve plugin',
+      'Explicit EU hosting and privacy positioning',
+    ],
+    limitations: [
+      'No self-hosting option',
+      'Higher entry pricing than solo freelancer tools',
+      'Premiere/FCP integrations still limited compared to Frame.io',
+    ],
+    pricingSummary: 'Crew €69/mo · Studio €149/mo',
+    pricingNotes: ['14-day free trial.', 'Storage is for active review cycles.'],
+    reviewerAccess: 'Clients use secure links with optional password; no account required.',
+    selfHosted: false,
+    sources: ['https://revcut.io/pricing', 'https://revcut.io/client-video-review'],
+  },
+  'vimeo-review': {
+    id: 'vimeo-review',
+    name: 'Vimeo Review',
+    tagline: 'Review tools built into Vimeo video hosting.',
+    bestFor: [
+      'Teams already hosting and delivering on Vimeo',
+      'Creators who want review without a second subscription',
+      'Workflows centered on Vimeo distribution',
+    ],
+    strengths: [
+      'Review links with no Vimeo account required for guests',
+      'Version history, status labels, and Premiere integration',
+      'Password and expiration controls on review links',
+    ],
+    limitations: [
+      'Tied to Vimeo hosting plans',
+      'Less focused on standalone approval workflows',
+      'No self-hosting or open-source path',
+    ],
+    pricingSummary: 'Bundled with Vimeo Standard+ plans',
+    pricingNotes: ['Folder review links require Standard plan or higher.'],
+    reviewerAccess: 'External reviewers use review links without Vimeo accounts.',
+    selfHosted: false,
+    sources: [
+      'https://vimeo.com/features/video-collaboration',
+      'https://help.vimeo.com/hc/en-us/articles/12426192100113-How-to-use-and-manage-video-review-links',
+    ],
+  },
+  vitransfer: {
+    id: 'vitransfer',
+    name: 'ViTransfer',
+    tagline: 'AGPL self-hosted video review with approval workflows.',
+    bestFor: [
+      'Teams that want open-source and full infrastructure control',
+      'Studios with Docker ops capacity',
+      'Privacy-sensitive client work kept on owned hardware',
+    ],
+    strengths: [
+      'No subscription fees beyond your own infrastructure',
+      'Per-video approvals with download gating',
+      'Password, email OTP, and guest access modes',
+    ],
+    limitations: [
+      'Requires setup, maintenance, and transcoding resources',
+      'Guest mode is view-only by default',
+      'Smaller ecosystem than commercial incumbents',
+    ],
+    pricingSummary: 'Free (self-hosted, AGPL-3.0)',
+    pricingNotes: ['Storage limited only by your own hardware.'],
+    reviewerAccess: 'Share links with configurable auth; guest mode is view-only.',
+    selfHosted: true,
+    sources: ['https://www.vitransfer.com/docs', 'https://www.vitransfer.com/about'],
+  },
+  freeframe: {
+    id: 'freeframe',
+    name: 'FreeFrame',
+    tagline: 'Self-hosted open-source media review platform.',
+    bestFor: [
+      'Teams wanting multi-format review on owned infrastructure',
+      'Organizations with S3 and SMTP already in place',
+      'Open-source adopters comparing to Frame.io',
+    ],
+    strengths: [
+      'Video, image, and audio review in one platform',
+      'Approvals, version compare, guest share links, and SSE updates',
+      'Bring-your-own S3, Redis, and PostgreSQL',
+    ],
+    limitations: [
+      'Production deployment requires DevOps effort',
+      'Different stack (FastAPI + Next.js) from OpenFrame',
+      'Younger project with smaller community',
+    ],
+    pricingSummary: 'Free (self-hosted, open source)',
+    pricingNotes: ['Infrastructure and ops costs apply.'],
+    reviewerAccess: 'Guest commenting via password-protected share links.',
+    selfHosted: true,
+    sources: ['https://github.com/Techiebutler/freeframe'],
+  },
+  flask: {
+    id: 'flask',
+    name: 'Flask',
+    tagline: 'Voice-first video feedback that structures spoken notes automatically.',
+    bestFor: [
+      'Reviewers who prefer talking through feedback instead of typing',
+      'Production teams of 5–100 people',
+      'Teams exploring AI-assisted feedback workflows',
+    ],
+    strengths: [
+      'Records spoken feedback and turns it into timestamped action items',
+      'Drawing, references, version compare, and Premiere export',
+      'MCP integration for agent-assisted workflows',
+      'Free tier with full features (1 asset at a time)',
+    ],
+    limitations: [
+      'No public self-host option',
+      'Pro is $15/user/month billed yearly',
+      'Free tier limited to one active asset',
+      'Focused on feedback capture more than formal approval chains',
+    ],
+    pricingSummary: 'Free (1 asset) · Pro $15/user/mo (yearly) · Enterprise custom',
+    pricingNotes: ['Pro includes $0 per guest and unlimited uploads.'],
+    reviewerAccess: '$0 per guest on Pro; free tier for trying without a card.',
+    selfHosted: false,
+    sources: ['https://flask.do/pricing', 'https://flask.do/'],
+  },
+  aligno: {
+    id: 'aligno',
+    name: 'Aligno',
+    tagline: 'Flat-rate multi-asset approval for designers and agencies.',
+    bestFor: [
+      'Designers and agencies reviewing video alongside images and PDFs',
+      'Solo creators with many clients and no per-reviewer fees',
+      'Teams wanting explicit approve/request-changes workflow',
+    ],
+    strengths: [
+      'Flat per-creator pricing with unlimited free clients',
+      'Multi-asset review in one workspace',
+      'Explicit approval states on every version',
+    ],
+    limitations: [
+      'Less depth for full-time post-production houses',
+      'No self-hosting option',
+      'Video tooling is narrower than dedicated review platforms',
+    ],
+    pricingSummary: 'Free · Pro $18/mo · Studio custom',
+    pricingNotes: ['Clients never count toward seat limits.'],
+    reviewerAccess: 'Clients review via share links without accounts.',
+    selfHosted: false,
+    sources: ['https://aligno.io/pricing', 'https://aligno.io/frame-io-alternative'],
+  },
+  'videoreview-pro': {
+    id: 'videoreview-pro',
+    name: 'VideoReview.pro',
+    tagline: 'Minimal timestamped video feedback with a generous free tier.',
+    bestFor: [
+      'Creators needing basic timestamped comments on a budget',
+      'Very small projects with limited storage needs',
+      'Teams testing video review for the first time',
+    ],
+    strengths: [
+      'Free forever with all features included',
+      'Simple upload, share, and comment workflow',
+      'Password-protected share links',
+    ],
+    limitations: [
+      'Only 30 minutes free storage; Pro caps at 10 hours/year',
+      'No formal approval workflow or version compare',
+      'No self-hosting or open-source option',
+    ],
+    pricingSummary: 'Free (30 min) · Pro $99/year (10 hours)',
+    pricingNotes: ['Storage is the only plan differentiator.'],
+    reviewerAccess: 'Share links for client review.',
+    selfHosted: false,
+    sources: ['https://videoreview.pro/'],
+  },
+};
+
+export const openFrameProfile = {
+  name: 'OpenFrame',
+  tagline: 'Fair-source video review and approval with hosted and self-hosted options.',
+  pricingSummary: 'Self-hosted free · Hosted $10/mo after 7-day trial',
+  trial: '7-day free trial on hosted plan',
+  strengths: [
+    'Timestamped text, voice, image, and drawn annotations',
+    'Version compare with side-by-side review',
+    'Approval requests with per-reviewer decisions',
+    'Guest share links with optional password and expiry',
+    'PDF/CSV comment exports',
+    'Unlimited YouTube imports on hosted plan',
+    'Self-host with Docker or use hosted cloud',
+  ],
+  bestFor: [
+    'Freelancers and small teams shipping client cuts',
+    'Studios that want open/fair-source and optional self-hosting',
+    'Teams tired of vague email and WhatsApp feedback',
+  ],
+};
diff --git a/lib/marketing/comparison-types.ts b/lib/marketing/comparison-types.ts
new file mode 100644
index 0000000..e0d330d
--- /dev/null
+++ b/lib/marketing/comparison-types.ts
@@ -0,0 +1,91 @@
+export type SourceType =
+  | 'pricing'
+  | 'product'
+  | 'faq'
+  | 'help'
+  | 'docs'
+  | 'comparison'
+  | 'github'
+  | 'changelog';
+
+export type Confidence = 'high' | 'medium' | 'low';
+
+export interface CompetitorSource {
+  competitor: string;
+  sourceUrl: string;
+  sourceType: SourceType;
+  lastChecked: string;
+  claims: string[];
+  caveats: string[];
+  confidence: Confidence;
+}
+
+export interface CompetitorProfile {
+  id: string;
+  name: string;
+  tagline: string;
+  bestFor: string[];
+  strengths: string[];
+  limitations: string[];
+  pricingSummary: string;
+  pricingNotes: string[];
+  reviewerAccess: string;
+  selfHosted: boolean;
+  sources: string[];
+}
+
+export type FeatureStatus = 'yes' | 'no' | 'partial' | 'openframe-only' | 'competitor-only';
+
+export interface FeatureRow {
+  label: string;
+  openframe: FeatureStatus | string;
+  competitor: FeatureStatus | string;
+  note?: string;
+}
+
+export interface PricingRow {
+  label: string;
+  openframe: string;
+  competitor: string;
+}
+
+export interface ComparisonFaq {
+  question: string;
+  answer: string;
+}
+
+export type VisualVariant =
+  | 'timeline-comments'
+  | 'version-compare'
+  | 'approval-workflow'
+  | 'guest-review'
+  | 'voice-notes'
+  | 'landing-compare'
+  | 'landing-dashboard';
+
+export interface ComparisonPageDefinition {
+  slug: string;
+  title: string;
+  metaDescription: string;
+  keywords: string[];
+  competitorId: string | null;
+  pageType: 'competitor' | 'use-case';
+  eyebrow: string;
+  headline: string;
+  subheadline: string;
+  painTitle: string;
+  painNarrative: string;
+  painBullets: string[];
+  solutionTitle: string;
+  solutionNarrative: string;
+  bestForOpenFrame: string[];
+  bestForCompetitor: string[];
+  openframeWins: string[];
+  competitorWins: string[];
+  featureRows: FeatureRow[];
+  pricingRows: PricingRow[];
+  pricingFootnote?: string;
+  faq: ComparisonFaq[];
+  visualVariant: VisualVariant;
+  relatedSlugs: string[];
+}
diff --git a/lib/marketing/metadata.ts b/lib/marketing/metadata.ts
new file mode 100644
index 0000000..6653280
--- /dev/null
+++ b/lib/marketing/metadata.ts
@@ -0,0 +1,106 @@
+import type { Metadata } from 'next';
+import { seoConfig } from '@/lib/seo';
+
+export function buildComparisonMetadata({
+  title,
+  description,
+  path,
+  keywords = [],
+}: {
+  title: string;
+  description: string;
+  path: string;
+  keywords?: string[];
+}): Metadata {
+  const canonicalPath = path.startsWith('/') ? path : `/${path}`;
+  const pageTitle = title;
+  const ogTitle = `${pageTitle} | ${seoConfig.name}`;
+
+  return {
+    title: pageTitle,
+    description,
+    keywords: [...seoConfig.keywords, ...keywords],
+    alternates: {
+      canonical: canonicalPath,
+    },
+    openGraph: {
+      title: ogTitle,
+      description,
+      url: `${seoConfig.url}${canonicalPath}`,
+      images: [
+        {
+          url: seoConfig.ogImage,
+          width: 1888,
+          height: 1048,
+          alt: `${pageTitle} | ${seoConfig.name}`,
+        },
+      ],
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title: ogTitle,
+      description,
+      images: [seoConfig.ogImage],
+    },
+  };
+}
+
+export function buildComparisonJsonLd({
+  title,
+  description,
+  path,
+  faq,
+}: {
+  title: string;
+  description: string;
+  path: string;
+  faq: Array<{ question: string; answer: string }>;
+}) {
+  const url = `${seoConfig.url}${path.startsWith('/') ? path : `/${path}`}`;
+
+  const structuredData: Array<Record<string, unknown>> = [
+    {
+      '@context': 'https://schema.org',
+      '@type': 'WebPage',
+      name: title,
+      description,
+      url,
+      isPartOf: {
+        '@type': 'WebSite',
+        name: seoConfig.name,
+        url: seoConfig.url,
+      },
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'SoftwareApplication',
+      name: seoConfig.name,
+      applicationCategory: 'MultimediaApplication',
+      operatingSystem: 'Web',
+      offers: {
+        '@type': 'Offer',
+        price: '10',
+        priceCurrency: 'USD',
+        description: '7-day free trial, then $10/month hosted plan. Self-hosted option is free.',
+      },
+      url: seoConfig.url,
+    },
+  ];
+
+  if (faq.length > 0) {
+    structuredData.push({
+      '@context': 'https://schema.org',
+      '@type': 'FAQPage',
+      mainEntity: faq.map((item) => ({
+        '@type': 'Question',
+        name: item.question,
+        acceptedAnswer: {
+          '@type': 'Answer',
+          text: item.answer,
+        },
+      })),
+    });
+  }
+
+  return structuredData;
+}