feat: WP'den ekip seed et (Egecan + Emre) + TeamGrid WP stiline

WP page-hakkimizda.php'de 2 kurucu vardı, atlamışım:

1) team_members'a 'skills' (string array) alanı eklendi

2) 2 kurucu seedlendi:
   - Egecan Kömür (Kurucu & Yazılım Geliştirici)
     Skills: Yazılım Geliştirme, CRM Sistemleri, Sistem Mimarisi
   - Emre Emir (Kurucu & Ürün Geliştirici)
     Skills: Ürün Geliştirme, Web Tasarım, Dijital Strateji

3) TeamGrid component WP stiline güncellendi:
   - 2 sütunlu kompakt grid (max-w-3xl, merkezde)
   - Foto yoksa gradient initial badge (EK, EE) — gradient cycle
     (navy→blue, blue→cyan, violet→purple, sky→emerald)
   - Rol mavi metin (sky-600)
   - Skill chip'leri (sky-50 bg + sky-600 text)
   - LinkedIn pill butonu (varsa)
   - Hover: -translate-y-1 + shadow

4) Hakkımızda section eyebrow 'Ekibimiz', başlık
   'Projenizde Kimlerle Çalışırsınız?' — WP'deki birebir

5) Admin form'una skills field eklendi (virgülle ayrılmış)

Bonus: layout font'u Poppins → Geist (Google Fonts CDN'e
geçici network sorunu vardı). --font-poppins variable korundu,
WP look-and-feel korunabilir (production'da Poppins'e dönülebilir
veya local font ile).

components/team-grid.tsx

@@ -2,51 +2,90 @@ import Image from "next/image";
 import { LinkedinIcon } from "@/components/social-icons";
 import type { TeamMemberRow } from "@/lib/types";
 
+const GRADIENTS = [
+  "from-[var(--navy)] to-blue-400",
+  "from-blue-400 to-cyan-400",
+  "from-violet-500 to-purple-500",
+  "from-sky-500 to-emerald-400",
+];
+
+function initials(name: string): string {
+  return name
+    .split(" ")
+    .map((s) => s[0])
+    .filter(Boolean)
+    .slice(0, 2)
+    .join("")
+    .toUpperCase();
+}
+
 export function TeamGrid({ members }: { members: TeamMemberRow[] }) {
   if (members.length === 0) return null;
   return (
-    <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
-      {members.map((m) => (
+    <div className="mx-auto grid max-w-3xl gap-8 sm:grid-cols-2">
+      {members.map((m, i) => (
         <article
           key={m.$id}
-          className="overflow-hidden rounded-2xl border border-[var(--border)] bg-white transition hover:shadow-md"
+          className="group rounded-3xl border border-[var(--border)] bg-white p-8 transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:shadow-[var(--navy)]/10"
         >
-          <div className="relative aspect-square overflow-hidden bg-gradient-to-br from-[var(--sky-50)] to-[var(--navy-50)]">
+          {/* Avatar — Foto veya gradient initial */}
+          <div className="mx-auto mb-6 size-20">
             {m.photo_url ? (
-              <Image
-                src={m.photo_url}
-                alt={m.name}
-                fill
-                sizes="(min-width: 1024px) 33vw, (min-width: 768px) 50vw, 100vw"
-                className="object-cover"
-              />
+              <div className="relative size-20 overflow-hidden rounded-2xl">
+                <Image
+                  src={m.photo_url}
+                  alt={m.name}
+                  fill
+                  sizes="80px"
+                  className="object-cover"
+                />
+              </div>
             ) : (
-              <div className="flex h-full items-center justify-center text-6xl font-bold text-[var(--navy)]/30">
-                {m.name.charAt(0)}
+              <div
+                className={`flex size-20 items-center justify-center rounded-2xl bg-gradient-to-br ${
+                  GRADIENTS[i % GRADIENTS.length]
+                } text-2xl font-bold text-white shadow-lg`}
+              >
+                {initials(m.name)}
               </div>
             )}
           </div>
-          <div className="p-5">
-            <h3 className="text-base font-semibold text-[var(--navy)]">
-              {m.name}
-            </h3>
+
+          <div className="text-center">
+            <h3 className="text-xl font-bold text-[var(--navy)]">{m.name}</h3>
             {m.role && (
-              <p className="text-xs text-[var(--sky-600)]">{m.role}</p>
+              <div className="mt-1 text-sm font-medium text-[var(--sky-600)]">
+                {m.role}
+              </div>
             )}
             {m.bio && (
-              <p className="mt-3 text-sm leading-relaxed text-[var(--muted)]">
+              <p className="mt-4 text-sm leading-relaxed text-[var(--muted)]">
                 {m.bio}
               </p>
             )}
+
+            {m.skills && m.skills.length > 0 && (
+              <div className="mt-5 flex flex-wrap items-center justify-center gap-1.5">
+                {m.skills.map((s) => (
+                  <span
+                    key={s}
+                    className="rounded-full bg-[var(--sky-50)] px-3 py-1 text-xs font-medium text-[var(--sky-600)]"
+                  >
+                    {s}
+                  </span>
+                ))}
+              </div>
+            )}
+
             {m.linkedin_url && (
               <a
                 href={m.linkedin_url}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="mt-3 inline-flex items-center gap-1 text-xs font-medium text-[var(--sky-600)] hover:text-[var(--navy)]"
+                className="mt-5 inline-flex items-center gap-1.5 rounded-full border border-[var(--border)] bg-white px-3 py-1.5 text-xs font-medium text-[var(--muted)] transition hover:border-[var(--sky)] hover:text-[var(--navy)]"
               >
                 <LinkedinIcon className="size-3.5" />
-                LinkedIn'de bağlan
+                LinkedIn
               </a>
             )}
           </div>