<!--==============================
Service Area
==============================-->
<section class=" space" data-bg-src="{{ asset('assets/img/bg/sr-bg-2-1.jpg') }}">
<div class="container">
{% for item in servicesTitle %}
{% if item.lang == 'fr_fr' and '/fr/' in app.request.uri %}
<div class="row justify-content-center text-center wow fadeInUp" data-wow-delay="0.3s">
<div class="col-xl-7">
<div class="title-area" style="margin-top: -65px;">
<div class="sec-pills">
<div class="pill"></div>
<div class="pill"></div>
<div class="pill"></div>
</div>
<span class="sec-subtitle2">{{ item.title }}</span>
<p class="class service-text">{{ item.summary | raw }}</p>
</div>
</div>
</div>
{% elseif item.lang == 'en_en' and '/en/' in app.request.uri %}
<div class="row justify-content-center text-center wow fadeInUp" data-wow-delay="0.3s">
<div class="col-xl-7">
<div class="title-area" style="margin-top: -65px;">
<div class="sec-pills">
<div class="pill"></div>
<div class="pill"></div>
<div class="pill"></div>
</div>
<span class="sec-subtitle2">{{ item.title }}</span>
<p class="class service-text">{{ item.summary | raw }}</p>
</div>
</div>
</div>
{% endif %}
{% endfor %}
<div class="row gx-0 text-center text-lg-start">
{# {{ include('services/_translation.html.twig') }}#}
{% for service in services %}
{% if service.langue == 'fr_fr' and '/fr/' in app.request.uri %}
<div class="col-md-6 col-lg-4 wow fadeInUp" data-wow-delay="0.3s ">
<div class="service-style2">
<div class="service-icon">
<img src="{{ asset('content/media/' ~ service.illustration) | imagine_filter('icons_services') }}" alt="Service Shape">
</div>
<h3 class="service-title h5"><a class="text-inherit" href="{{ path('app_services_show', {'slug': service.slug}) }}">{{ service.title }}</a></h3>
<p class="service-text">{{service.content | u.truncate(100) | raw}}</p>
</div>
</div>
{% elseif service.langue == 'en_en' and '/en/' in app.request.uri %}
<div class="col-md-6 col-lg-4 wow fadeInUp" data-wow-delay="0.3s ">
<div class="service-style2">
<div class="service-icon">
<img src="{{ asset('content/media/' ~ service.illustration) }}" alt="Service Shape">
</div>
<h3 class="service-title h5"><a class="text-inherit" href="{{ path('app_services_show', {'slug': service.slug}) }}">{{ service.title }}</a></h3>
<p class="service-text">{{service.content | u.truncate(100)}}</p>
</div>
</div>
{% endif %}
{% endfor %}
<div class="col-md-6 col-lg-4 d-flex align-items-center justify-content-center mt-30 mt-md-0 wow fadeInUp"
data-wow-delay="0.8s">
<a href="{{ path('app_services') }}" class="view-big-btn">
<i class="far fa-arrow-right"></i>
<span class="btn-text">{{ "Voir tous nos services" | trans }}</span>
</a>
</div>
</div>
</div>
</section>