diff --git a/apps/web/app/(marketing)/page.tsx b/apps/web/app/(marketing)/page.tsx
index 5314520..42706d6 100644
--- a/apps/web/app/(marketing)/page.tsx
+++ b/apps/web/app/(marketing)/page.tsx
@@ -1,5 +1,5 @@
-import { CodeBlock } from '@/components/code-block';
 import { JsonLd } from '@/components/json-ld';
+import { StaticCodeBlock } from '@/components/static-code-block';
 import { FAQ, faqJsonLd } from '@/lib/seo';
 import Link from 'next/link';
 
@@ -134,9 +134,9 @@ export default function Landing() {
           <div className="relative min-w-0">
             <div className="absolute -inset-px rounded-lg border border-[--color-border-strong]" />
             <div className="space-y-3">
-              <CodeBlock label="prompt.txt" code={PROMPT_EXAMPLE} />
-              <CodeBlock label="build.log" code={OUTPUT_EXAMPLE} />
-              <CodeBlock label="claude_desktop_config.json" code={INSTALL_SNIPPET} />
+              <StaticCodeBlock label="prompt.txt" code={PROMPT_EXAMPLE} />
+              <StaticCodeBlock label="build.log" code={OUTPUT_EXAMPLE} />
+              <StaticCodeBlock label="claude_desktop_config.json" code={INSTALL_SNIPPET} />
             </div>
           </div>
         </div>
diff --git a/apps/web/components/static-code-block.tsx b/apps/web/components/static-code-block.tsx
new file mode 100644
index 0000000..c1d947e
--- /dev/null
+++ b/apps/web/components/static-code-block.tsx
@@ -0,0 +1,37 @@
+import { cn } from '@/lib/cn';
+
+export interface StaticCodeBlockProps {
+  code: string;
+  language?: string;
+  label?: string;
+  className?: string;
+}
+
+/**
+ * Server-only variant of CodeBlock — no copy button, no client hydration.
+ *
+ * Use this for above-the-fold marketing content where every kilobyte of
+ * JS hurts LCP. The interactive CodeBlock pulls in lucide-react icons and
+ * a useState boundary that forces an entire client chunk to load before
+ * Lighthouse considers the element "rendered". This static variant is
+ * pure SSR markup and lets the browser paint as soon as the HTML arrives.
+ *
+ * CodeBlock (with copy button) stays in use for dashboard pages where
+ * users actually want to copy snippets.
+ */
+export function StaticCodeBlock({ code, language, label, className }: StaticCodeBlockProps) {
+  return (
+    <div className={cn('panel-subtle relative overflow-hidden', className)}>
+      {(label || language) && (
+        <div className="flex items-center justify-between border-b border-[--color-border] px-3 py-2">
+          <span className="mono text-[11px] uppercase tracking-wider text-[--color-fg-subtle]">
+            {label ?? language}
+          </span>
+        </div>
+      )}
+      <pre className="mono overflow-x-auto px-3 py-3 text-[12.5px] leading-relaxed text-[--color-fg]">
+        <code>{code}</code>
+      </pre>
+    </div>
+  );
+}