Add Open Graph and SEO meta tags with banner image

apps/marketing/index.html

@@ -3,7 +3,26 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Plannotator</title>
+    <title>Plannotator - Visual Plan Review for Claude Code</title>
+    <meta name="description" content="Interactive Plan Review: Mark up and refine your plans using a UI, easily share for team collaboration, automatically integrates with Claude Code plan mode." />
+
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="https://plannotator.ai/" />
+    <meta property="og:title" content="Plannotator - Visual Plan Review for Claude Code" />
+    <meta property="og:description" content="Interactive Plan Review: Mark up and refine your plans using a UI, easily share for team collaboration, automatically integrates with Claude Code plan mode." />
+    <meta property="og:image" content="https://plannotator.ai/og-image.webp" />
+
+    <!-- Twitter -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:url" content="https://plannotator.ai/" />
+    <meta name="twitter:title" content="Plannotator - Visual Plan Review for Claude Code" />
+    <meta name="twitter:description" content="Interactive Plan Review: Mark up and refine your plans using a UI, easily share for team collaboration, automatically integrates with Claude Code plan mode." />
+    <meta name="twitter:image" content="https://plannotator.ai/og-image.webp" />
+
+    <!-- Additional SEO -->
+    <meta name="robots" content="index, follow" />
+    <link rel="canonical" href="https://plannotator.ai/" />
 
     <!-- Fonts -->
     <link rel="preconnect" href="https://fonts.googleapis.com">