fix: mobile nav overflow, hero stacking, sidebar layout, author photo path

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

Author: its-d

_includes/layouts/blog.njk

@@ -55,7 +55,7 @@
         <div class="blog-about-author">
           <h3 class="blog-about-title">About {{ site.authorFullName }}</h3>
           <div class="blog-about-inner">
-            <img src="{{ '/images/hero-profile.png' | url | absoluteUrl }}" alt="{{ site.authorFullName }}" class="blog-about-photo" width="80" height="80">
+            <img src="{{ '/images/self/hero-darian.png' | url | absoluteUrl }}" alt="{{ site.authorFullName }}" class="blog-about-photo" width="80" height="80">
             <div class="blog-about-text">
               <p>{{ site.authorBioShort }}</p>
               <a href="{{ site.github }}" target="_blank" rel="noopener noreferrer" aria-label="GitHub">GitHub</a>

css/style.css

@@ -143,7 +143,10 @@ a:hover {
   transform: translateY(-1px);
 }
 
-@media (max-width: 600px) {
+@media (max-width: 768px) {
+  .nav-links {
+    display: none;
+  }
   .nav-cta {
     display: none;
   }
@@ -279,6 +282,7 @@ a:hover {
 @media (max-width: 900px) {
   .hero-grid {
     grid-template-columns: 1fr;
+    height: auto;
     min-height: auto;
   }
 }
@@ -1087,6 +1091,10 @@ body.page-blog .footer-col {
   .blog-layout {
     grid-template-columns: 1fr;
   }
+  .blog-sidebar {
+    position: static;
+    width: 100%;
+  }
 }
 
 .blog-sidebar {