feat: create ICS subdomain and simplify home page

Add `/ics` route with current content and update home page with intriguing message.

#VERCEL_SKIP

Co-authored-by: Jeff Emmett <46964190+Jeff-Emmett@users.noreply.github.com>

app/ics/page.tsx

@@ -0,0 +1,19 @@
+import { Hero } from "@/components/hero"
+import { ConceptsGrid } from "@/components/concepts-grid"
+import { NetworkVisualization } from "@/components/network-visualization"
+import { Principles } from "@/components/principles"
+import { Applications } from "@/components/applications"
+import { Footer } from "@/components/footer"
+
+export default function ICSPage() {
+  return (
+    <main className="min-h-screen">
+      <Hero />
+      <ConceptsGrid />
+      <NetworkVisualization />
+      <Principles />
+      <Applications />
+      <Footer />
+    </main>
+  )
+}

app/page.tsx

@@ -1,19 +1,137 @@
-import { Hero } from "@/components/hero"
-import { ConceptsGrid } from "@/components/concepts-grid"
-import { NetworkVisualization } from "@/components/network-visualization"
-import { Principles } from "@/components/principles"
-import { Applications } from "@/components/applications"
-import { Footer } from "@/components/footer"
+"use client"
+
+import { useEffect, useState } from "react"
+import Link from "next/link"
 
 export default function Home() {
+  const [glitchText, setGlitchText] = useState("ENTER THE NETWORK")
+
+  useEffect(() => {
+    const glitchChars = "!<>-_\\/[]{}—=+*^?#________"
+    const originalText = "ENTER THE NETWORK"
+
+    const glitchInterval = setInterval(() => {
+      if (Math.random() > 0.95) {
+        const glitched = originalText
+          .split("")
+          .map((char) => (Math.random() > 0.9 ? glitchChars[Math.floor(Math.random() * glitchChars.length)] : char))
+          .join("")
+        setGlitchText(glitched)
+
+        setTimeout(() => setGlitchText(originalText), 100)
+      }
+    }, 100)
+
+    return () => clearInterval(glitchInterval)
+  }, [])
+
   return (
-    <main className="min-h-screen">
-      <Hero />
-      <ConceptsGrid />
-      <NetworkVisualization />
-      <Principles />
-      <Applications />
-      <Footer />
+    <main className="min-h-screen relative overflow-hidden bg-black flex items-center justify-center">
+      {/* Animated grid background */}
+      <div className="absolute inset-0 opacity-20">
+        <div
+          className="absolute inset-0"
+          style={{
+            backgroundImage: `
+            linear-gradient(rgba(0, 255, 255, 0.3) 1px, transparent 1px),
+            linear-gradient(90deg, rgba(0, 255, 255, 0.3) 1px, transparent 1px)
+          `,
+            backgroundSize: "50px 50px",
+            animation: "gridScroll 20s linear infinite",
+          }}
+        />
+      </div>
+
+      {/* Fractal orbs */}
+      <div className="absolute top-1/4 left-1/4 w-96 h-96 bg-cyan-500/20 rounded-full blur-3xl animate-pulse" />
+      <div
+        className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-magenta-500/20 rounded-full blur-3xl animate-pulse"
+        style={{ animationDelay: "1s" }}
+      />
+
+      {/* Scan lines */}
+      <div className="absolute inset-0 pointer-events-none opacity-10">
+        <div
+          className="h-full w-full"
+          style={{
+            backgroundImage:
+              "repeating-linear-gradient(0deg, rgba(0, 255, 255, 0.1) 0px, transparent 2px, transparent 4px)",
+            animation: "scanlines 8s linear infinite",
+          }}
+        />
+      </div>
+
+      {/* Main content */}
+      <div className="relative z-10 text-center px-4">
+        <div className="mb-8 space-y-4">
+          {/* Glitch text effect */}
+          <h1
+            className="text-6xl md:text-8xl font-bold text-cyan-400 tracking-wider font-mono"
+            style={{
+              textShadow: `
+                  0 0 10px rgba(0, 255, 255, 0.8),
+                  0 0 20px rgba(0, 255, 255, 0.6),
+                  0 0 30px rgba(0, 255, 255, 0.4),
+                  2px 2px 0 rgba(255, 0, 255, 0.5),
+                  -2px -2px 0 rgba(0, 255, 255, 0.5)
+                `,
+            }}
+          >
+            {glitchText}
+          </h1>
+
+          <p
+            className="text-xl md:text-2xl text-magenta-400 font-mono tracking-wide"
+            style={{
+              textShadow: "0 0 10px rgba(255, 0, 255, 0.8)",
+            }}
+          >
+            Where consciousness meets code
+          </p>
+        </div>
+
+        <div className="space-y-6 max-w-2xl mx-auto">
+          <p className="text-cyan-300/80 text-lg leading-relaxed">
+            The mycelial network awaits. A living system of institutional neuroplasticity, where communities evolve
+            through distributed intelligence.
+          </p>
+
+          <p className="text-magenta-300/80 text-base">
+            Are you ready to explore the intersection of biology, technology, and collective consciousness?
+          </p>
+
+          <Link
+            href="/ics"
+            className="inline-block mt-8 px-8 py-4 border-2 border-cyan-400 text-cyan-400 font-mono text-lg
+                     hover:bg-cyan-400/10 hover:shadow-[0_0_20px_rgba(0,255,255,0.5)]
+                     transition-all duration-300 relative group overflow-hidden"
+          >
+            <span className="relative z-10">INITIALIZE CONNECTION</span>
+            <div
+              className="absolute inset-0 bg-gradient-to-r from-cyan-500/0 via-cyan-500/20 to-cyan-500/0 
+                          translate-x-[-100%] group-hover:translate-x-[100%] transition-transform duration-700"
+            />
+          </Link>
+        </div>
+
+        {/* Pulsing indicator */}
+        <div className="mt-16 flex justify-center items-center gap-2">
+          <div className="w-3 h-3 bg-cyan-400 rounded-full animate-pulse shadow-[0_0_10px_rgba(0,255,255,0.8)]" />
+          <span className="text-cyan-400/60 text-sm font-mono">SYSTEM ACTIVE</span>
+        </div>
+      </div>
+
+      <style jsx>{`
+        @keyframes gridScroll {
+          0% { transform: translateY(0) translateX(0); }
+          100% { transform: translateY(50px) translateX(50px); }
+        }
+        
+        @keyframes scanlines {
+          0% { transform: translateY(0); }
+          100% { transform: translateY(4px); }
+        }
+      `}</style>
     </main>
   )
 }