feat(landing): add canonical blog path

AGENTS.md

@@ -27,6 +27,7 @@
 
 - Keep tests that protect behavior, user-visible contracts, generated artifacts, integrations, regressions, or data-safety boundaries. Remove or avoid tests that mostly restate implementation literals.
 - Do not add tests that only assert package metadata, prompt/help copy substrings, Markdown wrapper scaffolding, export importability, or duplicated flag passthrough when stronger behavior coverage already exists.
+- Do not add tests for marketing/blog/editorial prose, exact headlines, body copy, or subjective positioning. Copy is reviewed by humans, not locked by tests; only test durable content-system behavior such as schema validation, routing, metadata generation, or safety boundaries.
 - Prefer Code Mode coverage through structured envelopes, session/recovery metadata, generated API checks, schema checks, and real tool execution. Avoid long prompt-description snapshots.
 - Prefer benchmark tests that validate metric shape and failure thresholds. Do not pin static scenario IDs or improvement-name fixtures unless the exact list is the behavior under test.
 - When deleting or skipping a narrow unit test, make sure a stronger integration test, generated-file check, or full gate still protects the meaningful behavior.

apps/landing/src/components/landing/BlogArticle.astro

@@ -0,0 +1,34 @@
+---
+interface Props {
+  canonicalPath: string;
+  date: Date;
+  description: string;
+  title: string;
+}
+
+const { canonicalPath, date, description, title } = Astro.props;
+---
+
+<article class="mx-auto w-[min(840px,calc(100vw_-_32px))] py-20 md:py-28">
+  <a class="text-sm font-medium text-primary-accent hover:text-foreground" href="/blog/">Blog</a>
+  <h1 class="mt-4 text-4xl leading-tight font-semibold tracking-[-0.03em] text-balance text-foreground md:text-6xl">
+    {title}
+  </h1>
+  <p class="mt-5 text-xl leading-8 text-pretty text-muted-foreground">{description}</p>
+  <time class="mt-6 block text-sm text-muted-foreground" datetime={date.toISOString()}>
+    {
+      date.toLocaleDateString("en", {
+        day: "numeric",
+        month: "long",
+        year: "numeric",
+        timeZone: "UTC",
+      })
+    }
+  </time>
+  <div class="blog-prose mt-12">
+    <slot />
+  </div>
+  <p class="mt-12 text-sm text-muted-foreground">
+    Canonical URL: <a class="text-foreground underline decoration-border underline-offset-4 hover:text-primary-accent" href={canonicalPath}>{canonicalPath}</a>
+  </p>
+</article>

apps/landing/src/components/landing/BlogCta.astro

@@ -0,0 +1,42 @@
+---
+import ArrowUpRight from "@tabler/icons/outline/arrow-up-right.svg";
+
+import { Button } from "@/components/starwind/button";
+import { Card, CardContent } from "@/components/starwind/card";
+---
+
+<Card class="mt-14 overflow-hidden border-primary-accent/35 bg-card/85">
+  <CardContent class="grid gap-6 p-6 md:grid-cols-[1fr_auto] md:items-center">
+    <div>
+      <p class="text-sm font-medium text-primary-accent">Try Caplets</p>
+      <h2 class="mt-2 text-2xl font-semibold tracking-[-0.02em] text-foreground">Give your agent capabilities, not giant tool walls.</h2>
+      <p class="mt-3 max-w-2xl leading-7 text-muted-foreground">
+        Install the CLI, wire up your agent, browse the catalog, or read the benchmark method behind the launch claim.
+      </p>
+      <code class="mt-5 block overflow-x-auto rounded-lg bg-foreground p-4 font-mono text-sm leading-6 whitespace-pre text-background">npm install -g caplets
+caplets setup</code>
+    </div>
+    <div class="flex flex-col gap-3 sm:flex-row md:flex-col">
+      <Button href="https://docs.caplets.dev" variant="outline">
+        Read docs
+        <ArrowUpRight class="size-4" aria-hidden="true" />
+      </Button>
+      <Button href="https://catalog.caplets.dev" variant="outline">
+        Browse catalog
+        <ArrowUpRight class="size-4" aria-hidden="true" />
+      </Button>
+      <Button href="https://github.com/spiritledsoftware/caplets" variant="outline">
+        GitHub repo
+        <ArrowUpRight class="size-4" aria-hidden="true" />
+      </Button>
+      <Button href="https://www.npmjs.com/package/caplets" variant="outline">
+        npm package
+        <ArrowUpRight class="size-4" aria-hidden="true" />
+      </Button>
+      <Button href="https://github.com/spiritledsoftware/caplets/blob/main/docs/benchmarks/coding-agent.md" variant="outline">
+        Benchmark method
+        <ArrowUpRight class="size-4" aria-hidden="true" />
+      </Button>
+    </div>
+  </CardContent>
+</Card>

