Insta, spotlight, fonts

src/components/footer.tsx

@@ -1,7 +1,9 @@
-// components/Footer.js
-export default function Footer() {
+import { FaPhoneAlt } from 'react-icons/fa';
+import { FaMapLocationDot } from 'react-icons/fa6';
+
+export function Footer() {
   return (
-    <footer className='bg-white text-brown-800 py-12'>
+    <footer className='bg-[#f8f6f5] py-12 border-t-2 border-black'>
       <div className='max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-8 px-4'>
         {/* First Column: Logo and Description */}
         <div className='space-y-4'>
@@ -22,12 +24,12 @@ export default function Footer() {
         <div className='space-y-4'>
           <h3 className='font-semibold'>Get in touch</h3>
           <p className='text-sm flex items-center'>
-            <span className='material-symbols-outlined'>call</span>
-            0172-4045414
+            <FaPhoneAlt />
+            &nbsp; 0172-4045414
           </p>
           <p className='text-sm flex items-center'>
-            <span className='material-symbols-outlined'>pin_drop</span>
-            SCO 8, Inner Market, 9-D, Sector 9, Chandigarh, 160009
+            <FaMapLocationDot />
+            &nbsp; SCO 8, Inner Market, 9-D, Sector 9, Chandigarh, 160009
           </p>
         </div>
 
@@ -115,10 +117,7 @@ export default function Footer() {
             >
               <img src='/icons/youtube.svg' />
             </a>
-            <a
-              href='https://linkedin.com'
-              className='text-brown-600 hover:text-brown-800'
-            >
+            <a href='https://linkedin.com' className=''>
               <img src='/icons/linkedin.svg' />
             </a>
           </div>