<script>
	let { topText, bottomText = undefined, children = undefined } = $props();
</script>

<section>
	<div class="flex flex-col items-center justify-center gap-6">
		{#if topText}
			<div class="text-5xl font-bold leading-tight max-w-[800px]">{@html topText}</div>
		{/if}
		{#if children}
			<div class="flex items-center justify-center max-w-[650px]">
				{@render children?.()}
			</div>
		{/if}
		{#if bottomText}
			<div class="text-2xl max-w-[650px]">{@html bottomText}</div>
		{/if}
	</div>
</section>
