Files
aza/AzA march 2026 - Kopie (9)/web/index.html

220 lines
11 KiB
HTML
Raw Normal View History

2026-04-16 13:32:32 +02:00
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AZA Medizinischer KI-Arbeitsplatz</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
background: #F7F8FA; color: #1a1a2e; line-height: 1.6; }
/* ── Header ────────────────────────────────────────────── */
.header { background: #fff; border-bottom: 1px solid #E5E7EB; padding: 20px 0; }
.header-inner { max-width: 960px; margin: 0 auto; padding: 0 24px;
display: flex; align-items: center; justify-content: space-between; }
.logo { font-size: 22px; font-weight: 700; color: #0078D7; letter-spacing: -0.5px; }
.logo span { color: #1a1a2e; font-weight: 400; }
.header-links a { color: #555; text-decoration: none; font-size: 14px; margin-left: 24px; }
.header-links a:hover { color: #0078D7; }
/* ── Hero ──────────────────────────────────────────────── */
.hero { max-width: 960px; margin: 0 auto; padding: 72px 24px 56px; text-align: center; }
.hero h1 { font-size: 36px; font-weight: 700; margin-bottom: 16px; line-height: 1.2; }
.hero p { font-size: 18px; color: #555; max-width: 600px; margin: 0 auto 32px; }
.hero .cta { display: inline-block; padding: 14px 36px; background: #0078D7; color: #fff;
text-decoration: none; border-radius: 8px; font-size: 16px; font-weight: 600;
transition: background .2s; }
.hero .cta:hover { background: #005fa3; }
/* ── Features ──────────────────────────────────────────── */
.features { max-width: 960px; margin: 0 auto; padding: 0 24px 56px; }
.features h2 { text-align: center; font-size: 24px; margin-bottom: 32px; }
.feat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.feat-card { background: #fff; border-radius: 10px; padding: 28px 24px;
box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.feat-card h3 { font-size: 16px; margin-bottom: 8px; color: #0078D7; }
.feat-card p { font-size: 14px; color: #555; }
/* ── Pricing ───────────────────────────────────────────── */
.pricing { background: #fff; padding: 56px 24px; }
.pricing-inner { max-width: 960px; margin: 0 auto; }
.pricing h2 { text-align: center; font-size: 24px; margin-bottom: 8px; }
.pricing .sub { text-align: center; font-size: 15px; color: #555; margin-bottom: 36px; }
.price-cards { display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; }
.price-card { flex: 0 1 320px; border: 1px solid #E5E7EB; border-radius: 12px;
padding: 36px 28px; text-align: center; position: relative; }
.price-card.featured { border-color: #0078D7; box-shadow: 0 4px 16px rgba(0,120,215,.12); }
.price-card .badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
background: #0078D7; color: #fff; font-size: 12px; font-weight: 600;
padding: 4px 16px; border-radius: 20px; }
.price-card h3 { font-size: 20px; margin-bottom: 4px; }
.price-card .price { font-size: 36px; font-weight: 700; color: #0078D7; margin: 12px 0 4px; }
.price-card .price span { font-size: 16px; font-weight: 400; color: #888; }
.price-card .includes { list-style: none; text-align: left; margin: 20px 0 24px; }
.price-card .includes li { font-size: 14px; padding: 6px 0; color: #444;
padding-left: 22px; position: relative; }
.price-card .includes li::before { content: "✓"; position: absolute; left: 0;
color: #00B894; font-weight: 700; }
.price-card .buy-btn { display: inline-block; width: 100%; padding: 12px; background: #0078D7;
color: #fff; border: none; border-radius: 8px; font-size: 15px;
font-weight: 600; cursor: pointer; transition: background .2s;
text-decoration: none; }
.price-card .buy-btn:hover { background: #005fa3; }
.price-card .buy-btn.outline { background: transparent; border: 2px solid #0078D7;
color: #0078D7; }
.price-card .buy-btn.outline:hover { background: #E8F4FD; }
/* ── Requirements ──────────────────────────────────────── */
.reqs { max-width: 960px; margin: 0 auto; padding: 48px 24px; }
.reqs h2 { font-size: 20px; margin-bottom: 16px; }
.reqs ul { list-style: disc; padding-left: 20px; font-size: 14px; color: #555; }
.reqs li { margin-bottom: 6px; }
/* ── Footer ────────────────────────────────────────────── */
.footer { max-width: 960px; margin: 0 auto; padding: 32px 24px;
border-top: 1px solid #E5E7EB; font-size: 13px; color: #999;
display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.footer a { color: #0078D7; text-decoration: none; }
</style>
</head>
<body>
<!-- Header -->
<div class="header">
<div class="header-inner">
<div class="logo">AZA <span>Medical AI Assistant</span></div>
<div class="header-links">
<a href="#features">Funktionen</a>
<a href="#pricing">Preise</a>
<a href="download.html">Download</a>
</div>
</div>
</div>
<!-- Hero -->
<div class="hero">
<h1>KI-Assistenz für Ihren Praxisalltag</h1>
<p>Diktat, Krankengeschichte, Fachübersetzung und kollegialer Austausch
alles in einer Desktop-Anwendung für Windows.</p>
<a class="cta" href="#pricing">Jetzt starten</a>
</div>
<!-- Features -->
<div class="features" id="features">
<h2>Was AZA für Sie tut</h2>
<div class="feat-grid">
<div class="feat-card">
<h3>KI-Assistent</h3>
<p>Medizinische Fragen stellen, Befunde besprechen und eine KI-gestützte Zweitmeinung einholen.</p>
</div>
<div class="feat-card">
<h3>Krankengeschichte</h3>
<p>Diktat aufnehmen, automatisch transkribieren und strukturierte Krankengeschichten erstellen.</p>
</div>
<div class="feat-card">
<h3>Audio-Notizen</h3>
<p>Sprachaufnahmen für schnelle Gedanken, Befunde und Notizen im Praxisalltag.</p>
</div>
<div class="feat-card">
<h3>Übersetzer</h3>
<p>Medizinische Fachtexte übersetzen und Terminologie nachschlagen in über 20 Sprachen.</p>
</div>
<div class="feat-card">
<h3>Ärzte-Netzwerk</h3>
<p>Kollegialer Austausch mit anderen Ärztinnen und Ärzten über die MedWork-Plattform.</p>
</div>
<div class="feat-card">
<h3>Praxis-Kommunikation</h3>
<p>Interne Nachrichten und Aufgabenverteilung innerhalb Ihres Praxisteams.</p>
</div>
</div>
</div>
<!-- Pricing -->
<div class="pricing" id="pricing">
<div class="pricing-inner">
<h2>Transparent und fair</h2>
<p class="sub">Monatliches Abonnement, jederzeit kündbar. Keine versteckten Kosten.</p>
<div class="price-cards">
<div class="price-card featured">
<div class="badge">Empfohlen</div>
<h3>AZA Praxis</h3>
<div class="price">CHF 89<span> / Monat</span></div>
<ul class="includes">
<li>Alle 6 Module enthalten</li>
<li>Unbegrenztes Diktat und KI-Anfragen</li>
<li>Bis zu 2 Geräte pro Lizenz</li>
<li>Automatische Updates</li>
<li>E-Mail-Support</li>
</ul>
<button class="buy-btn" onclick="startCheckout('aza_basic_monthly')">
Abonnement starten
</button>
</div>
<div class="price-card">
<h3>AZA Team</h3>
<div class="price">CHF 199<span> / Monat</span></div>
<ul class="includes">
<li>Alle Funktionen von AZA Praxis</li>
<li>Bis zu 3 Benutzer</li>
<li>Je 2 Geräte pro Benutzer</li>
<li>Praxis-interner Chat</li>
<li>Prioritäts-Support</li>
</ul>
<button class="buy-btn outline" onclick="startCheckout('aza_team_monthly')">
Team-Abo starten
</button>
</div>
</div>
</div>
</div>
<!-- System Requirements -->
<div class="reqs">
<h2>Systemanforderungen</h2>
<ul>
<li>Windows 10 oder neuer (64-Bit)</li>
<li>Internetverbindung</li>
<li>Mikrofon für Diktat- und Audiofunktionen</li>
<li>OpenAI-API-Schlüssel (Einrichtung wird beim ersten Start geführt)</li>
</ul>
</div>
<!-- Footer -->
<div class="footer">
<div>&copy; 2026 AZA Medical AI Assistant <a href="https://aza-medwork.ch">aza-medwork.ch</a></div>
<div>
<a href="mailto:support@aza-medwork.ch">Support</a>
</div>
</div>
<script>
async function startCheckout(lookupKey) {
const baseUrl = window.location.origin;
try {
const res = await fetch(baseUrl + '/stripe/create_checkout_session', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ lookup_key: lookupKey })
});
if (!res.ok) {
const err = await res.json().catch(() => ({}));
alert('Checkout konnte nicht gestartet werden.\n' + (err.detail || 'Bitte versuchen Sie es später.'));
return;
}
const data = await res.json();
if (data.url) {
window.location.href = data.url;
} else {
alert('Checkout-URL nicht erhalten. Bitte kontaktieren Sie support@aza-medwork.ch.');
}
} catch (e) {
alert('Verbindungsfehler. Bitte prüfen Sie Ihre Internetverbindung.');
}
}
</script>
</body>
</html>