{% trans_default_domain 'Site' %}
{% from ('main/site/views/Partials/icon.html.twig') import icon %}
<div class="hero">
<div class="container-fluid">
<div class="hero__wrapper">
<div class="hero__image">
<picture>
<source srcset="{{ asset('/images/main/product/hero-'~app.request.locale~'.webp') }} 1x, {{ asset('/images/main/product/hero-'~app.request.locale~'@2x.webp') }} 1.5x" type="image/webp">
<source srcset="{{ asset('/images/main/product/hero-'~app.request.locale~'.png') }} 1x, {{ asset('/images/main/product/hero-'~app.request.locale~'@2x.png') }} 1.5x" type="image/png">
<img width="416" height="362" loading="lazy" src="{{ asset('/images/main/product/hero-'~app.request.locale~'.png') }}" alt="{{ 'site.common.hero.brulafine.title'|trans }}">
</picture>
</div>
<div class="hero__body">
<div class="underline-bottom hero__title">
{% set title = 'site.common.hero.brulafine.title'|trans %}
{% if headerTag is defined %}
{% if headerTag == 'h1' %}
<h1>{{ title }}</h1>
{% elseif headerTag == 'h2' %}
<h2>{{ title }}</h2>
{% elseif headerTag == 'h3' %}
<h3>{{ title }}</h3>
{% else %}
<p>{{ title }}</p>
{% endif %}
{% else %}
{{ 'site.common.hero.brulafine.title'|trans }}
{% endif %}
</div>
<div class="hero__content">
<div class="hero__text">
<p>
{{ 'site.common.hero.brulafine.text'|trans | raw }}
{% if affiliateForLegalNotices(tracking) %}
<sup>*</sup>
{% endif %}
</p>
</div>
<div class="hero__cta">
{# mobileCTA - if defined - the button will got on the bottom like on the homepage #}
<a href="{{ path('brulafine_show_packs') }}" class="btn btn-lg btn-default d-inline-flex align-items-center justify-content-center {% if mobileCTA is defined %}mobile-cta{% endif %}">
{{icon('cart', 'mr-1')}}
{{ 'site.common.buttons.buyNowV2'|trans }}
</a>
</div>
<p class="hero__text__under-btn">
{{ 'site.common.hero.brulafine.text2'|trans }}
{% if affiliateForLegalNotices(tracking) %}
<br> {{ 'site.common.hero.brulafine.legal'|trans }}
{% endif %}
</p>
</div>
</div>
</div>
</div>
</div>