5668bfad3f
- 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>
44 lines
2.0 KiB
HTML
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>
|