build ui header, footer, home page, about page

app/components/home/VisaSolutions.tsx

@@ -0,0 +1,52 @@
+import Link from 'next/link';
+
+interface VisaSolutionsProps {
+    data: {
+        heading: string;
+        subheading: string;
+        items: {
+            number: string;
+            title: string;
+            description: string;
+            link: string;
+        }[];
+    };
+}
+
+const VisaSolutions = ({ data }: VisaSolutionsProps) => {
+    return (
+        <div className="service-section section-padding fix">
+            <div className="container">
+                <div className="section-title text-center">
+                    <span className="sub-title wow fadeInUp">{data.subheading}</span>
+                    <h2 className="split-text-right split-text-in-right">
+                        {data.heading}
+                    </h2>
+                </div>
+            </div>
+            {data.items.map((item, index) => (
+                <div key={index} className={`service-wrapper ${index === 1 ? 'active' : ''}`}>
+                    <div className="container">
+                        <div className="service-item">
+                            <div className="image-hover d-none d-md-block bg-cover" style={{ backgroundImage: "url('/assets/img/home-1/hover-bg.jpg')" }}></div>
+                            <div className="left-item">
+                                <h5 className="number">{item.number}</h5>
+                                <h3>
+                                    <Link href={item.link}>{item.title}</Link>
+                                </h3>
+                            </div>
+                            <div className="right-item">
+                                <p>
+                                    {item.description}
+                                </p>
+                                <Link href={item.link} className="service-btn">Service Details <i className="fa-solid fa-arrow-right"></i></Link>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            ))}
+        </div>
+    );
+};
+
+export default VisaSolutions;