// SEO landing pages — keyword-targeted entry points for organic search.
//
// Each shell HTML sets:
//   window.__SEO_ID__     = '<page-id>'              // e.g. 'ai-agents-for-business'
//   window.__SEO_LOCALE__ = 'en' | 'de'
//
// Content lives in SEO_CONTENT[locale][id] below. Patterns/tokens match
// the rest of the site (SiteNav, SiteFooter, --accent, btn-primary, etc.).
//
// Honesty guard (see /workspace memory): every claim here either lives
// already on the home / pricing pages, or is a clear product positioning
// statement. No invented SOC 2 cert, no "3000+ integrations", no
// "estimate before task". SOC 2 is described exactly as the home does:
// "audit in progress · Q3 2026".

const SEO_UI = {
  en: {
    eyebrow:           'SEO landing',
    deutschPill:       'Auf Deutsch lesen',
    inChat:            'It happens in the chat — no new dashboard.',
    capabilitiesHead:  'What Octodus actually does on this',
    compareHead:       'How Octodus compares',
    compareCol1:       'Octodus',
    faqHead:           'Common questions',
    finalH:            'Try Octodus on a real task.',
    finalSub:          '$15 of free credits on your first message. No card. Lives in the Telegram chat you already use.',
    finalCta:          'Hire octodus',
    finalGhost:        'See the full capabilities',
    relatedHead:       'Related pages',
    breadcrumbHome:    'Home',
    languageLabel:     'Language',
    enLabel:           'English (US)',
    deLabel:           'Deutsch (DE)',
  },
  de: {
    eyebrow:           'SEO Landing',
    deutschPill:       'Read in English',
    inChat:            'Alles passiert im Chat — kein neues Dashboard.',
    capabilitiesHead:  'Was Octodus dafür konkret tut',
    compareHead:       'Octodus im Vergleich',
    compareCol1:       'Octodus',
    faqHead:           'Häufige Fragen',
    finalH:            'Testen Sie Octodus an einer echten Aufgabe.',
    finalSub:          '15 $ Gratis-Guthaben bei der ersten Nachricht. Keine Karte. Lebt im Telegram-Chat, den Ihr Team schon nutzt.',
    finalCta:          'Octodus engagieren',
    finalGhost:        'Alle Fähigkeiten ansehen',
    relatedHead:       'Verwandte Seiten',
    breadcrumbHome:    'Startseite',
    languageLabel:     'Sprache',
    enLabel:           'English (US)',
    deLabel:           'Deutsch (DE)',
  },
};

// Canonical home for all hreflang / canonical headers.
const SEO_ORIGIN = 'https://octodus.com';

// Static cross-link registry — drives hreflang + footer language switcher.
// Each entry is the URL path relative to origin (no leading slash for root pages
// because the rest of the site uses bare filenames; absolute /de/… for German).
const SEO_PAGES = {
  // EN (US market) — at repo root, sibling to existing Capabilities.html etc.
  en: {
    'ai-agents-for-business':   { path: 'ai-agents-for-business.html',   sibling: { locale: 'de', id: 'ki-agenten-fuer-unternehmen' } },
    'n8n-alternative':          { path: 'n8n-alternative.html',          sibling: { locale: 'de', id: 'n8n-alternative' } },
    'telegram-ai-bot':          { path: 'telegram-ai-bot.html',          sibling: { locale: 'de', id: 'telegram-ki-bot' } },
    'ai-assistant':             { path: 'ai-assistant.html',             sibling: { locale: 'de', id: 'ki-assistent' } },
    'claude-code-alternative':  { path: 'claude-code-alternative.html',  sibling: { locale: 'de', id: 'chatgpt-alternative' } },
  },
  de: {
    'ki-agenten-fuer-unternehmen': { path: '/de/ki-agenten-fuer-unternehmen.html', sibling: { locale: 'en', id: 'ai-agents-for-business' } },
    'n8n-alternative':             { path: '/de/n8n-alternative.html',             sibling: { locale: 'en', id: 'n8n-alternative' } },
    'telegram-ki-bot':             { path: '/de/telegram-ki-bot.html',             sibling: { locale: 'en', id: 'telegram-ai-bot' } },
    'ki-assistent':                { path: '/de/ki-assistent.html',                sibling: { locale: 'en', id: 'ai-assistant' } },
    'chatgpt-alternative':         { path: '/de/chatgpt-alternative.html',         sibling: { locale: 'en', id: 'claude-code-alternative' } },
    'ki-fuer-mittelstand':         { path: '/de/ki-fuer-mittelstand.html',         sibling: null },
  },
};