apps/landing/src/components/landing/Footer.astro

@@ -6,6 +6,7 @@ import ArrowUpRight from "@tabler/icons/outline/arrow-up-right.svg";
   <div class="mx-auto flex w-[min(1180px,calc(100vw_-_32px))] flex-col gap-5 text-sm text-muted-foreground md:flex-row md:items-center md:justify-between">
     <p>Caplets gives agents capabilities, not giant tool walls.</p>
     <nav class="flex flex-wrap gap-4" aria-label="Footer links">
+      <a class="inline-flex min-h-11 items-center gap-1 font-medium hover:text-foreground" href="/blog/">Blog</a>
       <a class="inline-flex min-h-11 items-center gap-1 font-medium hover:text-foreground" href="https://catalog.caplets.dev">
         Catalog
         <ArrowUpRight class="size-3.5" aria-hidden="true" />

apps/landing/src/components/landing/Header.astro

@@ -22,6 +22,7 @@ import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from "@/co
       <a class="site-header__section-link inline-flex min-h-11 items-center rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#why">Why</a>
       <a class="site-header__section-link inline-flex min-h-11 items-center rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#install">Setup</a>
       <a class="site-header__section-link inline-flex min-h-11 items-center rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#proof">Benchmark</a>
+      <a class="site-header__section-link inline-flex min-h-11 items-center rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="/blog/">Blog</a>
       <a class="site-header__section-link inline-flex min-h-11 items-center rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#remote">Remote</a>
       <a class="site-header__docs-link inline-flex min-h-11 items-center gap-1.5 rounded-md px-3 py-2 transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="https://catalog.caplets.dev" target="_blank" rel="noopener noreferrer">
         Catalog
@@ -62,6 +63,7 @@ import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from "@/co
             <a class="starwind-dialog-close flex min-h-11 items-center rounded-md px-3 py-2.5 text-muted-foreground transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#why">Why Caplets</a>
             <a class="starwind-dialog-close flex min-h-11 items-center rounded-md px-3 py-2.5 text-muted-foreground transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#install">Setup</a>
             <a class="starwind-dialog-close flex min-h-11 items-center rounded-md px-3 py-2.5 text-muted-foreground transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#proof">Benchmark</a>
+            <a class="starwind-dialog-close flex min-h-11 items-center rounded-md px-3 py-2.5 text-muted-foreground transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="/blog/">Blog</a>
             <a class="starwind-dialog-close flex min-h-11 items-center rounded-md px-3 py-2.5 text-muted-foreground transition hover:bg-muted hover:text-foreground focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="#remote">Remote server</a>
             <a class="starwind-dialog-close inline-flex min-h-11 items-center justify-between rounded-md px-3 py-2.5 text-foreground transition hover:bg-muted focus-visible:ring-3 focus-visible:ring-outline/50 focus-visible:outline-none" href="https://catalog.caplets.dev" target="_blank" rel="noopener noreferrer">
               Catalog

apps/landing/src/content.config.ts

@@ -0,0 +1,17 @@
+import { defineCollection } from "astro:content";
+import { glob } from "astro/loaders";
+import { z } from "astro/zod";
+
+export const collections = {
+  blog: defineCollection({
+    loader: glob({ pattern: "**/*.md", base: "./src/content/blog" }),
+    schema: z.object({
+      title: z.string(),
+      description: z.string(),
+      date: z.coerce.date(),
+      tags: z.array(z.string()).default([]),
+      draft: z.boolean().default(false),
+      ogImage: z.string().optional(),
+    }),
+  }),
+};