blog banner updated

app/blog/[slug]/page.js

@@ -9,17 +9,106 @@ export async function generateStaticParams() {
   }));
 }
 
+export async function generateMetadata({ params }) {
+  const blog = Blogs.find((item) => item.slug === params.slug);
+
+  if (!blog) {
+    return {};
+  }
+
+  return {
+    title: blog.meta?.title || blog.title,
+    description: blog.meta?.description || blog.shortDesc,
+  };
+}
+
 export default function BlogDetails({ params }) {
   const blog = Blogs.find((item) => item.slug === params.slug);
 
   if (!blog) return notFound();
 
+  const sameCategoryBlogs = Blogs.filter(
+    (item) => item.category === blog.category && item.slug !== blog.slug
+  );
+
+  const relatedBlogs = sameCategoryBlogs.length > 0 ? [sameCategoryBlogs[0]] : [];
+
+
   return (
-    <Layout headerStyle={2} footerStyle={1} breadcrumbTitle={blog.title}  bannerImage={blog.bannerImage}>
-      <section className="sidebar-page-container sec-pad-2">
+    <Layout
+      headerStyle={2}
+      footerStyle={1}
+      breadcrumbTitle={blog.title}
+      bannerImage={blog.bannerImage}
+    >
+      <section className="service-details pt_90 pb_90">
         <div className="auto-container">
           <div className="row clearfix">
-            <div className="col-lg-12 col-md-12 col-sm-12 content-side">
+            {/* Sidebar */}
+            <div className="col-lg-4 col-md-12 col-sm-12 sidebar-side">
+              <div className="default-sidebar service-sidebar mr_15">
+                <div className="sidebar-widget category-widget">
+                  <div className="widget-title">
+                    <h3>Blogs</h3>
+                  </div>
+                  <div className="widget-content">
+                    <ul className="category-list clearfix">
+                      {Blogs.map((b) => (
+                        <li key={b.id}>
+                          <Link
+                            href={`/blog/${b.slug}`}
+                            className={b.slug === blog.slug ? "current" : ""}
+                          >
+                            {b.title}
+                          </Link>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
+                </div>
+
+                {relatedBlogs.length > 0 && (
+                  <div className="sidebar-widget related-post">
+                    <div className="widget-title">
+                      <h3>Related Blog</h3>
+                    </div>
+                    <div className="post-inner">
+                      {relatedBlogs.map((related) => (
+                        <div className="service-block-one" key={related.id}>
+                          <div className="inner-box">
+                            <div className="image-box">
+                              <figure className="image">
+                                <img
+                                  src={related.thumbnail}
+                                  alt={related.title}
+                                />
+                              </figure>
+                            </div>
+                            <div className="lower-content2">
+                              <h3>
+                                <Link href={`/blog/${related.slug}`}>
+                                  {related.title}
+                                </Link>
+                              </h3>
+                              <p>{related.shortDesc}</p>
+                              <Link
+                                href={`/blog/${related.slug}`}
+                                className="read-more"
+                              >
+                                Read More
+                              </Link>
+                            </div>
+                          </div>
+                        </div>
+                      ))}
+                    </div>
+                  </div>
+                )}
+              </div>
+            </div>
+
+            {/* Blog Content */}
+            <div className="col-lg-8 col-md-12 col-sm-12 content-side">
               <div className="blog-details-content">
                 <div className="news-block-one">
                   <div className="inner-box">
@@ -31,11 +120,6 @@ export default function BlogDetails({ params }) {
                       />
                     </figure>
                     <div className="lower-content">
-                      {/* <ul className="post-info mb_15 clearfix">
-                        <li><Link href="#">{blog.author}</Link></li>
-                        <li>{blog.date}</li>
-                        <li>{blog.comments}</li>
-                      </ul> */}
                       <h2>{blog.title}</h2>
                       <div dangerouslySetInnerHTML={{ __html: blog.content }} />
                     </div>

app/blog/page.js

@@ -5,8 +5,8 @@ import Blogs from "@/utils/Blog.utils";
 
 export default function Blog() {
   return (
-    <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Blog">
-      <section className="news-section sec-pad bg-color-1">
+    <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Blog" bannerImage="/assets/images/blog/blog-banner.webp">
+      <section className="news-section sec-pad">
         <div className="auto-container">
           <div className="sec-title mb_50 centred">
             <span className="sub-title">Our Blog</span>
@@ -34,7 +34,11 @@ export default function Blog() {
                         <li>{blog.comments}</li>
                       </ul> */}
                       <h3>
-                        <Link href={`/blog/${blog.slug}`}>{blog.title}</Link>
+                        <Link href={`/blog/${blog.slug}`}>
+                          {blog.title.split(" ").length > 5
+                            ? blog.title.split(" ").slice(0, 5).join(" ") + "..."
+                            : blog.title}
+                        </Link>
                       </h3>
                       <p>{blog.shortDesc}</p>
                       <div className="link">

app/ourapproach-physiotherapy-etobicoke/page.js

@@ -10,7 +10,7 @@ export default function About() {
         <section className="about-style-two pt_90 pb_90">
           <div className="pattern-layer">
             <div className="pattern-1 rotate-me" style={{ backgroundImage: "url(/assets/images/shape/shape-8.webp)" }}></div>
-            <div className="pattern-2 rotate-me" style={{ backgroundImage: "url(/assets/images/shape/shape-9.png)" }}></div>
+            <div className="pattern-2 rotate-me" style={{ backgroundImage: "url(/assets/images/shape/shape-9.webp)" }}></div>
             <div className="pattern-3" style={{ backgroundImage: "url(/assets/images/shape/shape-11.webp)" }}></div>
             <div className="pattern-4" style={{ backgroundImage: "url(/assets/images/shape/shape-35.webp)" }}></div>
           </div>

app/page.js

@@ -17,13 +17,20 @@ import News from "@/components/sections/home1/News"
 import Funfacts from "@/components/sections/home1/Funfacts"
 import MobileServices from "@/components/sections/home/MobileServicesSection"
 import MobileFeatureCard from "@/components/sections/home/MobileFeatureCard"
+import MobileBanner from "@/components/sections/home2/MobileBanner"
 
 export default function Home() {
 
     return (
         <>
             <Layout headerStyle={2} footerStyle={2}>
-                <Banner />
+                <div className="d-none d-md-block">
+                    <Banner />
+                </div>
+
+                <div className="d-block d-md-none">
+                    <MobileBanner />
+                </div>
                 {/* <Features /> */}
                 <AboutSection />
                 {/* <ProcessSection /> */}
@@ -36,8 +43,8 @@ export default function Home() {
                 <div className="d-block d-md-none">
                     <MobileServices />
                 </div>
-                <MobileFeatureCard/>
-                   <Features />
+                <MobileFeatureCard />
+                <Features />
                 <FaqSection />
                 <AreaOfInjury />
                 <WhyChooseUsSection />

components/layout/MobileMenu.js

@@ -32,7 +32,7 @@ export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar
   return (
     <>
       <div className="mobile-menu">
-        {/* Backdrop for closing */}
+        {/* Backdrop */}
         <div className="menu-backdrop" onClick={handleMobileMenu} />
         {/* Close button */}
         <div className="close-btn" onClick={handleMobileMenu}>
@@ -41,20 +41,35 @@ export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar
 
         {/* Mobile Navigation */}
         <nav className="menu-box">
-          <div className="nav-logo">
-            <Link href="/" onClick={handleMobileMenu}>
-              <img src="/assets/images/logo-2.png" alt="Logo" />
-            </Link>
+          
+          {/* Header row (Logo left, Social icons right) */}
+          <div className="nav-header">
+            <div className="nav-logo">
+              <Link href="/" onClick={handleMobileMenu}>
+                <img src="/assets/images/logo-2.png" alt="Logo" />
+              </Link>
+            </div>
+            <div className="nav-social">
+              <ul className="clearfix">
+                <li>
+                  <Link href="https://www.instagram.com/elrapharehab/" target="_blank" rel="noopener noreferrer">
+                    <span className="fab fa-instagram"></span>
+                  </Link>
+                </li>
+                <li>
+                  <Link href="https://www.facebook.com/ELRaphaRehabCenter/" target="_blank" rel="noopener noreferrer">
+                    <span className="fab fa-facebook-square"></span>
+                  </Link>
+                </li>
+              </ul>
+            </div>
           </div>
 
+          {/* Menu Items */}
           <div className="menu-outer">
-            <div
-              className="collapse navbar-collapse show clearfix"
-              id="navbarSupportedContent"
-            >
+            <div className="collapse navbar-collapse show clearfix" id="navbarSupportedContent">
               <ul className="navigation clearfix">
 
-                {/* Home */}
                 <li>
                   <Link href="/" onClick={handleMobileMenu}>Home</Link>
                 </li>
@@ -156,7 +171,7 @@ export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar
                   </div>
                 </li>
 
-                {/* Contact */}
+                {/* Other Links */}
                 <li><Link href="/contact" onClick={handleMobileMenu}>Contact</Link></li>
                 <li><Link href="/why-rapha-physiotherapy-etobicoke" onClick={handleMobileMenu}>Why Us</Link></li>
                 <li><Link href="/faq-physiotherapy-etobicoke" onClick={handleMobileMenu}>Faq</Link></li>
@@ -171,16 +186,16 @@ export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar
             <h4>Contact Info</h4>
             <ul>
               <li>6 – 4335 Bloor Street West Etobicoke, M9C5S2</li>
-              <li><Link href="tel:+647-722-3434, +416-622-2873" onClick={handleMobileMenu}>+647-722-3434, +416-622-2873</Link></li>
-              <li><Link href="mailto:bloor@rapharehab.ca" onClick={handleMobileMenu}>bloor@rapharehab.ca</Link></li>
-            </ul>
-          </div>
-
-          {/* Social Links */}
-          <div className="social-links">
-            <ul className="clearfix">
-              <li><Link href="https://www.instagram.com/elrapharehab/" target="_blank" rel="noopener noreferrer"><span className="fab fa-instagram"></span></Link></li>
-              <li><Link href="https://www.facebook.com/ELRaphaRehabCenter/" target="_blank" rel="noopener noreferrer"><span className="fab fa-facebook-square"></span></Link></li>
+              <li>
+                <Link href="tel:+647-722-3434, +416-622-2873" onClick={handleMobileMenu}>
+                  +647-722-3434, +416-622-2873
+                </Link>
+              </li>
+              <li>
+                <Link href="mailto:bloor@rapharehab.ca" onClick={handleMobileMenu}>
+                  bloor@rapharehab.ca
+                </Link>
+              </li>
             </ul>
           </div>
         </nav>

components/sections/home/AboutSection.js

@@ -6,7 +6,7 @@ export default function AboutSection() {
         <section className="about-style-two pt_90 pb_90">
             <div className="pattern-layer">
                 <div className="pattern-1 rotate-me" style={{ backgroundImage: 'url(/assets/images/shape/shape-8.webp)' }}></div>
-                <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(/assets/images/shape/shape-9.png)' }}></div>
+                <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(/assets/images/shape/shape-9.webp)' }}></div>
                 <div className="pattern-3" style={{ backgroundImage: 'url(/assets/images/shape/shape-11.webp)' }}></div>
             </div>
             <div className="auto-container">

components/sections/home/AreaOfInjury.js

@@ -16,8 +16,8 @@ export default function AreaOfInjury() {
     return (
         <section className="team-section sec-pad centred  bg-color-1">
             <div className="pattern-layer">
-                <div className="pattern-1" style={{ backgroundImage: 'url(assets/images/shape/shape-13.webp)' }}></div>
-                <div className="pattern-2" style={{ backgroundImage: 'url(assets/images/shape/shape-14.webp)' }}></div>
+                <div className="pattern-1" style={{ backgroundImage: 'url(/assets/images/shape/shape-13.webp)' }}></div>
+                <div className="pattern-2" style={{ backgroundImage: 'url(/assets/images/shape/shape-14.webp)' }}></div>
             </div>
             <div className="shape">
                 {/* <div className="shape-1 float-bob-y" style={{ backgroundImage: 'url(assets/images/shape/shape-15.png)' }}></div> */}
@@ -26,9 +26,9 @@ export default function AreaOfInjury() {
             </div>
             <div className="auto-container">
                 <div className="sec-title-1 mb_50">
-                    <span className="sub-title-1">Area Of Injury</span>
+                    <span className="sub-title-1">Start Your Treatment Today! <br /> Visit our healthcare team in Etobicoke.</span>
                     <h3 className='h3-white' style={{ fontWeight: "bold" }}>
-                        Start Your Treatment Today! <br /> Visit our healthcare team in Etobicoke.
+                       Area Of Injury
                     </h3>
                 </div>
                 <div className="row clearfix">

components/sections/home/MobileServicesSection.js

@@ -5,10 +5,17 @@ import Link from "next/link"
 export default function MobileServices() {
     return (
         <>
-            <section className="feature-section sec-pad bg-color-1">
+           <section className="feature-section sec-pad bg-color-1" style={{
+                backgroundImage: "url(/assets/images/home/our-services/our-services-bg.webp)",
+                backgroundSize: "cover",        
+                backgroundPosition: "left",    
+                backgroundRepeat: "no-repeat",   
+                backgroundAttachment: "scroll",   
+            }}
+            >
                 <div className="auto-container">
                     <div className="sec-title mb_50 centred">
-                        <span className="sub-title-1 new-color">Our Services</span>
+                        <span className="sub-title-1 new-color2">Our Services</span>
                         <h2 className="tex-color-1">We Help You Move Better & <br />Live Healthier</h2>
                     </div>
                     <div className="row clearfix">

components/sections/home/ServicesSection.js

@@ -4,9 +4,7 @@ import React from 'react';
 
 export default function ServicesSection() {
     return (
-        // <section className="service-section bg-layer sec-pad bg-color-1" style={{ backgroundImage: 'url(/assets/images/home/our-services/our-services-bg.webp)' }}>
-        <section className="service-section sec-pad bg-color-1" >
-           <div className="pattern-layer" style={{ backgroundImage: 'url(/assets/images/home/our-services/our-services-bg.webp)' }}></div>
+        <section className="service-section bg-layer sec-pad bg-color-1" style={{ backgroundImage: 'url(/assets/images/home/our-services/our-services-bg.webp)' }}>
            
             <div className="auto-container">
                 <div className="sec-title-1 mb_50 centred">

components/sections/home1/About.js

@@ -7,7 +7,7 @@ export default function about() {
       <div className="pattern-layer">
         <div className="pattern-1 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
         <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
-        <div className="pattern-3 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.png)' }}></div>
+        <div className="pattern-3 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.webp)' }}></div>
         <div className="pattern-4" style={{ backgroundImage: 'url(assets/images/shape/shape-10.png)' }}></div>
         <div className="pattern-5" style={{ backgroundImage: 'url(assets/images/shape/shape-11.webp)' }}></div>
       </div>

components/sections/home2/About.js

@@ -5,7 +5,7 @@ export default function About() {
     <section className="about-style-two pt_90 pb_90">
       <div className="pattern-layer">
         <div className="pattern-1 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
-        <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.png)' }}></div>
+        <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.webp)' }}></div>
         <div className="pattern-3" style={{ backgroundImage: 'url(assets/images/shape/shape-11.webp)' }}></div>
       </div>
       <div className="auto-container">

components/sections/home2/Banner.js

@@ -1,8 +1,13 @@
 'use client'
-import React from 'react';
-import Link from "next/link"
-import { Autoplay, Navigation, Pagination } from "swiper/modules"
-import { Swiper, SwiperSlide } from "swiper/react"
+import React, { useState, useEffect } from 'react';
+import Link from "next/link";
+import { Autoplay, Navigation, Pagination } from "swiper/modules";
+import { Swiper, SwiperSlide } from "swiper/react";
+import { motion, AnimatePresence } from "framer-motion";
+
+import "swiper/css";
+import "swiper/css/navigation";
+import "swiper/css/pagination";
 
 const swiperOptions = {
     modules: [Autoplay, Pagination, Navigation],
@@ -13,126 +18,182 @@ const swiperOptions = {
         disableOnInteraction: false,
     },
     loop: true,
-
-    // Navigation
     navigation: {
         nextEl: '.h1n',
         prevEl: '.h1p',
     },
-
-    // Pagination
     pagination: {
         el: '.swiper-pagination',
         clickable: true,
     },
+};
 
+const variants = {
+    topToBottom: {
+        initial: { y: '-100vh', opacity: 0 },
+        animate: { y: 0, opacity: 1 },
+        exit: { y: '100vh', opacity: 0 }
+    },
+    bottomToTop: {
+        initial: { y: '100vh', opacity: 0 },
+        animate: { y: 0, opacity: 1 },
+        exit: { y: '-100vh', opacity: 0 }
+    },
+    leftToRight: {
+        initial: { x: '-100vw', opacity: 0 },
+        animate: { x: 0, opacity: 1 },
+        exit: { x: '100vw', opacity: 0 }
+    },
+    rightToLeft: {
+        initial: { x: '100vw', opacity: 0 },
+        animate: { x: 0, opacity: 1 },
+        exit: { x: '-100vw', opacity: 0 }
+    },
+};
 
-
-}
+const transition = {
+    type: "tween",
+    ease: [0.4, 0.0, 0.2, 1],
+    duration: 1.2
+};
 
 export default function Banner() {
+    const [activeIndex, setActiveIndex] = useState(0);
+    const [isAnimating, setIsAnimating] = useState(false);
+
+    const slides = [
+        {
+            id: 0,
+            variant: 'topToBottom',
+            bgImage: '/assets/images/home/banner/home-banner-1.webp',
+            upperText: 'The Journey to Better Health Begins here',
+            title: 'Your Path to',
+            titleSpan: 'Recovery',
+            titleEnd: 'Starts Today',
+            subtitle: 'Expert Physiotherapy in Mississauga for You.',
+            description: 'Our skilled team provides physiotherapy in Mississauga to help you regain mobility and live pain-free. Compassionate care designed around your needs.',
+            buttonText: 'Book Your Appointment',
+            buttonLink: 'tel:+647-722-3434',
+            contentStyle: 'mobile-style'
+        },
+        {
+            id: 1,
+            variant: 'bottomToTop',
+            bgImage: '/assets/images/home/banner/home-banner-2.webp',
+            upperText: 'Compassionate Care, Delivered with Expertise',
+            title: 'Healing Touch,',
+            titleSpan: 'Fresh',
+            titleEnd: 'Inner Strength',
+            subtitle: 'Expert Hand Massage Techniques for Relief',
+            description: 'Experience targeted hand massage therapy to ease tension and promote healing, delivered by experienced therapists focused on your comfort and well-being.',
+            buttonText: 'Schedule a Massage',
+            buttonLink: '/contact',
+            contentStyle: 'with-background'
+        },
+        {
+            id: 2,
+            variant: 'leftToRight',
+            bgImage: '/assets/images/home/banner/home-banner-3.webp',
+            upperText: 'Your Path to Complete Wellness Starts Here',
+            title: 'Local Physio',
+            titleSpan: 'Experts',
+            titleEnd: 'Near You',
+            subtitle: 'Physiotherapy Etobicoke & Rehab Care.',
+            description: 'Offering comprehensive physiotherapy and rehabilitation services in Etobicoke to support your wellness journey and help restore your strength efficiently.',
+            buttonText: 'Explore Our Service',
+            buttonLink: '/etobicoke-treatment-service',
+            contentStyle: 'with-background'
+        },
+        {
+            id: 3,
+            variant: 'rightToLeft',
+            bgImage: '/assets/images/home/banner/home-banner-4.webp',
+            upperText: 'Healing Hands, Caring Hearts in Action',
+            title: 'Wellness',
+            titleSpan: 'by the',
+            titleEnd: 'Waterfront',
+            subtitle: 'Waterfront Physio and Rehab Services.',
+            description: 'Find peace and true healing with our specialized waterfront physio and rehab programs carefully designed for lasting wellness and a better quality of life.',
+            buttonText: 'Visit Our Location',
+            buttonLink: '/contact',
+            contentStyle: 'with-background'
+        }
+    ];
+
+    const handleSlideChange = (swiper) => {
+        setIsAnimating(true);
+        setActiveIndex(swiper.realIndex || 0);
+        setTimeout(() => {
+            setIsAnimating(false);
+        }, 1200);
+    };
+
     return (
         <section className="banner-style-two p_relative">
-            <Swiper {...swiperOptions} className="banner-carousel owl-theme owl-carousel owl-nav-none owl-dots-none">
-                <SwiperSlide className="slide-item">
-                    <div
-                        className="bg-layer"
-                        style={{ backgroundImage: 'url(/assets/images/home/banner/home-banner-1.webp)' }}
-                    ></div>
-                    <div className="bg-layer" style={{ backgroundImage: 'url(/assets/images/home/banner/home-banner-1.webp)', backgroundPosition: '75% center' }}></div>
-                    {/* <figure className="image-layer"><img src="/assets/images/home/banner/banner-img-1.webp" alt="" /></figure> */}
-                    <div className="auto-container">
-                        <div className="content-box custom-content-box" style={{ background: 'white', borderRadius: '15%', opacity: 0.8 }}>
+            <Swiper
+                {...swiperOptions}
+                className="banner-carousel owl-theme owl-carousel owl-nav-none owl-dots-none"
+                onSwiper={(swiper) => {
+                    setActiveIndex(swiper.realIndex || 0);
+                }}
+                onSlideChange={handleSlideChange}
+            >
+                {slides.map((slide, index) => (
+                    <SwiperSlide key={slide.id}>
+                        <AnimatePresence mode="wait">
+                            {activeIndex === index && (
+                                <motion.div
+                                    key={`slide-${index}`}
+                                    className="slide-item"
+                                    variants={variants[slide.variant]}
+                                    initial="initial"
+                                    animate="animate"
+                                    exit="exit"
+                                    transition={transition}
+                                >
+                                    <div
+                                        className="bg-layer"
+                                        style={{ backgroundImage: `url(${slide.bgImage})` }}
+                                    ></div>
+                                    <div className="auto-container">
+                                        <div
+                                            className={`content-box custom-content-box ${slide.contentStyle || ''}`}
+                                            style={slide.contentStyle === 'with-background' ? {
+                                                backgroundColor: '#fff',
+                                                opacity: 0.8,
+                                                borderRadius: '20px',
+                                                padding: '30px'
+                                            } : {}}
+                                        >
+                                            <span className="upper-text">
+                                                {slide.upperText}
+                                            </span>
 
-                            <span className="upper-text">The Journey to Better Health Begins here</span>
-                            <h2>Your Path to <span>Recovery</span> Starts Today</h2>
-                            <p>Expert Physiotherapy in Mississauga for You.</p>
-                            <p>
-                                Our skilled team provides physiotherapy in Mississauga to help you regain mobility and live pain-free. Compassionate care designed around your needs.
-                            </p>
-                            <div className="btn-box mt-3">
-                                <Link href="tel:+647-722-3434" className="theme-btn btn-one">
-                                    <span>Book Your Appointment</span>
-                                </Link>
-                            </div>
-                        </div>
-                    </div>
-                </SwiperSlide>
-                {/* Repeat the above structure for each slide-item as needed */}
-                <SwiperSlide className="slide-item">
-                    <div
-                        className="bg-layer"
-                        style={{ backgroundImage: 'url(/assets/images/home/banner/home-banner-2.webp)' }}
-                    ></div>
-                    {/* <figure className="image-layer"><img src="/assets/images/home/banner/banner-img-2.webp" alt="" /></figure> */}
-                    <div className="auto-container">
-                        <div className="content-box custom-content-box" style={{ background: 'white', borderRadius: '15%', opacity: 0.8 }}>
+                                            <h2>
+                                                {slide.title} <span>{slide.titleSpan}</span> {slide.titleEnd}
+                                            </h2>
 
-                            <span className="upper-text">Compassionate Care, Delivered with Expertise</span>
-                            <h2>Healing Touch, <span>Fresh</span> Inner Strength</h2>
-                            <p>Expert Hand Massage Techniques for Relief</p>
-                            <p>
-                                Experience targeted hand massage therapy to ease tension and promote healing, delivered by experienced therapists focused on your comfort and well-being.
-                            </p>
-                            <div className="btn-box mt-3">
-                                <Link href="/contact" className="theme-btn btn-one">
-                                    <span>Schedule a Massage</span>
-                                </Link>
-                            </div>
-                        </div>
-                    </div>
-                </SwiperSlide>
+                                            <p>
+                                                {slide.subtitle}
+                                            </p>
 
-                {/* Repeat the above structure for each slide-item as needed */}
-                <SwiperSlide className="slide-item">
-                    <div
-                        className="bg-layer"
-                        style={{ backgroundImage: 'url(/assets/images/home/banner/home-banner-3.webp)' }}
-                    ></div>
-                    <div className="auto-container">
-                        <div className="content-box custom-content-box" style={{ background: 'white', borderRadius: '15%', opacity: 0.8 }}>
-
-                            <span className="upper-text">Your Path to Complete Wellness Starts Here</span>
-                            <h2>Local Physio <span>Experts </span> Near You</h2>
-                            <p>Physiotherapy Etobicoke & Rehab Care.</p>
-                            <p>
-                                Offering comprehensive physiotherapy and rehabilitation services in Etobicoke to support your wellness journey and help restore your strength efficiently.
-                            </p>
-                            <div className="btn-box mt-3">
-                                <Link href="/etobicoke-treatment-service" className="theme-btn btn-one">
-                                    <span>Explore Our Service</span>
-                                </Link>
-                            </div>
-                        </div>
-                    </div>
-                </SwiperSlide>
-
-                <SwiperSlide className="slide-item">
-                    <div
-                        className="bg-layer"
-                        style={{ backgroundImage: 'url(/assets/images/home/banner/home-banner-4.webp)' }}
-                    ></div>
-                    {/* <figure className="image-layer"><img src="/assets/images/home/banner/banner-img-4.webp" alt="" /></figure> */}
-                    <div className="auto-container">
-                        <div className="content-box custom-content-box" style={{ background: 'white', borderRadius: '15%', opacity: 0.8 }}>
-
-                            <span className="upper-text">Healing Hands, Caring Hearts in Action</span>
-                            <h2>Wellness <span>by the</span>Waterfront</h2>
-                            <p>Waterfront Physio and Rehab Services.</p>
-                            <p>
-                                Find peace and true healing with our specialized waterfront physio and rehab programs carefully designed for lasting wellness and a better quality of life.
-                            </p>
-                            <div className="btn-box mt-3">
-                                <Link href="/contact" className="theme-btn btn-one">
-                                    <span>Visit Our Location</span>
-                                </Link>
-                            </div>
-                        </div>
-                    </div>
-                </SwiperSlide>
+                                            <p>
+                                                {slide.description}
+                                            </p>
 
+                                            <div className="btn-box mt-3">
+                                                <Link href={slide.buttonLink} className="theme-btn btn-one">
+                                                    <span>{slide.buttonText}</span>
+                                                </Link>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </motion.div>
+                            )}
+                        </AnimatePresence>
+                    </SwiperSlide>
+                ))}
             </Swiper>
         </section>
     );
 };
-

components/sections/home2/MobileBanner.js

@@ -0,0 +1,178 @@
+'use client'
+import React, { useState, useEffect } from 'react';
+import Link from "next/link";
+import { Autoplay, Navigation, Pagination } from "swiper/modules";
+import { Swiper, SwiperSlide } from "swiper/react";
+import { motion, AnimatePresence } from "framer-motion";
+
+import "swiper/css";
+import "swiper/css/navigation";
+import "swiper/css/pagination";
+
+const swiperOptions = {
+    modules: [Autoplay, Pagination, Navigation],
+    slidesPerView: 1,
+    spaceBetween: 0,
+    autoplay: {
+        delay: 5000,
+        disableOnInteraction: false,
+    },
+    loop: true,
+    navigation: {
+        nextEl: '.h1n',
+        prevEl: '.h1p',
+    },
+    pagination: {
+        el: '.swiper-pagination',
+        clickable: true,
+    },
+};
+
+const variants = {
+    topToBottom: { initial: { y: '-100vh', opacity: 0 }, animate: { y: 0, opacity: 1 }, exit: { y: '100vh', opacity: 0 } },
+    bottomToTop: { initial: { y: '100vh', opacity: 0 }, animate: { y: 0, opacity: 1 }, exit: { y: '-100vh', opacity: 0 } },
+    leftToRight: { initial: { x: '-100vw', opacity: 0 }, animate: { x: 0, opacity: 1 }, exit: { x: '100vw', opacity: 0 } },
+    rightToLeft: { initial: { x: '100vw', opacity: 0 }, animate: { x: 0, opacity: 1 }, exit: { x: '-100vw', opacity: 0 } },
+};
+
+const transition = { type: "tween", ease: [0.4, 0.0, 0.2, 1], duration: 1.2 };
+
+export default function MobileBanner() {
+    const [activeIndex, setActiveIndex] = useState(0);
+    const [isMobile, setIsMobile] = useState(false);
+
+    useEffect(() => {
+        const handleResize = () => setIsMobile(window.innerWidth <= 768);
+        handleResize();
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, []);
+
+    const slides = [
+        {
+            id: 0,
+            variant: 'topToBottom',
+            bgImage: '/assets/images/banner/mobile-banner/banner-1.webp',
+            hideContent: true
+        },
+        {
+            id: 1,
+            variant: 'bottomToTop',
+            bgImage: '/assets/images/banner/mobile-banner/banner-2.webp',
+            upperText: 'Compassionate Care, Delivered with Expertise',
+            title: 'Healing Touch,',
+            titleSpan: 'Fresh',
+            titleEnd: 'Inner Strength',
+            subtitle: 'Expert Hand Massage Techniques for Relief',
+            description: 'Experience targeted hand massage therapy to ease tension and promote healing, delivered by experienced therapists focused on your comfort and well-being.',
+            buttonText: 'Schedule a Massage',
+            buttonLink: '/contact',
+            contentStyle: 'with-background'
+        },
+        {
+            id: 2,
+            variant: 'leftToRight',
+            bgImage: '/assets/images/banner/mobile-banner/banner-3.webp',
+            upperText: 'Your Path to Complete Wellness Starts Here',
+            title: 'Local Physio',
+            titleSpan: 'Experts',
+            titleEnd: 'Near You',
+            subtitle: 'Physiotherapy Etobicoke & Rehab Care.',
+            description: 'Offering comprehensive physiotherapy and rehabilitation services in Etobicoke to support your wellness journey and help restore your strength efficiently.',
+            buttonText: 'Explore Our Service',
+            buttonLink: '/etobicoke-treatment-service',
+            contentStyle: 'with-background'
+        },
+        {
+            id: 3,
+            variant: 'rightToLeft',
+            bgImage: '/assets/images/banner/mobile-banner/banner-4.webp',
+            upperText: 'Healing Hands, Caring Hearts in Action',
+            title: 'Wellness',
+            titleSpan: 'by the',
+            titleEnd: 'Waterfront',
+            subtitle: 'Waterfront Physio and Rehab Services.',
+            description: 'Find peace and true healing with our specialized waterfront physio and rehab programs carefully designed for lasting wellness and a better quality of life.',
+            buttonText: 'Visit Our Location',
+            buttonLink: '/contact',
+            contentStyle: 'with-background'
+        }
+    ];
+
+    if (!isMobile) return null;
+
+    return (
+        <section className="banner-style-two p_relative">
+            <Swiper
+                {...swiperOptions}
+                className="banner-carousel"
+                onSwiper={(swiper) => setActiveIndex(swiper.realIndex || 0)}
+                onSlideChange={(swiper) => setActiveIndex(swiper.realIndex || 0)}
+            >
+                {slides.map((slide, index) => (
+                    <SwiperSlide key={slide.id}>
+                        <AnimatePresence mode="wait">
+                            {activeIndex === index && (
+                                <motion.div
+                                    key={`slide-${index}`}
+                                    className="slide-item"
+                                    variants={variants[slide.variant]}
+                                    initial="initial"
+                                    animate="animate"
+                                    exit="exit"
+                                    transition={transition}
+                                >
+                                    <div
+                                        className="bg-layer"
+                                        style={{
+                                            backgroundImage: `url(${slide.bgImage})`,
+                                            backgroundSize: 'cover',
+                                            backgroundPosition: 'center',
+                                            width: '100%',
+                                            height: '100%',
+                                            minHeight: '400px'
+                                        }}
+                                    ></div>
+
+                                    <div
+                                        className="auto-container"
+                                        style={{
+                                            minHeight: '400px', // force same height for first slide
+                                            display: 'flex',
+                                            justifyContent: 'center',
+                                            alignItems: 'center'
+                                        }}
+                                    >
+                                        {!slide.hideContent && (
+                                            <div
+                                                className={`content-box custom-content-box ${slide.contentStyle || ''}`}
+                                                style={slide.contentStyle === 'with-background' ? {
+                                                    backgroundColor: '#fff',
+                                                    opacity: 0.8,
+                                                    borderRadius: '20px',
+                                                    padding: '30px'
+                                                } : {}}
+
+                                            >
+                                                <span className="upper-text">{slide.upperText}</span>
+                                                <h2>{slide.title} <span>{slide.titleSpan}</span> {slide.titleEnd}</h2>
+                                                <p>{slide.subtitle}</p>
+                                                <p>{slide.description}</p>
+                                                <div className="btn-box mt-3">
+                                                    <Link href={slide.buttonLink} className="theme-btn btn-one">
+                                                        <span>{slide.buttonText}</span>
+                                                    </Link>
+                                                </div>
+                                            </div>
+                                        )}
+                                    </div>
+
+                                </motion.div>
+                            )}
+                        </AnimatePresence>
+                    </SwiperSlide>
+                ))}
+            </Swiper>
+        </section>
+    );
+};

components/sections/home3/Banner.js

@@ -26,7 +26,7 @@ export default function Banner() {
                         <div className="image-box">
                             <div className="image-shape">
                                 <div className="shape-1" style={{ backgroundImage: 'url(assets/images/shape/shape-31.png)' }}></div>
-                                <div className="shape-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.png)' }}></div>
+                                <div className="shape-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.webp)' }}></div>
                                 <div className="shape-3 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
                                 <div className="shape-4" style={{ backgroundImage: 'url(assets/images/shape/shape-32.png)' }}></div>
                             </div>

components/sections/onepage/About.js

@@ -7,7 +7,7 @@ export default function about() {
       <div className="pattern-layer">
         <div className="pattern-1 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
         <div className="pattern-2 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-8.webp)' }}></div>
-        <div className="pattern-3 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.png)' }}></div>
+        <div className="pattern-3 rotate-me" style={{ backgroundImage: 'url(assets/images/shape/shape-9.webp)' }}></div>
         <div className="pattern-4" style={{ backgroundImage: 'url(assets/images/shape/shape-10.png)' }}></div>
         <div className="pattern-5" style={{ backgroundImage: 'url(assets/images/shape/shape-11.webp)' }}></div>
       </div>

public/assets/css/module-css/contact.css

@@ -194,57 +194,4 @@
     padding: 40px 0px 70px 0px;
   }
 
-}
-
-@media only screen and (max-width: 599px){
-
-}
-
-@media only screen and (max-width: 499px){
-
-
-}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+}

public/assets/css/module-css/service.css

@@ -51,6 +51,17 @@
   min-height: 285px;
 }
 
+.service-block-one .inner-box .lower-content2{
+  position: relative;
+  display: block;
+  border: 1px solid rgba(0, 0, 0, 0.05);
+  border-radius: 0px 0px 20px 20px;
+  padding: 40px 40px 40px 40px;
+  transition: all 500ms ease;
+  overflow: visible; 
+  min-height: 285px;
+}
+
 .service-block-one .inner-box:hover .lower-content {
   border-color: #fff;
 }

public/assets/css/module-css/video.css

@@ -205,7 +205,7 @@ font-size: 18px;
 @media only screen and (max-width: 767px){
 
   .video-section .inner-box h2{
-    font-size: 28px;
+    font-size: 26px;
     line-height: 46px;
   }
 

public/assets/css/style.css

@@ -826,9 +826,12 @@
  }
 
  .new-color {
-
    color: #fff !important;
+ }
 
+ .new-color2 {
+   color: #fff !important;
+   font-size: 24px;
  }
 
  .sec-title h2 {
@@ -854,7 +857,7 @@
 
  @media (max-width: 425px) {
    .sec-title-1 h2 {
-     font-size: 28px;
+     font-size: 26px;
      line-height: 35px;
    }
  }
@@ -1062,11 +1065,33 @@
    }
  }
 
- @media (max-width: 426px) {
+ /* @media (max-width: 426px) {
    .top-inner .info-list li:nth-child(2) {
      display: none !important;
    }
- }
+ } */
+
+ .mobile-menu .nav-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between; /* even spacing */
+  padding: 10px 15px;
+}
+
+.mobile-menu .nav-social ul {
+  display: flex;
+  gap: 20px;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  padding-bottom: 50px;
+}
+
+.mobile-menu .nav-social ul li a {
+  font-size: 18px;
+  color: #fff;
+}
+
 
 
 
@@ -1907,6 +1932,7 @@
  .mobile-menu .contact-info {
    position: relative;
    padding: 120px 30px 20px 30px;
+   padding-bottom: 120px !important;
  }
 
  .mobile-menu .contact-info h4 {
@@ -2343,13 +2369,13 @@
 
  .pattern-1 {
 
-   opacity: 0.3;
+   opacity: 0.8;
 
  }
 
  .pattern-2 {
 
-   opacity: 0.3;
+   opacity: 0.8;
 
  }
 
@@ -2625,8 +2651,8 @@
 
  @media only screen and (max-width: 500px) {
    .header-style-two .header-lower .outer-container {
-     padding-left: 50px;
-     padding-right: 50px;
+     padding-left: 20px;
+     padding-right: 20px;
    }
 
  }
@@ -2933,6 +2959,34 @@
    }
 
 
+ }
+
+ @media only screen and (max-width : 426px){
+
+   .default-form .form-group input[type='text'],
+ .default-form .form-group input[type='email'],
+ .default-form .form-group textarea {
+   position: relative;
+   display: block;
+   width: 100%;
+   height: 55px;
+   border: 1px solid rgba(0, 0, 0, 0.1);
+   border-radius: 10px;
+   padding: 10px 30px;
+   font-size: 18px;
+   color: #676767;
+   transition: all 500ms ease;
+ }
+
+ .default-form .form-group textarea {
+   height: 80px;
+   resize: none;
+ }
+
+ .contact-style-three .default-form .form-group{
+  margin-bottom: 15px;
+}
+
  }
 
  blockquote {
@@ -3112,4 +3166,11 @@
    .custom-content-box {
      padding: 35px;
    }
- }
+ }
+ @media (max-width: 425px) {
+  .custom-content-box.mobile-style {
+    background: white;
+    border-radius: 15%;
+    opacity: 0.8;
+  }
+}

utils/Blog.utils.js

@@ -9,6 +9,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-1.webp",
     bannerImage: "/assets/images/blog/blog-1/blog-1-banner.webp",
     bigImage: "/assets/images/blog/blog-1/blog-1-big-img.webp",
+    category: "Physiotherapy",
     shortDesc:
       "Living with chronic pain can disrupt every aspect of life. At Rapharehab in Etobicoke, our physiotherapy and massage therapy services help you regain control, move with confidence, and enjoy lasting relief.",
     content: `
@@ -72,7 +73,7 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Chronic pain doesn’t have to define your life. At Rapharehab, we help you recover safely and effectively.”</p>
       <h4>Rapharehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
@@ -86,6 +87,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-2.webp",
     bannerImage: "/assets/images/blog/blog-2/blog-2-banner.webp",
     bigImage: "/assets/images/blog/blog-2/blog-2-big-img.webp",
+    category: "Physiotherapy",
     shortDesc:
       "Healthy, pain-free hands are essential for daily life. Rapharehab in Etobicoke offers hand massage and physiotherapy to restore strength, relieve tension, and maintain hand health.",
     content: `
@@ -150,7 +152,7 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Discover how our blend of hand massage, physiotherapy, and osteopathy can improve your comfort, mobility, and overall wellness.”</p>
       <h4>Rapharehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
@@ -164,6 +166,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-3.webp",
     bannerImage: "/assets/images/blog/blog-3/blog-3-banner.webp",
     bigImage: "/assets/images/blog/blog-3/blog-3-big-img.webp",
+    category: "Physiotherapy",
     shortDesc:
       "Wondering what happens during your very first osteopathy visit? At Rapha Rehab in Etobicoke, our expert and caring team provides gentle, hands-on care to restore balance and support wellness.",
     content: `
@@ -237,7 +240,7 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Experience how osteopathy combined with physiotherapy and massage therapy can improve balance, reduce discomfort, and support your overall health.”</p>
       <h4>Rapha Rehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
@@ -251,6 +254,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-4.webp",
     bannerImage: "/assets/images/blog/blog-4/blog-4-banner.webp",
     bigImage: "/assets/images/blog/blog-4/blog-4-big-img.webp",
+    category: "Workout",
     shortDesc:
       "Strength training can be a game-changer for rehabilitation. Rapha Rehab in Etobicoke helps patients safely build muscle, protect joints, and regain confidence in their movements.",
     content: `
@@ -329,7 +333,7 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Build strength, restore mobility, and stay injury-free with personalized strength training at Rapha Rehab.”</p>
       <h4>Rapha Rehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
@@ -343,6 +347,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-5.webp",
     bannerImage: "/assets/images/blog/blog-5/blog-5-banner.webp",
     bigImage: "/assets/images/blog/blog-5/blog-5-big-img.webp",
+    category: "Workout",
     shortDesc:
       "Learn safe techniques for training your biceps, triceps, and back. Rapha Rehab in Etobicoke combines physiotherapy with strength training to build power and prevent injury.",
     content: `
@@ -434,7 +439,7 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Build upper-body strength safely with expert guidance at Rapha Rehab, protecting joints while improving posture and performance.”</p>
       <h4>Rapha Rehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
@@ -448,6 +453,7 @@ const Blogs = [
     thumbnail: "/assets/images/blog/card/blog-6.webp",
     bannerImage: "/assets/images/blog/blog-6/blog-6-banner.webp",
     bigImage: "/assets/images/blog/blog-6/blog-6-big-img.webp",
+    category: "Workout",
     shortDesc:
       "Rebuild strength, flexibility, and confidence safely with beginner-friendly workouts at Rapha Rehab in Etobicoke. Tailored programs support rehabilitation and long-term wellness.",
     content: `
@@ -516,10 +522,207 @@ const Blogs = [
       <div class="icon-box"><i class="icon-23"></i></div>
       <p>“Rebuild strength, flexibility, and confidence safely with beginner-friendly workouts guided by expert physiotherapists at Rapha Rehab.”</p>
       <h4>Rapha Rehab – Physiotherapy & Massage Therapy in Etobicoke</h4>
-      <span class="designation">📍 6 - 4335 Bloor Street West, Etobicoke, ON M9C 5J2<br/>📞 647-722-3434<br/>📧 info@rapharehab.ca</span>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
     </blockquote>
   `,
   },
+  {
+    id: 7,
+    slug: "recover-strong-post-surgery-rehabilitation-exercises",
+    title: "Recover Strong: Essential Post-Surgery Rehabilitation Exercises",
+    author: "Admin",
+    date: "15 Sep 2025",
+    comments: "00 Comt",
+    thumbnail: "/assets/images/blog/card/card-blog-1.webp",
+    bannerImage: "/assets/images/blog/blog-7/blog-1-banner.webp",
+    bigImage: "/assets/images/blog/blog-7/blog-1-big-img.webp",
+    category: "Rehab",
+    shortDesc:
+      "Post-surgery rehabilitation exercises are crucial to regain strength, mobility, and function. Learn why guided exercises by physiotherapists at Rapha Rehab are essential for recovery.",
+    content: `
+    <p>Undergoing surgery can be a significant event, and while the procedure itself addresses the immediate problem, the journey to full recovery often continues long after you leave the operating room. Post-surgery rehabilitation exercises are a critical component of this journey, helping you regain strength, mobility, and function. At Rapha Rehab, we understand the importance of a tailored and safe approach to rehabilitation.</p>
+
+    <p>Whether you've had an orthopedic procedure, a general surgery, or anything in between, a well-structured exercise program guided by experienced physiotherapists is key to a successful outcome.</p>
+
+    <h3>Why Are Post-Surgery Exercises So Important?</h3>
+    <p>Many people are eager to get back to their normal activities, but rushing the recovery process or neglecting exercises can lead to setbacks. Here's why rehabilitation exercises are non-negotiable:</p>
+
+    <ul class="list-style-one clearfix mb_40">
+      <li><strong>Restoring Range of Motion:</strong> Surgery can cause stiffness and limit the movement of joints. Specific exercises help gently and progressively restore your natural range of motion.</li>
+      <li><strong>Building Strength:</strong> Muscles often weaken significantly due to inactivity, pain, or the surgery itself. Targeted strengthening exercises are vital to rebuild muscle mass and support the surgical site.</li>
+      <li><strong>Reducing Swelling and Pain:</strong> Gentle movement and elevation can help reduce post-operative swelling, which in turn can decrease pain.</li>
+      <li><strong>Improving Circulation:</strong> Exercise promotes blood flow, which is essential for healing and delivering vital nutrients to the affected area.</li>
+      <li><strong>Preventing Complications:</strong> Regular, guided movement can help prevent complications such as deep vein thrombosis (DVT), muscle atrophy, and scar tissue adhesions.</li>
+      <li><strong>Restoring Function and Independence:</strong> Ultimately, the goal is to get you back to doing the things you love, whether that's walking, gardening, playing sports, or simply performing daily tasks without discomfort.</li>
+    </ul>
+
+    <h3>General Principles of Post-Surgery Rehabilitation</h3>
+    <p>While every rehabilitation plan is unique, some general principles apply:</p>
+
+    <ul class="list-style-one clearfix mb_40">
+      <li><strong>Follow Your Surgeon's and Physiotherapist's Instructions:</strong> This is paramount. They know the specifics of your surgery and your individual recovery timeline.</li>
+      <li><strong>Start Slowly and Progress Gradually:</strong> Don't push too hard, too soon. Listen to your body and increase intensity, duration, or resistance only as advised.</li>
+      <li><strong>Focus on Proper Form:</strong> Incorrect form can be ineffective or even harmful. Your physiotherapist will ensure you're performing exercises correctly.</li>
+      <li><strong>Consistency is Key:</strong> Regular, consistent effort yields the best results.</li>
+      <li><strong>Manage Pain:</strong> It's normal to experience some discomfort, but exercises should not cause sharp or increasing pain. Communicate any pain to your therapist.</li>
+    </ul>
+
+    <h3>Common Types of Post-Surgery Exercises (Examples)</h3>
+    <p>While specific exercises will depend on your surgery, here are some common categories:</p>
+
+    <ul class="list-style-one clearfix mb_40">
+      <li><strong>Gentle Range of Motion Exercises:</strong> These often involve passive or active-assisted movements to gently move a joint through its available range without putting stress on healing tissues.</li>
+      <li><strong>Isometric Exercises:</strong> Contracting a muscle without moving the joint. This is excellent for early strengthening when movement might be restricted or painful.</li>
+      <li><strong>Light Strengthening Exercises:</strong> Using bodyweight, resistance bands, or light weights to gradually rebuild muscle strength.</li>
+      <li><strong>Balance and Proprioception Exercises:</strong> Particularly important after lower limb or spine surgery, these exercises help improve your body's awareness in space and prevent falls.</li>
+      <li><strong>Functional Exercises:</strong> Mimicking daily activities to help you transition back to everyday life.</li>
+    </ul>
+
+    <p><strong>Important Note:</strong> Do NOT attempt any of these exercises without direct guidance from your surgeon or a qualified physiotherapist. This article provides general information only.</p>
+
+    <div class="two-image row clearfix mt-4">
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-7/blog-1-bottom-img-1.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-7/blog-1-bottom-img-2.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+    </div>
+
+    <h3>Your Partner in Recovery: Rapha Rehab</h3>
+    <p>At Rapha Rehab, our experienced physiotherapists specialize in designing personalized post-surgery rehabilitation programs. We work closely with your surgical team to ensure a seamless and effective recovery plan tailored to your specific needs and surgical procedure.</p>
+
+    <p>We'll guide you through each stage of your rehabilitation, from the initial acute phase to regaining full function, ensuring you recover safely and effectively.</p>
+
+    <blockquote>
+      <div class="icon-box"><i class="icon-23"></i></div>
+      <p>“Ready to Start Your Journey Back to Full Health and Function?”</p>
+      <p>Contact Rapha Rehab today to schedule your consultation!</p>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
+    </blockquote>
+  `,
+    meta: {
+      title: "Recover Strong: Essential Post-Surgery Rehabilitation Exercises at Rapha Rehab",
+      description:
+        "Discover how physiotherapy helps reduce back pain, improve mobility, and prevent future injuries. Local solutions in Etobicoke.",
+    },
+  },
+  {
+    id: 8,
+    slug: "benefits-massage-therapy-sports-injuries",
+    title: "The Benefits of Massage Therapy for Sports Injuries",
+    author: "Admin",
+    date: "15 Sep 2025",
+    comments: "00 Comt",
+    thumbnail: "/assets/images/blog/card/card-blog-2.webp",
+    bannerImage: "/assets/images/blog/blog-8/blog-2-banner.webp",
+    bigImage: "/assets/images/blog/blog-8/blog-2-big-img.webp",
+    category: "Rehab",
+    shortDesc:
+      "Massage therapy plays a vital role in the recovery and prevention of sports injuries. Discover how Rapha Rehab helps athletes heal faster and reduce pain through expert massage techniques.",
+    content: `
+    <p>When an athlete experiences a sports injury, the focus is often on immediate relief and a quick return to the game. While rest, ice, and elevation are crucial first steps, a comprehensive recovery plan goes much further. Massage therapy, often viewed as a luxury, is a powerful and proven tool in the rehabilitation of sports injuries, playing a vital role in both healing and prevention.</p>
+
+    <p>At Rapha Rehab, we believe in a holistic approach to sports injury recovery, and our registered massage therapists work alongside our physiotherapists to help athletes get back to peak performance. Here’s a look at the key benefits of incorporating massage therapy into your rehabilitation plan.</p>
+
+    <h3>1. Accelerates Healing and Reduces Swelling</h3>
+    <p>One of the primary benefits of massage is its ability to increase blood flow to the injured area. This improved circulation delivers essential oxygen and nutrients to damaged tissues, which accelerates the healing process and helps flush out inflammatory by-products. This can significantly reduce swelling and bruising, making the area less painful and more receptive to other rehabilitation efforts.</p>
+
+    <h3>2. Reduces Pain and Muscle Soreness</h3>
+    <p>An injury often causes protective muscle spasms around the affected area, leading to pain and tightness. Massage therapy helps to relax these hypertonic muscles, alleviating the tension and pressure that contribute to discomfort. By working through knots and trigger points, a skilled therapist can directly address the source of pain, providing both immediate relief and long-term improvement. This is particularly effective for conditions like muscle strains and tendinitis.</p>
+
+    <h3>3. Restores Range of Motion and Flexibility</h3>
+    <p>After an injury, scar tissue can form around the site, causing stiffness and a limited range of motion. Massage techniques like deep tissue and myofascial release are specifically designed to break down and realign these fibers, preventing adhesions and restoring joint flexibility. This is a critical step in ensuring the athlete can move freely and perform their sport without restriction.</p>
+
+    <h3>4. Breaks Down Scar Tissue</h3>
+    <p>As mentioned above, scar tissue is a natural part of the healing process but can be a major hurdle to full recovery. It's often less pliable than regular muscle tissue, leading to stiffness and a higher risk of re-injury. Focused massage techniques can help to soften and remodel this tissue, making it more flexible and resilient.</p>
+
+    <h3>5. Prevents Future Injuries</h3>
+    <p>Beyond rehabilitation, regular sports massage is an excellent preventative measure. By keeping muscles relaxed, reducing tension, and improving flexibility, it helps to prevent overuse injuries, muscle imbalances, and strains that can sideline an athlete. Many professional athletes incorporate pre- and post-event massage into their training routines for this very reason.</p>
+
+    <div class="two-image row clearfix mt-4">
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-8/blog-2-bottom-img-1.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-8/blog-2-bottom-img-2.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+    </div>
+
+    <h3>Why Choose Rapha Rehab?</h3>
+    <p>Our team of expert massage therapists works in collaboration with our physiotherapists to provide a comprehensive and integrated care plan. We don't just treat the symptoms; we address the root cause of your injury and work with you to develop a personalized treatment strategy that includes both hands-on therapy and a tailored exercise program.</p>
+
+    <blockquote>
+      <div class="icon-box"><i class="icon-23"></i></div>
+      <p>“Ready to Get Back in the Game?”</p>
+      <h4>Contact us today to schedule a massage therapy session tailored to your sports injury recovery.</h4>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
+    </blockquote>
+  `,
+    meta: {
+      title: "Enhance Your Recovery: The Benefits of Massage Therapy for Sports Injuries at Rapha Rehab",
+      description:
+        "Nervous about your first physio visit? Learn what happens during your assessment, treatment, and next steps at our Etobicoke clinic.",
+    },
+  },
+  {
+    id: 9,
+    slug: "shockwave-therapy-etobicoke-chronic-pain",
+    title: "Shockwave Therapy in Etobicoke: Does It Really Work for Chronic Pain?",
+    author: "Admin",
+    date: "15 Sep 2025",
+    comments: "00 Comt",
+    thumbnail: "/assets/images/blog/card/card-blog-3.webp",
+    bannerImage: "/assets/images/blog/blog-9/blog-3-banner.webp",
+    bigImage: "/assets/images/blog/blog-9/blog-3-big-img.webp",
+    category: "Rehab",
+    shortDesc:
+      "Shockwave therapy can reduce pain, speed healing, and treat chronic tendon injuries. Discover how Rapha Rehab in Etobicoke uses this innovative therapy to help patients recover.",
+    content: `
+    <p>For patients struggling with stubborn injuries that don’t respond to traditional therapy, shockwave treatment is becoming a popular option. But does it really work?</p>
+
+    <h3>What Is Shockwave Therapy?</h3>
+    <p>Shockwave therapy is a non-invasive treatment that uses high-energy sound waves to stimulate healing in injured tissues. It’s especially effective for conditions caused by overuse and chronic strain.</p>
+
+    <h3>Conditions It Treats</h3>
+    <ul class="list-style-one clearfix mb_40">
+      <li><strong>Plantar Fasciitis:</strong> Heel pain from inflamed foot tissue.</li>
+      <li><strong>Tennis Elbow & Shoulder Pain:</strong> Repetitive strain injuries.</li>
+      <li><strong>Chronic Tendon Injuries:</strong> Such as Achilles tendinopathy.</li>
+    </ul>
+
+    <h3>How the Treatment Works</h3>
+    <p>The sound waves increase blood flow and break down scar tissue, allowing the body to heal naturally. Many patients report pain reduction after just a few sessions.</p>
+
+    <h3>What to Expect During a Session</h3>
+    <p>Sessions are short — usually 10–15 minutes — and most patients need 3–6 treatments. You may feel mild discomfort during the procedure, but no downtime is required.</p>
+
+    <div class="two-image row clearfix mt-4">
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-9/blog-3-bottom-img-1.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+      <div class="col-lg-6 col-md-6 col-sm-12 image-column">
+        <figure class="image mb_30"><img src="/assets/images/blog/blog-9/blog-3-bottom-img-2.webp" alt="Beginner-Friendly Workouts for Rehab & Wellness at Rapha Rehab Etobicoke"/></figure>
+      </div>
+    </div>
+
+    <h3>Is Shockwave Right for You?</h3>
+    <p>If you’ve tried rest, medication, or standard physiotherapy without results, shockwave therapy could be the next step.</p>
+
+    <p>Book a consultation at Rapha Rehab in Etobicoke to see if this treatment can help you. Call 416-622-2873 or request an appointment online.</p>
+
+    <blockquote>
+      <div class="icon-box"><i class="icon-23"></i></div>
+      <p>“Book a consultation at Rapha Rehab in Etobicoke to see if this treatment can help you. Call 416-622-2873 or request an appointment online.”</p>
+      <span class="designation"> 6 - 4335 Bloor Street West, Etobicoke, M9C5S2<br/> 647-722-3434<br/>bloor@rapharehab.ca</span>
+    </blockquote>
+  `,
+    meta: {
+      title: "Shockwave Therapy in Etobicoke: Does It Really Work for Chronic Pain?",
+      description:
+        "Find out how shockwave therapy reduces pain, speeds healing, and helps with tendon injuries at our Etobicoke clinic.",
+    },
+  },
 ];
 
 export default Blogs;