// Page content — keyword-first H1, native copy per locale, real OctoDus
// capabilities only.
const SEO_CONTENT = {
  en: {
    'ai-agents-for-business': {
      eyebrow:  'For teams · business workflows',
      h1Top:    'AI agents for business',
      h1Em:     'that actually ship work.',
      lead:     'Most AI agents draft a reply. Octodus is the AI agent for business that opens the PR, sends the brief, runs the cleanup script and chases the partner — inside the Telegram group your team already uses.',
      kicker:   'AI agent for business · in chat · $50/seat',
      capabilities: [
        { k: 'Code',       v: 'Voice notes turn into 100+ structured dev-ready prompts and small scripts your engineers can run as-is.' },
        { k: 'Design',     v: 'Drop a brief, get a print-ready PDF or social asset after 16 chat-driven iterations — like Maya’s 3×2 m banner.' },
        { k: 'Planning',   v: 'Pre-call briefings, deadline chasing, multi-org coordination — like the $240K grant Ana ran across 5 partners.' },
        { k: 'Research',   v: 'Step-by-step diagnostics for DNS, infra, vendor stacks. Patient until it actually works.' },
        { k: 'Sales',      v: 'Recognises hot leads from chat context, files the task, drafts the demo script, schedules follow-up.' },
        { k: 'Automation', v: 'Self-healing infra: detects stuck sessions, drafts and runs the cleanup, posts the receipts. While you sleep.' },
      ],
      compare: {
        cols: ['Workflow builders (Zapier, n8n)', 'ChatGPT Team / Claude'],
        rows: [
          ['Surface',                   'In your group chat',                    'Dashboard you have to draw a flow in',  'A separate tab nobody opens'],
          ['Memory across the team',    'Per-team + per-project',                'None — every run starts fresh',          'Per-user only'],
          ['Ships actions',             'Yes — PRs, files, scripts, sends',      'Only if you wired the node',             'Drafts; you have to copy out'],
          ['Setup',                     'Add the bot, mention it',               'Engineer-only',                          'Per-seat onboarding'],
          ['Pricing',                   '$50/seat · $15 free credits',           'Per-task or per-run',                    '$25–$30/seat'],
        ],
      },
      faq: [
        { q: 'What counts as an "AI agent for business" here?',
          a: 'An AI agent that does the work — not just answers questions. Octodus reads the message, picks the right capability (code, design, research, sales, automation), runs it, and posts a receipt in chat so the team can audit what shipped.' },
        { q: 'How is this different from an AI chatbot?',
          a: 'A chatbot replies. Octodus ships. Every action posts a receipt — the script it ran, the file it generated, the PR it opened — so you can see what got done and reverse anything that’s wrong.' },
        { q: 'Does Octodus train on our business data?',
          a: 'No. Every team gets its own isolated memory. We never feed your messages back into model training, and you can wipe memory from chat at any time.' },
        { q: 'Do we need IT to roll this out?',
          a: 'No for Team and Solo. Add @octodus_bot to a Telegram group and mention it. Enterprise involves IT for SSO/SAML, audit logs and data residency.' },
        { q: 'What integrations are live today?',
          a: 'Telegram, Notion, Linear, Airtable, Google Drive/Docs/Calendar/Gmail, GitHub and HubSpot are live. Slack, Discord, WhatsApp, GitLab, Vercel, Sentry, Salesforce and others are in Beta — see the Integrations page for the current matrix.' },
        { q: 'What does it cost to try?',
          a: '$15 of free credits on the first message — no card. After that it’s $50 per seat per month on the Team plan. Solo founders just buy one seat.' },
      ],
    },

    'n8n-alternative': {
      eyebrow:  'Comparison · workflow automation',
      h1Top:    'An n8n alternative',
      h1Em:     'built for teams, not for nodes.',
      lead:     'n8n is a workflow graph you have to draw. Octodus is an AI coworker you mention. Same outcome — shipped work — without engineer-only flow editing, without a new dashboard, and without per-execution billing.',
      kicker:   'n8n alternative · chat-first · per-seat',
      capabilities: [
        { k: 'No graph to draw',       v: 'You mention @octodus_bot like a teammate. It picks the right capability and runs it — no nodes, no triggers, no branches to wire.' },
        { k: 'Lives in chat',          v: 'Telegram today, Slack/Discord/WhatsApp in Beta. The work shows up where the team already talks.' },
        { k: 'Per-seat, not per-run',  v: '$50/seat/month with $15 free credits to start. No per-execution surprise bills when something loops.' },
        { k: 'OAuth integrations',     v: 'Google, Notion, GitHub, Linear, Airtable, HubSpot today. Each scoped, revocable in one click.' },
        { k: 'Memory, not workflows',  v: 'Per-team and per-project memory means you teach it the rule once. n8n stores nothing between runs.' },
        { k: 'Self-healing infra',     v: 'Detects stuck sessions, drafts and runs cleanup, posts before/after — like Dan’s 27 GB → 124 MB at 3:14 AM.' },
      ],
      compare: {
        cols: ['n8n', 'Zapier'],
        rows: [
          ['Author',                    'Anyone in the chat',                'Engineer who knows the visual editor',  'Power user · paid seats'],
          ['Surface',                   'Telegram group + DM',               'n8n dashboard',                         'Zapier dashboard'],
          ['Memory across runs',        'Per-team + per-project',            'None',                                  'None'],
          ['Self-hosting',              'Not required',                      'Self-hosted or n8n.cloud',              'SaaS only'],
          ['Pricing',                   '$50/seat · $15 free',               '€20+/mo + per-execution',               '$19.99+/mo per Zap volume'],
          ['"Just do it" voice notes',  'Yes',                               'No',                                    'No'],
        ],
      },
      faq: [
        { q: 'Is Octodus a drop-in n8n replacement?',
          a: 'For most chat-driven workflows — drafting, follow-ups, posting receipts, simple coordination, ad-hoc scripts — yes. For deep multi-system orchestration that absolutely needs a deterministic flow graph, n8n still has a place. We co-exist with it for some teams.' },
        { q: 'Can Octodus call external APIs?',
          a: 'Yes via OAuth integrations and ad-hoc scripts it writes and runs itself. The current live set is Telegram, Notion, Linear, Airtable, Google suite, GitHub, HubSpot. Slack, Discord, WhatsApp, GitLab, Vercel, Sentry and Salesforce are in Beta.' },
        { q: 'How is per-seat fairer than per-execution?',
          a: 'On n8n / Zapier a loop or a popular workflow can blow your bill. On Octodus, one teammate = one seat, $50/mo. Your costs scale with people, not with how often your team uses it.' },
        { q: 'Can we self-host Octodus like n8n?',
          a: 'Today Octodus is SaaS — bot in Telegram, models in our cloud. Enterprise plans support data-residency options (EU, US, custom) but we don’t ship a self-host bundle. If that’s a hard constraint, n8n is still the right answer for you.' },
      ],
    },

    'telegram-ai-bot': {
      eyebrow:  'Telegram-native · group chat',
      h1Top:    'The Telegram AI bot',
      h1Em:     'your team actually uses.',
      lead:     'Most Telegram AI bots answer one message and forget. Octodus is the Telegram AI bot that owns the work end-to-end — reads the voice note, ships the brief, opens the PR, sets the TTL, posts the receipt — without leaving the group chat.',
      kicker:   'Telegram AI bot · groups + DMs · OAuth',
      capabilities: [
        { k: 'Voice notes in',         v: 'Drop a 47-second voice note. Get back structured prompts, briefs, or shipped scripts — same thread.' },
        { k: 'Photos & documents in',  v: 'Snap the whiteboard, drop a PDF. Octodus turns it into a draft article, a checklist, or a follow-up plan.' },
        { k: 'Groups + DMs',           v: 'In a group it only acts on messages it’s mentioned in or threads it replied to. It doesn’t silently read everything.' },
        { k: 'Per-team memory',        v: 'Each chat has its own long-term memory and rules. Per-project workspaces too.' },
        { k: 'OAuth, least-privilege', v: 'Scope it to specific Notion workspaces, Google Drive folders, or GitHub repos. Revoke any time.' },
        { k: 'Receipts in chat',       v: 'Every shipped action posts what changed. Reverse drafts, PRs and scheduled sends with one reply.' },
      ],
      compare: {
        cols: ['Other Telegram AI bots', 'ChatGPT in browser'],
        rows: [
          ['Owns the work',             'Yes — ships, doesn’t just draft',     'No — one-shot Q&A',                  'No — you copy the answer out'],
          ['Team-wide memory',          'Per-team + per-project',                  'None',                                'Per-user only'],
          ['Connects your stack',       'OAuth: Google, Notion, GitHub, …',         'Usually none',                        'Manual copy-paste'],
          ['Voice notes in',            'Yes — first-class input',                 'Some',                                'No'],
          ['Pricing',                   '$50/seat · $15 free',                      'Free / pay-per-message',              '$20/seat'],
        ],
      },
      faq: [
        { q: 'How do I install the Telegram AI bot?',
          a: 'Open Telegram, search for @octodus_bot, send /start in a DM or add it to a group and mention it once. $15 of free credits is granted on the first message — no card.' },
        { q: 'Will the bot read every message in our group?',
          a: 'No. It only acts on messages where it’s mentioned (@octodus_bot) or threads it has already replied to. You can audit everything it has touched from the dashboard or by asking it in chat.' },
        { q: 'Can I scope what it connects to?',
          a: 'Yes. Integrations are OAuth and least-privilege per team — only the Notion workspaces, Google Drive folders, or GitHub repos you authorise. Revoking access kills the tokens immediately.' },
        { q: 'Does it work in private channels and supergroups?',
          a: 'Yes for supergroups today (mention it like any user). Private-channel and Topics support is rolling out — check the Integrations page for the current matrix.' },
        { q: 'What languages does the Telegram AI bot speak?',
          a: 'EN, DE, ES and FR are first-class out of the box. Mixed-language threads are fine.' },
      ],
    },

    'ai-assistant': {
      eyebrow:  'AI assistant · for whole teams',
      h1Top:    'An AI assistant that ships',
      h1Em:     '— not just answers.',
      lead:     'Most AI assistants reply. Octodus is the AI assistant that runs the script, drafts the brief, opens the PR and follows up the lead — in the Telegram chat your team is already in.',
      kicker:   'AI assistant for business · in chat · per-seat',
      capabilities: [
        { k: 'From answer to action',       v: 'Voice notes, mentions and dropped docs become shipped work — scripts run, files generated, PRs opened. Each action posts a receipt in chat.' },
        { k: 'Per-team memory & rules',     v: 'Teach it your rule once ("draft, wait for OK before send"). It remembers across the whole team and per project.' },
        { k: 'Long context window',         v: 'Long-form docs, chat history and project knowledge — kept in mind, not lost between turns.' },
        { k: 'OAuth-only integrations',     v: 'Google, Notion, GitHub, Linear, Airtable, HubSpot — least-privilege, revoke any time.' },
        { k: 'Lives where the team talks',  v: 'Telegram today. Slack, Discord and WhatsApp in Beta. No new tab to open.' },
        { k: 'EN · DE · ES · FR',           v: 'Native multilingual product. Switch language mid-thread; the assistant follows.' },
      ],
      compare: {
        cols: ['ChatGPT Team', 'Slack AI'],
        rows: [
          ['Ships work',                    'Yes — scripts, PRs, files, sends',     'Drafts only',                          'Summarises threads'],
          ['Memory across the team',         'Per-team + per-project',              'Per-user',                              'Per-channel summaries'],
          ['Surface',                       'Telegram group + DM',                  'chat.openai.com',                       'Slack only'],
          ['Voice / photo / doc in',        'First-class',                          'Some',                                  'No'],
          ['Pricing',                       '$50/seat · $15 free',                  '$25–$30/seat',                          '$10/seat add-on'],
        ],
      },
      faq: [
        { q: 'Can the AI assistant act on its own?',
          a: 'Yes within bounds. Reversible actions (drafts, scheduled sends, PRs) ship and post receipts; irreversible actions (paid, destructive) require confirmation in chat. You teach the line once.' },
        { q: 'Will it see our entire chat history?',
          a: 'No. In a group it only acts on messages where it’s mentioned or threads it replied to. In a DM, only what you send it.' },
        { q: 'Is it safe to plug into our Google / Notion / GitHub?',
          a: 'Integrations are OAuth and least-privilege per team. You authorise specific workspaces / repos / folders, not your whole account. Revoke any time and tokens die immediately.' },
        { q: 'How does it compare to a virtual employee service?',
          a: 'Virtual employee services are humans + a wrapper. Octodus is the AI itself, $50/seat. There’s no schedule, no time zone, no HR. The work happens in the chat the moment you mention it.' },
        { q: 'Can I cancel any time?',
          a: 'Yes — cancel from chat or the dashboard. The paid period continues to the end of the cycle.' },
      ],
    },

    'claude-code-alternative': {
      eyebrow:  'For teams that outgrew terminal AI',
      h1Top:    'A Claude Code alternative',
      h1Em:     'the whole team can mention.',
      lead:     'Claude Code lives in your terminal — one developer, one repo, one session. Octodus is powered by Claude and lives in the Telegram chat your team already uses. Same model intelligence, distributed to designers, sales, ops and engineers in the same thread.',
      kicker:   'Claude-powered · team-wide · in chat',
      capabilities: [
        { k: 'Powered by Anthropic',     v: 'Built on Claude. Same reasoning quality, surfaced in the chat your team already runs.' },
        { k: 'Whole team, not one dev',  v: 'Designers, sales, ops and engineers in the same Telegram thread — each with per-team memory and rules.' },
        { k: 'Reads + ships code',       v: 'Voice note → 112 prompts + scripts. PRs opened, reviews drafted, releases tagged.' },
        { k: 'Not only code',            v: 'Briefs, banners, demo scripts, lead follow-ups, multi-org coordination — same teammate, six capabilities.' },
        { k: 'OAuth, least-privilege',   v: 'Scope it to specific GitHub repos, Notion workspaces, Google Drive folders. Revoke any time.' },
        { k: 'Predictable pricing',      v: '$50/seat/month with $15 free credits — no per-token meter ticking while you think.' },
      ],
      compare: {
        cols: ['Claude Code', 'Cursor'],
        rows: [
          ['Audience',                      'Whole team in chat',                   'One developer in terminal',             'One developer in IDE'],
          ['Surface',                       'Telegram group + DM',                  'Local terminal',                        'Local IDE'],
          ['Ships beyond code',             'Briefs, design, sales, ops, automation','Code only',                            'Code only'],
          ['Per-team memory',               'Yes',                                  'Per-session',                           'Per-project'],
          ['Pricing',                       '$50/seat · $15 free',                  'Per-token API',                         '$20/seat'],
        ],
      },
      faq: [
        { q: 'Does Octodus use Claude under the hood?',
          a: 'Yes. Octodus is built on Anthropic’s Claude as the reasoning layer. See the "Built on" strip on the home page — Anthropic, Google Cloud, EigenLayer and Ditto.' },
        { q: 'Will it replace my IDE?',
          a: 'No. Octodus is for the work the chat handles — voice-note specs, PR reviews, design loops, sales follow-ups, ops coordination. Engineers still write code in their IDE; Octodus drafts the prompts, runs the scripts, opens the PRs.' },
        { q: 'Can it act on our repo without a human in the loop?',
          a: 'Reversible actions (PRs, drafts, scheduled sends) yes — every one posts a receipt in chat. Irreversible actions ask for confirmation first.' },
        { q: 'Is per-seat fairer than per-token?',
          a: 'For team use, yes — your bill scales with people, not with how often Claude is thinking. $15 free credits to find your real usage, then $50/seat.' },
      ],
    },
  },

  de: {
    'ki-agenten-fuer-unternehmen': {
      eyebrow:  'Für Teams · Geschäftsabläufe',
      h1Top:    'KI-Agenten für Unternehmen,',
      h1Em:     'die wirklich liefern.',
      lead:     'Die meisten KI-Agenten schreiben einen Entwurf. Octodus ist der KI-Agent fürs Unternehmen, der den Pull Request öffnet, das Briefing verschickt, das Cleanup-Skript laufen lässt und dem Partner hinterherräumt — im Telegram-Chat, den Ihr Team schon nutzt.',
      kicker:   'KI-Agent fürs Unternehmen · im Chat · 50 $/Sitz',
      capabilities: [
        { k: 'Code',           v: 'Sprachnachrichten werden zu 100+ strukturierten, dev-ready Prompts und kleinen Skripten, die Ihre Entwickler so übernehmen können.' },
        { k: 'Design',         v: 'Briefing droppen, druckfertige PDF oder Social-Asset zurückbekommen — wie Mayas 3×2 m Banner nach 16 Iterationen.' },
        { k: 'Planung',        v: 'Pre-Call-Briefings, Deadline-Tracking, Koordination zwischen Organisationen — wie Anas Förderprojekt mit 5 Partnern.' },
        { k: 'Recherche',      v: 'Schritt-für-Schritt-Diagnose für DNS, Infrastruktur, Vendor-Stack. Geduldig, bis es wirklich läuft.' },
        { k: 'Vertrieb',       v: 'Erkennt heiße Leads aus dem Chat-Kontext, legt die Aufgabe an, schreibt das Demo-Skript, plant den Follow-up.' },
        { k: 'Automation',     v: 'Self-Healing-Infra: erkennt hängende Sessions, schreibt und führt das Cleanup aus, postet die Belege. Während Sie schlafen.' },
      ],
      compare: {
        cols: ['Workflow-Tools (Zapier, n8n)', 'ChatGPT Team / Claude'],
        rows: [
          ['Oberfläche',                'Im Gruppen-Chat',                       'Dashboard mit Flow-Editor',            'Separater Tab, den niemand öffnet'],
          ['Team-Gedächtnis',           'Pro Team + pro Projekt',                'Keins — jeder Run startet leer',        'Nur pro Nutzer'],
          ['Liefert Aktionen',           'Ja — PRs, Dateien, Skripte, Versand',  'Nur wenn der Node verdrahtet ist',     'Entwürfe; zum Rauskopieren'],
          ['Einrichtung',               'Bot dazu, erwähnen',                    'Nur durch Entwickler',                  'Per-Sitz-Onboarding'],
          ['Preis',                     '50 $/Sitz · 15 $ gratis',               'Pro Task oder Run',                     '25–30 $/Sitz'],
        ],
      },
      faq: [
        { q: 'Was zählt hier als "KI-Agent fürs Unternehmen"?',
          a: 'Ein KI-Agent, der die Arbeit erledigt — nicht nur Fragen beantwortet. Octodus liest die Nachricht, wählt die passende Fähigkeit (Code, Design, Recherche, Vertrieb, Automation), führt sie aus und postet im Chat den Beleg, damit das Team prüfen kann, was geliefert wurde.' },
        { q: 'Wie unterscheidet sich das von einem KI-Chatbot?',
          a: 'Ein Chatbot antwortet. Octodus liefert. Jede Aktion postet einen Beleg — das ausgeführte Skript, die generierte Datei, der eröffnete PR — Sie sehen, was passiert ist, und können bei Fehlern eingreifen.' },
        { q: 'Trainiert Octodus mit unseren Daten?',
          a: 'Nein. Jedes Team hat ein eigenes, isoliertes Gedächtnis. Wir nutzen Ihre Nachrichten nie zum Modelltraining, und Sie können den Speicher jederzeit aus dem Chat löschen.' },
        { q: 'Brauchen wir die IT für den Rollout?',
          a: 'Nein für Team und Solo. @octodus_bot in eine Telegram-Gruppe einladen und erwähnen — fertig. Enterprise nutzt IT für SSO/SAML, Audit-Logs und Daten-Residenz (EU/US/custom).' },
        { q: 'Welche Integrationen sind heute live?',
          a: 'Live: Telegram, Notion, Linear, Airtable, Google Drive/Docs/Calendar/Gmail, GitHub, HubSpot. Beta: Slack, Discord, WhatsApp, GitLab, Vercel, Sentry, Salesforce u. a. — aktuelle Matrix auf der Integrations-Seite.' },
        { q: 'Was kostet ein Test?',
          a: '15 $ Gratis-Guthaben bei der ersten Nachricht — ohne Karte. Danach 50 $ pro Sitz und Monat (Team). Solo-Gründer kaufen einfach einen Sitz.' },
      ],
    },

    'n8n-alternative': {
      eyebrow:  'Vergleich · Workflow-Automation',
      h1Top:    'Eine n8n Alternative',
      h1Em:     'für Teams statt für Knoten.',
      lead:     'n8n ist ein Workflow-Graph, den Sie selbst zeichnen müssen. Octodus ist ein KI-Mitarbeiter, den Sie im Chat erwähnen. Gleiches Ergebnis — fertige Arbeit — ohne Entwickler-only Editor, ohne neues Dashboard und ohne Per-Execution-Rechnung.',
      kicker:   'n8n Alternative · Chat-first · pro Sitz',
      capabilities: [
        { k: 'Kein Graph zu zeichnen',  v: 'Sie erwähnen @octodus_bot wie einen Kollegen. Octodus wählt die richtige Fähigkeit und führt sie aus — keine Nodes, Trigger oder Verzweigungen.' },
        { k: 'Lebt im Chat',            v: 'Heute Telegram, Slack/Discord/WhatsApp in Beta. Die Arbeit erscheint dort, wo das Team ohnehin redet.' },
        { k: 'Pro Sitz, nicht pro Run', v: '50 $/Sitz/Monat mit 15 $ Gratis-Guthaben. Keine Überraschungsrechnung, wenn ein Workflow in der Schleife hängt.' },
        { k: 'OAuth-Integrationen',     v: 'Google, Notion, GitHub, Linear, Airtable, HubSpot heute. Pro Team scoped, per Klick widerrufbar.' },
        { k: 'Gedächtnis statt Flows',  v: 'Pro Team und pro Projekt — eine Regel einmal beibringen, gilt dauerhaft. n8n speichert zwischen Runs nichts.' },
        { k: 'Self-Healing-Infra',      v: 'Erkennt hängende Sessions, schreibt und führt das Cleanup aus, postet Vorher/Nachher — wie Dans 27 GB → 124 MB um 3:14 Uhr.' },
      ],
      compare: {
        cols: ['n8n', 'Zapier'],
        rows: [
          ['Wer baut',                  'Jeder im Chat',                         'Entwickler mit Editor-Know-how',        'Power-User · bezahlte Sitze'],
          ['Oberfläche',                'Telegram-Gruppe + DM',                  'n8n-Dashboard',                         'Zapier-Dashboard'],
          ['Gedächtnis über Runs',      'Pro Team + pro Projekt',                'Keins',                                 'Keins'],
          ['Self-Hosting',              'Nicht nötig',                           'Self-hosted oder n8n.cloud',            'Nur SaaS'],
          ['Preis',                     '50 $/Sitz · 15 $ gratis',               '20+ €/Mt. + pro Execution',             '19,99+ $/Mt. nach Zap-Volumen'],
          ['"Mach einfach" per Voice',  'Ja',                                    'Nein',                                  'Nein'],
        ],
      },
      faq: [
        { q: 'Ist Octodus ein Drop-in-Ersatz für n8n?',
          a: 'Für die meisten Chat-getriebenen Abläufe — Entwürfe, Follow-ups, Belege, leichte Koordination, Ad-hoc-Skripte — ja. Für tiefe System-Orchestrierung, die einen deterministischen Flow-Graphen braucht, hat n8n weiter seinen Platz. Manche Teams nutzen beides.' },
        { q: 'Kann Octodus externe APIs aufrufen?',
          a: 'Ja, über OAuth-Integrationen und Ad-hoc-Skripte, die Octodus selbst schreibt und ausführt. Live: Telegram, Notion, Linear, Airtable, Google-Suite, GitHub, HubSpot. In Beta: Slack, Discord, WhatsApp, GitLab, Vercel, Sentry, Salesforce.' },
        { q: 'Warum ist Per-Sitz fairer als Per-Execution?',
          a: 'Bei n8n / Zapier kann eine Schleife oder ein populärer Workflow Ihre Rechnung sprengen. Bei Octodus ist ein Mitarbeiter = ein Sitz, 50 $/Mt. Die Kosten skalieren mit Menschen, nicht mit Nutzungsintensität.' },
        { q: 'Können wir Octodus wie n8n selbst hosten?',
          a: 'Heute ist Octodus SaaS — Bot in Telegram, Modelle in unserer Cloud. Enterprise bietet Daten-Residenz (EU/US/custom), aber kein Self-Host-Bundle. Wenn das eine harte Vorgabe ist, bleibt n8n die richtige Wahl.' },
      ],
    },

    'telegram-ki-bot': {
      eyebrow:  'Telegram-nativ · Gruppen-Chat',
      h1Top:    'Der Telegram-KI-Bot,',
      h1Em:     'den Ihr Team wirklich nutzt.',
      lead:     'Die meisten Telegram-KI-Bots beantworten eine Nachricht und vergessen sie wieder. Octodus ist der Telegram-KI-Bot, der die Arbeit Ende zu Ende übernimmt — liest die Sprachnachricht, liefert das Briefing, eröffnet den PR, setzt die TTL, postet den Beleg — ohne dass jemand den Gruppen-Chat verlässt.',
      kicker:   'Telegram-KI-Bot · Gruppen + DMs · OAuth',
      capabilities: [
        { k: 'Sprachnachrichten rein',     v: '47 Sekunden Voice droppen. Heraus kommen strukturierte Prompts, Briefings oder fertige Skripte — gleicher Thread.' },
        { k: 'Fotos und Dokumente rein',   v: 'Whiteboard fotografieren, PDF droppen. Octodus macht daraus einen Artikel-Entwurf, eine Checkliste oder einen Follow-up-Plan.' },
        { k: 'Gruppen + DMs',              v: 'In Gruppen handelt der Bot nur bei Erwähnung oder in Threads, in denen er bereits geantwortet hat. Er liest nicht still alles mit.' },
        { k: 'Team-Gedächtnis',            v: 'Jeder Chat hat sein eigenes Langzeit-Gedächtnis und eigene Regeln. Pro-Projekt-Workspaces inklusive.' },
        { k: 'OAuth, least-privilege',     v: 'Begrenzbar auf einzelne Notion-Workspaces, Google-Drive-Ordner oder GitHub-Repos. Jederzeit widerrufbar.' },
        { k: 'Belege im Chat',             v: 'Jede ausgeführte Aktion postet, was passiert ist. Entwürfe, PRs und geplante Sendungen lassen sich mit einer Antwort zurücknehmen.' },
      ],
      compare: {
        cols: ['Andere Telegram-KI-Bots', 'ChatGPT im Browser'],
        rows: [
          ['Liefert die Arbeit',         'Ja — nicht nur Entwurf',                'Nein — One-shot-Antwort',              'Nein — Antwort kopieren'],
          ['Team-weites Gedächtnis',     'Pro Team + pro Projekt',                'Keins',                                'Nur pro Nutzer'],
          ['Stack-Anbindung',             'OAuth: Google, Notion, GitHub, …',     'Meist keine',                          'Copy-paste'],
          ['Sprachnachrichten rein',      'Ja — first-class',                     'Manchmal',                             'Nein'],
          ['Preis',                       '50 $/Sitz · 15 $ gratis',              'Gratis / pro Nachricht',               '20 $/Sitz'],
        ],
      },
      faq: [
        { q: 'Wie installiere ich den Telegram-KI-Bot?',
          a: 'Telegram öffnen, @octodus_bot suchen, /start im DM senden oder den Bot in eine Gruppe einladen und einmal erwähnen. 15 $ Gratis-Guthaben gibt es bei der ersten Nachricht — keine Karte.' },
        { q: 'Liest der Bot jede Nachricht in unserer Gruppe?',
          a: 'Nein. Er reagiert nur, wenn er erwähnt wird (@octodus_bot) oder bereits in einem Thread aktiv war. Was er angefasst hat, lässt sich im Dashboard prüfen oder direkt im Chat erfragen.' },
        { q: 'Kann ich kontrollieren, worauf er Zugriff hat?',
          a: 'Ja. Integrationen sind OAuth und least-privilege pro Team — nur die Notion-Workspaces, Google-Drive-Ordner oder GitHub-Repos, die Sie freigeben. Widerruf killt die Tokens sofort.' },
        { q: 'Funktioniert er in privaten Kanälen und Supergruppen?',
          a: 'In Supergruppen heute (wie jeder Nutzer erwähnen). Private-Kanal- und Topics-Support kommt schrittweise — aktuelle Matrix auf der Integrations-Seite.' },
        { q: 'Welche Sprachen spricht der Telegram-KI-Bot?',
          a: 'EN, DE, ES und FR sind first-class. Auch Sprachwechsel im selben Thread sind kein Problem.' },
      ],
    },

    'ki-assistent': {
      eyebrow:  'KI-Assistent · für ganze Teams',
      h1Top:    'Ein KI-Assistent, der mitarbeitet',
      h1Em:     '— nicht nur antwortet.',
      lead:     'Die meisten KI-Assistenten antworten nur. Octodus ist der KI-Assistent, der das Skript ausführt, das Briefing schreibt, den PR eröffnet und beim Lead nachfasst — im Telegram-Chat, den Ihr Team schon nutzt.',
      kicker:   'KI-Assistent fürs Unternehmen · im Chat · pro Sitz',
      capabilities: [
        { k: 'Von der Antwort zur Tat',     v: 'Sprachnachrichten, Erwähnungen und gedroppte Dokumente werden zu fertiger Arbeit — Skripte laufen, Dateien entstehen, PRs werden eröffnet. Jede Aktion postet einen Beleg im Chat.' },
        { k: 'Team-Gedächtnis + Regeln',    v: 'Eine Regel einmal beibringen ("Entwurf, auf OK warten") — sie gilt fürs ganze Team und pro Projekt.' },
        { k: 'Großes Kontextfenster',        v: 'Lange Dokumente, Chat-Historie und Projektwissen bleiben präsent, gehen zwischen Turns nicht verloren.' },
        { k: 'OAuth-only Integrationen',     v: 'Google, Notion, GitHub, Linear, Airtable, HubSpot — least-privilege, jederzeit widerrufbar.' },
        { k: 'Dort, wo das Team redet',     v: 'Telegram heute. Slack, Discord und WhatsApp in Beta. Kein neuer Tab nötig.' },
        { k: 'EN · DE · ES · FR',           v: 'Mehrsprachiges Produkt von Haus aus. Sprachwechsel im Thread — der Assistent folgt.' },
      ],
      compare: {
        cols: ['ChatGPT Team', 'Slack AI'],
        rows: [
          ['Liefert Arbeit',                'Ja — Skripte, PRs, Dateien, Versand',  'Nur Entwürfe',                         'Fasst Threads zusammen'],
          ['Team-Gedächtnis',                'Pro Team + pro Projekt',              'Pro Nutzer',                            'Pro Channel'],
          ['Oberfläche',                    'Telegram-Gruppe + DM',                  'chat.openai.com',                       'Nur Slack'],
          ['Voice / Foto / Dokument rein',  'First-class',                          'Teilweise',                             'Nein'],
          ['Preis',                          '50 $/Sitz · 15 $ gratis',              '25–30 $/Sitz',                           '10 $/Sitz Add-on'],
        ],
      },
      faq: [
        { q: 'Darf der KI-Assistent eigenständig handeln?',
          a: 'Ja innerhalb klarer Grenzen. Reversible Aktionen (Entwürfe, geplanter Versand, PRs) laufen und posten Belege; irreversible Aktionen (Bezahlung, Löschungen) fragen vorher im Chat nach. Die Linie definieren Sie einmal.' },
        { q: 'Sieht der Assistent unsere komplette Chat-Historie?',
          a: 'Nein. In Gruppen handelt er nur bei Erwähnung oder in Threads, in denen er bereits aktiv war. Im DM nur das, was Sie ihm direkt senden.' },
        { q: 'Ist es sicher, Google / Notion / GitHub anzubinden?',
          a: 'Integrationen sind OAuth und least-privilege pro Team. Sie autorisieren konkrete Workspaces / Repos / Ordner — nicht den ganzen Account. Widerruf killt die Tokens sofort.' },
        { q: 'Wie unterscheidet sich das von einem "Virtual Employee"?',
          a: 'Virtual-Employee-Dienste sind Menschen mit Tool-Hülle. Octodus ist die KI selbst, 50 $/Sitz. Kein Schichtplan, keine Zeitzone, kein HR-Prozess. Die Arbeit passiert im Chat in dem Moment, in dem Sie ihn erwähnen.' },
        { q: 'Kann ich jederzeit kündigen?',
          a: 'Ja — aus dem Chat oder dem Dashboard. Der bezahlte Zeitraum läuft bis Periodenende durch.' },
      ],
    },

    'chatgpt-alternative': {
      eyebrow:  'ChatGPT Alternative · für Teams',
      h1Top:    'Eine ChatGPT-Alternative,',
      h1Em:     'die im Team-Chat liefert.',
      lead:     'ChatGPT beantwortet Ihre Frage und vergisst sie. Octodus ist die ChatGPT-Alternative, die im Telegram-Gruppen-Chat des Teams arbeitet — mit gemeinsamem Gedächtnis, eigenen Regeln, OAuth-Anbindungen und Belegen für jede Aktion.',
      kicker:   'ChatGPT Alternative · Team-Chat · vorhersehbarer Preis',
      capabilities: [
        { k: 'Im Team-Chat statt im Tab',      v: 'Octodus lebt in Telegram. Heute. Slack, Discord, WhatsApp folgen (Beta). Das ganze Team antwortet auf dieselbe Aufgabe im gleichen Thread.' },
        { k: 'Gedächtnis übers Team',          v: 'Pro Team + pro Projekt. ChatGPT erinnert sich pro Nutzer — Octodus erinnert sich, was Ihr Team beschlossen hat.' },
        { k: 'Liefert echte Arbeit',           v: 'Sprachnachricht → 112 Prompts. Foto → Blog-Post live. Beschwerde → Cleanup-Skript läuft. ChatGPT entwirft; Octodus liefert.' },
        { k: 'OAuth-Anbindung Ihres Stacks',   v: 'Google, Notion, GitHub, Linear, Airtable, HubSpot — pro Team scoped, per Klick widerrufbar.' },
        { k: 'Preis ohne Tokenzähler',         v: '50 $/Sitz/Monat mit 15 $ Gratis-Guthaben. Keine Token-Überraschungen pro Antwort.' },
        { k: 'Mehrsprachig nativ',             v: 'EN · DE · ES · FR. Sprachwechsel im selben Thread — Octodus folgt.' },
      ],
      compare: {
        cols: ['ChatGPT (Plus / Team)', 'Microsoft Copilot'],
        rows: [
          ['Oberfläche',                       'Telegram-Gruppe + DM',                  'chat.openai.com',                       'Office-Apps'],
          ['Liefert Aktionen',                  'PRs, Skripte, Dateien, Versand',       'Nur Antworten',                          'Drafts in Word/Excel/Outlook'],
          ['Gedächtnis übers Team',             'Pro Team + pro Projekt',               'Pro Nutzer',                             'Pro Nutzer'],
          ['Voice / Foto / Dokument rein',      'First-class',                           'Teilweise',                              'Teilweise'],
          ['Anbindung Ihres Stacks',            'OAuth: Google, Notion, GitHub, …',     'Plugins',                                'Microsoft 365'],
          ['Preis',                             '50 $/Sitz · 15 $ gratis',              '20 $/Plus · 25–30 $/Team',               '30 $/Sitz'],
        ],
      },
      faq: [
        { q: 'Warum eine ChatGPT-Alternative für unser Team?',
          a: 'Weil ChatGPT pro Nutzer denkt. In einer Marketing-, Dev- oder Ops-Crew braucht der gleiche KI-Helfer den gleichen Kontext für alle. Octodus speichert pro Team + pro Projekt, nicht pro Account.' },
        { q: 'Verstehe ich die Kosten — keine Token-Falle?',
          a: 'Ja. 50 $ pro Sitz und Monat (Team). Das Gratis-Guthaben von 15 $ deckt typischerweise 5–10 echte Aufgaben — gut zum Ausprobieren. Keine Pro-Token-Rechnung am Monatsende.' },
        { q: 'Wie steht es um Datenschutz / DSGVO?',
          a: 'Auf der Startseite genannt: OAuth-only, "Your data · never trained on, ever", GDPR-compliant inkl. EU- und US-Residenz auf Enterprise. SOC 2 Audit ist laut Trust-Band "in progress · Q3 2026". Auf dem Team-Tarif liegen Workspaces in unserer Cloud; harte Residenz-Vorgaben (EU-only, Custom) gehören in Enterprise.' },
        { q: 'Brauche ich neue Software?',
          a: 'Nein. Octodus läuft in Telegram, das die meisten Teams ohnehin nutzen. Mitarbeiter müssen kein neues Tool lernen, keine neue App installieren.' },
        { q: 'Welche Modelle stecken drin?',
          a: 'Die Reasoning-Schicht ist Claude (Anthropic). Siehe "Built on" auf der Startseite — Anthropic, Google Cloud, EigenLayer und Ditto.' },
      ],
    },

    'ki-fuer-mittelstand': {
      eyebrow:  'KI für den Mittelstand · DACH',
      h1Top:    'KI für den Mittelstand,',
      h1Em:     'ohne neues Dashboard.',
      lead:     'Der Mittelstand braucht keine zwölfte Software, sondern eine Hand, die Arbeit erledigt. Octodus ist der KI-Mitarbeiter im Telegram-Chat des Teams — Sprachnachrichten werden zu fertiger Arbeit, ohne IT-Projekt, ohne Migration, ohne neues Login.',
      kicker:   'Mittelstand-tauglich · pro Sitz · DSGVO-orientiert',
      capabilities: [
        { k: 'Kein neues Tool',                v: 'Octodus lebt in Telegram. Ihre Crew kennt es — vom Geschäftsführer bis zur Auszubildenden. Bot dazu, erwähnen, fertig.' },
        { k: 'Pro Sitz, planbar',              v: '50 $/Sitz/Monat (ca. 45 €). 15 $ Gratis-Guthaben zum Ausprobieren. Kein Token-Zähler, der mitläuft.' },
        { k: 'OAuth-only, least-privilege',    v: 'Bindet nur das an, was Sie freigeben — bestimmte Google-Ordner, Notion-Workspaces, GitHub-Repos. Widerruf per Klick.' },
        { k: 'Eigenes Gedächtnis pro Team',    v: 'Ihre Daten werden nie für Modelltraining genutzt. Pro Team isoliert, im Chat löschbar.' },
        { k: 'Mehrsprachig: DE first-class',   v: 'Briefings auf Deutsch, Antworten an Kunden auf Englisch — alles im gleichen Thread.' },
        { k: 'Enterprise, wenn es eng wird',    v: 'SSO/SAML, Audit-Logs und Daten-Residenz (EU, US, custom) verfügbar im Enterprise-Tarif. Für Team genügt der Telegram-Bot.' },
      ],
      compare: {
        cols: ['Eigenes KI-Projekt', 'Großes US-Tool (ChatGPT Team / Copilot)'],
        rows: [
          ['Einführungszeit',                 'Stunden — Bot dazu, erwähnen',         'Wochen bis Monate — Auswahl + Implementierung',  'Tage bis Wochen — IT-Onboarding'],
          ['Pro-Sitz-Preis',                  '50 $/Sitz · 15 $ gratis',              'Variabel + Projektkosten',                        '20–30 $/Sitz'],
          ['Wo es lebt',                       'Telegram-Chat des Teams',              'Eigene Web-App',                                   'Eigener Tab'],
          ['Gemeinsames Gedächtnis',           'Pro Team + pro Projekt',               'Wenn programmiert',                                'Pro Nutzer'],
          ['DE-Sprache',                       'First-class',                          'Hängt vom Modell ab',                              'First-class'],
        ],
      },
      faq: [
        { q: 'Ist Octodus DSGVO-konform?',
          a: 'Auf der Startseite steht: "GDPR · compliant · EU + US residency" sowie "Your data · never trained on, ever". Daten-Residenz EU ist Teil des Enterprise-Tarifs. Auf Team läuft Speicher in unserer Cloud, isoliert pro Team und auf Knopfdruck löschbar. SOC 2 Audit ist laut Trust-Band "in progress · Q3 2026".' },
        { q: 'Müssen wir ein eigenes IT-Projekt starten?',
          a: 'Für Team und Solo: nein. @octodus_bot in eine Telegram-Gruppe einladen und erwähnen — fertig. SSO/SAML, Audit-Logs und harte Residenz-Vorgaben gehören in Enterprise.' },
        { q: 'Warum Telegram statt Slack/Teams?',
          a: 'Telegram ist in vielen Mittelstands-Crews schon vorhanden — kostenlos, schnell, ohne neue Lizenz. Slack, Discord und WhatsApp sind in Beta; Microsoft Teams folgt.' },
        { q: 'Was passiert, wenn Octodus einen Fehler macht?',
          a: 'Jede Aktion postet einen Beleg im Chat. Fehlerhafte Entwürfe, PRs und geplante Sendungen lassen sich mit einer Antwort zurücknehmen. Irreversible Aktionen fragen vorher nach.' },
        { q: 'Wie sieht ein typischer Einstieg aus?',
          a: '15 $ Gratis-Guthaben reichen für 5–10 echte Aufgaben — Briefing schreiben, Skript laufen lassen, Follow-up koordinieren. Danach 1–3 Sitze für die ersten Wochen, später Skalierung im Team.' },
      ],
    },
  },
};

