<section class="section editorialCards">
  <div class="container">
    <div class="cardList">
      <article class="card -horizontal">
        <h2 class="h4 card__title">Convallis ante</h2>
        <div class="card__body">
          <div>
            <p>
              Nunc lorem erat, molestie vel turpis eget, vehicula cursus leo ad litora torquent per conubia nostra, per inceptos himenaeos.
            </p>
            <p class="card__intro">
              Nunc lorem erat, molestie vel turpis eget, vehicula cursus leo.
            </p>
          </div>
          <a class="card__link" href="#">
            Standalone Text Link
            <svg viewBox="0 0 18 12"><use href="/main-icons-sprite.svg#arrow-right" /></svg>
          </a>
        </div>
      </article>
      <article class="card -horizontal">
        <h2 class="h4 card__title">Sed do eiusmod tempor incididunt</h2>
        <div class="card__body">
          <div>
            <p>
              Nunc lorem erat, molestie vel turpis eget, vehicula cursus leo ad litora torquent per conubia nostra, per inceptos himenaeos.
            </p>
            <p class="card__intro">
              Nunc lorem erat, molestie vel turpis eget, vehicula cursus leo.
            </p>
          </div>
          <a class="card__link" href="#">
            Standalone Text Link
            <svg viewBox="0 0 18 12"><use href="/main-icons-sprite.svg#arrow-right" /></svg>
          </a>
        </div>
      </article>
    </div>
  </div>
</section>

@use '@/core' as *;

.editorialCards {
  --accent-color: var(--color-gray-50);

  background: var(--color-gray-50);
  color: var(--root-color);
  padding-block: 4rem;
}