diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 306a303..ddc43d5 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -199,6 +199,64 @@ th a:hover {
   margin: 2rem 0;
 }
 
+.dashboard-kpi-cards {
+  grid-template-columns: 1fr;
+  gap: 0.9rem;
+  margin: 1.25rem 0 1.5rem;
+}
+
+.dashboard-kpi-cards .funnel-card {
+  padding: 1rem;
+  position: relative;
+}
+
+.dashboard-kpi-cards .funnel-card .card-header h3 {
+  font-size: 1rem;
+}
+
+.dashboard-kpi-cards .funnel-card .card-number {
+  font-size: 2.1rem;
+}
+
+.dashboard-kpi-cards .funnel-card .card-subtitle {
+  font-size: 0.82rem;
+}
+
+@media (min-width: 768px) {
+  .dashboard-kpi-cards {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (min-width: 1024px) {
+  .dashboard-kpi-cards {
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+
+  .dashboard-kpi-cards .funnel-card:nth-child(-n+2)::after {
+    content: "";
+    position: absolute;
+    top: 50%;
+    right: -0.45rem;
+    width: 0.9rem;
+    border-top: 2px dashed var(--border-color);
+    transform: translateY(-50%);
+    z-index: 2;
+  }
+
+  .dashboard-kpi-cards .funnel-card:nth-child(-n+2)::before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    right: -0.62rem;
+    border-top: 5px solid transparent;
+    border-bottom: 5px solid transparent;
+    border-left: 7px solid var(--border-color);
+    transform: translateY(-50%);
+    z-index: 2;
+  }
+}
+
 .weekly-cards {
   grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
 }
diff --git a/app/controllers/dashboard_controller.rb b/app/controllers/dashboard_controller.rb
index 424796b..0cbc398 100644
--- a/app/controllers/dashboard_controller.rb
+++ b/app/controllers/dashboard_controller.rb
@@ -5,6 +5,12 @@ def index
     @total_resumes = opportunities.where.not(application_date: nil).count
     @total_open_applications = opportunities.where(status: %w[applied interviewing]).count
     @total_assessed = opportunities.count
+    @total_interviews = InterviewSession.where(opportunity_id: opportunities.select(:id)).count
+    @interview_conversion_rate = if @total_resumes.positive?
+      ((@total_interviews.to_f / @total_resumes) * 100).round(1)
+    else
+      0.0
+    end
 
     # Role-based focus insights
     focus_analyzer = RoleFocusAnalyzer.new(opportunities)
diff --git a/app/views/dashboard/index.html.erb b/app/views/dashboard/index.html.erb
index bc2afd8..8b2b073 100644
--- a/app/views/dashboard/index.html.erb
+++ b/app/views/dashboard/index.html.erb
@@ -3,8 +3,18 @@
 <h1 style="padding-top: 1.5rem;">Career Intelligence Dashboard</h1>
 
 <!-- Row 1: KPI Stats -->
-<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
-  <div class="card card-submitted">
+<div class="dashboard-cards dashboard-kpi-cards">
+  <div class="card funnel-card card-assessed">
+    <div class="card-header justify-center text-center">
+      <h3>Assessed Opportunities</h3>
+    </div>
+    <div class="card-body">
+      <div class="card-number"><%= @total_assessed %></div>
+      <p class="card-subtitle">Total opportunities tracked</p>
+    </div>
+  </div>
+
+  <div class="card funnel-card card-submitted">
     <div class="card-header justify-center text-center">
       <h3>Total Applications Submitted</h3>
     </div>
@@ -14,23 +24,23 @@
     </div>
   </div>
 
-  <div class="card card-open-applications">
+  <div class="card funnel-card card-interviews">
     <div class="card-header justify-center text-center">
-      <h3>Total Open Applications</h3>
+      <h3>Total Interviews</h3>
     </div>
     <div class="card-body">
-      <div class="card-number"><%= @total_open_applications %></div>
-      <p class="card-subtitle">Current Applications in Flight</p>
+      <div class="card-number"><%= @total_interviews %></div>
+      <p class="card-subtitle"><%= @interview_conversion_rate %>% of applications submitted</p>
     </div>
   </div>
 
-  <div class="card card-assessed">
+  <div class="card funnel-card card-open-applications">
     <div class="card-header justify-center text-center">
-      <h3>Assessed Opportunities</h3>
+      <h3>Total Open Applications</h3>
     </div>
     <div class="card-body">
-      <div class="card-number"><%= @total_assessed %></div>
-      <p class="card-subtitle">Total opportunities tracked</p>
+      <div class="card-number"><%= @total_open_applications %></div>
+      <p class="card-subtitle">Current Applications in Flight</p>
     </div>
   </div>
 </div>