Phase 5: every page of the site, the resume PDF and RSS

Landing, About, Now, Resume (with a generated PDF), Work and case studies,
Inquiries and the sent page, Library and the Shelf, Workshop and craft pages,
Tabletop, Blog with topics and posts, RSS, the Store, product lines, the
order form and the 404, all rendered from the content service's notes.

Schema: experience previousRoles, skills stack core items, page stats,
make tags and deck favorite. Icon names from notes map to brand icons in one
place, and HTML comments are dropped when Markdown renders.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012aSbo2D1qP8cMFQCykf7kx

services/site/src/components/world/WorldSection.astro

@@ -0,0 +1,70 @@
+---
+/**
+ * A page section on the world pages: a gold star, the Cinzel heading with the
+ * filament underline, an optional intro line, and an action at the right.
+ */
+import Star from "@gk/ui/components/Star.astro";
+
+interface Props {
+  id: string;
+  title: string;
+  intro?: string;
+  class?: string;
+}
+const { id, title, intro, class: className } = Astro.props;
+---
+<section class:list={["ws", className]} aria-labelledby={id}>
+  <div class="head">
+    <div class="titles">
+      <h2 id={id}><Star size={14} />{title}</h2>
+      <span class="underline" aria-hidden="true"></span>
+      {intro && <p class="intro">{intro}</p>}
+    </div>
+    {Astro.slots.has("action") && <div class="action"><slot name="action" /></div>}
+  </div>
+  <slot />
+</section>
+
+<style>
+  .ws {
+    display: flex;
+    flex-direction: column;
+    gap: 18px;
+    padding-top: 32px;
+  }
+  .head {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-end;
+    justify-content: space-between;
+    gap: 12px;
+  }
+  .titles {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+  h2 {
+    margin: 0;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    font-size: 26px;
+    letter-spacing: 0.06em;
+  }
+  .underline {
+    display: block;
+    width: 180px;
+    height: 2px;
+    border-radius: 2px;
+    background:
+      radial-gradient(circle at 18% 50%, var(--gk-teal-bright) 0 2px, transparent 3px),
+      linear-gradient(90deg, var(--gk-gold), rgba(201, 162, 74, 0.15) 70%, transparent);
+    box-shadow: 0 0 8px rgba(201, 162, 74, 0.35);
+  }
+  .intro {
+    margin: 0;
+    font-size: 15px;
+    color: var(--gk-muted);
+  }
+</style>