feat: add trainer bio (experience, victories, education) across all layers

- Extend TeamMember type with experience/victories/education string arrays
- Add DB columns with auto-migration for existing databases
- Update API POST route to accept bio fields
- Add ListField component for editing string arrays in admin
- Add bio section (Опыт/Достижения/Образование) to team member admin form
- Create TeamProfile component with full profile view (photo + bio sections)
- Add "Подробнее" button to TeamMemberInfo that toggles to profile view

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/components/sections/Team.tsx

@@ -5,6 +5,7 @@ import { SectionHeading } from "@/components/ui/SectionHeading";
 import { Reveal } from "@/components/ui/Reveal";
 import { TeamCarousel } from "@/components/sections/team/TeamCarousel";
 import { TeamMemberInfo } from "@/components/sections/team/TeamMemberInfo";
+import { TeamProfile } from "@/components/sections/team/TeamProfile";
 import type { SiteContent } from "@/types/content";
 
 interface TeamProps {
@@ -13,6 +14,7 @@ interface TeamProps {
 
 export function Team({ data: team }: TeamProps) {
   const [activeIndex, setActiveIndex] = useState(0);
+  const [showProfile, setShowProfile] = useState(false);
 
   return (
     <section
@@ -37,17 +39,27 @@ export function Team({ data: team }: TeamProps) {
 
         <Reveal>
           <div className="mt-10">
-            <TeamCarousel
-              members={team.members}
-              activeIndex={activeIndex}
-              onActiveChange={setActiveIndex}
-            />
+            {!showProfile ? (
+              <>
+                <TeamCarousel
+                  members={team.members}
+                  activeIndex={activeIndex}
+                  onActiveChange={setActiveIndex}
+                />
 
-            <TeamMemberInfo
-              members={team.members}
-              activeIndex={activeIndex}
-              onSelect={setActiveIndex}
-            />
+                <TeamMemberInfo
+                  members={team.members}
+                  activeIndex={activeIndex}
+                  onSelect={setActiveIndex}
+                  onOpenBio={() => setShowProfile(true)}
+                />
+              </>
+            ) : (
+              <TeamProfile
+                member={team.members[activeIndex]}
+                onBack={() => setShowProfile(false)}
+              />
+            )}
           </div>
         </Reveal>
       </div>

src/components/sections/team/TeamMemberInfo.tsx

@@ -5,9 +5,10 @@ interface TeamMemberInfoProps {
   members: TeamMember[];
   activeIndex: number;
   onSelect: (index: number) => void;
+  onOpenBio: () => void;
 }
 
-export function TeamMemberInfo({ members, activeIndex, onSelect }: TeamMemberInfoProps) {
+export function TeamMemberInfo({ members, activeIndex, onSelect, onOpenBio }: TeamMemberInfoProps) {
   const member = members[activeIndex];
 
   return (
@@ -36,6 +37,13 @@ export function TeamMemberInfo({ members, activeIndex, onSelect }: TeamMemberInf
         </p>
       )}
 
+      <button
+        onClick={onOpenBio}
+        className="mt-3 text-sm font-medium text-gold hover:text-gold-light transition-colors cursor-pointer"
+      >
+        Подробнее →
+      </button>
+
       {/* Progress dots */}
       <div className="mt-6 flex items-center justify-center gap-1.5">
         {members.map((_, i) => (

src/components/sections/team/TeamProfile.tsx

@@ -0,0 +1,109 @@
+import Image from "next/image";
+import { ArrowLeft, Instagram, Trophy, Award, GraduationCap } from "lucide-react";
+import type { TeamMember } from "@/types/content";
+
+interface TeamProfileProps {
+  member: TeamMember;
+  onBack: () => void;
+}
+
+const BIO_SECTIONS = [
+  { key: "experience" as const, label: "Опыт", icon: Trophy },
+  { key: "victories" as const, label: "Достижения", icon: Award },
+  { key: "education" as const, label: "Образование", icon: GraduationCap },
+];
+
+export function TeamProfile({ member, onBack }: TeamProfileProps) {
+  const hasBio = BIO_SECTIONS.some(
+    (s) => member[s.key] && member[s.key]!.length > 0
+  );
+
+  return (
+    <div
+      className="mx-auto max-w-3xl"
+      style={{ animation: "team-info-in 0.6s cubic-bezier(0.16, 1, 0.3, 1)" }}
+    >
+      {/* Back button */}
+      <button
+        onClick={onBack}
+        className="mb-6 inline-flex items-center gap-1.5 text-sm text-white/40 transition-colors hover:text-gold-light cursor-pointer"
+      >
+        <ArrowLeft size={16} />
+        Назад
+      </button>
+
+      {/* Main: photo + info */}
+      <div className="flex flex-col items-center gap-8 sm:flex-row sm:items-start">
+        {/* Photo */}
+        <div className="relative w-full max-w-[260px] shrink-0 aspect-[3/4] overflow-hidden rounded-2xl border border-white/[0.06]">
+          <Image
+            src={member.image}
+            alt={member.name}
+            fill
+            sizes="260px"
+            className="object-cover"
+          />
+        </div>
+
+        {/* Info */}
+        <div className="text-center sm:text-left">
+          <h3 className="text-2xl font-bold text-white">{member.name}</h3>
+          <p className="mt-1 text-sm font-medium text-gold-light">
+            {member.role}
+          </p>
+
+          {member.instagram && (
+            <a
+              href={member.instagram}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="mt-3 inline-flex items-center gap-1.5 text-sm text-white/40 transition-colors hover:text-gold-light"
+            >
+              <Instagram size={14} />
+              {member.instagram.split("/").filter(Boolean).pop()}
+            </a>
+          )}
+
+          {member.description && (
+            <p className="mt-4 text-sm leading-relaxed text-white/55">
+              {member.description}
+            </p>
+          )}
+        </div>
+      </div>
+
+      {/* Bio sections */}
+      {hasBio && (
+        <div className="mt-8 grid grid-cols-1 gap-6 sm:grid-cols-3">
+          {BIO_SECTIONS.map((section) => {
+            const items = member[section.key];
+            if (!items || items.length === 0) return null;
+            const Icon = section.icon;
+
+            return (
+              <div key={section.key}>
+                <div className="flex items-center gap-2 text-gold">
+                  <Icon size={16} />
+                  <span className="text-xs font-semibold uppercase tracking-wider">
+                    {section.label}
+                  </span>
+                </div>
+                <ul className="mt-3 space-y-2">
+                  {items.map((item, i) => (
+                    <li
+                      key={i}
+                      className="flex items-start gap-2 text-sm text-white/60"
+                    >
+                      <span className="mt-1.5 h-1 w-1 shrink-0 rounded-full bg-gold/50" />
+                      {item}
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            );
+          })}
+        </div>
+      )}
+    </div>
+  );
+}