Step 2: Update main title to synthwave typography

- Changed font to Michroma (futuristic monospace)
- Updated color to magenta (#ff00ff)
- Added intense magenta text-shadow with glow effect
- Added neonFlicker animation with realistic flicker effect
- Increased letter-spacing for cyberpunk aesthetic
- Title now has authentic synthwave appearance

TEST: Refresh homepage to see magenta flickering title

src/styles/styles.css

@@ -134,6 +134,23 @@ body {
     to { filter: drop-shadow(0 0 15px rgba(138, 43, 226, 0.9)); }
 }
 
+@keyframes neonFlicker {
+    0%, 18%, 22%, 25%, 53%, 57%, 100% {
+        text-shadow: 
+            0 0 20px #ff00ff,
+            0 0 40px #ff00ff,
+            0 0 80px #ff00ff,
+            0 4px 8px rgba(0, 0, 0, 0.8);
+    }
+    20%, 24%, 55% {        
+        text-shadow: 
+            0 0 10px #ff00ff,
+            0 0 20px #ff00ff,
+            0 0 40px #ff00ff,
+            0 4px 8px rgba(0, 0, 0, 0.8);
+    }
+}
+
 /* Enhanced Hero Section */
 .hero-header {
     background: linear-gradient(135deg, 
@@ -189,13 +206,18 @@ body {
 }
 
 .hero-title-main {
+    font-family: 'Michroma', monospace;
     font-size: clamp(3rem, 8vw, 6rem);
-    color: var(--color-primary);
+    font-weight: 400;
+    color: #ff00ff;
     text-shadow: 
-        0 0 30px rgba(138, 43, 226, 0.8),
-        0 4px 8px rgba(0, 0, 0, 0.5);
-    -webkit-text-stroke: 0.5px rgba(255, 255, 255, 0.3);
-    animation: titleGlow 3s ease-in-out infinite alternate;
+        0 0 20px #ff00ff,
+        0 0 40px #ff00ff,
+        0 0 80px #ff00ff,
+        0 4px 8px rgba(0, 0, 0, 0.8);
+    text-transform: uppercase;
+    letter-spacing: 8px;
+    animation: neonFlicker 4s ease-in-out infinite;
     line-height: 0.9;
 }