refactor(docs): extract landing primitives, sections, and content

[pratyush618]

Cleanup pass on the docs landing page following the post-#129 conversation. The landing was a 240-LOC page.tsx monolith with ~30 lines of hand-rolled syntax-highlighting <span>s, five copy-pasted button styles, and panel chrome duplicated between Hero and Comparison. This PR factors it into reusable primitives + content-vs-render separation, and includes a drive-by fix for the dark-mode Shiki bg.

Six commits, in dependency order — each is independently buildable.

Commits

1. chore(docs): add cn() utility (clsx + tailwind-merge) — installs clsx, replaces the previous one-liner export { twMerge as cn } with the standard cn(...inputs) → twMerge(clsx(inputs)) pattern. Foundation, no call sites yet.

2. feat(docs): add highlight() helper around fumadocs-core/highlight — src/lib/highlight.tsx, async server-side Shiki via Fumadocs' built-in renderer. Centralizes theme defaults + the <pre> className override. Async server components only — runs at build time, zero client cost.

3. feat(docs): add Button, SectionHeader, CodePanel UI primitives — three components in src/components/ui/ plus an index.ts barrel:

   • Button — variants (primary / secondary / ghost), branches on href to render <Link> vs <button>. Replaces 5 hand-styled <Link>s across Hero + CTA.
   • SectionHeader — title + optional description, configurable alignment. Replaces 4 copy-pasted h2 + sub-copy blocks.
   • CodePanel — generic chrome with tone (border-top accent), accepts either label/caption props or a custom header slot. Used by both Hero (window-dots header) and Comparison (label/caption header).

4. feat(docs): extract landing copy into lib/landing-content.tsx — typed constants for HERO, FEATURES, COMPARISON, CTA. Anyone editing copy now touches one file, never JSX. All strings are existing copy verbatim.

5. refactor(docs): split landing into _sections/ and use shared primitives — splits page.tsx into app/(home)/_sections/{hero,features,comparison-section,cta}.tsx (the _ prefix excludes the folder from Next.js routing). page.tsx collapses from 240 LOC to 12 LOC. The standalone comparison.tsx is deleted; its content moves into comparison-section.tsx using the new CodePanel primitive. Index barrels at _sections/index.ts and components/ui/index.ts keep imports flat (import { Button, CodePanel } from "@/components/ui").

6. fix(docs): make Shiki dual-theme bg dark-mode aware — bug fix that surfaced when the side-by-side Comparison shipped in docs: redesign landing comparison as side-by-side + table #129. Shiki's dual-theme mode emits inline style="background-color:#fff" (light) plus --shiki-dark-bg as a CSS variable. Without defaultColor: false, the inline white bg always wins — code blocks rendered with white bg in dark mode. Pass defaultColor: false so Shiki emits CSS variables only; switch the <pre> background to bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg) (Fumadocs ships these utilities). Both themes now show the proper code-block bg.

Net diff

Surface	Before	After
page.tsx LOC	240	12
Inline <span> syntax-highlight LOC	~30	0 (Shiki via highlight())
Hand-styled buttons across landing	5	0 (<Button variant=…>)
Copy-pasted h2 blocks	4	0 (<SectionHeader>)
Marketing copy mixed with JSX	yes	no (landing-content.tsx)
Dark-mode code-block bg	broken (white)	fixed

Test plan

• pnpm --dir docs types:check — clean
• pnpm --dir docs lint — clean (2 known scaffold-CSS !important warnings unchanged)
• pnpm --dir docs build — clean static export, same route count
• CI: Deploy Docs job on this PR
• Visual diff in dev mode against the live site:
  • Hero: same headline, three CTAs, code preview now Shiki-highlighted (was hand-rolled spans)
  • Features grid: 6 cards, identical content
  • Comparison: side-by-side panels + 4-row differentiator table (same as docs: redesign landing comparison as side-by-side + table #129), but dark-mode bg now correct
  • CTA: unchanged
• Toggle dark mode — every code block now has the right bg (was white in dark mode after docs: redesign landing comparison as side-by-side + table #129)
• Mobile (375px) — Hero stacks, Features 1-col, Comparison stacks, CTA scales

Non-goals

• No features/ / providers/ / hooks/ / (routes)/ folders — those serve a CMS-style portfolio, not a static docs site.
• No class-variance-authority — three variants don't justify it; plain tone maps are clearer at this scale.
• No content rewrite — copy is verbatim from the previous monolith.
• No changes to app/docs/, app/api/, app/llms*, app/og/, MDX components, or Fumadocs config.