diff --git a/backend/src/index.js b/backend/src/index.js
index 2e6e9b4..1c16b92 100644
--- a/backend/src/index.js
+++ b/backend/src/index.js
@@ -117,7 +117,7 @@ app.use('/api/media_assets', passport.authenticate('jwt', {session: false}), med
 
 app.use('/api/section_media_links', passport.authenticate('jwt', {session: false}), section_media_linksRoutes);
 
-app.use('/api/contact_submissions', passport.authenticate('jwt', {session: false}), contact_submissionsRoutes);
+app.use('/api/contact_submissions', contact_submissionsRoutes);
 
 app.use('/api/career_postings', passport.authenticate('jwt', {session: false}), career_postingsRoutes);
 
diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx
index 3db9935..4fa4556 100644
--- a/frontend/src/pages/index.tsx
+++ b/frontend/src/pages/index.tsx
@@ -1,166 +1,157 @@
-
-import React, { useEffect, useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import type { ReactElement } from 'react';
 import Head from 'next/head';
 import Link from 'next/link';
-import BaseButton from '../components/BaseButton';
-import CardBox from '../components/CardBox';
-import SectionFullScreen from '../components/SectionFullScreen';
+import axios from 'axios';
 import LayoutGuest from '../layouts/Guest';
-import BaseDivider from '../components/BaseDivider';
-import BaseButtons from '../components/BaseButtons';
 import { getPageTitle } from '../config';
-import { useAppSelector } from '../stores/hooks';
-import CardBoxComponentTitle from "../components/CardBoxComponentTitle";
-import { getPexelsImage, getPexelsVideo } from '../helpers/pexels';
 
+const JocketLanding = () => {
+  const [formData, setFormData] = useState({ visitor_name: '', visitor_email: '', message: '' });
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
+  const [showForm, setShowForm] = useState(false);
 
-export default function Starter() {
-    const [illustrationImage, setIllustrationImage] = useState({
-        src: undefined,
-        photographer: undefined,
-        photographer_url: undefined,
-    })
-    const [illustrationVideo, setIllustrationVideo] = useState({video_files: []})
-    const [contentType, setContentType] = useState('image');
-    const [contentPosition, setContentPosition] = useState('background');
-    const textColor = useAppSelector((state) => state.style.linkColor);
-
-    const title = 'Jocket Stealth Site'
-
-    // Fetch Pexels image/video
-    useEffect(() => {
-        async function fetchData() {
-            const image = await getPexelsImage();
-            const video = await getPexelsVideo();
-            setIllustrationImage(image);
-            setIllustrationVideo(video);
-        }
-        fetchData();
-    }, []);
-
-    const imageBlock = (image) => (
-        <div
-            className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'
-            style={{
-                backgroundImage: `${
-                    image
-                        ? `url(${image?.src?.original})`
-                        : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                }`,
-                backgroundSize: 'cover',
-                backgroundPosition: 'left center',
-                backgroundRepeat: 'no-repeat',
-            }}
-        >
-            <div className='flex justify-center w-full bg-blue-300/20'>
-                <a
-                    className='text-[8px]'
-                    href={image?.photographer_url}
-                    target='_blank'
-                    rel='noreferrer'
-                >
-                    Photo by {image?.photographer} on Pexels
-                </a>
-            </div>
-        </div>
-    );
-
-    const videoBlock = (video) => {
-        if (video?.video_files?.length > 0) {
-            return (
-                <div className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'>
-                    <video
-                        className='absolute top-0 left-0 w-full h-full object-cover'
-                        autoPlay
-                        loop
-                        muted
-                    >
-                        <source src={video?.video_files[0]?.link} type='video/mp4'/>
-                        Your browser does not support the video tag.
-                    </video>
-                    <div className='flex justify-center w-full bg-blue-300/20 z-10'>
-                        <a
-                            className='text-[8px]'
-                            href={video?.user?.url}
-                            target='_blank'
-                            rel='noreferrer'
-                        >
-                            Video by {video.user.name} on Pexels
-                        </a>
-                    </div>
-                </div>)
-        }
-    };
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setIsSubmitting(true);
+    try {
+      await axios.post('/contact_submissions', { data: { ...formData, source: 'Stealth Landing' } });
+      setSubmitted(true);
+    } catch (err) {
+      console.error('Submission failed', err);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
 
   return (
-      <div
-          style={
-              contentPosition === 'background'
-                  ? {
-                      backgroundImage: `${
-                          illustrationImage
-                              ? `url(${illustrationImage.src?.original})`
-                              : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                      }`,
-                      backgroundSize: 'cover',
-                      backgroundPosition: 'left center',
-                      backgroundRepeat: 'no-repeat',
-                  }
-                  : {}
-          }
-      >
+    <div className="min-h-screen bg-[#050505] text-gray-400 font-sans selection:bg-cyan-500/30 flex flex-col items-center justify-center overflow-hidden relative">
       <Head>
-        <title>{getPageTitle('Starter Page')}</title>
+        <title>{getPageTitle('JOCKET')}</title>
       </Head>
 
-      <SectionFullScreen bg='violet'>
-      <div
-          className={`flex ${
-              contentPosition === 'right' ? 'flex-row-reverse' : 'flex-row'
-          } min-h-screen w-full`}
-      >
-          {contentType === 'image' && contentPosition !== 'background'
-              ? imageBlock(illustrationImage)
-              : null}
-          {contentType === 'video' && contentPosition !== 'background'
-              ? videoBlock(illustrationVideo)
-              : null}
-          <div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
-        <CardBox className='w-full md:w-3/5 lg:w-2/3'>
-            <CardBoxComponentTitle title="Welcome to your Jocket Stealth Site app!"/>
-        
-            <div className="space-y-3">
-                <p className='text-center '>This is a React.js/Node.js app generated by the <a className={`${textColor}`} href="https://flatlogic.com/generator">Flatlogic Web App Generator</a></p>
-                <p className='text-center '>For guides and documentation please check
-                    your local README.md and the <a className={`${textColor}`} href="https://flatlogic.com/documentation">Flatlogic documentation</a></p>
-            </div>
-        
-            <BaseButtons>
-                <BaseButton
-                    href='/login'
-                    label='Login'
-                    color='info'
-                    className='w-full'
+      {/* Abstract Turbine Visual */}
+      <div className="absolute inset-0 flex items-center justify-center opacity-20 pointer-events-none">
+        <svg
+          className="w-[800px] h-[800px] animate-[spin_60s_linear_infinite]"
+          viewBox="0 0 100 100"
+          fill="none"
+          stroke="currentColor"
+          strokeWidth="0.1"
+        >
+          {Array.from({ length: 24 }).map((_, i) => (
+            <path
+              key={i}
+              d="M50 50 L50 10"
+              transform={`rotate(${i * 15} 50 50)`}
+              className="stroke-cyan-500/50"
+            />
+          ))}
+          <circle cx="50" cy="50" r="10" className="stroke-cyan-500" />
+          <circle cx="50" cy="50" r="40" className="stroke-cyan-500/20" />
+        </svg>
+      </div>
+
+      {/* Main Content */}
+      <main className="z-10 flex flex-col items-center text-center px-6">
+        <h1 className="text-6xl md:text-8xl font-light tracking-[0.3em] text-white mb-2">
+          JOCKET
+        </h1>
+        <p className="text-xs uppercase tracking-[0.5em] opacity-40 mb-12">
+          Propulsion Systems
+        </p>
+
+        {!showForm ? (
+          <button
+            onClick={() => setShowForm(true)}
+            className="text-xs uppercase tracking-[0.3em] hover:text-cyan-400 transition-colors duration-500 border-b border-white/10 pb-1"
+          >
+            Inquire
+          </button>
+        ) : (
+          <div className="w-full max-w-xs animate-fade-in">
+            {submitted ? (
+              <p className="text-xs tracking-widest text-cyan-400 animate-pulse italic">
+                Awaiting clearance.
+              </p>
+            ) : (
+              <form onSubmit={handleSubmit} className="space-y-6">
+                <input
+                  type="text"
+                  placeholder="NAME"
+                  required
+                  className="w-full bg-transparent border-b border-white/10 py-2 text-[10px] tracking-widest focus:outline-none focus:border-cyan-500/50 transition-colors"
+                  value={formData.visitor_name}
+                  onChange={(e) => setFormData({ ...formData, visitor_name: e.target.value })}
                 />
+                <input
+                  type="email"
+                  placeholder="EMAIL"
+                  required
+                  className="w-full bg-transparent border-b border-white/10 py-2 text-[10px] tracking-widest focus:outline-none focus:border-cyan-500/50 transition-colors"
+                  value={formData.visitor_email}
+                  onChange={(e) => setFormData({ ...formData, visitor_email: e.target.value })}
+                />
+                <textarea
+                  placeholder="MESSAGE (OPTIONAL)"
+                  className="w-full bg-transparent border-b border-white/10 py-2 text-[10px] tracking-widest focus:outline-none focus:border-cyan-500/50 transition-colors h-16 resize-none"
+                  value={formData.message}
+                  onChange={(e) => setFormData({ ...formData, message: e.target.value })}
+                />
+                <div className="flex justify-between items-center">
+                  <button
+                    type="button"
+                    onClick={() => setShowForm(false)}
+                    className="text-[8px] tracking-widest opacity-40 hover:opacity-100 transition-opacity"
+                  >
+                    CLOSE
+                  </button>
+                  <button
+                    type="submit"
+                    disabled={isSubmitting}
+                    className="text-[10px] tracking-widest hover:text-cyan-400 transition-colors"
+                  >
+                    {isSubmitting ? 'SENDING...' : 'SUBMIT'}
+                  </button>
+                </div>
+              </form>
+            )}
+          </div>
+        )}
+      </main>
 
-            </BaseButtons>
-        </CardBox>
-        </div>
-      </div>
-      </SectionFullScreen>
-      <div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'>
-        <p className='py-6 text-sm'>© 2026 <span>{title}</span>. All rights reserved</p>
-        <Link className='py-6 ml-4 text-sm' href='/privacy-policy/'>
-            Privacy Policy
+      {/* Footer */}
+      <footer className="absolute bottom-8 w-full flex justify-center space-x-12 z-10">
+        <a
+          href="mailto:careers@jocket.com"
+          className="text-[10px] tracking-[0.3em] uppercase opacity-30 hover:opacity-60 transition-opacity"
+        >
+          Careers
+        </a>
+        <Link
+          href="/login"
+          className="text-[10px] tracking-[0.3em] uppercase opacity-5 hover:opacity-20 transition-opacity"
+        >
+          Access
         </Link>
-      </div>
+      </footer>
 
+      <style jsx global>{`
+        @keyframes fade-in {
+          from { opacity: 0; transform: translateY(10px); }
+          to { opacity: 1; transform: translateY(0); }
+        }
+        .animate-fade-in {
+          animation: fade-in 1s ease-out forwards;
+        }
+      `}</style>
     </div>
   );
-}
+};
 
-Starter.getLayout = function getLayout(page: ReactElement) {
+JocketLanding.getLayout = function getLayout(page: ReactElement) {
   return <LayoutGuest>{page}</LayoutGuest>;
 };
 
+export default JocketLanding;
\ No newline at end of file