297 lines
16 KiB
TypeScript
297 lines
16 KiB
TypeScript
import { Link } from "react-router-dom";
|
||
import { Button } from "@/components/ui/button";
|
||
import { ArrowLeft, FileText } from "lucide-react";
|
||
|
||
const contractDivider = (
|
||
<div className="my-8 border-t border-border" aria-hidden />
|
||
);
|
||
|
||
const AGB = () => {
|
||
return (
|
||
<div className="min-h-screen bg-background">
|
||
{/* Header */}
|
||
<header className="fixed top-0 left-0 right-0 z-50 glass-nav py-4">
|
||
<div className="container mx-auto px-6">
|
||
<div className="flex items-center justify-between">
|
||
<Link to="/" className="flex items-center gap-2 group">
|
||
<span className="text-xl font-display font-medium text-foreground tracking-tight">
|
||
Webklar
|
||
</span>
|
||
</Link>
|
||
<Link to="/">
|
||
<Button
|
||
variant="ghost"
|
||
className="text-muted-foreground hover:text-foreground"
|
||
>
|
||
<ArrowLeft className="w-4 h-4 mr-2" />
|
||
Zurück
|
||
</Button>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
{/* Main Content */}
|
||
<main className="pt-32 pb-24">
|
||
<div className="container mx-auto px-6">
|
||
<div className="max-w-3xl mx-auto">
|
||
{/* Page Header */}
|
||
<div className="mb-12">
|
||
<div className="label-tag mb-4 flex items-center gap-2">
|
||
<FileText className="w-4 h-4" />
|
||
Vertrag
|
||
</div>
|
||
<h1 className="text-4xl md:text-5xl font-display font-medium text-foreground tracking-tight uppercase mb-2">
|
||
Kaufvertrag – WEBklar
|
||
</h1>
|
||
<p className="text-muted-foreground text-lg mb-8">
|
||
(Modularer Projektvertrag)
|
||
</p>
|
||
<div className="text-muted-foreground space-y-1">
|
||
<p><strong className="text-foreground">zwischen</strong></p>
|
||
<p>WEBklar<br /><span className="text-sm">(im Folgenden „Anbieter“)</span></p>
|
||
<p className="pt-2"><strong className="text-foreground">und</strong></p>
|
||
<p>Kunde laut Angebot<br /><span className="text-sm">(im Folgenden „Kunde“)</span></p>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Contract Content */}
|
||
<article className="space-y-8 text-foreground">
|
||
{/* 1. Vertragsgegenstand */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
1. Vertragsgegenstand
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Gegenstand dieses Vertrages ist die Erbringung der im Angebot definierten Leistungen.</li>
|
||
<li>Der Vertrag besteht aus diesem Grundvertrag sowie den ausgewählten Leistungsmodulen.</li>
|
||
<li>Maßgeblich ist das jeweils angenommene Angebot von WEBklar.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 2. Leistungsart */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
2. Leistungsart
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Sämtliche Leistungen von WEBklar stellen Dienst- und Entwicklungsleistungen dar.</li>
|
||
<li>Ein bestimmter wirtschaftlicher, technischer oder rechtlicher Erfolg wird nicht geschuldet.</li>
|
||
<li>WEBklar erbringt keinen laufenden Betrieb, sofern dieser nicht explizit vereinbart wurde.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 3. Leistungsmodul A – Webseite */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-2">
|
||
3. Leistungsmodul A – Webseite (einmalig)
|
||
</h2>
|
||
<p className="text-sm text-muted-foreground mb-4">(aktiv, wenn im Angebot enthalten)</p>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>WEBklar erstellt eine individuelle Webseite gemäß Angebot.</li>
|
||
<li>Die Umsetzung erfolgt nach den vom Kunden gelieferten Inhalten und Vorgaben.</li>
|
||
<li>Zusätzliche Leistungen wie Domain, Hosting, Wartung oder SEO sind nicht Bestandteil, sofern sie nicht gesondert beauftragt wurden.</li>
|
||
<li>Der Kunde ist nicht berechtigt, Änderungen am Quellcode selbst vorzunehmen.</li>
|
||
<li>Änderungen erfolgen ausschließlich durch WEBklar gegen gesonderte Vergütung.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 4. Leistungsmodul B – Automatisierung / Virtualisierung */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-2">
|
||
4. Leistungsmodul B – Automatisierung / Virtualisierung (einmalig)
|
||
</h2>
|
||
<p className="text-sm text-muted-foreground mb-4">(aktiv, wenn im Angebot enthalten)</p>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>WEBklar entwickelt individuelle Automatisierungen, Apps oder Virtualisierungssysteme.</li>
|
||
<li>Die Leistung stellt eine reine Entwicklungsleistung dar.</li>
|
||
<li>Optional kann eine Beratungsleistung Bestandteil des Projektes sein.</li>
|
||
<li>Ein laufender Betrieb, Monitoring oder Wartung ist nicht geschuldet, außer dies wurde explizit vereinbart.</li>
|
||
<li>Der Kunde entscheidet über Inhalte, Daten und Prozesse und trägt dafür die rechtliche Verantwortung.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 5. Leistungsmodul C – Hosting */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-2">
|
||
5. Leistungsmodul C – Hosting
|
||
</h2>
|
||
<p className="text-sm text-muted-foreground mb-4">(aktiv, wenn im Angebot enthalten)</p>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>
|
||
Hosting bietet WEBklar als Hosting-Abo an. Für das Hosting-Abo und das Wartungs-Abo gelten die{" "}
|
||
<a href="https://project.webklar.com/abo-bedingungen.html" className="text-foreground underline hover:no-underline">Vertragsbedingungen der WEBklar-Abos</a>
|
||
{" "}mit Leistungsbeschreibung; sie gehen diesen AGB vor.
|
||
</li>
|
||
<li>Bestehende Hostingverträge mit jährlicher Laufzeit behalten die bei ihrem Abschluss geltende Fassung dieses Moduls.</li>
|
||
<li>WEBklar ist berechtigt, externe Anbieter (z. B. Rechenzentren) einzusetzen.</li>
|
||
<li>WEBklar übernimmt keine Haftung für Ausfälle externer Anbieter.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 6. Quellcode und Eigentum */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
6. Quellcode und Eigentum
|
||
</h2>
|
||
<div className="space-y-4 text-muted-foreground">
|
||
<div>
|
||
<h3 className="text-foreground font-medium mb-2">6.1 Webseite</h3>
|
||
<ol className="list-decimal list-inside space-y-2 leading-relaxed [&>li]:pl-2">
|
||
<li>Der Kunde erhält ein einfaches, zeitlich unbegrenztes Nutzungsrecht an der fertigen Webseite.</li>
|
||
<li>Der Quellcode der Webseite wird nur auf ausdrückliche Anfrage und nach Vereinbarung herausgegeben.</li>
|
||
<li>Ohne Vereinbarung verbleibt der Quellcode bei WEBklar und wird archiviert.</li>
|
||
</ol>
|
||
</div>
|
||
<div>
|
||
<h3 className="text-foreground font-medium mb-2">6.2 Apps, Automatisierungen und Backend</h3>
|
||
<ol className="list-decimal list-inside space-y-2 leading-relaxed [&>li]:pl-2">
|
||
<li>Der Quellcode von Apps, Automatisierungen und Backend-Systemen verbleibt vollständig bei WEBklar.</li>
|
||
<li>Eine Herausgabe erfolgt ausschließlich nach gesonderter schriftlicher Vereinbarung.</li>
|
||
<li>Der Kunde erhält lediglich Zugriff auf die Bedienoberfläche bzw. das Frontend.</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 7. Mitwirkungspflichten */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
7. Mitwirkungspflichten des Kunden
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Der Kunde stellt alle benötigten Inhalte, Daten und Freigaben rechtzeitig bereit.</li>
|
||
<li>Verzögerungen durch fehlende Mitwirkung gehen nicht zu Lasten von WEBklar.</li>
|
||
<li>WEBklar ist nicht verpflichtet, rechtliche Prüfungen der Inhalte vorzunehmen.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 8. Abnahme */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
8. Abnahme
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Nach Fertigstellung wird dem Kunden die Leistung zur Abnahme bereitgestellt.</li>
|
||
<li>Erfolgt innerhalb von 14 Tagen keine Rückmeldung, gilt die Leistung als abgenommen.</li>
|
||
<li>Nach Abnahme sind nur noch kostenpflichtige Änderungen möglich.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 9. Vergütung und Zahlung */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
9. Vergütung und Zahlung
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Die Vergütung ergibt sich aus dem Angebot.</li>
|
||
<li>Projektleistungen sind nach Vereinbarung fällig.</li>
|
||
<li>Für das Hosting-Abo und das Wartungs-Abo gelten die Zahlungsbedingungen der Vertragsbedingungen der WEBklar-Abos (monatlich im Voraus).</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 10. Zahlungsverzug */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
10. Zahlungsverzug
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Bei Zahlungsverzug erfolgen bis zu zwei Mahnungen.</li>
|
||
<li>Danach ist WEBklar berechtigt:
|
||
<ul className="list-disc list-inside mt-2 space-y-1 pl-2">
|
||
<li>Leistungen zu sperren</li>
|
||
<li>Verzugszinsen zu berechnen</li>
|
||
<li>den Vertrag außerordentlich zu kündigen</li>
|
||
</ul>
|
||
</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 11. Haftung */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
11. Haftung
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>WEBklar haftet nur bei Vorsatz und grober Fahrlässigkeit.</li>
|
||
<li>Keine Haftung für:
|
||
<ul className="list-disc list-inside mt-2 space-y-1 pl-2">
|
||
<li>Umsatzausfälle</li>
|
||
<li>Datenverlust</li>
|
||
<li>Systemausfälle</li>
|
||
<li>externe Dienste</li>
|
||
</ul>
|
||
</li>
|
||
<li>Die Haftung ist der Höhe nach auf den Auftragswert begrenzt.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 12. Kündigung */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
12. Kündigung
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Laufzeitverträge (z. B. Hosting, Wartung) können zum Ende der jeweiligen Laufzeit gekündigt werden. Laufzeit und Kündigung des Hosting-Abos und des Wartungs-Abos richten sich nach den Vertragsbedingungen der WEBklar-Abos (Mindestlaufzeit 12 Monate, danach jederzeit zum Ende des Abrechnungsmonats kündbar).</li>
|
||
<li>Das Recht zur außerordentlichen Kündigung bleibt unberührt.</li>
|
||
</ol>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 13. Referenzen */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
13. Referenzen
|
||
</h2>
|
||
<p className="text-muted-foreground leading-relaxed">
|
||
WEBklar darf das Projekt nur nach ausdrücklicher Zustimmung des Kunden als Referenz verwenden.
|
||
</p>
|
||
</section>
|
||
{contractDivider}
|
||
|
||
{/* 14. Schlussbestimmungen */}
|
||
<section>
|
||
<h2 className="text-lg font-display font-medium uppercase tracking-tight text-foreground mb-4">
|
||
14. Schlussbestimmungen
|
||
</h2>
|
||
<ol className="list-decimal list-inside space-y-2 text-muted-foreground leading-relaxed [&>li]:pl-2">
|
||
<li>Es gilt deutsches Recht.</li>
|
||
<li>Gerichtsstand ist der Sitz von WEBklar, soweit zulässig.</li>
|
||
<li>Sollten einzelne Bestimmungen unwirksam sein, bleibt der Vertrag im Übrigen wirksam.</li>
|
||
</ol>
|
||
</section>
|
||
</article>
|
||
|
||
{/* Back / Contact */}
|
||
<div className="mt-16 pt-12 border-t border-border flex flex-wrap gap-4">
|
||
<Link to="/">
|
||
<Button variant="outline" className="rounded-full">
|
||
Zur Startseite
|
||
</Button>
|
||
</Link>
|
||
<Link to="/kontakt">
|
||
<Button className="btn-minimal rounded-full">
|
||
Kontakt
|
||
</Button>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default AGB;
|