feat(marketing): phase 4 — the marketing pages

PLAN.md §13 phase 4: /features/, /architecture/, /modules/, /integrations/, and
/community/ — plus the two scope items the phase table never assigned to anyone.

Six decisions taken by the org lead before coding, recorded in PLAN.md §10 as
D20-D25:

- D20 /features/ is the homepage's list with a `detail` line, not a second list.
  One data file, two renderings, so they cannot disagree about what exists.
- D21 /architecture/ draws reasons, not reference: three new inline SVGs, one per
  boundary. No endpoint tables, no config keys — those are phase 8's and stay
  canonical in docs/.
- D22 The deliberate absences of §2 become one tagged data file, rendered on the
  three pages that promise them.
- D23 Phase 4 absorbs /community/ (specified in §10 and §14 N3, linked from the
  header since phase 1, built by no phase) and checkLinks.mjs.
- D24 `needsModule`: writing the Teams detail exposed a false claim phase 3
  shipped. Teams are module-sourced only — teams.module_id is NOT NULL, there is
  no create route, sync is gated on providerModuleId() — so the Community group
  no longer says a bare core does all of it.
- D25 The per-capability demo affordance brand.json had promised since phase 2 is
  a deep link, filled at boot from data-demo-path.

checkLinks.mjs reads the built HTML rather than src/, because half these links
are assembled from data files and template literals. Its PLANNED_ROUTES list is
checked in both directions, so it cannot rot into a permanent exemption.

applyBrand.mjs gained a pass that recomputes deep links from their immutable
path, making it idempotent and reversible; checkBrand.mjs lifts that pattern out
and runs it against the stock markup so the two cannot drift. Both proved
against a real mount, in both directions.

Fixes a cascade bug the checks could not see: [data-demo-url=''] and a scoped
component class are both specificity 0,1,0, so .demo-link's `display` beat the
hide rule and twelve links to a nonexistent demo rendered, each resolving to the
current page. The rule is now !important.

The four diagrams' shared SVG vocabulary moved to src/styles/diagram.css.

Verified from a clean checkout: npm ci, all five checks, astro check (0 errors),
production build, and a live browser pass at desktop and 390px.

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

src/components/NotBuilt.astro

@@ -0,0 +1,132 @@
+---
+import { notBuiltFor, assertScopeNonEmpty } from '../data/notBuilt.mjs';
+
+/**
+ * The deliberate absences (PLAN.md §2, D22), rendered for one page's scope.
+ *
+ * §2 describes its absent-features list as "as load-bearing as the rest", and this is the
+ * component that makes that true on a page rather than in a plan. It reads the shared list
+ * so `/features/`, `/integrations/` and `/modules/` cannot drift into telling three
+ * different stories about the same six things.
+ *
+ * ---------------------------------------------------------------------------------------
+ * WHY IT LOOKS LIKE THE REST OF THE PAGE
+ * ---------------------------------------------------------------------------------------
+ * Not a warning box, not a muted footnote, not an accordion. D8's "understated honesty" is
+ * a house style with a specific consequence here: a section that is visually apologetic
+ * teaches a reader that absences are embarrassing, and a section that is visually hidden
+ * teaches them to go looking for the ones you did not mention. These are decisions with
+ * reasons, so they are set as decisions with reasons — the same panels as everything else,
+ * in the same place in the rhythm.
+ *
+ * The one visual difference is the `resolvedBy` line, which every entry carries. An absence
+ * with an exit condition is a position; an absence without one is a hole. D8 gives the
+ * Integration Kit's draft status a defined removal condition and this generalises it.
+ */
+interface Props {
+  /** Which page is asking: `features`, `integrations` or `modules`. */
+  scope: string;
+  /** Section heading. Each page frames the same list for its own reader. */
+  title: string;
+}
+
+const { scope, title } = Astro.props;
+
+assertScopeNonEmpty(scope);
+const entries = notBuiltFor(scope);
+---
+
+<section class="page section notbuilt">
+  <p class="eyebrow">Not built</p>
+  <h2>{title}</h2>
+  <p class="prose notbuilt__lede">
+    Every one of these is a decision rather than a backlog item, so each says why. Where the
+    reasoning was written down in the open, it is linked.
+  </p>
+
+  <ul class="notbuilt__grid">
+    {
+      entries.map((entry) => (
+        <li class="panel notbuilt__item">
+          <h3>{entry.title}</h3>
+          <p class="notbuilt__body">{entry.body}</p>
+          <p class="notbuilt__resolved">
+            <span class="notbuilt__resolved-label">What would change it</span>
+            {entry.resolvedBy}
+          </p>
+          {entry.link && (
+            <p class="notbuilt__link">
+              <a href={entry.link.href} rel="noopener noreferrer">
+                {entry.link.label}
+              </a>
+            </p>
+          )}
+        </li>
+      ))
+    }
+  </ul>
+</section>
+
+<style>
+  .notbuilt h2 {
+    margin: 0 0 0.75rem;
+    font-size: clamp(1.6rem, 3.2vw, 2.1rem);
+  }
+
+  .notbuilt__lede {
+    margin: 0;
+    color: var(--muted);
+  }
+
+  .notbuilt__grid {
+    display: grid;
+    gap: 1rem;
+    margin: 2.25rem 0 0;
+    padding: 0;
+    list-style: none;
+    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
+  }
+
+  .notbuilt__item {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .notbuilt__item h3 {
+    margin: 0 0 0.6rem;
+    color: var(--gold);
+    font-size: 1.02rem;
+  }
+
+  /* Takes the slack, so the exit condition sits at the foot of every card in a row
+     rather than immediately under a body of whatever length — the same kind of
+     statement in the same place on each, which is what makes them readable as a row. */
+  .notbuilt__body {
+    flex: 1;
+    margin: 0;
+    color: var(--muted);
+    font-size: 0.94rem;
+  }
+
+  .notbuilt__resolved {
+    margin: 1rem 0 0;
+    padding-top: 0.85rem;
+    border-top: 1px solid var(--line-soft);
+    color: var(--dim);
+    font-size: 0.88rem;
+  }
+
+  .notbuilt__resolved-label {
+    display: block;
+    color: var(--muted);
+    font-size: 0.72rem;
+    font-weight: 700;
+    letter-spacing: 0.11em;
+    text-transform: uppercase;
+  }
+
+  .notbuilt__link {
+    margin: 0.85rem 0 0;
+    font-size: 0.88rem;
+  }
+</style>