copy(website): tagline is "The open-source thread-plane for agents." on three lines

Drops "enterprise" (gtm.md already lists it as reading sales-first) and
hyphenates thread-plane. HERO_H1_LINES breaks the H1 where it is meant to
break; a spec asserts the lines rejoin to HERO_H1, and both the hero and the
OG card render from the lines. The description drops "enterprise" to match.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

Author: blove

README.md

@@ -1,13 +1,13 @@
 <p align="center">
   <img
     src="https://threadplane.ai/assets/hero.svg"
-    alt="Threadplane — the open-source thread plane for enterprise agents"
+    alt="Threadplane — the open-source thread-plane for agents"
     width="100%"
   />
 </p>
 
 <p align="center">
-  <em>The open-source thread plane for enterprise agents.</em>
+  <em>The open-source thread-plane for agents.</em>
 </p>
 
 <p align="center">
@@ -33,7 +33,7 @@
 
 ---
 
-**Threadplane is the open-source thread plane for enterprise agents.** Chat, durable
+**Threadplane is the open-source thread-plane for agents.** Chat, durable
 threads, persistence, human approvals, tool progress, subagents, and generative UI — built on
 Angular Signals and dependency injection, for Angular 20–22. Your backend stays
 where it is: Threadplane adapts a LangGraph or AG-UI agent into a runtime-neutral

apps/website/e2e/website.spec.ts

