<div class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
  {% for wizard in wizards %}
  <a href="{{ wizard.href }}" class="rounded-3xl border border-slate-200 bg-white p-5 shadow-soft hover:border-brand-300 hover:bg-brand-50/30"><h3 class="font-semibold text-slate-900">{{ wizard.title }}</h3><p class="mt-2 text-sm text-slate-500">{{ wizard.desc }}</p><div class="mt-4 text-sm font-semibold text-brand-700">Open →</div></a>
  {% endfor %}
</div>
