fix(site): mobile waitlist input height, "Demo coming soon" panel, blog cleanup

- WaitlistForm: reset the input's flex when the form stacks — the 16rem
  flex-basis was applying to the height in column layout (256px-tall input).
- DemoVideo: add a comingSoon mode that shows a big "Demo coming soon" panel
  instead of the internal PRODUCE placeholder; enable it in the hero and the
  multiplayer section.
- Blog: retitle the post to "Porting KiCad's Graphics to WebGL with Claude"
  (clean slug), set body/description to "Coming soon.", and drop the
  placeholder text from the blog index.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

site/src/components/DemoVideo.astro

@@ -18,10 +18,21 @@ interface Props {
   poster?: string;
   caption?: string;
   ratio?: string; // default 16/9
+  /** When true and no video yet, show a big "Demo coming soon" panel instead of
+   *  the internal PRODUCE placeholder. */
+  comingSoon?: boolean;
   class?: string;
 }
 
-const { mp4, webm, poster, caption, ratio = '16 / 9', class: cls = '' } = Astro.props;
+const {
+  mp4,
+  webm,
+  poster,
+  caption,
+  ratio = '16 / 9',
+  comingSoon = false,
+  class: cls = '',
+} = Astro.props;
 const hasVideo = Boolean(mp4 || webm);
 ---
 
@@ -45,6 +56,10 @@ const hasVideo = Boolean(mp4 || webm);
           <Icon name="icons/play.svg" size="3.5rem" alt="" />
         </button>
       </div>
+    ) : comingSoon ? (
+      <div class="demo-soon bp-grid" style={`aspect-ratio:${ratio};`}>
+        <span class="demo-soon-text">Demo coming soon</span>
+      </div>
     ) : (
       <Placeholder
         label="PRODUCE: multiplayer demo loop — 2–3 live cursors, one board (§4b.2)"
@@ -87,6 +102,22 @@ const hasVideo = Boolean(mp4 || webm);
   .demo-play[hidden] {
     display: none;
   }
+  .demo-soon {
+    display: grid;
+    place-items: center;
+    width: 100%;
+    padding: 1.5rem;
+    text-align: center;
+    border: 1px solid var(--border);
+    border-radius: var(--radius-lg);
+    background-color: var(--bg-soft);
+  }
+  .demo-soon-text {
+    font-size: clamp(1.6rem, 5.5vw, 3rem);
+    font-weight: 800;
+    letter-spacing: -0.01em;
+    color: var(--fg);
+  }
   .demo-caption {
     margin-top: 0.75rem;
     font-family: var(--font-mono);

site/src/components/WaitlistForm.astro

@@ -78,6 +78,11 @@ const hpId = `wl-hp-${source}`;
     flex-direction: column;
     align-items: stretch;
   }
+  /* In a column the 16rem flex-basis would apply to the HEIGHT, ballooning the
+     input — reset it to content height when stacked. */
+  .layout-stack .wl-form input[type='email'] {
+    flex: 0 0 auto;
+  }
   .wl-form input[type='email'] {
     flex: 1 1 16rem;
     min-width: 0;
@@ -126,6 +131,10 @@ const hpId = `wl-hp-${source}`;
     .wl-form {
       flex-direction: column;
     }
+    /* Same column flex-basis fix as above: keep the input at content height. */
+    .wl-form input[type='email'] {
+      flex: 0 0 auto;
+    }
     .wl-form .btn {
       width: 100%;
     }

site/src/content/blog/hello-world.md

@@ -1,19 +0,0 @@
----
-title: "Hello World"
-description: "First placeholder post for the KiCad WebAssembly blog."
-pubDate: 2026-06-07
----
-
-This is a placeholder blog post. Replace this body with real content.
-
-## A heading
-
-Markdown content is rendered to static HTML at build time, so this page ships
-**zero JavaScript** to the browser.
-
-- Bullet one
-- Bullet two
-- Bullet three
-
-To add another post, drop a new `.md` file in `src/content/blog/` with the same
-frontmatter fields (`title`, `description`, `pubDate`).

site/src/content/blog/porting-kicad-graphics-to-webgl-with-claude.md

@@ -0,0 +1,7 @@
+---
+title: "Porting KiCad's Graphics to WebGL with Claude"
+description: "Coming soon."
+pubDate: 2026-06-07
+---
+
+Coming soon.

site/src/pages/blog/index.astro

@@ -13,9 +13,8 @@ const dateFmt = new Intl.DateTimeFormat('en-US', {
 });
 ---
 
-<BaseLayout title="Blog" description="Placeholder blog index.">
+<BaseLayout title="Blog" description="The PCBJam engineering blog — WebAssembly, real-time collaboration, and KiCad internals.">
   <h1>Blog</h1>
-  <p class="muted">Placeholder blog index. Posts live in src/content/blog/.</p>
 
   <ul class="post-list">
     {

site/src/sections/Hero.astro

@@ -34,6 +34,7 @@ import Icon from '../components/Icon.astro';
       {/* TODO(assets): swap for hero board still w/ presence cursors (§4b.3) or the
           multiplayer demo loop (§4b.2) once produced. */}
       <DemoVideo
+        comingSoon
         caption="2 editors · live cursors · one board.kicad_pcb · no merge step"
       />
     </div>

site/src/sections/Multiplayer.astro

@@ -36,6 +36,7 @@ const subpoints = [
 
   <DemoVideo
     class="mp-demo"
+    comingSoon
     caption="2 editors · live cursors · one board.kicad_pcb · no merge step"
   />