redesign the site as a technical minimalist TUI

Replace the glassy hero treatment with a terminal and TUI vocabulary
while keeping the layout minimal:

- Switch the type stack to JetBrains Mono and flatten every surface:
  hairline borders, square corners, no blur or glow, and a faint
  graph-paper grid in place of the radial gradients.
- Rebuild the home hero as a terminal window whose output is typed in
  on load; the old mouse-parallax glow script becomes that typing
  sequence, and it no-ops under prefers-reduced-motion.
- Give the projects, about, and entry panels title bars, and render
  cards with a metadata strip, status dot, ISO date, and prompt-style
  links.
- Hide the inline nav behind the hamburger on narrow screens; the old
  rule was outranked by the #menu id selector and never applied.
- Add an SVG favicon, which also clears the only 404 on the site.

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

projects.html

@@ -9,7 +9,7 @@
   <meta name='keywords' content="Braeden Sowinski, sowinski.dev, projects, updates, portfolio, software engineer, BCIT" />
   <meta name='viewport' content='width=device-width, initial-scale=1.0'>
   <meta name='robots' content='index, follow'>
-  <meta name='theme-color' content='#1d1e20'>
+  <meta name='theme-color' content='#0c0d10'>
   <link rel='canonical' href='https://sowinski.dev/projects.html'>
   <meta property='og:type' content='website'>
   <meta property='og:title' content='Braeden Sowinski Projects and Updates | Software Portfolio'>
@@ -43,11 +43,12 @@
     }
   </script>
 
+  <link rel="icon" type="image/svg+xml" href="./public/images/favicon.svg">
   <link rel="stylesheet" href="./public/css/style.css">
   <link rel="stylesheet" href="./public/css/projects.css">
 </head>
 
-<body class="js-stop-transition">
+<body class="js-stop-transition" data-page="projects">
   <header class="header">
     <nav class="nav">
       <div class="logo">
@@ -108,7 +109,7 @@
 
   <main class="projects-page page-shell">
     <section class="projects-hero">
-      <p class="eyebrow">Projects & Updates</p>
+      <p class="cmd">ls ~/projects --all</p>
       <h1>Braeden Sowinski projects, milestones, and technical writeups.</h1>
       <p class="projects-intro">
         A collection of backend, infrastructure, data-driven, and full-stack projects,
@@ -118,27 +119,27 @@
 
     <section class="content-section">
       <div class="section-heading">
-        <div>
-          <p class="eyebrow">Portfolio</p>
-          <h2>Selected Projects</h2>
+        <h2>selected_projects</h2>
+        <div class="section-heading__right">
+          <span id="projects-count" class="section-count"></span>
+          <a class="section-link" href="https://git.sowinski.dev/SowinskiBraeden" target="_blank" rel="noopener noreferrer">gitea</a>
         </div>
-        <a class="section-link" href="https://git.sowinski.dev/SowinskiBraeden" target="_blank" rel="noopener noreferrer">View Gitea</a>
       </div>
       <div id="projects-grid" class="content-grid">
         <p class="loading-state">Loading projects...</p>
       </div>
       <div id="projects-toggle-shell" class="projects-toggle-shell" hidden>
         <button id="projects-toggle" class="projects-toggle" type="button" aria-expanded="false">
-          Show More Projects
+          show more projects
         </button>
       </div>
     </section>
 
     <section class="content-section updates-section">
       <div class="section-heading">
-        <div>
-          <p class="eyebrow">Recent</p>
-          <h2>Updates & Achievements</h2>
+        <h2>updates_and_achievements</h2>
+        <div class="section-heading__right">
+          <span id="updates-count" class="section-count"></span>
         </div>
       </div>
       <div id="updates-grid" class="content-grid updates-grid">