First real content landing page

cockpit-iq/src/pages/index.astro

@@ -2,15 +2,118 @@
 import Layout from "../layouts/Layout.astro";
 ---
 
-<Layout title="Cockpit IQ">
+<Layout>
-	<main class="px-4 py-8 max-w-xl mx-auto text-center">
+	<section class="px-6 py-12 max-w-3xl mx-auto text-center">
 		<h1 class="text-4xl font-bold mb-4">Cockpit IQ</h1>
-		<p class="text-lg mb-6">Your AI copilot for clear, confident flying.</p>
+		<p class="text-lg text-gray-700 mb-6">
+			A smarter way to fly in busy airspace.
+		</p>
+		<p class="text-md text-gray-600 mb-8">
+			Real-time radio transcription, callsign alerts, and intelligent
+			comms assistance— built for high-performance GA and turboprop
+			cockpits.
+		</p>
 		<a
 			href="#waitlist"
-			class="bg-blue-600 text-white px-6 py-3 rounded-md font-semibold hover:bg-blue-700"
+			class="inline-block bg-blue-600 text-white px-6 py-3 rounded-xl font-semibold hover:bg-blue-700 transition"
+			>Join the waitlist</a
 		>
-			Join the Waitlist
+	</section>
-		</a>
+
-	</main>
+	<section class="px-6 py-12 bg-gray-100">
+		<div class="max-w-3xl mx-auto text-center">
+			<h2 class="text-2xl font-bold mb-4">
+				Ever missed a call from ATC?
+			</h2>
+			<p class="text-gray-700">
+				When the workload spikes—radio chatter, ATC instructions,
+				weather deviations—you need more than a headset. Cockpit IQ
+				listens, remembers, and highlights what matters. So you can
+				focus on flying, not parsing static.
+			</p>
+		</div>
+	</section>
+
+	<section class="px-6 py-12 max-w-4xl mx-auto">
+		<h2 class="text-2xl font-bold text-center mb-8">
+			What Cockpit IQ does for you:
+		</h2>
+		<ul class="space-y-4 text-left text-gray-800">
+			<li>
+				<strong>Callsign Detection:</strong> Flashes a light or replays audio
+				when ATC calls you.
+			</li>
+			<li>
+				<strong>Live Transcription:</strong> Real-time, color-coded display
+				of all ATC comms.
+			</li>
+			<li>
+				<strong>Instant Replay:</strong> Missed a call? Tap once to hear
+				it again.
+			</li>
+			<li>
+				<strong>Clearance Copilot:</strong> Transcribes and visualizes your
+				IFR clearance.
+			</li>
+			<li>
+				<strong>Situational Awareness Model:</strong> Understand who’s ahead
+				of you, what turbulence they’re reporting, and what’s coming.
+			</li>
+			<li>
+				<strong>ADS-B Enhanced:</strong> Combine audio with ADS-B for predictive
+				traffic and routing insights.
+			</li>
+		</ul>
+	</section>
+
+	<section class="px-6 py-12 bg-gray-100">
+		<div class="max-w-3xl mx-auto text-center">
+			<h2 class="text-2xl font-bold mb-4">
+				Built for demanding cockpits.
+			</h2>
+			<p class="text-gray-700">
+				Whether you’re flying a PA-46, a Cirrus, or a TBM—Cockpit IQ
+				gives you clarity when you need it most. Trusted by student
+				pilots, pro instructors, fleet managers, and international
+				operators.
+			</p>
+		</div>
+	</section>
+
+	<section class="px-6 py-12 max-w-3xl mx-auto text-center">
+		<h2 class="text-2xl font-bold mb-4">
+			Easy to install. Powerful by design.
+		</h2>
+		<p class="text-gray-700 mb-6">
+			Cockpit IQ connects in-line with your audio panel—just like a GoPro
+			mic. All processing happens locally. No cloud. No subscriptions.
+			Just intelligent, cockpit-ready support.
+		</p>
+		<a
+			href="#waitlist"
+			class="inline-block bg-blue-600 text-white px-6 py-3 rounded-xl font-semibold hover:bg-blue-700 transition"
+			>Join the waitlist</a
+		>
+	</section>
+
+	<!-- Optional waitlist form section -->
+	<section
+		id="waitlist"
+		class="px-6 py-12 bg-white max-w-md mx-auto text-center"
+	>
+		<h2 class="text-xl font-semibold mb-4">Join the Waitlist</h2>
+		<form class="flex flex-col space-y-4">
+			<input
+				type="email"
+				placeholder="Your email address"
+				class="px-4 py-2 border rounded-md"
+				required
+			/>
+			<button
+				type="submit"
+				class="bg-blue-600 text-white px-6 py-2 rounded-md hover:bg-blue-700 transition"
+				>Sign Up</button
+			>
+		</form>
+	</section>
 </Layout>