<section class="content-block template-services">
    <div class="grid-container">
        <div class="template-services__list">
            <a href="#" class="template-services__card bg-pink">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-1.svg" alt="Brand &amp; Marketplace Management">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">1/6</div>
                <h3 class="template-services__headline">Brand &amp; Marketplace Management</h3>
                <p class="template-services__description">Keep your brand flawless at every instant</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
            <a href="#" class="template-services__card bg-yellow">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-2.svg" alt="Logistics and Fulfillment">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">2/6</div>
                <h3 class="template-services__headline">Logistics and Fulfillment</h3>
                <p class="template-services__description">Logistics are our lynchpin, and we’re fluent in fulfillment</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
            <a href="#" class="template-services__card bg-orange">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-3.svg" alt="Brand Protection">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">3/6</div>
                <h3 class="template-services__headline">Brand Protection</h3>
                <p class="template-services__description">We’re your brand’s sheriff against digital desperados</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
            <a href="#" class="template-services__card bg-red">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-4.svg" alt="Marketing">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">4/6</div>
                <h3 class="template-services__headline">Marketing</h3>
                <p class="template-services__description">Fine-tune ‘In Your Face’ first impressions</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
            <a href="#" class="template-services__card bg-pink">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-5.svg" alt="Advertising">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">5/6</div>
                <h3 class="template-services__headline">Advertising</h3>
                <p class="template-services__description">We shout your brand boldly from the rooftops</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
            <a href="#" class="template-services__card bg-yellow">
                <div class="template-services__img-wrapper">
                    <img src="/nto/assets/images/cms/icon-step-6.svg" alt="Creative">
                </div>
                <div class="template-services__card-content">
                <div class="template-services__step">6/6</div>
                <h3 class="template-services__headline">Creative</h3>
                <p class="template-services__description">Our language isn’t the only colorful thing about us</p>
                <div class="template-services__content-button"></div>
                </div>
            </a>
        </div>
        <div class="template-button">
            <a href="/nto/#" class="button button--default">Let’s Grow</a>
        </div>
    </div>
</section>

{{ template("services", {
  "templateButton": {
    "label": "Let’s Grow",
    "type": "button--default",
    "url": "/#"
  },
  "items": [
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-1.svg",
      "step": "1/6",
      "title": "Brand & Marketplace Management",
      "description": "Keep your brand flawless at every instant",
      "class": "bg-pink"
    },
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-2.svg",
      "step": "2/6",
      "title": "Logistics and Fulfillment",
      "description": "Logistics are our lynchpin, and we’re fluent in fulfillment",
      "class": "bg-yellow"
    },
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-3.svg",
      "step": "3/6",
      "title": "Brand Protection",
      "description": "We’re your brand’s sheriff against digital desperados",
      "class": "bg-orange"
    },
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-4.svg",
      "step": "4/6",
      "title": "Marketing",
      "description": "Fine-tune ‘In Your Face’ first impressions",
      "class": "bg-red"
    },
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-5.svg",
      "step": "5/6",
      "title": "Advertising",
      "description": "We shout your brand boldly from the rooftops",
      "class": "bg-pink"
    },
    {
      "link": "#",
      "img": "/assets/images/cms/icon-step-6.svg",
      "step": "6/6",
      "title": "Creative",
      "description": "Our language isn’t the only colorful thing about us",
      "class": "bg-yellow"
    }
  ]
}) }}