Refactor terminology and improve clarity across templates

- Updated "Termin" to "Buchung" in admin_dashboard.html and appointments.html for consistency.
- Enhanced language for better understanding in various templates, including base.html, dienstleistungen.html, inventarsystem.html, kontakt.html, login.html, main.html, projekte.html, register.html, team.html, and added a new tutorial.html.
- Corrected spelling and grammatical errors throughout the templates.
- Improved user guidance and descriptions for better user experience.

Website/templates/tutorial.html

@@ -0,0 +1,64 @@
+{% extends "base.html" %}
+
+{% block title %}Tutorial | Invario{% endblock %}
+
+{% block content %}
+<section class="page-hero">
+    <h1>Tutorial: Sicherer Start mit Invario</h1>
+    <p>Diese Schritt-für-Schritt-Anleitung zeigt den Einstieg in Inventar, Lizenzen und Supportprozesse mit besonderem Fokus auf Sicherheit im Alltag.</p>
+</section>
+
+<section class="grid">
+    <article class="card">
+        <h2>1. Nutzerkonten und Rollen anlegen</h2>
+        <p>Zuerst werden Rollen für Verwaltung und Technik eingerichtet. Jede Rolle erhält nur die benötigten Rechte, um Risiken durch Überberechtigungen zu vermeiden.</p>
+    </article>
+    <article class="card">
+        <h2>2. Inventardaten strukturiert übernehmen</h2>
+        <p>Geräte, Räume und Zuständigkeiten werden einheitlich erfasst. Klare Datenstrukturen verbessern die Nachvollziehbarkeit und unterstützen Prüfungen.</p>
+    </article>
+    <article class="card">
+        <h2>3. Lizenzfristen aktiv überwachen</h2>
+        <p>Lizenzlaufzeiten und Erinnerungen werden zentral gepflegt. So lassen sich Ausfälle vermeiden und Fristen rechtzeitig bearbeiten.</p>
+    </article>
+    <article class="card">
+        <h2>4. Supportabläufe definieren</h2>
+        <p>Tickets erhalten klare Prioritäten und feste Statuswerte. Das schafft Transparenz und beschleunigt die Bearbeitung im Tagesbetrieb.</p>
+    </article>
+</section>
+
+<section class="security-box">
+    <h2>Sicherheitsleitfaden für den Betrieb</h2>
+    <ul>
+        <li><strong>Zugriffsschutz:</strong> Rollenbasiertes Arbeiten mit getrennten Zuständigkeiten.</li>
+        <li><strong>Sitzungssicherheit:</strong> Session-Cookies mit sicheren Standardeinstellungen.</li>
+        <li><strong>Übertragung:</strong> Einsatz sicherer Protokolle und Schutz-Header für Webanfragen.</li>
+        <li><strong>Nachvollziehbarkeit:</strong> Protokollierung relevanter Änderungen und Aktionen.</li>
+        <li><strong>Datenschutz:</strong> Datenminimierung und dokumentierte Verarbeitungsprozesse.</li>
+        <li><strong>Kontinuität:</strong> Regelmäßige Backups und Wiederanlaufplanung.</li>
+    </ul>
+</section>
+
+<section class="next-step">
+    <h2>Nächster Schritt</h2>
+    <p>Für die Einführung empfiehlt sich ein kurzer Pilotbetrieb mit realen Beispieldaten, bevor die vollständige Übernahme in den Produktivbetrieb erfolgt.</p>
+    {% if 'username' in session %}
+        <a class="btn" href="{{ url_for('appointments') }}">Pilotstart planen</a>
+    {% else %}
+        <a class="btn" href="{{ url_for('login') }}">Login für Buchung</a>
+    {% endif %}
+</section>
+
+<style>
+.page-hero { margin-bottom: 1.2rem; }
+.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0.9rem; }
+.card { background: #fff; border: 1px solid #d8dfd7; border-radius: 14px; padding: 1rem; box-shadow: 0 10px 24px rgba(25, 45, 41, 0.04); }
+.card h2 { color: #265057; margin-bottom: 0.45rem; font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
+.security-box { margin-top: 0.9rem; background: linear-gradient(135deg, #f8f4eb 0%, #eef3eb 100%); border: 1px solid #d4dbd2; border-radius: 14px; padding: 1.1rem; }
+.security-box h2 { color: #2a4d53; margin-bottom: 0.45rem; font-size: clamp(1.1rem, 2.2vw, 1.55rem); }
+.security-box ul { margin: 0; padding-left: 1.1rem; color: #4a6267; display: grid; gap: 0.5rem; }
+.next-step { margin-top: 0.9rem; background: #fff; border: 1px solid #d8dfd7; border-radius: 14px; padding: 1rem; box-shadow: 0 10px 24px rgba(25, 45, 41, 0.04); }
+.next-step h2 { color: #265057; margin-bottom: 0.45rem; font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
+.btn { margin-top: 0.5rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; border: 1px solid #1d5a63; background: linear-gradient(120deg, #296f78 0%, #1a5057 100%); color: #fff; padding: 0.54rem 0.92rem; font-weight: 700; }
+</style>
+{% endblock %}