{{ partial:partials/background }}
<article class="">
    <div class="flex flex-col items-center justify-center h-[50vh] bg-gradient-to-t from-white to-transparent px-8">
        <h1 class="h1 text-center">{{ title }}</h1>
        {{ if hero_texte_intro }}
            <div class="font-medium text-center max-w-2xl text-lg my-8">{{ hero_texte_intro }}</div>
        {{ /if }}
        {{ if hero_lien }}
            <a href="{{ hero_lien.url }}" class="btn--link mt-4">{{ hero_lien.text }}</a>
        {{ /if }}
    </div>
    <div class="bg-white px-8 flex justify-center">
        {{ if hero_image }}
            {{ partial:components/picture w="1150" h="700" class="rounded-xxl" :image="hero_image" }}
        {{ /if }}
    </div>
    <div class="bg-white flex flex-col">
        {{ blocs_flexibles }}
            {{ partial src="blocks/{type replace='_|-'}" }}
        {{ /blocs_flexibles }}
    </div>
</article>