/**
 * Tube module landing page — rich content for rspace.online/rtube
 */

export function renderLanding(): string {
	return `
  <!-- Hero -->
  <div class="rl-hero">
    <span class="rl-tagline">rTube</span>
    <h1 class="rl-heading">Community Video Platform</h1>
    <p class="rl-subtext">
      Host, stream, and share video without big tech.
      Your community's video library with HLS streaming and RTMP ingest.
      (You)rTube, your channel.
    </p>
    <div class="rl-cta-row">
      <a href="https://demo.rspace.online/rtube" class="rl-cta-primary" id="ml-primary">Start Streaming</a>
      <a href="/create-space" class="rl-cta-secondary">Create a Space</a>
    </div>
  </div>

  <!-- How it works -->
  <section class="rl-section">
    <div class="rl-container">
      <h2 class="rl-heading" style="text-align:center;">How It Works</h2>
      <div class="rl-grid-3">
        <div class="rl-step">
          <div class="rl-step__num">1</div>
          <h3>Upload Videos</h3>
          <p>Drop video files in any major format. MP4, WebM, MKV, MOV -- they all work.</p>
        </div>
        <div class="rl-step">
          <div class="rl-step__num">2</div>
          <h3>Stream Live</h3>
          <p>Point OBS or any RTMP-compatible software at your space's ingest URL and go live instantly.</p>
        </div>
        <div class="rl-step">
          <div class="rl-step__num">3</div>
          <h3>Share with Your Community</h3>
          <p>Videos are organized by space. Share links, embed on your canvas, or browse the community library.</p>
        </div>
      </div>
    </div>
  </section>

  <!-- Features -->
  <section class="rl-section rl-section--alt">
    <div class="rl-container">
      <h2 class="rl-heading" style="text-align:center;">Features</h2>
      <p class="rl-subtext" style="text-align:center;">
        Everything you need to run your own community video platform.
      </p>
      <div class="rl-grid-4">
        <div class="rl-card rl-card--center">
          <div class="rl-icon-box">&#128250;</div>
          <h3>HLS Streaming</h3>
          <p>Adaptive bitrate streaming ensures smooth playback on any connection speed or device.</p>
        </div>
        <div class="rl-card rl-card--center">
          <div class="rl-icon-box">&#128225;</div>
          <h3>RTMP Ingest</h3>
          <p>Go live with OBS, Streamlabs, or any RTMP-compatible streaming software. One URL, instant broadcast.</p>
        </div>
        <div class="rl-card rl-card--center">
          <div class="rl-icon-box">&#9729;</div>
          <h3>R2 Storage</h3>
          <p>Videos stored on Cloudflare R2 for fast, globally distributed delivery with no egress fees.</p>
        </div>
        <div class="rl-card rl-card--center">
          <div class="rl-icon-box">&#127909;</div>
          <h3>Community Channels</h3>
          <p>Each space gets its own video channel. Organize content by community, project, or topic.</p>
        </div>
      </div>
    </div>
  </section>

  <!-- Technical -->
  <section class="rl-section">
    <div class="rl-container">
      <h2 class="rl-heading" style="text-align:center;">Technical Details</h2>
      <div class="rl-card" style="max-width:600px;margin:0 auto;">
        <ul class="rl-check-list">
          <li><strong>H.264 / H.265</strong> hardware-accelerated codec support</li>
          <li><strong>WebM</strong> (VP8/VP9) for open-format video</li>
          <li><strong>Adaptive bitrate HLS</strong> for smooth playback on any connection</li>
          <li><strong>HTTP Range requests</strong> for efficient seeking and partial downloads</li>
          <li><strong>RTMP ingest</strong> compatible with OBS, Streamlabs, and ffmpeg</li>
        </ul>
      </div>
    </div>
  </section>

  <!-- CTA -->
  <section class="rl-section rl-section--alt">
    <div class="rl-container" style="text-align:center;">
      <h2 class="rl-heading">Your community's own video platform</h2>
      <p class="rl-subtext">
        Try the demo or create a space to start hosting and streaming.
      </p>
      <div class="rl-cta-row">
        <a href="https://demo.rspace.online/rtube" class="rl-cta-primary">Start Streaming</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>`;
}