Load more pagination

<nav class="ch-pagination">
  <p class="ch-pagination__title ch-mb--3">
    Showing <strong>75</strong> of <strong>114</strong> results
  </p>
  <div class="ch-progress ch-mb--3">
    <div class="ch-progress__bar" style="width: 66%;"></div>
  </div>
  <button type="button" class="ch-btn ch-width--12 sl:ch-width--auto">Load more</button>
</nav>

Stepped pagination

<nav class="ch-pagination">
  <p class="ch-pagination__title ch-mb--3">
    Showing <strong>141</strong> to <strong>150</strong> of <strong>168</strong> results
  </p>
  <div class="ch-pagination__nav">
    <button type="button" class="ch-btn ch-pagination__previous">
      <span class="ch-reader">previous</span>
    </button>
    <div class="ch-pagination__steps">
      <button type="button" class="ch-btn ch-btn--link ch-pagination__first">First</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">12</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">13</button>
      <button
        type="button"
        class="ch-btn ch-btn--link ch-pagination__step ch-pagination__step--current"
        disabled
      >
        14
      </button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">15</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">16</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__last">Last</button>
    </div>
    <p class="ch-pagination__location">Page <strong>14</strong> of <strong>100</strong></p>
    <button type="button" class="ch-btn ch-pagination__next">
      <span class="ch-reader">next</span>
    </button>
  </div>
</nav>

<nav class="ch-pagination">
  <p class="ch-pagination__title ch-mb--3">
    Showing <strong>1</strong> to <strong>10</strong> of <strong>133</strong> results
  </p>
  <div class="ch-pagination__nav">
    <button type="button" class="ch-btn ch-pagination__previous" disabled>
      <span class="ch-reader">previous</span>
    </button>
    <div class="ch-pagination__steps">
      <button
        type="button"
        class="ch-btn ch-btn--link ch-pagination__step ch-pagination__step--current"
        disabled
      >
        1
      </button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">2</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">3</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">4</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">5</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__last">Last</button>
    </div>
    <p class="ch-pagination__location">Page <strong>1</strong> of <strong>100</strong></p>
    <button type="button" class="ch-btn ch-pagination__next">
      <span class="ch-reader">next</span>
    </button>
  </div>
</nav>

<nav class="ch-pagination">
  <p class="ch-pagination__title ch-mb--3">
    Showing <strong>991</strong> to <strong>1000</strong> of <strong>1000</strong> results
  </p>
  <div class="ch-pagination__nav">
    <button type="button" class="ch-btn ch-pagination__previous">
      <span class="ch-reader">previous</span>
    </button>
    <div class="ch-pagination__steps">
      <button type="button" class="ch-btn ch-btn--link ch-pagination__first">First</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">96</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">97</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">98</button>
      <button type="button" class="ch-btn ch-btn--link ch-pagination__step">99</button>
      <button
        type="button"
        class="ch-btn ch-btn--link ch-pagination__step ch-pagination__step--current"
        disabled
      >
        100
      </button>
    </div>
    <p class="ch-pagination__location">Page <strong>100</strong> of <strong>100</strong></p>
    <button type="button" class="ch-btn ch-pagination__next" disabled>
      <span class="ch-reader">next</span>
    </button>
  </div>
</nav>