index.html

---
layout: page
hero:
  title: Documentation Template
  desc: "A minimalist, focused documentation template for technical teams."
  primary_cta_uri: https://new-ui.com/docs/getting-started/installation
  primary_cta_label: Get Started
  editor_template_image_1x: /assets/images/cover.webp
  editor_template_image_2x: /assets/images/cover.webp
---

<section class="landing-page-intro">
  <div class="container">
    <div class="spacer-17"></div>
    <h1 class="h1 nu-u-mx-auto text-center nu-u-mb-8 serif animated delay-01">{{ page.hero.title }}</h1>
    <p class="fs-lead nu-u-mx-auto text-center nu-u-mb-9 lh-body animated delay-02">{{ page.hero.desc }}</p>
    <div class="btn-group justify-center animated delay-03">
      <a type="button" id="page-cta" href="docs/getting-started/installation" class="btn btn--lg btn--accent-primary">
        {{ page.hero.primary_cta_label }}
      </a>
    </div>

    <div class="spacer-11"></div>
    <img width="944" 
      src="{{ page.hero.editor_template_image_2x | relative_url }}" 
      srcset="{{ page.hero.editor_template_image_1x | relative_url }} 1x,
        {{ page.editor_template_image_2x | relative_url }} 2x" 
      alt="cover" class="nu-u-mb-9 animated delay-04" />
    <div class="spacer-13"></div>
  </div>
</section>