<div class="space-y-4 md:flex md:gap-10 md:space-y-0">
    {{ steps }}
        {{ partial src="components/molecules/cards/card" size="sm" bg_color="bg-white" classes="flex-1"  }}
            {{ slot:title }}
                <div class="flex items-center gap-x-4 mb-2.5">
                    <div class="flex items-center justify-center size-8 text-white bg-primary-500 rounded-full">
                        {{ count }}
                    </div>
                    {{ partial:components/atoms/text/heading tag="h3" size="md" }}
                </div>
            {{ /slot:title }}

            {{ content }}
                {{ partial:if_exists src="components/molecules/content/{type}" }}
            {{ /content }}
        {{ /partial }}
    {{ /steps }}
</div>
