Basic card

<div
  class="ch-pa--3 ch-bg--white ch-ba--1 ch-rounded ch-bc--grey-3 ch-shadow--sm"
>
  <h3>I'm a heading</h3>
  <p class="ch-mb--0">Lorem Ipsum is simply ...</p>
</div>

---

Split cards

<div
  class="ch-pa--3 ch-bg--white ch-ba--1 ch-rounded ch-bc--grey-3 ch-shadow--sm"
>
  <div class="ch-pa--3">
    <h3>I'm a heading</h3>
    <p class="ch-mb--0">
      Lorem Ipsum is simply dummy text of the printing and typesetting
      industry...
    </p>
  </div>

  <div class="ch-pa--3 ch-bg--grey-1 ch-bt--1 ch-bb--1 ch-bc--grey-4">
    <h3>I'm a heading</h3>
    <p class="ch-mb--0">
      Lorem Ipsum is simply dummy text of the printing and typesetting
      industry...
    </p>
  </div>

  <div class="ch-pa--3">
    <h3>I'm a heading</h3>
    <p class="ch-mb--0">
      Lorem Ipsum is simply dummy text of the printing and typesetting
      industry...
    </p>
  </div>
</div>