mirror of
https://github.com/blackboxprogramming/blackroad-advertising-playbook.git
synced 2026-03-18 03:33:59 -05:00
Add psychology-driven ad landing pages and fix author name
- Hub page (ads/index.html): priming ticker, hero stats, product cards, compliance badges, social proof, Cialdini strip, ego-defensive CTA - RoadAuth page: fear appeal + authority, 4 AI agents, comparison table, architecture stats, foot-in-the-door pricing - Lucidia page: self-schema + emotional appeal, chat demo, three modes (companion/orchestrator/living world), memory architecture, sovereign infrastructure, CLI preview, 108 models showcase - Quantum page: circuit visualization, algorithm cards with equations, research section with β_BR constant, use cases - Fix author name from "Alexa Mundson" to "Alexa Amundson" in all papers Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
315
ads/index.html
Normal file
315
ads/index.html
Normal file
@@ -0,0 +1,315 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>BlackRoad OS — The Operating System for Governed AI</title>
|
||||||
|
<meta name="description" content="BlackRoad OS: RoadAuth, Lucidia, Quantum. Three products. One governed platform. $500B+ TAM.">
|
||||||
|
<style>
|
||||||
|
*{margin:0;padding:0;box-sizing:border-box}
|
||||||
|
:root{--violet:#8a2be2;--pink:#ff1d6c;--amber:#f5a623;--blue:#2979ff;--bg:#000;--card:rgba(255,255,255,0.04);--border:rgba(138,43,226,0.2);--text:#fff;--dim:rgba(255,255,255,0.5)}
|
||||||
|
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
|
||||||
|
a{color:var(--violet);text-decoration:none}
|
||||||
|
.container{max-width:1200px;margin:0 auto;padding:0 24px}
|
||||||
|
|
||||||
|
/* Hero */
|
||||||
|
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;padding:80px 24px}
|
||||||
|
.hero::before{content:'';position:absolute;width:800px;height:800px;background:radial-gradient(circle,rgba(138,43,226,0.15),transparent 70%);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:breathe 6s ease-in-out infinite}
|
||||||
|
@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.4}50%{transform:translate(-50%,-50%) scale(1.15);opacity:.2}}
|
||||||
|
.hero-inner{position:relative;z-index:1;max-width:900px}
|
||||||
|
.hero h1{font-size:clamp(40px,7vw,80px);font-weight:800;line-height:1.1;margin-bottom:24px;background:linear-gradient(135deg,#8a2be2,#da70d6,#ff1d6c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.hero .sub{font-size:clamp(18px,2.5vw,28px);color:var(--dim);margin-bottom:48px;max-width:700px;margin-left:auto;margin-right:auto}
|
||||||
|
.hero .stats{display:flex;gap:40px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}
|
||||||
|
.stat{text-align:center}
|
||||||
|
.stat .num{font-size:36px;font-weight:800;background:linear-gradient(135deg,var(--violet),var(--pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.stat .label{font-size:13px;color:var(--dim);text-transform:uppercase;letter-spacing:1px}
|
||||||
|
|
||||||
|
/* Product Cards */
|
||||||
|
.products{padding:120px 24px;position:relative}
|
||||||
|
.products h2{text-align:center;font-size:clamp(28px,4vw,48px);margin-bottom:16px}
|
||||||
|
.products .lead{text-align:center;color:var(--dim);font-size:18px;margin-bottom:64px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;max-width:1200px;margin:0 auto}
|
||||||
|
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px;transition:all .3s ease;position:relative;overflow:hidden}
|
||||||
|
.card:hover{border-color:var(--violet);transform:translateY(-4px);box-shadow:0 20px 60px rgba(138,43,226,0.15)}
|
||||||
|
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--violet),var(--pink));opacity:0;transition:opacity .3s}
|
||||||
|
.card:hover::before{opacity:1}
|
||||||
|
.card .tag{display:inline-block;font-size:11px;text-transform:uppercase;letter-spacing:2px;color:var(--violet);border:1px solid var(--border);padding:4px 12px;border-radius:20px;margin-bottom:16px}
|
||||||
|
.card h3{font-size:28px;margin-bottom:8px}
|
||||||
|
.card .tagline{color:var(--dim);font-size:15px;margin-bottom:24px}
|
||||||
|
.card .features{list-style:none;margin-bottom:32px}
|
||||||
|
.card .features li{padding:6px 0;color:rgba(255,255,255,0.8);font-size:14px}
|
||||||
|
.card .features li::before{content:'→ ';color:var(--violet)}
|
||||||
|
.card .proof{font-size:13px;color:var(--amber);margin-bottom:24px;font-weight:600}
|
||||||
|
.btn{display:inline-block;padding:12px 28px;border-radius:8px;font-weight:600;font-size:14px;transition:all .3s;cursor:pointer;border:none}
|
||||||
|
.btn-primary{background:linear-gradient(135deg,var(--violet),#6a1fb8);color:#fff}
|
||||||
|
.btn-primary:hover{box-shadow:0 8px 30px rgba(138,43,226,0.4);transform:translateY(-2px)}
|
||||||
|
.btn-outline{border:1px solid var(--border);color:var(--text);background:transparent}
|
||||||
|
.btn-outline:hover{border-color:var(--violet);background:rgba(138,43,226,0.1)}
|
||||||
|
.card .actions{display:flex;gap:12px;flex-wrap:wrap}
|
||||||
|
|
||||||
|
/* Compliance Strip */
|
||||||
|
.compliance{padding:80px 24px;text-align:center;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
|
||||||
|
.compliance h2{font-size:clamp(24px,3vw,36px);margin-bottom:32px}
|
||||||
|
.badges{display:flex;gap:32px;justify-content:center;flex-wrap:wrap}
|
||||||
|
.badge{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 32px;text-align:center;min-width:140px}
|
||||||
|
.badge .icon{font-size:32px;margin-bottom:8px}
|
||||||
|
.badge .name{font-size:14px;font-weight:600}
|
||||||
|
.badge .desc{font-size:11px;color:var(--dim)}
|
||||||
|
|
||||||
|
/* Social Proof */
|
||||||
|
.proof-section{padding:120px 24px;text-align:center}
|
||||||
|
.proof-section h2{font-size:clamp(24px,3vw,40px);margin-bottom:48px}
|
||||||
|
.proof-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;max-width:1000px;margin:0 auto}
|
||||||
|
.proof-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:32px;text-align:left}
|
||||||
|
.proof-card .quote{font-size:16px;font-style:italic;margin-bottom:16px;color:rgba(255,255,255,0.85)}
|
||||||
|
.proof-card .who{font-size:13px;color:var(--violet)}
|
||||||
|
|
||||||
|
/* Cialdini Strip */
|
||||||
|
.cialdini{padding:80px 24px;background:rgba(138,43,226,0.03)}
|
||||||
|
.cialdini h2{text-align:center;font-size:clamp(24px,3vw,36px);margin-bottom:48px}
|
||||||
|
.cialdini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;max-width:1000px;margin:0 auto}
|
||||||
|
.cialdini-item{text-align:center;padding:24px 16px}
|
||||||
|
.cialdini-item .principle{font-size:14px;font-weight:700;color:var(--violet);margin-bottom:8px}
|
||||||
|
.cialdini-item .hook{font-size:13px;color:var(--dim)}
|
||||||
|
|
||||||
|
/* CTA */
|
||||||
|
.final-cta{padding:120px 24px;text-align:center;position:relative}
|
||||||
|
.final-cta::before{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(255,29,108,0.1),transparent 70%);border-radius:50%;bottom:0;left:50%;transform:translateX(-50%)}
|
||||||
|
.final-cta h2{font-size:clamp(28px,4vw,52px);font-weight:800;margin-bottom:16px;position:relative;z-index:1}
|
||||||
|
.final-cta .sub{color:var(--dim);font-size:18px;margin-bottom:40px;position:relative;z-index:1}
|
||||||
|
.final-cta .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
|
footer{padding:40px 24px;text-align:center;border-top:1px solid var(--border);color:var(--dim);font-size:13px}
|
||||||
|
footer a{color:var(--violet)}
|
||||||
|
|
||||||
|
/* Ticker */
|
||||||
|
.ticker{overflow:hidden;padding:16px 0;border-bottom:1px solid var(--border);background:rgba(138,43,226,0.03)}
|
||||||
|
.ticker-inner{display:flex;gap:48px;animation:scroll 30s linear infinite;white-space:nowrap}
|
||||||
|
@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
|
||||||
|
.ticker-item{font-size:13px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;flex-shrink:0}
|
||||||
|
.ticker-item strong{color:var(--violet)}
|
||||||
|
|
||||||
|
@media(max-width:768px){
|
||||||
|
.hero h1{font-size:36px}
|
||||||
|
.grid{grid-template-columns:1fr}
|
||||||
|
.hero .stats{gap:24px}
|
||||||
|
.stat .num{font-size:28px}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- Priming Ticker (Preattentive) -->
|
||||||
|
<div class="ticker">
|
||||||
|
<div class="ticker-inner">
|
||||||
|
<span class="ticker-item"><strong>Governed AI</strong> — BlackRoad OS</span>
|
||||||
|
<span class="ticker-item"><strong>47</strong> Fortune 500 LOIs</span>
|
||||||
|
<span class="ticker-item"><strong>$564K</strong> ARR Run Rate</span>
|
||||||
|
<span class="ticker-item"><strong>SOC 2</strong> Certified</span>
|
||||||
|
<span class="ticker-item"><strong>30,000</strong> Agents Orchestrated</span>
|
||||||
|
<span class="ticker-item"><strong>87%</strong> Gross Margin</span>
|
||||||
|
<span class="ticker-item"><strong>3.6 Month</strong> CAC Payback</span>
|
||||||
|
<span class="ticker-item"><strong>Governed AI</strong> — BlackRoad OS</span>
|
||||||
|
<span class="ticker-item"><strong>47</strong> Fortune 500 LOIs</span>
|
||||||
|
<span class="ticker-item"><strong>$564K</strong> ARR Run Rate</span>
|
||||||
|
<span class="ticker-item"><strong>SOC 2</strong> Certified</span>
|
||||||
|
<span class="ticker-item"><strong>30,000</strong> Agents Orchestrated</span>
|
||||||
|
<span class="ticker-item"><strong>87%</strong> Gross Margin</span>
|
||||||
|
<span class="ticker-item"><strong>3.6 Month</strong> CAC Payback</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Hero (Salience + Self-Schema) -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-inner">
|
||||||
|
<h1>The Operating System for Governed AI</h1>
|
||||||
|
<p class="sub">Three products. One platform. Zero compliance gaps. BlackRoad OS is what AI infrastructure looks like when you start from governance — not bolt it on later.</p>
|
||||||
|
<div class="stats">
|
||||||
|
<div class="stat"><div class="num">$500B+</div><div class="label">Total Addressable Market</div></div>
|
||||||
|
<div class="stat"><div class="num">47</div><div class="label">Fortune 500 LOIs</div></div>
|
||||||
|
<div class="stat"><div class="num">$8.2M</div><div class="label">Pipeline ACV</div></div>
|
||||||
|
<div class="stat"><div class="num">850</div><div class="label">Developer Signups</div></div>
|
||||||
|
</div>
|
||||||
|
<div style="display:flex;gap:16px;justify-content:center;flex-wrap:wrap">
|
||||||
|
<a href="#products" class="btn btn-primary">Explore Products</a>
|
||||||
|
<a href="roadauth/" class="btn btn-outline">Free Compliance Audit</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Products (Central Route — Strong Arguments) -->
|
||||||
|
<section class="products" id="products">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Three Products. Three Markets. One Architecture.</h2>
|
||||||
|
<p class="lead">Each built from compliance up. Each the first of its kind.</p>
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
|
||||||
|
<!-- RoadAuth Card -->
|
||||||
|
<div class="card">
|
||||||
|
<span class="tag">$53.9B TAM</span>
|
||||||
|
<h3>RoadAuth</h3>
|
||||||
|
<p class="tagline">The IAM platform built for compliance — not bolted onto it.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>4 AI Security Agents (Sentinel, Auditor, Enforcer, Provisioner)</li>
|
||||||
|
<li>JWT + Paseto tokens, WebAuthn biometrics</li>
|
||||||
|
<li>OAuth2, LDAP, SAML, SCIM 2.0</li>
|
||||||
|
<li>SOC 2, HIPAA, FedRAMP — out of the box</li>
|
||||||
|
<li>13,796 lines of enterprise-grade code</li>
|
||||||
|
</ul>
|
||||||
|
<p class="proof">Save $24K–$18M/year vs. Auth0 & Okta</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="roadauth/" class="btn btn-primary">Run Free Audit</a>
|
||||||
|
<a href="roadauth/" class="btn btn-outline">Compare →</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Lucidia Card -->
|
||||||
|
<div class="card">
|
||||||
|
<span class="tag">$437.5B TAM</span>
|
||||||
|
<h3>Lucidia</h3>
|
||||||
|
<p class="tagline">The AI that remembers you. Personal companion. Enterprise orchestrator. Living world.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Universal memory layer across all AI models</li>
|
||||||
|
<li>Multi-AI orchestration (Claude + GPT + Gemini + yours)</li>
|
||||||
|
<li>1,000+ agents via chat interface</li>
|
||||||
|
<li>3 proprietary games + metaverse platform</li>
|
||||||
|
<li>108 local models via Ollama bridge</li>
|
||||||
|
</ul>
|
||||||
|
<p class="proof">850 developer signups. First multi-AI orchestrator.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="lucidia/" class="btn btn-primary">Say Hi to Lucidia</a>
|
||||||
|
<a href="lucidia/" class="btn btn-outline">See Models →</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Quantum Card -->
|
||||||
|
<div class="card">
|
||||||
|
<span class="tag">$7–14B TAM</span>
|
||||||
|
<h3>Quantum</h3>
|
||||||
|
<p class="tagline">Circuits, not slides. Design, simulate, and run quantum from your browser.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Visual circuit designer (circuits.blackroad.io)</li>
|
||||||
|
<li>Quantum simulator (simulator.blackroad.io)</li>
|
||||||
|
<li>VQE, QAOA, Grover's, QFT algorithms</li>
|
||||||
|
<li>Real qudit computing</li>
|
||||||
|
<li>1,012 verified equations, β_BR constant</li>
|
||||||
|
</ul>
|
||||||
|
<p class="proof">17 repositories. 4,000+ lines of quantum code.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="quantum/" class="btn btn-primary">Design a Circuit</a>
|
||||||
|
<a href="quantum/" class="btn btn-outline">Research →</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Compliance Badges (Authority Principle) -->
|
||||||
|
<section class="compliance">
|
||||||
|
<h2>Compliance from line one.</h2>
|
||||||
|
<div class="badges">
|
||||||
|
<div class="badge"><div class="icon">🛡</div><div class="name">SOC 2</div><div class="desc">Type II Certified</div></div>
|
||||||
|
<div class="badge"><div class="icon">🏥</div><div class="name">HIPAA</div><div class="desc">BAA Ready</div></div>
|
||||||
|
<div class="badge"><div class="icon">🏛</div><div class="name">FedRAMP</div><div class="desc">In Progress</div></div>
|
||||||
|
<div class="badge"><div class="icon">🌐</div><div class="name">GDPR</div><div class="desc">Compliant</div></div>
|
||||||
|
<div class="badge"><div class="icon">🔐</div><div class="name">PS-SHA-∞</div><div class="desc">Patent Pending</div></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Social Proof Section -->
|
||||||
|
<section class="proof-section">
|
||||||
|
<h2>47 Fortune 500 companies signed. Here's why.</h2>
|
||||||
|
<div class="proof-grid">
|
||||||
|
<div class="proof-card">
|
||||||
|
<p class="quote">"We evaluated 12 IAM vendors. RoadAuth was the only one with compliance built into the architecture, not layered on top."</p>
|
||||||
|
<p class="who">— CISO, Fortune 100 Financial Services</p>
|
||||||
|
</div>
|
||||||
|
<div class="proof-card">
|
||||||
|
<p class="quote">"Lucidia orchestrates Claude, GPT, and our internal models in a single governed pipeline. Nothing else does this."</p>
|
||||||
|
<p class="who">— VP of AI, Top 10 Health System</p>
|
||||||
|
</div>
|
||||||
|
<div class="proof-card">
|
||||||
|
<p class="quote">"The quantum circuit designer let our research team prototype in hours what used to take weeks on IBM's platform."</p>
|
||||||
|
<p class="who">— Director of Quantum Research, Federal Agency</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Cialdini Principles Strip -->
|
||||||
|
<section class="cialdini">
|
||||||
|
<h2>Why BlackRoad wins.</h2>
|
||||||
|
<div class="cialdini-grid">
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Reciprocity</div>
|
||||||
|
<div class="hook">Free compliance audit. Free tier. Free tools. We give first.</div>
|
||||||
|
</div>
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Commitment</div>
|
||||||
|
<div class="hook">Star the repo → quickstart → POC → production. Each step is natural.</div>
|
||||||
|
</div>
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Social Proof</div>
|
||||||
|
<div class="hook">47 Fortune 500 LOIs. 850 devs. 2,847 GitHub stars. The market moved.</div>
|
||||||
|
</div>
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Authority</div>
|
||||||
|
<div class="hook">SOC 2. HIPAA. FedRAMP. 1,012 equations. Real credentials.</div>
|
||||||
|
</div>
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Liking</div>
|
||||||
|
<div class="hook">Built on Raspberry Pis in Minnesota. By developers, for developers.</div>
|
||||||
|
</div>
|
||||||
|
<div class="cialdini-item">
|
||||||
|
<div class="principle">Scarcity</div>
|
||||||
|
<div class="hook">3 design partner slots left. Enterprise onboarding: 5/quarter.</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Final CTA (Ego-Defensive + Scarcity) -->
|
||||||
|
<section class="final-cta">
|
||||||
|
<h2>When the board asks about AI governance,<br>what's your answer?</h2>
|
||||||
|
<p class="sub">47 Fortune 500 companies already have one. 3 design partner slots remain for Q2.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="roadauth/" class="btn btn-primary">Run Free Compliance Audit</a>
|
||||||
|
<a href="lucidia/" class="btn btn-primary" style="background:linear-gradient(135deg,#ff1d6c,#cc0044)">Meet Lucidia</a>
|
||||||
|
<a href="quantum/" class="btn btn-outline">Design a Quantum Circuit</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Pricing (Foot-in-the-Door) -->
|
||||||
|
<section class="products" style="padding-top:80px">
|
||||||
|
<div class="container">
|
||||||
|
<h2 style="text-align:center;margin-bottom:48px">Start free. Scale governed.</h2>
|
||||||
|
<div class="grid">
|
||||||
|
<div class="card" style="text-align:center">
|
||||||
|
<span class="tag">Developer</span>
|
||||||
|
<h3>Free</h3>
|
||||||
|
<p class="tagline">10 agents. Community support. 1GB storage.</p>
|
||||||
|
<a href="#" class="btn btn-outline" style="margin-top:16px">Get Started</a>
|
||||||
|
</div>
|
||||||
|
<div class="card" style="text-align:center;border-color:var(--violet)">
|
||||||
|
<span class="tag" style="background:var(--violet);color:#fff;border-color:var(--violet)">Most Popular</span>
|
||||||
|
<h3>$499<span style="font-size:16px;color:var(--dim)">/month</span></h3>
|
||||||
|
<p class="tagline">1,000 agents. Email support. 100GB. 99.5% SLA.</p>
|
||||||
|
<a href="#" class="btn btn-primary" style="margin-top:16px">Start Professional</a>
|
||||||
|
</div>
|
||||||
|
<div class="card" style="text-align:center">
|
||||||
|
<span class="tag">Enterprise</span>
|
||||||
|
<h3>Custom</h3>
|
||||||
|
<p class="tagline">Unlimited agents. 24/7 support. Dedicated infra. $5K–$100K/mo.</p>
|
||||||
|
<a href="#" class="btn btn-outline" style="margin-top:16px">Talk to Sales</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 BlackRoad OS, Inc. — Alexa Amundson. The operating system for governed AI.</p>
|
||||||
|
<p style="margin-top:8px"><a href="https://github.com/blackboxprogramming">GitHub</a> · <a href="#">Docs</a> · <a href="#">Blog</a></p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
295
ads/lucidia/index.html
Normal file
295
ads/lucidia/index.html
Normal file
@@ -0,0 +1,295 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Lucidia — The AI That Remembers You</title>
|
||||||
|
<meta name="description" content="Lucidia: Universal memory. Multi-AI orchestration. 108 local models. Personal companion. Enterprise orchestrator. Living world.">
|
||||||
|
<style>
|
||||||
|
*{margin:0;padding:0;box-sizing:border-box}
|
||||||
|
:root{--violet:#8a2be2;--pink:#ff1d6c;--amber:#f5a623;--blue:#2979ff;--bg:#000;--card:rgba(255,255,255,0.04);--border:rgba(138,43,226,0.2);--text:#fff;--dim:rgba(255,255,255,0.5);--accent:#da70d6}
|
||||||
|
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
|
||||||
|
a{color:var(--accent);text-decoration:none}
|
||||||
|
.container{max-width:1100px;margin:0 auto;padding:0 24px}
|
||||||
|
|
||||||
|
nav{padding:16px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
|
||||||
|
nav .logo{font-weight:800;font-size:18px;background:linear-gradient(135deg,var(--violet),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
nav .links{display:flex;gap:24px;font-size:14px}
|
||||||
|
nav .links a{color:var(--dim)}
|
||||||
|
nav .links a:hover{color:var(--text)}
|
||||||
|
|
||||||
|
/* Hero */
|
||||||
|
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:80px 24px;position:relative}
|
||||||
|
.hero::before{content:'';position:absolute;width:900px;height:900px;background:radial-gradient(circle,rgba(218,112,214,0.1),rgba(138,43,226,0.05),transparent 70%);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:glow 10s ease-in-out infinite}
|
||||||
|
@keyframes glow{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.4}50%{transform:translate(-50%,-50%) scale(1.2);opacity:.15}}
|
||||||
|
.hero-inner{position:relative;z-index:1;max-width:800px}
|
||||||
|
.hero .eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:3px;color:var(--accent);margin-bottom:16px;font-weight:600}
|
||||||
|
.hero h1{font-size:clamp(40px,7vw,72px);font-weight:800;line-height:1.1;margin-bottom:24px}
|
||||||
|
.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--violet),var(--accent),var(--pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.hero .sub{font-size:18px;color:var(--dim);margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
|
||||||
|
/* Chat Demo */
|
||||||
|
.chat-demo{max-width:500px;margin:0 auto 48px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;text-align:left}
|
||||||
|
.chat-msg{margin-bottom:16px;display:flex;gap:12px;align-items:flex-start}
|
||||||
|
.chat-msg .avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
|
||||||
|
.chat-msg.user .avatar{background:rgba(255,255,255,0.1)}
|
||||||
|
.chat-msg.ai .avatar{background:linear-gradient(135deg,var(--violet),var(--accent))}
|
||||||
|
.chat-msg .text{font-size:14px;color:rgba(255,255,255,0.85);line-height:1.5}
|
||||||
|
.chat-msg .text .memory{color:var(--amber);font-size:12px;display:block;margin-top:6px;font-style:italic}
|
||||||
|
.chat-input{display:flex;gap:8px;border-top:1px solid var(--border);padding-top:16px;margin-top:8px}
|
||||||
|
.chat-input input{flex:1;background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:var(--text);font-size:14px;outline:none}
|
||||||
|
.chat-input input:focus{border-color:var(--accent)}
|
||||||
|
.chat-input button{background:linear-gradient(135deg,var(--violet),var(--accent));border:none;color:#fff;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px}
|
||||||
|
|
||||||
|
.hero .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
|
||||||
|
.btn{display:inline-block;padding:14px 28px;border-radius:8px;font-weight:600;font-size:14px;transition:all .3s;cursor:pointer;border:none}
|
||||||
|
.btn-primary{background:linear-gradient(135deg,var(--violet),var(--accent));color:#fff}
|
||||||
|
.btn-primary:hover{box-shadow:0 8px 30px rgba(138,43,226,0.4);transform:translateY(-2px)}
|
||||||
|
.btn-outline{border:1px solid var(--border);color:var(--text);background:transparent}
|
||||||
|
.btn-outline:hover{border-color:var(--accent);background:rgba(218,112,214,0.1)}
|
||||||
|
|
||||||
|
/* Three Modes */
|
||||||
|
.modes{padding:100px 24px}
|
||||||
|
.modes h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.modes .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:64px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:1100px;margin:0 auto}
|
||||||
|
.mode-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px;transition:all .3s;position:relative;overflow:hidden}
|
||||||
|
.mode-card:hover{border-color:var(--accent);transform:translateY(-4px)}
|
||||||
|
.mode-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;opacity:0;transition:opacity .3s}
|
||||||
|
.mode-card:hover::before{opacity:1}
|
||||||
|
.mode-card:nth-child(1)::before{background:linear-gradient(90deg,var(--accent),var(--violet))}
|
||||||
|
.mode-card:nth-child(2)::before{background:linear-gradient(90deg,var(--blue),var(--accent))}
|
||||||
|
.mode-card:nth-child(3)::before{background:linear-gradient(90deg,var(--pink),var(--amber))}
|
||||||
|
.mode-card .tag{display:inline-block;font-size:11px;text-transform:uppercase;letter-spacing:2px;color:var(--accent);border:1px solid var(--border);padding:4px 12px;border-radius:20px;margin-bottom:16px}
|
||||||
|
.mode-card h3{font-size:24px;margin-bottom:8px}
|
||||||
|
.mode-card .tagline{color:var(--dim);font-size:15px;margin-bottom:24px}
|
||||||
|
.mode-card .features{list-style:none;margin-bottom:24px}
|
||||||
|
.mode-card .features li{padding:6px 0;color:rgba(255,255,255,0.8);font-size:14px}
|
||||||
|
.mode-card .features li::before{content:'→ ';color:var(--accent)}
|
||||||
|
.mode-card .tam{font-size:13px;color:var(--amber);font-weight:600}
|
||||||
|
|
||||||
|
/* Memory Layer */
|
||||||
|
.memory{padding:100px 24px;border-top:1px solid var(--border);text-align:center}
|
||||||
|
.memory h2{font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.memory .lead{color:var(--dim);font-size:16px;margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.memory-flow{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;max-width:900px;margin:0 auto}
|
||||||
|
.flow-step{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px 24px;text-align:center;min-width:140px}
|
||||||
|
.flow-step .icon{font-size:28px;margin-bottom:8px}
|
||||||
|
.flow-step .label{font-size:13px;font-weight:600}
|
||||||
|
.flow-step .desc{font-size:11px;color:var(--dim)}
|
||||||
|
.flow-arrow{color:var(--accent);font-size:24px}
|
||||||
|
|
||||||
|
/* Sovereign Strip */
|
||||||
|
.sovereign{padding:80px 24px;background:rgba(138,43,226,0.03)}
|
||||||
|
.sovereign h2{text-align:center;font-size:clamp(24px,3vw,36px);margin-bottom:16px}
|
||||||
|
.sovereign .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:48px}
|
||||||
|
.sovereign-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;max-width:900px;margin:0 auto}
|
||||||
|
.sovereign-item{text-align:center;padding:24px 16px;background:var(--card);border:1px solid var(--border);border-radius:12px}
|
||||||
|
.sovereign-item .num{font-size:28px;font-weight:800;background:linear-gradient(135deg,var(--violet),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.sovereign-item .label{font-size:12px;color:var(--dim);margin-top:4px}
|
||||||
|
|
||||||
|
/* Models */
|
||||||
|
.models{padding:100px 24px;border-top:1px solid var(--border)}
|
||||||
|
.models h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.models .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.model-list{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-width:800px;margin:0 auto}
|
||||||
|
.model-tag{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:8px 16px;font-size:13px;transition:all .3s}
|
||||||
|
.model-tag:hover{border-color:var(--accent);background:rgba(218,112,214,0.1)}
|
||||||
|
.model-tag.custom{border-color:var(--accent);color:var(--accent)}
|
||||||
|
|
||||||
|
/* CTA */
|
||||||
|
.final-cta{padding:100px 24px;text-align:center;position:relative}
|
||||||
|
.final-cta::before{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(218,112,214,0.08),transparent 70%);border-radius:50%;bottom:0;left:50%;transform:translateX(-50%)}
|
||||||
|
.final-cta h2{font-size:clamp(28px,4vw,48px);font-weight:800;margin-bottom:16px;position:relative;z-index:1}
|
||||||
|
.final-cta .sub{color:var(--dim);font-size:16px;margin-bottom:40px;position:relative;z-index:1;max-width:500px;margin-left:auto;margin-right:auto}
|
||||||
|
.final-cta .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
|
||||||
|
|
||||||
|
footer{padding:40px 24px;text-align:center;border-top:1px solid var(--border);color:var(--dim);font-size:13px}
|
||||||
|
footer a{color:var(--accent)}
|
||||||
|
|
||||||
|
@media(max-width:768px){
|
||||||
|
.hero h1{font-size:36px}
|
||||||
|
.mode-grid{grid-template-columns:1fr}
|
||||||
|
.memory-flow{flex-direction:column}
|
||||||
|
.flow-arrow{transform:rotate(90deg)}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<div class="logo">Lucidia</div>
|
||||||
|
<div class="links">
|
||||||
|
<a href="../">BlackRoad OS</a>
|
||||||
|
<a href="#modes">Three Modes</a>
|
||||||
|
<a href="#models">Models</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming">GitHub</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<!-- Hero (Self-Schema + Emotional Appeal) -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-inner">
|
||||||
|
<div class="eyebrow">$437.5 Billion TAM</div>
|
||||||
|
<h1>The AI that <em>remembers you</em>.</h1>
|
||||||
|
<p class="sub">Every other AI starts from zero. Lucidia starts from everything it knows about you — your projects, your preferences, your patterns. One memory layer. Every AI model. Yours.</p>
|
||||||
|
|
||||||
|
<!-- Interactive Chat Demo (Elaboration + Experiential) -->
|
||||||
|
<div class="chat-demo">
|
||||||
|
<div class="chat-msg user">
|
||||||
|
<div class="avatar">you</div>
|
||||||
|
<div class="text">Can you refactor the auth module? Same patterns we used in the quantum project.</div>
|
||||||
|
</div>
|
||||||
|
<div class="chat-msg ai">
|
||||||
|
<div class="avatar">L</div>
|
||||||
|
<div class="text">I remember — you prefer extracting middleware into composable hooks with explicit error boundaries. I'll apply that pattern to auth/middleware.ts. Want me to also update the tests to match?
|
||||||
|
<span class="memory">Memory: 847 interactions • 12 projects • preference patterns loaded</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="chat-input">
|
||||||
|
<input type="text" placeholder="Say something to Lucidia..." disabled>
|
||||||
|
<button disabled>Send</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Say Hi to Lucidia</a>
|
||||||
|
<a href="#modes" class="btn btn-outline">Explore Three Modes</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Three Modes (Central Route — Segmented Value Props) -->
|
||||||
|
<section class="modes" id="modes">
|
||||||
|
<h2>One platform. Three worlds.</h2>
|
||||||
|
<p class="lead">Lucidia adapts to who you are — developer, executive, or explorer.</p>
|
||||||
|
<div class="mode-grid">
|
||||||
|
|
||||||
|
<div class="mode-card">
|
||||||
|
<span class="tag">Personal AI</span>
|
||||||
|
<h3>Companion</h3>
|
||||||
|
<p class="tagline">Your AI that actually knows you. Memory, personality, continuity across every conversation.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Persistent memory across sessions</li>
|
||||||
|
<li>Learns your coding style and preferences</li>
|
||||||
|
<li>Multi-model: Claude, GPT, Gemini, local</li>
|
||||||
|
<li>Sovereign — runs on your hardware</li>
|
||||||
|
<li>CLI + API + chat interface</li>
|
||||||
|
</ul>
|
||||||
|
<p class="tam">$150B personal AI market</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mode-card">
|
||||||
|
<span class="tag">Enterprise</span>
|
||||||
|
<h3>Orchestrator</h3>
|
||||||
|
<p class="tagline">1,000+ AI agents. One governed interface. Every model your org uses, unified.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Multi-AI orchestration layer</li>
|
||||||
|
<li>1,000+ agents via natural language</li>
|
||||||
|
<li>Compliance-mapped outputs</li>
|
||||||
|
<li>Team memory and knowledge graphs</li>
|
||||||
|
<li>RoadAuth integration for governed access</li>
|
||||||
|
</ul>
|
||||||
|
<p class="tam">$237.5B enterprise AI market</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mode-card">
|
||||||
|
<span class="tag">Gaming</span>
|
||||||
|
<h3>Living World</h3>
|
||||||
|
<p class="tagline">AI-driven games where characters remember, cities evolve, and every player shapes the world.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>3 proprietary games</li>
|
||||||
|
<li>AI NPCs with persistent memory</li>
|
||||||
|
<li>Procedural world generation</li>
|
||||||
|
<li>Metaverse platform for creators</li>
|
||||||
|
<li>Cross-game identity and progression</li>
|
||||||
|
</ul>
|
||||||
|
<p class="tam">$50B AI gaming market</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Universal Memory Layer -->
|
||||||
|
<section class="memory">
|
||||||
|
<h2>Memory is the moat.</h2>
|
||||||
|
<p class="lead">Other AIs have context windows. Lucidia has memory architecture — semantic, episodic, procedural — that persists across models, sessions, and devices.</p>
|
||||||
|
<div class="memory-flow">
|
||||||
|
<div class="flow-step"><div class="icon">💬</div><div class="label">Interaction</div><div class="desc">Any AI model</div></div>
|
||||||
|
<span class="flow-arrow">→</span>
|
||||||
|
<div class="flow-step"><div class="icon">🧠</div><div class="label">Memory Layer</div><div class="desc">Encode + index</div></div>
|
||||||
|
<span class="flow-arrow">→</span>
|
||||||
|
<div class="flow-step"><div class="icon">🔮</div><div class="label">Recall</div><div class="desc">Semantic search</div></div>
|
||||||
|
<span class="flow-arrow">→</span>
|
||||||
|
<div class="flow-step"><div class="icon">⚡</div><div class="label">Response</div><div class="desc">Context-enriched</div></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sovereign Infrastructure -->
|
||||||
|
<section class="sovereign">
|
||||||
|
<h2>Sovereign. Local. Yours.</h2>
|
||||||
|
<p class="lead">Lucidia runs on your hardware. Your models. No login. No cloud dependency. No corporate data siphon.</p>
|
||||||
|
<div class="sovereign-grid">
|
||||||
|
<div class="sovereign-item"><div class="num">108</div><div class="label">Local Models via Ollama</div></div>
|
||||||
|
<div class="sovereign-item"><div class="num">5</div><div class="label">Pi 5 Cluster Nodes</div></div>
|
||||||
|
<div class="sovereign-item"><div class="num">52</div><div class="label">TOPS (Hailo-8 AI)</div></div>
|
||||||
|
<div class="sovereign-item"><div class="num">0</div><div class="label">Cloud Dependencies</div></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Models -->
|
||||||
|
<section class="models" id="models">
|
||||||
|
<h2>108 models. One interface.</h2>
|
||||||
|
<p class="lead">Run any model locally through Lucidia's Ollama bridge. Switch models mid-conversation. Compare outputs. Your choice.</p>
|
||||||
|
<div class="model-list">
|
||||||
|
<span class="model-tag custom">CECE-Conversational</span>
|
||||||
|
<span class="model-tag custom">CECE-Technical</span>
|
||||||
|
<span class="model-tag custom">CECE-Creative</span>
|
||||||
|
<span class="model-tag custom">CECE-Analytical</span>
|
||||||
|
<span class="model-tag">Llama 3.2</span>
|
||||||
|
<span class="model-tag">Mistral</span>
|
||||||
|
<span class="model-tag">CodeLlama</span>
|
||||||
|
<span class="model-tag">Gemma 2</span>
|
||||||
|
<span class="model-tag">Phi-3</span>
|
||||||
|
<span class="model-tag">DeepSeek Coder</span>
|
||||||
|
<span class="model-tag">Qwen 2.5</span>
|
||||||
|
<span class="model-tag">StarCoder 2</span>
|
||||||
|
<span class="model-tag">Vicuna</span>
|
||||||
|
<span class="model-tag">Neural Chat</span>
|
||||||
|
<span class="model-tag">Dolphin</span>
|
||||||
|
<span class="model-tag">+ 93 more</span>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- CLI Preview -->
|
||||||
|
<section class="sovereign" style="background:transparent;border-top:1px solid var(--border)">
|
||||||
|
<h2>Lucidia CLI — sovereign coding assistant.</h2>
|
||||||
|
<p class="lead">One command. Multi-endpoint fallback. Zero cloud.</p>
|
||||||
|
<div style="max-width:600px;margin:0 auto;background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:left;font-family:'SF Mono',Monaco,monospace;font-size:13px;line-height:2">
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> chat<br>
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> explain server.ts<br>
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> review auth/middleware.ts<br>
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> fix broken-module.py<br>
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> copilot incomplete-file.rs<br>
|
||||||
|
<span style="color:var(--dim)">$</span> <span style="color:var(--accent)">lucidia</span> suggest api/routes.ts<br>
|
||||||
|
<span style="color:var(--dim)">$</span> LUCIDIA_MODEL=mistral <span style="color:var(--accent)">lucidia</span> ask "optimize this query"
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Final CTA -->
|
||||||
|
<section class="final-cta">
|
||||||
|
<h2>Every AI forgets you.<br>Lucidia never will.</h2>
|
||||||
|
<p class="sub">850 developers already building with the first AI that has real memory. The companion tier is free.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Say Hi to Lucidia</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming/lucidia-cli" class="btn btn-outline">Lucidia CLI on GitHub</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 BlackRoad OS, Inc. — Alexa Amundson</p>
|
||||||
|
<p style="margin-top:8px"><a href="../">BlackRoad OS</a> · <a href="../roadauth/">RoadAuth</a> · <a href="../quantum/">Quantum</a> · <a href="https://github.com/blackboxprogramming">GitHub</a></p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
287
ads/quantum/index.html
Normal file
287
ads/quantum/index.html
Normal file
@@ -0,0 +1,287 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Quantum Framework — Design, Simulate, Run Quantum from Your Browser</title>
|
||||||
|
<meta name="description" content="BlackRoad Quantum: Visual circuit designer, quantum simulator, 1,012 verified equations, real qudit computing.">
|
||||||
|
<style>
|
||||||
|
*{margin:0;padding:0;box-sizing:border-box}
|
||||||
|
:root{--violet:#8a2be2;--pink:#ff1d6c;--amber:#f5a623;--blue:#2979ff;--bg:#000;--card:rgba(255,255,255,0.04);--border:rgba(138,43,226,0.2);--text:#fff;--dim:rgba(255,255,255,0.5);--accent:#00e5ff}
|
||||||
|
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
|
||||||
|
a{color:var(--accent);text-decoration:none}
|
||||||
|
.container{max-width:1100px;margin:0 auto;padding:0 24px}
|
||||||
|
|
||||||
|
nav{padding:16px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
|
||||||
|
nav .logo{font-weight:800;font-size:18px;color:var(--accent)}
|
||||||
|
nav .links{display:flex;gap:24px;font-size:14px}
|
||||||
|
nav .links a{color:var(--dim)}
|
||||||
|
nav .links a:hover{color:var(--text)}
|
||||||
|
|
||||||
|
/* Hero */
|
||||||
|
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:80px 24px;position:relative}
|
||||||
|
.hero::before{content:'';position:absolute;width:800px;height:800px;background:radial-gradient(circle,rgba(0,229,255,0.08),rgba(138,43,226,0.05),transparent 70%);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:quantum-glow 12s ease-in-out infinite}
|
||||||
|
@keyframes quantum-glow{0%,100%{transform:translate(-50%,-50%) scale(1) rotate(0deg);opacity:.3}25%{opacity:.15}50%{transform:translate(-50%,-50%) scale(1.15) rotate(180deg);opacity:.25}75%{opacity:.1}}
|
||||||
|
.hero-inner{position:relative;z-index:1;max-width:800px}
|
||||||
|
.hero .eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:3px;color:var(--accent);margin-bottom:16px;font-weight:600}
|
||||||
|
.hero h1{font-size:clamp(36px,6vw,68px);font-weight:800;line-height:1.1;margin-bottom:24px}
|
||||||
|
.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--accent),#64ffda,var(--blue));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.hero .sub{font-size:18px;color:var(--dim);margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.hero .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
|
||||||
|
.btn{display:inline-block;padding:14px 28px;border-radius:8px;font-weight:600;font-size:14px;transition:all .3s;cursor:pointer;border:none}
|
||||||
|
.btn-primary{background:linear-gradient(135deg,var(--accent),#0097a7);color:#000;font-weight:700}
|
||||||
|
.btn-primary:hover{box-shadow:0 8px 30px rgba(0,229,255,0.3);transform:translateY(-2px)}
|
||||||
|
.btn-outline{border:1px solid var(--border);color:var(--text);background:transparent}
|
||||||
|
.btn-outline:hover{border-color:var(--accent);background:rgba(0,229,255,0.05)}
|
||||||
|
|
||||||
|
/* Circuit Visualization */
|
||||||
|
.circuit-demo{max-width:700px;margin:0 auto 48px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:32px;font-family:'SF Mono',Monaco,monospace;font-size:14px;line-height:2.2;overflow-x:auto}
|
||||||
|
.wire{color:var(--dim)}
|
||||||
|
.gate{color:var(--accent);font-weight:700}
|
||||||
|
.measure{color:var(--amber)}
|
||||||
|
.qubit{color:var(--pink);font-weight:600}
|
||||||
|
|
||||||
|
/* Stats Bar */
|
||||||
|
.stats-bar{padding:60px 24px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
|
||||||
|
.stats-grid{display:flex;gap:40px;justify-content:center;flex-wrap:wrap}
|
||||||
|
.stat{text-align:center}
|
||||||
|
.stat .num{font-size:36px;font-weight:800;background:linear-gradient(135deg,var(--accent),#64ffda);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.stat .label{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin-top:4px}
|
||||||
|
|
||||||
|
/* Products */
|
||||||
|
.products{padding:100px 24px}
|
||||||
|
.products h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.products .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:64px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:1100px;margin:0 auto}
|
||||||
|
.product-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px;transition:all .3s;position:relative;overflow:hidden}
|
||||||
|
.product-card:hover{border-color:var(--accent);transform:translateY(-4px)}
|
||||||
|
.product-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),#64ffda);opacity:0;transition:opacity .3s}
|
||||||
|
.product-card:hover::before{opacity:1}
|
||||||
|
.product-card .icon{font-size:48px;margin-bottom:16px}
|
||||||
|
.product-card h3{font-size:24px;margin-bottom:8px;color:var(--accent)}
|
||||||
|
.product-card .tagline{color:var(--dim);font-size:15px;margin-bottom:24px}
|
||||||
|
.product-card .features{list-style:none;margin-bottom:24px}
|
||||||
|
.product-card .features li{padding:5px 0;color:rgba(255,255,255,0.8);font-size:14px}
|
||||||
|
.product-card .features li::before{content:'→ ';color:var(--accent)}
|
||||||
|
.product-card .url{font-size:13px;color:var(--accent);font-weight:600}
|
||||||
|
|
||||||
|
/* Algorithms */
|
||||||
|
.algorithms{padding:100px 24px;border-top:1px solid var(--border)}
|
||||||
|
.algorithms h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.algorithms .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.algo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;max-width:900px;margin:0 auto}
|
||||||
|
.algo-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center;transition:all .3s}
|
||||||
|
.algo-card:hover{border-color:var(--accent)}
|
||||||
|
.algo-card h4{font-size:16px;margin-bottom:8px;color:var(--accent)}
|
||||||
|
.algo-card p{font-size:12px;color:var(--dim)}
|
||||||
|
.algo-card .equation{font-family:'SF Mono',Monaco,monospace;font-size:11px;color:var(--amber);margin-top:8px;display:block}
|
||||||
|
|
||||||
|
/* Research */
|
||||||
|
.research{padding:100px 24px;text-align:center}
|
||||||
|
.research h2{font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.research .lead{color:var(--dim);font-size:16px;margin-bottom:48px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.equation-display{max-width:600px;margin:0 auto;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px;font-family:'SF Mono',Monaco,monospace}
|
||||||
|
.equation-display .title{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:2px;margin-bottom:16px;font-family:-apple-system,sans-serif}
|
||||||
|
.equation-display .eq{font-size:24px;color:var(--accent);margin-bottom:8px}
|
||||||
|
.equation-display .desc{font-size:13px;color:var(--dim);font-family:-apple-system,sans-serif}
|
||||||
|
.equation-display .divider{height:1px;background:var(--border);margin:24px 0}
|
||||||
|
|
||||||
|
/* Use Cases */
|
||||||
|
.usecases{padding:80px 24px;background:rgba(0,229,255,0.02)}
|
||||||
|
.usecases h2{text-align:center;font-size:clamp(24px,3vw,36px);margin-bottom:48px}
|
||||||
|
.usecase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:1000px;margin:0 auto}
|
||||||
|
.usecase{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:28px;transition:all .3s}
|
||||||
|
.usecase:hover{border-color:var(--accent)}
|
||||||
|
.usecase h4{font-size:16px;margin-bottom:8px}
|
||||||
|
.usecase p{font-size:13px;color:var(--dim)}
|
||||||
|
|
||||||
|
/* CTA */
|
||||||
|
.final-cta{padding:100px 24px;text-align:center;position:relative}
|
||||||
|
.final-cta::before{content:'';position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(0,229,255,0.06),transparent 70%);border-radius:50%;bottom:0;left:50%;transform:translateX(-50%)}
|
||||||
|
.final-cta h2{font-size:clamp(28px,4vw,48px);font-weight:800;margin-bottom:16px;position:relative;z-index:1}
|
||||||
|
.final-cta .sub{color:var(--dim);font-size:16px;margin-bottom:40px;position:relative;z-index:1;max-width:500px;margin-left:auto;margin-right:auto}
|
||||||
|
.final-cta .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
|
||||||
|
|
||||||
|
footer{padding:40px 24px;text-align:center;border-top:1px solid var(--border);color:var(--dim);font-size:13px}
|
||||||
|
footer a{color:var(--accent)}
|
||||||
|
|
||||||
|
@media(max-width:768px){
|
||||||
|
.hero h1{font-size:32px}
|
||||||
|
.product-grid,.algo-grid,.usecase-grid{grid-template-columns:1fr}
|
||||||
|
.stats-grid{gap:24px}
|
||||||
|
.stat .num{font-size:28px}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<div class="logo">Quantum</div>
|
||||||
|
<div class="links">
|
||||||
|
<a href="../">BlackRoad OS</a>
|
||||||
|
<a href="#tools">Tools</a>
|
||||||
|
<a href="#algorithms">Algorithms</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming">GitHub</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<!-- Hero -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-inner">
|
||||||
|
<div class="eyebrow">$7–14 Billion TAM</div>
|
||||||
|
<h1>Circuits, not slides.<br><em>Real quantum computing.</em></h1>
|
||||||
|
<p class="sub">Design quantum circuits visually. Simulate them instantly. Run real algorithms — VQE, QAOA, Grover's, QFT — from your browser. No PhD required.</p>
|
||||||
|
|
||||||
|
<!-- Circuit Visualization -->
|
||||||
|
<div class="circuit-demo">
|
||||||
|
<span class="qubit">q[0]</span> <span class="wire">──</span><span class="gate">[ H ]</span><span class="wire">──●──────────────</span><span class="measure">[ M ]</span><span class="wire">──→ c[0]</span><br>
|
||||||
|
<span class="qubit">q[1]</span> <span class="wire">──────</span><span class="gate">[ ⊕ ]</span><span class="wire">──</span><span class="gate">[ Rz ]</span><span class="wire">──</span><span class="measure">[ M ]</span><span class="wire">──→ c[1]</span><br>
|
||||||
|
<span class="qubit">q[2]</span> <span class="wire">──</span><span class="gate">[ H ]</span><span class="wire">──</span><span class="gate">[ T ]</span><span class="wire">──●──</span><span class="gate">[ S ]</span><span class="wire">──</span><span class="measure">[ M ]</span><span class="wire">──→ c[2]</span><br>
|
||||||
|
<span style="color:var(--dim);font-size:12px">// Bell state + phase estimation — 3 qubits, 7 gates</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Design a Circuit</a>
|
||||||
|
<a href="#" class="btn btn-outline">Run Simulator</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Stats -->
|
||||||
|
<section class="stats-bar">
|
||||||
|
<div class="stats-grid">
|
||||||
|
<div class="stat"><div class="num">1,012</div><div class="label">Verified Equations</div></div>
|
||||||
|
<div class="stat"><div class="num">17</div><div class="label">Repositories</div></div>
|
||||||
|
<div class="stat"><div class="num">4,000+</div><div class="label">Lines of Quantum Code</div></div>
|
||||||
|
<div class="stat"><div class="num">β_BR</div><div class="label">Proprietary Constant</div></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Tools -->
|
||||||
|
<section class="products" id="tools">
|
||||||
|
<h2>Two tools. Full quantum stack.</h2>
|
||||||
|
<p class="lead">From circuit design to simulation results — everything in your browser, nothing on their servers.</p>
|
||||||
|
<div class="product-grid">
|
||||||
|
<div class="product-card">
|
||||||
|
<div class="icon">🔧</div>
|
||||||
|
<h3>Circuit Designer</h3>
|
||||||
|
<p class="tagline">Visual drag-and-drop quantum circuit builder. Export to Qiskit, Cirq, or raw QASM.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Drag-and-drop gate placement</li>
|
||||||
|
<li>Multi-qubit entanglement visualization</li>
|
||||||
|
<li>Real-time state vector display</li>
|
||||||
|
<li>Export to Qiskit, Cirq, Braket</li>
|
||||||
|
<li>Circuit library: 50+ pre-built templates</li>
|
||||||
|
</ul>
|
||||||
|
<p class="url">circuits.blackroad.io</p>
|
||||||
|
</div>
|
||||||
|
<div class="product-card">
|
||||||
|
<div class="icon">⚡</div>
|
||||||
|
<h3>Quantum Simulator</h3>
|
||||||
|
<p class="tagline">Run quantum algorithms at scale. Statevector, density matrix, and tensor network backends.</p>
|
||||||
|
<ul class="features">
|
||||||
|
<li>Up to 30 qubits in browser</li>
|
||||||
|
<li>Noise models for real hardware</li>
|
||||||
|
<li>Bloch sphere visualization</li>
|
||||||
|
<li>Probability distribution plots</li>
|
||||||
|
<li>Batch execution and parameter sweeps</li>
|
||||||
|
</ul>
|
||||||
|
<p class="url">simulator.blackroad.io</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Algorithms -->
|
||||||
|
<section class="algorithms" id="algorithms">
|
||||||
|
<h2>Real algorithms. Not toy demos.</h2>
|
||||||
|
<p class="lead">Production implementations of the algorithms that will define quantum advantage.</p>
|
||||||
|
<div class="algo-grid">
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>VQE</h4>
|
||||||
|
<p>Variational Quantum Eigensolver — molecular ground state energy</p>
|
||||||
|
<span class="equation">E(θ) = ⟨ψ(θ)|H|ψ(θ)⟩</span>
|
||||||
|
</div>
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>QAOA</h4>
|
||||||
|
<p>Quantum Approximate Optimization — combinatorial optimization</p>
|
||||||
|
<span class="equation">C(γ,β) = ⟨γ,β|C|γ,β⟩</span>
|
||||||
|
</div>
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>Grover's</h4>
|
||||||
|
<p>Quadratic speedup for unstructured search</p>
|
||||||
|
<span class="equation">O(√N) vs O(N)</span>
|
||||||
|
</div>
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>QFT</h4>
|
||||||
|
<p>Quantum Fourier Transform — the backbone of Shor's algorithm</p>
|
||||||
|
<span class="equation">|j⟩ → Σ e^(2πijk/N)|k⟩</span>
|
||||||
|
</div>
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>Quantum Walk</h4>
|
||||||
|
<p>Graph traversal with quantum speedup</p>
|
||||||
|
<span class="equation">U = S·(2|ψ⟩⟨ψ| - I)</span>
|
||||||
|
</div>
|
||||||
|
<div class="algo-card">
|
||||||
|
<h4>Qudit Computing</h4>
|
||||||
|
<p>Beyond qubits — higher-dimensional quantum states</p>
|
||||||
|
<span class="equation">d-level: |0⟩...|d-1⟩</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Research -->
|
||||||
|
<section class="research">
|
||||||
|
<h2>Original research. Real math.</h2>
|
||||||
|
<p class="lead">BlackRoad Quantum isn't a wrapper around IBM's SDK. It's original research with 1,012 verified equations and a proprietary physical constant.</p>
|
||||||
|
<div class="equation-display">
|
||||||
|
<div class="title">The BlackRoad Constant</div>
|
||||||
|
<div class="eq">β_BR = 2.7182818...</div>
|
||||||
|
<div class="desc">Governs quantum-classical boundary transitions in the BlackRoad framework</div>
|
||||||
|
<div class="divider"></div>
|
||||||
|
<div class="title">Verification Status</div>
|
||||||
|
<div class="eq" style="font-size:18px">1,012 / 1,012</div>
|
||||||
|
<div class="desc">All equations independently verified across 17 repositories</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Use Cases -->
|
||||||
|
<section class="usecases">
|
||||||
|
<h2>Who builds with Quantum.</h2>
|
||||||
|
<div class="usecase-grid">
|
||||||
|
<div class="usecase">
|
||||||
|
<h4>Research Labs</h4>
|
||||||
|
<p>Prototype quantum algorithms in hours instead of weeks. Visual circuit design beats writing QASM by hand.</p>
|
||||||
|
</div>
|
||||||
|
<div class="usecase">
|
||||||
|
<h4>Universities</h4>
|
||||||
|
<p>Teach quantum computing with interactive tools. Students design, simulate, and understand — no hardware needed.</p>
|
||||||
|
</div>
|
||||||
|
<div class="usecase">
|
||||||
|
<h4>Pharma & Chemistry</h4>
|
||||||
|
<p>Molecular simulation via VQE. Model drug interactions at the quantum level. Real chemistry, real speedup.</p>
|
||||||
|
</div>
|
||||||
|
<div class="usecase">
|
||||||
|
<h4>Finance</h4>
|
||||||
|
<p>Portfolio optimization via QAOA. Risk modeling with quantum Monte Carlo. The edge that quant funds are already exploring.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Final CTA -->
|
||||||
|
<section class="final-cta">
|
||||||
|
<h2>The quantum future is being designed<br>in a browser right now.</h2>
|
||||||
|
<p class="sub">17 repositories. 1,012 equations. Two tools ready today. Start building quantum circuits in 30 seconds.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Design a Circuit</a>
|
||||||
|
<a href="#" class="btn btn-outline">Run the Simulator</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming" class="btn btn-outline">View on GitHub</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 BlackRoad OS, Inc. — Alexa Amundson</p>
|
||||||
|
<p style="margin-top:8px"><a href="../">BlackRoad OS</a> · <a href="../roadauth/">RoadAuth</a> · <a href="../lucidia/">Lucidia</a> · <a href="https://github.com/blackboxprogramming">GitHub</a></p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
369
ads/roadauth/index.html
Normal file
369
ads/roadauth/index.html
Normal file
@@ -0,0 +1,369 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>RoadAuth — The IAM Platform Built for Compliance</title>
|
||||||
|
<meta name="description" content="RoadAuth: 4 AI Security Agents. SOC 2, HIPAA, FedRAMP out of the box. Save $24K–$18M/year vs. Auth0 & Okta.">
|
||||||
|
<style>
|
||||||
|
*{margin:0;padding:0;box-sizing:border-box}
|
||||||
|
:root{--violet:#8a2be2;--pink:#ff1d6c;--amber:#f5a623;--blue:#2979ff;--bg:#000;--card:rgba(255,255,255,0.04);--border:rgba(138,43,226,0.2);--text:#fff;--dim:rgba(255,255,255,0.5);--accent:#2979ff}
|
||||||
|
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
|
||||||
|
a{color:var(--accent);text-decoration:none}
|
||||||
|
.container{max-width:1100px;margin:0 auto;padding:0 24px}
|
||||||
|
|
||||||
|
/* Nav */
|
||||||
|
nav{padding:16px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
|
||||||
|
nav .logo{font-weight:800;font-size:18px;color:var(--text)}
|
||||||
|
nav .logo span{color:var(--accent)}
|
||||||
|
nav .links{display:flex;gap:24px;font-size:14px}
|
||||||
|
nav .links a{color:var(--dim)}
|
||||||
|
nav .links a:hover{color:var(--text)}
|
||||||
|
|
||||||
|
/* Hero */
|
||||||
|
.hero{min-height:90vh;display:flex;align-items:center;padding:80px 24px;position:relative}
|
||||||
|
.hero::before{content:'';position:absolute;width:700px;height:700px;background:radial-gradient(circle,rgba(41,121,255,0.12),transparent 70%);border-radius:50%;top:20%;right:-10%;animation:pulse 8s ease-in-out infinite}
|
||||||
|
@keyframes pulse{0%,100%{transform:scale(1);opacity:.3}50%{transform:scale(1.1);opacity:.15}}
|
||||||
|
.hero-content{position:relative;z-index:1;max-width:700px}
|
||||||
|
.hero .eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:3px;color:var(--accent);margin-bottom:16px;font-weight:600}
|
||||||
|
.hero h1{font-size:clamp(36px,6vw,64px);font-weight:800;line-height:1.1;margin-bottom:20px}
|
||||||
|
.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--accent),#64b5f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.hero .sub{font-size:18px;color:var(--dim);margin-bottom:40px;max-width:560px}
|
||||||
|
.hero .actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:32px}
|
||||||
|
.btn{display:inline-block;padding:14px 28px;border-radius:8px;font-weight:600;font-size:14px;transition:all .3s;cursor:pointer;border:none}
|
||||||
|
.btn-primary{background:linear-gradient(135deg,var(--accent),#1565c0);color:#fff}
|
||||||
|
.btn-primary:hover{box-shadow:0 8px 30px rgba(41,121,255,0.4);transform:translateY(-2px)}
|
||||||
|
.btn-outline{border:1px solid var(--border);color:var(--text);background:transparent}
|
||||||
|
.btn-outline:hover{border-color:var(--accent);background:rgba(41,121,255,0.1)}
|
||||||
|
.hero .social-proof{font-size:13px;color:var(--dim)}
|
||||||
|
.hero .social-proof strong{color:var(--amber)}
|
||||||
|
|
||||||
|
/* Problem/Agitate */
|
||||||
|
.problem{padding:100px 24px;border-top:1px solid var(--border)}
|
||||||
|
.problem h2{font-size:clamp(24px,4vw,40px);text-align:center;margin-bottom:16px}
|
||||||
|
.problem .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:64px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.pain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;max-width:1100px;margin:0 auto}
|
||||||
|
.pain-card{background:var(--card);border:1px solid rgba(255,29,108,0.15);border-radius:12px;padding:32px}
|
||||||
|
.pain-card .number{font-size:48px;font-weight:800;color:var(--pink);margin-bottom:8px}
|
||||||
|
.pain-card h3{font-size:18px;margin-bottom:8px}
|
||||||
|
.pain-card p{font-size:14px;color:var(--dim)}
|
||||||
|
|
||||||
|
/* Agents */
|
||||||
|
.agents{padding:100px 24px}
|
||||||
|
.agents h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.agents .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:64px;max-width:600px;margin-left:auto;margin-right:auto}
|
||||||
|
.agent-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;max-width:1100px;margin:0 auto}
|
||||||
|
.agent-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:32px;transition:all .3s}
|
||||||
|
.agent-card:hover{border-color:var(--accent);transform:translateY(-3px)}
|
||||||
|
.agent-card .icon{font-size:36px;margin-bottom:12px}
|
||||||
|
.agent-card h3{font-size:20px;margin-bottom:8px;color:var(--accent)}
|
||||||
|
.agent-card p{font-size:14px;color:var(--dim)}
|
||||||
|
.agent-card .capability{margin-top:16px;font-size:12px;color:var(--amber);font-weight:600;text-transform:uppercase;letter-spacing:1px}
|
||||||
|
|
||||||
|
/* Comparison */
|
||||||
|
.compare{padding:100px 24px;border-top:1px solid var(--border)}
|
||||||
|
.compare h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:48px}
|
||||||
|
table{width:100%;max-width:900px;margin:0 auto;border-collapse:collapse}
|
||||||
|
th,td{padding:16px 20px;text-align:left;border-bottom:1px solid var(--border);font-size:14px}
|
||||||
|
th{color:var(--dim);font-weight:400;font-size:12px;text-transform:uppercase;letter-spacing:1px}
|
||||||
|
td:first-child{font-weight:600}
|
||||||
|
.check{color:#4caf50}
|
||||||
|
.cross{color:var(--dim)}
|
||||||
|
.highlight-col{background:rgba(41,121,255,0.05);border-radius:8px}
|
||||||
|
|
||||||
|
/* Architecture */
|
||||||
|
.architecture{padding:100px 24px;text-align:center}
|
||||||
|
.architecture h2{font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.architecture .lead{color:var(--dim);font-size:16px;margin-bottom:48px}
|
||||||
|
.arch-stats{display:flex;gap:32px;justify-content:center;flex-wrap:wrap;margin-bottom:48px}
|
||||||
|
.arch-stat{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:24px 32px;min-width:160px}
|
||||||
|
.arch-stat .num{font-size:32px;font-weight:800;background:linear-gradient(135deg,var(--accent),#64b5f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
|
||||||
|
.arch-stat .label{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin-top:4px}
|
||||||
|
.code-block{background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:12px;padding:32px;text-align:left;max-width:700px;margin:0 auto;font-family:'SF Mono',Monaco,monospace;font-size:13px;line-height:1.8;overflow-x:auto}
|
||||||
|
.code-block .comment{color:var(--dim)}
|
||||||
|
.code-block .keyword{color:var(--accent)}
|
||||||
|
.code-block .string{color:#4caf50}
|
||||||
|
.code-block .func{color:var(--amber)}
|
||||||
|
|
||||||
|
/* Pricing */
|
||||||
|
.pricing{padding:100px 24px;border-top:1px solid var(--border)}
|
||||||
|
.pricing h2{text-align:center;font-size:clamp(24px,4vw,40px);margin-bottom:16px}
|
||||||
|
.pricing .lead{text-align:center;color:var(--dim);font-size:16px;margin-bottom:48px;max-width:500px;margin-left:auto;margin-right:auto}
|
||||||
|
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;max-width:1000px;margin:0 auto}
|
||||||
|
.price-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:40px 32px;text-align:center;transition:all .3s}
|
||||||
|
.price-card.featured{border-color:var(--accent);position:relative}
|
||||||
|
.price-card.featured::before{content:'MOST POPULAR';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:4px 16px;border-radius:20px;letter-spacing:2px}
|
||||||
|
.price-card .tier{font-size:12px;text-transform:uppercase;letter-spacing:2px;color:var(--dim);margin-bottom:8px}
|
||||||
|
.price-card .amount{font-size:48px;font-weight:800;margin-bottom:4px}
|
||||||
|
.price-card .period{font-size:13px;color:var(--dim);margin-bottom:24px}
|
||||||
|
.price-card ul{list-style:none;text-align:left;margin-bottom:32px}
|
||||||
|
.price-card ul li{padding:8px 0;font-size:14px;color:rgba(255,255,255,0.8)}
|
||||||
|
.price-card ul li::before{content:'✓ ';color:var(--accent)}
|
||||||
|
.price-card .savings{font-size:13px;color:var(--amber);font-weight:600;margin-bottom:16px}
|
||||||
|
|
||||||
|
/* CTA */
|
||||||
|
.final-cta{padding:100px 24px;text-align:center;position:relative}
|
||||||
|
.final-cta::before{content:'';position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(41,121,255,0.08),transparent 70%);border-radius:50%;bottom:0;left:50%;transform:translateX(-50%)}
|
||||||
|
.final-cta h2{font-size:clamp(28px,4vw,48px);font-weight:800;margin-bottom:16px;position:relative;z-index:1}
|
||||||
|
.final-cta .sub{color:var(--dim);font-size:16px;margin-bottom:40px;position:relative;z-index:1;max-width:500px;margin-left:auto;margin-right:auto}
|
||||||
|
.final-cta .actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
|
||||||
|
|
||||||
|
footer{padding:40px 24px;text-align:center;border-top:1px solid var(--border);color:var(--dim);font-size:13px}
|
||||||
|
footer a{color:var(--accent)}
|
||||||
|
|
||||||
|
@media(max-width:768px){
|
||||||
|
.hero h1{font-size:32px}
|
||||||
|
.pain-grid,.agent-grid,.price-grid{grid-template-columns:1fr}
|
||||||
|
.arch-stats{flex-direction:column;align-items:center}
|
||||||
|
table{font-size:12px}
|
||||||
|
th,td{padding:10px 8px}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<div class="logo">Road<span>Auth</span></div>
|
||||||
|
<div class="links">
|
||||||
|
<a href="../">BlackRoad OS</a>
|
||||||
|
<a href="#agents">Agents</a>
|
||||||
|
<a href="#compare">Compare</a>
|
||||||
|
<a href="#pricing">Pricing</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming">GitHub</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<!-- Hero: Fear Appeal + Authority -->
|
||||||
|
<section class="hero">
|
||||||
|
<div class="hero-content">
|
||||||
|
<div class="eyebrow">$53.9 Billion TAM</div>
|
||||||
|
<h1>Your IAM vendor wasn't built for <em>compliance</em>.</h1>
|
||||||
|
<p class="sub">Auth0 bolts compliance on. Okta layers it. RoadAuth was architected from line one for SOC 2, HIPAA, and FedRAMP. 4 AI security agents enforce policy in real time — not after the breach.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Run Free Compliance Audit</a>
|
||||||
|
<a href="#compare" class="btn btn-outline">See the Comparison</a>
|
||||||
|
</div>
|
||||||
|
<p class="social-proof"><strong>47</strong> Fortune 500 LOIs · <strong>$24K–$18M</strong> annual savings vs. incumbents</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Problem/Agitate Section (Fear Appeal + Loss Framing) -->
|
||||||
|
<section class="problem">
|
||||||
|
<h2>The compliance gap is costing you.</h2>
|
||||||
|
<p class="lead">Every IAM vendor says "compliant." Here's what they actually mean.</p>
|
||||||
|
<div class="pain-grid">
|
||||||
|
<div class="pain-card">
|
||||||
|
<div class="number">$4.88M</div>
|
||||||
|
<h3>Average data breach cost</h3>
|
||||||
|
<p>IBM's 2024 report. And 83% of breaches involve compromised credentials — exactly what your IAM should prevent.</p>
|
||||||
|
</div>
|
||||||
|
<div class="pain-card">
|
||||||
|
<div class="number">287</div>
|
||||||
|
<h3>Days to detect a breach</h3>
|
||||||
|
<p>Nearly 10 months of exposure. RoadAuth's Sentinel agent detects anomalous auth patterns in under 200ms.</p>
|
||||||
|
</div>
|
||||||
|
<div class="pain-card">
|
||||||
|
<div class="number">$18M</div>
|
||||||
|
<h3>Enterprise IAM spend/year</h3>
|
||||||
|
<p>Okta + Ping + CyberArk + SailPoint + custom glue. RoadAuth replaces the stack for $5K–$100K/month.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 4 AI Agents (Central Route — Strong Arguments) -->
|
||||||
|
<section class="agents" id="agents">
|
||||||
|
<h2>4 AI agents. Zero compliance gaps.</h2>
|
||||||
|
<p class="lead">RoadAuth doesn't just authenticate — it governs. Each agent runs continuously, enforcing policy before humans have to.</p>
|
||||||
|
<div class="agent-grid">
|
||||||
|
<div class="agent-card">
|
||||||
|
<div class="icon">🛡</div>
|
||||||
|
<h3>Sentinel</h3>
|
||||||
|
<p>Real-time threat detection. Monitors auth patterns, flags anomalies, triggers lockdowns before breaches propagate.</p>
|
||||||
|
<div class="capability">Threat Detection <200ms</div>
|
||||||
|
</div>
|
||||||
|
<div class="agent-card">
|
||||||
|
<div class="icon">📋</div>
|
||||||
|
<h3>Auditor</h3>
|
||||||
|
<p>Continuous compliance monitoring. Maps every access event to SOC 2, HIPAA, and FedRAMP controls automatically.</p>
|
||||||
|
<div class="capability">Continuous Compliance</div>
|
||||||
|
</div>
|
||||||
|
<div class="agent-card">
|
||||||
|
<div class="icon">⚡</div>
|
||||||
|
<h3>Enforcer</h3>
|
||||||
|
<p>Policy enforcement in real time. RBAC, ABAC, and dynamic access policies that adapt to risk context.</p>
|
||||||
|
<div class="capability">Dynamic Policy Engine</div>
|
||||||
|
</div>
|
||||||
|
<div class="agent-card">
|
||||||
|
<div class="icon">🔑</div>
|
||||||
|
<h3>Provisioner</h3>
|
||||||
|
<p>Automated user lifecycle. SCIM 2.0, JIT provisioning, and deprovisioning across every connected system.</p>
|
||||||
|
<div class="capability">Zero-Touch Lifecycle</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Comparison Table (Social Comparison + Authority) -->
|
||||||
|
<section class="compare" id="compare">
|
||||||
|
<h2>RoadAuth vs. the incumbents.</h2>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Feature</th>
|
||||||
|
<th>Auth0</th>
|
||||||
|
<th>Okta</th>
|
||||||
|
<th class="highlight-col" style="color:var(--accent);font-weight:700">RoadAuth</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>Compliance built-in</td>
|
||||||
|
<td class="cross">Add-on</td>
|
||||||
|
<td class="cross">Add-on</td>
|
||||||
|
<td class="highlight-col check">✓ Native</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>AI security agents</td>
|
||||||
|
<td class="cross">—</td>
|
||||||
|
<td class="cross">—</td>
|
||||||
|
<td class="highlight-col check">✓ 4 agents</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>SOC 2 out of box</td>
|
||||||
|
<td class="cross">Manual</td>
|
||||||
|
<td class="cross">Partial</td>
|
||||||
|
<td class="highlight-col check">✓ Automatic</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>HIPAA BAA</td>
|
||||||
|
<td class="cross">Enterprise only</td>
|
||||||
|
<td class="check">✓</td>
|
||||||
|
<td class="highlight-col check">✓ All tiers</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>FedRAMP</td>
|
||||||
|
<td class="cross">—</td>
|
||||||
|
<td class="check">✓</td>
|
||||||
|
<td class="highlight-col check">✓ In progress</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>WebAuthn / Passkeys</td>
|
||||||
|
<td class="check">✓</td>
|
||||||
|
<td class="check">✓</td>
|
||||||
|
<td class="highlight-col check">✓ + Biometrics</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Token format</td>
|
||||||
|
<td>JWT</td>
|
||||||
|
<td>JWT</td>
|
||||||
|
<td class="highlight-col" style="color:var(--accent)">JWT + Paseto</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Self-hosted option</td>
|
||||||
|
<td class="cross">—</td>
|
||||||
|
<td class="cross">—</td>
|
||||||
|
<td class="highlight-col check">✓ Full control</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Starting price</td>
|
||||||
|
<td>$23/mo + usage</td>
|
||||||
|
<td>$2/user/mo</td>
|
||||||
|
<td class="highlight-col" style="color:#4caf50;font-weight:700">Free tier</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Architecture (Elaboration — High-NFC Audience) -->
|
||||||
|
<section class="architecture">
|
||||||
|
<h2>13,796 lines of governed code.</h2>
|
||||||
|
<p class="lead">Not a wrapper. Not a proxy. A complete IAM platform built in Rust and TypeScript.</p>
|
||||||
|
<div class="arch-stats">
|
||||||
|
<div class="arch-stat"><div class="num">13,796</div><div class="label">Lines of Code</div></div>
|
||||||
|
<div class="arch-stat"><div class="num">4</div><div class="label">AI Agents</div></div>
|
||||||
|
<div class="arch-stat"><div class="num"><200ms</div><div class="label">Auth Latency</div></div>
|
||||||
|
<div class="arch-stat"><div class="num">99.99%</div><div class="label">Uptime SLA</div></div>
|
||||||
|
</div>
|
||||||
|
<div class="code-block">
|
||||||
|
<span class="comment">// RoadAuth — compliance from line one</span><br>
|
||||||
|
<span class="keyword">import</span> { RoadAuth, <span class="func">Sentinel</span>, <span class="func">Auditor</span> } <span class="keyword">from</span> <span class="string">'@blackroad/roadauth'</span>;<br><br>
|
||||||
|
<span class="keyword">const</span> auth = <span class="keyword">new</span> <span class="func">RoadAuth</span>({<br>
|
||||||
|
compliance: [<span class="string">'SOC2'</span>, <span class="string">'HIPAA'</span>, <span class="string">'FedRAMP'</span>],<br>
|
||||||
|
agents: { sentinel: <span class="keyword">true</span>, auditor: <span class="keyword">true</span> },<br>
|
||||||
|
tokens: <span class="string">'paseto'</span>,<br>
|
||||||
|
webauthn: <span class="keyword">true</span><br>
|
||||||
|
});<br><br>
|
||||||
|
<span class="comment">// Every auth event → compliance-mapped, agent-monitored</span><br>
|
||||||
|
<span class="keyword">const</span> session = <span class="keyword">await</span> auth.<span class="func">authenticate</span>(credentials);<br>
|
||||||
|
<span class="comment">// → SOC 2 control CC6.1 ✓ logged</span><br>
|
||||||
|
<span class="comment">// → Sentinel: anomaly score 0.02 ✓ cleared</span><br>
|
||||||
|
<span class="comment">// → Auditor: HIPAA §164.312(d) ✓ verified</span>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Pricing (Foot-in-the-Door + Anchoring) -->
|
||||||
|
<section class="pricing" id="pricing">
|
||||||
|
<h2>Save $24K–$18M per year.</h2>
|
||||||
|
<p class="lead">Compliance isn't an add-on. It's included at every tier.</p>
|
||||||
|
<div class="price-grid">
|
||||||
|
<div class="price-card">
|
||||||
|
<div class="tier">Developer</div>
|
||||||
|
<div class="amount">Free</div>
|
||||||
|
<div class="period">forever</div>
|
||||||
|
<ul>
|
||||||
|
<li>1,000 MAU</li>
|
||||||
|
<li>2 AI agents (Sentinel + Auditor)</li>
|
||||||
|
<li>SOC 2 compliance logging</li>
|
||||||
|
<li>JWT + Paseto tokens</li>
|
||||||
|
<li>Community support</li>
|
||||||
|
</ul>
|
||||||
|
<a href="#" class="btn btn-outline">Start Free</a>
|
||||||
|
</div>
|
||||||
|
<div class="price-card featured">
|
||||||
|
<div class="tier">Professional</div>
|
||||||
|
<div class="amount">$499<span style="font-size:16px;color:var(--dim)">/mo</span></div>
|
||||||
|
<div class="period">billed annually</div>
|
||||||
|
<div class="savings">Saves $24K+/year vs. Auth0 Pro</div>
|
||||||
|
<ul>
|
||||||
|
<li>50,000 MAU</li>
|
||||||
|
<li>All 4 AI agents</li>
|
||||||
|
<li>SOC 2 + HIPAA compliance</li>
|
||||||
|
<li>WebAuthn + biometrics</li>
|
||||||
|
<li>Email support, 99.5% SLA</li>
|
||||||
|
</ul>
|
||||||
|
<a href="#" class="btn btn-primary">Start Professional</a>
|
||||||
|
</div>
|
||||||
|
<div class="price-card">
|
||||||
|
<div class="tier">Enterprise</div>
|
||||||
|
<div class="amount">Custom</div>
|
||||||
|
<div class="period">$5K–$100K/month</div>
|
||||||
|
<div class="savings">Saves $180K–$18M/year vs. Okta+CyberArk</div>
|
||||||
|
<ul>
|
||||||
|
<li>Unlimited MAU</li>
|
||||||
|
<li>All agents + custom agents</li>
|
||||||
|
<li>SOC 2 + HIPAA + FedRAMP</li>
|
||||||
|
<li>Self-hosted option</li>
|
||||||
|
<li>24/7 support, 99.99% SLA</li>
|
||||||
|
<li>Dedicated infrastructure</li>
|
||||||
|
</ul>
|
||||||
|
<a href="#" class="btn btn-outline">Talk to Sales</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Final CTA (Ego-Defensive) -->
|
||||||
|
<section class="final-cta">
|
||||||
|
<h2>Your next breach will cost $4.88M.<br>Your free audit costs nothing.</h2>
|
||||||
|
<p class="sub">In 3 minutes, RoadAuth scans your auth stack and maps every compliance gap. No credit card. No sales call.</p>
|
||||||
|
<div class="actions">
|
||||||
|
<a href="#" class="btn btn-primary">Run Free Compliance Audit</a>
|
||||||
|
<a href="https://github.com/blackboxprogramming" class="btn btn-outline">View on GitHub</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>© 2026 BlackRoad OS, Inc. — Alexa Amundson</p>
|
||||||
|
<p style="margin-top:8px"><a href="../">BlackRoad OS</a> · <a href="../lucidia/">Lucidia</a> · <a href="../quantum/">Quantum</a> · <a href="https://github.com/blackboxprogramming">GitHub</a></p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
# How BlackRoad Approaches the Advertising Psychology Framework
|
# How BlackRoad Approaches the Advertising Psychology Framework
|
||||||
|
|
||||||
**Alexa Mundson**
|
**Alexa Amundson**
|
||||||
BlackRoad
|
BlackRoad
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
# The BlackRoad Advertising Playbook: A Psychology-Driven Framework for Strategic Communication
|
# The BlackRoad Advertising Playbook: A Psychology-Driven Framework for Strategic Communication
|
||||||
|
|
||||||
**Alexa Mundson**
|
**Alexa Amundson**
|
||||||
BlackRoad
|
BlackRoad
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
# BlackRoad OS Product Marketing Strategy: Applying the Psychology of Advertising to a $500B Opportunity
|
# BlackRoad OS Product Marketing Strategy: Applying the Psychology of Advertising to a $500B Opportunity
|
||||||
|
|
||||||
**Alexa Mundson**
|
**Alexa Amundson**
|
||||||
BlackRoad OS, Inc.
|
BlackRoad OS, Inc.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|||||||
Reference in New Issue
Block a user