images and corrections updated

app/about-us/page.js

@@ -1,79 +1,72 @@
 'use client'
 import Layout from "@/components/layout/Layout"
-import TestimonialSlider3 from '@/components/slider/TestmonialSlider3'
 import Link from "next/link"
 import { useState } from 'react'
 
 export default function Home() {
   const [isOpen, setOpen] = useState(false)
-    const [isActive, setIsActive] = useState({
+  const [activeIndex, setActiveIndex] = useState(null);
-        status: false,
-        key: 1,
-    })
 
-    const handleToggle = (key) => {
+  const toggleReadMore = (index) => {
-        if (isActive.key === key) {
+    setActiveIndex(activeIndex === index ? null : index);
-            setIsActive({
+  };
-                status: false,
+
-            })
+
-        } else {
+
-            setIsActive({
+  const contents = [
-                status: true,
+    {
-                key,
+      title: "Mission",
-            })
+      img: "/assets/images/resource/process-1.jpg",
-        }
+      text: "Physiotherapy Etobicoke is committed to providing quality and innovative health care in a comfortable and professional environment. Our interdisciplinary team will work collaboratively to offer a comprehensive and patient-centered approach to ensure the highest level of client experience through our evidence-based clinical practice."
+    },
+    {
+      title: "Vision",
+      img: "/assets/images/resource/process-2.jpg",
+      text: "To be regarded as the most reliable and effective health care therapy practice backed by the team of innovative healthcare professionals driven by passion."
+    },
+    {
+      title: "Values",
+      img: "/assets/images/resource/process-3.jpg",
+      text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa nec justo lacinia suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa nec justo lacinia suscipit."
     }
+  ];
+
   return (
     <>
       <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="About Us">
         {/* about-section */}
-                <section className="about-style-two pt_120 pb_120">
+        <section className="about-style-three pt_120 pb_120 bg-color-1">
-                <div className="pattern-layer">
+          <div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/shape/shape-35.png)' }}></div>
-                  <div className="pattern-1 rotate-me" style={{ backgroundImage: "url(assets/images/shape/shape-8.png)" }}></div>
-                  <div className="pattern-2 rotate-me" style={{ backgroundImage: "url(assets/images/shape/shape-9.png)" }}></div>
-                  <div className="pattern-3" style={{ backgroundImage: "url(assets/images/shape/shape-11.png)" }}></div>
-                  <div className="pattern-4" style={{ backgroundImage: "url(assets/images/shape/shape-35.png)" }}></div>
-                </div>
           <div className="auto-container">
             <div className="row clearfix">
               <div className="col-lg-6 col-md-12 col-sm-12 image-column">
-                      <div className="image_block_one">
+                <div className="image_block_three">
                   <div className="image-box">
-                          <div className="shape float-bob-x" style={{ backgroundImage: "url(assets/images/shape/shape-7.png)" }}></div>
+                    <div className="image-shape">
-                          <div className="image-shape" style={{ backgroundImage: "url(assets/images/shape/shape-26.png)" }}></div>
+                      <div className="shape-1 rotate-me" style={{ backgroundImage: 'url(/assets/images/shape/shape-8.png)' }}></div>
-                          <figure className="image-2"><img src="assets/images/resource/about-1.png" alt="" /></figure>
+                      <div className="shape-2" style={{ backgroundImage: 'url(/assets/images/shape/shape-33.png)' }}></div>
-                          <div className="icon-one"><i className="icon-13"></i></div>
+                      <div className="shape-3" style={{ backgroundImage: 'url(/assets/images/shape/shape-7.png)' }}></div>
-                          <div className="icon-two"><i className="icon-14"></i></div>
+                      <div className="shape-4" style={{ backgroundImage: 'url(/assets/images/shape/shape-34.png)' }}></div>
-                          <div className="text-box">
+                      <div className="shape-5" style={{ backgroundImage: 'url(/assets/images/shape/shape-11.png)' }}></div>
-                            <h3>Wade Warren</h3>
-                            <span>Medical Assistant</span>
                     </div>
+                    <figure className="image image-1"><img src="/assets/images/resource/about-2.jpg" alt="" /></figure>
+                    <figure className="image image-2"><img src="/assets/images/resource/about-3.jpg" alt="" /></figure>
+                    <div className="icon-box"><i className="icon-14"></i></div>
                   </div>
                 </div>
               </div>
               <div className="col-lg-6 col-md-12 col-sm-12 content-column">
                 <div className="content_block_one">
-                        <div className="content-box ml_30">
+                  <div className="content-box">
                     <div className="sec-title mb_15">
                       <span className="sub-title">About Us</span>
-                            <h2>Medical services & diagnostics</h2>
+                      <h2>Rapha Rehab Physiotherapy</h2>
                     </div>
                     <div className="text-box mb_40">
-                            <p>Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
+                      <p>physiotherapy clinic in etobicoke managed by Registered Physiotherapists offering reliable physiotherapy treatment Services, Sports injury physiotherapy, Pelvic floor physiotherapy, Chiropractor, Massage therapy , Acupuncture treatment, Foot Reflexology, Osteopathy, custom knee braces, orthotics, spinal decompression therapy, concussion management, chronic pain management, workplace injury management, Naturopathy and home care physiotherapy Services in Etobicoke</p>
-                            <ul className="list-style-one clearfix">
-                              <li>Refresing to get such a personal touch.</li>
-                              <li>Duis aute irure dolor in reprehenrit in voluptate.</li>
-                              <li>Velit esse cillum dolore eu fugiat nua pariatur.</li>
-                            </ul>
                     </div>
-                          <div className="lower-box">
+                    <div className="btn-box">
-                            <div className="experience-box">
+                      <Link href="index-2" className="theme-btn btn-one"><span>Explore Our Service</span></Link>
-                              <div className="icon-box"><i className="icon-29"></i></div>
-                              <h3>32 Years</h3>
-                              <span className="designation">Of Medical Experience</span>
-                            </div>
-                            <figure className="author-thumb"><img src="assets/images/resource/author-1.jpg" alt="" /></figure>
-                            <div className="signature"><img src="assets/images/icons/signature-1.png" alt="" /></div>
                     </div>
                   </div>
                 </div>
@@ -83,48 +76,81 @@ export default function Home() {
         </section>
         {/* about-section end */}
 
-
         {/* process */}
-                <section className="process-section sec-pad bg-color-1">
+        <section className="process-section sec-pad ">
+          <div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/shape/shape-19.png)' }}></div>
           <div className="shape">
-                      <div className="shape-1 float-bob-x" style={{ backgroundImage: "url(assets/images/shape/shape-20.png)" }}></div>
+            <div className="shape-1 float-bob-x" style={{ backgroundImage: 'url(/assets/images/shape/shape-20.png)' }}></div>
-                      <div className="shape-2 float-bob-y" style={{ backgroundImage: "url(assets/images/shape/shape-15.png)" }}></div>
+            <div className="shape-2 float-bob-y" style={{ backgroundImage: 'url(/assets/images/shape/shape-15.png)' }}></div>
             <div className="shape-3"></div>
           </div>
           <div className="auto-container">
             <div className="sec-title mb_50 centred">
-                        <span className="sub-title">Process</span>
+              <span className="sub-title">Caring Excellence</span>
-                        <h2>How it Helps You to <br />Keep Healthy</h2>
+              <h2>Mission Vision & Values</h2>
             </div>
             <div className="inner-container">
-                        <div className="arrow-shape" style={{ backgroundImage: "url(assets/images/shape/shape-18.png)" }}></div>
+              <div className="arrow-shape" style={{ backgroundImage: 'url(/assets/images/shape/shape-18.png)' }}></div>
-                        <div className="processing-block-one wow fadeInLeft animated" data-wow-delay="00ms" data-wow-duration="1500ms">
+
+              {contents.map((item, index) => {
+                const isActive = activeIndex === index;
+                const words = item.text.split(" ");
+                const shortText = words.slice(0, 20).join(" ") + (words.length > 20 ? "..." : "");
+
+                return (
+                  <div key={index} className="processing-block-one wow fadeInLeft animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                     <div className="inner-box">
-                            <span className="count-text">01</span>
+                      <span className="count-text">{`0${index + 1}`}</span>
-                            <figure className="image-box"><img src="assets/images/resource/process-1.jpg" alt="" /></figure>
+                      <figure className="image-box"><img src={item.img} alt={item.title} /></figure>
                       <div className="lower-content">
-                              <h3>Get Appointment</h3>
+                        <h3>{item.title}</h3>
-                              <p>Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. </p>
+                        <p>{isActive ? item.text : shortText}</p>
+                        {words.length > 20 && (
+                          <button className="read-more-btn" onClick={() => toggleReadMore(index)}>
+                            {isActive ? "Read Less" : "Read More"}
+                          </button>
+                        )}
                       </div>
                     </div>
                   </div>
-                        <div className="processing-block-one wow fadeInLeft animated" data-wow-delay="300ms" data-wow-duration="1500ms">
+                );
-                          <div className="inner-box">
+              })}
-                            <span className="count-text">02</span>
+            </div>
-                            <figure className="image-box"><img src="assets/images/resource/process-2.jpg" alt="" /></figure>
+
-                            <div className="lower-content">
+          </div>
-                              <h3>Start Check-Up</h3>
+        </section>
-                              <p>Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. </p>
+        {/* process end */}
+
+        <section className="testimonial-style-two p_relative bg-color-1">
+          {/* <div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/shape/shape-19.png)' }}></div> */}
+          <div className="auto-container">
+            <div className="row align-items-center flex-row-reverse">
+              {/* RIGHT IMAGE / LEFT CONTENT */}
+              <div className="col-lg-6 col-md-12 col-sm-12 image-column order-2 order-lg-1">
+                <div className="image_block_two pl_30">
+                  <div className="image-box">
+                    <figure className="image image-1"><img src="/assets/images/why-us/back-2.webp" alt="" /></figure>
+                    <figure className="image image-2"><img src="/assets/images/why-us/front-2.webp" alt="" /></figure>
+                    <div className="icon-box"><img src="/assets/images/why-us/icon-2.webp" alt="" /></div>
                   </div>
                 </div>
               </div>
-                        <div className="processing-block-one wow fadeInLeft animated" data-wow-delay="600ms" data-wow-duration="1500ms">
+              <div className="col-lg-6 col-md-12 col-sm-12 content-column order-1 order-lg-2">
-                          <div className="inner-box">
+                <div className="content_block_one pr_30">
-                            <span className="count-text">03</span>
+                  <div className="content-box">
-                            <figure className="image-box"><img src="assets/images/resource/process-3.jpg" alt="" /></figure>
+                    <div className="sec-title mb_15">
-                            <div className="lower-content">
+                      <span className="sub-title">About Us</span>
-                              <h3>Enjoy Healthy Life</h3>
+                      <h2>Medical services & diagnostics</h2>
-                              <p>Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. </p>
+                    </div>
+                    <div className="text-box mb_40">
+                      <ul className="list-style-one clearfix">
+                        <li>Top-Notch Treatment – Under our care, you will be placed in a supportive and comfortable environment helping you receive care in comfortable and supportive environment designed to address your issues</li>
+                        <li>Personalized Treatment Plan – We offer One-on-one care with a skilled therapist allows us to develop a plan specific to your particular needs results in a faster recovery.</li>
+                        <li>We listen & take time – We listen & take time to get to know you properly – Right from the start with your inquiry, we are here to listen and help find the root cause of your problem.</li>
+                        <li>Our treatment rooms – Our treatment rooms are fully equipped and private.</li>
+                        <li>Strong network of health professionals – We have a strong network of health professionals to refer to, making sure you get the right diagnosis and correct treatment for your condition.</li>
+                      </ul>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -134,49 +160,12 @@ export default function Home() {
         {/* process end */}
 
 
-                {/* testimonial-section */}
-                 <section className="testimonial-style-two p_relative">
-      <div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/shape/shape-19.png)' }}></div>
-      <div className="auto-container">
-        <div className="row align-items-center">
-          <div className="col-lg-6 col-md-12 col-sm-12 thumb-column">
-            <div className="thumb-box">
-              <div className="thumb thumb-1"><img src="assets/images/resource/thumb-1.png" alt="" /></div>
-              <div className="thumb thumb-2"><img src="assets/images/resource/thumb-2.png" alt="" /></div>
-              <div className="thumb thumb-3"><img src="assets/images/resource/thumb-3.png" alt="" /></div>
-              <div className="thumb thumb-4"><img src="assets/images/resource/thumb-4.png" alt="" /></div>
-              <div className="thumb thumb-5"><img src="assets/images/resource/thumb-5.png" alt="" /></div>
-              <div className="thumb thumb-6"><img src="assets/images/resource/thumb-6.png" alt="" /></div>
-            </div>
-          </div>
-          <div className="col-lg-6 col-md-12 col-sm-12 content-column">
-            <div className="content-box">
-              <div className="sec-title mb_50">
-                <span className="sub-title">TESTIMONIALS</span>
-                <h2>What Our Client Say About medimart</h2>
-              </div>
-                      <div className="content-box">
-                          {/*Theme Carousel*/}
-                          <TestimonialSlider3 />                        
-                      </div>
-                  </div>
-                  
-                  </div>
-                </div>
-              </div>
-              </section>
-                {/* testimonial-section */}
-
-
-               
-
-
         {/* team-section-style-two */}
-                <section className="team-section sec-pad centred bg-color-1">
+        <section className="team-section sec-pad centred">
           <div className="shape">
-                    <div className="shape-1 float-bob-y" style={{ backgroundImage: "url(assets/images/shape/shape-15.png)" }}></div>
+            <div className="shape-1 float-bob-y" style={{ backgroundImage: "url(/assets/images/shape/shape-15.png)" }}></div>
             <div className="shape-2"></div>
-                    <div className="shape-3 float-bob-x" style={{ backgroundImage: "url(assets/images/shape/shape-16.png)" }}></div>
+            <div className="shape-3 float-bob-x" style={{ backgroundImage: "url(/assets/images/shape/shape-16.png)" }}></div>
           </div>
           <div className="auto-container">
             <div className="sec-title mb_50">
@@ -188,7 +177,7 @@ export default function Home() {
                 <div className="team-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                   <div className="inner-box">
                     <div className="image-box">
-                              <figure className="image"><img src="assets/images/team/team-1.jpg" alt="" /></figure>
+                      <figure className="image"><img src="/assets/images/team/team-1.jpg" alt="" /></figure>
                       <ul className="social-links clearfix">
                         <li><Link href="/"><i className="icon-4"></i></Link></li>
                         <li><Link href="/"><i className="icon-5"></i></Link></li>
@@ -207,7 +196,7 @@ export default function Home() {
                 <div className="team-block-one wow fadeInUp animated" data-wow-delay="200ms" data-wow-duration="1500ms">
                   <div className="inner-box">
                     <div className="image-box">
-                                    <figure className="image"><img src="assets/images/team/team-2.jpg" alt="" /></figure>
+                      <figure className="image"><img src="/assets/images/team/team-2.jpg" alt="" /></figure>
                       <ul className="social-links clearfix">
                         <li><Link href="/"><i className="icon-4"></i></Link></li>
                         <li><Link href="/"><i className="icon-5"></i></Link></li>
@@ -226,7 +215,7 @@ export default function Home() {
                 <div className="team-block-one wow fadeInUp animated" data-wow-delay="400ms" data-wow-duration="1500ms">
                   <div className="inner-box">
                     <div className="image-box">
-                                    <figure className="image"><img src="assets/images/team/team-3.jpg" alt="" /></figure>
+                      <figure className="image"><img src="/assets/images/team/team-3.jpg" alt="" /></figure>
                       <ul className="social-links clearfix">
                         <li><Link href="/"><i className="icon-4"></i></Link></li>
                         <li><Link href="/"><i className="icon-5"></i></Link></li>
@@ -245,7 +234,7 @@ export default function Home() {
                 <div className="team-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
                   <div className="inner-box">
                     <div className="image-box">
-                                    <figure className="image"><img src="assets/images/team/team-4.jpg" alt="" /></figure>
+                      <figure className="image"><img src="/assets/images/team/team-4.jpg" alt="" /></figure>
                       <ul className="social-links clearfix">
                         <li><Link href="/"><i className="icon-4"></i></Link></li>
                         <li><Link href="/"><i className="icon-5"></i></Link></li>
@@ -264,40 +253,6 @@ export default function Home() {
           </div>
         </section>
         {/* team-section-style-two end */}
-                {/* subscibe */}
-                <section className="subscribe-section bg-color-1">
-                  <div className="auto-container">
-                    <div className="inner-container">
-                      <div className="row align-items-center">
-                        <div className="col-lg-6 col-md-12 col-sm-12 text-column">
-                          <div className="text-box">
-                            <h2><span>Subscribe</span> for the exclusive updates!</h2>
-                          </div>
-                        </div>
-                        <div className="col-lg-6 col-md-12 col-sm-12 form-column">
-                          <div className="form-inner">
-                            <form method="post" action="contact">
-                              <div className="form-group">
-                                <input type="email" name="email" placeholder="Enter Your Email Address" required />
-                                <button type="submit" className="theme-btn btn-one"><span>Subscribe Now</span></button>
-                              </div>
-                              <div className="form-group">
-                                <div className="check-box">
-                                  <input className="check" type="checkbox" id="checkbox1" />
-                                  <label htmlFor="checkbox1">I agree to the <Link href="/">Privacy Policy.</Link></label>
-                                </div>
-                              </div>
-                            </form>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </section>
-                  {/* subscibe end */}
-
-
-               
       </Layout>
     </>
   )

app/accident/[slug]/page.js

@@ -32,7 +32,7 @@ export default function AccidentDetailsPage({ params }) {
                 
                 {/* Categories */}
                 <div className="sidebar-widget category-widget">
-                  <div className="widget-title"><h3>Categories</h3></div>
+                  <div className="widget-title"><h3>Accident</h3></div>
                   <div className="widget-content">
                     <ul className="category-list clearfix">
                       {Accident.map((cat) => (

app/area-of-injury/[slug]/page.js

@@ -30,7 +30,7 @@ export default function AreaOfInjuryDetails({ params }) {
                 {/* Categories */}
                 <div className="sidebar-widget category-widget">
                   <div className="widget-title">
-                    <h3>Categories</h3>
+                    <h3>Area Of Injury</h3>
                   </div>
                   <div className="widget-content">
                     <ul className="category-list clearfix">
@@ -93,7 +93,7 @@ export default function AreaOfInjuryDetails({ params }) {
       </section>
 
       {/* Subscribe Section */}
-      <section className="subscribe-section">
+      {/* <section className="subscribe-section">
         <div className="auto-container">
           <div className="inner-container">
             <div className="row align-items-center">
@@ -132,7 +132,7 @@ export default function AreaOfInjuryDetails({ params }) {
             </div>
           </div>
         </div>
-      </section>
+      </section> */}
     </Layout>
   );
 }

app/contact/page.js

@@ -1,13 +1,108 @@
+"use client";
 
-import Layout from "@/components/layout/Layout"
+import { useState, useEffect } from "react";
-import Link from "next/link"
+import ReCAPTCHA from "react-google-recaptcha";
-export default function Home() {
+import axios from "axios";
+import Layout from "@/components/layout/Layout";
+import Link from "next/link";
+
+export default function Contact() {
+  const [formData, setFormData] = useState({
+    username: "",
+    lname: "",
+    email: "",
+    phone: "",
+    subject: "",
+    message: "",
+  });
+
+  const [formErrors, setFormErrors] = useState({});
+  const [captchaToken, setCaptchaToken] = useState(null);
+  const [alert, setAlert] = useState({ show: false, type: "", message: "" });
+
+  // Handle input changes
+  const handleChange = (e) => {
+    const { name, value } = e.target;
+    setFormData((prev) => ({ ...prev, [name]: value }));
+  };
+
+  // Handle captcha
+  const handleCaptchaChange = (token) => {
+    console.log("✅ Captcha token:", token);
+    setCaptchaToken(token);
+  };
+
+  // Form submit handler
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+
+    // Validation
+    const errors = {};
+    if (!formData.username.trim()) errors.username = "First Name is required.";
+    if (!formData.lname.trim()) errors.lname = "Last Name is required.";
+    if (!formData.email.trim()) errors.email = "Email is required.";
+    if (!formData.phone.trim()) errors.phone = "Phone is required.";
+    if (!formData.subject.trim()) errors.subject = "Subject is required.";
+    if (!formData.message.trim()) errors.message = "Message is required.";
+    if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
+
+    setFormErrors(errors);
+    if (Object.keys(errors).length > 0) return;
+
+    const emailData = {
+      ...formData,
+      message: `Subject: ${formData.subject}<br /><br />Message: ${formData.message}`,
+      to: "info@rapharehab.ca", 
+      senderName: "Rapha Rehab Contact Page",
+      recaptchaToken: captchaToken,
+    };
+
+    try {
+      const res = await axios.post("https://mailserver.metatronnest.com/send", emailData, {
+        headers: { "Content-Type": "application/json" },
+      });
+
+      setAlert({
+        show: true,
+        type: "success",
+        message: res?.data?.message || "Message sent successfully!",
+      });
+
+      setFormData({
+        username: "",
+        lname: "",
+        email: "",
+        phone: "",
+        subject: "",
+        message: "",
+      });
+      setCaptchaToken(null);
+      setFormErrors({});
+    } catch (error) {
+      console.error("❌ Error sending email:", error);
+      setAlert({
+        show: true,
+        type: "danger",
+        message: "Failed to send message. Please try again later.",
+      });
+    }
+  };
+
+  // Auto-hide alert
+  useEffect(() => {
+    if (alert.show) {
+      const timer = setTimeout(() => {
+        setAlert((prev) => ({ ...prev, show: false }));
+      }, 5000);
+      return () => clearTimeout(timer);
+    }
+  }, [alert.show]);
 
   return (
     <>
       <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Contact Us">
         <div>
-                    {/* Contact Form Section */}
+          {/* Contact Info Section */}
           <section className="contact-info-section pt_120">
             <div className="auto-container">
               <div className="row clearfix">
@@ -16,7 +111,10 @@ export default function Home() {
                     <h3>Quick Contact</h3>
                     <div className="inner-box">
                       <div className="icon-box"><i className="icon-2"></i></div>
-                                            <p><Link href="tel:647-722-3434">+647-722-3434</Link><br /> <Link href="tel:416-622-2873">+416-622-2873</Link></p>
+                      <p>
+                        <Link href="tel:647-722-3434">+647-722-3434</Link><br />
+                        <Link href="tel:416-622-2873">+416-622-2873</Link>
+                      </p>
                     </div>
                   </div>
                 </div>
@@ -25,7 +123,10 @@ export default function Home() {
                     <h3>Email Address</h3>
                     <div className="inner-box">
                       <div className="icon-box"><i className="icon-26"></i></div>
-                                            <p><Link href="mailto:info@rapharehab.ca">info@rapharehab.ca</Link><br /><Link href="mailto:bloor@rapharehab.ca">bloor@rapharehab.ca</Link></p>
+                      <p>
+                        <Link href="mailto:info@rapharehab.ca">info@rapharehab.ca</Link><br />
+                        <Link href="mailto:bloor@rapharehab.ca">bloor@rapharehab.ca</Link>
+                      </p>
                     </div>
                   </div>
                 </div>
@@ -41,8 +142,8 @@ export default function Home() {
               </div>
             </div>
           </section>
-                    {/* Contact Form Section End */}
+
-                    {/* Contact Form Section2 */}
+          {/* Contact Form Section */}
           <section className="contact-style-three pt_90 pb_120">
             <div className="auto-container">
               <div className="row clearfix">
@@ -51,83 +152,122 @@ export default function Home() {
                     <div className="sec-title mb_50">
                       <h2>Send a Message</h2>
                     </div>
-                                        <form method="post" action="sendemail.php" id="contact-form" className="default-form">
+
+                    {/* Alert Message */}
+                    {alert.show && (
+                      <div className={`alert alert-${alert.type}`}>{alert.message}</div>
+                    )}
+
+                    <form onSubmit={handleSubmit} className="default-form">
                       <div className="row clearfix">
                         <div className="col-lg-6 col-md-6 col-sm-12 form-group">
-                                                    <input type="text" name="username" placeholder="First Name" required />
+                          <input
+                            type="text"
+                            name="username"
+                            placeholder="First Name"
+                            value={formData.username}
+                            onChange={handleChange}
+                          />
+                          {formErrors.username && <small className="text-danger">{formErrors.username}</small>}
                         </div>
+
                         <div className="col-lg-6 col-md-6 col-sm-12 form-group">
-                                                    <input type="text" name="lname" placeholder="Last Name" required />
+                          <input
+                            type="text"
+                            name="lname"
+                            placeholder="Last Name"
+                            value={formData.lname}
+                            onChange={handleChange}
+                          />
+                          {formErrors.lname && <small className="text-danger">{formErrors.lname}</small>}
                         </div>
+
                         <div className="col-lg-6 col-md-6 col-sm-12 form-group">
-                                                    <input type="email" name="email" placeholder="Your email" required />
+                          <input
+                            type="email"
+                            name="email"
+                            placeholder="Your Email"
+                            value={formData.email}
+                            onChange={handleChange}
+                          />
+                          {formErrors.email && <small className="text-danger">{formErrors.email}</small>}
                         </div>
+
                         <div className="col-lg-6 col-md-6 col-sm-12 form-group">
-                                                    <input type="text" name="phone" required placeholder="Phone" />
+                          <input
+                            type="text"
+                            name="phone"
+                            placeholder="Phone"
+                            value={formData.phone}
+                            onChange={handleChange}
+                          />
+                          {formErrors.phone && <small className="text-danger">{formErrors.phone}</small>}
                         </div>
+
                         <div className="col-lg-12 col-md-12 col-sm-12 form-group">
-                                                    <input type="text" name="subject" required placeholder="Subject" />
+                          <input
+                            type="text"
+                            name="subject"
+                            placeholder="Subject"
+                            value={formData.subject}
+                            onChange={handleChange}
+                          />
+                          {formErrors.subject && <small className="text-danger">{formErrors.subject}</small>}
                         </div>
+
                         <div className="col-lg-12 col-md-12 col-sm-12 form-group">
-                                                    <textarea name="message" placeholder="Message"></textarea>
+                          <textarea
+                            name="message"
+                            placeholder="Message"
+                            value={formData.message}
+                            onChange={handleChange}
+                          ></textarea>
+                          {formErrors.message && <small className="text-danger">{formErrors.message}</small>}
                         </div>
+
+                        {/* ReCAPTCHA */}
+                        <div className="col-lg-12 mb-3">
+                          <ReCAPTCHA
+                            sitekey="6LekfpwrAAAAAOTwuP1d2gg-Fv9UEsAjE2gjOQJl"
+                            onChange={handleCaptchaChange}
+                          />
+                          {formErrors.captcha && <small className="text-danger">{formErrors.captcha}</small>}
+                        </div>
+
                         <div className="col-lg-12 col-md-12 col-sm-12 form-group message-btn">
-                                                    <button className="theme-btn btn-one" type="submit" name="submit-form"><span>Send Message</span></button>
+                          <button className="theme-btn btn-one" type="submit" name="submit-form">
+                            <span>Send Message</span>
+                          </button>
                         </div>
                       </div>
                     </form>
                   </div>
                 </div>
+
                 <div className="col-lg-4 col-md-12 col-sm-12 image-column">
-                                    <figure className="image-box"><img src="assets/images/resource/contact-1.jpg" alt="" /></figure>
+                  <figure className="image-box">
+                    <img src="/assets/images/resource/contact-1.jpg" alt="" />
+                  </figure>
                 </div>
               </div>
             </div>
           </section>
-                    {/* Contact Form Section2 End */}
 
-                    {/* Google Map Section */}
+          {/* Google Map */}
           <section className="google-map-section">
-                        {/*Map Outer*/}
             <div className="map-inner">
-                            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2886.847666572518!2d-79.57789668450145!3d43.6308386791466!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882b3811bd400001%3A0x87ffabfe7d6aeeca!2s4335+Bloor+St+W+%236%2C+Etobicoke%2C+ON+M9C+5S2%2C+Canada!5e0!3m2!1sen!2sca!4v1693224000000!5m2!1sen!2sca" height={570} style={{ border: 0, width: "100%" }} allowFullScreen loading="lazy" referrerPolicy="no-referrer-when-downgrade" />
+              <iframe
+                src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2886.847666572518!2d-79.57789668450145!3d43.6308386791466!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882b3811bd400001%3A0x87ffabfe7d6aeeca!2s4335+Bloor+St+W+%236%2C+Etobicoke%2C+ON+M9C+5S2%2C+Canada!5e0!3m2!1sen!2sca!4v1693224000000!5m2!1sen!2sca"
+                height={570}
+                style={{ border: 0, width: "100%" }}
+                allowFullScreen
+                loading="lazy"
+                referrerPolicy="no-referrer-when-downgrade"
+              />
             </div>
           </section>
-                    {/* Google Map Section End */}
-                    {/* subscibe */}
-                    <section className="subscribe-section">
-                        <div className="auto-container">
-                            <div className="inner-container">
-                                <div className="row align-items-center">
-                                    <div className="col-lg-6 col-md-12 col-sm-12 text-column">
-                                        <div className="text-box">
-                                            <h2><span>Subscribe</span> for the exclusive updates!</h2>
         </div>
-                                    </div>
-                                    <div className="col-lg-6 col-md-12 col-sm-12 form-column">
-                                        <div className="form-inner">
-                                            <form method="post" action="contact">
-                                                <div className="form-group">
-                                                    <input type="email" name="email" placeholder="Enter Your Email Address" required />
-                                                    <button type="submit" className="theme-btn btn-one"><span>Subscribe Now</span></button>
-                                                </div>
-                                                <div className="form-group">
-                                                    <div className="check-box">
-                                                        <input className="check" type="checkbox" id="checkbox1" />
-                                                        <label htmlFor="checkbox1">I agree to the <Link href="/">Privacy Policy.</Link></label>
-                                                    </div>
-                                                </div>
-                                            </form>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </section>
-                    {/* subscibe end */}
-                </div>
-
       </Layout>
     </>
-    )
+  );
 }

app/covid-19-updates/page.js

@@ -45,7 +45,7 @@ export default function Home() {
                             <div className="content-box">
                                 {/* Top Intro */}
                                 <div className="sec-title mb_50 text-center">
-                                    <span className="sub-title">COVID 19 UPDATES</span>
+                                    <h2 className="mb-3">COVID 19 UPDATES</h2>
                                     <p>
                                         The COVID 19 pandemic has created increased stress and anxiety levels for many people. 
                                         We would like to take this opportunity to remind you that virtual therapy and at-home 
@@ -68,7 +68,7 @@ export default function Home() {
                                                     <img src="/assets/images/covid/virtual.webp" alt="Virtual Therapy" />
                                                 </div>
                                                 <h3>VIRTUAL THERAPY</h3>
-                                                <p>
+                                                <p className="mb-5">
                                                     As an alternative to receiving direct in-clinic therapy, we continue to offer all 
                                                     clients the option to receive tele-rehabilitation or virtual therapy services to 
                                                     address your current therapy needs.
@@ -99,7 +99,7 @@ export default function Home() {
                                                         faced by those who can’t drive. This improved access to therapy makes it easier for 
                                                         clients to be an active participant in their recovery.
                                                     </p>
-                                                    <p className="mt-3">
+                                                    <p className="mt-3 mb-5">
                                                         Being able to interact with clients in their home setting enables a therapist to see 
                                                         how the client moves and completes tasks in their everyday life.
                                                     </p>

app/gallery-physiotherapy-etobicoke/page.js

@@ -23,7 +23,7 @@ export default function WhyChooseUs() {
     }
     return (
         <>
-            <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Gallery">
+            <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Gallery" bannerImage="/assets/images/gallery-page/gallery-banner.webp">
 
                 {/* gallery */}
                 <section className="gallery-page-section sec-pad-2">

app/rehabilitation/[slug]/page.js

@@ -32,7 +32,7 @@ export default function RehabilitationDetailsPage({ params }) {
                 
                 {/* Categories */}
                 <div className="sidebar-widget category-widget">
-                  <div className="widget-title"><h3>Categories</h3></div>
+                  <div className="widget-title"><h3>Rehabilitation</h3></div>
                   <div className="widget-content">
                     <ul className="category-list clearfix">
                       {Rehabilitation.map((cat) => (

components/layout/Menu.js

@@ -25,7 +25,7 @@ export default function Menu() {
                         <li><Link href="/onepage">OnePage Home</Link></li>
                     </ul> */}
                 </li>
-                <li className="dropdown"><Link href="#">About Us</Link>
+                <li className="dropdown"><Link href="/about-us">About Us</Link>
                     <ul>
                         <li><Link href="/our-team-physiotherapy-etobicoke">Our Team</Link></li>
                         <li><Link href="/ourapproach-physiotherapy-etobicoke">Our Approach</Link></li>
@@ -120,7 +120,7 @@ export default function Menu() {
                 </li>
 
                 {/* Contact */}
-                <li><Link href="/contact-us">Contact</Link></li>
+                <li><Link href="/contact">Contact</Link></li>
             </ul>
 
         </>

components/sections/home/AboutSection.js

@@ -16,9 +16,9 @@ export default function AboutSection() {
                             <div className="image-box">
                                 <div className="shape float-bob-x" style={{ backgroundImage: 'url(/assets/images/shape/shape-7.png)' }}></div>
                                 <div className="image-shape" style={{ backgroundImage: 'url(/assets/images/shape/shape-26.png)' }}></div>
-                                <figure className="image-2"><img src="/assets/images/home/home-welcome.webp" alt="" /></figure>
+                                <figure className="image-2"><img src="/assets/images/home/welcome/home-welcome.webp" alt="" /></figure>
-                                <div className="icon-one"><i className="icon-13"></i></div>
+                                <div className="icon-one"><img src="/assets/images/home/welcome/top-icon.webp" alt="" /></div>
-                                <div className="icon-two"><i className="icon-14"></i></div>
+                                <div className="icon-two"><img src="/assets/images/home/welcome/bottom-icon.webp" alt="" /></div>
                                 {/* <div className="text-box">
                                     <h3>Wade Warren</h3>
                                     <span>Medical Assistant</span>

components/sections/home/FaqSection.js

@@ -41,7 +41,7 @@ export default function FaqSection() {
                                 </div>
                                 <figure className="image image-1"><img src="/assets/images/home/why-trust-us/trust-right.webp" alt="" /></figure>
                                 <figure className="image image-2"><img src="/assets/images/home/why-trust-us/trust-left.webp" alt="" /></figure>
-                                <div className="icon-box"><i className="icon-14"></i></div>
+                                <div className="icon-box"><img src="/assets/images/home/why-trust-us/icon.webp" alt="" /></div>
                             </div>
                         </div>
                     </div>

components/sections/home/WhyChooseusSection.js

@@ -4,8 +4,8 @@ import React from 'react';
 export default function WhyChooseUsSection() {
   return (
     <section className="chooseus-section">
-      <div className="bg-layer" style={{ backgroundImage: 'url(assets/images/background/chooseus-bg.jpg)' }}></div>
+      <div className="bg-layer" style={{ backgroundImage: 'url(/assets/images/home/why-choose/why-choose-right.webp)' }}></div>
-      <div className="pattern-layer" style={{ backgroundImage: 'url(assets/images/shape/shape-12.png)' }}></div>
+      <div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/shape/shape-12.png)' }}></div>
       <div className="auto-container">
         <div className="row clearfix">
           <div className="col-lg-8 col-md-12 col-sm-12 content-column">

public/assets/css/module-css/sidebar.css

@@ -52,13 +52,13 @@
   font-size: 22px;
   line-height: 32px;
   font-weight: 500;
-  color: var(--title-color);
+  color: #101A30;
   padding-left: 35px;
 }
 
 .default-sidebar .category-widget .category-list li a:hover,
 .default-sidebar .category-widget .category-list li a.current{
-  color: var(--secondary-color);
+  color: #bc0000;
 }
 
 .default-sidebar .category-widget .category-list li a:before{

public/assets/css/style.css

@@ -2925,3 +2925,17 @@
      --bs-gutter-x: 20px;
    }
  }
+ .read-more-btn {
+  background: none;
+  border: none;
+  color: #bc0000;
+  font-weight: 600;
+  cursor: pointer;
+  padding: 5px 0;
+  transition: color 0.3s ease;
+}
+
+.read-more-btn:hover {
+  color: #101A30;
+  text-decoration: underline;
+}