/* --------------------------- UI components --------------------------- */

function SeoHero({ entry, locale, sibling }) {
  const ui = SEO_UI[locale];
  return (
    <section className="page-hero seo-hero">
      <div className="container page-hero-body">
        <div className="seo-meta-row">
          <div className="eyebrow">{entry.eyebrow}</div>
          {sibling && (
            <a className="seo-lang-pill" href={sibling.path}>
              {SEO_UI[sibling.locale].deutschPill}
            </a>
          )}
        </div>
        <h1>
          {entry.h1Top}<br/>
          <em>{entry.h1Em}</em>
        </h1>
        <p className="page-hero-sub">{entry.lead}</p>
        <div className="seo-kicker"><span>{entry.kicker}</span></div>

        <div className="seo-cta-row">
          <a className="btn btn-primary" href="https://calend.ly/emdx" target="_blank" rel="noopener">
            {Icons.telegram({ width: 18, height: 18 })} {ui.finalCta}
          </a>
          <a className="btn btn-ghost" href={locale === 'de' ? '/Pricing.html' : 'Pricing.html'}>
            $15 · 15 $ gratis
          </a>
        </div>
      </div>

      <style>{`
        .seo-hero { padding-bottom: 56px; }
        .seo-meta-row {
          display: flex; align-items: center; justify-content: space-between;
          gap: 16px; flex-wrap: wrap; margin-bottom: 18px;
        }
        .seo-lang-pill {
          font-family: var(--font-mono);
          font-size: 11px;
          letter-spacing: 0.14em;
          text-transform: uppercase;
          color: var(--text-secondary);
          padding: 6px 12px;
          border: 1px solid var(--border);
          border-radius: 999px;
          background: var(--bg-card);
          transition: border-color 180ms var(--ease-out), color 180ms var(--ease-out);
        }
        .seo-lang-pill:hover { color: var(--accent); border-color: var(--accent-tint-30); }
        .seo-kicker {
          margin-top: 22px;
          display: inline-flex;
          align-items: center;
          padding: 8px 16px;
          border: 1px solid var(--accent-tint-22);
          background: var(--accent-tint-06);
          border-radius: 999px;
          font-family: var(--font-mono);
          font-size: 12px;
          letter-spacing: 0.04em;
          color: var(--accent);
        }
        .seo-cta-row { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
      `}</style>
    </section>
  );
}

