/**
 * rDocs module landing page — static HTML, no React.
 */
export function renderLanding(): string {
	return `
<!-- Hero -->
<div class="rl-hero">
  <span class="rl-tagline">rDocs</span>
  <h1 class="rl-heading" style="background:linear-gradient(135deg,#14b8a6,#22d3ee);-webkit-background-clip:text;background-clip:text">Documents, notebooks, and knowledge.</h1>
  <p class="rl-subtitle" style="background:linear-gradient(135deg,#14b8a6,#22d3ee);-webkit-background-clip:text;background-clip:text">Rich Text, Voice, Import &amp; Export &mdash; All in One Place</p>
  <p class="rl-subtext">
    Full TipTap editor with notebooks, voice transcription, AI summarization,
    and import from Obsidian, Logseq, Notion, Google Docs, Evernote, and Roam.
  </p>
  <div class="rl-cta-row">
    <a href="https://demo.rspace.online/rdocs" class="rl-cta-primary" id="ml-primary">Open Docs</a>
    <a href="#features" class="rl-cta-secondary">Features</a>
  </div>
</div>

<!-- Features -->
<section class="rl-section" id="features">
  <div class="rl-container">
    <h2 class="rl-heading" style="text-align:center">What rDocs Handles</h2>
    <div class="rl-grid-3">
      <div class="rl-card rl-card--center">
        <div class="rl-icon-box">&#128221;</div>
        <h3>Rich Text Editor</h3>
        <p>Write with a full TipTap editor &mdash; formatting, code blocks, checklists, embeds, slash commands, and comments with track changes.</p>
      </div>
      <div class="rl-card rl-card--center">
        <div class="rl-icon-box">&#127908;</div>
        <h3>Voice &amp; Transcription</h3>
        <p>Record voice notes with live transcription via Web Speech API. Drop audio or video files for offline transcripts with Parakeet.js.</p>
      </div>
      <div class="rl-card rl-card--center">
        <div class="rl-icon-box">&#128260;</div>
        <h3>Import &amp; Export</h3>
        <p>Bring your notes from Obsidian, Logseq, Notion, Google Docs, Evernote, and Roam. Export back to any format.</p>
      </div>
    </div>
  </div>
</section>

<!-- Built on Open Source -->
<section class="rl-section rl-section--alt">
  <div class="rl-container">
    <h2 class="rl-heading" style="text-align:center">Built on Open Source</h2>
    <div class="rl-grid-4" style="display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem">
      <div class="rl-card rl-card--center">
        <h3>Automerge</h3>
        <p>Local-first CRDT for conflict-free real-time collaboration.</p>
      </div>
      <div class="rl-card rl-card--center">
        <h3>TipTap</h3>
        <p>Headless rich text editor built on ProseMirror.</p>
      </div>
      <div class="rl-card rl-card--center">
        <h3>Parakeet.js</h3>
        <p>In-browser speech recognition for offline transcription.</p>
      </div>
      <div class="rl-card rl-card--center">
        <h3>Hono</h3>
        <p>Ultra-fast API framework powering the backend.</p>
      </div>
    </div>
  </div>
</section>

<!-- CTA -->
<section class="rl-section">
  <div class="rl-container" style="text-align:center">
    <h2 class="rl-heading">Start Writing</h2>
    <p class="rl-subtext">Create a space or try the demo.</p>
    <div class="rl-cta-row">
      <a href="https://demo.rspace.online/rdocs" class="rl-cta-primary">Open Docs</a>
      <a href="/create-space" class="rl-cta-secondary">Create a Space</a>
    </div>
  </div>
</section>

<div class="rl-back">
  <a href="/">&larr; Back to rSpace</a>
</div>
`;
}