File: //proc/thread-self/root/tmp/codex_b_log.txt
Reading additional input from stdin...
OpenAI Codex v0.144.1
--------
workdir: /home/kiwerkzeuge.de/staging-build
model: gpt-5.5
provider: openai
approval: never
sandbox: workspace-write [workdir, /tmp, $TMPDIR]
reasoning effort: high
reasoning summaries: none
session id: 019f4ffa-37e4-7c11-a5d6-d6e5dc40da56
--------
user
# Auftrag: kiwerkzeuge.de verkaufsfertig machen (Staging-Build)
Arbeitsverzeichnis: `/home/kiwerkzeuge.de/staging-build` — ein isoliertes Staging-Verzeichnis.
Es enthält KOPIEN der Live-Dateien der deutschsprachigen KI-Tool-Suite kiwerkzeuge.de:
- `index.html` = aktuell die „Depth Studio"-Seite (Tiefenkarte)
- `stable-diffusion.html` (Bildgenerator), `music.html` (Musik), `video-studio.html` (Video Studio)
- `assets/styles.css`, `assets/theme.js`, `assets/fonts/` (Inter selbst gehostet: `inter.css` + woff2, fertig)
- `service/gpuq-proxy.php`, `config/gpuq-client.php` (PHP-Proxy zur GPU-Warteschlange)
Du bearbeitest NUR Dateien in diesem Staging-Verzeichnis. Ein Reviewer übernimmt sie später in die Produktion.
Du hast keinen Netzwerkzugriff. Schreibe modernes, zum Bestand passendes HTML — gleiche Einrückung (2 Spaces),
deutsche Texte, `lang="de"`. Design-System: CSS-Variablen + Klassen `.panel`, `.hero`, `.feature-card`, `.badge`,
`.primary`, `.secondary`, `.ghost`, `.nav-tabs`, `.details`, `.muted` aus `assets/styles.css`.
Alle Seiten binden am Body-Ende Matomo ein (statsdeluxe.com, siteId 149) — übernimm das Snippet aus der
bestehenden `index.html` auch in neue Seiten. Live-Domain für Canonicals/OG: `https://kiwerkzeuge.de/`.
## Aufgaben
### 1. Tiefenkarte auslagern
- Kopiere die bestehende `index.html` nach `tiefenkarte.html` (Inhalt unverändert, alle Element-IDs
bleiben — das Live-`assets/app.js` hängt daran; es ist hier nicht vorhanden und darf nicht angefasst werden).
Passe nur `<title>`/Meta/Canonical und die Navigation an (siehe Aufgabe 6).
### 2. Neue Startseite `index.html` (SEO-Landingpage, ersetzt die alte komplett)
- Titel: „KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de"
- Hero: Nutzenversprechen („Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten,
gehostet in Deutschland"), zwei CTAs: „Kostenlos ausprobieren" (→ #werkzeuge) und „Preise ansehen" (→ /preise.html).
- Abschnitt „Werkzeuge" (#werkzeuge): 4 Karten (Bildgenerator, Musikgenerator, Video Studio, Tiefenkarte)
mit je 2 Sätzen Beschreibung + Link zur jeweiligen Seite.
- Abschnitt „So funktioniert's": 3 Schritte (Werkzeug öffnen → beschreiben/hochladen → Ergebnis herunterladen).
- Abschnitt Preis-Teaser: Free (normale Warteschlange) vs. Priority-Pakete ab 4,90 €/Monat, Button → /preise.html.
- FAQ (details/summary, 4–6 Fragen: Kosten, Anmeldung, Datenschutz/Serverstandort, kommerzielle Nutzung).
- JSON-LD: `WebSite` + `FAQPage`. Open-Graph- + Twitter-Meta, `<link rel="canonical" href="https://kiwerkzeuge.de/">`.
- Kein Status-Pill, kein Upload-UI — reine Landingpage. Header wie bestehende Seiten (Logo „KI", Theme-Toggle).
### 3. `preise.html`
- 4 Karten: **Free** (0 €, normale Warteschlange), **KI Starter** 4,90 €/Monat,
**KI Pro** 14,90 €/Monat (hervorgehoben „Beliebt"), **KI Business** 39,90 €/Monat.
Leistungen: Free = alle Werkzeuge, normale Priorität; Starter = Priority für Bilder & Tiefenkarte;
Pro = Priority für alles inkl. Musik/Video + LoRA bevorzugt; Business = höchste Priorität + 24h-Support.
- Kauf-Buttons als Links: vorerst alle auf `https://support.panomity.com/cart/` (funktioniert sofort),
zusätzlich pro Button ein Attribut `data-hb-pid="HB_PID_STARTER"` (analog `HB_PID_PRO`, `HB_PID_BUSINESS`)
als Platzhalter — die echten Produkt-IDs werden später per Suchen/Ersetzen eingesetzt.
Hinweis unter den Buttons: „Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH)."
- Abschnitt „Prio-Code einlösen": Eingabefeld + Button; Inline-Vanilla-JS setzt Cookie
`kiwz_prio=<CODE>; path=/; max-age=2592000; SameSite=Lax; Secure` und zeigt Bestätigung.
Erklärtext: Code kommt nach dem Kauf per E-Mail, gilt in diesem Browser für alle Werkzeuge.
- FAQ: Zahlung (Kundenportal), monatlich kündbar, Rechnung mit USt., was „Priority" bedeutet (Warteschlange).
- JSON-LD `Product`/`Offer` je Paket. Canonical, OG/Twitter-Meta, Matomo.
### 4. `impressum.html` und `datenschutz.html`
Impressum (exakt diese Daten):
- Panomity GmbH, Seilergasse 34, D-85570 Markt Schwaben
- Geschäftsführer: Sascha Endlicher, M.A.
- Handelsregister: HRB 264411, Amtsgericht München
- USt-IdNr.: DE324810080
- Telefon: +49 8121-7607887, E-Mail: hallo@panomity.de
- Verantwortlicher i.S.d. § 18 Abs. 2 MStV: Sascha Endlicher, M.A., gleiche Anschrift
Datenschutzerklärung (DSGVO, deutsch, seriös, ohne übertriebene Textbausteine): Verantwortlicher (s.o.),
Hosting auf eigenen Servern in Deutschland (Server-Logs: IP, Zeitpunkt, User-Agent; Zweck Betrieb/Sicherheit;
Rechtsgrundlage Art. 6 Abs. 1 lit. f DSGVO), Webanalyse Matomo (selbst gehostet auf statsdeluxe.com, IP-Kürzung,
keine Weitergabe an Dritte), hochgeladene Bilder/erzeugte Medien (Verarbeitung nur zur Diensterbringung,
zeitnahe Löschung), Bestellabwicklung über das HostBill-Kundenportal der Panomity GmbH (support.panomity.com),
Cookie `kiwz_prio` (funktional, 30 Tage), lokale Speicherung des Theme (localStorage), Betroffenenrechte,
Beschwerderecht (BayLDA, Ansbach).
### 5. Google Fonts DSGVO-Fix (Abmahnrisiko LG München I, Az. 3 O 17493/20)
- Die Fonts liegen BEREITS lokal in `assets/fonts/` (inter.css + 2 woff2, fertig). Nichts herunterladen.
- Ersetze in ALLEN HTML-Seiten (alte wie neue) die drei Google-Fonts-Zeilen (`preconnect` ×2 +
`fonts.googleapis.com/css2`-Stylesheet) durch `<link rel="stylesheet" href="/assets/fonts/inter.css" />`.
### 6. Navigation + Footer auf ALLEN Seiten vereinheitlichen
- Nav-Tabs überall: Start (/) | Tiefenkarte (/tiefenkarte.html) | Bildgenerator (/stable-diffusion.html) |
Musik (/music.html) | Video Studio (/video-studio.html) | Preise (/preise.html) — aktive Seite mit `.active`.
- Footer (neu, dezent): © 2026 Panomity GmbH · Links: Preise · Impressum · Datenschutz.
Ergänze passende Styles am ENDE von `assets/styles.css` (z. B. `.site-footer`, muted, Border oben,
flex, responsive). Footer auf ALLEN Seiten einfügen (innerhalb `.page`, nach `</main>`).
### 7. SEO-Dateien
- `robots.txt`: Allow alles außer `/service/`, `/api/`, `/gpuq/`, `/uploads/`, `/tmp/`, `/training/`,
`/config/`, `/docs/`, `/xy/`, `/openclaw-media/`, `/creator-studio/`; Sitemap-Zeile (https://kiwerkzeuge.de/sitemap.xml).
- `sitemap.xml`: die 8 öffentlichen Seiten (/, /tiefenkarte.html, /stable-diffusion.html, /music.html,
/video-studio.html, /preise.html, /impressum.html, /datenschutz.html), sinnvolle priority/changefreq.
### 8. Priority-Code-Durchsetzung in `service/gpuq-proxy.php`
- In `config/gpuq-client.php` neuen Schlüssel `priority_codes` ergänzen: Array Code → Stufe (z. B.
`'KIWZ-AB2C-DE3F' => 'high'`), initial leeres Array mit erklärendem Kommentar.
- In `service/gpuq-proxy.php` (case `submit`): Ein vom Client gesetztes `priority`-Feld im Payload wird
ENTFERNT, außer es liegt ein gültiger Code vor: `$_COOKIE['kiwz_prio']` oder `$payload['priority_code']`;
gültig = Schlüssel existiert in `priority_codes` → setze `$payload['priority']` auf die hinterlegte Stufe.
Ungültig/kein Code → `priority` entfernen (Service-Default „normal" greift).
`priority_code` vor dem Weiterleiten immer aus dem Payload entfernen. Case-insensitive Codes (strtoupper).
- `php -l` auf jede geänderte PHP-Datei (php-cli ist verfügbar).
### 9. Qualitätssicherung + Bericht
- Alle internen Links der neuen/geänderten Seiten müssen auf existierende Dateien zeigen
(tiefenkarte.html, preise.html, impressum.html, datenschutz.html, /assets/fonts/inter.css …).
- JSON-LD muss valides JSON sein. HTML-Struktur konsistent (ein `<h1>` pro Seite).
- Schreibe abschließend `kiwz_frontend_report.md` INS Staging-Verzeichnis: Liste aller erstellten/geänderten
Dateien mit 1-Zeilen-Beschreibung + offene Punkte.
## Harte Grenzen
- NUR im Staging-Verzeichnis arbeiten. Nichts außerhalb lesen/schreiben (außer php -l).
- Keine JS-Apps ändern (app.js etc. existieren hier bewusst nicht), keine neuen externen CDNs einbinden
(der bestehende three.js-CDN-Verweis in tiefenkarte.html bleibt vorerst).
- Nichts löschen außer den explizit zu ersetzenden Zeilen (Google Fonts, Nav-Blöcke).
codex
Ich prüfe zuerst die vorhandenen HTML-, CSS- und PHP-Dateien, damit die neuen Seiten exakt zum bestehenden Aufbau passen und keine IDs der Tiefenkarte beschädigt werden. Danach setze ich die Änderungen gesammelt um und validiere PHP, Links und JSON-LD.
exec
/bin/bash -lc 'pwd && rg --files' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
/home/kiwerkzeuge.de/staging-build
music.html
index.html
stable-diffusion.html
video-studio.html
service/gpuq-proxy.php
config/gpuq-client.php
assets/theme.js
assets/styles.css
assets/fonts/inter.css
assets/fonts/inter-latin.woff2
assets/fonts/inter-latin-ext.woff2
exec
/bin/bash -lc 'git status --short' in /home/kiwerkzeuge.de/staging-build
exited 128 in 0ms:
fatal: not a git repository (or any of the parent directories): .git
codex
Das Staging-Verzeichnis ist kein Git-Checkout, also verlasse ich mich auf direkte Dateiinspektion und behalte Änderungen eng begrenzt. Als Nächstes lese ich die bestehenden Seitenstrukturen, Navigation, Matomo-Snippet und Proxy-Logik.
exec
/bin/bash -lc "sed -n '1,260p' index.html" in /home/kiwerkzeuge.de/staging-build
exec
/bin/bash -lc "sed -n '1,240p' stable-diffusion.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
<meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
<script defer src="/assets/app.js?v=20260212-0915"></script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
<div class="logo">DA</div>
<div>
<h1>Depth Studio</h1>
<p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
</div>
</div>
<div class="header-actions">
<button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
<svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2"></path>
<path d="M12 20v2"></path>
<path d="m4.93 4.93 1.41 1.41"></path>
<path d="m17.66 17.66 1.41 1.41"></path>
<path d="M2 12h2"></path>
<path d="M20 12h2"></path>
<path d="m6.34 17.66-1.41 1.41"></path>
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
<div class="status-pill" id="serviceStatus">
<span class="dot"></span>
<span>Status wird geprüft…</span>
</div>
</div>
</header>
<nav class="nav-tabs">
<a href="/" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
</nav>
<main class="main">
<section class="hero">
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
<span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
<span class="badge">PNG/JPG/WebM</span>
</div>
<h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
<p class="hero-subtitle">
Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
</p>
<div class="hero-actions">
<button class="primary" id="heroPickBtn" type="button">
<span>Foto auswählen</span>
</button>
<a class="secondary" href="#start">Direkt starten</a>
</div>
<p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
<h3>Tiefenkarte (PNG)</h3>
<p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
</article>
<article class="feature-card">
<h3>Porträt-Effekt</h3>
<p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
</article>
<article class="feature-card">
<h3>3D-Zoom-Clip</h3>
<p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
</article>
<article class="feature-card">
<h3>Einfach & schnell</h3>
<p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
</article>
</div>
</div>
</div>
</section>
<div class="layout">
<section class="panel upload" id="start">
<div>
<h2>1. Foto auswählen</h2>
<p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
</div>
<label class="dropzone" id="dropzone">
<input type="file" accept="image/*" id="imageInput" hidden />
<div class="dropzone__content">
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 5v14" />
<path d="M5 12h14" />
</svg>
<p>Bild hier ablegen oder <span>Datei auswählen</span></p>
<small id="fileInfo">Noch keine Datei ausgewählt.</small>
</div>
</label>
<div class="toggles">
<label>
<input type="checkbox" id="optionDepth" checked />
<span>Tiefenkarte (PNG)</span>
</label>
<label>
<input type="checkbox" id="optionPortrait" checked />
<span>Porträt-Effekt (unscharfer Hintergrund)</span>
</label>
<label>
<input type="checkbox" id="optionVideo" />
<span>3D-Zoom (kurzer Clip)</span>
</label>
</div>
<button id="processBtn" class="primary" disabled>
<span>Jetzt berechnen</span>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="22" y1="2" x2="11" y2="13"></line>
<polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
</svg>
</button>
<div class="progress" id="progress" hidden>
<div class="spinner"></div>
<div>
<p id="progressTitle">Wird vorbereitet…</p>
<small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
</div>
</div>
</section>
<section class="panel results">
<h2>2. Ergebnisse herunterladen</h2>
<div class="results-grid">
<article class="result-card" id="depthCard">
<header>
<h3>Tiefenkarte</h3>
<button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
</header>
<div class="result-preview" id="depthPreview">
<p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
</div>
</article>
<article class="result-card" id="portraitCard">
<header>
<div>
<h3>Porträt-Effekt</h3>
<small>Schärfe & Unschärfe anpassen</small>
</div>
<button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
</header>
<div class="controls" id="portraitControls" hidden>
<label>
Schärfe-Ebene
<input type="range" id="focusSlider" min="5" max="95" value="45" />
</label>
<label>
Unschärfe
<input type="range" id="bokehSlider" min="4" max="30" value="14" />
</label>
</div>
<div class="result-preview" id="portraitPreview">
<p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
</div>
</article>
<article class="result-card" id="videoCard">
<header>
<div>
<h3>3D-Zoom-Clip</h3>
<small>Kurzer Clip mit 3D-Effekt</small>
</div>
<button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
</header>
<div class="result-preview" id="videoPreview">
<p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
</div>
</article>
</div>
</section>
</div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
<summary>Was bekomme ich genau?</summary>
<p class="muted">
Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
</p>
</details>
<details class="details">
<summary>Welche Fotos funktionieren am besten?</summary>
<p class="muted">
Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
</p>
</details>
<details class="details">
<summary>Technische Details (optional)</summary>
<p class="muted">
API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
</p>
</details>
</section>
</main>
</div>
<!-- Matomo Analytics -->
<script>
var _paq = window._paq = window._paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://statsdeluxe.com/statistics/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '149']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->
</body>
</html>
succeeded in 0ms:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
<div class="logo">SD</div>
<div>
<h1>Bildgenerator</h1>
<p>Bilder erstellen, bearbeiten und eigene Stile trainieren.</p>
</div>
</div>
<div class="header-actions">
<button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
<svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2"></path>
<path d="M12 20v2"></path>
<path d="m4.93 4.93 1.41 1.41"></path>
<path d="m17.66 17.66 1.41 1.41"></path>
<path d="M2 12h2"></path>
<path d="M20 12h2"></path>
<path d="m6.34 17.66-1.41 1.41"></path>
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
<div class="status-pill" id="serviceStatus">
<span class="dot"></span>
<span>Status wird geprüft…</span>
</div>
</div>
</header>
<nav class="nav-tabs">
<a href="/" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
</nav>
<main class="main">
<!-- Sub-Tab Navigation -->
<nav class="sub-tabs" id="subTabs">
<button class="sub-tab active" data-tab="generate">Bild erstellen</button>
<button class="sub-tab" data-tab="inpaint">Inpainting</button>
<button class="sub-tab" data-tab="lora">LoRA Training</button>
</nav>
<!-- ═══════════════════════════════════════════ -->
<!-- TAB 1: Bild erstellen -->
<!-- ═══════════════════════════════════════════ -->
<div class="tab-content active" id="tab-generate">
<div class="layout">
<section class="panel txt2img" id="txt2img">
<div>
<h2>Bild aus Text</h2>
<p>Beschreibe kurz, was du sehen möchtest – wir erzeugen daraus ein Bild.</p>
</div>
<div class="form-group">
<label for="promptInput">Beschreibung</label>
<textarea id="promptInput" rows="3" placeholder="z.B. Ein sonniger Strand mit Palmen, fotorealistisch, hohe Details"></textarea>
</div>
<div class="form-group">
<label for="negativePromptInput">Was soll NICHT im Bild sein? (optional)</label>
<textarea id="negativePromptInput" rows="2" placeholder="z.B. verschwommen, Verzerrungen, Text, Wasserzeichen"></textarea>
</div>
<!-- LoRA Selection -->
<div class="form-group" id="loraSelectionGroup" hidden>
<label>Trainierte Stile (LoRA)</label>
<div class="lora-chips" id="loraChips"></div>
</div>
<details class="details">
<summary>Erweiterte Einstellungen</summary>
<div class="form-row">
<div class="form-group">
<label for="widthInput">Breite</label>
<select id="widthInput">
<option value="512">512px</option>
<option value="768">768px</option>
<option value="1024">1024px</option>
</select>
</div>
<div class="form-group">
<label for="heightInput">Höhe</label>
<select id="heightInput">
<option value="512">512px</option>
<option value="768">768px</option>
<option value="1024">1024px</option>
</select>
</div>
<div class="form-group">
<label for="stepsInput">Qualität (Schritte)</label>
<input type="number" id="stepsInput" min="10" max="50" value="20" />
</div>
<div class="form-group">
<label for="cfgScaleInput">Treue zur Beschreibung</label>
<input type="number" id="cfgScaleInput" min="1" max="20" step="0.5" value="7" />
</div>
</div>
<p class="hint">Tipp: Mehr Schritte = meist bessere Details, dauert aber länger.</p>
</details>
<div class="button-row">
<button id="generateBtn" class="primary">
<span>Bild erstellen</span>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>
</button>
<button id="sendToInpaintBtn" class="secondary" hidden>Zum Inpainting senden</button>
</div>
<div class="progress" id="txt2imgProgress" hidden>
<div class="spinner"></div>
<div>
<p id="txt2imgProgressTitle">Generiere Bild…</p>
<small id="txt2imgProgressSub">Das kann je nach Auslastung etwas dauern.</small>
</div>
</div>
</section>
<section class="panel remove-bg" id="removebg">
<div>
<h2>Hintergrund entfernen</h2>
<p>Lade ein Bild hoch – du bekommst automatisch eine Version ohne Hintergrund (PNG).</p>
</div>
<input type="file" accept="image/*" id="bgImageInput" class="sr-only" />
<div class="dropzone" id="bgDropzone">
<div class="dropzone__content">
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14" /><path d="M5 12h14" /></svg>
<p>Bild hier ablegen oder <span>Datei auswählen</span></p>
<small id="bgFileInfo">Noch keine Datei ausgewählt.</small>
</div>
</div>
<button id="removeBgBtn" class="primary" disabled>
<span>Hintergrund entfernen</span>
</button>
<div class="progress" id="removeBgProgress" hidden>
<div class="spinner"></div>
<div>
<p id="removeBgProgressTitle">Entferne Hintergrund…</p>
<small id="removeBgProgressSub">Bitte warten…</small>
</div>
</div>
</section>
<section class="panel results">
<h2>Ergebnisse</h2>
<div class="results-grid">
<article class="result-card" id="txt2imgCard">
<header>
<h3>Generiertes Bild</h3>
<button class="ghost" id="downloadTxt2img" disabled>PNG herunterladen</button>
</header>
<div class="result-preview" id="txt2imgPreview">
<p class="placeholder">Das generierte Bild wird hier angezeigt.</p>
</div>
</article>
<article class="result-card" id="removeBgCard">
<header>
<h3>Ohne Hintergrund</h3>
<button class="ghost" id="downloadRemoveBg" disabled>PNG herunterladen</button>
</header>
<div class="result-preview" id="removeBgPreview">
<p class="placeholder">Das Bild ohne Hintergrund wird hier angezeigt.</p>
</div>
</article>
</div>
</section>
</div>
</div>
<!-- ═══════════════════════════════════════════ -->
<!-- TAB 2: Inpainting -->
<!-- ═══════════════════════════════════════════ -->
<div class="tab-content" id="tab-inpaint">
<div class="layout">
<section class="panel inpaint-panel" id="inpaintSection">
<div>
<h2>Inpainting</h2>
<p>Male über den Bereich, den du ändern möchtest, und beschreibe per Text oder Sprache, was dort erscheinen soll.</p>
</div>
<!-- Image source -->
<div class="form-group">
<label>Ausgangsbild</label>
<div class="inpaint-source-row">
<input type="file" accept="image/*" id="inpaintImageInput" class="sr-only" />
<div class="dropzone dropzone--small" id="inpaintDropzone">
<div class="dropzone__content">
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14" /><path d="M5 12h14" /></svg>
<p>Bild hochladen</p>
</div>
</div>
<span class="inpaint-or">oder</span>
<button class="secondary" id="useGeneratedForInpaint" disabled>Generiertes Bild verwenden</button>
</div>
</div>
<!-- Canvas area -->
<div class="inpaint-canvas-wrap" id="inpaintCanvasWrap" hidden>
<div class="inpaint-toolbar">
<button class="tool-btn active" id="brushTool" title="Pinsel">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="m9.06 11.9 8.07-8.06a2.85 2.85 0 1 1 4.03 4.03l-8.06 8.08"/><path d="M7.07 14.94c-1.66 0-3 1.35-3 3.02 0 1.33-2.5 1.52-2 2.02 1.08 1.1 2.49 2.02 4 2.02 2.2 0 4-1.8 4-4.04a3.01 3.01 0 0 0-3-3.02z"/></svg>
</button>
<button class="tool-btn" id="eraserTool" title="Radierer">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21"/><path d="M22 21H7"/><path d="m5 11 9 9"/></svg>
</button>
<div class="tool-separator"></div>
<label class="tool-range" title="Pinselgröße">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/></svg>
<input type="range" id="brushSize" min="5" max="100" value="30" />
<span id="brushSizeLabel">30</span>
</label>
<div class="tool-separator"></div>
<button class="tool-btn" id="undoMask" title="Rückgängig">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 7v6h6"/><path d="M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6 2.3L3 13"/></svg>
</button>
<button class="tool-btn" id="clearMask" title="Maske löschen">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/></svg>
</button>
</div>
<div class="inpaint-canvas-container">
<canvas id="inpaintCanvas"></canvas>
</div>
</div>
exec
/bin/bash -lc "sed -n '1,240p' music.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
<div class="logo">♪</div>
<div>
<h1>Musikgenerator</h1>
<p>Erstelle Musik aus Text – einfach und schnell.</p>
</div>
</div>
<div class="header-actions">
<button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
<svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2"></path>
<path d="M12 20v2"></path>
<path d="m4.93 4.93 1.41 1.41"></path>
<path d="m17.66 17.66 1.41 1.41"></path>
<path d="M2 12h2"></path>
<path d="M20 12h2"></path>
<path d="m6.34 17.66-1.41 1.41"></path>
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
<div class="status-pill" id="serviceStatus">
<span class="dot"></span>
<span>Status wird geprüft…</span>
</div>
</div>
</header>
<nav class="nav-tabs">
<a href="/" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
</nav>
<main class="main">
<section class="hero">
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
<span class="badge">KI‑Musikgenerator</span>
<span class="badge">Sofort-Download</span>
<span class="badge">Kommerziell nutzbar</span>
</div>
<h2 class="hero-title">Beschreibe deinen Sound.</h2>
<p class="hero-subtitle">
Schreib, was du hören willst – zum Beispiel "entspannter Lo-Fi mit Piano" oder "epic trailer music mit Drums".
Wir generieren daraus einen passenden Track.
</p>
<div class="hero-actions">
<a class="secondary" href="#create">Loslegen</a>
</div>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
<h3>Text → Musik</h3>
<p>Beschreibe Stil, Stimmung oder Instrumente – so detailliert oder vage wie du willst.</p>
</article>
<article class="feature-card">
<h3>Als WAV downloaden</h3>
<p>Der fertige Track lässt sich direkt anhören und herunterladen.</p>
</article>
</div>
</div>
</div>
</section>
<div class="layout">
<section class="panel" id="create">
<div>
<h2>Deine Beschreibung</h2>
<p>Wie soll deine Musik klingen?</p>
</div>
<div class="form-group">
<label for="musicPrompt" style="display:flex; align-items:center; justify-content:space-between; gap:0.5rem;">
<span>Beschreibe den Sound</span>
<button type="button" id="openHelpModal" class="ghost" style="margin-left:auto;">Hilfe & Beispiele</button>
</label>
<textarea id="musicPrompt" rows="4" placeholder="z.B.: relaxter Lo-Fi Hip Hop, sanftes Piano, leichte Beats, zum Entspannen"></textarea>
</div>
<div class="form-group">
<label for="lyricsPrompt">Lyrics (optional – für Gesang)</label>
<div class="lyrics-mode" style="margin-bottom: 0.6rem;">
<label class="radio-inline" style="margin-right: 1rem; cursor: pointer;">
<input type="radio" name="lyricsMode" value="manual" checked style="margin-right: 0.3rem;"> Eigene Lyrics eingeben
</label>
<label class="radio-inline" style="cursor: pointer;">
<input type="radio" name="lyricsMode" value="ai" style="margin-right: 0.3rem;"> Von KI aus Stichpunkten generieren
</label>
</div>
<div id="lyricsPromptWrapper">
<textarea id="lyricsPrompt" rows="10" style="min-height: 240px; width: 100%; box-sizing: border-box; resize: vertical; line-height: 1.6; padding: 0.75rem;" placeholder="Gib hier deinen Songtext ein, um Gesang zu generieren. Leer lassen für instrumentale Musik."></textarea>
</div>
<div id="aiLyricsSection" hidden>
<label for="lyricsKeywords" style="margin-top: 0.8rem; display: block;">Stichpunkte für die KI</label>
<textarea id="lyricsKeywords" rows="4" style="min-height: 120px; width: 100%; box-sizing: border-box; resize: vertical; line-height: 1.5; padding: 0.6rem;" placeholder="z.B.: Liebe, Herzschmerz, Hoffnung, neue Anfänge"></textarea>
<button type="button" id="generateLyricsBtn" class="secondary" style="margin-top: 0.5rem; align-self: flex-start;">
<span>Lyrics generieren</span>
</button>
<div id="lyricsGenProgress" hidden style="margin-top: 0.5rem; color: var(--muted);">
<span class="spinner" style="width: 1rem; height: 1rem; border-width: 2px; display: inline-block; vertical-align: middle; margin-right: 0.5rem;"></span>
Lyrics werden erstellt…
</div>
</div>
<small class="muted">Wenn du Lyrics eingibst oder generieren lässt, wird die Musik mit Gesang erstellt. Unterstützt 50+ Sprachen.</small>
</div>
<div class="form-row">
<div class="form-group">
<label for="durationSelect">Wie lang?</label>
<input type="range" id="durationSelect" min="10" max="600" step="1" value="30" />
<small id="durationValue">0:30</small>
</div>
<div class="form-group" style="display:none">
<label for="seedInput">Seed (optional)</label>
<input type="hidden" id="seedInput" />
</div>
</div>
<div class="form-row">
<div class="form-group">
<label for="voiceSelect">Stimme (optional)</label>
<select id="voiceSelect" style="width:100%; padding:0.5rem; border-radius:6px; border:1px solid var(--border); background:var(--surface); color:var(--text);">
<option value="">Standard-Modell (keine LoRA)</option>
</select>
<small class="muted">Trainierte Stimmen erscheinen hier automatisch. Wenn im Prompt exakt ein Stimmenname vorkommt (z. B. „Oma“), wird er automatisch gewählt.</small>
</div>
<div class="form-group">
<label for="diffusionSteps">Qualität</label>
<input type="range" id="diffusionSteps" min="10" max="100" value="50" />
<small id="diffusionStepsValue">50 (Standard)</small>
</div>
</div>
<button id="generateMusicBtn" class="primary">
<span>Musik erstellen</span>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="5 3 19 12 5 21 5 3"></polygon>
</svg>
</button>
<div class="progress" id="musicProgress" hidden style="display: none;">
<div class="spinner"></div>
<div>
<p id="musicProgressTitle">Generiere Musik…</p>
<small id="musicProgressSub">Das kann je nach Auslastung etwas dauern.</small>
</div>
</div>
</section>
<section class="panel results">
<h2>Dein Ergebnis</h2>
<div class="results-grid">
<article class="result-card">
<header>
<h3>Track</h3>
<button class="ghost" id="downloadMusic" disabled>WAV herunterladen</button>
</header>
<div class="result-preview" id="musicPreview">
<p class="placeholder">Hier erscheint dein Track, sobald er fertig ist.</p>
</div>
</article>
<article class="result-card" id="lyricsResultCard" hidden>
<header>
<h3>Lyrics</h3>
</header>
<div id="lyricsResultSlot">
</div>
</article>
</div>
</section>
</div>
<section class="panel" id="voiceTrainingSection">
<div style="display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;">
<div>
<h2 style="margin:0;">Stimmen trainieren</h2>
<p class="muted" style="margin:0.25rem 0 0;">Eigene Stimmen per LoRA trainieren und bei der Musikerstellung verwenden.</p>
</div>
<button type="button" id="toggleTrainingForm" class="secondary" style="white-space:nowrap;">+ Neue Stimme</button>
</div>
<div id="trainingFormWrapper" hidden style="margin-top:1.5rem; padding:1.25rem; border:1px solid var(--border); border-radius:8px; background:var(--surface);">
<div class="form-group">
<label for="voiceName">Name der Stimme</label>
<input type="text" id="voiceName" maxlength="64" placeholder="z.B. deep-male, soft-female (a-z, 0-9, -, _)" style="width:100%; padding:0.5rem; border-radius:6px; border:1px solid var(--border); background:var(--bg); color:var(--text);" />
<small class="muted">Eindeutiger Name – wird später im Stimmen-Dropdown angezeigt.</small>
</div>
<div class="form-group">
<label for="voiceFiles">Audio-Samples hochladen</label>
<div id="voiceDropZone" style="border:2px dashed var(--border); border-radius:8px; padding:2rem; text-align:center; cursor:pointer; transition:border-color 0.2s;">
<p style="margin:0;">Dateien hierher ziehen oder klicken zum Auswählen</p>
<small class="muted">MP3, WAV, FLAC oder OGG · 3–30 Dateien empfohlen</small>
<input type="file" id="voiceFiles" multiple accept=".mp3,.wav,.flac,.ogg,audio/*" style="display:none;" />
</div>
<small id="voiceFileCount" class="muted" style="margin-top:0.4rem; display:block;"></small>
</div>
<div class="form-group">
<label for="voiceTags">Tags (Beschreibung der Stimme)</label>
<input type="text" id="voiceTags" placeholder="z.B. female vocal, warm, pop, soft" style="width:100%; padding:0.5rem; border-radius:6px; border:1px solid var(--border); background:var(--bg); color:var(--text);" />
<small class="muted">Kommagetrennte Tags, die den Klang beschreiben.</small>
</div>
<div class="form-group">
<label for="voiceSteps">Trainingsschritte</label>
<input type="range" id="voiceSteps" min="500" max="5000" step="500" value="2000" style="width:100%;" />
<small id="voiceStepsValue">2000 Schritte (~30 Min.)</small>
</div>
<div style="display:flex; gap:0.75rem; margin-top:0.5rem;">
<button type="button" id="startTrainingBtn" class="primary" style="white-space:nowrap;">Training starten</button>
<button type="button" id="cancelTrainingFormBtn" class="ghost" style="white-space:nowrap;">Abbrechen</button>
</div>
</div>
exec
/bin/bash -lc "sed -n '1,240p' video-studio.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Video Studio | Lange Videos in Szenen planen</title>
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
</head>
<body>
<div class="page video-page">
<header class="site-header">
<div class="brand">
<div class="logo">VS</div>
<div>
<h1>Video Studio</h1>
<p>Langvideos entstehen Shot für Shot - so bleibt alles konsistent.</p>
</div>
</div>
<div class="header-actions">
<button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
<svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2"></path>
<path d="M12 20v2"></path>
<path d="m4.93 4.93 1.41 1.41"></path>
<path d="m17.66 17.66 1.41 1.41"></path>
<path d="M2 12h2"></path>
<path d="M20 12h2"></path>
<path d="m6.34 17.66-1.41 1.41"></path>
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
<div class="status-pill" id="serviceStatus">
<span class="dot"></span>
<span>Planer wird geladen...</span>
</div>
</div>
</header>
<nav class="nav-tabs">
<a href="/" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
<button class="stepper__item" type="button" data-step="1">1 Script</button>
<button class="stepper__item" type="button" data-step="2">2 Charaktere</button>
<button class="stepper__item" type="button" data-step="3">3 Storyboard</button>
<button class="stepper__item" type="button" data-step="4">4 Shots</button>
<button class="stepper__item" type="button" data-step="5">5 Pipeline</button>
</nav>
<main class="main">
<div class="wizard" id="wizard">
<section class="panel wizard-step is-active" data-step="1" id="script">
<div class="panel-header">
<div>
<h2>1. Script</h2>
<p>Nur die Essentials. Danach erzeugen wir automatisch Drama-Struktur, Charaktervorschläge und Shots.</p>
</div>
<div class="pill-row">
<span class="pill">Kurz</span>
<span class="pill">Klar</span>
<span class="pill">Wiederholbar</span>
</div>
</div>
<div class="wizard-step__body">
<div class="form-row">
<div class="form-group">
<label for="projectName">Projektname</label>
<input id="projectName" type="text" placeholder="z.B. kiwerkzeuge-spot" />
</div>
<div class="form-group">
<label for="targetMinutes">Ziel-Länge (Minuten)</label>
<input id="targetMinutes" type="number" min="0.5" step="0.5" value="1" />
</div>
<div class="form-group">
<label for="avgShotLength">Durchschnitt pro Shot (Sek., max 20)</label>
<input id="avgShotLength" type="number" min="1" max="20" step="0.5" value="2" title="Max 20 Sekunden" />
</div>
</div>
<div class="form-group">
<label for="scriptInput">Dein Script (eine Szene pro Zeile)</label>
<textarea id="scriptInput" rows="4" placeholder="Szene 1: Charakter A spricht im Studio... Szene 2: Close-up, emotionaler Shift... Szene 3: Totale, zwei Personen laufen..."></textarea>
<p class="hint">Eine Zeile = ein Shot. Technisches Limit: 20 Sekunden pro Shot (empfohlen 2-8s).</p>
</div>
<div class="button-row">
<button class="primary" id="generateShotListBtn" type="button">Drama-Struktur erzeugen</button>
</div>
</div>
<div class="wizard-actions wizard-actions--end">
<button class="primary" type="button" data-action="next" disabled>Weiter</button>
</div>
</section>
<section class="panel wizard-step" data-step="4" id="shotlist">
<div class="panel-header">
<div>
<h2>4. Shots & Timing</h2>
<p>Überprüfe Dauer und Aktion. Startbilder werden aus dem Storyboard übernommen oder fehlend nachgeladen.</p>
</div>
<div class="button-row">
<button class="ghost" id="addShotBtn" type="button">Shot hinzufügen</button>
<button class="secondary" id="generateMissingStartFramesBtn" type="button">Fehlende Startbilder generieren</button>
</div>
</div>
<div class="wizard-step__body">
<div class="wizard-status is-hidden" id="shotStartFrameStatus" aria-live="polite"></div>
<div class="shot-toolbar">
<div class="form-group shot-search">
<label for="shotSearch">Shot suchen</label>
<input id="shotSearch" type="search" placeholder="Titel, Aktion, Charakter" />
</div>
<label class="toggle-chip">
<input type="checkbox" id="compactView" />
<span>Kompaktansicht</span>
</label>
<div class="shot-filter-status" id="shotFilterStatus">Alle Shots</div>
</div>
<div class="shot-list" id="shotList" aria-live="polite"></div>
<div class="empty-state" id="shotEmpty">Noch keine Shots. Erstelle zuerst eine Shotlist.</div>
<div class="stat-grid">
<div class="stat">
<h4>Shots</h4>
<p id="shotCount">0</p>
</div>
<div class="stat">
<h4>Gesamtzeit</h4>
<p id="shotDuration">0 min</p>
</div>
<div class="stat">
<h4>Frames gesamt</h4>
<p id="shotFrames">0</p>
</div>
</div>
</div>
<div class="wizard-actions">
<button class="ghost" type="button" data-action="prev">Zurück</button>
<button class="primary" type="button" data-action="next" disabled>Weiter</button>
</div>
</section>
<section class="panel wizard-step" data-step="2" id="characters">
<div class="panel-header">
<div>
<h2>2. Charaktere</h2>
<p>Referenzbilder sind der wichtigste Anker für konsistente Gesichter.</p>
</div>
<div class="button-row">
<button class="secondary" id="addCharacterBtn" type="button">Charakter hinzufügen</button>
<button class="ghost" id="generateCharacterPackBtn" type="button">Charakter-Paket generieren</button>
</div>
</div>
<div class="wizard-step__body">
<div class="essentials-panel">
<div class="checkbox-row">
<input type="checkbox" id="useReferenceImages" checked />
<label for="useReferenceImages">Referenzbilder verpflichtend nutzen (empfohlen)</label>
</div>
<p class="hint">Wenn deaktiviert, kannst du ohne Upload fortfahren - die Identität wird aber instabiler.</p>
</div>
<div class="wizard-status is-hidden" id="characterStatus" aria-live="polite"></div>
<div class="character-grid" id="characterList"></div>
<div class="empty-state" id="characterEmpty">Noch keine Charaktere. Lege mindestens einen an.</div>
<details class="details details--compact">
<summary>Weitere Identitätsanker anzeigen</summary>
<div class="checkbox-row">
<input type="checkbox" id="useSeedDiscipline" checked />
<label for="useSeedDiscipline">Seed pro Charakter fixieren (nur kleine Deltas)</label>
</div>
</details>
</div>
<div class="wizard-actions">
<button class="ghost" type="button" data-action="prev">Zurück</button>
<button class="primary" type="button" data-action="next" disabled>Weiter</button>
</div>
</section>
<section class="panel wizard-step" data-step="3" id="storyboard">
<div class="panel-header">
<div>
<h2>3. Storyboard</h2>
<p>Pro Shot erzeugen wir Keyframes als visuelle Referenz für die Pipeline.</p>
</div>
<div class="button-row">
<button class="primary" id="generateStoryboardBtn" type="button">Storyboard generieren</button>
<button class="ghost ghost--icon" id="storyboardFullscreenBtn" type="button" aria-label="Storyboard Vollbild" title="Storyboard Vollbild">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<polyline points="15 3 21 3 21 9"></polyline>
<polyline points="9 21 3 21 3 15"></polyline>
<line x1="21" y1="3" x2="14" y2="10"></line>
<line x1="3" y1="21" x2="10" y2="14"></line>
</svg>
</button>
</div>
</div>
<div class="wizard-step__body">
<div class="wizard-status is-hidden" id="storyboardStatus" aria-live="polite"></div>
<div class="shot-list" id="storyboardList" aria-live="polite"></div>
<div class="empty-state" id="storyboardEmpty">Noch kein Storyboard vorhanden. Starte die Storyboard-Generierung.</div>
<div class="stat-grid">
<div class="stat">
<h4>Storyboard-Frames</h4>
<p id="storyboardCount">0</p>
</div>
<div class="stat">
<h4>Mit Bild</h4>
<p id="storyboardWithImage">0</p>
</div>
<div class="stat">
<h4>Ohne Bild</h4>
<p id="storyboardWithoutImage">0</p>
</div>
exec
/bin/bash -lc 'tail -n 90 stable-diffusion.html' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
</div>
</div>
<div class="lora-upload-preview" id="loraUploadPreview"></div>
<div class="lora-upload-info" id="loraUploadInfo" hidden>
<span id="loraImageCount">0</span> Bilder ausgewählt
</div>
<div class="button-row">
<button class="secondary" id="loraBack2">Zurück</button>
<button class="primary" id="loraNext2" disabled>
<span>Bilder hochladen & weiter</span>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="m9 18 6-6-6-6"/></svg>
</button>
</div>
<div class="progress" id="loraUploadProgress" hidden>
<div class="spinner"></div>
<div>
<p>Lade Bilder hoch…</p>
</div>
</div>
</div>
<!-- Step 3: Training -->
<div class="lora-step" id="loraStep3">
<div class="lora-summary" id="loraSummary">
<h3>Zusammenfassung</h3>
<dl>
<dt>Projektname</dt><dd id="loraSumName">–</dd>
<dt>Trigger-Wort</dt><dd id="loraSumTrigger">–</dd>
<dt>Kategorie</dt><dd id="loraSumClass">–</dd>
<dt>Bilder</dt><dd id="loraSumImages">–</dd>
</dl>
</div>
<details class="details">
<summary>Erweiterte Trainings-Einstellungen</summary>
<div class="form-row">
<div class="form-group">
<label for="loraTrainingSteps">Trainingsschritte</label>
<input type="number" id="loraTrainingSteps" min="200" max="5000" value="1000" step="100" />
<small class="hint">Mehr Schritte = besser gelernt, aber dauert länger.</small>
</div>
<div class="form-group">
<label for="loraLearningRate">Lernrate</label>
<input type="number" id="loraLearningRate" min="0.00001" max="0.001" step="0.00001" value="0.0001" />
</div>
</div>
</details>
<div class="button-row">
<button class="secondary" id="loraBack3">Zurück</button>
<button class="primary" id="loraStartBtn">
<span>Training starten</span>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>
</button>
</div>
<!-- Training progress -->
<div class="lora-training-progress" id="loraTrainingProgress" hidden>
<h3>Training läuft…</h3>
<div class="progress-bar-wrap">
<div class="progress-bar" id="loraProgressBar" style="width: 0%"></div>
</div>
<p class="lora-progress-text" id="loraProgressText">Wird vorbereitet…</p>
<small class="muted">Das Training kann 10–30 Minuten dauern. Du kannst diese Seite geöffnet lassen.</small>
</div>
<!-- Training complete -->
<div class="lora-complete" id="loraComplete" hidden>
<div class="lora-complete-icon">
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="var(--accent)" stroke-width="2"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
</div>
<h3>Training abgeschlossen!</h3>
<p>Dein LoRA ist jetzt verfügbar. Nutze das Trigger-Wort <code id="loraCompleteTrigger"></code> in deiner Beschreibung unter „Bild erstellen".</p>
<button class="primary" id="loraGoToGenerate">Jetzt Bild erstellen</button>
</div>
</div>
</section>
<!-- Existing LoRAs -->
<section class="panel" id="loraListSection">
<h2>Trainierte Modelle</h2>
<div id="loraList" class="lora-list">
<p class="placeholder">Noch keine LoRAs trainiert.</p>
</div>
</section>
</div>
</div>
</main>
</div>
</body>
</html>
exec
/bin/bash -lc 'tail -n 90 music.html' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<option value="blues">Blues</option>
</select>
</div>
<div>
<label for="wizardMood">Stimmung</label>
<select id="wizardMood">
<option value="energetic, upbeat">energetisch</option>
<option value="chill, smooth">chill / smooth</option>
<option value="dark, atmospheric">dark / atmospheric</option>
<option value="euphoric, uplifting">euphorisch</option>
<option value="romantic, sultry">romantisch</option>
<option value="melancholic, dreamy">melancholisch</option>
<option value="aggressive, intense">aggressiv</option>
<option value="happy, cheerful">fröhlich</option>
<option value="elegant, emotive">elegant</option>
<option value="groovy, vibrant">groovy</option>
<option value="dramatic, powerful">dramatisch</option>
<option value="soulful, heartfelt">soulful</option>
</select>
</div>
<div>
<label for="wizardTempo">Tempo</label>
<select id="wizardTempo">
<option value="60 bpm">60 BPM – Largo</option>
<option value="80 bpm">80 BPM – Langsam</option>
<option value="90 bpm">90 BPM – Gemäßigt</option>
<option value="100 bpm">100 BPM – Mittel</option>
<option value="110 bpm">110 BPM – Flott</option>
<option value="120 bpm">120 BPM – Pop</option>
<option value="128 bpm">128 BPM – Dance</option>
<option value="140 bpm">140 BPM – Schnell</option>
<option value="160 bpm">160 BPM – Sehr schnell</option>
</select>
</div>
<div>
<label for="wizardVocals">Vocals</label>
<select id="wizardVocals">
<option value="instrumental">Instrumental</option>
<option value="female vocals, polished vocals">Weiblich – poliert</option>
<option value="female vocals, silky vocals">Weiblich – seidig</option>
<option value="male vocals, raw vocals">Männlich – rau</option>
<option value="male vocals, smooth vocals">Männlich – smooth</option>
<option value="male vocals, crooning vocals">Männlich – Crooner</option>
<option value="rhythmic vocals">Rap / rhythmisch</option>
<option value="screamed vocals">Screaming</option>
<option value="choir">Chor</option>
</select>
</div>
</div>
<div id="wizardInstruments" style="margin-top:0.6rem; display:flex; flex-wrap:wrap; gap:0.4rem;">
<span style="width:100%; font-weight:600;">Instrumente (mehrere wählbar)</span>
<button type="button" class="chip-select" data-val="piano">Piano</button>
<button type="button" class="chip-select" data-val="acoustic guitar">Akustikgitarre</button>
<button type="button" class="chip-select" data-val="electric guitar">E‑Gitarre</button>
<button type="button" class="chip-select" data-val="bass">Bass</button>
<button type="button" class="chip-select" data-val="drums">Drums</button>
<button type="button" class="chip-select" data-val="synthesizer">Synthesizer</button>
<button type="button" class="chip-select" data-val="keyboard">Keyboard</button>
<button type="button" class="chip-select" data-val="strings">Streicher</button>
<button type="button" class="chip-select" data-val="saxophone">Saxophon</button>
<button type="button" class="chip-select" data-val="fiddle">Geige / Fiddle</button>
<button type="button" class="chip-select" data-val="steel guitar">Steel Guitar</button>
<button type="button" class="chip-select" data-val="808 bass">808</button>
<button type="button" class="chip-select" data-val="hi-hats">Hi‑Hats</button>
<button type="button" class="chip-select" data-val="percussion">Percussion</button>
<button type="button" class="chip-select" data-val="brass">Blechbläser</button>
<button type="button" class="chip-select" data-val="flute">Flöte</button>
<button type="button" class="chip-select" data-val="choir">Chor</button>
</div>
<div style="display:flex; gap:0.5rem; justify-content:flex-end; margin-top:0.8rem;">
<button type="button" id="applyWizard" class="primary">Prompt zusammenstellen</button>
<button type="button" id="closeHelpModalFooter" class="ghost">Schließen</button>
</div>
</section>
<section style="border-top:1px solid var(--border); padding-top:0.8rem;">
<h4 style="margin:0 0 0.3rem;">Tipps</h4>
<ul style="margin:0; padding-left:1.2rem; color:var(--muted); font-size:0.88rem; line-height:1.6;">
<li><strong>Englische Tags</strong> funktionieren am besten (das Modell wurde überwiegend mit englischen Daten trainiert).</li>
<li>Kombiniere Genre + Instrumente + BPM + Stimmung + Vocals für die besten Ergebnisse.</li>
<li>Für <strong>Instrumentalmusik</strong> nutze den Tag „instrumental" oder lasse die Lyrics leer.</li>
<li><strong>Lyrics-Struktur</strong>: Verwende [verse], [chorus], [bridge], [pre-chorus], [outro] in deinen Lyrics.</li>
<li>Ergebnisse variieren je nach Seed – probiere mehrere Generierungen für dasselbe Prompt.</li>
</ul>
</section>
</div>
</div>
</div>
</div>
</body>
</html>
exec
/bin/bash -lc "sed -n '1,260p' assets/styles.css" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
:root {
font-size: 16px;
--radius-sm: 0.9rem;
--radius-md: 1.2rem;
--radius-lg: 1.6rem;
--radius-pill: 999px;
--shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
--shadow-soft: 0 16px 45px rgba(0, 0, 0, 0.28);
--ok: #2dd4bf;
--danger: #ff6b6b;
--warning: #fbbf24;
/* Default theme (dark) – works even if JS is disabled */
--bg: #070814;
--bg2: #0c1024;
--panel: rgba(255, 255, 255, 0.04);
--panel-strong: rgba(255, 255, 255, 0.06);
--border: rgba(255, 255, 255, 0.10);
--text: #f8fafc;
--muted: rgba(248, 250, 252, 0.72);
--accent: #8b5cf6;
--accent2: #22c55e;
--ring: rgba(139, 92, 246, 0.55);
}
html[data-theme='light'] {
--bg: #f6f7fb;
--bg2: #ffffff;
--panel: rgba(15, 23, 42, 0.04);
--panel-strong: rgba(15, 23, 42, 0.06);
--border: rgba(15, 23, 42, 0.12);
--text: #0b1220;
--muted: rgba(11, 18, 32, 0.72);
--accent: #6d28d9;
--accent2: #16a34a;
--ring: rgba(109, 40, 217, 0.35);
}
html[data-theme='dark'] {
--bg: #070814;
--bg2: #0c1024;
--panel: rgba(255, 255, 255, 0.04);
--panel-strong: rgba(255, 255, 255, 0.06);
--border: rgba(255, 255, 255, 0.10);
--text: #f8fafc;
--muted: rgba(248, 250, 252, 0.72);
--accent: #8b5cf6;
--accent2: #22c55e;
--ring: rgba(139, 92, 246, 0.55);
}
* {
box-sizing: border-box;
}
html,
body {
height: 100%;
}
body {
margin: 0;
font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
line-height: 1.55;
letter-spacing: -0.01em;
background:
radial-gradient(900px 600px at 16% 0%, rgba(139, 92, 246, 0.18), transparent 55%),
radial-gradient(900px 600px at 82% 16%, rgba(34, 197, 94, 0.14), transparent 55%),
linear-gradient(180deg, var(--bg2) 0%, var(--bg) 100%);
color: var(--text);
min-height: 100vh;
}
.page {
max-width: 1180px;
margin: 0 auto;
padding: 3rem 1.5rem 4rem;
display: flex;
flex-direction: column;
gap: 2rem;
}
.site-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1.5rem;
}
.header-actions {
display: flex;
align-items: center;
gap: 0.75rem;
flex-wrap: wrap;
justify-content: flex-end;
}
.brand {
display: flex;
align-items: center;
gap: 1rem;
}
.brand h1 {
margin: 0;
font-size: 1.65rem;
letter-spacing: -0.02em;
}
.brand p {
margin: 0.2rem 0 0;
color: var(--muted);
}
.logo {
width: 3.5rem;
height: 3.5rem;
border-radius: var(--radius-md);
background: linear-gradient(135deg, var(--accent), var(--accent2));
display: grid;
place-items: center;
font-weight: 600;
letter-spacing: 0.05em;
color: #0a0c14;
}
.status-pill {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0.55rem 0.9rem;
border-radius: var(--radius-pill);
border: 1px solid var(--border);
background: var(--panel);
font-size: 0.9rem;
color: var(--muted);
backdrop-filter: blur(10px);
}
.status-pill .dot {
width: 0.55rem;
height: 0.55rem;
border-radius: var(--radius-pill);
background: var(--muted);
display: inline-block;
}
.icon-button {
width: 2.5rem;
height: 2.5rem;
display: grid;
place-items: center;
border-radius: var(--radius-pill);
border: 1px solid var(--border);
background: var(--panel);
color: var(--text);
cursor: pointer;
transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}
.icon-button:hover {
transform: translateY(-1px);
background: var(--panel-strong);
border-color: rgba(139, 92, 246, 0.35);
}
.icon-button .icon {
display: none;
}
.icon-button .icon-sun {
display: block;
}
html[data-theme='light'] .icon-button .icon-moon {
display: block;
}
html[data-theme='light'] .icon-button .icon-sun {
display: none;
}
.layout {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 1.5rem;
}
.main {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.hero {
border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
border-radius: var(--radius-lg);
background:
radial-gradient(800px 520px at 10% 10%, rgba(139, 92, 246, 0.18), transparent 55%),
radial-gradient(800px 520px at 90% 20%, rgba(34, 197, 94, 0.14), transparent 55%),
var(--panel);
box-shadow: var(--shadow-soft);
backdrop-filter: blur(12px);
padding: 2rem;
}
.hero-grid {
display: grid;
grid-template-columns: 1.2fr 1fr;
gap: 1.5rem;
align-items: start;
}
.hero-title {
margin: 0.85rem 0 0.4rem;
font-size: clamp(1.6rem, 2.2vw, 2.2rem);
letter-spacing: -0.03em;
line-height: 1.15;
}
.hero-subtitle {
margin: 0 0 1.2rem;
color: var(--muted);
font-size: 1.05rem;
max-width: 60ch;
}
.hero-actions {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
align-items: center;
}
.hero-note {
margin: 0.9rem 0 0;
}
.badges {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.badge {
exec
/bin/bash -lc 'tail -n 90 video-studio.html' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<div class="form-group">
<label for="motionInput">Motion-Strength</label>
<input id="motionInput" type="number" min="0" max="1" step="0.05" value="0.2" />
</div>
<div class="form-group">
<label for="seedStrategy">Seed-Strategie</label>
<select id="seedStrategy">
<option value="per-character" selected>Fix pro Charakter</option>
<option value="per-shot">Variieren pro Shot</option>
</select>
</div>
</div>
<div class="checkbox-row">
<input type="checkbox" id="fixedSchedule" checked />
<label for="fixedSchedule">Noise-Schedule fixieren (mehr Stabilität)</label>
</div>
<div class="checkbox-row">
<input type="checkbox" id="lockPrompt" checked />
<label for="lockPrompt">Prompt-Kern innerhalb eines Shots nicht ändern</label>
</div>
<div class="checkbox-row">
<input type="checkbox" id="opticalFlow" checked />
<label for="opticalFlow">Optical-Flow-Step nutzen (falls verfügbar)</label>
</div>
<h3 class="panel-subtitle">Kontinuität</h3>
<div class="checkbox-row">
<input type="checkbox" id="useLastFrame" checked />
<label for="useLastFrame">Letztes Frame als Referenz für den nächsten Shot</label>
</div>
<div class="checkbox-row">
<input type="checkbox" id="softReference" checked />
<label for="softReference">Weiche Referenz (kein hartes Init-Bild)</label>
</div>
<div class="checkbox-row">
<input type="checkbox" id="noHardInit" checked />
<label for="noHardInit">Hard-Init vermeiden (verhindert eingefrorene Bewegung)</label>
</div>
<div class="checkbox-row">
<input type="checkbox" id="costumeLock" checked />
<label for="costumeLock">Kleidung und Farbpalette locken</label>
</div>
<div class="form-row">
<div class="form-group">
<label for="interpolationEnabled">Interpolation nach dem Schnitt</label>
<select id="interpolationEnabled">
<option value="true" selected>Aktiv</option>
<option value="false">Aus</option>
</select>
</div>
<div class="form-group">
<label for="targetFps">Ziel-FPS</label>
<input id="targetFps" type="number" min="12" max="60" step="1" value="24" />
</div>
<div class="form-group">
<label for="interpMethod">Methode</label>
<select id="interpMethod">
<option value="optical-flow" selected>Optical Flow</option>
<option value="rife">RIFE</option>
<option value="film">FILM</option>
</select>
</div>
</div>
</details>
<details class="details details--compact">
<summary>Technischen Export anzeigen</summary>
<div class="form-group">
<label for="jsonOutput">Shotlist JSON</label>
<textarea id="jsonOutput" class="code-output" readonly></textarea>
</div>
<div class="form-group">
<label>Empfohlene Ordnerstruktur</label>
<pre class="code-block" id="folderStructure"></pre>
</div>
</details>
</div>
<div class="wizard-actions">
<button class="ghost" type="button" data-action="prev">Zurück</button>
</div>
</section>
</div>
</main>
</div>
</body>
</html>
exec
/bin/bash -lc "sed -n '1,240p' config/gpuq-client.php && sed -n '1,320p' service/gpuq-proxy.php" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<?php
return [
// Local GPUQ API service
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
'https://kiwerkzeuge.de/service/',
'https://www.kiwerkzeuge.de/service/',
'http://kiwerkzeuge.de/service/',
'http://www.kiwerkzeuge.de/service/',
'http://127.0.0.1/service/',
'http://localhost/service/',
'http://127.0.0.1:18080/service/',
'http://localhost:18080/service/',
'http://127.0.0.1:18080/creator-studio/api/review/',
'http://localhost:18080/creator-studio/api/review/',
],
];
<?php
declare(strict_types=1);
header('Content-Type: application/json');
$configPath = __DIR__ . '/../config/gpuq-client.php';
if (!file_exists($configPath)) {
http_response_code(500);
echo json_encode(['ok' => false, 'message' => 'Missing config/gpuq-client.php']);
exit;
}
$config = require $configPath;
$serviceUrl = rtrim((string)($config['service_url'] ?? ''), '/');
$timeout = (int)($config['timeout'] ?? 60);
$streamTimeout = (int)($config['stream_timeout'] ?? 0);
if ($serviceUrl === '') {
http_response_code(500);
echo json_encode(['ok' => false, 'message' => 'gpuq service_url is empty']);
exit;
}
$action = (string)($_GET['action'] ?? $_POST['action'] ?? '');
$method = $_SERVER['REQUEST_METHOD'] ?? 'GET';
if ($action === 'stream_queue') {
stream_passthrough($serviceUrl . '/api/v1/stream/queue', $streamTimeout);
}
if ($action === 'stream_job') {
$jobId = trim((string)($_GET['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
stream_passthrough($serviceUrl . '/api/v1/stream/jobs/' . rawurlencode($jobId), $streamTimeout);
}
switch ($action) {
case 'health':
echo http_get_json($serviceUrl . '/api/v1/health', $timeout);
exit;
case 'submit':
ensure_method('POST', $method);
$payload = read_json_body();
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'execute_url is required']);
exit;
}
$allowedPrefixes = array_values(array_filter(array_map('strval', (array)($config['allowed_execute_prefixes'] ?? []))));
if (!is_allowed_execute_url($executeUrl, $allowedPrefixes)) {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'execute_url is not allowed']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs', $payload, $timeout);
exit;
case 'status':
$jobId = trim((string)($_GET['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_get_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId), $timeout);
exit;
case 'cancel':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/cancel', [], $timeout);
exit;
case 'kill':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/kill', [], $timeout);
exit;
case 'priority':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
$priority = trim((string)($body['priority'] ?? ''));
if ($jobId === '' || $priority === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id and priority are required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/priority', ['priority' => $priority], $timeout);
exit;
case 'admin_queue':
echo http_get_json($serviceUrl . '/api/v1/admin/queue', $timeout);
exit;
case 'admin_history':
$limit = max(1, min(200, (int)($_GET['limit'] ?? 20)));
echo http_get_json($serviceUrl . '/api/v1/admin/history?limit=' . $limit, $timeout);
exit;
default:
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'Unknown action']);
exit;
}
function ensure_method(string $expected, string $actual): void
{
if (strtoupper($actual) !== strtoupper($expected)) {
http_response_code(405);
echo json_encode(['ok' => false, 'message' => 'Method not allowed']);
exit;
}
}
function read_json_body(): array
{
$raw = file_get_contents('php://input') ?: '';
if ($raw === '') return [];
$data = json_decode($raw, true);
return is_array($data) ? $data : [];
}
function http_get_json(string $url, int $timeout): string
{
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_TIMEOUT, max(1, $timeout));
curl_setopt($ch, CURLOPT_HTTPHEADER, ['Accept: application/json']);
$response = curl_exec($ch);
if ($response === false) {
http_response_code(502);
return json_encode(['ok' => false, 'message' => 'GPUQ unreachable: ' . curl_error($ch)]);
}
$status = (int)curl_getinfo($ch, CURLINFO_HTTP_CODE);
if ($status >= 400) {
http_response_code($status);
}
return (string)$response;
}
function http_post_json(string $url, array $payload, int $timeout): string
{
$body = json_encode($payload);
if ($body === false) {
http_response_code(500);
return json_encode(['ok' => false, 'message' => 'JSON encoding failed']);
}
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, $body);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_TIMEOUT, max(1, $timeout));
curl_setopt($ch, CURLOPT_HTTPHEADER, ['Accept: application/json', 'Content-Type: application/json']);
$response = curl_exec($ch);
if ($response === false) {
http_response_code(502);
return json_encode(['ok' => false, 'message' => 'GPUQ unreachable: ' . curl_error($ch)]);
}
$status = (int)curl_getinfo($ch, CURLINFO_HTTP_CODE);
if ($status >= 400) {
http_response_code($status);
}
return (string)$response;
}
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache, no-transform');
header('X-Accel-Buffering: no');
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, false);
curl_setopt($ch, CURLOPT_TIMEOUT, max(0, $timeout));
curl_setopt($ch, CURLOPT_HTTPHEADER, ['Accept: text/event-stream']);
curl_setopt($ch, CURLOPT_WRITEFUNCTION, static function ($ch, $data) {
echo $data;
@ob_flush();
flush();
return strlen($data);
});
$ok = curl_exec($ch);
if ($ok === false) {
echo "event: error\n";
echo 'data: ' . json_encode(['ok' => false, 'message' => curl_error($ch)]) . "\n\n";
@ob_flush();
flush();
}
exit;
}
function is_allowed_execute_url(string $url, array $allowedPrefixes): bool
{
if ($url === '') return false;
if (empty($allowedPrefixes)) return false;
foreach ($allowedPrefixes as $prefix) {
if ($prefix !== '' && str_starts_with($url, $prefix)) {
return true;
}
}
return false;
}
exec
/bin/bash -lc 'rg -n "nav-tabs|nav-tab|primary|secondary|ghost|feature-card|details|form-group|@media" assets/styles.css' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
270:.secondary {
285:.secondary:hover {
297:.feature-card {
304:.feature-card h3 {
310:.feature-card p {
405:.primary {
420:.primary:hover {
425:.primary:disabled {
430:.ghost {
441:.ghost:hover {
446:.ghost--icon {
455:.ghost--icon.is-active {
460:.ghost:disabled {
571:.nav-tabs {
579:.nav-tab {
587:.nav-tab:hover {
591:.nav-tab.active {
596:.form-group {
603:.form-group label {
609:.form-group textarea,
610:.form-group input[type="number"],
611:.form-group select {
622:.form-group textarea:focus,
623:.form-group input[type="number"]:focus,
624:.form-group select:focus {
630:.form-group textarea {
641:.details {
649:.details summary {
655:.details[open] summary {
908:.details--compact {
914:.details--compact summary {
1203:.shot-details {
1242:.shot-list--compact .shot-details,
1410:.primary {
1475:@media (prefers-reduced-motion: reduce) {
1483:@media (prefers-color-scheme: light) {
1498:@media (max-width: 980px) {
1513:@media (max-width: 720px) {
exec
/bin/bash -lc "sed -n '240,520p' assets/styles.css" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
max-width: 60ch;
}
.hero-actions {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
align-items: center;
}
.hero-note {
margin: 0.9rem 0 0;
}
.badges {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.badge {
border: 1px solid var(--border);
background: var(--panel);
padding: 0.35rem 0.65rem;
border-radius: var(--radius-pill);
color: var(--muted);
font-size: 0.85rem;
backdrop-filter: blur(10px);
}
.secondary {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.9rem 1.05rem;
border-radius: var(--radius-sm);
border: 1px solid var(--border);
background: var(--panel);
color: var(--text);
cursor: pointer;
text-decoration: none;
font-weight: 600;
transition: transform 0.15s ease, background 0.2s ease, border-color 0.2s ease;
}
.secondary:hover {
transform: translateY(-1px);
background: var(--panel-strong);
border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
}
.feature-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.9rem;
}
.feature-card {
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: rgba(255, 255, 255, 0.02);
padding: 1rem;
}
.feature-card h3 {
margin: 0 0 0.35rem;
font-size: 1rem;
letter-spacing: -0.02em;
}
.feature-card p {
margin: 0;
color: var(--muted);
font-size: 0.95rem;
}
@supports not (background: color-mix(in srgb, white 50%, black)) {
.hero {
border: 1px solid var(--border);
}
}
.panel {
padding: 1.75rem;
border-radius: var(--radius-lg);
border: 1px solid var(--border);
background: var(--panel);
box-shadow: var(--shadow-soft);
backdrop-filter: blur(10px);
}
.panel.info {
background: var(--panel-strong);
}
.panel h2 {
margin-top: 0;
margin-bottom: 0.6rem;
letter-spacing: -0.02em;
}
.panel p,
.panel small,
.panel li {
color: var(--muted);
}
.dropzone {
margin-top: 1rem;
display: block;
border: 1.5px dashed rgba(139, 92, 246, 0.35);
border-radius: var(--radius-md);
padding: 2.5rem 1.25rem;
background: rgba(255, 255, 255, 0.02);
cursor: pointer;
transition: border-color 0.2s ease, background 0.2s ease;
}
.dropzone:hover {
border-color: rgba(139, 92, 246, 0.6);
background: rgba(139, 92, 246, 0.05);
}
.dropzone.dragover {
border-color: var(--accent);
background: rgba(139, 92, 246, 0.10);
}
.dropzone__content {
text-align: center;
color: var(--muted);
display: flex;
flex-direction: column;
align-items: center;
gap: 0.4rem;
}
.dropzone__content span {
color: var(--accent);
font-weight: 600;
}
.toggles {
margin: 1.25rem 0 1.5rem;
display: flex;
flex-wrap: wrap;
gap: 0.75rem 1rem;
}
.toggles label {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.9rem;
border-radius: var(--radius-pill);
background: var(--panel);
border: 1px solid transparent;
cursor: pointer;
transition: border-color 0.2s ease;
}
.toggles input[type='checkbox'] {
accent-color: var(--accent);
}
.primary {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.9rem 1.2rem;
border-radius: var(--radius-sm);
border: none;
background: linear-gradient(135deg, var(--accent), var(--accent2));
color: #0a0c14;
font-weight: 600;
font-size: 1rem;
cursor: pointer;
transition: transform 0.15s ease, opacity 0.2s ease, filter 0.2s ease;
}
.primary:hover {
transform: translateY(-1px);
filter: saturate(1.08);
}
.primary:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.ghost {
background: var(--panel);
border: 1px solid var(--border);
border-radius: 0.8rem;
color: var(--text);
padding: 0.4rem 0.8rem;
cursor: pointer;
font-size: 0.85rem;
transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease;
}
.ghost:hover {
background: var(--panel-strong);
transform: translateY(-1px);
}
.ghost--icon {
width: 2.15rem;
height: 2.15rem;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
}
.ghost--icon.is-active {
border-color: var(--accent);
background: color-mix(in srgb, var(--accent) 16%, var(--panel));
}
.ghost:disabled {
opacity: 0.4;
cursor: not-allowed;
}
.progress {
margin-top: 1.5rem;
padding: 0.85rem 1rem;
border-radius: var(--radius-md);
border: 1px solid var(--border);
background: var(--panel);
display: flex;
align-items: center;
gap: 0.85rem;
}
.progress[hidden] {
display: none;
}
.spinner {
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
border: 3px solid rgba(255, 255, 255, 0.12);
border-top-color: var(--accent);
animation: spin 1s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
.results-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 1rem;
}
.result-card {
border: 1px solid var(--border);
border-radius: var(--radius-md);
padding: 1rem;
background: rgba(255, 255, 255, 0.02);
display: flex;
flex-direction: column;
gap: 0.8rem;
}
.result-card header {
display: flex;
justify-content: space-between;
gap: 0.6rem;
align-items: center;
}
.result-preview {
min-height: 240px;
background: rgba(0, 0, 0, 0.22);
exec
/bin/bash -lc "sed -n '520,920p' assets/styles.css" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
background: rgba(0, 0, 0, 0.22);
border-radius: var(--radius-md);
border: 1px dashed rgba(139, 92, 246, 0.28);
display: grid;
place-items: center;
overflow: hidden;
position: relative;
}
.result-preview canvas,
.result-preview img,
.result-preview video {
width: 100%;
height: 100%;
object-fit: contain;
}
.placeholder {
margin: 0;
padding: 0 1.5rem;
text-align: center;
color: var(--muted);
}
.controls label {
display: flex;
flex-direction: column;
font-size: 0.9rem;
gap: 0.3rem;
color: var(--muted);
}
.controls input[type='range'] {
accent-color: var(--accent);
}
.info ol {
padding-left: 1.2rem;
line-height: 1.7;
}
.info code {
background: rgba(255, 255, 255, 0.08);
padding: 0.15rem 0.35rem;
border-radius: 0.4rem;
}
.muted {
color: var(--muted);
}
.nav-tabs {
display: flex;
gap: 0.5rem;
padding: 0;
margin: -1rem 0 1rem;
border-bottom: 1px solid var(--border);
}
.nav-tab {
padding: 0.75rem 1.25rem;
color: var(--muted);
text-decoration: none;
border-bottom: 2px solid transparent;
transition: color 0.2s ease, border-color 0.2s ease;
}
.nav-tab:hover {
color: var(--text);
}
.nav-tab.active {
color: var(--accent);
border-bottom-color: var(--accent);
}
.form-group {
display: flex;
flex-direction: column;
gap: 0.4rem;
margin-bottom: 1rem;
}
.form-group label {
font-size: 0.9rem;
color: var(--muted);
font-weight: 500;
}
.form-group textarea,
.form-group input[type="number"],
.form-group select {
padding: 0.7rem 0.9rem;
border-radius: 0.8rem;
border: 1px solid var(--border);
background: var(--panel);
color: var(--text);
font-family: inherit;
font-size: 0.95rem;
transition: border-color 0.2s ease, background 0.2s ease;
}
.form-group textarea:focus,
.form-group input[type="number"]:focus,
.form-group select:focus {
outline: none;
border-color: var(--accent);
background: var(--panel-strong);
}
.form-group textarea {
resize: vertical;
min-height: 80px;
}
.form-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 1rem;
}
.details {
margin-top: 1rem;
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: rgba(255, 255, 255, 0.02);
padding: 0.9rem 1rem;
}
.details summary {
cursor: pointer;
color: var(--text);
font-weight: 600;
}
.details[open] summary {
margin-bottom: 0.75rem;
}
.hint {
margin: 0.2rem 0 0;
color: var(--muted);
font-size: 0.92rem;
}
.callout {
margin: 1rem 0;
border: 1px solid var(--border);
border-radius: var(--radius-md);
padding: 0.85rem 1rem;
background: rgba(255, 255, 255, 0.02);
color: var(--text);
}
.callout a {
color: var(--accent);
}
.callout ul {
margin: 0.6rem 0 0;
padding-left: 1.2rem;
color: var(--muted);
}
.callout--warning {
border-color: color-mix(in srgb, var(--warning) 55%, var(--border));
}
.stepper {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin: -0.5rem 0 0.5rem;
}
.stepper__item {
padding: 0.45rem 0.85rem;
border-radius: var(--radius-pill);
border: 1px solid var(--border);
background: var(--panel);
color: var(--muted);
text-decoration: none;
font-size: 0.85rem;
font-weight: 600;
font-family: inherit;
cursor: pointer;
transition: transform 0.15s ease, border-color 0.2s ease, color 0.2s ease;
}
.stepper__item.is-disabled {
opacity: 0.5;
cursor: not-allowed;
pointer-events: none;
}
.stepper__item:hover {
color: var(--text);
border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
transform: translateY(-1px);
}
.stepper__item.is-active {
color: var(--text);
border-color: var(--accent);
background: color-mix(in srgb, var(--accent) 16%, var(--panel));
}
.wizard {
display: flex;
flex-direction: column;
gap: 1.5rem;
flex: 1;
min-height: 0;
}
.wizard-step {
display: none;
flex: 1;
min-height: 0;
}
.wizard-step.is-active {
display: flex;
flex-direction: column;
}
.wizard-step__body {
flex: 1;
min-height: 0;
overflow: auto;
padding-right: 0.25rem;
}
.wizard-actions {
margin-top: 1.5rem;
display: flex;
gap: 0.8rem;
align-items: center;
justify-content: space-between;
}
.wizard-actions--end {
justify-content: flex-end;
}
.video-page .hero-grid {
grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
}
.video-page {
min-height: 100vh;
overflow: hidden;
padding: 1.5rem 1.5rem 1.5rem;
gap: 1.2rem;
}
.video-page .main {
flex: 1;
min-height: 0;
overflow: hidden;
gap: 1rem;
display: flex;
flex-direction: column;
}
.video-hero {
padding: 1.2rem;
}
.intro-panel {
min-height: 0;
overflow: auto;
display: flex;
flex-direction: column;
gap: 0.8rem;
padding-right: 0.35rem;
}
.intro-panel .hero-grid {
grid-template-columns: 1fr;
}
.intro-panel .video-hero {
padding: 1rem;
}
.intro-panel .quick-card {
padding: 0.85rem;
gap: 0.4rem;
}
.intro-panel .quick-steps {
margin: 0.35rem 0 0.25rem;
}
.intro-panel .quick-note {
display: none;
}
.video-page .hero-title {
font-size: clamp(1.35rem, 2vw, 1.85rem);
}
.video-page .hero-subtitle {
font-size: 0.98rem;
}
.video-page .hero-actions {
gap: 0.5rem;
}
.hero-quick {
display: flex;
align-items: stretch;
}
.quick-card {
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: rgba(255, 255, 255, 0.03);
padding: 1rem;
width: 100%;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.quick-card h3 {
margin: 0;
font-size: 1.05rem;
}
.quick-steps {
margin: 0.5rem 0 0.4rem;
padding-left: 1.1rem;
color: var(--muted);
}
.quick-steps li {
margin: 0 0 0.35rem;
}
.quick-note {
margin: 0.2rem 0 0;
font-size: 0.9rem;
}
.panel-header {
display: flex;
justify-content: space-between;
gap: 1rem;
align-items: flex-start;
flex-wrap: wrap;
}
.pill-row {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
}
.pill {
border: 1px solid var(--border);
border-radius: var(--radius-pill);
padding: 0.25rem 0.6rem;
font-size: 0.78rem;
color: var(--muted);
background: rgba(255, 255, 255, 0.04);
}
.button-row {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
margin-top: 0.6rem;
}
.simple-steps {
margin: 0.6rem 0 0;
padding-left: 1.2rem;
color: var(--muted);
line-height: 1.6;
}
.simple-steps li {
margin: 0.3rem 0;
}
.details--compact {
margin-top: 0.6rem;
padding: 0.6rem 0.85rem;
background: rgba(255, 255, 255, 0.02);
}
.details--compact summary {
font-size: 0.92rem;
}
.essentials-panel {
border: 1px dashed var(--border);
border-radius: var(--radius-md);
exec
/bin/bash -lc 'tail -n 120 assets/styles.css' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
}
.progress-bar {
height: 100%;
background: var(--accent);
border-radius: 4px;
transition: width 0.5s ease;
}
.lora-progress-text {
font-size: 0.85rem;
color: var(--muted);
}
/* LoRA complete */
.lora-complete {
text-align: center;
padding: 2rem 1rem;
margin-top: 1.5rem;
}
.lora-complete-icon {
margin-bottom: 1rem;
}
.lora-complete h3 {
font-size: 1.2rem;
margin-bottom: 0.5rem;
}
.lora-complete p {
color: var(--muted);
margin-bottom: 1.25rem;
}
.lora-complete code {
background: var(--bg-card);
padding: 0.15em 0.4em;
border-radius: 4px;
font-size: 0.9em;
border: 1px solid var(--border);
}
/* LoRA Chips (for txt2img selection) */
.lora-chips {
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
}
.lora-chip {
display: inline-flex;
align-items: center;
padding: 0.3rem 0.75rem;
border: 1px solid var(--border);
border-radius: 999px;
background: var(--bg-card);
color: var(--fg);
font-size: 0.8rem;
cursor: pointer;
transition: all 0.15s;
}
.lora-chip:hover {
border-color: var(--accent);
}
.lora-chip.active {
background: var(--accent);
color: #fff;
border-color: var(--accent);
}
/* LoRA list */
.lora-list {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.lora-list-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem 1rem;
background: var(--bg-card);
border: 1px solid var(--border);
border-radius: var(--radius);
}
.lora-list-info {
display: flex;
flex-direction: column;
gap: 0.2rem;
}
.lora-list-info strong {
font-size: 0.9rem;
}
.lora-list-info small {
color: var(--muted);
font-size: 0.8rem;
}
.lora-list-info code {
background: var(--bg-surface, var(--bg-card));
padding: 0.1em 0.3em;
border-radius: 3px;
font-size: 0.85em;
}
.lora-list-meta {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 0.15rem;
color: var(--muted);
font-size: 0.8rem;
}
exec
/bin/bash -lc "rg -n \"fonts\\.google|fonts\\.gstatic|matomo|Matomo|nav-tabs|<h1|</main>|</body>\" *.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
video-studio.html:10: <link rel="preconnect" href="https://fonts.googleapis.com" />
video-studio.html:11: <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
video-studio.html:12: <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
video-studio.html:23: <h1>Video Studio</h1>
video-studio.html:51: <nav class="nav-tabs">
video-studio.html:415: </main>
video-studio.html:417: </body>
music.html:8: <link rel="preconnect" href="https://fonts.googleapis.com" />
music.html:9: <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
music.html:10: <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
music.html:21: <h1>Musikgenerator</h1>
music.html:49: <nav class="nav-tabs">
music.html:280: </main>
music.html:525: </body>
stable-diffusion.html:8: <link rel="preconnect" href="https://fonts.googleapis.com" />
stable-diffusion.html:9: <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
stable-diffusion.html:10: <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
stable-diffusion.html:21: <h1>Bildgenerator</h1>
stable-diffusion.html:49: <nav class="nav-tabs">
stable-diffusion.html:452: </main>
stable-diffusion.html:454: </body>
index.html:8: <link rel="preconnect" href="https://fonts.googleapis.com" />
index.html:9: <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
index.html:10: <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
index.html:22: <h1>Depth Studio</h1>
index.html:50: <nav class="nav-tabs">
index.html:222: </main>
index.html:224: <!-- Matomo Analytics -->
index.html:231: _paq.push(['setTrackerUrl', u+'matomo.php']);
index.html:234: g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
index.html:237:<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
index.html:238:<!-- End Matomo Code -->
index.html:239:</body>
exec
/bin/bash -lc "sed -n '260,310p' music.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<details class="details" open>
<summary>Wie beschreibe ich am besten, was ich will?</summary>
<p class="muted">
Sei so spezifisch oder vage wie du magst. Gute Prompts enthalten oft: Stil (z.B. Lo-Fi, Orchestral, Electronic), Stimmung (entspannt, energiegeladen, dramatisch) und Instrumente (Piano, Gitarre, Synths).
Beispiel: "Cinematic ambient, dreamy pads, soft piano, chill atmosphere"
</p>
</details>
<details class="details">
<summary>Wie lange dauert die Erstellung?</summary>
<p class="muted">
Je nach Länge und Server-Auslastung meist zwischen 10 und 30 Sekunden. Längere Tracks brauchen natürlich etwas mehr Zeit.
</p>
</details>
<details class="details">
<summary>Darf ich die Musik verwenden?</summary>
<p class="muted">
Ja, die generierten Tracks können frei verwendet werden – auch in kommerziellen Projekten.
</p>
</details>
</section>
</main>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
<header style="display:flex; align-items:center; justify-content:space-between; gap:0.5rem; padding:0.25rem 0.5rem 0.75rem; border-bottom:1px solid var(--border);">
<h3 id="helpTitle" style="margin:0;">Hilfe & Beispiele</h3>
<button id="closeHelpModal" class="ghost">Schließen</button>
</header>
<div class="modal-body" style="max-height:70vh; overflow:auto; padding:0.75rem; display:grid; gap:1rem;">
<section>
<h4 style="margin:0 0 0.3rem;">Fertige Rezepte <small style="font-weight:normal; color:var(--muted);">– Klick setzt den kompletten Prompt</small></h4>
<div class="chips" style="display:flex; flex-wrap:wrap; gap:0.4rem;">
<button type="button" class="keyword-chip recipe-chip" data-recipe="pop, synth, drums, guitar, 120 bpm, upbeat, catchy, vibrant, female vocals, polished vocals">Modern Pop</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="rock, electric guitar, drums, bass, 130 bpm, energetic, rebellious, gritty, male vocals, raw vocals">Classic Rock</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="hip hop, 808 bass, hi-hats, synth, 90 bpm, bold, urban, intense, male vocals, rhythmic vocals">Hip Hop</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="jazz, saxophone, piano, double bass, 110 bpm, smooth, improvisational, soulful, male vocals, crooning vocals">Smooth Jazz</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="edm, synth, bass, kick drum, 128 bpm, euphoric, pulsating, energetic, instrumental">EDM / Dance</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="r&b, synth, bass, drums, 85 bpm, sultry, groovy, romantic, female vocals, silky vocals">Chill R&B</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="classical, orchestral, strings, piano, 60 bpm, elegant, emotive, timeless, instrumental">Klassik / Orchester</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="country, acoustic guitar, steel guitar, fiddle, 100 bpm, heartfelt, rustic, warm, male vocals, twangy vocals">Country</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="metal, electric guitar, double kick drum, bass, 160 bpm, aggressive, intense, heavy, male vocals, screamed vocals">Heavy Metal</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="reggae, guitar, bass, drums, 80 bpm, chill, soulful, positive, male vocals, smooth vocals">Reggae</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="funk, pop, soul, rock, melodic, guitar, drums, bass, keyboard, percussion, 105 bpm, energetic, upbeat, groovy, vibrant, dynamic">Funk / Soul</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="synth-pop, electronic, pop, synthesizer, drums, bass, piano, 128 bpm, energetic, uplifting, modern">Synth‑Pop</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="electronic, house, synthesizer, drums, bass, percussion, fast, energetic, dark, atmospheric">Dark Electronic</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="lo-fi hip hop, piano, vinyl crackle, drums, 75 bpm, chill, dreamy, mellow, instrumental">Lo‑Fi Chill</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="anime, cute female vocals, kawaii pop, j-pop, piano, guitar, synthesizer, fast, happy, cheerful, lighthearted">Anime / J‑Pop</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="country rock, folk rock, southern rock, bluegrass, acoustic guitar, fiddle, 110 bpm, heartfelt, warm">Folk / Bluegrass</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="pop, piano, rap, dark, atmospheric, 90 bpm, male vocals">Dark Pop Rap</button>
<button type="button" class="keyword-chip recipe-chip" data-recipe="cinematic, orchestral, strings, brass, percussion, 70 bpm, epic, dramatic, powerful, instrumental">Filmmusik / Episch</button>
</div>
exec
/bin/bash -lc "sed -n '400,425p' video-studio.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<textarea id="jsonOutput" class="code-output" readonly></textarea>
</div>
<div class="form-group">
<label>Empfohlene Ordnerstruktur</label>
<pre class="code-block" id="folderStructure"></pre>
</div>
</details>
</div>
<div class="wizard-actions">
<button class="ghost" type="button" data-action="prev">Zurück</button>
</div>
</section>
</div>
</main>
</div>
</body>
</html>
exec
/bin/bash -lc "sed -n '440,460p' stable-diffusion.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
</section>
<!-- Existing LoRAs -->
<section class="panel" id="loraListSection">
<h2>Trainierte Modelle</h2>
<div id="loraList" class="lora-list">
<p class="placeholder">Noch keine LoRAs trainiert.</p>
</div>
</section>
</div>
</div>
</main>
</div>
</body>
</html>
codex
Ich kopiere jetzt die bestehende Tiefenkarten-Seite als Basis nach `tiefenkarte.html`; danach ersetze ich die Startseite durch eine reine Landingpage. Die Tool-Seiten bekommen nur die angeforderten, risikoarmen Querschnittsänderungen: lokale Fonts, Navigation, Footer und Matomo.
exec
/bin/bash -lc 'cp index.html tiefenkarte.html' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
codex
Ich erstelle die neuen Inhaltsseiten jetzt als statisches HTML mit vorhandenen Klassen und ergänzenden, kleinen CSS-Helfern. Die JSON-LD-Blöcke schreibe ich bewusst direkt und prüfe sie später maschinell auf gültiges JSON.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/datenschutz.html
/home/kiwerkzeuge.de/staging-build/impressum.html
/home/kiwerkzeuge.de/staging-build/index.html
/home/kiwerkzeuge.de/staging-build/preise.html
/home/kiwerkzeuge.de/staging-build/robots.txt
/home/kiwerkzeuge.de/staging-build/sitemap.xml
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
exec
/bin/bash -lc "sed -n '1,70p' tiefenkarte.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
<meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
<script defer src="/assets/app.js?v=20260212-0915"></script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
<div class="logo">DA</div>
<div>
<h1>Depth Studio</h1>
<p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
</div>
</div>
<div class="header-actions">
<button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
<svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="4"></circle>
<path d="M12 2v2"></path>
<path d="M12 20v2"></path>
<path d="m4.93 4.93 1.41 1.41"></path>
<path d="m17.66 17.66 1.41 1.41"></path>
<path d="M2 12h2"></path>
<path d="M20 12h2"></path>
<path d="m6.34 17.66-1.41 1.41"></path>
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
<div class="status-pill" id="serviceStatus">
<span class="dot"></span>
<span>Status wird geprüft…</span>
</div>
</div>
</header>
<nav class="nav-tabs">
<a href="/" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
</nav>
<main class="main">
<section class="hero">
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
<span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
<span class="badge">PNG/JPG/WebM</span>
</div>
<h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
<p class="hero-subtitle">
Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
</p>
<div class="hero-actions">
exec
/bin/bash -lc 'tail -n 35 tiefenkarte.html' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
</p>
</details>
<details class="details">
<summary>Welche Fotos funktionieren am besten?</summary>
<p class="muted">
Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
</p>
</details>
<details class="details">
<summary>Technische Details (optional)</summary>
<p class="muted">
API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
</p>
</details>
</section>
</main>
</div>
<!-- Matomo Analytics -->
<script>
var _paq = window._paq = window._paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://statsdeluxe.com/statistics/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '149']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->
</body>
</html>
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
codex
Die kopierte Tiefenkarten-Seite bleibt funktional unverändert: keine ID- oder App-Strukturänderungen. Ich ändere dort nur Head-Metadaten, Fonts, Navigation und den gemeinsamen Footer.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/tiefenkarte.html
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
codex
Jetzt vereinheitliche ich die drei bestehenden Werkzeugseiten. Dabei lasse ich die App-spezifischen Markup-IDs und Skriptverweise stehen und fasse nur die gemeinsamen Seitenbestandteile an.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/music.html
/home/kiwerkzeuge.de/staging-build/stable-diffusion.html
/home/kiwerkzeuge.de/staging-build/video-studio.html
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Ich ergänze nun nur Styles am Ende der CSS-Datei, damit bestehende App-Styles nicht überschrieben werden. Die Ergänzungen betreffen Footer, Kartenraster, Preisbereiche, Rechtsseiten und das Prio-Code-Formular.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/assets/styles.css
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Als Nächstes setze ich die Priority-Code-Regel serverseitig um: Client-Priority wird grundsätzlich verworfen und nur über konfigurierte Codes wieder gesetzt. Danach prüfe ich beide PHP-Dateien mit `php -l`.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/config/gpuq-client.php
/home/kiwerkzeuge.de/staging-build/service/gpuq-proxy.php
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
exec
/bin/bash -lc "rg -n \"fonts\\.google|fonts\\.gstatic|nav-tabs|Matomo Analytics|<h1|<script type=\\\"application/ld\\+json\\\"\" *.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
video-studio.html:21: <h1>Video Studio</h1>
video-studio.html:49: <nav class="nav-tabs">
video-studio.html:425: <!-- Matomo Analytics -->
stable-diffusion.html:19: <h1>Bildgenerator</h1>
stable-diffusion.html:47: <nav class="nav-tabs">
stable-diffusion.html:462: <!-- Matomo Analytics -->
tiefenkarte.html:30: <h1>Depth Studio</h1>
tiefenkarte.html:58: <nav class="nav-tabs">
tiefenkarte.html:242: <!-- Matomo Analytics -->
music.html:19: <h1>Musikgenerator</h1>
music.html:47: <nav class="nav-tabs">
music.html:533: <!-- Matomo Analytics -->
preise.html:21: <script type="application/ld+json">
preise.html:99: <h1>Preise</h1>
preise.html:123: <nav class="nav-tabs">
preise.html:267: <!-- Matomo Analytics -->
impressum.html:28: <h1>Impressum</h1>
impressum.html:52: <nav class="nav-tabs">
impressum.html:107: <!-- Matomo Analytics -->
index.html:21: <script type="application/ld+json">
index.html:85: <h1>KI Werkzeuge</h1>
index.html:109: <nav class="nav-tabs">
index.html:251: <!-- Matomo Analytics -->
datenschutz.html:28: <h1>Datenschutzerklärung</h1>
datenschutz.html:52: <nav class="nav-tabs">
datenschutz.html:134: <!-- Matomo Analytics -->
exec
/bin/bash -lc "rg -n \"<footer class=\\\"site-footer\\\"|</main>|</body>\" *.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
video-studio.html:415: </main>
video-studio.html:416: <footer class="site-footer">
video-studio.html:440: </body>
stable-diffusion.html:452: </main>
stable-diffusion.html:453: <footer class="site-footer">
stable-diffusion.html:477: </body>
tiefenkarte.html:232: </main>
tiefenkarte.html:233: <footer class="site-footer">
tiefenkarte.html:257: </body>
preise.html:241: </main>
preise.html:243: <footer class="site-footer">
preise.html:282: </body>
index.html:240: </main>
index.html:242: <footer class="site-footer">
index.html:266: </body>
impressum.html:96: </main>
impressum.html:98: <footer class="site-footer">
impressum.html:122: </body>
music.html:280: </main>
music.html:281: <footer class="site-footer">
music.html:548: </body>
datenschutz.html:123: </main>
datenschutz.html:125: <footer class="site-footer">
datenschutz.html:149: </body>
exec
/bin/bash -lc 'php -l config/gpuq-client.php && php -l service/gpuq-proxy.php' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
No syntax errors detected in config/gpuq-client.php
No syntax errors detected in service/gpuq-proxy.php
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
PHP ist syntaktisch sauber, und der Google-Fonts-Scan findet keine externen Google-Font-Verweise mehr. Ich prüfe jetzt strukturell: JSON-LD, `<h1>`-Anzahl, interne Navigationslinks und Sitemap/Robots.
exec
/bin/bash -lc "python3 - <<'PY'
from pathlib import Path
import json, re, xml.etree.ElementTree as ET
root = Path('.')
html_files = sorted(root.glob('*.html'))
errors = []
for path in html_files:
text = path.read_text(encoding='utf-8')
h1 = len(re.findall(r'<h1\\b', text, flags=re.I))
if h1 "'!= 1:
errors.append(f'"'{path}: expected 1 h1, found {h1}')
if 'https://fonts.googleapis.com' in text or 'https://fonts.gstatic.com' in text:
errors.append(f'{path}: google font reference remains')
if 'Matomo Analytics' not in text:
errors.append(f'{path}: Matomo missing')
for match in re.finditer(r'<script type=\"application/ld\\+json\">(.*?)</script>', text, flags=re.S):
json.loads(match.group(1))
existing_html = {p.name for p in html_files}
existing_assets = {str(p).replace('\\\\', '/') for p in root.rglob('*') if p.is_file()}
for path in html_files:
text = path.read_text(encoding='utf-8')
for href in re.findall(r'\\s(?:href|src)=\"(["'^"]+)"'"', text):
if href.startswith(('http://', 'https://', 'mailto:', 'tel:', '#')):
continue
target = href.split('#', 1)[0].split('?', 1)[0]
if not target:
continue
if target == '/':
target_name = 'index.html'
elif target.startswith('/'):
target_name = target.lstrip('/')
else:
target_name = str((path.parent / target).as_posix())
if target_name.endswith('.html') and target_name not in existing_html:
errors.append(f'{path}: missing html href {href}')
if target_name.startswith('assets/') and target_name not in existing_assets:
errors.append(f'{path}: missing asset {href}')
ET.parse('sitemap.xml')
robots = Path('robots.txt').read_text(encoding='utf-8')
if 'Sitemap: https://kiwerkzeuge.de/sitemap.xml' not in robots:
errors.append('robots.txt: sitemap missing')
if errors:
raise SystemExit('\\n'.join(errors))
print('OK: JSON-LD, h1 counts, fonts, Matomo, html hrefs/assets, sitemap XML, robots sitemap')
PY" in /home/kiwerkzeuge.de/staging-build
exited 1 in 0ms:
music.html: missing asset /assets/music-app.js?v=20260212-0910
stable-diffusion.html: missing asset /assets/sd-app.js?v=20260212-0811
tiefenkarte.html: missing asset /assets/app.js?v=20260212-0915
video-studio.html: missing asset /assets/video-app.js?v=20260227-9
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Der Link-Check hat nur die bewusst nicht mitgelieferten App-JS-Dateien als fehlend gemeldet. Ich wiederhole die Prüfung für sichtbare HTML-/Asset-Links und dokumentiere die JS-Ausnahme im Abschlussbericht.
exec
/bin/bash -lc "python3 - <<'PY'
from pathlib import Path
import json, re, xml.etree.ElementTree as ET
root = Path('.')
html_files = sorted(root.glob('*.html'))
errors = []
for path in html_files:
text = path.read_text(encoding='utf-8')
h1 = len(re.findall(r'<h1\\b', text, flags=re.I))
if h1 "'!= 1:
errors.append(f'"'{path}: expected 1 h1, found {h1}')
if 'https://fonts.googleapis.com' in text or 'https://fonts.gstatic.com' in text:
errors.append(f'{path}: google font reference remains')
if 'Matomo Analytics' not in text:
errors.append(f'{path}: Matomo missing')
for match in re.finditer(r'<script type=\"application/ld\\+json\">(.*?)</script>', text, flags=re.S):
json.loads(match.group(1))
existing_html = {p.name for p in html_files}
existing_assets = {str(p).replace('\\\\', '/') for p in root.rglob('*') if p.is_file()}
for path in html_files:
text = path.read_text(encoding='utf-8')
for attr, href in re.findall(r'\\s(href|src)=\"(["'^"]+)"'"', text):
if href.startswith(('http://', 'https://', 'mailto:', 'tel:', '#')):
continue
if attr == 'src' and href.startswith('/assets/') and href.split('?', 1)[0].endswith('.js'):
continue
target = href.split('#', 1)[0].split('?', 1)[0]
if not target:
continue
if target == '/':
target_name = 'index.html'
elif target.startswith('/'):
target_name = target.lstrip('/')
else:
target_name = str((path.parent / target).as_posix())
if target_name.endswith('.html') and target_name not in existing_html:
errors.append(f'{path}: missing html href {href}')
if target_name.startswith('assets/') and target_name not in existing_assets:
errors.append(f'{path}: missing asset {href}')
ET.parse('sitemap.xml')
robots = Path('robots.txt').read_text(encoding='utf-8')
if 'Sitemap: https://kiwerkzeuge.de/sitemap.xml' not in robots:
errors.append('robots.txt: sitemap missing')
if errors:
raise SystemExit('\\n'.join(errors))
print('OK: JSON-LD, h1 counts, fonts, Matomo, visible html/asset links, sitemap XML, robots sitemap')
PY" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
OK: JSON-LD, h1 counts, fonts, Matomo, visible html/asset links, sitemap XML, robots sitemap
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..d7244f881d121d7ade7ca211bb565771786f9e6e
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,14 @@
+User-agent: *
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/robots.txt
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..e3cd22fdb5e76b4e4c8929aea123cee940117475
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,39 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $code = trim((string)($payload['priority_code'] ?? ''));
+ if ($code === '') {
+ $code = trim((string)($_COOKIE['kiwz_prio'] ?? ''));
+ }
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Ich passe die Priority-Auswertung noch robuster an: Wenn sowohl ein Payload-Code als auch ein Cookie vorhanden ist, reicht ein gültiger von beiden. Ein ungültiger Payload-Code blockiert damit keinen gültigen gespeicherten Browser-Code.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/service/gpuq-proxy.php
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Die zweite PHP-Prüfung läuft jetzt zusammen mit einem finalen Scan der Seiten-Metadaten und Navigationsbestandteile. Danach schreibe ich den geforderten Staging-Bericht.
exec
/bin/bash -lc "sed -n '1,120p' service/gpuq-proxy.php && sed -n '1,40p' config/gpuq-client.php" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
<?php
declare(strict_types=1);
header('Content-Type: application/json');
$configPath = __DIR__ . '/../config/gpuq-client.php';
if (!file_exists($configPath)) {
http_response_code(500);
echo json_encode(['ok' => false, 'message' => 'Missing config/gpuq-client.php']);
exit;
}
$config = require $configPath;
$serviceUrl = rtrim((string)($config['service_url'] ?? ''), '/');
$timeout = (int)($config['timeout'] ?? 60);
$streamTimeout = (int)($config['stream_timeout'] ?? 0);
if ($serviceUrl === '') {
http_response_code(500);
echo json_encode(['ok' => false, 'message' => 'gpuq service_url is empty']);
exit;
}
$action = (string)($_GET['action'] ?? $_POST['action'] ?? '');
$method = $_SERVER['REQUEST_METHOD'] ?? 'GET';
if ($action === 'stream_queue') {
stream_passthrough($serviceUrl . '/api/v1/stream/queue', $streamTimeout);
}
if ($action === 'stream_job') {
$jobId = trim((string)($_GET['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
stream_passthrough($serviceUrl . '/api/v1/stream/jobs/' . rawurlencode($jobId), $streamTimeout);
}
switch ($action) {
case 'health':
echo http_get_json($serviceUrl . '/api/v1/health', $timeout);
exit;
case 'submit':
ensure_method('POST', $method);
$payload = read_json_body();
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'execute_url is required']);
exit;
}
$allowedPrefixes = array_values(array_filter(array_map('strval', (array)($config['allowed_execute_prefixes'] ?? []))));
if (!is_allowed_execute_url($executeUrl, $allowedPrefixes)) {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'execute_url is not allowed']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs', $payload, $timeout);
exit;
case 'status':
$jobId = trim((string)($_GET['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_get_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId), $timeout);
exit;
case 'cancel':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/cancel', [], $timeout);
exit;
case 'kill':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
if ($jobId === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id is required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/kill', [], $timeout);
exit;
case 'priority':
ensure_method('POST', $method);
$body = read_json_body();
$jobId = trim((string)($body['job_id'] ?? ''));
$priority = trim((string)($body['priority'] ?? ''));
if ($jobId === '' || $priority === '') {
http_response_code(400);
echo json_encode(['ok' => false, 'message' => 'job_id and priority are required']);
exit;
}
echo http_post_json($serviceUrl . '/api/v1/jobs/' . rawurlencode($jobId) . '/priority', ['priority' => $priority], $timeout);
exit;
case 'admin_queue':
echo http_get_json($serviceUrl . '/api/v1/admin/queue', $timeout);
exit;
case 'admin_history':
$limit = max(1, min(200, (int)($_GET['limit'] ?? 20)));
<?php
return [
// Local GPUQ API service
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
// Map purchasable priority codes to GPUQ priority levels.
// Example: 'KIWZ-AB2C-DE3F' => 'high'
'priority_codes' => [
],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
'https://kiwerkzeuge.de/service/',
'https://www.kiwerkzeuge.de/service/',
'http://kiwerkzeuge.de/service/',
'http://www.kiwerkzeuge.de/service/',
'http://127.0.0.1/service/',
'http://localhost/service/',
'http://127.0.0.1:18080/service/',
'http://localhost:18080/service/',
'http://127.0.0.1:18080/creator-studio/api/review/',
'http://localhost:18080/creator-studio/api/review/',
],
];
exec
/bin/bash -lc "rg -n \"https://fonts\\.google|fonts\\.gstatic|<link rel=\\\"stylesheet\\\" href=\\\"/assets/fonts/inter\\.css\\\"|<footer class=\\\"site-footer\\\"|Matomo Analytics\" *.html" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
video-studio.html:10: <link rel="stylesheet" href="/assets/fonts/inter.css" />
video-studio.html:416: <footer class="site-footer">
video-studio.html:425: <!-- Matomo Analytics -->
tiefenkarte.html:18: <link rel="stylesheet" href="/assets/fonts/inter.css" />
tiefenkarte.html:233: <footer class="site-footer">
tiefenkarte.html:242: <!-- Matomo Analytics -->
stable-diffusion.html:8: <link rel="stylesheet" href="/assets/fonts/inter.css" />
stable-diffusion.html:453: <footer class="site-footer">
stable-diffusion.html:462: <!-- Matomo Analytics -->
index.html:18: <link rel="stylesheet" href="/assets/fonts/inter.css" />
index.html:242: <footer class="site-footer">
index.html:251: <!-- Matomo Analytics -->
impressum.html:18: <link rel="stylesheet" href="/assets/fonts/inter.css" />
impressum.html:98: <footer class="site-footer">
impressum.html:107: <!-- Matomo Analytics -->
music.html:8: <link rel="stylesheet" href="/assets/fonts/inter.css" />
music.html:281: <footer class="site-footer">
music.html:533: <!-- Matomo Analytics -->
preise.html:18: <link rel="stylesheet" href="/assets/fonts/inter.css" />
preise.html:243: <footer class="site-footer">
preise.html:267: <!-- Matomo Analytics -->
datenschutz.html:18: <link rel="stylesheet" href="/assets/fonts/inter.css" />
datenschutz.html:125: <footer class="site-footer">
datenschutz.html:134: <!-- Matomo Analytics -->
exec
/bin/bash -lc 'php -l config/gpuq-client.php && php -l service/gpuq-proxy.php' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
No syntax errors detected in config/gpuq-client.php
No syntax errors detected in service/gpuq-proxy.php
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Die technischen Prüfungen sind grün. Ich lege jetzt den geforderten `kiwz_frontend_report.md` mit Dateiübersicht, Validierung und offenen Punkten im Staging-Verzeichnis an.
apply patch
patch: completed
/home/kiwerkzeuge.de/staging-build/kiwz_frontend_report.md
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/kiwz_frontend_report.md b/kiwz_frontend_report.md
new file mode 100644
index 0000000000000000000000000000000000000000..7fdcc080aa3c5f5a06fef8087a38e1e8111f16ea
--- /dev/null
+++ b/kiwz_frontend_report.md
@@ -0,0 +1,37 @@
+# kiwerkzeuge.de Staging-Report
+
+## Erstellte/geänderte Dateien
+
+- `index.html` - neue SEO-Startseite mit Werkzeugkarten, Preis-Teaser, FAQ, Open-Graph/Twitter-Meta, Canonical und JSON-LD.
+- `tiefenkarte.html` - Kopie der bisherigen Depth-Studio-Seite mit angepasstem Titel, Meta, Canonical, Navigation, lokalen Fonts, Footer und Matomo.
+- `stable-diffusion.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `music.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `video-studio.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `preise.html` - neue Preis- und Priority-Code-Seite mit Paketen, HostBill-Platzhaltern, Cookie-Einlösung, FAQ, Meta-Daten und Product/Offer-JSON-LD.
+- `impressum.html` - neue Impressumsseite mit den vorgegebenen Panomity-GmbH-Daten.
+- `datenschutz.html` - neue DSGVO-Datenschutzerklärung für Hosting, Matomo, Medienverarbeitung, Bestellabwicklung, Cookies und Betroffenenrechte.
+- `assets/styles.css` - ergänzende Styles für Footer, Landingpage-Raster, Preisboxen, Rechtsseiten und Prio-Code-Formular am Dateiende.
+- `config/gpuq-client.php` - leeres `priority_codes`-Mapping mit Kommentar ergänzt.
+- `service/gpuq-proxy.php` - Priority-Durchsetzung in `submit`: Client-Priority wird entfernt, gültige Codes setzen konfigurierte Priorität, `priority_code` wird nie weitergeleitet.
+- `robots.txt` - öffentliche Indexierung erlaubt und interne Service-/Upload-/Konfigurationspfade gesperrt.
+- `sitemap.xml` - Sitemap mit acht öffentlichen Seiten erstellt.
+- `kiwz_frontend_report.md` - dieser Staging-Bericht.
+
+## Prüfungen
+
+- `php -l config/gpuq-client.php` - OK.
+- `php -l service/gpuq-proxy.php` - OK.
+- JSON-LD in `index.html` und `preise.html` maschinell geparst - OK.
+- Sitemap XML maschinell geparst - OK.
+- Jede HTML-Seite hat genau ein `<h1>` - OK.
+- Google-Fonts-Referenzen entfernt; alle HTML-Seiten nutzen `/assets/fonts/inter.css` - OK.
+- Matomo-Snippet auf allen acht öffentlichen HTML-Seiten vorhanden - OK.
+- Sichtbare interne HTML-/Asset-Links geprüft - OK.
+
+## Offene Punkte
+
+- HostBill-Produkt-IDs `HB_PID_STARTER`, `HB_PID_PRO` und `HB_PID_BUSINESS` müssen vor Livegang durch echte Produkt-IDs ersetzt werden.
+- `config/gpuq-client.php` enthält noch keine echten Prio-Codes; Codes müssen als `CODE => Stufe` eingetragen werden.
+- Die App-JavaScript-Dateien unter `/assets/*.js` sind im Staging bewusst nicht enthalten und wurden nicht verändert.
+- Der bestehende Three.js-CDN-Verweis in `tiefenkarte.html` wurde wie beauftragt unverändert beibehalten.
+- Datenschutz- und Impressumstexte sind seriös formuliert, ersetzen aber keine finale juristische Prüfung.
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/kiwz_frontend_report.md b/kiwz_frontend_report.md
new file mode 100644
index 0000000000000000000000000000000000000000..7fdcc080aa3c5f5a06fef8087a38e1e8111f16ea
--- /dev/null
+++ b/kiwz_frontend_report.md
@@ -0,0 +1,37 @@
+# kiwerkzeuge.de Staging-Report
+
+## Erstellte/geänderte Dateien
+
+- `index.html` - neue SEO-Startseite mit Werkzeugkarten, Preis-Teaser, FAQ, Open-Graph/Twitter-Meta, Canonical und JSON-LD.
+- `tiefenkarte.html` - Kopie der bisherigen Depth-Studio-Seite mit angepasstem Titel, Meta, Canonical, Navigation, lokalen Fonts, Footer und Matomo.
+- `stable-diffusion.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `music.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `video-studio.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `preise.html` - neue Preis- und Priority-Code-Seite mit Paketen, HostBill-Platzhaltern, Cookie-Einlösung, FAQ, Meta-Daten und Product/Offer-JSON-LD.
+- `impressum.html` - neue Impressumsseite mit den vorgegebenen Panomity-GmbH-Daten.
+- `datenschutz.html` - neue DSGVO-Datenschutzerklärung für Hosting, Matomo, Medienverarbeitung, Bestellabwicklung, Cookies und Betroffenenrechte.
+- `assets/styles.css` - ergänzende Styles für Footer, Landingpage-Raster, Preisboxen, Rechtsseiten und Prio-Code-Formular am Dateiende.
+- `config/gpuq-client.php` - leeres `priority_codes`-Mapping mit Kommentar ergänzt.
+- `service/gpuq-proxy.php` - Priority-Durchsetzung in `submit`: Client-Priority wird entfernt, gültige Codes setzen konfigurierte Priorität, `priority_code` wird nie weitergeleitet.
+- `robots.txt` - öffentliche Indexierung erlaubt und interne Service-/Upload-/Konfigurationspfade gesperrt.
+- `sitemap.xml` - Sitemap mit acht öffentlichen Seiten erstellt.
+- `kiwz_frontend_report.md` - dieser Staging-Bericht.
+
+## Prüfungen
+
+- `php -l config/gpuq-client.php` - OK.
+- `php -l service/gpuq-proxy.php` - OK.
+- JSON-LD in `index.html` und `preise.html` maschinell geparst - OK.
+- Sitemap XML maschinell geparst - OK.
+- Jede HTML-Seite hat genau ein `<h1>` - OK.
+- Google-Fonts-Referenzen entfernt; alle HTML-Seiten nutzen `/assets/fonts/inter.css` - OK.
+- Matomo-Snippet auf allen acht öffentlichen HTML-Seiten vorhanden - OK.
+- Sichtbare interne HTML-/Asset-Links geprüft - OK.
+
+## Offene Punkte
+
+- HostBill-Produkt-IDs `HB_PID_STARTER`, `HB_PID_PRO` und `HB_PID_BUSINESS` müssen vor Livegang durch echte Produkt-IDs ersetzt werden.
+- `config/gpuq-client.php` enthält noch keine echten Prio-Codes; Codes müssen als `CODE => Stufe` eingetragen werden.
+- Die App-JavaScript-Dateien unter `/assets/*.js` sind im Staging bewusst nicht enthalten und wurden nicht verändert.
+- Der bestehende Three.js-CDN-Verweis in `tiefenkarte.html` wurde wie beauftragt unverändert beibehalten.
+- Datenschutz- und Impressumstexte sind seriös formuliert, ersetzen aber keine finale juristische Prüfung.
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Der Bericht ist angelegt. Ich mache noch einen letzten Konsistenzlauf über PHP, JSON-LD, Sitemap, Matomo, Fonts und interne Links, damit der Abschluss nicht auf Zwischenständen basiert.
exec
/bin/bash -lc 'php -l config/gpuq-client.php && php -l service/gpuq-proxy.php' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
No syntax errors detected in config/gpuq-client.php
No syntax errors detected in service/gpuq-proxy.php
exec
/bin/bash -lc "python3 - <<'PY'
from pathlib import Path
import json, re, xml.etree.ElementTree as ET
root = Path('.')
html_files = sorted(root.glob('*.html'))
errors = []
for path in html_files:
text = path.read_text(encoding='utf-8')
h1 = len(re.findall(r'<h1\\b', text, flags=re.I))
if h1 "'!= 1:
errors.append(f'"'{path}: expected 1 h1, found {h1}')
if 'https://fonts.googleapis.com' in text or 'https://fonts.gstatic.com' in text:
errors.append(f'{path}: google font reference remains')
if 'Matomo Analytics' not in text:
errors.append(f'{path}: Matomo missing')
for match in re.finditer(r'<script type=\"application/ld\\+json\">(.*?)</script>', text, flags=re.S):
json.loads(match.group(1))
existing_html = {p.name for p in html_files}
existing_assets = {str(p).replace('\\\\', '/') for p in root.rglob('*') if p.is_file()}
for path in html_files:
text = path.read_text(encoding='utf-8')
for attr, href in re.findall(r'\\s(href|src)=\"(["'^"]+)"'"', text):
if href.startswith(('http://', 'https://', 'mailto:', 'tel:', '#')):
continue
if attr == 'src' and href.startswith('/assets/') and href.split('?', 1)[0].endswith('.js'):
continue
target = href.split('#', 1)[0].split('?', 1)[0]
if not target:
continue
if target == '/':
target_name = 'index.html'
elif target.startswith('/'):
target_name = target.lstrip('/')
else:
target_name = str((path.parent / target).as_posix())
if target_name.endswith('.html') and target_name not in existing_html:
errors.append(f'{path}: missing html href {href}')
if target_name.startswith('assets/') and target_name not in existing_assets:
errors.append(f'{path}: missing asset {href}')
ET.parse('sitemap.xml')
robots = Path('robots.txt').read_text(encoding='utf-8')
if 'Allow: /' not in robots or 'Sitemap: https://kiwerkzeuge.de/sitemap.xml' not in robots:
errors.append('robots.txt: allow or sitemap missing')
if errors:
raise SystemExit('\\n'.join(errors))
print('OK')
PY" in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
OK
exec
/bin/bash -lc 'find . -maxdepth 2 -type f | sort' in /home/kiwerkzeuge.de/staging-build
succeeded in 0ms:
./assets/styles.css
./assets/theme.js
./config/gpuq-client.php
./datenschutz.html
./impressum.html
./index.html
./kiwz_frontend_report.md
./music.html
./preise.html
./robots.txt
./service/gpuq-proxy.php
./sitemap.xml
./stable-diffusion.html
./tiefenkarte.html
./video-studio.html
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/kiwz_frontend_report.md b/kiwz_frontend_report.md
new file mode 100644
index 0000000000000000000000000000000000000000..7fdcc080aa3c5f5a06fef8087a38e1e8111f16ea
--- /dev/null
+++ b/kiwz_frontend_report.md
@@ -0,0 +1,37 @@
+# kiwerkzeuge.de Staging-Report
+
+## Erstellte/geänderte Dateien
+
+- `index.html` - neue SEO-Startseite mit Werkzeugkarten, Preis-Teaser, FAQ, Open-Graph/Twitter-Meta, Canonical und JSON-LD.
+- `tiefenkarte.html` - Kopie der bisherigen Depth-Studio-Seite mit angepasstem Titel, Meta, Canonical, Navigation, lokalen Fonts, Footer und Matomo.
+- `stable-diffusion.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `music.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `video-studio.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `preise.html` - neue Preis- und Priority-Code-Seite mit Paketen, HostBill-Platzhaltern, Cookie-Einlösung, FAQ, Meta-Daten und Product/Offer-JSON-LD.
+- `impressum.html` - neue Impressumsseite mit den vorgegebenen Panomity-GmbH-Daten.
+- `datenschutz.html` - neue DSGVO-Datenschutzerklärung für Hosting, Matomo, Medienverarbeitung, Bestellabwicklung, Cookies und Betroffenenrechte.
+- `assets/styles.css` - ergänzende Styles für Footer, Landingpage-Raster, Preisboxen, Rechtsseiten und Prio-Code-Formular am Dateiende.
+- `config/gpuq-client.php` - leeres `priority_codes`-Mapping mit Kommentar ergänzt.
+- `service/gpuq-proxy.php` - Priority-Durchsetzung in `submit`: Client-Priority wird entfernt, gültige Codes setzen konfigurierte Priorität, `priority_code` wird nie weitergeleitet.
+- `robots.txt` - öffentliche Indexierung erlaubt und interne Service-/Upload-/Konfigurationspfade gesperrt.
+- `sitemap.xml` - Sitemap mit acht öffentlichen Seiten erstellt.
+- `kiwz_frontend_report.md` - dieser Staging-Bericht.
+
+## Prüfungen
+
+- `php -l config/gpuq-client.php` - OK.
+- `php -l service/gpuq-proxy.php` - OK.
+- JSON-LD in `index.html` und `preise.html` maschinell geparst - OK.
+- Sitemap XML maschinell geparst - OK.
+- Jede HTML-Seite hat genau ein `<h1>` - OK.
+- Google-Fonts-Referenzen entfernt; alle HTML-Seiten nutzen `/assets/fonts/inter.css` - OK.
+- Matomo-Snippet auf allen acht öffentlichen HTML-Seiten vorhanden - OK.
+- Sichtbare interne HTML-/Asset-Links geprüft - OK.
+
+## Offene Punkte
+
+- HostBill-Produkt-IDs `HB_PID_STARTER`, `HB_PID_PRO` und `HB_PID_BUSINESS` müssen vor Livegang durch echte Produkt-IDs ersetzt werden.
+- `config/gpuq-client.php` enthält noch keine echten Prio-Codes; Codes müssen als `CODE => Stufe` eingetragen werden.
+- Die App-JavaScript-Dateien unter `/assets/*.js` sind im Staging bewusst nicht enthalten und wurden nicht verändert.
+- Der bestehende Three.js-CDN-Verweis in `tiefenkarte.html` wurde wie beauftragt unverändert beibehalten.
+- Datenschutz- und Impressumstexte sind seriös formuliert, ersetzen aber keine finale juristische Prüfung.
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
codex
Erledigt im Staging-Verzeichnis `/home/kiwerkzeuge.de/staging-build`.
Umgesetzt:
- neue SEO-Startseite `index.html`
- ausgelagerte `tiefenkarte.html`
- neue Seiten `preise.html`, `impressum.html`, `datenschutz.html`
- lokale Fonts auf allen HTML-Seiten
- einheitliche Navigation, Footer und Matomo auf allen öffentlichen Seiten
- `robots.txt` und `sitemap.xml`
- Priority-Code-Handling in `service/gpuq-proxy.php`
- `priority_codes`-Konfiguration in `config/gpuq-client.php`
- Abschlussbericht `kiwz_frontend_report.md`
Geprüft:
- `php -l config/gpuq-client.php` OK
- `php -l service/gpuq-proxy.php` OK
- JSON-LD parsebar
- Sitemap XML parsebar
- jede HTML-Seite genau ein `<h1>`
- keine Google-Fonts-Referenzen mehr
- Matomo auf allen acht öffentlichen HTML-Seiten
- sichtbare interne HTML-/Asset-Links OK
Hinweis: Die bewusst fehlenden App-JS-Dateien unter `/assets/*.js` habe ich nicht angefasst und im Report als offene/erwartete Staging-Ausnahme dokumentiert.
diff --git a/assets/styles.css b/assets/styles.css
index 2188431cadf3545a6a289f1e9c4ebcc14b543853..180f38d034d795f441894dd7509e3838bc983f63
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -2036,3 +2036,186 @@
color: var(--muted);
font-size: 0.8rem;
}
+
+/* Public landing, pricing and legal pages */
+.primary,
+.ghost {
+ text-decoration: none;
+}
+
+.tool-grid,
+.step-grid,
+.pricing-grid {
+ display: grid;
+ gap: 1rem;
+}
+
+.tool-grid,
+.pricing-grid {
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+}
+
+.step-grid {
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.tool-grid .feature-card,
+.step-grid .feature-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+}
+
+.tool-grid .feature-card .secondary {
+ margin-top: auto;
+ align-self: flex-start;
+}
+
+.price-teaser {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 1.5rem;
+ flex-wrap: wrap;
+}
+
+.price-teaser p {
+ max-width: 70ch;
+}
+
+.price-card {
+ display: flex;
+ flex-direction: column;
+ gap: 0.85rem;
+}
+
+.price-card--featured {
+ border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+ background: color-mix(in srgb, var(--accent) 8%, var(--panel));
+}
+
+.price-card h2,
+.price-card p,
+.price-card ul {
+ margin: 0;
+}
+
+.price {
+ color: var(--text);
+ font-size: 2rem;
+ font-weight: 700;
+ line-height: 1.1;
+}
+
+.price span {
+ color: var(--muted);
+ font-size: 0.95rem;
+ font-weight: 500;
+}
+
+.price-card ul {
+ padding-left: 1.2rem;
+ line-height: 1.7;
+}
+
+.price-card .primary,
+.price-card .secondary {
+ margin-top: auto;
+}
+
+.billing-note {
+ font-size: 0.85rem;
+}
+
+.redeem-form {
+ display: flex;
+ align-items: end;
+ gap: 1rem;
+ flex-wrap: wrap;
+}
+
+.redeem-form .form-group {
+ flex: 1 1 260px;
+ margin-bottom: 0;
+}
+
+.form-group input[type="text"] {
+ padding: 0.7rem 0.9rem;
+ border-radius: 0.8rem;
+ border: 1px solid var(--border);
+ background: var(--panel);
+ color: var(--text);
+ font-family: inherit;
+ font-size: 0.95rem;
+ transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+.form-group input[type="text"]:focus {
+ outline: none;
+ border-color: var(--accent);
+ background: var(--panel-strong);
+}
+
+.legal-content {
+ max-width: 860px;
+}
+
+.legal-content h2 {
+ margin-top: 1.4rem;
+}
+
+.legal-content h2:first-child {
+ margin-top: 0;
+}
+
+.legal-content a,
+.site-footer a {
+ color: var(--text);
+}
+
+.site-footer {
+ border-top: 1px solid var(--border);
+ padding-top: 1.25rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ gap: 1rem;
+ flex-wrap: wrap;
+ color: var(--muted);
+ font-size: 0.92rem;
+}
+
+.site-footer p {
+ margin: 0;
+}
+
+.site-footer nav {
+ display: flex;
+ gap: 0.9rem;
+ flex-wrap: wrap;
+}
+
+.site-footer a {
+ color: var(--muted);
+ text-decoration: none;
+}
+
+.site-footer a:hover {
+ color: var(--text);
+}
+
+@media (max-width: 720px) {
+ .nav-tabs {
+ overflow-x: auto;
+ padding-bottom: 0.2rem;
+ }
+
+ .nav-tab {
+ white-space: nowrap;
+ }
+
+ .site-footer {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+}
diff --git a/config/gpuq-client.php b/config/gpuq-client.php
index cadaab1ab3c8196caf88a4b21058bc3897fbb865..0e36f20eef455dff52e954020e35f6dc84325eb8
--- a/config/gpuq-client.php
+++ b/config/gpuq-client.php
@@ -4,6 +4,10 @@
'service_url' => 'http://127.0.0.1:8020',
'timeout' => 60,
'stream_timeout' => 0,
+ // Map purchasable priority codes to GPUQ priority levels.
+ // Example: 'KIWZ-AB2C-DE3F' => 'high'
+ 'priority_codes' => [
+ ],
// Restrict which upstream URLs frontend clients may enqueue.
// This prevents open SSRF through /service/gpuq-proxy.php?action=submit.
'allowed_execute_prefixes' => [
diff --git a/datenschutz.html b/datenschutz.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3ec0853d7e2f0c1a287cc0d2f226507e8003458
--- /dev/null
+++ b/datenschutz.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Datenschutzerklärung | kiwerkzeuge.de</title>
+ <meta name="description" content="Datenschutzerklärung für kiwerkzeuge.de: Hosting in Deutschland, Matomo, Medienverarbeitung, Bestellabwicklung und Betroffenenrechte." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta property="og:description" content="Informationen zur Datenverarbeitung bei kiwerkzeuge.de." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/datenschutz.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Datenschutzerklärung | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Datenschutzinformationen für kiwerkzeuge.de." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Datenschutzerklärung</h1>
+ <p>Informationen zur Verarbeitung personenbezogener Daten.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Verantwortlicher</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben<br />
+ Geschäftsführer: Sascha Endlicher, M.A.<br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a><br />
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a>
+ </p>
+
+ <h2>Hosting und Server-Logs</h2>
+ <p>
+ kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Beim Aufruf der Website werden technisch erforderliche Server-Logs verarbeitet, insbesondere IP-Adresse, Zeitpunkt des Zugriffs und User-Agent.
+ </p>
+ <p>
+ Zweck der Verarbeitung ist der sichere und stabile Betrieb der Website sowie die Erkennung und Abwehr von Missbrauch. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Webanalyse mit Matomo</h2>
+ <p>
+ Wir nutzen Matomo, selbst gehostet auf statsdeluxe.com. Matomo wird mit IP-Kürzung betrieben; eine Weitergabe der Analysedaten an Dritte findet nicht statt.
+ </p>
+ <p>
+ Die Auswertung hilft uns, Reichweite und Nutzung der Werkzeuge zu verstehen und technische Probleme zu erkennen. Rechtsgrundlage ist Art. 6 Abs. 1 lit. f DSGVO.
+ </p>
+
+ <h2>Hochgeladene Bilder und erzeugte Medien</h2>
+ <p>
+ Wenn du Bilder, Texte, Audio- oder Videodaten hochlädst oder KI-Medien erzeugst, verarbeiten wir diese Daten ausschließlich zur Bereitstellung des jeweiligen Werkzeugs und zur Auslieferung des Ergebnisses.
+ </p>
+ <p>
+ Hochgeladene Dateien und erzeugte Medien werden zeitnah gelöscht, soweit keine längere Speicherung technisch erforderlich ist oder du selbst eine weitere Verarbeitung veranlasst hast.
+ </p>
+
+ <h2>Bestellabwicklung</h2>
+ <p>
+ Bestellungen und Kundenkonto-Funktionen werden über das HostBill-Kundenportal der Panomity GmbH unter support.panomity.com abgewickelt. Dort werden die für Vertrag, Zahlung, Rechnung und Support erforderlichen Daten verarbeitet.
+ </p>
+
+ <h2>Cookies und lokale Speicherung</h2>
+ <p>
+ Der Cookie <code>kiwz_prio</code> speichert funktional deinen Prio-Code für 30 Tage in diesem Browser. Er dient ausschließlich dazu, Priority für die Werkzeuge zu aktivieren.
+ </p>
+ <p>
+ Die Theme-Auswahl wird im lokalen Speicher deines Browsers (<code>localStorage</code>) abgelegt, damit Hell- oder Dunkelmodus beim nächsten Besuch erhalten bleibt.
+ </p>
+
+ <h2>Betroffenenrechte</h2>
+ <p>
+ Du hast nach Maßgabe der DSGVO Rechte auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung, Datenübertragbarkeit und Widerspruch gegen Verarbeitungen auf Grundlage berechtigter Interessen.
+ </p>
+ <p>
+ Zur Ausübung deiner Rechte genügt eine Nachricht an <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>.
+ </p>
+
+ <h2>Beschwerderecht</h2>
+ <p>
+ Du hast das Recht, dich bei einer Datenschutzaufsichtsbehörde zu beschweren. Zuständig ist insbesondere das Bayerische Landesamt für Datenschutzaufsicht (BayLDA), Promenade 18, 91522 Ansbach.
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/impressum.html b/impressum.html
new file mode 100644
index 0000000000000000000000000000000000000000..c22c23b8e7aede4cdc6457397f3a9459db8b446c
--- /dev/null
+++ b/impressum.html
@@ -0,0 +1,123 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Impressum | kiwerkzeuge.de</title>
+ <meta name="description" content="Impressum der Panomity GmbH für kiwerkzeuge.de." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/impressum.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Impressum | kiwerkzeuge.de" />
+ <meta property="og:description" content="Angaben gemäß Impressumspflicht der Panomity GmbH." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/impressum.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Impressum | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Impressum der Panomity GmbH." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Impressum</h1>
+ <p>Angaben gemäß gesetzlicher Anbieterkennzeichnung.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="panel legal-content">
+ <h2>Angaben nach § 5 TMG</h2>
+ <p>
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+
+ <h2>Vertreten durch</h2>
+ <p>Geschäftsführer: Sascha Endlicher, M.A.</p>
+
+ <h2>Kontakt</h2>
+ <p>
+ Telefon: <a href="tel:+4981217607887">+49 8121-7607887</a><br />
+ E-Mail: <a href="mailto:hallo@panomity.de">hallo@panomity.de</a>
+ </p>
+
+ <h2>Registereintrag</h2>
+ <p>
+ Handelsregister: HRB 264411<br />
+ Registergericht: Amtsgericht München
+ </p>
+
+ <h2>Umsatzsteuer</h2>
+ <p>USt-IdNr.: DE324810080</p>
+
+ <h2>Verantwortlich i.S.d. § 18 Abs. 2 MStV</h2>
+ <p>
+ Sascha Endlicher, M.A.<br />
+ Panomity GmbH<br />
+ Seilergasse 34<br />
+ D-85570 Markt Schwaben
+ </p>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/index.html b/index.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..40ee4da8a13c07b05ece9d107dd1c6efbd86ab63
--- a/index.html
+++ b/index.html
@@ -3,24 +3,87 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI | kiwerkzeuge.de</title>
+ <meta name="description" content="Professionelle KI-Werkzeuge im Browser: Bilder, Musik, Video und Tiefenkarten ohne Anmeldung sofort erstellen, gehostet in Deutschland." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta property="og:description" content="Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/" />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta name="twitter:title" content="KI Werkzeuge online – Bilder, Musik, Video & Tiefenkarten mit KI" />
+ <meta name="twitter:description" content="Bilder, Musik, Video und Tiefenkarten direkt im Browser mit KI erstellen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
- <script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
- <script defer src="/assets/app.js?v=20260212-0915"></script>
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "WebSite",
+ "@id": "https://kiwerkzeuge.de/#website",
+ "url": "https://kiwerkzeuge.de/",
+ "name": "kiwerkzeuge.de",
+ "description": "Professionelle KI-Werkzeuge für Bilder, Musik, Video und Tiefenkarten im Browser.",
+ "inLanguage": "de-DE",
+ "publisher": {
+ "@type": "Organization",
+ "name": "Panomity GmbH"
+ }
+ },
+ {
+ "@type": "FAQPage",
+ "@id": "https://kiwerkzeuge.de/#faq",
+ "mainEntity": [
+ {
+ "@type": "Question",
+ "name": "Was kostet die Nutzung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete gibt es ab 4,90 Euro pro Monat."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Brauche ich eine Anmeldung?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Für den Start ist keine Anmeldung nötig. Ein Priority-Paket wird über das Kundenportal bestellt und per Prio-Code im Browser aktiviert."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Wo werden Daten verarbeitet?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Hochgeladene und erzeugte Medien werden nur zur Diensterbringung verarbeitet."
+ }
+ },
+ {
+ "@type": "Question",
+ "name": "Darf ich Ergebnisse kommerziell nutzen?",
+ "acceptedAnswer": {
+ "@type": "Answer",
+ "text": "Ja, generierte Inhalte können grundsätzlich auch kommerziell genutzt werden. Nutzer müssen Rechte an hochgeladenem Ausgangsmaterial und Markenrechte Dritter beachten."
+ }
+ }
+ ]
+ }
+ ]
+ }
+ </script>
</head>
<body>
<div class="page">
<header class="site-header">
<div class="brand">
- <div class="logo">DA</div>
+ <div class="logo">KI</div>
<div>
- <h1>Depth Studio</h1>
- <p>Tiefenkarte & Porträt-Effekt aus deinem Foto – in Sekunden.</p>
+ <h1>KI Werkzeuge</h1>
+ <p>Bilder, Musik, Video und Tiefenkarten direkt im Browser.</p>
</div>
</div>
<div class="header-actions">
@@ -37,21 +100,19 @@
<path d="m19.07 4.93-1.41 1.41"></path>
</svg>
<svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
- <path d="M12 3a7 7 0 0 0 9 9 9 9 0 1 1-9-9z"></path>
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
</svg>
</button>
- <div class="status-pill" id="serviceStatus">
- <span class="dot"></span>
- <span>Status wird geprüft…</span>
- </div>
</div>
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab active">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -59,182 +120,148 @@
<div class="hero-grid">
<div class="hero-copy">
<div class="badges">
- <span class="badge">Sofort-Download</span>
<span class="badge">Ohne Anmeldung</span>
- <span class="badge">PNG/JPG/WebM</span>
+ <span class="badge">Server in Deutschland</span>
+ <span class="badge">Sofort im Browser</span>
</div>
- <h2 class="hero-title">Mach aus deinem Foto eine Tiefenkarte – plus Porträt-Effekt.</h2>
+ <h2 class="hero-title">Professionelle KI-Werkzeuge im Browser – ohne Anmeldung sofort starten, gehostet in Deutschland.</h2>
<p class="hero-subtitle">
- Lade ein Foto hoch und erhalte in Sekunden die Tiefenkarte (PNG). Optional bekommst du einen Porträt-Effekt und einen kurzen 3D-Zoom-Clip.
+ Erstelle Bilder aus Text, generiere Musik, plane Video-Shots oder berechne Tiefenkarten aus Fotos. Alles läuft webbasiert, mit direktem Download deiner Ergebnisse.
</p>
<div class="hero-actions">
- <button class="primary" id="heroPickBtn" type="button">
- <span>Foto auswählen</span>
- </button>
- <a class="secondary" href="#start">Direkt starten</a>
+ <a class="primary" href="#werkzeuge">Kostenlos ausprobieren</a>
+ <a class="secondary" href="/preise.html">Preise ansehen</a>
</div>
- <p class="hero-note muted">Tipp: Für Porträts funktioniert ein klarer Vordergrund besonders gut.</p>
</div>
<div class="hero-features">
<div class="feature-grid">
<article class="feature-card">
- <h3>Tiefenkarte (PNG)</h3>
- <p>Perfekt für 3D/Compositing, Masken und Tiefen-basierte Effekte.</p>
+ <h3>Für Kreative</h3>
+ <p>Ideen schnell visualisieren, vertonen und als Assets herunterladen.</p>
</article>
<article class="feature-card">
- <h3>Porträt-Effekt</h3>
- <p>Unscharfer Hintergrund mit Reglern für Schärfe und Intensität.</p>
+ <h3>Für Teams</h3>
+ <p>Browser öffnen, Prompt eingeben, Ergebnis teilen oder weiterverarbeiten.</p>
</article>
<article class="feature-card">
- <h3>3D-Zoom-Clip</h3>
- <p>Ein kurzer Clip mit Parallax-Effekt – direkt im Browser.</p>
+ <h3>Für Produktion</h3>
+ <p>Priority-Pakete verkürzen Wartezeiten bei wiederkehrenden Aufgaben.</p>
</article>
<article class="feature-card">
- <h3>Einfach & schnell</h3>
- <p>Keine Installation – du lädst hoch und lädst Ergebnisse runter.</p>
+ <h3>Für Datenschutz</h3>
+ <p>Hosting auf eigenen Servern in Deutschland und lokale Fonts ohne Google-Aufruf.</p>
</article>
</div>
</div>
</div>
</section>
- <div class="layout">
- <section class="panel upload" id="start">
- <div>
- <h2>1. Foto auswählen</h2>
- <p>Lade ein Foto hoch (JPG/PNG, bis zu 15 MB). Danach kannst du Tiefenkarte und Effekte herunterladen.</p>
- </div>
- <label class="dropzone" id="dropzone">
- <input type="file" accept="image/*" id="imageInput" hidden />
- <div class="dropzone__content">
- <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
- <path d="M12 5v14" />
- <path d="M5 12h14" />
- </svg>
- <p>Bild hier ablegen oder <span>Datei auswählen</span></p>
- <small id="fileInfo">Noch keine Datei ausgewählt.</small>
- </div>
- </label>
- <div class="toggles">
- <label>
- <input type="checkbox" id="optionDepth" checked />
- <span>Tiefenkarte (PNG)</span>
- </label>
- <label>
- <input type="checkbox" id="optionPortrait" checked />
- <span>Porträt-Effekt (unscharfer Hintergrund)</span>
- </label>
- <label>
- <input type="checkbox" id="optionVideo" />
- <span>3D-Zoom (kurzer Clip)</span>
- </label>
- </div>
- <button id="processBtn" class="primary" disabled>
- <span>Jetzt berechnen</span>
- <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
- <line x1="22" y1="2" x2="11" y2="13"></line>
- <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
- </svg>
- </button>
- <div class="progress" id="progress" hidden>
- <div class="spinner"></div>
- <div>
- <p id="progressTitle">Wird vorbereitet…</p>
- <small id="progressSub">Das dauert meistens nur ein paar Sekunden.</small>
- </div>
+ <section class="panel" id="werkzeuge">
+ <h2>Werkzeuge</h2>
+ <div class="tool-grid">
+ <article class="feature-card">
+ <h3>Bildgenerator</h3>
+ <p>Erstelle Bilder aus Text und bearbeite Motive per Inpainting. Eigene LoRA-Modelle helfen dabei, wiedererkennbare Stile oder Motive konsistent zu nutzen.</p>
+ <a class="secondary" href="/stable-diffusion.html">Bildgenerator öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Musikgenerator</h3>
+ <p>Beschreibe Genre, Stimmung, Instrumente oder Lyrics und erhalte einen passenden Track. Der fertige Song kann direkt angehört und heruntergeladen werden.</p>
+ <a class="secondary" href="/music.html">Musik erstellen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Video Studio</h3>
+ <p>Plane längere Videos als strukturierte Shotlist mit Charakter-Ankern, Storyboard und Export. So bleiben Szenen, Timing und Kontinuität übersichtlich.</p>
+ <a class="secondary" href="/video-studio.html">Video Studio öffnen</a>
+ </article>
+ <article class="feature-card">
+ <h3>Tiefenkarte</h3>
+ <p>Lade ein Foto hoch und erzeuge daraus eine Tiefenkarte für Effekte, Compositing und 3D-Workflows. Optional entstehen Porträt-Effekt und kurzer 3D-Zoom-Clip.</p>
+ <a class="secondary" href="/tiefenkarte.html">Tiefenkarte berechnen</a>
+ </article>
</div>
</section>
- <section class="panel results">
- <h2>2. Ergebnisse herunterladen</h2>
- <div class="results-grid">
- <article class="result-card" id="depthCard">
- <header>
- <h3>Tiefenkarte</h3>
- <button class="ghost" id="downloadDepth" disabled>PNG herunterladen</button>
- </header>
- <div class="result-preview" id="depthPreview">
- <p class="placeholder">Die generierte Tiefenkarte wird hier angezeigt.</p>
- </div>
+ <section class="panel">
+ <h2>So funktioniert's</h2>
+ <div class="step-grid">
+ <article class="feature-card">
+ <span class="badge">1</span>
+ <h3>Werkzeug öffnen</h3>
+ <p>Wähle Bildgenerator, Musikgenerator, Video Studio oder Tiefenkarte aus.</p>
+ </article>
+ <article class="feature-card">
+ <span class="badge">2</span>
+ <h3>Beschreiben oder hochladen</h3>
+ <p>Gib einen Prompt ein, lade Ausgangsmaterial hoch oder plane deine Shots.</p>
</article>
-
- <article class="result-card" id="portraitCard">
- <header>
- <div>
- <h3>Porträt-Effekt</h3>
- <small>Schärfe & Unschärfe anpassen</small>
- </div>
- <button class="ghost" id="downloadPortrait" disabled>JPG herunterladen</button>
- </header>
- <div class="controls" id="portraitControls" hidden>
- <label>
- Schärfe-Ebene
- <input type="range" id="focusSlider" min="5" max="95" value="45" />
- </label>
- <label>
- Unschärfe
- <input type="range" id="bokehSlider" min="4" max="30" value="14" />
- </label>
- </div>
- <div class="result-preview" id="portraitPreview">
- <p class="placeholder">Aktiviere „Porträt-Effekt“, um automatisch eine Version mit unscharfem Hintergrund zu erhalten.</p>
- </div>
+ <article class="feature-card">
+ <span class="badge">3</span>
+ <h3>Ergebnis herunterladen</h3>
+ <p>Lade generierte Bilder, Musik, Tiefenkarten oder Projektdaten direkt herunter.</p>
</article>
+ </div>
+ </section>
- <article class="result-card" id="videoCard">
- <header>
- <div>
- <h3>3D-Zoom-Clip</h3>
- <small>Kurzer Clip mit 3D-Effekt</small>
- </div>
- <button class="ghost" id="renderVideo" disabled>4s WebM rendern</button>
- </header>
- <div class="result-preview" id="videoPreview">
- <p class="placeholder">Aktiviere „3D-Zoom“ und erstelle den Clip, sobald die Tiefenkarte fertig ist.</p>
- </div>
- </article>
+ <section class="panel price-teaser">
+ <div>
+ <h2>Free starten, bei Bedarf schneller rechnen</h2>
+ <p>
+ Free nutzt die normale Warteschlange und enthält alle Werkzeuge. Priority-Pakete ab 4,90 €/Monat reduzieren Wartezeiten und priorisieren passende Workflows.
+ </p>
</div>
+ <a class="primary" href="/preise.html">Preise ansehen</a>
</section>
- </div>
<section class="panel info" id="faq">
<h2>FAQ</h2>
<details class="details" open>
- <summary>Was bekomme ich genau?</summary>
- <p class="muted">
- Eine <strong>Tiefenkarte (PNG)</strong>. Optional zusätzlich einen <strong>Porträt-Effekt (JPG)</strong> und einen <strong>3D-Zoom-Clip (WebM)</strong>.
- </p>
+ <summary>Was kostet die Nutzung?</summary>
+ <p class="muted">Die Werkzeuge können kostenlos mit normaler Warteschlange genutzt werden. Priority-Pakete starten ab 4,90 €/Monat.</p>
</details>
<details class="details">
- <summary>Welche Fotos funktionieren am besten?</summary>
- <p class="muted">
- Gute Ergebnisse gibt’s meist bei klaren Motiven mit erkennbarem Vordergrund (Porträt, Produktfoto, Objekt vor Hintergrund).
- </p>
+ <summary>Brauche ich eine Anmeldung?</summary>
+ <p class="muted">Zum Ausprobieren brauchst du keine Anmeldung. Priority wird nach dem Kauf per Code in diesem Browser aktiviert.</p>
+ </details>
+ <details class="details">
+ <summary>Wo stehen die Server?</summary>
+ <p class="muted">kiwerkzeuge.de wird auf eigenen Servern in Deutschland betrieben. Details findest du in der Datenschutzerklärung.</p>
+ </details>
+ <details class="details">
+ <summary>Was passiert mit hochgeladenen Dateien?</summary>
+ <p class="muted">Uploads und erzeugte Medien werden zur Diensterbringung verarbeitet und zeitnah gelöscht.</p>
</details>
<details class="details">
- <summary>Technische Details (optional)</summary>
- <p class="muted">
- API-Zugriff: <code>/service/depth-proxy.php</code> (Konfiguration: <code>config/depth-client.php</code>).
- </p>
+ <summary>Darf ich Ergebnisse kommerziell nutzen?</summary>
+ <p class="muted">Ja, grundsätzlich auch kommerziell. Bitte achte darauf, dass du Rechte an hochgeladenem Material besitzt und keine Rechte Dritter verletzt.</p>
</details>
</section>
</main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/kiwz_frontend_report.md b/kiwz_frontend_report.md
new file mode 100644
index 0000000000000000000000000000000000000000..7fdcc080aa3c5f5a06fef8087a38e1e8111f16ea
--- /dev/null
+++ b/kiwz_frontend_report.md
@@ -0,0 +1,37 @@
+# kiwerkzeuge.de Staging-Report
+
+## Erstellte/geänderte Dateien
+
+- `index.html` - neue SEO-Startseite mit Werkzeugkarten, Preis-Teaser, FAQ, Open-Graph/Twitter-Meta, Canonical und JSON-LD.
+- `tiefenkarte.html` - Kopie der bisherigen Depth-Studio-Seite mit angepasstem Titel, Meta, Canonical, Navigation, lokalen Fonts, Footer und Matomo.
+- `stable-diffusion.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `music.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `video-studio.html` - Navigation, lokale Fonts, Footer und Matomo vereinheitlicht.
+- `preise.html` - neue Preis- und Priority-Code-Seite mit Paketen, HostBill-Platzhaltern, Cookie-Einlösung, FAQ, Meta-Daten und Product/Offer-JSON-LD.
+- `impressum.html` - neue Impressumsseite mit den vorgegebenen Panomity-GmbH-Daten.
+- `datenschutz.html` - neue DSGVO-Datenschutzerklärung für Hosting, Matomo, Medienverarbeitung, Bestellabwicklung, Cookies und Betroffenenrechte.
+- `assets/styles.css` - ergänzende Styles für Footer, Landingpage-Raster, Preisboxen, Rechtsseiten und Prio-Code-Formular am Dateiende.
+- `config/gpuq-client.php` - leeres `priority_codes`-Mapping mit Kommentar ergänzt.
+- `service/gpuq-proxy.php` - Priority-Durchsetzung in `submit`: Client-Priority wird entfernt, gültige Codes setzen konfigurierte Priorität, `priority_code` wird nie weitergeleitet.
+- `robots.txt` - öffentliche Indexierung erlaubt und interne Service-/Upload-/Konfigurationspfade gesperrt.
+- `sitemap.xml` - Sitemap mit acht öffentlichen Seiten erstellt.
+- `kiwz_frontend_report.md` - dieser Staging-Bericht.
+
+## Prüfungen
+
+- `php -l config/gpuq-client.php` - OK.
+- `php -l service/gpuq-proxy.php` - OK.
+- JSON-LD in `index.html` und `preise.html` maschinell geparst - OK.
+- Sitemap XML maschinell geparst - OK.
+- Jede HTML-Seite hat genau ein `<h1>` - OK.
+- Google-Fonts-Referenzen entfernt; alle HTML-Seiten nutzen `/assets/fonts/inter.css` - OK.
+- Matomo-Snippet auf allen acht öffentlichen HTML-Seiten vorhanden - OK.
+- Sichtbare interne HTML-/Asset-Links geprüft - OK.
+
+## Offene Punkte
+
+- HostBill-Produkt-IDs `HB_PID_STARTER`, `HB_PID_PRO` und `HB_PID_BUSINESS` müssen vor Livegang durch echte Produkt-IDs ersetzt werden.
+- `config/gpuq-client.php` enthält noch keine echten Prio-Codes; Codes müssen als `CODE => Stufe` eingetragen werden.
+- Die App-JavaScript-Dateien unter `/assets/*.js` sind im Staging bewusst nicht enthalten und wurden nicht verändert.
+- Der bestehende Three.js-CDN-Verweis in `tiefenkarte.html` wurde wie beauftragt unverändert beibehalten.
+- Datenschutz- und Impressumstexte sind seriös formuliert, ersetzen aber keine finale juristische Prüfung.
diff --git a/music.html b/music.html
index ad543a6485b26f9fb3ae28d26e4bec6f73795111..03d7f1f867c447a4333d80654f68b3c13ed0aeb9
--- a/music.html
+++ b/music.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Musik aus Text erstellen | kiwerkzeuge.de</title>
<meta name="description" content="Erstelle Musik aus Textbeschreibungen. Gib einen Stil vor und lass dir einen passenden Track generieren." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="/assets/music-app.js?v=20260212-0910"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab active">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -278,6 +278,14 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
<div id="helpModal" hidden style="position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.9); backdrop-filter: blur(2px); z-index:9999;">
<div id="helpBackdrop" style="position:absolute; inset:0;"></div>
<div class="modal-dialog" role="dialog" aria-modal="true" aria-labelledby="helpTitle" style="position:relative; max-width:960px; width:92%; background:var(--panel); color:var(--text); border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.35); padding:1rem;">
@@ -522,5 +530,20 @@
</div>
</div>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/preise.html b/preise.html
new file mode 100644
index 0000000000000000000000000000000000000000..97b2f7cf8c1436428c3ab75c9a69e5168b725605
--- /dev/null
+++ b/preise.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html lang="de">
+ <head>
+ <meta charset="utf-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <title>Preise & Priority-Pakete | kiwerkzeuge.de</title>
+ <meta name="description" content="Free und Priority-Pakete für kiwerkzeuge.de: schnellere Warteschlange für Bilder, Tiefenkarten, Musik, Video und LoRA-Workflows." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/preise.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta property="og:description" content="Free nutzen oder Priority ab 4,90 €/Monat aktivieren." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/preise.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Preise & Priority-Pakete | kiwerkzeuge.de" />
+ <meta name="twitter:description" content="Priority-Pakete für kürzere Wartezeiten bei KI-Werkzeugen." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
+ <script src="/assets/theme.js"></script>
+ <link rel="stylesheet" href="/assets/styles.css" />
+ <script type="application/ld+json">
+ {
+ "@context": "https://schema.org",
+ "@graph": [
+ {
+ "@type": "Product",
+ "name": "Free",
+ "description": "Kostenlose Nutzung aller KI-Werkzeuge mit normaler Warteschlange.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "0.00",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://kiwerkzeuge.de/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Starter",
+ "description": "Priority für Bilder und Tiefenkarte.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "4.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Pro",
+ "description": "Priority für alle Werkzeuge inklusive Musik, Video und bevorzugter LoRA-Verarbeitung.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "14.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ },
+ {
+ "@type": "Product",
+ "name": "KI Business",
+ "description": "Höchste Priorität und 24h-Support für produktive Workflows.",
+ "brand": {
+ "@type": "Brand",
+ "name": "kiwerkzeuge.de"
+ },
+ "offers": {
+ "@type": "Offer",
+ "price": "39.90",
+ "priceCurrency": "EUR",
+ "availability": "https://schema.org/InStock",
+ "url": "https://support.panomity.com/cart/"
+ }
+ }
+ ]
+ }
+ </script>
+ </head>
+ <body>
+ <div class="page">
+ <header class="site-header">
+ <div class="brand">
+ <div class="logo">KI</div>
+ <div>
+ <h1>Preise</h1>
+ <p>Free nutzen oder Priority für kürzere Wartezeiten aktivieren.</p>
+ </div>
+ </div>
+ <div class="header-actions">
+ <button class="icon-button" id="themeToggle" type="button" aria-label="Design umschalten" title="Design umschalten">
+ <svg class="icon icon-sun" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <circle cx="12" cy="12" r="4"></circle>
+ <path d="M12 2v2"></path>
+ <path d="M12 20v2"></path>
+ <path d="m4.93 4.93 1.41 1.41"></path>
+ <path d="m17.66 17.66 1.41 1.41"></path>
+ <path d="M2 12h2"></path>
+ <path d="M20 12h2"></path>
+ <path d="m6.34 17.66-1.41 1.41"></path>
+ <path d="m19.07 4.93-1.41 1.41"></path>
+ </svg>
+ <svg class="icon icon-moon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+ <path d="M12 3a7 7 0 0 0 9 9 9 0 1 1-9-9z"></path>
+ </svg>
+ </button>
+ </div>
+ </header>
+
+ <nav class="nav-tabs">
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
+ <a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
+ <a href="/music.html" class="nav-tab">Musik</a>
+ <a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab active">Preise</a>
+ </nav>
+
+ <main class="main">
+ <section class="hero">
+ <div class="hero-grid">
+ <div class="hero-copy">
+ <div class="badges">
+ <span class="badge">Monatlich kündbar</span>
+ <span class="badge">Kundenportal</span>
+ <span class="badge">Priority-Code per E-Mail</span>
+ </div>
+ <h2 class="hero-title">Priority für produktive KI-Workflows.</h2>
+ <p class="hero-subtitle">
+ Free bleibt verfügbar. Mit Priority-Paketen werden passende Jobs bevorzugt in die Warteschlange eingeordnet.
+ </p>
+ </div>
+ <div class="hero-features">
+ <div class="feature-card">
+ <h3>Code kaufen, einlösen, schneller rechnen</h3>
+ <p>Nach dem Kauf erhältst du einen Prio-Code per E-Mail. Der Code gilt in diesem Browser für alle unterstützten Werkzeuge.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="pricing-grid" aria-label="Preise">
+ <article class="panel price-card">
+ <h2>Free</h2>
+ <p class="price">0 €</p>
+ <p>Alle Werkzeuge, normale Priorität.</p>
+ <ul>
+ <li>Bildgenerator, Musik, Video Studio und Tiefenkarte</li>
+ <li>Normale Warteschlange</li>
+ <li>Direkter Download im Browser</li>
+ </ul>
+ <a class="secondary" href="/#werkzeuge">Kostenlos starten</a>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Starter</h2>
+ <p class="price">4,90 € <span>/Monat</span></p>
+ <p>Priority für Bilder & Tiefenkarte.</p>
+ <ul>
+ <li>Bevorzugte Warteschlange für Bildjobs</li>
+ <li>Bevorzugte Warteschlange für Tiefenkarten</li>
+ <li>Aktivierung per Prio-Code</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_STARTER">KI Starter kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card price-card--featured">
+ <span class="badge">Beliebt</span>
+ <h2>KI Pro</h2>
+ <p class="price">14,90 € <span>/Monat</span></p>
+ <p>Priority für alles inkl. Musik/Video + LoRA bevorzugt.</p>
+ <ul>
+ <li>Priority für Bilder, Musik, Video und Tiefenkarten</li>
+ <li>LoRA-Verarbeitung bevorzugt</li>
+ <li>Für regelmäßige kreative Workflows</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_PRO">KI Pro kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+
+ <article class="panel price-card">
+ <h2>KI Business</h2>
+ <p class="price">39,90 € <span>/Monat</span></p>
+ <p>Höchste Priorität + 24h-Support.</p>
+ <ul>
+ <li>Höchste Priorität in der Warteschlange</li>
+ <li>24h-Support für produktive Nutzung</li>
+ <li>Für Teams und Agenturen</li>
+ </ul>
+ <a class="primary" href="https://support.panomity.com/cart/" data-hb-pid="HB_PID_BUSINESS">KI Business kaufen</a>
+ <p class="muted billing-note">Abrechnung & Kündigung bequem über unser Kundenportal (Panomity GmbH).</p>
+ </article>
+ </section>
+
+ <section class="panel" id="prio-code">
+ <h2>Prio-Code einlösen</h2>
+ <p class="muted">Der Code kommt nach dem Kauf per E-Mail und gilt in diesem Browser für alle Werkzeuge.</p>
+ <form class="redeem-form" id="prioCodeForm">
+ <div class="form-group">
+ <label for="prioCode">Prio-Code</label>
+ <input id="prioCode" name="prioCode" type="text" autocomplete="off" placeholder="KIWZ-AB2C-DE3F" />
+ </div>
+ <button class="primary" type="submit">Code speichern</button>
+ </form>
+ <p class="muted" id="prioCodeMessage" role="status" aria-live="polite"></p>
+ </section>
+
+ <section class="panel info" id="faq">
+ <h2>FAQ</h2>
+ <details class="details" open>
+ <summary>Wie läuft die Zahlung?</summary>
+ <p class="muted">Die Bestellung läuft über das Kundenportal der Panomity GmbH unter support.panomity.com.</p>
+ </details>
+ <details class="details">
+ <summary>Kann ich monatlich kündigen?</summary>
+ <p class="muted">Ja, die Priority-Pakete sind monatlich kündbar.</p>
+ </details>
+ <details class="details">
+ <summary>Bekomme ich eine Rechnung mit USt.?</summary>
+ <p class="muted">Ja, die Rechnung wird im Kundenportal mit ausgewiesener Umsatzsteuer bereitgestellt.</p>
+ </details>
+ <details class="details">
+ <summary>Was bedeutet Priority?</summary>
+ <p class="muted">Priority bedeutet eine bevorzugte Einordnung in der Warteschlange. Die tatsächliche Laufzeit hängt weiterhin von Jobgröße und Auslastung ab.</p>
+ </details>
+ </section>
+ </main>
+
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
+ </div>
+ <script>
+ document.getElementById('prioCodeForm').addEventListener('submit', function (event) {
+ event.preventDefault();
+ var input = document.getElementById('prioCode');
+ var message = document.getElementById('prioCodeMessage');
+ var code = input.value.trim().toUpperCase();
+ if (!code) {
+ message.textContent = 'Bitte gib deinen Prio-Code ein.';
+ return;
+ }
+ document.cookie = 'kiwz_prio=' + encodeURIComponent(code) + '; path=/; max-age=2592000; SameSite=Lax; Secure';
+ input.value = code;
+ message.textContent = 'Prio-Code gespeichert. Er gilt jetzt in diesem Browser für alle Werkzeuge.';
+ });
+ </script>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
+</html>
diff --git a/robots.txt b/robots.txt
new file mode 100644
index 0000000000000000000000000000000000000000..fd4e747af4676dc3614c8b80d6af325e0252c899
--- /dev/null
+++ b/robots.txt
@@ -0,0 +1,15 @@
+User-agent: *
+Allow: /
+Disallow: /service/
+Disallow: /api/
+Disallow: /gpuq/
+Disallow: /uploads/
+Disallow: /tmp/
+Disallow: /training/
+Disallow: /config/
+Disallow: /docs/
+Disallow: /xy/
+Disallow: /openclaw-media/
+Disallow: /creator-studio/
+
+Sitemap: https://kiwerkzeuge.de/sitemap.xml
diff --git a/service/gpuq-proxy.php b/service/gpuq-proxy.php
index 705dcbcdb44bc2406e89dfbe125fac89e9119065..7cd59f258af40a02456432e7b6c253d14e5a174d
--- a/service/gpuq-proxy.php
+++ b/service/gpuq-proxy.php
@@ -49,6 +49,7 @@
if (!isset($payload['payload']) || !is_array($payload['payload']) || $payload['payload'] === []) {
$payload['payload'] = new stdClass();
}
+ enforce_priority_code($payload, $config['priority_codes'] ?? []);
$executeUrl = trim((string)($payload['execute_url'] ?? ''));
if ($executeUrl === '') {
http_response_code(400);
@@ -186,6 +187,42 @@
return (string)$response;
}
+function enforce_priority_code(array &$payload, mixed $configuredCodes): void
+{
+ unset($payload['priority']);
+
+ $candidateCodes = [
+ trim((string)($payload['priority_code'] ?? '')),
+ trim((string)($_COOKIE['kiwz_prio'] ?? '')),
+ ];
+ unset($payload['priority_code']);
+
+ $priorityCodes = normalize_priority_codes($configuredCodes);
+ foreach ($candidateCodes as $code) {
+ $normalizedCode = strtoupper($code);
+ if ($normalizedCode !== '' && isset($priorityCodes[$normalizedCode])) {
+ $payload['priority'] = $priorityCodes[$normalizedCode];
+ return;
+ }
+ }
+}
+
+function normalize_priority_codes(mixed $configuredCodes): array
+{
+ $priorityCodes = [];
+ foreach ((array)$configuredCodes as $code => $level) {
+ if (!is_string($code)) {
+ continue;
+ }
+ $normalizedCode = strtoupper(trim($code));
+ $priorityLevel = trim((string)$level);
+ if ($normalizedCode !== '' && $priorityLevel !== '') {
+ $priorityCodes[$normalizedCode] = $priorityLevel;
+ }
+ }
+ return $priorityCodes;
+}
+
function stream_passthrough(string $url, int $timeout): void
{
header('Content-Type: text/event-stream');
diff --git a/sitemap.xml b/sitemap.xml
new file mode 100644
index 0000000000000000000000000000000000000000..80f3209fe612beaa8e992337421ea595a1774df0
--- /dev/null
+++ b/sitemap.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+ <url>
+ <loc>https://kiwerkzeuge.de/</loc>
+ <changefreq>weekly</changefreq>
+ <priority>1.0</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/tiefenkarte.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/stable-diffusion.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/music.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/video-studio.html</loc>
+ <changefreq>monthly</changefreq>
+ <priority>0.8</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/preise.html</loc>
+ <changefreq>weekly</changefreq>
+ <priority>0.9</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/impressum.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+ <url>
+ <loc>https://kiwerkzeuge.de/datenschutz.html</loc>
+ <changefreq>yearly</changefreq>
+ <priority>0.4</priority>
+ </url>
+</urlset>
diff --git a/stable-diffusion.html b/stable-diffusion.html
index a3c09fda22b5ed6248661257b752cb9d6442cee6..782effa4aef307166a501cc97eb3b277af56427f
--- a/stable-diffusion.html
+++ b/stable-diffusion.html
@@ -5,9 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bildgenerator | Text zu Bild, Inpainting & LoRA Training</title>
<meta name="description" content="Erstelle Bilder aus Text, bearbeite sie per Inpainting und trainiere eigene LoRA-Modelle. Schnelle Ergebnisse und direkter Download." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260206" />
<script defer src="/assets/sd-app.js?v=20260212-0811"></script>
@@ -47,10 +45,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab active">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -450,6 +450,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
diff --git a/tiefenkarte.html b/tiefenkarte.html
index 07bd12c382f4554b57a15e773bc382cbe4a11072..371e4dced5403aa8d5ae58c6105d7073831f33ca
--- a/tiefenkarte.html
+++ b/tiefenkarte.html
@@ -3,11 +3,19 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
- <title>Depth Studio | Tiefenkarte & Porträt-Effekt aus deinem Foto</title>
- <meta name="description" content="Erstelle in Sekunden eine Tiefenkarte (PNG) und einen Porträt-Effekt aus deinem Foto. Optional: kurzer 3D-Zoom-Clip." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <title>Tiefenkarte online erstellen | Depth Studio | kiwerkzeuge.de</title>
+ <meta name="description" content="Erstelle online in Sekunden eine Tiefenkarte (PNG), einen Porträt-Effekt und optional einen kurzen 3D-Zoom-Clip aus deinem Foto." />
+ <link rel="canonical" href="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta property="og:type" content="website" />
+ <meta property="og:locale" content="de_DE" />
+ <meta property="og:site_name" content="kiwerkzeuge.de" />
+ <meta property="og:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta property="og:description" content="Tiefenkarte, Porträt-Effekt und 3D-Zoom-Clip direkt im Browser erstellen." />
+ <meta property="og:url" content="https://kiwerkzeuge.de/tiefenkarte.html" />
+ <meta name="twitter:card" content="summary" />
+ <meta name="twitter:title" content="Tiefenkarte online erstellen | Depth Studio" />
+ <meta name="twitter:description" content="Erstelle Tiefenkarten aus Fotos direkt im Browser." />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css" />
<script defer src="https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js"></script>
@@ -48,10 +56,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab active">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab active">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<main class="main">
@@ -220,21 +230,29 @@
</details>
</section>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
- <!-- Matomo Analytics -->
-<script>
- var _paq = window._paq = window._paq || [];
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="https://statsdeluxe.com/statistics/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '149']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
-<!-- End Matomo Code -->
-</body>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
+ </body>
</html>
diff --git a/video-studio.html b/video-studio.html
index e13a640174ecbb4b02eb01c4eb10619f80c9e73e..482e150ae9cd30027889337ae90bb6d5c54e6f39
--- a/video-studio.html
+++ b/video-studio.html
@@ -7,9 +7,7 @@
<meta
name="description"
content="Plane lange Videos als Shot-Workflow: Script -> Shotlist, Charakter-Anker, Shot-Generierung, Kontinuität und Export als JSON." />
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
+ <link rel="stylesheet" href="/assets/fonts/inter.css" />
<script src="/assets/theme.js"></script>
<link rel="stylesheet" href="/assets/styles.css?v=20260227-10" />
<script defer src="/assets/video-app.js?v=20260227-9"></script>
@@ -49,10 +47,12 @@
</header>
<nav class="nav-tabs">
- <a href="/" class="nav-tab">Tiefenkarte</a>
+ <a href="/" class="nav-tab">Start</a>
+ <a href="/tiefenkarte.html" class="nav-tab">Tiefenkarte</a>
<a href="/stable-diffusion.html" class="nav-tab">Bildgenerator</a>
<a href="/music.html" class="nav-tab">Musik</a>
<a href="/video-studio.html" class="nav-tab active">Video Studio</a>
+ <a href="/preise.html" class="nav-tab">Preise</a>
</nav>
<nav class="stepper" aria-label="Ablauf">
@@ -413,6 +413,29 @@
</div>
</main>
+ <footer class="site-footer">
+ <p>© 2026 Panomity GmbH</p>
+ <nav aria-label="Footer">
+ <a href="/preise.html">Preise</a>
+ <a href="/impressum.html">Impressum</a>
+ <a href="/datenschutz.html">Datenschutz</a>
+ </nav>
+ </footer>
</div>
+ <!-- Matomo Analytics -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function() {
+ var u="https://statsdeluxe.com/statistics/";
+ _paq.push(['setTrackerUrl', u+'matomo.php']);
+ _paq.push(['setSiteId', '149']);
+ var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+ g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+ })();
+ </script>
+ <noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="https://statsdeluxe.com/statistics/matomo.php?idsite=149&rec=1" style="border:0;" alt="" /></p></noscript>
+ <!-- End Matomo Code -->
</body>
</html>
tokens used
115,865
Erledigt im Staging-Verzeichnis `/home/kiwerkzeuge.de/staging-build`.
Umgesetzt:
- neue SEO-Startseite `index.html`
- ausgelagerte `tiefenkarte.html`
- neue Seiten `preise.html`, `impressum.html`, `datenschutz.html`
- lokale Fonts auf allen HTML-Seiten
- einheitliche Navigation, Footer und Matomo auf allen öffentlichen Seiten
- `robots.txt` und `sitemap.xml`
- Priority-Code-Handling in `service/gpuq-proxy.php`
- `priority_codes`-Konfiguration in `config/gpuq-client.php`
- Abschlussbericht `kiwz_frontend_report.md`
Geprüft:
- `php -l config/gpuq-client.php` OK
- `php -l service/gpuq-proxy.php` OK
- JSON-LD parsebar
- Sitemap XML parsebar
- jede HTML-Seite genau ein `<h1>`
- keine Google-Fonts-Referenzen mehr
- Matomo auf allen acht öffentlichen HTML-Seiten
- sichtbare interne HTML-/Asset-Links OK
Hinweis: Die bewusst fehlenden App-JS-Dateien unter `/assets/*.js` habe ich nicht angefasst und im Report als offene/erwartete Staging-Ausnahme dokumentiert.