{% if pimcore_checkbox('usp-enabled').isChecked()|default() %}
<section class="max-w-screen w-full relative sm:mt-[52px] sm:h-0">
<div class="md:absolute sm:-top-[52px] whitespace-nowrap swiper hero-usp-swiper md:border-b-2 border-gray-300">
<div class="swiper-wrapper min-h-[52px] items-center xl:!container xl:!box-border xl:justify-between">
{% for usp in ['usp-1', 'usp-2', 'usp-3', 'usp-4'] %}
{% if not pimcore_wysiwyg(usp).isEmpty() %}
<div
class="swiper-slide flex items-center justify-center xl:justify-start gap-2 xl:!w-max w-[100%]">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(-317.000000, -131.000000)" fill="#01B902">
<g transform="translate(0.000000, 113.000000)">
<g transform="translate(317.000000, 18.000000)">
<g transform="translate(0.000000, -0.000000)">
<path
d="M8,-4.4408921e-16 C3.581722,-4.4408921e-16 8.8817842e-16,3.581722 8.8817842e-16,8 C8.8817842e-16,12.418278 3.581722,16 8,16 C12.418278,16 16,12.418278 16,8 C15.9948422,3.58386021 12.4161398,0.00515783683 8,-4.4408921e-16 Z M8,14.4 C4.4653776,14.4 1.6,11.5346224 1.6,8 C1.6,4.4653776 4.4653776,1.6 8,1.6 C11.5346224,1.6 14.4,4.4653776 14.4,8 C14.3959441,11.532941 11.532941,14.3959441 8,14.4 Z M10.06872,5.6 L11.2,6.73128 L7.7656,10.1656 C7.61562989,10.3156749 7.41216387,10.3999949 7.2,10.3999949 C6.98783613,10.3999949 6.78437011,10.3156749 6.6344,10.1656 L4.8,8.33128 L5.93128,7.2 L7.2,8.46872 L10.06872,5.6 Z"
id="Shape"/>
</g>
</g>
</g>
</g>
</g>
</svg>
{{ pimcore_wysiwyg(usp).getData() | raw }}
</div>
{% endif %}
{% endfor %}
</div>
</div>
</section>
{% endif %}