Almost updated

This commit is contained in:
mukesh13
2025-08-13 20:21:20 +05:30
parent c6629e4daa
commit a286215d0f
31 changed files with 1163 additions and 665 deletions

View File

@ -1,149 +1,131 @@
import React from "react";
import Image from "next/image";
import { counterItems5 } from "@/data/facts";
import OdometerComponent from "../common/OdometerComponent";
export default function About() {
return (
<>
{/* .section-about */}
<div className="text-with-img-2 tf-spacing-4">
<div className="tf-container">
<div className="row">
<div className="col-lg-6">
<div className="wrap-img">
<div className="shape-img-bg shape-border">
<Image
alt="shape"
className="img-custom-anim-left wow"
src="/images/section/img-with-shape-3.jpg"
width={692}
height={543}
/>
<div className="img-bg-shape">
<svg
xmlns="http://www.w3.org/2000/svg"
x="0px"
y="0px"
viewBox="0 0 288 288"
>
<linearGradient
id="imagewave-1"
x1="70.711%"
x2="0%"
y1="70.711%"
y2="0%"
{/* Section 1: Trusted BPO Partner */}
<div className="bg-color-1">
<div className="text-with-img-2 tf-spacing-47">
<div className="tf-container">
<div className="row">
<div className="col-lg-6">
<div className="wrap-img">
<div className="shape-img-bg shape-border">
<Image
alt="Trusted BPO Partner"
className="img-custom-anim-left wow"
src="/images/section/img-with-shape-3.jpg"
width={692}
height={543}
/>
<div className="img-bg-shape">
<svg
xmlns="http://www.w3.org/2000/svg"
x="0px"
y="0px"
viewBox="0 0 288 288"
>
<stop
className="stop-color"
offset="0%"
stopOpacity={1}
/>
<stop
className="stop-color"
offset="100%"
stopOpacity={1}
/>
</linearGradient>
<path fill="url(#imagewave-1)" d="">
<animate
repeatCount="indefinite"
attributeName="d"
dur="5s"
values="M37.5,186c-12.1-10.5-11.8-32.3-7.2-46.7c4.8-15,13.1-17.8,30.1-36.7C91,68.8,83.5,56.7,103.4,45
c22.2-13.1,51.1-9.5,69.6-1.6c18.1,7.8,15.7,15.3,43.3,33.2c28.8,18.8,37.2,14.3,46.7,27.9c15.6,22.3,6.4,53.3,4.4,60.2
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z;
M51,171.3c-6.1-17.7-15.3-17.2-20.7-32c-8-21.9,0.7-54.6,20.7-67.1c19.5-12.3,32.8,5.5,67.7-3.4C145.2,62,145,49.9,173,43.4
c12-2.8,41.4-9.6,60.2,6.6c19,16.4,16.7,47.5,16,57.7c-1.7,22.8-10.3,25.5-9.4,46.4c1,22.5,11.2,25.8,9.1,42.6
c-2.2,17.6-16.3,37.5-33.5,40.8c-22,4.1-29.4-22.4-54.9-22.6c-31-0.2-40.8,39-68.3,35.7c-17.3-2-32.2-19.8-37.3-34.8
C48.9,198.6,57.8,191,51,171.3z;
M37.5,186c-12.1-10.5-11.8-32.3-7.2-46.7c4.8-15,13.1-17.8,30.1-36.7C91,68.8,83.5,56.7,103.4,45
c22.2-13.1,51.1-9.5,69.6-1.6c18.1,7.8,15.7,15.3,43.3,33.2c28.8,18.8,37.2,14.3,46.7,27.9c15.6,22.3,6.4,53.3,4.4,60.2
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z "
/>
</path>
</svg>
<linearGradient
id="imagewave-1"
x1="70.711%"
x2="0%"
y1="70.711%"
y2="0%"
>
<stop
className="stop-color"
offset="0%"
stopOpacity={1}
/>
<stop
className="stop-color"
offset="100%"
stopOpacity={1}
/>
</linearGradient>
<path fill="url(#imagewave-1)" d="">
<animate
repeatCount="indefinite"
attributeName="d"
dur="5s"
values="M37.5,186c-12.1-10.5-11.8-32.3-7.2-46.7c4.8-15,13.1-17.8,30.1-36.7C91,68.8,83.5,56.7,103.4,45
c22.2-13.1,51.1-9.5,69.6-1.6c18.1,7.8,15.7,15.3,43.3,33.2c28.8,18.8,37.2,14.3,46.7,27.9c15.6,22.3,6.4,53.3,4.4,60.2
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z;
M51,171.3c-6.1-17.7-15.3-17.2-20.7-32c-8-21.9,0.7-54.6,20.7-67.1c19.5-12.3,32.8,5.5,67.7-3.4C145.2,62,145,49.9,173,43.4
c12-2.8,41.4-9.6,60.2,6.6c19,16.4,16.7,47.5,16,57.7c-1.7,22.8-10.3,25.5-9.4,46.4c1,22.5,11.2,25.8,9.1,42.6
c-2.2,17.6-16.3,37.5-33.5,40.8c-22,4.1-29.4-22.4-54.9-22.6c-31-0.2-40.8,39-68.3,35.7c-17.3-2-32.2-19.8-37.3-34.8
C48.9,198.6,57.8,191,51,171.3z;
M37.5,186c-12.1-10.5-11.8-32.3-7.2-46.7c4.8-15,13.1-17.8,30.1-36.7C91,68.8,83.5,56.7,103.4,45
c22.2-13.1,51.1-9.5,69.6-1.6c18.1,7.8,15.7,15.3,43.3,33.2c28.8,18.8,37.2,14.3,46.7,27.9c15.6,22.3,6.4,53.3,4.4,60.2
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z"
/>
</path>
</svg>
</div>
</div>
</div>
</div>
</div>
<div className="col-lg-6">
<div className="content mb-0">
<h2 className="title split-text split-lines-rotation-x">
Innovate to streamline operations
<br />
and accelerate growth.
</h2>
<p
className="description text-body-1 text_mono-gray-7 description-1 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
We are committed to driving innovation and delivering
cutting-edge software solutions. Our team of skilled
developers and industry experts collaborate closely to create
tailored solutions that address the unique needs of our
clients.
</p>
<p
className="description text-body-1 text_mono-gray-7 description-2 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
By leveraging the latest technologies and industry best
practices, we empower our clients to streamline their
operations, reduce costs, and achieve sustainable business
growth. Our innovative software solutions are designed to
increase efficiency, improve productivity, and enhance overall
business performance.
</p>
<div className="col-lg-6">
<div className="content mb-0">
<h2 className="title split-text split-lines-rotation-x">
Trusted BPO Partner
<br />
for Global Excellence
</h2>
<p
className="description text-body-1 text_mono-gray-7 description-1 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
At Keystone Solution, we combine technology, expertise, and innovation to deliver world-class BPO services to clients across the globe. As a trusted outsourcing partner to diverse industries, we provide end-to-end solutions that help businesses operate smarter, faster, and more efficiently.
</p>
<p
className="description text-body-1 text_mono-gray-7 description-2 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
Our strength lies in our ability to deliver consistent, scalable, and reliable servicespowered by cutting-edge technology and a highly skilled team. We are committed to excellence, ensuring every project meets the highest standards of quality and precision.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
{/* /.section-about */}
{/* .section-about */}
<div className="text-with-img-2 tf-spacing-5 pt-0">
{/* Section 2: Specialized Data Solutions */}
<div className="text-with-img-2 tf-spacing-47 pt-0">
<div className="tf-container">
<div className="row">
<div className="col-xl-6">
<div className="content">
<div className="col-lg-6">
<div className="content mb-0">
<h2 className="title split-text split-lines-rotation-x">
Innovate to streamline operations
Specialized Data Solutions
<br />
and accelerate growth.
for Business Growth
</h2>
<p
className="description text-body-1 text_mono-gray-7 description-1 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
We are committed to driving innovation and delivering
cutting-edge software solutions. Our team of skilled
developers and industry experts collaborate closely to create
tailored solutions that address the unique needs of our
clients.
At Keystone Solution, we specialize in delivering top-quality outsourcing solutions that help businesses across India work smarter and faster. With a strong focus on precision, speed, and reliability, we take the hassle out of data management so our clients can concentrate on growing their business.
</p>
<p
className="description text-body-1 text_mono-gray-7 description-2 wow animate__fadeInUp animate__animated"
data-wow-delay="0s"
>
By leveraging the latest technologies and industry best
practices, we empower our clients to streamline their
operations, reduce costs, and achieve sustainable business
growth. Our innovative software solutions are designed to
increase efficiency, improve productivity, and enhance overall
business performance.
Our expertise covers a wide spectrum of services, including data entry, data conversion, and data processing, as well as specialized receipt data entry and logistics data entry. By combining our skilled team with the latest technology, we deliver results that are not only error-free but also on timeevery time.
</p>
</div>
</div>
<div className="col-xl-6">
<div className="wrap-img mb-0">
<div className="shape-img-bg">
<div className="col-lg-6">
<div className="wrap-img">
<div className="shape-img-bg shape-border">
<Image
alt="shape"
alt="Specialized Data Solutions"
className="img-custom-anim-right wow"
src="/images/section/img-with-shape-4.jpg"
width={695}
@ -157,7 +139,7 @@ export default function About() {
viewBox="0 0 288 288"
>
<linearGradient
id="imagewave"
id="imagewave-2"
x1="70.711%"
x2="0%"
y1="70.711%"
@ -174,7 +156,7 @@ export default function About() {
stopOpacity={1}
/>
</linearGradient>
<path fill="url(#imagewave)" d="">
<path fill="url(#imagewave-2)" d="">
<animate
repeatCount="indefinite"
attributeName="d"
@ -184,7 +166,6 @@ export default function About() {
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z;
M51,171.3c-6.1-17.7-15.3-17.2-20.7-32c-8-21.9,0.7-54.6,20.7-67.1c19.5-12.3,32.8,5.5,67.7-3.4C145.2,62,145,49.9,173,43.4
c12-2.8,41.4-9.6,60.2,6.6c19,16.4,16.7,47.5,16,57.7c-1.7,22.8-10.3,25.5-9.4,46.4c1,22.5,11.2,25.8,9.1,42.6
c-2.2,17.6-16.3,37.5-33.5,40.8c-22,4.1-29.4-22.4-54.9-22.6c-31-0.2-40.8,39-68.3,35.7c-17.3-2-32.2-19.8-37.3-34.8
@ -193,7 +174,7 @@ export default function About() {
M37.5,186c-12.1-10.5-11.8-32.3-7.2-46.7c4.8-15,13.1-17.8,30.1-36.7C91,68.8,83.5,56.7,103.4,45
c22.2-13.1,51.1-9.5,69.6-1.6c18.1,7.8,15.7,15.3,43.3,33.2c28.8,18.8,37.2,14.3,46.7,27.9c15.6,22.3,6.4,53.3,4.4,60.2
c-3.3,11.2-7.1,23.9-18.5,32c-16.3,11.5-29.5,0.7-48.6,11c-16.2,8.7-12.6,19.7-28.2,33.2c-22.7,19.7-63.8,25.7-79.9,9.7
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z "
c-15.2-15.1,0.3-41.7-16.6-54.9C63,186,49.7,196.7,37.5,186z"
/>
</path>
</svg>
@ -202,31 +183,8 @@ export default function About() {
</div>
</div>
</div>
<div className="wrap-counter style-4">
<div className="row">
{counterItems5.map((item, index) => (
<div key={index} className="col-md-4">
<div className="counter-item style-default">
<div className="sub-heading text_black text-uppercase mb_22">
{item.title}
</div>
<div className="counter-number">
<div className="odometer text_primary mb_15">
<OdometerComponent max={item.value} />
</div>
<span className="sub text_primary">{item.unit}</span>
</div>
<p
className="sub-heading text_mono-gray-5"
dangerouslySetInnerHTML={{ __html: item.description }}
/>
</div>
</div>
))}
</div>
</div>
</div>
</div>
</>
);
}
}