<div class="o-teaser-collection {{#collections}} o-teaser-collection--{{.}}{{/collections}}">
	<h2 class="o-teaser-collection__heading{{#headings}} o-teaser-collection__heading--{{.}}{{/headings}}">
		{{#link}}
			<a class="o-teaser-collection__heading-link" href="#">Collection Heading</a>
		{{/link}}
		{{^link}}
			Collection Heading
		{{/link}}
	</h2>

	{{^numbered}}
	<!-- o-grid included in the demo as an example -->
	<!-- `o-teaser-collection__items` or a custom container could also be used -->
	<!-- see the readme for details -->
	<div class="o-grid-container">
		<div class="o-grid-row">
			<p class="demo-paragraph">Teasers go here...</p>
		</div>
	</div>
	{{/numbered}}

	{{#numbered}}
	<ol class="o-teaser-collection__items">
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
		<li class="o-teaser-collection__item">
			<p class="demo-paragraph">Teasers go here...</p>
		</li>
	</ol>
	{{/numbered}}
</div>
