responsive chages are updated

src/app/globals.css

@@ -739,7 +739,13 @@ img {
 }
 
 .space100 {
-  height: 100px;
+  height: 80px;
+}
+
+@media (max-width: 767px) {
+  .space100 {
+    height: 60px !important;
+  }
 }
 
 @keyframes animation-5 {
@@ -1137,13 +1143,13 @@ img {
 
 @media (max-width: 767px) {
   .sp1 {
-    padding: 50px 0 50px;
+    padding: 60px 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp1 {
-    padding: 50px 0 50px;
+    padding: 60px 0 60px;
   }
 }
 
@@ -1153,18 +1159,18 @@ img {
 
 @media (max-width: 767px) {
   .sp2 {
-    padding: 50px 0 20px;
+    padding: 60px 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp2 {
-    padding: 50px 0 20px;
+    padding: 60px 0 60px;
   }
 }
 
 .sp3 {
-  padding: 80px 0 50px;
+  padding: 80px 0 80px;
 }
 
 .sp4 {
@@ -1173,34 +1179,34 @@ img {
 
 @media (max-width: 767px) {
   .sp4 {
-    padding: 40px 0 40px;
+    padding: 60px 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp4 {
-    padding: 40px 0 40px;
+    padding: 60px 0 60px;
   }
 }
 
 .sp5 {
-  padding: 60px 0 60px;
+  padding: 80px 0 80px;
 }
 
 @media (max-width: 767px) {
   .sp5 {
-    padding: 30px 0 30px;
+    padding: 60px 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp5 {
-    padding: 30px 0 30px;
+    padding: 60px 0 60px;
   }
 }
 
 .sp6 {
-  padding: 120px 0 120px;
+  padding: 80px 0 80px;
 }
 
 @media (max-width: 767px) {
@@ -1216,18 +1222,18 @@ img {
 }
 
 .sp7 {
-  padding: 120px 0 90px;
+  padding: 80px 0 80px;
 }
 
 @media (max-width: 767px) {
   .sp7 {
-    padding: 60px 0 30px;
+    padding: 60px 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp7 {
-    padding: 60px 0 30px;
+    padding: 60px 0 60px;
   }
 }
 
@@ -1237,18 +1243,18 @@ img {
 
 @media (max-width: 767px) {
   .sp8 {
-    padding: 50px 0 0;
+    padding: 60px 0 0;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp8 {
-    padding: 50px 0 0;
+    padding: 60px 0 0;
   }
 }
 
 .sp9 {
-  padding: 120px 0 0;
+  padding: 80px 0 0;
 }
 
 @media (max-width: 767px) {
@@ -1269,13 +1275,13 @@ img {
 
 @media (max-width: 767px) {
   .sp10 {
-    padding: 0 0 50px;
+    padding: 0 0 60px;
   }
 }
 
 @media only screen and (min-width: 768px) and (max-width: 991px) {
   .sp10 {
-    padding: 0 0 50px;
+    padding: 0 0 60px;
   }
 }
 
@@ -16777,7 +16783,7 @@ only screen and (min-width: 768px) and (max-width: 991px),
 
 @media (max-width: 768px) {
   .kf-section {
-    padding: 50px 0;
+    padding: 60px 0;
   }
 
   .kf-container {
@@ -17357,9 +17363,9 @@ only screen and (min-width: 768px) and (max-width: 991px),
 /* --- Section header text --- */
 .faqv2-subtitle {
   font-size: 15px;
-  font-weight: 600;
+  color: #3779b9 !important;
-  color: #3779b9;
+  font-weight: 600 !important;
-  text-transform: uppercase;
+  text-transform: uppercase !important;
   letter-spacing: 2px;
   display: flex;
   align-items: center;
@@ -18653,9 +18659,9 @@ img {
     gap: 20px !important;
   }
 
-  .card-boxarea {
+  /* .card-boxarea {
     padding: 18px !important;
-  }
+  } */
 
   .card-boxarea h3 {
     font-size: 32px !important;
@@ -18686,9 +18692,9 @@ img {
     margin: 40px auto;
   }
 
-  .card-boxarea {
+  /* .card-boxarea {
     margin-bottom: 20px !important;
-  }
+  } */
 
   .space100 {
     height: 20px !important;

src/components/sections/Home1/CaseStudies.tsx

@@ -63,7 +63,7 @@ const CaseStudies = () => {
     };
 
     return (
-        <section className="case-studies-section sp1 mb-100 position-relative" id="portfolio" style={{ overflow: 'hidden' }}>
+        <section className="case-studies-section sp1 position-relative" id="portfolio" style={{ overflow: 'hidden' }}>
 
             <img src="/assets/img/home/section6/1.webp" alt="" className="case-floating-element case-el-left-3" />
             <img src="/assets/img/home/section6/2.webp" alt="" className="case-floating-element case-el-left-4" />

src/components/sections/Home1/Pricing.tsx

@@ -6,7 +6,7 @@ import { pricingPlans } from '@/assets/data';
 
 const Pricing = () => {
     return (
-        <section className="pricing-section sp1 mb-80" id="pricing">
+        <section className="pricing-section sp1 pt-0" id="pricing">
             <div className="container">
                 <div className="row justify-content-center">
                     <div className="col-lg-8 text-center">

src/components/sections/Home1/Testimonial.tsx

@@ -76,8 +76,7 @@ const Testimonial = () => {
             backgroundRepeat: 'no-repeat',
             backgroundSize: 'cover',
             backgroundAttachment: 'fixed',
-            position: 'relative',
+            position: 'relative'
-            paddingBottom: '80px'
         }}>
             <div className="section-overlay"></div>
             <div className="container" style={{ position: 'relative', zIndex: 1 }}>