responsive updated

src/app/[slug]/page.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { BlogData } from "@/utils/constant.utils";
-import BlogDetailsClient from "@/app/blog/[slug]/BlogDetailsClient";
 import { Metadata } from "next";
 import { notFound } from "next/navigation";
+import BlogDetailsClient from "./BlogDetailsClient";
 
 const blogs = BlogData;
 

src/app/blog/[slug]/page.tsx

@@ -1,13 +0,0 @@
-import { permanentRedirect } from "next/navigation";
-import { BlogData } from "@/utils/constant.utils";
-
-export async function generateStaticParams() {
-    return BlogData.map((blog) => ({
-        slug: blog.slug,
-    }));
-}
-
-export default async function BlogDetailsRedirect({ params }: { params: Promise<{ slug: string }> }) {
-    const { slug } = await params;
-    permanentRedirect(`/${slug}`);
-}

src/app/globals.css

@@ -9709,7 +9709,7 @@ body {
 
 /* FAQ Two Section Styles */
 .faq-two {
-  padding: 120px 0 200px;
+  padding: 80px 0 200px;
   position: relative;
   background-color: #0f172a;
   clip-path: none !important;
@@ -13929,8 +13929,8 @@ body {
 }
 
 .blog-section-one.section-space.pb-0.pt-0 {
-  padding-bottom: 80px !important;
+  padding-bottom: 20px !important;
-  padding-top: 20px !important;
+  /* padding-top: 20px !important; */
 }
 
 .service-details__content-title,
@@ -14812,7 +14812,7 @@ h4.service-details__dynamic-content-erp {
   background: #fff;
   border-radius: 12px;
   transition: all 0.4s ease-in-out;
-  /* border: 1px solid #f0f0f0; */
+  border: 1px solid #3779b9;
   position: relative;
   overflow: hidden;
 }
@@ -15131,6 +15131,44 @@ h4.service-details__dynamic-content-erp {
   .custom-container {
     max-width: 1140px;
   }
+
+  .card-1 {
+    top: -20px;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
+  .card-2 {
+    top: 25%;
+    left: -75px;
+  }
+
+  .card-3 {
+    bottom: 20%;
+    left: -75px;
+  }
+
+  .card-4 {
+    bottom: -20px;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
+  .card-5 {
+    bottom: 20%;
+    left: 92%;
+    transform: translateX(-50%);
+  }
+
+  .card-6 {
+    bottom: 65%;
+    right: -75px;
+  }
+
+  .card-7 {
+    top: 20%;
+    right: 0;
+  }
 }
 
 @media (min-width: 1400px) {
@@ -15826,6 +15864,42 @@ h4.service-details__dynamic-content-erp {
     min-height: 320px;
   }
 
+  .blog-style-one .post-meta span {
+    font-size: 11px !important;
+  }
+
+  .blog-section-one .post-meta span {
+    display: inline-flex;
+    align-items: center;
+    gap: 1px !important;
+    margin-right: -14px !important;
+    color: #64748b;
+  }
+
+  .service-one-home .home-services__card__title a {
+
+    font-size: 20px !important;
+
+  }
+
+  .about-two__list__title {
+
+    font-size: 20px !important;
+
+  }
+
+  .about-two__list__text {
+
+    font-size: 15px !important;
+
+  }
+
+  .service-one-home .home-services__card__text {
+
+    font-size: 15px !important;
+
+  }
+
   .hero-content {
     flex: 0 0 50%;
     max-width: 50%;
@@ -15965,6 +16039,68 @@ h4.service-details__dynamic-content-erp {
   .hero-1 .main-shirt {
     max-width: 60%;
   }
+
+  .service-one-home .home-services__card__title a {
+
+    font-size: 17px !important;
+
+  }
+
+  .service-details__text {
+
+
+    font-size: 16px !important;
+    line-height: 28px !important;
+
+  }
+
+  .service-one-home .home-services__card__text {
+
+    font-size: 13px !important;
+    line-height: 22px !important;
+
+  }
+
+  .about-two__list__title {
+
+    font-size: 17px !important;
+
+  }
+
+  .about-two__list__text {
+
+    font-size: 13px !important;
+    line-height: 22px !important;
+
+  }
+
+  .work-process-section-3 {
+
+    margin-bottom: 0px !important;
+    margin-top: 60px !important;
+
+  }
+
+  .section-space {
+
+    padding-top: 60px !important;
+    padding-bottom: 60px !important;
+
+  }
+
+  .about-two {
+
+    padding-top: 60px !important;
+    padding-bottom: 60px !important;
+
+  }
+
+  .work-process-container-wrapper.style2 {
+
+    padding-top: 60px !important;
+    padding-bottom: 60px !important;
+
+  }
 }
 
 /* 500px */
@@ -16004,6 +16140,53 @@ h4.service-details__dynamic-content-erp {
     font-size: 30px;
   }
 
+  .service-details__content-title {
+
+    font-size: 28px !important;
+
+  }
+
+  .service-details__content-title {
+
+
+    font-size: 22px !important;
+
+  }
+
+  .service-details b {
+
+    font-size: 15px !important;
+
+  }
+
+  .service-details__dynamic-content p {
+
+    font-size: 14px !important;
+    line-height: 24px !important;
+
+  }
+
+  .service-details__benefit__list_custom li b {
+
+
+    font-size: 15px !important;
+
+  }
+
+  .faq-one__accordion .accrodion-content p {
+
+    font-size: 14px !important;
+    line-height: 24px !important;
+
+  }
+
+  .service-details__text {
+
+    font-size: 14px !important;
+    line-height: 24px !important;
+
+  }
+
   .hero-1 .hero-content p {
     font-size: 13px;
   }
@@ -16011,6 +16194,32 @@ h4.service-details__dynamic-content-erp {
   .hero-1 .theme-btn {
     padding: 18px 40px !important;
   }
+
+  .service-one-home .home-services__card__title a {
+
+    font-size: 15px !important;
+
+  }
+
+  .service-one-home .home-services__card__text {
+
+    font-size: 13px !important;
+    line-height: 22px !important;
+
+  }
+
+  .about-two__list__title {
+
+    font-size: 15px !important;
+
+  }
+
+  .about-two__list__text {
+
+    font-size: 13px !important;
+    line-height: 22px !important;
+
+  }
 }
 
 /* 425px */
@@ -16414,6 +16623,12 @@ h4.service-details__dynamic-content-erp {
   .sec-title__title {
     font-size: 30px;
   }
+
+  .home-contact-one .home-contact__card__content {
+    padding: 70px 43px !important;
+    position: relative;
+    z-index: 2;
+  }
 }
 
 /* 1440px */
@@ -16430,9 +16645,15 @@ h4.service-details__dynamic-content-erp {
     font-size: 26px;
   }
 
-    .hero-1 .slider-category-title {
+  .hero-1 .slider-category-title {
     font-size: 11px !important;
   }
+
+  .home-contact-one .home-contact__card {
+
+    margin-right: -12px !important;
+
+  }
 }
 
 /* 1200px */
@@ -16441,6 +16662,12 @@ h4.service-details__dynamic-content-erp {
     font-size: 24px;
     line-height: 34px;
   }
+
+  .home-contact-one .home-contact__card__content {
+    padding: 70px 0px 70px 39px !important;
+    position: relative;
+    z-index: 2;
+  }
 }
 
 /* 1024px */
@@ -16457,6 +16684,14 @@ h4.service-details__dynamic-content-erp {
   .testimonial-btn {
     font-size: 14px !important;
   }
+
+  .home-contact-one .contact-home {
+
+    position: relative !important;
+    left: -117px !important;
+    top: -50px !important;
+
+  }
 }
 
 /* 992px */
@@ -16466,6 +16701,8 @@ h4.service-details__dynamic-content-erp {
     line-height: 38px;
   }
 
+
+
   .about-us-content-area {
     padding-top: 40px;
   }
@@ -16478,6 +16715,17 @@ h4.service-details__dynamic-content-erp {
     line-height: 32px;
   }
 
+      .home-contact-one .home-contact__card__content {
+        padding: 70px 35px 70px 39px !important;
+        position: relative;
+        z-index: 2;
+    }
+
+    .home-contact-one .contact-home {
+    position: relative !important;
+    left: 10px !important;
+    top: -50px !important;
+  }
   .counter-area-two__list {
     flex-wrap: wrap;
     justify-content: center;
@@ -16497,12 +16745,31 @@ h4.service-details__dynamic-content-erp {
   .counter-area-two__item {
     flex: 0 0 100%;
   }
+
+      .home-contact-one .home-contact__card__content {
+        padding: 66px 0px !important;
+        position: relative;
+        z-index: 2;
+    }
+
+    .home-contact-one .home-contact__card__shape-one{
+
+      display: none !important;
+
+    }
+
+    .home-contact-one .contact-home {
+        position: relative !important;
+        left: -6px !important;
+        top: -50px !important;
+    }
+    
 }
 
 /* Counter Area */
 .counter-area-two__list {
   display: flex;
-  align-items: center;
+  /* align-items: center; */
   justify-content: space-between;
   list-style: none;
   padding: 0;
@@ -16535,7 +16802,7 @@ h4.service-details__dynamic-content-erp {
 /* Counter Area */
 .counter-area-two__list {
   display: flex;
-  align-items: center;
+  /* align-items: center; */
   justify-content: space-between;
   list-style: none;
   padding: 0;
@@ -17948,4 +18215,74 @@ h4.service-details__dynamic-content-erp {
     padding-top: 20px !important;
     /* Room for close btn */
   }
+}
+
+@media (max-width: 475px) {
+  
+    .home-contact-one .home-contact__card {
+    padding: 14px !important;
+}
+
+
+
+.home-contact-one .home-contact__card__list__title{
+
+  font-size: 16px !important;
+
+}
+
+.home-contact-one .home-contact__card__list__text a{
+
+  font-size: 14px !important;
+
+}
+
+}
+
+
+@media (max-width: 375px) {
+  
+    .home-contact-one .home-contact__card__list li {
+        padding-right: 41px !important;
+        padding-left: 36px !important;
+    }
+
+}
+
+@media (max-width: 320px) {
+
+.home-contact-one .home-contact__card__list li {
+        display: flex;
+        align-items: center;
+        gap: 9px !important;
+        margin-bottom: 21px !important;
+        border-radius: 10px !important;
+        padding: 2px 11px !important;
+        padding-right: -6px !important;
+        padding-left: 11px !important;
+
+    }
+
+    .home-contact-one .home-contact__card {
+    padding: 14px !important;
+}
+
+.home-contact-one .home-contact__card__list li span{
+
+  font-size: 20px !important;
+
+}
+
+.home-contact-one .home-contact__card__list__title{
+
+  font-size: 14px !important;
+
+}
+
+.home-contact-one .home-contact__card__list__text a{
+
+  font-size: 14px !important;
+
+}
+
 }

src/app/services-digital-solutions/[slug]/page.tsx

@@ -1,14 +0,0 @@
-import { permanentRedirect } from "next/navigation";
-import { ourServices } from "@/utils/data";
-
-export async function generateStaticParams() {
-    return ourServices.map((service) => ({
-        slug: service.slug,
-    }));
-}
-
-export default async function ServiceDetailsPage({ params }: { params: Promise<{ slug: string }> }) {
-    const { slug } = await params;
-
-    permanentRedirect(`/service/${slug}`);
-}

src/components/careers/ServiceSection.tsx

@@ -54,7 +54,7 @@ const ServiceSection2 = () => {
             ></div>
 
             <div className="container">
-                <div className="sec-title-wrapper text-center wow fadeInUp" data-wow-delay=".3s">
+                <div className="sec-title-wrapper text-center">
                     <div className="sec-title">
                         <div className="sec-title__shape"></div>
                         <h6 className="sec-title__tagline">OUR BEST SERVICE</h6>

src/components/careers/WorkProcessSection.tsx

@@ -102,7 +102,7 @@ const WorkProcessSection2 = () => {
 
                     <div className="row gy-5 gx-70 align-items-center">
                         <div className="col-xl-5">
-                            <figure className="main-image m-img wow fadeInUp" data-wow-delay="0.5s">
+                            <figure className="main-image text-center m-img wow fadeInUp" data-wow-delay="0.5s">
                                 <img src="/assets/images/careers/career.webp" alt="Our story" loading="lazy" />
                             </figure>
                         </div>

src/components/faq/FaqPageSection.tsx

@@ -48,7 +48,7 @@ const FaqPageSection = () => {
     return (
         <section className="faq-page-section">
             <div className="container">
-                <div className="row align-items-end mb-60">
+                <div className="row align-items-center mb-60">
                     <div className="col-lg-6">
                         <div className="section-title-wrapper">
                             <div className="sec-title__shape"></div>

src/components/home/AboutTwo.tsx

@@ -15,7 +15,7 @@ const AboutTwo = () => {
                 src="/assets/images/services/why/right-element.webp"
                 alt="metatroncube digital solutions"
                 className="about-two__shape__three"
-                style={{ opacity: 0.4 }}
+                style={{ opacity: 0.2 }}
             />
             <div className="container">
                 <div className="row align-items-center">

src/components/home/CallAreaThree.tsx

@@ -11,7 +11,7 @@ const CallAreaThree: React.FC = () => {
             <div className="container">
                 <div className="call-area-three__content">
                     <h2 className="call-area-three__title wow fadeInUp" data-wow-delay="0.1s">
-                        MetatronCube Finished this Achivement  <br /> in 10 Years
+                        MetatronCube Finished this Achievement  <br /> in 10+ Years
                     </h2>
                     {/* <p className="call-area-three__text wow fadeInUp" data-wow-delay="0.2s">
                         Business tailored design, management &amp; support services Business agency, sed <br />

src/components/home/HomeContactOne.tsx

@@ -95,7 +95,7 @@ const HomeContactOne = () => {
             ></div>
             <div className="container">
                 <div className="row">
-                    <div className="col-xl-6 d-flex align-items-center justify-content-center">
+                    <div className="contact-home col-xl-6 d-flex align-items-center justify-content-end">
                         <div className="home-contact__card" style={{ marginBottom: '10px' }}>
                             <div className="home-contact__card__content">
                                 <ul className="home-contact__card__list">

src/components/home/home-1/AboutSection.tsx

@@ -75,7 +75,7 @@ const AboutSection = () => {
                                 </div>
                             </div>
                             <div className="about-btn-box wow fadeInLeft" data-wow-delay="1s">
-                                <a className="primary-btn-1 btn-hover" href="/about-us">
+                                <a className="primary-btn-1 btn-hover" href="/about">
                                     about us &nbsp; | <i className="fa-solid fa-arrow-right"></i>
                                     <span className="btn-hover-span"></span>
                                 </a>

src/components/home/home-2/WorkProcessSection.tsx

@@ -8,7 +8,7 @@ const WorkProcessSection = () => (
                 <div className="sec-title">
                     <div className="sec-title__shape"></div>
                     <h6 className="sec-title__tagline">Get To Know Us More</h6>
-                    <h3 className="sec-title__title">We’re Reliable & Cost Efficient <br /> Digital Agency.</h3>
+                    <h3 className="sec-title__title mb-20">We’re Reliable & Cost Efficient <br /> Digital Agency.</h3>
                     <p>We combine strategic planning with cutting-edge technology to build scalable digital solutions. <br /> Our commitment to quality ensures your project stands out in the marketplace.</p>
                 </div>
             </div>
@@ -18,7 +18,7 @@ const WorkProcessSection = () => (
                     { num: 2, title: "Our Vision", icon: "our-vision.webp", desc: "Redefining digital innovation for a connected, efficient future."},
                     { num: 3, title: "Our Values", icon: "our-values.webp", desc: "Integrity and Trust, Innovation and Excellence, Collaboration."}
                 ].map((proc, i) => (
-                    <div key={i} className="col-xxl-4 col-xl-4 col-lg-4">
+                    <div key={i} className="col-xxl-4 col-xl-4 col-lg-4 col-md-6 col-sm-12">
                         <div className="work-process-box text-center">
                             <div className="icon-box p-relative">
                                 <img src={`/assets/images/services/process/${proc.icon}`} alt={proc.desc} />

src/components/home/home-3/ChooseSection.tsx

@@ -3,7 +3,7 @@ import SectionTitle from "@/components/common/SectionTitle";
 
 const ChooseSection = () => (
     <section className="choose-3-section p-relative section-space" style={{ backgroundImage: "url(/assets/images/services/bg-1.webp)" }}>
-        <div className="shape-1" style={{ backgroundImage: "url(/assets/images/services/choose/element-1.webp)", opacity: 0.3 }}></div>
+        <div className="shape-1" style={{ backgroundImage: "url(/assets/images/services/choose/element-1.webp)", opacity: 0.1 }}></div>
         <div className="small-container">
             <div className="row">
                 <div className="col-xxl-6 col-xl-6 col-lg-6">