function SeoCapabilities({ entry, locale }) {
  const ui = SEO_UI[locale];
  return (
    <section className="seo-caps">
      <div className="container">
        <div className="seo-section-head">
          <div className="eyebrow">{ui.capabilitiesHead}</div>
          <p className="seo-section-sub">{ui.inChat}</p>
        </div>
        <div className="seo-caps-grid">
          {entry.capabilities.map((c, i) => (
            <div className="seo-cap" key={i}>
              <div className="seo-cap-k">{c.k}</div>
              <div className="seo-cap-v">{c.v}</div>
            </div>
          ))}
        </div>
      </div>

      <style>{`
        .seo-caps { padding: 60px 0; }
        .seo-section-head { margin-bottom: 32px; }
        .seo-section-sub { color: var(--text-secondary); font-size: 16px; margin-top: 10px; max-width: 720px; }
        .seo-caps-grid {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 18px;
        }
        @media (max-width: 900px) { .seo-caps-grid { grid-template-columns: repeat(2, 1fr); } }
        @media (max-width: 560px) { .seo-caps-grid { grid-template-columns: 1fr; } }
        .seo-cap {
          padding: 22px;
          background: var(--bg-card);
          border: 1px solid var(--border);
          border-radius: 16px;
        }
        .seo-cap-k {
          font-family: var(--font-heading);
          font-weight: 700;
          font-size: 18px;
          color: var(--text);
          margin-bottom: 8px;
        }
        .seo-cap-v {
          font-size: 14.5px;
          color: var(--text-secondary);
          line-height: 1.55;
        }
      `}</style>
    </section>
  );
}

