lg:grid-cols-4 lg:grid-cols-3  lg:grid-cols-2
lg:flex-row-reverse
 inline-block w-fit rounded bg-primary hover:bg-primary group-hover:text-primary group-hover:bg-primary text-primary hover:text-primary
class="inline-block w-fit rounded bg-secondary hover:bg-body-bg group-hover:text-secondary group-hover:bg-body-bg text-body-bg hover:text-secondary "

  <div class="afaq lg:col-start-4 lg:col-start-3 lg:grid-cols-4 lg:col-span-6 md:col-span-6 xl:col-span-6 lg:flex-row-reverse   max-w-4xl px-10 flex flex-col gap-5 mx-auto ">
   <div class="afaq w-full mt-2 w-full rounded-xl border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 px-4 py-3 text-gray-900 dark:text-white focus:border-indigo-500 focus:ring-2 focus:ring-indigo-400 outline-none transition mt-2 w-full rounded-xl border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 px-4 py-3 text-gray-900 dark:text-white focus:border-indigo-500 focus:ring-2 focus:ring-indigo-400 outline-none transition  px-20 py-3 rounded-xl bg-primary text-body-bg font-semibold shadow-md hover:bg-secondary focus:ring-4  text-primary !bg-none border-2 border-primary mr-1 inline-flex items-center font-medium px-3 py-1 text-sm text-secondary !bg-none border-2 border-secondary  inline-flex items-center font-medium px-3 py-1 text-sm text-tertiary !bg-none border-2 border-tertiary group-hover:outline-body-bg group-hover:text-body-bg text-primary !bg-none border-2 border-primary text-secondary !bg-none border-2 border-secondary text-tertiary !bg-none border-2 border-tertiary text-body !bg-none border-2 border-body text-success !bg-none border-2 border-success text-warning !bg-none border-2 border-warning text-error !bg-none border-2 border-error text-base text-primary !bg-none border-2 border-dashed border-primary text-success !bg-none border-2 border-dashed border-success text-warning !bg-none border-2 border-dashed border-warning text-error !bg-none border-2 border-dashed border-error text-primary bg-primary/25 text-secondary bg-secondary/25 bg-body/25 inline-flex items-center font-medium px-4 py-2 text-base text-success bg-success/25 inline-flex items-center font-medium px-4 py-2 text-base text-warning bg-warning/25 text-error bg-error/25 text-error bg-error/25 text-base text-warning bg-warning/25 text-tertiary bg-tertiary/25">
   mt-2 w-full rounded-xl border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-700 px-4 py-3 text-gray-900 dark:text-white focus:border-indigo-500 focus:ring-2 focus:ring-indigo-400 outline-none transition
   </div>