Upload folder using huggingface_hub

index.html

@@ -96,9 +96,8 @@
                     </div>
                 </div>
 
-                <div class="visual-break">
-                    <img src="assets/automation.png" alt="Automation Wave"
-                        style="width: 100%; height: 100%; object-fit: cover;">
+                <div class="chart-container-wide">
+                    <canvas id="automationPotentialChart"></canvas>
                 </div>
             </div>
         </section>
@@ -149,11 +148,8 @@
                         intervention and aggressive upskilling are required to bridge this gap.</p>
                 </div>
 
-                <div class="visual-break">
-                    <!-- Placeholder for economic_impact_illustration -->
-                    <div class="img-placeholder" id="economic-placeholder">
-                        <span>Economic Impact Illustration</span>
-                    </div>
+                <div class="chart-container-wide">
+                    <canvas id="gdpImpactChart"></canvas>
                 </div>
             </div>
         </section>

script.js

@@ -81,7 +81,50 @@ new Chart(marketShiftCtx, {
     }
 });
 
-// 2. Industry Impact Radar Chart
+// 2. Automation Potential Chart (New)
+const automationPotentialCtx = document.getElementById('automationPotentialChart').getContext('2d');
+new Chart(automationPotentialCtx, {
+    type: 'bar',
+    data: {
+        labels: ['Office Support', 'Production', 'Food Service', 'Transportation', 'Sales', 'Management', 'Education'],
+        datasets: [{
+            label: '% of Tasks Automatable',
+            data: [85, 80, 75, 65, 55, 30, 20],
+            backgroundColor: [
+                'rgba(239, 68, 68, 0.8)', // High risk
+                'rgba(239, 68, 68, 0.8)',
+                'rgba(239, 68, 68, 0.8)',
+                'rgba(245, 158, 11, 0.8)', // Medium risk
+                'rgba(245, 158, 11, 0.8)',
+                'rgba(16, 185, 129, 0.8)', // Low risk
+                'rgba(16, 185, 129, 0.8)'
+            ],
+            borderRadius: 6
+        }]
+    },
+    options: {
+        responsive: true,
+        maintainAspectRatio: false,
+        plugins: {
+            legend: { display: false },
+            title: {
+                display: true,
+                text: 'Automation Potential by Sector (Current Tech)',
+                align: 'start',
+                font: { size: 16, weight: '600' }
+            }
+        },
+        scales: {
+            y: {
+                beginAtZero: true,
+                max: 100,
+                title: { display: true, text: 'Percentage (%)' }
+            }
+        }
+    }
+});
+
+// 3. Industry Impact Radar Chart
 const industryRadarCtx = document.getElementById('industryRadarChart').getContext('2d');
 new Chart(industryRadarCtx, {
     type: 'radar',
@@ -138,7 +181,7 @@ new Chart(industryRadarCtx, {
     }
 });
 
-// 3. Productivity vs Wages (Bar/Line Combo)
+// 4. Productivity vs Wages (Bar/Line Combo)
 const productivityCtx = document.getElementById('productivityChart').getContext('2d');
 new Chart(productivityCtx, {
     type: 'bar',
@@ -188,3 +231,37 @@ new Chart(productivityCtx, {
         }
     }
 });
+
+// 5. GDP Impact Chart (New)
+const gdpImpactCtx = document.getElementById('gdpImpactChart').getContext('2d');
+new Chart(gdpImpactCtx, {
+    type: 'doughnut',
+    data: {
+        labels: ['Traditional Growth', 'AI-Driven Productivity', 'New AI Products/Services'],
+        datasets: [{
+            data: [55, 30, 15],
+            backgroundColor: [
+                '#9ca3af', // Gray
+                '#2563eb', // Blue
+                '#10b981'  // Green
+            ],
+            hoverOffset: 4
+        }]
+    },
+    options: {
+        responsive: true,
+        maintainAspectRatio: false,
+        plugins: {
+            legend: {
+                position: 'right'
+            },
+            title: {
+                display: true,
+                text: 'Projected Sources of GDP Growth (2030)',
+                align: 'start',
+                font: { size: 16, weight: '600' }
+            }
+        },
+        cutout: '60%'
+    }
+});