Card

<nxt-card>
  <h3 class="nxt-headline xsmall semibold">Card Title</h3>
  <p class="nxt-text">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
    aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
  </p>
</nxt-card>

<nxt-card selectable>
  <h3 class="nxt-headline xsmall semibold nxt-margin-bottom-2xs">Selectable card Title</h3>
  <p class="nxt-text">Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit</p>
</nxt-card>

<nxt-card selectable>
  <h3 class="nxt-headline xsmall semibold">Selectable card headline</h3>
  <hr />
  <p class="nxt-text nxt-margin-bottom-2m">
    Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit
  </p>
  <a href="javascript:void()" class="nxt-link"
    ><nxt-icon class="nxt-margin-right-2xs" name="arrow-right"></nxt-icon>Find out more</a
  >
</nxt-card>

<nxt-card selectable class="nxt-margin-bottom-xs">
  <p class="nxt-text">Default selectable card</p>
</nxt-card>

<nxt-card selectable checked class="nxt-margin-bottom-xs">
  <p class="nxt-text">Checked selectable card</p>
</nxt-card>

<nxt-card selectable disabled class="nxt-margin-bottom-xs">
  <p class="nxt-text">Disabled selectable card</p>
</nxt-card>

<nxt-card selectable disabled checked class="nxt-margin-bottom-xs">
  <p class="nxt-text">Disabled and checked selectable card</p>
</nxt-card>

<nxt-card selectable invalid class="nxt-margin-bottom-xs">
  <p class="nxt-text">Invalid selectable card</p>
</nxt-card>