Files
summitwave_landing/landing.html
2025-06-24 16:00:04 +02:00

141 lines
8.1 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SummitWave | Auracast Made Simple</title>
<meta name="description" content="SummitWave Auracast transmitters deliver crystal-clear, low-latency multichannel Bluetooth audio to everyone."/>
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<link rel="apple-touch-icon" href="favicon.ico" />
<meta property="og:type" content="website"/>
<meta property="og:title" content="SummitWave | Auracast Made Simple"/>
<meta property="og:description" content="Broadcast brilliant multichannel audio anywhere with SummitWave Auracast transmitters."/>
<meta property="og:image" content="og-image.png"/>
<!-- Tailwind via CDN for rapid styling -->
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-white text-gray-800 leading-relaxed antialiased">
<!-- =========== Header & Nav =========== -->
<header class="py-6 px-4 md:px-12 flex items-center justify-between">
<img src="logo.png" alt="SummitWave logo" class="h-24 md:h-28" />
<nav class="space-x-6 text-lg font-medium" aria-label="Primary">
<a href="#features" class="hover:text-blue-600">Features</a>
<a href="#usecases" class="hover:text-blue-600">Usecases</a>
<a href="#contact" class="hover:text-blue-600">Contact</a>
</nav>
</header>
<!-- =========== Hero =========== -->
<section class="flex flex-col items-center text-center mt-12 px-4">
<h1 class="text-4xl md:text-5xl font-bold text-blue-700">Crystal-clear multichannel audio for everyone.</h1>
<h2 class="mt-2 text-xl md:text-2xl text-gray-700">For venues, integrators, and event pros who need flawless sound delivered to personal devices.</h2>
<img src="device.png" alt="SummitWave Auracast transmitter" loading="lazy" class="mt-8 w-full max-w-md rounded-lg shadow-xl"/>
<a href="#contact" class="mt-8 inline-block bg-blue-600 text-white rounded-2xl px-8 py-3 shadow-lg transform transition hover:scale-105">
Request a Demo
</a>
</section>
<!-- =========== Features =========== -->
<section id="features" class="mt-24 px-4 md:px-12">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-12 text-blue-700">Key Features</h2>
<div class="grid gap-8 md:grid-cols-3">
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">Flexible audio input options</h3>
<p>Native <strong>AES67</strong> compatibility, USB audio and web audio input ensure seamless integration with existing technology and make usage simple.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">Multicast audio</h3>
<p>Broadcast up to six simultaneous audio channels — perfect for multilanguage or program feeds. Flexible channel configuration options.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">WebBased Control</h3>
<p>Configure, monitor, and update from any device—no additional software needed.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">Smart features</h3>
<p>Integrated multichannel translation integration keeps every attendee posted.</p>
<p>Auto-detect live sources, and load OTA firmware updates with a click.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">Automate deployment</h3>
<p>Comprehensive rest-api for automated deployment and management.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg">
<h3 class="text-xl font-semibold mb-2">Compact & Efficient</h3>
<p>Flexible mounting options with screws, cable ties or adhesive mount.</p>
</div>
</div>
</section>
<!-- =========== UseCases =========== -->
<section id="usecases" class="mt-24 bg-blue-50 py-16 px-4 md:px-12">
<h2 class="text-3xl md:text-4xl font-bold text-center text-blue-700">Auracast in Action</h2>
<div class="mt-12 grid gap-10 md:grid-cols-3">
<div class="bg-white rounded-2xl p-6 shadow-lg flex flex-col">
<h3 class="text-xl font-semibold mb-2">Universities & Lecture Halls</h3>
<p>Stream the lecturers voice, assistive listening, and up channels simultaneously. Listeners tune in with any Auracastenabled personal devices like phone, headset or hearing aids—no venueowned receivers to sanitize or distribute.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg flex flex-col">
<h3 class="text-xl font-semibold mb-2">Conference Centers</h3>
<p>Deliver pristine audio to breakout rooms, overflow areas, and press feeds without additional cabling. Listeners choose their prefered language or program.</p>
</div>
<div class="bg-white rounded-2xl p-6 shadow-lg flex flex-col">
<h3 class="text-xl font-semibold mb-2">Rail & Transit Hubs</h3>
<p>Replace unintelligible PA announcements with clear, ondemand streams for general information, locationbased tourist information. And emergency messages</p>
</div>
</div>
</section>
<!-- =========== Auracast Explainer =========== -->
<section class="mt-24 px-4 md:px-12">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-8 text-blue-700">Why Auracast?</h2>
<ul class="max-w-3xl mx-auto space-y-4 text-lg">
<li><strong>Broadcast Bluetooth</strong>  onetomany audio with no pairing headaches.</li>
<li><strong>Widespread adaption</strong> works with any modern device with Bluetooth-Auracast.</li>
<li><strong>Device Independence</strong>  listeners use their own phones, earbuds, or hearing aids.</li>
<li><strong>Low Latency</strong>  lipsynced speech for presentations and video.</li>
</ul>
</section>
<!-- =========== Contact =========== -->
<section id="contact" class="mt-24 bg-blue-700 text-white py-16 px-4 md:px-12 text-center">
<h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to elevate your audio?</h2>
<p class="max-w-2xl mx-auto mb-10 text-lg">Tell us about you and we'll set up a personalised demo.</p>
<form action="https://formspree.io/f/xrbkynzk" method="POST" class="max-w-xl mx-auto flex flex-col gap-5 text-left">
<label class="block">
<span class="block mb-1 font-medium">Name</span>
<input type="text" name="name" placeholder="Your name" class="w-full px-4 py-3 rounded-lg text-gray-900 focus:ring-2 focus:ring-blue-400 border border-gray-300 focus:outline-none transition" />
</label>
<label class="block">
<span class="block mb-1 font-medium">Company</span>
<input type="text" name="venue" placeholder="Your company" class="w-full px-4 py-3 rounded-lg text-gray-900 focus:ring-2 focus:ring-blue-400 border border-gray-300 focus:outline-none transition" />
</label>
<label class="block">
<span class="block mb-1 font-medium">Email <span class="text-red-400">*</span></span>
<input type="email" name="email" placeholder="you@email.com" required class="w-full px-4 py-3 rounded-lg text-gray-900 focus:ring-2 focus:ring-blue-400 border border-gray-300 focus:outline-none transition" />
</label>
<label class="block">
<span class="block mb-1 font-medium">Message <span class="text-red-400">*</span></span>
<textarea name="message" placeholder="How can we help you?" required class="w-full px-4 py-3 rounded-lg text-gray-900 focus:ring-2 focus:ring-blue-400 border border-gray-300 focus:outline-none transition"></textarea>
</label>
<button type="submit" class="bg-white text-blue-700 rounded-2xl px-10 py-4 font-semibold shadow-lg transform transition hover:scale-105 focus:ring-2 focus:ring-blue-400 border border-blue-700">
Contact us!
</button>
</form>
</section>
<!-- =========== Footer =========== -->
<footer class="py-8 text-center text-sm text-gray-500">
&copy; 2025 SummitWave. All rights reserved.
</footer>
</body>
</html>