wip

apps/website/components/landing/Footer.tsx

@@ -1,8 +1,12 @@
 'use client';
 
+import Image from 'next/image';
 import { useRef } from 'react';
 import { useScrollProgress } from '@/hooks/useScrollProgress';
 
+const discordUrl = process.env.NEXT_PUBLIC_DISCORD_URL || 'https://discord.gg/gridpilot';
+const xUrl = process.env.NEXT_PUBLIC_X_URL || '#';
+
 export default function Footer() {
   return (
     <footer className="relative bg-deep-graphite">
@@ -30,6 +34,15 @@ export default function Footer() {
             transform: 'translateY(0)'
           }}
         >
+          <div className="mb-2 flex justify-center">
+            <Image
+              src="/images/logos/icon-square-dark.svg"
+              alt="GridPilot"
+              width={40}
+              height={40}
+              className="h-8 w-auto md:h-10"
+            />
+          </div>
           <p className="text-[9px] md:text-xs lg:text-sm text-gray-300 mb-1 md:mb-2">
             🏁 Built by a sim racer, for sim racers
           </p>
@@ -47,11 +60,17 @@ export default function Footer() {
           }}
         >
           <a
-            href="https://discord.gg/gridpilot"
+            href={discordUrl}
             className="text-[9px] md:text-xs text-primary-blue hover:text-neon-aqua transition-colors font-medium inline-flex items-center justify-center min-h-[44px] min-w-[44px] px-3 py-2 active:scale-95 transition-transform"
           >
             💬 Join Discord
           </a>
+          <a
+            href={xUrl}
+            className="text-[9px] md:text-xs text-gray-300 hover:text-neon-aqua transition-colors font-medium inline-flex items-center justify-center min-h-[44px] min-w-[44px] px-3 py-2 active:scale-95 transition-transform"
+          >
+            𝕏 Follow on X
+          </a>
         </div>
 
         {/* Development status */}