Improve landing page clarity and replace complex visuals with conversational examples

[LGDiMaggio]

Motivation

• Make the landing page friendlier and less technical so it attracts maintenance teams instead of intimidating them.
• Remove or reduce visual artifacts and distorted badge images (including the MIT badge) and avoid terse tokens like hyphenated project name in key UI text.
• Replace complex screenshots with simple conversational examples to show usage without overwhelming readers and fix CTA contrast issues.

Description

• Updated docs/index.html: rewrote hero, tagline, features and "How It Works" copy to plain-language, benefit-focused phrasing.
• Replaced image-based status badges with styled text "badge-pill" elements and CSS to avoid distorted imagery.
• Replaced the screenshots gallery with a chat-examples block (chat-style examples) and added CSS for chat-card/chat-line.
• Improved CTA contrast by restyling the secondary banner button and made small text fixes (e.g. PM-MCP → PM MCP, Privacy-First → Privacy First).

Testing

• Ran git diff --check to verify no whitespace/errors and it passed.
• Served the site locally with python -m http.server 4173 --directory /workspace/predictive-maintenance-mcp and validated the updated page rendered.
• Captured a visual verification screenshot using the Playwright-based script (mcp__browser_tools__run_playwright_script) which produced artifacts/landing-updated.png successfully.

---

Codex Task