<div id="service-1" class="services-area gray-bg section-padding">
    <div class="container">
        <div class="row">
            <div class=" col-lg-12 text-center">
                <div class="section-title">
                    <h6>Services</h6>
                    <h2>Best Services</b></h2>
                    <p>We take pride in our dedicated team of professionals who work tirelessly to deliver reliable and
                        efficient fuel solutions. Whether you are a business looking for bulk fuel supply, a homeowner
                        needing heating oil, or a fleet manager seeking cost-effective options, we are here to serve
                        you.</p>

                    <p>Below are some of our products that you can request and we will be glad to provide them to you
                    </p>
                </div>
            </div>
        </div>
        <div class="row">
            {% for service in config.get('SERVICES').get('services') %}
            <!-- <div class="col-lg-4 col-md-6 col-sm-12">
                {{ config.get('SERVICES').get('services').get(service) }}
            </div> -->
            {% set serv = config.get('SERVICES').get('services').get(service) %}
            <div class="col-lg-4 col-md-6 col-sm-12">
                <div class="single-serv-item mt-30 wow fadeInLeft" data-wow-delay=".2s">
                    <div class="serv-icon">
                        <img src="{{url_for('static', filename='assets/img/icon')}}/{{serv.get('icon')}}" alt>
                    </div>
                    <div class="serv-content">
                        <h5>{{serv.get('name')}}</h5>
                        <p>{{ serv.get('except') | truncate(100)}}</p>
                    </div>
                    <a href="{{url_for('service', id=service)}}" class="read-more">Read More</a>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>