Articles filter & grid layout

gistfile1.txt

<div class="container">
 <div class="row">
  <div class="col-3"></div>
  <div class="col-6 my-3">
   <div class="text-center">
    <h1>Main Title</h1>
   </div>
   <h2 class="my-4">Subtitle</h2>
   <div class="row">
    <p>{articles category="category" tag="tag" ordering="title"}</p>
    <div class="col-lg-4 col-md-12">
     <p><a href="[url]">[image-intro]</a></p>
     <h2><a href="[url]">[title]</a></h2>
     <p>[text limit="100" strip="true"]</p>
     <p>[readmore text="Read more..."]</p>
     <p>&nbsp;</p>
    </div>
    {if is-3-of-3}</div>
   <div class="row">{/if}
    <p>{/articles}</p>
   </div>
   <hr />
   <h2 class="my-3">Subtitle 2</h2>
   <div class="row">
    <p>{articles category="category2" tag="tag2" ordering="title"}</p>
    <div class="col-lg-6 col-md-12">
     <p><a href="[url]">[image-intro]</a></p>
     <h2><a href="[url]">[title]</a></h2>
     <p>[text limit="100" strip="true"]</p>
     <p>[readmore text="Read more..."]</p>
    </div>
    {if is-2-of-2}</div>
   <div class="row">{/if}
    <p>{/articles}</p>
   </div>
  </div>
  <div class="col-3"></div>
 </div>
</div>
<p>Intro Text here</p>
<hr id="system-readmore" />
<div class="row mt-5">
 <div class="col-3"></div>
 <div class="col-6">
  <h1 class="mb-5">{article this:id}[title] {/article}</h1>
  <div class="row mt-5">
   <div class="col-3">
    <div class="mr-5">{article this:id}{image-intro}<img src="[image-intro-url]" alt="[title]" />{/article}</div>
   </div>
   <div class="col-9">
    <div class="row">Main description</div>
    <div class="row mt-5">
     <div class="col-md-4 col-sm-12"><strong>{field 2}</strong></div>
    </div>
    <div class="row mt-5">
     <div class="col-md-4 col-sm-12"><strong>{field 3}</strong></div>
    </div>
    <div class="row mt-5">
     <div class="col-md-4 col-sm-12"><strong>{field 1}</strong></div>
    </div>
    <div class="row mt-5">
     <div class="col-md-12 col-sm-12"><strong>{field 4}</strong></div>
    </div>
   </div>
  </div>
 </div>
 <div class="col-3"></div>
</div>