function SeoCompare({ entry, locale }) {
  const ui = SEO_UI[locale];
  const cols = [ui.compareCol1, ...entry.compare.cols];
  return (
    <section className="seo-compare">
      <div className="container">
        <div className="seo-section-head">
          <div className="eyebrow">{ui.compareHead}</div>
        </div>
        <div className="seo-compare-wrap">
          <table className="seo-compare-table">
            <thead>
              <tr>
                <th></th>
                {cols.map((c, i) => (
                  <th key={i} className={i === 0 ? 'on' : ''}>{c}</th>
                ))}
              </tr>
            </thead>
            <tbody>
              {entry.compare.rows.map((row, i) => (
                <tr key={i}>
                  <th scope="row">{row[0]}</th>
                  {row.slice(1).map((v, j) => (
                    <td key={j} className={j === 0 ? 'on' : ''}>{v}</td>
                  ))}
                </tr>
              ))}
            </tbody>
          </table>
        </div>
      </div>

      <style>{`
        .seo-compare { padding: 60px 0; background: var(--bg-elev); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
        .seo-compare-wrap { overflow-x: auto; }
        .seo-compare-table {
          width: 100%;
          border-collapse: collapse;
          background: var(--bg-card);
          border: 1px solid var(--border);
          border-radius: 16px;
          overflow: hidden;
          font-size: 14px;
        }
        .seo-compare-table th,
        .seo-compare-table td {
          padding: 14px 16px;
          text-align: left;
          border-bottom: 1px solid var(--border);
          vertical-align: top;
        }
        .seo-compare-table thead th {
          font-family: var(--font-mono);
          font-size: 11px;
          letter-spacing: 0.12em;
          text-transform: uppercase;
          color: var(--text-muted);
          background: var(--bg-elev);
          font-weight: 500;
        }
        .seo-compare-table thead th.on { color: var(--accent); }
        .seo-compare-table tbody th {
          font-family: var(--font-sans);
          font-weight: 600;
          color: var(--text);
        }
        .seo-compare-table tbody td.on {
          color: var(--text);
          background: var(--accent-tint-04);
          font-weight: 500;
        }
        .seo-compare-table tbody tr:last-child th,
        .seo-compare-table tbody tr:last-child td { border-bottom: none; }
      `}</style>
    </section>
  );
}

