style(team): tighter card layout — equal height, equity pill, GitHub/LinkedIn detection

- grid items-stretch so cards match height
- Smaller avatar (16->64px) to free vertical space
- Equity moved to a top-right pill (compact); decimals collapsed via equityDisplay()
- Profile link icon auto-detects GitHub vs LinkedIn vs generic
- Expertise tags get their own divider strip at card bottom — cleaner hierarchy
- Card background lightened from 0.08 to 0.04 with subtle hover border

Bio text itself shortened on the data side (both draft versions via admin API).

pitch-deck/components/slides/TeamSlide.tsx

@@ -3,7 +3,7 @@
 import { motion } from 'framer-motion'
 import { Language, PitchTeamMember } from '@/lib/types'
 import { t } from '@/lib/i18n'
-import { User, Linkedin } from 'lucide-react'
+import { User, Linkedin, Github } from 'lucide-react'
 import GradientText from '../ui/GradientText'
 import FadeInView from '../ui/FadeInView'
 import Image from 'next/image'
@@ -13,89 +13,109 @@ interface TeamSlideProps {
   team: PitchTeamMember[]
 }
 
+function equityDisplay(pct: number | string | null | undefined): string {
+  const n = Number(pct)
+  if (!Number.isFinite(n)) return '—'
+  return Number.isInteger(n) ? `${n}%` : `${n.toFixed(1)}%`
+}
+
+function detectProfileLink(url: string | null | undefined): { icon: typeof Linkedin | typeof Github; label: string } | null {
+  if (!url) return null
+  if (url.includes('github.com')) return { icon: Github, label: 'GitHub' }
+  if (url.includes('linkedin.com')) return { icon: Linkedin, label: 'LinkedIn' }
+  return { icon: Linkedin, label: 'Profile' }
+}
+
 export default function TeamSlide({ lang, team }: TeamSlideProps) {
   const i = t(lang)
 
   return (
     <div>
-      <FadeInView className="text-center mb-12">
+      <FadeInView className="text-center mb-8">
         <h2 className="text-4xl md:text-5xl font-bold mb-3">
           <GradientText>{i.team.title}</GradientText>
         </h2>
         <p className="text-lg text-white/50 max-w-2xl mx-auto">{i.team.subtitle}</p>
       </FadeInView>
 
-      <div className="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto">
+      <div className="grid md:grid-cols-2 gap-6 max-w-5xl mx-auto items-stretch">
-        {team.map((member, idx) => (
+        {team.map((member, idx) => {
-          <motion.div
+          const link = detectProfileLink(member.linkedin_url)
-            key={member.id}
+          const LinkIcon = link?.icon
-            initial={{ opacity: 0, x: idx === 0 ? -40 : 40 }}
+          return (
-            animate={{ opacity: 1, x: 0 }}
+            <motion.div
-            transition={{ delay: 0.3 + idx * 0.2, duration: 0.6 }}
+              key={member.id}
-            className="bg-white/[0.08] backdrop-blur-xl border border-white/10 rounded-3xl p-8"
+              initial={{ opacity: 0, y: 20 }}
-          >
+              animate={{ opacity: 1, y: 0 }}
-            <div className="flex items-start gap-5">
+              transition={{ delay: 0.2 + idx * 0.15, duration: 0.5 }}
-              {/* Avatar — Foto oder Fallback */}
+              className="bg-white/[0.04] backdrop-blur-xl border border-white/[0.08] rounded-2xl p-6 flex flex-col hover:border-indigo-500/20 transition-colors"
-              {member.photo_url ? (
+            >
-                <div className="w-20 h-20 rounded-2xl overflow-hidden shrink-0 shadow-lg">
+              {/* Header: avatar + name + role */}
-                  <Image
+              <div className="flex items-center gap-4 mb-5">
-                    src={member.photo_url}
+                {member.photo_url ? (
-                    alt={member.name}
+                  <div className="w-16 h-16 rounded-2xl overflow-hidden shrink-0 shadow-lg">
-                    width={80}
+                    <Image
-                    height={80}
+                      src={member.photo_url}
-                    className="w-full h-full object-cover"
+                      alt={member.name}
-                  />
+                      width={64}
-                </div>
+                      height={64}
-              ) : (
+                      className="w-full h-full object-cover"
-                <div className="w-20 h-20 rounded-2xl bg-gradient-to-br from-indigo-500 to-purple-600
+                    />
-                  flex items-center justify-center shrink-0 shadow-lg">
+                  </div>
-                  <User className="w-10 h-10 text-white" />
+                ) : (
-                </div>
+                  <div className="w-16 h-16 rounded-2xl bg-gradient-to-br from-indigo-500 to-purple-600 flex items-center justify-center shrink-0 shadow-lg shadow-indigo-500/20">
-              )}
+                    <User className="w-8 h-8 text-white" />
+                  </div>
+                )}
 
-              <div className="flex-1">
+                <div className="min-w-0 flex-1">
-                <div className="flex items-center gap-2 mb-1">
+                  <div className="flex items-center gap-2 mb-0.5 flex-wrap">
-                  <h3 className="text-xl font-bold text-white">{member.name}</h3>
+                    <h3 className="text-xl font-bold text-white truncate">{member.name}</h3>
-                  {member.linkedin_url && (
+                    {link && LinkIcon && (
-                    <a
+                      <a
-                      href={member.linkedin_url}
+                        href={member.linkedin_url!}
-                      target="_blank"
+                        target="_blank"
-                      rel="noopener noreferrer"
+                        rel="noopener noreferrer"
-                      className="p-1 text-white/30 hover:text-[#0A66C2] transition-colors"
+                        className="text-white/30 hover:text-indigo-300 transition-colors"
-                      title="LinkedIn"
+                        title={link.label}
-                    >
+                      >
-                      <Linkedin className="w-4 h-4" />
+                        <LinkIcon className="w-4 h-4" />
-                    </a>
+                      </a>
-                  )}
+                    )}
-                </div>
+                  </div>
-                <p className="text-indigo-400 text-sm font-medium mb-3">
+                  <p className="text-indigo-400 text-sm font-medium">
-                  {lang === 'de' ? member.role_de : member.role_en}
+                    {lang === 'de' ? member.role_de : member.role_en}
-                </p>
+                  </p>
-                <p className="text-sm text-white/50 leading-relaxed mb-4">
-                  {lang === 'de' ? member.bio_de : member.bio_en}
-                </p>
-
-                {/* Equity */}
-                <div className="flex items-center gap-2 mb-3">
-                  <span className="text-xs text-white/40">{i.team.equity}:</span>
-                  <span className="text-sm font-bold text-white">{member.equity_pct}%</span>
                 </div>
 
-                {/* Expertise Tags */}
+                {/* Equity pill in top-right */}
-                <div className="flex flex-wrap gap-1.5">
+                <div className="text-right shrink-0">
+                  <div className="text-[10px] uppercase tracking-wider text-white/30">{i.team.equity}</div>
+                  <div className="text-base font-bold text-white tabular-nums">{equityDisplay(member.equity_pct)}</div>
+                </div>
+              </div>
+
+              {/* Bio */}
+              <p className="text-sm text-white/60 leading-relaxed mb-5 flex-1">
+                {lang === 'de' ? member.bio_de : member.bio_en}
+              </p>
+
+              {/* Expertise tags */}
+              {(member.expertise || []).length > 0 && (
+                <div className="flex flex-wrap gap-1.5 pt-4 border-t border-white/[0.06]">
                   {(member.expertise || []).map((skill, sidx) => (
                     <span
                       key={sidx}
-                      className="text-xs px-2.5 py-1 rounded-full bg-indigo-500/10 text-indigo-300 border border-indigo-500/20"
+                      className="text-[11px] px-2.5 py-1 rounded-full bg-indigo-500/10 text-indigo-300 border border-indigo-500/20"
                     >
                       {skill}
                     </span>
                   ))}
                 </div>
-              </div>
+              )}
-            </div>
+            </motion.div>
-          </motion.div>
+          )
-        ))}
+        })}
       </div>
     </div>
   )