Files
smb-online/templates/landing/index.html
T
mivanchenko 5668bfad3f Phase 1: tier demo landing pages, CRM schema, playbooks
- templates/landing: two self-contained demos (Tier A barbershop / Google stack,
  Tier B physio / self-hosted) + chooser page
- sheets/SCHEMA.md: Google Sheets CRM workbook spec
- playbooks: per-client setup checklists for both tiers
- README + .gitignore
- Demos avoid unverifiable claims (no "DSGVO-konform", no "Ende-zu-Ende")

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-23 10:14:15 +02:00

44 lines
2.0 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>smb-online — Demo-Auswahl</title>
<style>
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background: #0f1419; color: #e7edf2; margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 40px 20px; }
.box { width: min(820px, 100%); }
h1 { font-size: 1.7rem; margin: 0 0 6px; }
p.sub { color: #93a1ad; margin: 0 0 32px; }
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
a.card { display: block; text-decoration: none; color: inherit; background: #182029; border: 1px solid #26303b; border-radius: 16px; padding: 26px; transition: transform .15s, border-color .2s; }
a.card:hover { transform: translateY(-4px); }
.a:hover { border-color: #c8a05a; }
.b:hover { border-color: #0f8a7e; }
.tag { font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; }
.a .tag { color: #c8a05a; }
.b .tag { color: #2bb3a3; }
.card h2 { margin: 10px 0 6px; font-size: 1.3rem; }
.card span { color: #93a1ad; font-size: .92rem; }
@media (max-width: 640px) { .cards { grid-template-columns: 1fr; } }
</style>
</head>
<body>
<div class="box">
<h1>smb-online — Tier-Demos</h1>
<p class="sub">Zwei Beispiel-Landingpages, eine pro Stufe. Formulare/Buchung sind in der Demo noch nicht aktiv.</p>
<div class="cards">
<a class="card a" href="demo-tier-a/index.html">
<span class="tag">Tier A · Google-Stack</span>
<h2>Schnittpunkt — Barbershop</h2>
<span>Casual-Business: Google Forms + Google-Kalender-Buchung. Infra ≈ 0 €.</span>
</a>
<a class="card b" href="demo-tier-b/index.html">
<span class="tag">Tier B · Self-Hosted</span>
<h2>PhysioVital — Physiotherapie</h2>
<span>Datenschutz-sensibel: self-hosted Cal.com + Formular + KI-Rezeption + Datenschutz-Badge.</span>
</a>
</div>
</div>
</body>
</html>