diff --git a/libs/domains/landingpage/frontend/feature-workflow/src/lib/page/workflow-overview/workflow-overview.component.html b/libs/domains/landingpage/frontend/feature-workflow/src/lib/page/workflow-overview/workflow-overview.component.html
index bed7a48..bde73fe 100644
--- a/libs/domains/landingpage/frontend/feature-workflow/src/lib/page/workflow-overview/workflow-overview.component.html
+++ b/libs/domains/landingpage/frontend/feature-workflow/src/lib/page/workflow-overview/workflow-overview.component.html
@@ -17,12 +17,11 @@ <h2 class="text-primary mb-4" i18n="@@gsWorkflowTitle">AI-Assisted Development W
       <div class="col-md-12">
         <div class="card h-100 overflow-hidden">
           <div class="card-body p-0">
-            <div class="d-flex flex-row flex-wrap">
-              <div class="w-50 p-5 bg-primary d-flex align-items-center justify-content-center">
+            <div class="row">
+              <div class="col-md-6 p-5 bg-primary d-flex align-items-center justify-content-center">
                 <h5 class="card-title text-white mb-0" i18n="@@workflowResearchCommand">/research</h5>
               </div>
-
-              <div class="w-50 p-5">
+              <div class="col-md-6 p-5">
                 <h4 class="card-title text-primary mb-2" i18n="@@workflowResearchTitle">1. Research</h4>
                 <p class="text-muted mb-0" i18n="@@workflowResearchDesc">
                   Explore topics deeply through multiple sources and perspectives. Synthesize findings, evaluate
@@ -40,8 +39,8 @@ <h4 class="card-title text-primary mb-2" i18n="@@workflowResearchTitle">1. Resea
       <div class="col-md-12">
         <div class="card h-100 overflow-hidden">
           <div class="card-body p-0">
-            <div class="d-flex flex-row flex-wrap">
-              <div class="w-50 p-5">
+            <div class="row">
+              <div class="col-md-6 p-5">
                 <h4 class="card-title text-primary mb-2" i18n="@@workflowPlanTitle">2. Plan</h4>
                 <p class="text-muted mb-0" i18n="@@workflowPlanDesc">
                   Transform research into a clear roadmap by reviewing documentation and synthesizing findings. Break
@@ -50,7 +49,7 @@ <h4 class="card-title text-primary mb-2" i18n="@@workflowPlanTitle">2. Plan</h4>
                   well-defined acceptance criteria.
                 </p>
               </div>
-              <div class="w-50 p-5 bg-primary d-flex align-items-center justify-content-center">
+              <div class="col-md-6 p-5 bg-primary d-flex align-items-center justify-content-center">
                 <h5 class="card-title text-white mb-0" i18n="@@workflowPlanCommand">/plan</h5>
               </div>
             </div>
@@ -63,11 +62,11 @@ <h5 class="card-title text-white mb-0" i18n="@@workflowPlanCommand">/plan</h5>
       <div class="col-md-12">
         <div class="card h-100 overflow-hidden">
           <div class="card-body p-0">
-            <div class="d-flex flex-row flex-wrap">
-              <div class="w-50 p-5 bg-primary d-flex align-items-center justify-content-center">
+            <div class="row">
+              <div class="col-md-6 p-5 bg-primary d-flex align-items-center justify-content-center">
                 <h5 class="card-title text-white mb-0" i18n="@@workflowImplementCommand">/implement</h5>
               </div>
-              <div class="w-50 p-5">
+              <div class="col-md-6 p-5">
                 <h4 class="card-title text-primary mb-2" i18n="@@workflowImplementTitle">3. Implement</h4>
                 <p class="text-muted mb-0" i18n="@@workflowImplementDesc">
                   Bring plans to life by building features that align with established conventions and naming standards.
@@ -86,8 +85,8 @@ <h4 class="card-title text-primary mb-2" i18n="@@workflowImplementTitle">3. Impl
       <div class="col-md-12">
         <div class="card h-100 overflow-hidden">
           <div class="card-body p-0">
-            <div class="d-flex flex-row flex-wrap">
-              <div class="w-50 p-5">
+            <div class="row">
+              <div class="col-md-6 p-5">
                 <h4 class="card-title text-primary mb-2" i18n="@@workflowShipTitle">4. Ship</h4>
                 <p class="text-muted mb-0" i18n="@@workflowShipDesc">
                   Share work by opening pull requests with descriptive titles and filling out PR templates completely.
@@ -95,7 +94,7 @@ <h4 class="card-title text-primary mb-2" i18n="@@workflowShipTitle">4. Ship</h4>
                   checks pass successfully before merging changes.
                 </p>
               </div>
-              <div class="w-50 p-5 bg-primary d-flex align-items-center justify-content-center">
+              <div class="col-md-6 p-5 bg-primary d-flex align-items-center justify-content-center">
                 <h5 class="card-title text-white mb-0" i18n="@@workflowShipCommand">/ship</h5>
               </div>
             </div>