Update card component style.

Author: nikoshell

src/components/card/card.astro

@@ -13,7 +13,7 @@ export interface Props {
 const { title, subtitle, url, image } = Astro.props;
 ---
 
-<div class="block min-w-[250px] w-full md:w-[40%] lg:w-[30%] p-4 bg-[#D5D6E6] rounded-2xl">
+<div class="block min-w-[250px] w-full md:w-[40%] lg:w-[30%] p-4 bg-[#D5D6E6] rounded-2xl text-center flex flex-col h-full">
   <a href={url} class="block">
     <div class="relative w-full mb-4">
       <Image
@@ -26,15 +26,16 @@ const { title, subtitle, url, image } = Astro.props;
       />
     </div>
   </a>
-  <div class="flex flex-col items-start">
+  <div class="flex flex-col items-center flex-grow mb-2">
     <a href={url} class="block hover:underline">
       <h3 class="text-2xl text-primary">{title}</h3>
     </a>
-      <slot />
+    <slot />
   </div>
-<a class="mt-2 text-xs px-2 py-1 bg-[#141F36] text-white rounded-[10px] inline-block leading-4 hover:bg-button-hover not-prose rounded-[5px]" href="{url}">
+  <a class="text-xs px-2 py-1 mt-4 bg-[#141F36] text-white rounded-[10px] inline-block w-fit mx-auto leading-4 hover:bg-button-hover not-prose mt-auto" href="{url}">
     {subtitle}
- <span class="inline-block ml-1 font-system text-lg leading-4" >
-↗
-</span></a>
+    <span class="inline-block ml-1 font-system text-lg leading-4">
+      ↗
+    </span>
+  </a>
 </div>