function SeoFAQ({ entry, locale }) {
  const ui = SEO_UI[locale];
  return (
    <section className="seo-faq">
      <div className="container">
        <div className="seo-section-head">
          <div className="eyebrow">{ui.faqHead}</div>
        </div>
        <div className="seo-faq-list">
          {entry.faq.map((qa, i) => (
            <details className="seo-faq-item" key={i} open={i === 0}>
              <summary>{qa.q}</summary>
              <div className="seo-faq-body">{qa.a}</div>
            </details>
          ))}
        </div>
      </div>

      <style>{`
        .seo-faq { padding: 60px 0; }
        .seo-faq-list {
          display: flex;
          flex-direction: column;
          gap: 12px;
          max-width: 880px;
        }
        .seo-faq-item {
          background: var(--bg-card);
          border: 1px solid var(--border);
          border-radius: 16px;
          padding: 18px 22px;
        }
        .seo-faq-item summary {
          font-family: var(--font-heading);
          font-weight: 600;
          font-size: 18px;
          color: var(--text);
          cursor: pointer;
          list-style: none;
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 14px;
        }
        .seo-faq-item summary::-webkit-details-marker { display: none; }
        .seo-faq-item summary::after {
          content: "+";
          font-family: var(--font-mono);
          font-size: 22px;
          color: var(--accent);
          transition: transform 200ms var(--ease-out);
        }
        .seo-faq-item[open] summary::after { content: "−"; }
        .seo-faq-body {
          margin-top: 14px;
          color: var(--text-secondary);
          font-size: 15px;
          line-height: 1.65;
        }
      `}</style>
    </section>
  );
}

