feat: classes admin collapsible cards, icon curation, color fix + user-side polish

Admin classes:
- Collapsible cards in ArrayEditor (start collapsed, expand on click)
- Curated 29 dance-relevant icons shown by default, full search as fallback
- Color swatches: used colors dimmed instead of hidden (no layout shift)

User side:
- Classes: icon + name side by side on photo overlay
- ShowcaseLayout: fix image flash during transition (2-frame swap while hidden)
- Team bio: section headings gold, admin cards focus-within highlight

src/components/sections/Classes.tsx

@@ -61,8 +61,8 @@ export function Classes({ data: classes }: ClassesProps) {
                       <div className="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent" />
 
                       {/* Icon + name overlay */}
-                      <div className="absolute bottom-0 left-0 right-0 p-6">
-                        <div className="mb-2 inline-flex h-9 w-9 items-center justify-center rounded-lg bg-gold/20 text-gold-light backdrop-blur-sm">
+                      <div className="absolute bottom-0 left-0 right-0 p-6 flex items-center gap-3">
+                        <div className="inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-gold/20 text-gold-light backdrop-blur-sm">
                           {getIcon(item.icon)}
                         </div>
                         <h3 className="text-2xl font-bold text-white">

src/components/ui/ShowcaseLayout.tsx

@@ -43,14 +43,24 @@ export function ShowcaseLayout<T>({
     }
   }, [displayIndex, fading]);
 
+  const [fadingIn, setFadingIn] = useState(false);
+
   useEffect(() => {
     if (activeIndex === displayIndex) return;
     setFading(true);
-    const timeout = setTimeout(() => {
+    // Wait for fade-out, then swap content while hidden
+    const fadeOut = setTimeout(() => {
       setDisplayIndex(activeIndex);
-      setFading(false);
+      // Keep hidden for one frame so new content renders before fade-in
+      setFadingIn(true);
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          setFading(false);
+          setFadingIn(false);
+        });
+      });
     }, UI_CONFIG.showcase.fadeMs);
-    return () => clearTimeout(timeout);
+    return () => clearTimeout(fadeOut);
   }, [activeIndex, displayIndex]);
 
   // Auto-scroll selector only when item is out of view
@@ -136,7 +146,7 @@ export function ShowcaseLayout<T>({
           <div
             ref={detailRef}
             className={`transition-all duration-300 ease-out ${
-              fading
+              fading || fadingIn
                 ? "opacity-0 translate-y-2"
                 : "opacity-100 translate-y-0"
             }`}