Responsive app

src/pages/Strategy.tsx

@@ -20,16 +20,14 @@ function Strategy() {
     return (
         <ContainerPage>
             <HeaderPage title="Strategy" />
-            <div className="flex lg:flex-row flex-col items-center lg:items-start bg-white h-[100%]">
-
-                {/* <RoadmapSidebar selectedKeyword={selectedKeyword} onKeywordSelect={setSelectedKeyword} /> */}
+            <div className="flex lg:flex-row flex-col items-center lg:items-start bg-white h-[100%] gap-6 lg:gap-8">
 
                 <RoadmapSidebar selectedKeyword={selectedKeyword} onKeywordSelect={setSelectedKeyword} />
 
-                <div className="flex-1 px-4">
+                <div className="flex-1 px-2 sm:px-4 w-full lg:w-auto">
                     <ProgressMetrics />
 
-                    <div className="bg-white rounded-lg border border-gray-200 p-3 pb-10">
+                    <div className="bg-white rounded-lg border border-gray-200 p-2 sm:p-3 pb-6 sm:pb-10">
 
                         {selectedKeyword === "CPA Los Angeles" ? <IntegratedStrategy /> : <ShowDetails />
                         }