Modificaciones en la vista se modifico el nombre de la area

src/app/page.tsx

@@ -91,10 +91,20 @@ export default function Home() {
     }
   };
 
+  const capitalizeWords = (s: string) => {
+    if (!s) return '';
+    return s
+      .toLowerCase()
+      .split(/\s+/)
+      .filter(Boolean)
+      .map((w) => w.charAt(0).toUpperCase() + w.slice(1))
+      .join(' ');
+  };
+
   return (
     <main className="container-fluid py-4 bg-light min-h-screen">
       <div className="row">
-  <BuscarFuncionario onResultados={setResultados} onAreaSelected={(id, label) => { setCurrentAreaLabel(label); buscarPorArea(id); }} onClear={() => { setCurrentAreaLabel(''); setResultados([]); }} />
+  <BuscarFuncionario onResultados={setResultados} onAreaSelected={(id, label) => { setCurrentAreaLabel(capitalizeWords(label)); buscarPorArea(id); }} onClear={() => { setCurrentAreaLabel(''); setResultados([]); }} />
 
         <div className="col-12 col-md-9">
           <h2 className="text-dorado mb-4">Directorio de Funcionarios</h2>
@@ -137,7 +147,7 @@ export default function Home() {
                             touchAction: 'none',
                           }}
                         >
-                          <OrganigramaInteractivo onAreaSelect={(id: number) => { buscarPorArea(id); }} isPanningRef={isPanning} onAreaLabel={(id, label) => setCurrentAreaLabel(label)} />
+                          <OrganigramaInteractivo onAreaSelect={(id: number) => { buscarPorArea(id); }} isPanningRef={isPanning} onAreaLabel={(id, label) => setCurrentAreaLabel(capitalizeWords(label))} />
                         </div>
                       </div>
                     </div>