This is excellent material. The documents you provided—specifically the Market Positioning Brief, Investor Dossier, and Consolidated Design—give us the exact content needed to populate the site with high-value messaging.
I have synthesized the "SonaXR" brand identity with the "Portugal Language in VR" product details to create a Single-Page Investor/Launch Site.
Based on your Market Positioning Brief 1and Competitive Matrix2, this page is designed to do three things:
You can save the following code as index.html. It uses your specific SonaXR Core Palette (Charcoal Slate, Electric Blue, Sunset Coral)888888888.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SonaXR | Immersive Language Learning</title>
<style>
/* --- BRAND PALETTE VARIABLES [cite: 140-150] --- */
:root {
--bg-charcoal: #1E1E26; /* Charcoal Slate: Deep background */
--brand-blue: #007BFF; /* Electric Blue: Core Brand */
--accent-sky: #33C4FF; /* Sky Neon: Highlights/Glows */
--accent-coral: #FF5C5C; /* Sunset Coral: CTAs */
--text-mist: #E6E8EE; /* Mist Gray: Primary Text */
--text-offwhite: #F9FAFB; /* Off-White: Headings */
--panel-bg: #2b2b36; /* Slightly lighter charcoal for cards */
}
/* --- GLOBAL STYLES --- */
body {
margin: 0;
padding: 0;
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
background-color: var(--bg-charcoal);
color: var(--text-mist);
line-height: 1.6;
}
h1, h2, h3 {
color: var(--text-offwhite);
margin-top: 0;
}
a { text-decoration: none; color: inherit; }
/* --- UTILITIES --- */
.container {
max-width: 1100px;
margin: 0 auto;
padding: 0 20px;
}
.btn {
display: inline-block;
padding: 12px 28px;
border-radius: 4px;
font-weight: bold;
transition: all 0.3s ease;
cursor: pointer;
}
.btn-primary {
background-color: var(--brand-blue);
color: white;
border: 1px solid var(--brand-blue);
box-shadow: 0 0 15px rgba(0, 123, 255, 0.4); /* Glow effect */
}
.btn-primary:hover {
background-color: var(--accent-sky);
border-color: var(--accent-sky);
color: var(--bg-charcoal);
}
/* --- HEADER --- */
header {
padding: 20px 0;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.nav-flex {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo-text {
font-size: 1.8rem;
font-weight: 800;
letter-spacing: 1px;
background: linear-gradient(90deg, var(--brand-blue), var(--accent-sky));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/* --- HERO SECTION --- */
.hero {
padding: 100px 0;
text-align: center;
background: radial-gradient(circle at center, rgba(0, 123, 255, 0.1) 0%, rgba(30, 30, 38, 0) 70%);
}
.hero h1 {
font-size: 3.5rem;
margin-bottom: 20px;
line-height: 1.2;
}
.hero p {
font-size: 1.25rem;
max-width: 700px;
margin: 0 auto 40px;
color: var(--text-mist);
}
/* --- MARKET GAP SECTION --- */
.market-gap {
background-color: var(--panel-bg);
padding: 80px 0;
text-align: center;
}
.grid-3 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
margin-top: 50px;
}
.card {
background: var(--bg-charcoal);
padding: 30px;
border-radius: 8px;
border-top: 3px solid var(--brand-blue);
text-align: left;
}
.card h3 { color: var(--accent-sky); }
/* --- TECH SPECS SECTION [cite: 37, 121] --- */
.tech-specs {
padding: 80px 0;
}
.tech-flex {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 50px;
}
.tech-content { flex: 1; }
.tech-visual {
flex: 1;
background: linear-gradient(135deg, var(--bg-charcoal), #000);
height: 300px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid var(--brand-blue);
}
.tech-list li {
margin-bottom: 15px;
padding-left: 20px;
position: relative;
}
.tech-list li::before {
content: "►";
color: var(--accent-coral);
position: absolute;
left: 0;
font-size: 0.8rem;
top: 4px;
}
/* --- FOOTER --- */
footer {
background-color: #14141a;
padding: 50px 0;
font-size: 0.9rem;
color: #888;
text-align: center;
}
.contact-info {
margin-top: 20px;
font-size: 1.1rem;
color: var(--text-mist);
}
</style>
</head>
<body>
<header>
<div class="container nav-flex">
<div class="logo-text">SonaXR</div>
<nav>
<a href="ken@SonaXR.com" class="btn btn-primary">Contact Investor Relations</a>
</nav>
</div>
</header>
<section class="hero">
<div class="container">
<h1>Bringing you the voice<br>of a different culture.</h1>
<p>
The first immersive, CEFR-certified VR training system dedicated exclusively to
<strong>European Portuguese</strong>. <br>Built on Unity 6 for Meta Quest 3 and PCVR.
</p>
<a href="#market" class="btn btn-primary">View the Market Gap</a>
</div>
</section>
<section id="market" class="market-gap">
<div class="container">
<h2>Why SonaXR?</h2>
<p>Existing VR language apps ignore the European Portuguese market.</p>
<div class="grid-3">
<div class="card">
<h3>The Gap</h3>
<p>Current competitors like <em>Mondly</em> and <em>Immerse</em> focus on Brazilian variants or generic conversation. There is <strong>no dedicated European Portuguese solution</strong> in VR today[cite: 60].</p>
</div>
<div class="card">
<h3>The Solution</h3>
<p><strong>Portugal Language in VR</strong> delivers authentic cultural contexts (Cafés, Markets) with native EP phonetics and CEFR A1-A2 progression[cite: 8].</p>
</div>
<div class="card">
<h3>The Tech</h3>
<p>We utilize <strong>Total Physical Response</strong> (grab & speak) and ML-Agents for adaptive AI tutoring, moving beyond simple dialogue trees[cite: 9, 41].</p>
</div>
</div>
</div>
</section>
<section class="tech-specs">
<div class="container">
<div class="tech-flex">
<div class="tech-content">
<h2>Hardware & Innovation</h2>
<p>SonaXR is bridging the gap between digital immersion and physical literacy.</p>
<ul class="tech-list">
<li><strong>Unity 6 & URP:</strong> High-fidelity rendering for maximum immersion[cite: 16].</li>
<li><strong>Logitech MX Ink Integration:</strong> The first VR language app to support physical handwriting exercises for orthographic retention[cite: 121, 136].</li>
<li><strong>AI-Driven:</strong> ML-Agents 4.0 adaptive tutoring backend.</li>
<li><strong>Multiplayer Ready:</strong> Built on Netcode for GameObjects for future classroom expansion[cite: 38].</li>
</ul>
</div>
<div class="tech-visual">
<span style="color: var(--brand-blue); font-weight: bold;">[ Insert VR Environment Preview ]</span>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<h3>SonaXR LLC</h3>
<p>Kenneth A. Pestka, MSCS | Founder & CEO</p>
<div class="contact-info">
1-864-276-2066 <br>
<a href="ken@SonaXR.com" style="color: var(--brand-blue);">ken@SonaXR.com</a>
</div>
<p style="margin-top: 30px; font-size: 0.8rem;">© 2025 SonaXR LLC. All Rights Reserved.</p>
</div>
</footer>
</body>
</html>
We currently have a "One Page" structure. Based on your Investor Dossier, we could expand this into a multi-page site including:
Would you like me to refine the "Tech Specs" section to specifically highlight the Unity 6 / URP 17.2 details for a more technical audience, or keep it high-level for general investors?
We use cookies to analyze website traffic and optimize your website experience. By accepting our use of cookies, your data will be aggregated with all other user data.