diff --git a/frontend/components/tabs/AgenticReadinessTab.tsx b/frontend/components/tabs/AgenticReadinessTab.tsx
index ec81854..d5f3d22 100644
--- a/frontend/components/tabs/AgenticReadinessTab.tsx
+++ b/frontend/components/tabs/AgenticReadinessTab.tsx
@@ -228,6 +228,21 @@ function AgenticMethodologyIntro({
   totalQueues: number;
 }) {
   const [isExpanded, setIsExpanded] = useState(false);
+  const componentRef = React.useRef<HTMLDivElement>(null);
+
+  // Close when clicking outside
+  React.useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      if (isExpanded && componentRef.current && !componentRef.current.contains(event.target as Node)) {
+        setIsExpanded(false);
+      }
+    };
+
+    if (isExpanded) {
+      document.addEventListener('mousedown', handleClickOutside);
+      return () => document.removeEventListener('mousedown', handleClickOutside);
+    }
+  }, [isExpanded]);
 
   // Calcular estadísticas para el roadmap
   const automatizableQueues = tierData.AUTOMATE.count + tierData.ASSIST.count;
@@ -239,12 +254,13 @@ function AgenticMethodologyIntro({
     : 0;
 
   return (
-    <Card padding="none">
-      {/* Header con toggle */}
-      <div
-        className="px-5 py-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-200 cursor-pointer"
-        onClick={() => setIsExpanded(!isExpanded)}
-      >
+    <div ref={componentRef}>
+      <Card padding="none">
+        {/* Header con toggle */}
+        <div
+          className="px-5 py-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-200 cursor-pointer"
+          onClick={() => setIsExpanded(!isExpanded)}
+        >
         <div className="flex items-center justify-between">
           <div className="flex items-center gap-3">
             <div className="p-2 rounded-lg bg-blue-100">
@@ -453,7 +469,8 @@ function AgenticMethodologyIntro({
           <span className="ml-auto text-blue-600 font-medium">Click para expandir metodología</span>
         </div>
       )}
-    </Card>
+      </Card>
+    </div>
   );
 }