Add .nojekyll to fix simonives.md 404 (Jekyll front-matter rendering)

404.html

@@ -23,11 +23,9 @@
     <title>Page not found — Simon Ives</title>
     <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>Φ</text></svg>">
     <link rel="author" type="text/markdown" href="simonives.md">
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Inter:wght@400;500&display=swap">
-    <link rel="stylesheet" href="style.css">
-    <link rel="stylesheet" href="style-v2.css">
+    <link rel="stylesheet" href="fonts.css">
+    <link rel="stylesheet" href="tokens.css">
+    <link rel="stylesheet" href="components.css">
     <script type="application/ld+json">
     {
       "@context": "https://schema.org",
@@ -65,6 +63,7 @@
                     <li><a href="now.html">Now</a></li>
                     <li><a href="https://enterprisephronesis.substack.com" target="_blank" rel="noopener noreferrer" class="phronesis-link">Phronesis ↗</a></li>
                 </ul>
+                <div class="nav-divider"></div>
                 <button id="theme-toggle" aria-label="Toggle colour theme">◐</button>
                 <div class="header-social">
                     <a href="https://www.linkedin.com/in/simonives" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">
@@ -91,13 +90,22 @@
                     navContainer.classList.toggle('is-active');
                     document.body.classList.toggle('no-scroll');
                 });
+
+                document.addEventListener('keydown', (e) => {
+                    if (e.key === 'Escape' && menuToggle.getAttribute('aria-expanded') === 'true') {
+                        menuToggle.setAttribute('aria-expanded', 'false');
+                        navContainer.classList.remove('is-active');
+                        document.body.classList.remove('no-scroll');
+                        menuToggle.focus();
+                    }
+                });
             });
         </script>
     </header>
 
     <main>
-        <section class="hero section-padding">
-            <div class="phi-watermark" aria-hidden="true">Φ</div>
+        <section class="hero on-midnight section-padding">
+            <span class="phi-watermark phi-watermark--centred" aria-hidden="true">Φ</span>
             <div class="container hero-content">
                 <div class="phi-accent-bar"></div>
                 <span class="eyebrow">404 — Page not found</span>
@@ -112,23 +120,36 @@ <h1 class="hero-headline">This page does not exist.</h1>
             </div>
         </section>
 
-        <hr class="section-divider">
+        <div class="container">
+            <div class="phi-break" aria-hidden="true"><span>Φ</span></div>
+        </div>
 
         <section class="engage-section">
+          <div class="container">
+            <span class="eyebrow">Where to next</span>
             <div class="engage-grid">
-                <div class="engage-block">
-                    <span class="engage-tag">READ</span>
-                    <div class="engage-title">Phronesis</div>
-                    <p>Practical wisdom for enterprise transformation — on Substack.</p>
-                    <a href="https://enterprisephronesis.substack.com" target="_blank" rel="noopener noreferrer" class="engage-link">Read on Substack ↗</a>
-                </div>
-                <div class="engage-block">
-                    <span class="engage-tag">CONNECT</span>
-                    <div class="engage-title">LinkedIn</div>
-                    <p>Connect or follow on LinkedIn for occasional updates and commentary.</p>
-                    <a href="https://www.linkedin.com/in/simonives" target="_blank" rel="noopener noreferrer" class="engage-link">Connect on LinkedIn ↗</a>
-                </div>
+              <a href="https://enterprisephronesis.substack.com" target="_blank" rel="noopener noreferrer" class="engage-block">
+                <span class="engage-tag">Read</span>
+                <span class="engage-title">Phronesis</span>
+                <p class="engage-body">Practical wisdom for enterprise transformation — on Substack.</p>
+                <span class="engage-link">Read on Substack ↗</span>
+              </a>
+              <a href="https://www.linkedin.com/in/simonives" target="_blank" rel="noopener noreferrer" class="engage-block">
+                <span class="engage-tag">Connect</span>
+                <span class="engage-title">LinkedIn</span>
+                <p class="engage-body">Connect or follow on LinkedIn for occasional updates and commentary.</p>
+                <span class="engage-link">Connect on LinkedIn ↗</span>
+              </a>
+              <!-- PLACEHOLDER COPY, pending content pass, do not treat as final. See docs/superpowers/plans/2026-09-16-material-design-site-refresh.md Task 8. This third card is genuinely new; the Read/Connect cards above restore this page's pre-existing, real copy. -->
+              <a href="portfolio.html" class="engage-block">
+                <span class="engage-tag">See</span>
+                <span class="engage-title">The track record</span>
+                <p class="engage-body">How the work was governed, in practice.</p>
+                <span class="engage-link">Read the track record →</span>
+              </a>
+              <!-- END PLACEHOLDER COPY -->
             </div>
+          </div>
         </section>
     </main>
 
@@ -140,7 +161,7 @@ <h1 class="hero-headline">This page does not exist.</h1>
                 <span aria-hidden="true"> · </span>
                 <a href="https://www.linkedin.com/in/simonives" target="_blank" rel="noopener noreferrer">Connect on LinkedIn ↗</a>
             </p>
-            <hr class="footer-rule">
+            <div class="phi-break" aria-hidden="true"><span>Φ</span></div>
             <div class="footer-content">
                 <div class="footer-copy">
                     <p>&copy; 2026 Simon Ives. All rights reserved.</p>