{#-
  The top of the homepage: the constructed wordmark, then the statement and its actions. The
  features of docs/index.md follow it, then partials/home-examples.html.
-#}
  <section class="xn-hero" aria-label="xnano">
    <div class="xn-rule">
      <span class="xn-label">01</span>
      <span class="xn-label">Introduction</span>
    </div>
    <p class="xn-label xn-hero__kicker">A really fun terminal experience</p>
    <div class="xn-construct">
      <div class="xn-construct__frame" aria-hidden="true">
        <span class="xn-construct__corner xn-construct__corner--top-left"></span>
        <span class="xn-construct__corner xn-construct__corner--top-right"></span>
        <span class="xn-construct__corner xn-construct__corner--bottom-left"></span>
        <span class="xn-construct__corner xn-construct__corner--bottom-right"></span>
        <span class="xn-construct__guide xn-construct__guide--top"></span>
        <span class="xn-construct__guide xn-construct__guide--bottom"></span>
        <span class="xn-construct__guide xn-construct__guide--left"></span>
        <span class="xn-construct__guide xn-construct__guide--right"></span>
        <span class="xn-construct__height"><span data-xn-measure="height">&nbsp;</span></span>
        <span class="xn-construct__width"><span data-xn-measure="width">&nbsp;</span></span>
        <span class="xn-construct__word">xnano</span>
      </div>
    </div>
  </section>

  <section class="xn-split">
    <span class="xn-registration xn-split__mark xn-split__mark--left" aria-hidden="true"><span></span></span>
    <div class="xn-split__statement">
      <p class="xn-statement">An <em>extremely nano</em> terminal experience for Python, built on <a class="xn-plain xn-underline" href="https://ratatui.rs/">ratatui</a>.</p>
      <div class="xn-actions">
        <a class="xn-button xn-button--primary" href="{{ 'learn/' | url }}">Get Started <span class="xn-arrow" aria-hidden="true">&nearr;</span></a>
        <a class="xn-button" href="{{ config.repo_url }}#core-features--examples">View Examples</a>
      </div>
      <p class="xn-label xn-meta">Python <span>/</span> Open source <span>/</span> Cross platform</p>
    </div>
    <span class="xn-registration xn-split__mark xn-split__mark--right" aria-hidden="true"><span></span></span>
  </section>