Release v1.2.0: Newspaper-style layout with major UI refinements

This release transforms PING into a sophisticated newspaper-style digital
publication with enhanced readability and professional presentation.

Major Features:
- New FeaturedPostHero component with full-width newspaper design
- Completely redesigned homepage with responsive newspaper grid layout
- Enhanced PostCard component with refined typography and spacing
- Improved mobile-first responsive design (mobile → tablet → desktop → 2XL)
- Archive section with multi-column layout for deeper content discovery

Technical Improvements:
- Enhanced blog post validation and error handling in lib/blog.ts
- Better date handling and normalization for scheduled posts
- Improved Dockerfile with correct content volume mount paths
- Fixed port configuration (3025 throughout stack)
- Updated Tailwind config with refined typography and newspaper aesthetics
- Added getFeaturedPost() function for hero selection

UI/UX Enhancements:
- Professional newspaper-style borders and dividers
- Improved dark mode styling throughout
- Better content hierarchy and visual flow
- Enhanced author bylines and metadata presentation
- Refined color palette with newspaper sophistication

Documentation:
- Added DESIGN_BRIEF_NEWSPAPER_LAYOUT.md detailing design principles
- Added TESTING_RESULTS_25_POSTS.md with test scenarios

This release establishes PING as a premium publication platform for
AI orchestration and contextual intelligence thought leadership.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

components/BlogHeader.tsx

@@ -20,54 +20,49 @@ export default function BlogHeader() {
   return (
     <header className={`sticky top-0 z-50 transition-all duration-300 ${
       isScrolled 
-        ? 'bg-white/80 dark:bg-carbon-950/80 backdrop-blur-md border-b border-carbon-200/50 dark:border-carbon-800/50' 
-        : 'bg-white/20 dark:bg-carbon-950/20 backdrop-blur-sm'
+        ? 'bg-white/80 dark:bg-mulberry-950/80 backdrop-blur-md border-b border-carbon-200/50 dark:border-carbon-800/50' 
+        : 'bg-white/20 dark:bg-mulberry-950/20 backdrop-blur-sm'
     }`}>
       <nav className="blog-container py-chorus-lg">
-        <div className="flex items-center justify-between">
-          <Link href="/" className="flex items-center space-x-3 group">
-            <div className="w-14 h-14 group-hover:scale-110 transition-transform">
+        {/* Traditional Newspaper Masthead Layout */}
+        <div className="flex flex-col items-center space-y-4">
+          {/* Logo Group - Centered */}
+          <Link href="/" className="flex items-center space-x-4 group">
+            <div className="w-16 h-16 group-hover:scale-110 transition-transform">
               <ThreeLogo className="w-full h-full" />
             </div>
             <div className="flex flex-col">
-              <span className="font-logo font-semibold text-lg leading-none text-carbon-900 dark:text-carbon-100">CHORUS</span>
-              <span className="text-carbon-600 dark:text-carbon-500 text-xs font-medium">PING!</span>
+              <span className="font-logo font-thin text-3xl leading-none text-carbon-900 dark:text-carbon-100 text-center">CHORUS</span>
+              <span className="text-carbon-600 dark:text-carbon-500 text-sm font-bold tracking-wider text-left">PING!</span>
             </div>
           </Link>
 
-
-            
-
-          <div className="hidden md:flex items-center space-x-8">
+          {/* Navigation Bar - Below Logo */}
+          <div className="flex items-center justify-center space-x-8 border-t border-b border-carbon-200 dark:border-carbon-800 py-3 w-full max-w-2xl">
             <Link 
               href="https://chorus.services" 
-              className="text-carbon-600 dark:text-carbon-300 hover:text-carbon-900 dark:hover:text-carbon-100 transition-colors font-semibold"
+              className="text-carbon-600 dark:text-carbon-300 hover:text-carbon-900 dark:hover:text-carbon-100 transition-colors font-medium text-sm uppercase tracking-wide"
             >
               Home
             </Link>
+            <span className="text-carbon-300 dark:text-carbon-700">•</span>
             <Link 
               href="/" 
-              className="text-carbon-600 dark:text-carbon-300 hover:text-carbon-900 dark:hover:text-carbon-100 transition-colors font-semibold"
+              className="text-carbon-600 dark:text-carbon-300 hover:text-carbon-900 dark:hover:text-carbon-100 transition-colors font-medium text-sm uppercase tracking-wide"
             >
               All Posts
             </Link>
-            {/* <Link 
-              href="/tags" 
-              className="text-carbon-600 dark:text-carbon-300 hover:text-carbon-900 dark:hover:text-carbon-100 transition-colors font-semibold"
-            >
-              Topics
-            </Link> */}
-            
-          </div>
-
-          <div className="flex items-center space-x-4">
-            <ThemeToggle />
-            <Link
-              href="https://chorus.services"
-              className="px-4 py-2 bg-carbon-900 dark:bg-mulberry-700 hover:bg-carbon-800 dark:hover:bg-mulberry-600 text-white dark:text-mulberry-100 rounded-lg font-medium transition-colors text-sm"
-            >
-              Join Waitlist
-            </Link>
+            <span className="text-carbon-300 dark:text-carbon-700">•</span>
+            <div className="flex items-center space-x-4">
+              
+              <Link
+                href="https://chorus.services"
+                className="px-3 py-1 bg-carbon-900 dark:bg-mulberry-700 hover:bg-carbon-800 dark:hover:bg-mulberry-600 text-white dark:text-mulberry-100 rounded font-medium transition-colors text-xs uppercase tracking-wide"
+              >
+                Join Waitlist
+              </Link>
+              <ThemeToggle />
+            </div>
           </div>
         </div>
       </nav>