145 lines
5.1 KiB
JavaScript
145 lines
5.1 KiB
JavaScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import React from "react";
|
|
|
|
export default function AboutSection() {
|
|
return (
|
|
<section className="about-style-two pt_90 pb_90 relative overflow-hidden">
|
|
{/* Pattern Layers with fixed sizes */}
|
|
<div className="pattern-layer">
|
|
<div className="pattern-1 rotate-me absolute w-[120px] h-[120px]">
|
|
<Image
|
|
src="/assets/images/shape/shape-8.webp"
|
|
alt="Decorative shape"
|
|
fill
|
|
sizes="120px"
|
|
style={{ objectFit: "contain" }}
|
|
priority={false}
|
|
/>
|
|
</div>
|
|
|
|
<div className="pattern-2 rotate-me absolute w-[140px] h-[140px]">
|
|
<Image
|
|
src="/assets/images/shape/shape-9.webp"
|
|
alt="Decorative shape"
|
|
fill
|
|
sizes="140px"
|
|
style={{ objectFit: "contain" }}
|
|
/>
|
|
</div>
|
|
|
|
<div className="pattern-3 absolute w-[150px] h-[150px]">
|
|
<Image
|
|
src="/assets/images/shape/shape-11.webp"
|
|
alt="Decorative shape"
|
|
fill
|
|
sizes="150px"
|
|
style={{ objectFit: "contain" }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="auto-container">
|
|
<div className="row clearfix">
|
|
{/* Image Column */}
|
|
<div className="col-lg-6 col-md-12 col-sm-12 image-column">
|
|
<div className="image_block_one relative">
|
|
<div className="image-box relative">
|
|
{/* Background Shape */}
|
|
<div className="image-shape absolute inset-0 -z-10 w-[600px] h-[500px]">
|
|
<Image
|
|
src="/assets/images/shape/shape-26.webp"
|
|
alt="Background shape"
|
|
fill
|
|
sizes="50vw"
|
|
style={{ objectFit: "contain" }}
|
|
/>
|
|
</div>
|
|
|
|
{/* Main Hero Image (LCP) */}
|
|
<figure className="image-2 relative min-h-[420px]">
|
|
<Image
|
|
src="/assets/images/home/welcome/home-welcome.webp"
|
|
alt="Physiotherapy"
|
|
width={600}
|
|
height={420}
|
|
priority
|
|
sizes="(max-width: 768px) 100vw, 50vw"
|
|
placeholder="blur"
|
|
blurDataURL="/assets/images/home/welcome/home-welcome-blur.webp"
|
|
style={{
|
|
borderRadius: "8px",
|
|
width: "100%",
|
|
height: "auto",
|
|
}}
|
|
/>
|
|
</figure>
|
|
|
|
{/* Top Icon */}
|
|
<div className="icon-one absolute top-0 left-0 w-[40px] h-[40px]">
|
|
<Image
|
|
src="/assets/images/home/welcome/top-icon.webp"
|
|
alt="Top decorative icon"
|
|
fill
|
|
sizes="40px"
|
|
style={{ objectFit: "contain" }}
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
|
|
{/* Bottom Icon */}
|
|
<div className="icon-two absolute bottom-0 right-0 w-[40px] h-[40px]">
|
|
<Image
|
|
src="/assets/images/home/welcome/bottom-icon.webp"
|
|
alt="Bottom decorative icon"
|
|
fill
|
|
sizes="40px"
|
|
style={{ objectFit: "contain" }}
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Content Column */}
|
|
<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="sec-title mb_15">
|
|
<span className="sub-title">Welcome to Rapha Rehab</span>
|
|
<h2>Your Trusted Etobicoke Physiotherapy Clinic!</h2>
|
|
</div>
|
|
|
|
<div className="text-box mb_40">
|
|
<p>
|
|
At Rapha Rehab, we specialize in evidence-based
|
|
physiotherapy tailored to your needs. Our expert care helps
|
|
you recover, relieve pain, and regain strength for a better
|
|
quality of life.
|
|
</p>
|
|
<ul className="list-style-one clearfix">
|
|
<li>Chronic pain (back, neck, joints).</li>
|
|
<li>Sports injuries (sprains, strains, post-surgery rehab).</li>
|
|
<li>Work-related injuries (WCB claims supported).</li>
|
|
<li>Movement disorders (stroke rehab, mobility issues).</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div className="btn-box">
|
|
<Link
|
|
href="/etobicoke-treatment-service"
|
|
className="theme-btn btn-one"
|
|
>
|
|
<span>Explore Our Service</span>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|