@@ -21,7 +21,7 @@ async function expectNoHorizontalOverflow(
 test('landing page renders hero headline', async ({ page }) => {
   await page.goto('/');
   await expect(page.locator('#hero-heading')).toBeVisible();
-  await expect(page.locator('#hero-heading')).toHaveText('The open-source thread plane for enterprise agents.');
+  await expect(page.locator('#hero-heading')).toHaveText('The open-source thread-plane for agents.');
   const headline = await page.locator('#hero-heading').textContent();
   expect(headline?.toLowerCase()).toContain('angular');
 });

apps/website/src/app/opengraph-image.tsx

@@ -32,7 +32,7 @@
  * If either changes, re-resolve them here.
  */
 import { ImageResponse } from 'next/og';
-import { HERO_H1, HERO_SUBHEAD, POSITIONING_PROOF_POINTS, PRIMARY_TAGLINE } from '../lib/positioning';
+import { HERO_H1_LINES, HERO_SUBHEAD, POSITIONING_PROOF_POINTS, PRIMARY_TAGLINE } from '../lib/positioning';
 import { loadCardFonts } from './og-font';
 
 // Node runtime (not edge) so we can read the bundled Garamond TTF off disk.
@@ -159,6 +159,8 @@ export default async function OpenGraphImage() {
           <div
             style={{
               display: 'flex',
+              flexDirection: 'column',
+              alignItems: 'center',
               marginTop: 34,
               fontSize: 52,
               fontWeight: 600,
@@ -167,7 +169,9 @@ export default async function OpenGraphImage() {
               color: TOKENS.textPrimary,
             }}
           >
-            {HERO_H1}
+            {HERO_H1_LINES.map((line) => (
+              <div key={line} style={{ display: 'flex' }}>{line}</div>
+            ))}
           </div>
 
           {/* What you get. Wrapped to two lines on purpose — see the header. */}

apps/website/src/components/landing/Hero.tsx

@@ -8,7 +8,7 @@ import { Button } from '../ui/Button';
 import { trackCtaClick } from '../../lib/analytics/client';
 import {
   HERO_EYEBROW,
-  HERO_H1,
+  HERO_H1_LINES,
   HERO_PRIMARY_LABEL,
   HERO_SECONDARY_HREF,
   HERO_SECONDARY_LABEL,
@@ -31,7 +31,14 @@ export function Hero() {
       <Container>
         <div className="hero-stack">
           <Eyebrow tone="accent" className="hero-eyebrow">{HERO_EYEBROW}</Eyebrow>
-          <h1 id="hero-heading" className="hero-heading">{HERO_H1}</h1>
+          <h1 id="hero-heading" className="hero-heading">
+            {HERO_H1_LINES.map((line, i) => (
+              <React.Fragment key={line}>
+                {i > 0 ? ' ' : ''}
+                <span className="hero-heading-line">{line}</span>
+              </React.Fragment>
+            ))}
+          </h1>
           <p className="hero-subhead">
             {HERO_SUBHEAD_SEGMENTS.map((segment) =>
               segment.highlight ? (

apps/website/src/lib/positioning.spec.ts

@@ -10,6 +10,7 @@ import {
   formatAngularRange,
   HERO_EYEBROW,
   HERO_H1,
+  HERO_H1_LINES,
   HERO_PRIMARY_LABEL,
   HERO_SECONDARY_HREF,
   HERO_SECONDARY_LABEL,
@@ -47,15 +48,20 @@ function parses(code: string): boolean {
 describe('positioning: hero copy', () => {
   it('names the exact category in eyebrow, H1, title and description', () => {
     expect(HERO_EYEBROW).toBe('Angular · LangGraph & AG-UI');
-    expect(HERO_H1).toBe('The open-source thread plane for enterprise agents.');
+    expect(HERO_H1).toBe('The open-source thread-plane for agents.');
     expect(HERO_SUBHEAD).toBe('Chat, threads, approvals, and generative UI on Signals and DI. Your backend stays where it is.');
-    expect(HOME_TITLE).toBe('Threadplane — The open-source thread plane for enterprise agents');
+    expect(HOME_TITLE).toBe('Threadplane — The open-source thread-plane for agents');
     expect(HOME_DESCRIPTION).toBe(
-      'The open-source thread plane for enterprise agents: chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.',
+      'The open-source thread-plane for agents: chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.',
     );
     expect(HOME_DESCRIPTION.length).toBeLessThanOrEqual(160);
   });
 
+  it('H1 lines join back to HERO_H1 on three lines', () => {
+    expect(HERO_H1_LINES).toHaveLength(3);
+    expect(HERO_H1_LINES.join(' ')).toBe(HERO_H1);
+  });
+
   it('subhead segments join back to HERO_SUBHEAD, with exactly one highlight', () => {
     // The segments exist only so Hero.tsx can marker-highlight one phrase.
     // If they ever stop reassembling the source-of-truth string, the rendered

apps/website/src/lib/positioning.ts

@@ -3,7 +3,14 @@ import { WEBSITE_SUPPORTED_ANGULAR_MAJORS } from '../components/pricing/angular-
 import type { StageBeat } from './stage-beats';
 
 export const HERO_EYEBROW = 'Angular · LangGraph & AG-UI';
-export const HERO_H1 = 'The open-source thread plane for enterprise agents.';
+export const HERO_H1 = 'The open-source thread-plane for agents.';
+/**
+ * The H1 broken where it is meant to break: three lines, one thought each.
+ * HERO_H1 stays the single source of truth — positioning.spec.ts asserts the
+ * lines join back to it with single spaces, so the rendered heading, the
+ * <title> and the social card cannot drift apart.
+ */
+export const HERO_H1_LINES: readonly string[] = ['The open-source', 'thread-plane', 'for agents.'];
 export const HERO_SUBHEAD =
   'Chat, threads, approvals, and generative UI on Signals and DI. Your backend stays where it is.';
 
@@ -28,13 +35,13 @@ export const HERO_SECONDARY_LABEL = 'See it running in the docs →';
 export const HERO_SECONDARY_HREF = '/docs/chat/guides/generative-ui?mode=run';
 
 /** Kept for layout.tsx default title and the OG image alt. */
-export const PRIMARY_TAGLINE = 'Threadplane — The open-source thread plane for enterprise agents';
+export const PRIMARY_TAGLINE = 'Threadplane — The open-source thread-plane for agents';
 export const HOME_TITLE = PRIMARY_TAGLINE;
 export const HOME_DESCRIPTION =
-  'The open-source thread plane for enterprise agents: chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.';
+  'The open-source thread-plane for agents: chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.';
 /** Longer form used by layout.tsx OG/Twitter defaults and the About page. */
 export const LONG_SUBHEAD =
-  'Threadplane is the open-source thread plane for enterprise agents: signal-native chat, durable threads, persistence, human approvals, tool progress, subagents, and generative UI for Angular, on LangGraph and AG-UI — without replacing your backend or design system.';
+  'Threadplane is the open-source thread-plane for agents: signal-native chat, durable threads, persistence, human approvals, tool progress, subagents, and generative UI for Angular, on LangGraph and AG-UI — without replacing your backend or design system.';
 
 // ── Trust line (values verified by positioning.spec.ts + angular-support-copy.spec.ts) ──
 export function formatAngularRange(majors: readonly number[]): string {

apps/website/src/lib/site-metadata.spec.ts

@@ -18,8 +18,8 @@ import { resolveWebsiteDir } from './website-dir';
 
 describe('site positioning copy', () => {
   it('exports the approved primary tagline and supporting copy', () => {
-    expect(PRIMARY_TAGLINE).toBe('Threadplane — The open-source thread plane for enterprise agents');
-    expect(LONG_SUBHEAD).toContain('open-source thread plane for enterprise agents');
+    expect(PRIMARY_TAGLINE).toBe('Threadplane — The open-source thread-plane for agents');
+    expect(LONG_SUBHEAD).toContain('open-source thread-plane for agents');
     expect(LONG_SUBHEAD).toContain('LangGraph and AG-UI');
     expect(HERO_SUBHEAD).toBe(
       'Chat, threads, approvals, and generative UI on Signals and DI. Your backend stays where it is.',
@@ -65,7 +65,7 @@ describe('site positioning copy', () => {
       type: 'website',
     });
 
-    expect(metadata.title).toBe('Threadplane — The open-source thread plane for enterprise agents');
+    expect(metadata.title).toBe('Threadplane — The open-source thread-plane for agents');
     expect(metadata.description).toBe(HOME_DESCRIPTION);
   });
 });
@@ -142,7 +142,7 @@ describe('createPageMetadata article fields', () => {
     expect(openGraph.images[0].url).toBe('/opengraph-image');
     expect(openGraph.images[0].width).toBe(1200);
     expect(openGraph.images[0].height).toBe(630);
-    expect(openGraph.images[0].alt).toMatch(/open-source thread plane for enterprise agents/);
+    expect(openGraph.images[0].alt).toMatch(/open-source thread-plane for agents/);
   });
 
   it('accepts a page-specific social image', () => {

apps/website/src/lib/site-metadata.ts

@@ -20,7 +20,7 @@ export const DEFAULT_SOCIAL_IMAGE_META = {
   url: DEFAULT_SOCIAL_IMAGE,
   width: 1200,
   height: 630,
-  alt: 'Threadplane — the open-source thread plane for enterprise agents. Chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.',
+  alt: 'Threadplane — the open-source thread-plane for agents. Chat, durable threads, persistence, human approvals, and generative UI for Angular, on LangGraph and AG-UI.',
 } as const;
 export {
   CODING_AGENT_PROMPT,

apps/website/src/styles/landing.css

@@ -23,6 +23,10 @@
   margin-bottom: 24px;
   letter-spacing: -0.02em;
 }
+/* One line per thought; the space between the spans keeps textContent equal to HERO_H1. */
+.hero-heading-line {
+  display: block;
+}
 .hero-subhead {
   font-family: var(--font-inter);
   font-size: var(--text-body-lg);

docs/gtm/messaging.md

@@ -4,7 +4,7 @@
 
 ## Positioning statement (durable)
 
-> For Angular teams building AI agents on LangGraph, AG-UI, or custom backends, Threadplane is the open-source thread plane for enterprise agents: it turns streaming agent events into production-ready Angular experiences: chat, durable threads, interrupts, subagents, planning, memory, generative UI, fallbacks, observability, and tests. Unlike React-first agent UI stacks or raw streaming SDKs, Threadplane is Angular-native, DI-friendly, design-system-first, self-hostable, and built for enterprise Angular apps.
+> For Angular teams building AI agents on LangGraph, AG-UI, or custom backends, Threadplane is the open-source thread-plane for agents: it turns streaming agent events into production-ready Angular experiences: chat, durable threads, interrupts, subagents, planning, memory, generative UI, fallbacks, observability, and tests. Unlike React-first agent UI stacks or raw streaming SDKs, Threadplane is Angular-native, DI-friendly, design-system-first, self-hostable, and built for enterprise Angular apps.
 
 ## Hero (locked for Spec 2 to implement)
 
@@ -63,7 +63,7 @@ Hidden attribution fields (populated by URL params + referrer): `source_page`, `
 
 ## Launch narrative (Spec 6 spine)
 
-> Angular teams are building agents, but the last mile is still messy: streaming state, tool progress, interrupts, durable threads, subagents, planning, memory, generated UI, fallbacks, and tests. React has mature examples. Backend agent frameworks have protocols. Angular teams need something that speaks Signals, DI, templates, standalone components, and enterprise design systems. Threadplane is the MIT-licensed thread plane for enterprise agents: it connects LangGraph, AG-UI, A2UI, and custom backends to production-ready Angular surfaces.
+> Angular teams are building agents, but the last mile is still messy: streaming state, tool progress, interrupts, durable threads, subagents, planning, memory, generated UI, fallbacks, and tests. React has mature examples. Backend agent frameworks have protocols. Angular teams need something that speaks Signals, DI, templates, standalone components, and enterprise design systems. Threadplane is the MIT-licensed thread-plane for agents: it connects LangGraph, AG-UI, A2UI, and custom backends to production-ready Angular surfaces.
 
 ## Avoid