function SeoFinal({ locale }) {
  const ui = SEO_UI[locale];
  return (
    <section className="seo-final">
      <div className="container">
        <div className="seo-final-card">
          <h2>{ui.finalH}</h2>
          <p>{ui.finalSub}</p>
          <div className="seo-final-ctas">
            <a className="btn btn-primary" href="https://calend.ly/emdx" target="_blank" rel="noopener">
              {Icons.telegram({ width: 18, height: 18 })} {ui.finalCta}
            </a>
            <a className="btn btn-ghost" href={locale === 'de' ? '/Capabilities.html' : 'Capabilities.html'}>
              {ui.finalGhost}
            </a>
          </div>
        </div>
      </div>

      <style>{`
        .seo-final { padding: 80px 0 40px; }
        .seo-final-card {
          padding: 56px 48px;
          background: var(--bg-card);
          border: 1px solid var(--border);
          border-radius: 24px;
          text-align: center;
          max-width: 880px;
          margin: 0 auto;
        }
        .seo-final-card h2 {
          font-size: clamp(28px, 4vw, 40px);
          margin-bottom: 12px;
        }
        .seo-final-card p { color: var(--text-secondary); max-width: 560px; margin: 0 auto 28px; font-size: 16px; }
        .seo-final-ctas { display: inline-flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
      `}</style>
    </section>
  );
}

/* --------------------------- App --------------------------- */

function SeoLandingApp() {
  const id     = window.__SEO_ID__;
  const locale = window.__SEO_LOCALE__ || 'en';
  const entry  = (SEO_CONTENT[locale] || {})[id];
  const sibling = ((SEO_PAGES[locale] || {})[id] || {}).sibling || null;
  const siblingPath = sibling ? (SEO_PAGES[sibling.locale][sibling.id] || {}).path : null;

  if (!entry) {
    return (
      <div style={{ padding: 80, textAlign: 'center', fontFamily: 'var(--font-sans)' }}>
        <p>SEO page <code>{id}</code> not configured.</p>
      </div>
    );
  }

  return (
    <>
      <SiteEffects />
      <SiteNav active="" />
      <SeoHero entry={entry} locale={locale} sibling={siblingPath ? { path: siblingPath, locale: sibling.locale } : null} />
      <SeoCapabilities entry={entry} locale={locale} />
      <SeoCompare entry={entry} locale={locale} />
      <SeoFAQ entry={entry} locale={locale} />
      <SeoFinal locale={locale} />
      <SiteFooter />
      <SiteTweaks />
    </>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<SeoLandingApp />);