home page parts

components/pages/home/line.tsx

@@ -0,0 +1,33 @@
+import { Phone } from "lucide-react";
+import Image from "next/image";
+
+export function Line() {
+  return (
+    <div className="bg-black py-10 px-4">
+      <div className="max-w-280 w-full mx-auto relative py-10 flex items-center justify-between ">
+        <div className="text-white flex flex-col items-start justify-start gap-5 ">
+          <h2 className="lg:text-5xl sm:text-3xl text-2xl max-w-[80%] w-full font-semibold">
+            Ready for Action 24/7: Contact Us at
+          </h2>
+          <p className="flex items-center justify-center gap-4 font-semibold sm:text-xl text-lg">
+            <span
+              className="shrink-0 w-10 h-10 bg-red-600 rounded-full flex items-center justify-center
+                  shadow-[0_0_0px_4px_rgba(239,68,68,0.1)]"
+            >
+              <Phone className="text-white w-5 h-5" />
+            </span>
+            +123-456-7890
+          </p>
+        </div>
+        <Image
+          src="/images/home/fireHydrant.png"
+          alt="image"
+          width={60}
+          height={60}
+          priority
+          className=" sm:flex hidden object-contain w-80 h-80 absolute -bottom-25 right-0"
+        />
+      </div>
+    </div>
+  );
+}