feat: Add user profile page and new modular profile components, integrating them into the agent dashboard.

src/components/profile/SpecializationCard.tsx

@@ -0,0 +1,36 @@
+'use client';
+
+import Image from 'next/image';
+
+interface SpecializationCardProps {
+  title: string;
+  items: string[];
+  icon: React.ReactNode;
+}
+
+export function SpecializationCard({ title, items, icon }: SpecializationCardProps) {
+  return (
+    <div className="bg-white rounded-[20px] p-6 text-center flex flex-col h-full border-[0.7px] border-[#E58625]">
+      <div className="flex justify-center mb-3">{icon}</div>
+      <h4 className="font-bold text-[#00293D] text-[14px] leading-[17px] mb-4 font-fractul">{title}</h4>
+      <div className="flex-1">
+        {items.map((item, idx) => (
+          <p key={idx} className="text-[#00293D] text-[14px] leading-[25px] font-normal font-serif text-center">
+            {item}
+          </p>
+        ))}
+      </div>
+      <div className="mt-4 flex justify-center">
+        <button className="inline-flex items-center justify-center gap-1 h-[20px] w-[87px] border border-[#e58625] rounded-[20px] text-[#e58625] text-[10px] leading-[22px] font-bold font-serif hover:bg-[#e58625]/5 transition-colors">
+          Show More
+          <Image
+            src="/assets/icons/chevron-down-icon.svg"
+            alt="Show more"
+            width={10}
+            height={10}
+          />
+        </button>
+      </div>
+    </div>
+  );
+}