feat(home): adapt homepage for authenticated users

Changes for logged-in users:
- Top navigation: Show "Dashboard" and "Logout" buttons instead of "Sign In" and "Get Started"
- Hero CTA: Change main button to "Go to Dashboard" instead of "Start Collaborating"
- Hide bottom CTA section (registration prompt) for authenticated users
- Footer Account section: Show "Dashboard" and "Logout" instead of "Sign In" and "Register"

Other improvements:
- Removed "Explore Events" button from hero section
- Cleaned up footer: removed empty placeholder links (Features, How It Works, About, Privacy, Terms)
- Added "Support" section in footer with "Contact Us" link to /contact
- Simplified footer to 3 columns: Product (Events), Support (Contact Us), Account (dynamic based on auth)

frontend/src/pages/HomePage.jsx

@@ -1,7 +1,16 @@
-import { Link } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
-import { Video, Users, Zap, Shield, Camera, MessageCircle, Star } from 'lucide-react';
+import { Video, Users, Zap, Shield, Camera, MessageCircle, Star, LogOut, LayoutDashboard } from 'lucide-react';
+import { useAuth } from '../contexts/AuthContext';
 
 const HomePage = () => {
+  const { user, logout } = useAuth();
+  const navigate = useNavigate();
+
+  const handleLogout = () => {
+    logout();
+    navigate('/login');
+  };
+
   return (
     <div className="min-h-screen bg-white">
       {/* Hero Section */}
@@ -13,6 +22,25 @@ const HomePage = () => {
               <span className="text-2xl font-bold text-white">spotlight.cam</span>
             </div>
             <div className="flex space-x-4">
+              {user ? (
+                <>
+                  <Link
+                    to="/dashboard"
+                    className="flex items-center space-x-2 px-4 py-2 text-white hover:text-primary-100 transition"
+                  >
+                    <LayoutDashboard className="w-4 h-4" />
+                    <span>Dashboard</span>
+                  </Link>
+                  <button
+                    onClick={handleLogout}
+                    className="flex items-center space-x-2 px-6 py-2 bg-white text-primary-600 rounded-lg font-medium hover:bg-primary-50 transition"
+                  >
+                    <LogOut className="w-4 h-4" />
+                    <span>Logout</span>
+                  </button>
+                </>
+              ) : (
+                <>
                   <Link
                     to="/login"
                     className="px-4 py-2 text-white hover:text-primary-100 transition"
@@ -25,6 +53,8 @@ const HomePage = () => {
                   >
                     Get Started
                   </Link>
+                </>
+              )}
             </div>
           </div>
         </nav>
@@ -36,18 +66,12 @@ const HomePage = () => {
           <p className="text-xl md:text-2xl text-primary-100 mb-10 max-w-3xl mx-auto">
             Connect with competitors, record each other's rounds, and swap videos in seconds.
           </p>
-          <div className="flex flex-col sm:flex-row justify-center gap-4">
+          <div className="flex justify-center">
             <Link
-              to="/register"
+              to={user ? "/dashboard" : "/register"}
               className="px-8 py-4 bg-white text-primary-600 rounded-lg text-lg font-semibold hover:bg-primary-50 transition shadow-lg"
             >
-              Start Collaborating
+              {user ? "Go to Dashboard" : "Start Collaborating"}
-            </Link>
-            <Link
-              to="/events"
-              className="px-8 py-4 bg-primary-700 text-white rounded-lg text-lg font-semibold hover:bg-primary-600 transition border-2 border-white/20"
-            >
-              Explore Events
             </Link>
           </div>
         </div>
@@ -203,6 +227,7 @@ const HomePage = () => {
       </section>
 
       {/* CTA Section */}
+      {!user && (
         <section className="py-20 bg-gradient-to-br from-primary-600 to-primary-800">
           <div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
             <h2 className="text-4xl font-bold text-white mb-6">
@@ -219,6 +244,7 @@ const HomePage = () => {
             </Link>
           </div>
         </section>
+      )}
 
       {/* Footer */}
       <footer className="bg-gray-900 text-gray-300 py-12">
@@ -242,43 +268,38 @@ const HomePage = () => {
                     Events
                   </Link>
                 </li>
+              </ul>
+            </div>
+
+            <div>
+              <h3 className="text-white font-semibold mb-4">Support</h3>
+              <ul className="space-y-2 text-sm">
                 <li>
-                  <a href="#features" className="hover:text-primary-400 transition">
+                  <Link to="/contact" className="hover:text-primary-400 transition">
-                    Features
+                    Contact Us
-                  </a>
+                  </Link>
-                </li>
-                <li>
-                  <a href="#how-it-works" className="hover:text-primary-400 transition">
-                    How It Works
-                  </a>
                 </li>
               </ul>
             </div>
 
             <div>
-              <h3 className="text-white font-semibold mb-4">Company</h3>
+              <h3 className="text-white font-semibold mb-4">Account</h3>
               <ul className="space-y-2 text-sm">
+                {user ? (
+                  <>
                     <li>
-                  <a href="#about" className="hover:text-primary-400 transition">
+                      <Link to="/dashboard" className="hover:text-primary-400 transition">
-                    About
+                        Dashboard
-                  </a>
+                      </Link>
                     </li>
                     <li>
-                  <a href="#privacy" className="hover:text-primary-400 transition">
+                      <button onClick={handleLogout} className="hover:text-primary-400 transition text-left">
-                    Privacy
+                        Logout
-                  </a>
+                      </button>
                     </li>
-                <li>
+                  </>
-                  <a href="#terms" className="hover:text-primary-400 transition">
+                ) : (
-                    Terms
+                  <>
-                  </a>
-                </li>
-              </ul>
-            </div>
-
-            <div>
-              <h3 className="text-white font-semibold mb-4">Connect</h3>
-              <ul className="space-y-2 text-sm">
                     <li>
                       <Link to="/login" className="hover:text-primary-400 transition">
                         Sign In
@@ -289,6 +310,8 @@ const HomePage = () => {
                         Register
                       </Link>
                     </li>
+                  </>
+                )}
               </ul>
             </div>
           </div>