{#-
  Landing page: hero (logo + text) → example → features → install.
  Selected via `template: home.html` in index.md front matter.
  Extends main.html so the header/nav bar is preserved.
-#}
{% extends "main.html" %}

{% block tabs %}
  {{ super() }}
  {# Page-scoped resets: only active when this template is rendered. #}
  <style>
    .md-header { position: initial; background: var(--pollux-blue-900) }
    .md-header[data-md-state="shadow"] { box-shadow: none }
    .md-header__option { position: relative }
    .md-main__inner { margin: 0 }
    .md-content { display: none }
    .md-sidebar--primary,
    .md-sidebar--secondary { display: none }
    .md-container::after { display: none }
    .md-footer {
      margin-left: 0 !important;
      margin-right: 0 !important;
      max-width: none !important;
      padding-inline: 0;
    }
  </style>

  {# ── Hero ─────────────────────────────────────────────────────── #}
  <section class="pollux-hero">
    <div class="pollux-hero__grid">
      <div class="pollux-hero__logo">
        <img src="{{ 'assets/logo.avif' | url }}"
             alt="Pollux"
             class="pollux-hero__logo-img"
             width="400" height="600" />
      </div>
      <h1 class="pollux-hero__heading pollux-hero__heading-serif">
        Multimodal orchestration for LLM APIs
      </h1>
      <p class="pollux-hero__tagline">
        You describe what to analyze. Pollux handles source patterns,
        context caching, and multimodal complexity&nbsp;&mdash;
        so you don&rsquo;t.
      </p>
      <div class="pollux-hero__actions">
        <a href="{{ 'quickstart/' | url }}"
           class="pollux-hero__cta pollux-hero__cta--primary">
          Get started
        </a>
        <a href="{{ 'reference/api/' | url }}"
           class="pollux-hero__cta pollux-hero__cta--secondary">
          API reference
        </a>
      </div>
    </div>
  </section>

  {# ── Example ──────────────────────────────────────────────────── #}
  <section class="pollux-example">
    <div class="pollux-example__inner">
      <div class="pollux-example__frame">
      <div class="pollux-example__bar"></div>
      <pre><code>from pollux import run, Config, Source

result = await run(
    "Summarize the key findings",
    source=Source.from_file("paper.pdf"),
    config=Config(
        provider="gemini",
        model="gemini-2.5-flash-lite",
    ),
)
print(result["answers"][0])</code></pre>
      </div>
    </div>
  </section>

  {# ── Features ─────────────────────────────────────────────────── #}
  <section class="pollux-features">
    <div class="pollux-features__grid">
      <div class="pollux-features__card">
        <h2 class="pollux-features__title">Multimodal-first</h2>
        <p class="pollux-features__desc">
          PDFs, images, video, YouTube, arXiv.
          One interface, any source type.
        </p>
      </div>
      <div class="pollux-features__card">
        <h2 class="pollux-features__title">Source patterns</h2>
        <p class="pollux-features__desc">
          Fan-out, fan-in, and broadcast execution
          over your content&nbsp;&mdash; no boilerplate.
        </p>
      </div>
      <div class="pollux-features__card">
        <h2 class="pollux-features__title">Context caching</h2>
        <p class="pollux-features__desc">
          Upload once, reuse across prompts.
          Automatic TTL management saves tokens and money.
        </p>
      </div>
      <div class="pollux-features__card">
        <h2 class="pollux-features__title">Built for reliability</h2>
        <p class="pollux-features__desc">
          Async pipeline, retries with backoff,
          structured output, usage tracking.
        </p>
      </div>
    </div>
  </section>

  {# ── Install ──────────────────────────────────────────────────── #}
  <section class="pollux-install">
    <div class="pollux-install__inner">
      <pre class="pollux-install__cmd"><code>pip install pollux-ai</code></pre>
    </div>
  </section>
{% endblock %}

{# Suppress Markdown body (SEO fallback text lives in index.md but
   does not render visually). #}
{% block content %}{% endblock %}

{# Homepage footer: meta row only (copyright + social), no prev/next pills.
   Reuses pollux-footer-meta__* classes from extra.css. #}
{% block footer %}
  <footer class="md-footer pollux-home-footer">
    <div class="pollux-home-footer__inner">
      {% if config.copyright %}
        <p class="pollux-footer-meta__copyright">{{ config.copyright }}</p>
      {% endif %}
      {% if config.extra.social %}
        <div class="pollux-footer-meta__social">
          {% for social in config.extra.social %}
            {% set rel = "noopener" %}
            {% if "mastodon" in social.icon %}
              {% set rel = rel ~ " me" %}
            {% endif %}
            <a href="{{ social.link }}" target="_blank" rel="{{ rel }}"
               title="{{ social.name | e }}"
               class="pollux-footer-meta__social-link">
              {% include ".icons/" ~ social.icon ~ ".svg" %}
            </a>
          {% endfor %}
        </div>
      {% endif %}
    </div>
  </footer>
{% endblock %}