Almost updated
This commit is contained in:
mukesh13
@ -1,61 +1,58 @@
|
||||
import Contact from "@/components/common/Contact";
|
||||
import Faqs from "@/components/common/Faqs";
|
||||
import Testimonials from "@/components/common/Testimonials";
|
||||
import Footer1 from "@/components/footers/Footer1";
|
||||
import Header1 from "@/components/headers/Header1";
|
||||
import Footer3 from "@/components/footers/Footer3";
|
||||
import Header4 from "@/components/headers/Header4";
|
||||
import About from "@/components/otherPages/About";
|
||||
import Process from "@/components/otherPages/Process";
|
||||
import Team from "@/components/otherPages/Team";
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
|
||||
export const metadata = {
|
||||
title:
|
||||
"About || Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
title: "About || Keystone Solutions",
|
||||
description:
|
||||
"Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
"Keystone Solutions - Your trusted BPO partner for global excellence and specialized data solutions",
|
||||
};
|
||||
|
||||
export default function AboutPage() {
|
||||
return (
|
||||
<>
|
||||
<div className="wrap-page-header">
|
||||
<Header1 />
|
||||
<div className="page-title style-default">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="heading mb_51">
|
||||
<h1 className="text_black mb_16 letter-spacing-1">
|
||||
Play a key role in <br />
|
||||
business advancement
|
||||
</h1>
|
||||
<p className="sub-heading text_mono-gray-7">
|
||||
Promote innovation by introducing breakthrough ideas and
|
||||
technologies <br />
|
||||
to improve business and customer experience.
|
||||
</p>
|
||||
</div>
|
||||
<ul className="breadcrumb">
|
||||
<li>
|
||||
<Link href={`/`} className="link">
|
||||
<div className="primary-3">
|
||||
<div className="wrap-page-header">
|
||||
<Header4 />
|
||||
|
||||
{/* Page Title Section */}
|
||||
<section className="page-title tf-spacing-47 bg-color-1">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
{/* Breadcrumb */}
|
||||
<div className="breadcrumb-trail mb-3">
|
||||
<Link href="/" className="home-link text-body-2 text-dark">
|
||||
Home
|
||||
</Link>
|
||||
</li>
|
||||
<li>About us</li>
|
||||
</ul>
|
||||
<span className="separator text-body-2 mx-2">></span>
|
||||
<span className="current-page text-body-2 text-primary">About Us</span>
|
||||
</div>
|
||||
|
||||
{/* Page Title */}
|
||||
<div className="page-title-content">
|
||||
<h1 className="page-title-main display-4 mb-3">
|
||||
About Keystone Solutions
|
||||
</h1>
|
||||
<p className="page-subtitle text-body-1 mb-0">
|
||||
Discover our journey, mission, and commitment to delivering
|
||||
world-class business process outsourcing solutions.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="main-content style-1">
|
||||
<About />
|
||||
</div>
|
||||
</div>
|
||||
<div className="main-content style-1">
|
||||
<About />
|
||||
<Team />
|
||||
<Process />
|
||||
<Testimonials />
|
||||
<Faqs parentClass="section-faqs style-1 tf-spacing-8" />
|
||||
<Contact />
|
||||
</div>
|
||||
<Footer1 />
|
||||
|
||||
<Footer3 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,56 +1,62 @@
|
||||
// CareerPage Component
|
||||
import Contact from "@/components/common/Contact";
|
||||
|
||||
import Footer1 from "@/components/footers/Footer1";
|
||||
import Header1 from "@/components/headers/Header1";
|
||||
import Benefits from "@/components/otherPages/Benefits";
|
||||
import Footer3 from "@/components/footers/Footer3";
|
||||
import Header4 from "@/components/headers/Header4";
|
||||
import Careerform from "@/components/common/Careerform";
|
||||
import Oppertunities from "@/components/otherPages/Oppertunities";
|
||||
import Link from "next/link";
|
||||
|
||||
import React from "react";
|
||||
|
||||
export const metadata = {
|
||||
title:
|
||||
"Career || Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
title: "Career || Keystone Solutions",
|
||||
description:
|
||||
"Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
"Join our team at Keystone Solutions and build your career in business process outsourcing and data solutions",
|
||||
};
|
||||
|
||||
export default function CareerPage() {
|
||||
return (
|
||||
<>
|
||||
<div className="wrap-page-header">
|
||||
<Header1 />
|
||||
<div className="page-title style-default">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="heading mb_51">
|
||||
<h1 className="text_black mb_18 letter-spacing-1">Career</h1>
|
||||
<p className="sub-heading text_mono-gray-7">
|
||||
A typical day is a mix of strategic thinking,
|
||||
problem-solving, and client interaction. The work is
|
||||
demanding <br />
|
||||
but rewarding, offering opportunities to tackle complex
|
||||
challenges and drive positive change.
|
||||
</p>
|
||||
</div>
|
||||
<ul className="breadcrumb">
|
||||
<li>
|
||||
<Link href={`/`} className="link">
|
||||
<div className="primary-3 bg-color-1">
|
||||
<div className="wrap-page-header">
|
||||
<Header4 />
|
||||
|
||||
{/* Page Title Section */}
|
||||
<section className="page-title tf-spacing-47 bg-color-1">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
{/* Breadcrumb */}
|
||||
<div className="breadcrumb-trail mb-3">
|
||||
<Link href="/" className="home-link text-body-2 text-dark">
|
||||
Home
|
||||
</Link>
|
||||
</li>
|
||||
<li>Career</li>
|
||||
</ul>
|
||||
<span className="separator text-body-2 mx-2">></span>
|
||||
<span className="current-page text-body-2 text-primary">Career</span>
|
||||
</div>
|
||||
|
||||
{/* Page Title */}
|
||||
{/* Page Title */}
|
||||
<div className="page-title-content">
|
||||
<h1 className="page-title-main display-4 mb-3">
|
||||
Career
|
||||
</h1>
|
||||
<p className="page-subtitle text-body-1 mb-0">
|
||||
Join our team to take on meaningful challenges, grow your skills, and make an impact.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="main-content">
|
||||
<Careerform />
|
||||
</div>
|
||||
</div>
|
||||
<div className="main-content style-1">
|
||||
<Benefits />
|
||||
<Oppertunities />
|
||||
<Contact />
|
||||
</div>
|
||||
<Footer1 />
|
||||
|
||||
<Footer3 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -1,27 +1,59 @@
|
||||
// ContactUsPage
|
||||
import Footer3 from "@/components/footers/Footer3";
|
||||
import Header4 from "@/components/headers/Header4";
|
||||
import Contact from "@/components/otherPages/Contact";
|
||||
// import OfficeLocations from "@/components/otherPages/OfficeLocations";
|
||||
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
|
||||
export const metadata = {
|
||||
title:
|
||||
"Contact Us || Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
title: "Contact Us || Keystone Solutions",
|
||||
description:
|
||||
"Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
"Get in touch with Keystone Solutions for all your business process outsourcing needs and data solutions",
|
||||
};
|
||||
|
||||
export default function ContactUsPage() {
|
||||
return (
|
||||
<>
|
||||
<div className="wrap-page-header">
|
||||
<Header4 />
|
||||
<div className="primary-3 bg-color-1">
|
||||
<div className="wrap-page-header">
|
||||
<Header4 />
|
||||
|
||||
<Contact />
|
||||
{/* Page Title Section */}
|
||||
<section className="page-title tf-spacing-47 bg-color-1">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
{/* Breadcrumb */}
|
||||
<div className="breadcrumb-trail mb-3">
|
||||
<Link href="/" className="home-link text-body-2 text-dark">
|
||||
Home
|
||||
</Link>
|
||||
<span className="separator text-body-2 mx-2">></span>
|
||||
<span className="current-page text-body-2 text-primary">Contact Us</span>
|
||||
</div>
|
||||
|
||||
{/* Page Title */}
|
||||
<div className="page-title-content">
|
||||
<h1 className="page-title-main display-4 mb-3">
|
||||
Contact Us
|
||||
</h1>
|
||||
<p className="page-subtitle text-body-1 mb-0">
|
||||
Get in touch with our team to discuss your business needs and
|
||||
discover how we can help you achieve your goals.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="main-content">
|
||||
<Contact />
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="main-content style-1">
|
||||
<OfficeLocations />
|
||||
</div> */}
|
||||
|
||||
<Footer3 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,61 +1,67 @@
|
||||
import Contact from "@/components/common/Contact";
|
||||
import Faqs from "@/components/common/Faqs";
|
||||
import Pricing from "@/components/common/Pricing";
|
||||
|
||||
import Testimonials from "@/components/common/Testimonials";
|
||||
import Footer1 from "@/components/footers/Footer1";
|
||||
import Header1 from "@/components/headers/Header1";
|
||||
import Footer3 from "@/components/footers/Footer3";
|
||||
import Header4 from "@/components/headers/Header4";
|
||||
import Link from "next/link";
|
||||
import ServiceDetails from "@/components/otherPages/ServiceDetails";
|
||||
export const metadata = {
|
||||
title:
|
||||
"Service Details || Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
description:
|
||||
"Advitex - Finance and Business Consulting React Nextjs Template",
|
||||
};
|
||||
import React from "react";
|
||||
import { allServices } from "@/data/services";
|
||||
|
||||
export const metadata = {
|
||||
title: "Service Details || Keystone Solutions",
|
||||
description:
|
||||
"Explore our comprehensive business process outsourcing services and data solutions at Keystone Solutions",
|
||||
};
|
||||
|
||||
export default async function ServiceDetailsPage({ params }) {
|
||||
const { id } = await params;
|
||||
|
||||
const service = allServices.filter((p) => p.id == id)[0] || allServices[0];
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="wrap-page-header">
|
||||
<Header1 />
|
||||
<div className="page-title style-default">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="heading mb_43">
|
||||
<h1
|
||||
className="text_black letter-spacing-1"
|
||||
dangerouslySetInnerHTML={{ __html: service.title }}
|
||||
></h1>
|
||||
</div>
|
||||
<ul className="breadcrumb">
|
||||
<li>
|
||||
<Link href={`/`} className="link">
|
||||
<div className="primary-3">
|
||||
<div className="wrap-page-header">
|
||||
<Header4 />
|
||||
|
||||
{/* Page Title Section */}
|
||||
<section className="page-title tf-spacing-47">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
{/* Breadcrumb */}
|
||||
<div className="breadcrumb-trail mb-3">
|
||||
<Link href="/" className="home-link text-body-2">
|
||||
Home
|
||||
</Link>
|
||||
</li>
|
||||
<li>Services</li>
|
||||
<li dangerouslySetInnerHTML={{ __html: service.title }}></li>
|
||||
</ul>
|
||||
<span className="separator text-body-2 mx-2">></span>
|
||||
<span className="text-body-2">Services</span>
|
||||
<span className="separator text-body-2 mx-2">></span>
|
||||
<span
|
||||
className="current-page text-body-2"
|
||||
dangerouslySetInnerHTML={{ __html: service.title }}
|
||||
></span>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="main-content style-1">
|
||||
<ServiceDetails service={service} />
|
||||
{/* <Pricing parentClass="section tf-spacing-13" />
|
||||
<Testimonials />
|
||||
<Faqs parentClass="section-faqs style-1 tf-spacing-8" />
|
||||
<Contact /> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="main-content style-1">
|
||||
<ServiceDetails />
|
||||
<Pricing parentClass="section tf-spacing-13" />
|
||||
<Testimonials />
|
||||
<Faqs parentClass="section-faqs style-1 tf-spacing-8" />
|
||||
<Contact />
|
||||
</div>
|
||||
<Footer1 />
|
||||
|
||||
<Footer3 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
30
app/page.jsx
30
app/page.jsx
@ -1,9 +1,7 @@
|
||||
import Header4 from "@/components/headers/Header4";
|
||||
import About from "@/components/homes/insurance-consulting/About";
|
||||
// import Approach from "@/components/homes/insurance-consulting/Approach";
|
||||
// import Blogs from "@/components/homes/insurance-consulting/Blogs";
|
||||
// import CaseStudies from "@/components/homes/insurance-consulting/CaseStudies";
|
||||
import Contact from "@/components/common/Contact";
|
||||
|
||||
import Contact from "../components/common/Contact";
|
||||
// import Cta from "@/components/homes/insurance-consulting/Cta";
|
||||
import Testimonials from "@/components/common/Testimonials";
|
||||
// import Faqs from "@/components/homes/insurance-consulting/Faqs";
|
||||
@ -25,18 +23,18 @@ export default function HomePage() {
|
||||
<Header4 />
|
||||
<Hero />
|
||||
<div className="main-content">
|
||||
<Services />
|
||||
<section id="services">
|
||||
<Services />
|
||||
</section>
|
||||
<div className="tf-container tf-spacing-47">
|
||||
<div className="divider" />
|
||||
<div />
|
||||
</div>
|
||||
<About />
|
||||
<div className="tf-container tf-spacing-47">
|
||||
<div className="divider" />
|
||||
</div>
|
||||
<Testimonials />
|
||||
<div className="tf-container tf-spacing-47">
|
||||
<div className="divider" />
|
||||
<div />
|
||||
</div>
|
||||
|
||||
|
||||
<Contact />
|
||||
{/* <div className="tf-container tf-spacing-32">
|
||||
<div className="divider" />
|
||||
@ -49,16 +47,14 @@ export default function HomePage() {
|
||||
<div className="tf-container tf-spacing-33">
|
||||
<div className="divider" />
|
||||
</div>
|
||||
<Blogs />
|
||||
<div className="tf-container tf-spacing-34">
|
||||
<div className="divider" />
|
||||
<Blogs />*/}
|
||||
<div className="tf-container tf-spacing-47">
|
||||
<div />
|
||||
</div>
|
||||
<Faqs />
|
||||
<Cta /> */}
|
||||
<Footer3 />
|
||||
</div>{" "}
|
||||
</div>
|
||||
</div>
|
||||
<Footer3 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
222
components/common/Careerform.jsx
Normal file
222
components/common/Careerform.jsx
Normal file
@ -0,0 +1,222 @@
|
||||
"use client";
|
||||
import React, { useState } from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function Careerform() {
|
||||
const [formData, setFormData] = useState({
|
||||
fullName: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
roles: '',
|
||||
resume: null
|
||||
});
|
||||
const [uploadStatus, setUploadStatus] = useState('');
|
||||
|
||||
const handleInputChange = (e) => {
|
||||
const { id, value } = e.target;
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
[id]: value
|
||||
}));
|
||||
};
|
||||
|
||||
const handleFileUpload = (e) => {
|
||||
const file = e.target.files[0];
|
||||
if (file) {
|
||||
// Validate file type
|
||||
const allowedTypes = ['.pdf', '.doc', '.docx'];
|
||||
const fileExtension = '.' + file.name.split('.').pop().toLowerCase();
|
||||
|
||||
if (!allowedTypes.includes(fileExtension)) {
|
||||
setUploadStatus('Please upload a PDF, DOC, or DOCX file');
|
||||
return;
|
||||
}
|
||||
|
||||
// Validate file size (5MB limit)
|
||||
if (file.size > 5 * 1024 * 1024) {
|
||||
setUploadStatus('File size must be less than 5MB');
|
||||
return;
|
||||
}
|
||||
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
resume: file
|
||||
}));
|
||||
setUploadStatus(`${file.name} uploaded successfully`);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSubmit = (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
// Basic form validation
|
||||
if (!formData.fullName || !formData.email || !formData.phone || !formData.roles) {
|
||||
alert('Please fill in all required fields');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!formData.resume) {
|
||||
alert('Please upload your resume');
|
||||
return;
|
||||
}
|
||||
|
||||
// Here you would typically send the form data to your backend
|
||||
console.log('Form submitted:', formData);
|
||||
|
||||
// Example of how you might handle the form submission
|
||||
const submitData = new FormData();
|
||||
submitData.append('fullName', formData.fullName);
|
||||
submitData.append('email', formData.email);
|
||||
submitData.append('phone', formData.phone);
|
||||
submitData.append('roles', formData.roles);
|
||||
submitData.append('resume', formData.resume);
|
||||
|
||||
// Replace with your actual API endpoint
|
||||
// fetch('/api/submit-application', {
|
||||
// method: 'POST',
|
||||
// body: submitData
|
||||
// }).then(response => {
|
||||
// // Handle response
|
||||
// });
|
||||
|
||||
alert('Application submitted successfully!');
|
||||
|
||||
// Reset form
|
||||
setFormData({
|
||||
fullName: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
roles: '',
|
||||
resume: null
|
||||
});
|
||||
setUploadStatus('');
|
||||
|
||||
// Reset file input
|
||||
const fileInput = document.getElementById('resume-upload');
|
||||
if (fileInput) fileInput.value = '';
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="page-title style-default -mb_11">
|
||||
<div className="section-contact style-default position-relative py-0">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div className="left">
|
||||
<div className="heading">
|
||||
<h2 className="mb_21 text_primary">
|
||||
Ready to join our team? Let's build something amazing together!
|
||||
</h2>
|
||||
</div>
|
||||
<div className="bot">
|
||||
<div className="content mb-0 ">
|
||||
<h6 className="text_primary">+91 90954 50005</h6>
|
||||
<p className="text-body-2 text_primary">
|
||||
Call us for career inquiries
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<form className="form-contact" onSubmit={handleSubmit}>
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="fullName">
|
||||
Full Name*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Full Name"
|
||||
id="fullName"
|
||||
value={formData.fullName}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
<div className="grid-2 gap_24">
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="email">
|
||||
Email Address*
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
placeholder="Your email address*"
|
||||
id="email"
|
||||
value={formData.email}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="phone">
|
||||
Phone Number*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Your phone number"
|
||||
id="phone"
|
||||
value={formData.phone}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
</div>
|
||||
<fieldset className="">
|
||||
<label className="mb_15" htmlFor="roles">
|
||||
Roles of Interest*
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="e.g., Frontend Developer, UI/UX Designer, Project Manager"
|
||||
id="roles"
|
||||
value={formData.roles}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
|
||||
{/* File Upload Section */}
|
||||
<div className="file-upload-section mt_20">
|
||||
<label className="link attachment" htmlFor="resume-upload" style={{ cursor: 'pointer' }}>
|
||||
<i className="icon-paperclip-solid" />
|
||||
{formData.resume ? `Selected: ${formData.resume.name}` : 'Upload CV*'}
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
id="resume-upload"
|
||||
accept=".pdf,.doc,.docx"
|
||||
onChange={handleFileUpload}
|
||||
style={{ display: 'none' }}
|
||||
required
|
||||
/>
|
||||
{uploadStatus && (
|
||||
<p className={`upload-status mt_10 ${uploadStatus.includes('successfully') ? 'text-success' : 'text-danger'}`}>
|
||||
{uploadStatus}
|
||||
</p>
|
||||
)}
|
||||
<small className="text-muted d-block mt_5">
|
||||
Accepted formats: PDF, DOC, DOCX (Max size: 5MB)
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<button type="submit" className="tf-btn btn-primary2 mt_22">
|
||||
<span>Submit Application</span>
|
||||
<span className="bg-effect" />
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="shape position-absolute">
|
||||
<Image
|
||||
alt="item"
|
||||
src="/images/item/shape-5.png"
|
||||
width={1105}
|
||||
height={720}
|
||||
/>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -2,43 +2,54 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function Contact() {
|
||||
return (
|
||||
<div className="section-contact style-default position-relative">
|
||||
<div className="tf-container">
|
||||
<div className="section-contact style-default position-relative" style={{ paddingLeft: "30px", paddingRight: "30px" }}>
|
||||
<div className="tf-container-2" style={{ padding:"30px", background: "linear-gradient(89.8deg, #ff3a2d -0.43%, #ffa13f 100.84%)", borderRadius: "26px" }}>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div className="left">
|
||||
<div className="heading">
|
||||
<div className="h1 split-text split-lines-rotation-x">
|
||||
Success is a team play, right? Let's work together!
|
||||
<div className="h1 split-text split-lines-rotation-x text-white">
|
||||
Let's Start Building Solutions Together
|
||||
</div>
|
||||
</div>
|
||||
<div className="bot">
|
||||
<div className="content">
|
||||
<h6 className="mb_5">+91 90954 50005</h6>
|
||||
<p className="text-body-2 text_mono-gray-6">
|
||||
Call us for urgent
|
||||
<h6 className="mb_5 text-white">+91 90954 50005</h6>
|
||||
<p className="text-body-2 text-white">
|
||||
Call us for urgent Inquiry
|
||||
</p>
|
||||
</div>
|
||||
<Link href={`/contact-us`} className="tf-btn btn-primary2 h36">
|
||||
<span className="text-caption">Get Direction</span>
|
||||
{/* <Link
|
||||
href="https://maps.app.goo.gl/pznAE2GE6p3YUhrE7?g_st=com.google.maps.preview.copy"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="tf-btn btn-primary2 h36"
|
||||
style={{
|
||||
backgroundColor: 'white',
|
||||
color: 'black',
|
||||
border: '1px solid #ddd'
|
||||
}}
|
||||
>
|
||||
<span className="text-caption" style={{ color: 'black' }}>Get Direction</span>
|
||||
<span className="bg-effect" />
|
||||
</Link>
|
||||
</Link> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<form onSubmit={(e) => e.preventDefault()} className="form-contact">
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="name">
|
||||
<form onSubmit={(e) => e.preventDefault()} className="form-contact" style={{ gap: "10px !important" }}>
|
||||
<fieldset style={{ marginBottom: "5px !important" }}>
|
||||
<label htmlFor="name" style={{ display: "block", marginBottom: "5px !important", color: "black", fontWeight: "500" }}>
|
||||
Full Name*
|
||||
</label>
|
||||
<input type="text" placeholder="Full Name" id="name" required />
|
||||
</fieldset>
|
||||
<div className="grid-2 gap_24">
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="email">
|
||||
<div className="grid-2 gap_24" style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: "5px !important", marginBottom: "5px !important" }}>
|
||||
<fieldset style={{ marginBottom: "0px !important" }}>
|
||||
<label htmlFor="email" style={{ display: "block", marginBottom: "5px !important", color: "black", fontWeight: "500" }}>
|
||||
Email Address*
|
||||
</label>
|
||||
<input
|
||||
@ -48,21 +59,20 @@ export default function Contact() {
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<label className="mb_15" htmlFor="phone">
|
||||
<fieldset style={{ marginBottom: "0px !important" }}>
|
||||
<label htmlFor="phone" style={{ display: "block", marginBottom: "5px !important", color: "black", fontWeight: "500" }}>
|
||||
Phone Number
|
||||
<span className="text_mono-gray-5">(Optional)</span>
|
||||
<span style={{ opacity: "0.6", color: "black" }}> (Optional)</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Your phone number"
|
||||
id="phone"
|
||||
required
|
||||
/>
|
||||
</fieldset>
|
||||
</div>
|
||||
<fieldset className="">
|
||||
<label className="mb_15" htmlFor="message">
|
||||
<fieldset style={{ marginBottom: "5px !important" }}>
|
||||
<label htmlFor="message" style={{ display: "block", marginBottom: "5px !important", color: "black", fontWeight: "500" }}>
|
||||
Message
|
||||
</label>
|
||||
<textarea
|
||||
@ -72,11 +82,11 @@ export default function Contact() {
|
||||
defaultValue={""}
|
||||
/>
|
||||
</fieldset>
|
||||
<a href="#" className="link attachment">
|
||||
<a href="#" className="link attachment text-dark" style={{ marginBottom: "5px !important", display: "inline-block" }}>
|
||||
<i className="icon-paperclip-solid" />
|
||||
Add an attachment
|
||||
</a>
|
||||
<button type="submit" className="tf-btn btn-primary2 mt_27">
|
||||
<button type="submit" className="tf-btn btn-primary2">
|
||||
<span>Send Message</span>
|
||||
<span className="bg-effect" />
|
||||
</button>
|
||||
@ -84,14 +94,14 @@ export default function Contact() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="shape position-absolute">
|
||||
{/* <div className="shape position-absolute">
|
||||
<Image
|
||||
alt="item"
|
||||
src="/images/item/shape-5.png"
|
||||
width={1105}
|
||||
height={720}
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -10,7 +10,7 @@ export default function Testimonials() {
|
||||
<div className="col-lg-6">
|
||||
<div className="wrap">
|
||||
<div className="heading-section">
|
||||
<h2 className="heading-title split-text split-lines-rotation-x">
|
||||
<h2 className="heading-title split-text split-lines-rotation-x text_primary">
|
||||
Client Satisfaction, Our Reputation
|
||||
</h2>
|
||||
<p
|
||||
|
||||
@ -3,15 +3,18 @@ import React, { useEffect, useState } from "react";
|
||||
import axios from "axios";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function Footer3() {
|
||||
const [success, setSuccess] = useState(true);
|
||||
const [showMessage, setShowMessage] = useState(false);
|
||||
|
||||
const handleShowMessage = () => {
|
||||
setShowMessage(true);
|
||||
setTimeout(() => {
|
||||
setShowMessage(false);
|
||||
}, 2000);
|
||||
};
|
||||
|
||||
const sendEmail = async (e) => {
|
||||
e.preventDefault(); // Prevent default form submission behavior
|
||||
const email = e.target.email.value;
|
||||
@ -39,6 +42,7 @@ export default function Footer3() {
|
||||
e.target.reset(); // Reset the form
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const headings = document.querySelectorAll(".footer-heading-mobile");
|
||||
|
||||
@ -68,7 +72,7 @@ export default function Footer3() {
|
||||
}, []); // Empty dependency array means this will run only once on mount
|
||||
|
||||
return (
|
||||
<footer id="footer" className="footer style-2">
|
||||
<footer id="footer" className="footer style-2" style={{ backgroundColor: '#272727' }}>
|
||||
<div className="footer-wrap">
|
||||
<div className="tf-container">
|
||||
<div className="footer-body">
|
||||
@ -76,144 +80,111 @@ export default function Footer3() {
|
||||
<div className="col-lg-4">
|
||||
<div className="footer-about">
|
||||
<Link href={`/`} className="footer-logo">
|
||||
<Image
|
||||
alt="logo"
|
||||
src="/images/logo/footer-logo-3.png"
|
||||
width={390}
|
||||
height={80}
|
||||
/>
|
||||
<svg
|
||||
width="139.5"
|
||||
height={40}
|
||||
viewBox="0 0 140 40"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M18.2183 15.7033L29.395 34.7289C29.4936 34.8967 29.6741 34.9994 29.8687 34.9985L41.1397 34.9463C41.3308 34.9455 41.5075 34.8448 41.6058 34.6809L47.5 24.8527L35.944 24.8365C35.7518 24.8362 35.5738 24.7349 35.4754 24.5698L23.9713 5.2667C23.8727 5.10131 23.6944 5 23.5019 5L12.3005 5C12.1083 5 11.9302 5.10099 11.8315 5.26594L5.91087 15.1639L0.167756 24.7208C0.0644005 24.8928 0.0636223 25.1076 0.165723 25.2804L5.75222 34.7316C5.85055 34.8979 6.02941 35 6.22264 35L16.7708 35C17.1948 35 17.4573 34.538 17.2402 34.1738L5.91087 15.1639L17.276 15.1639C17.6635 15.1639 18.022 15.3691 18.2183 15.7033Z"
|
||||
fill="white"
|
||||
/>
|
||||
<text
|
||||
x="55"
|
||||
y="30"
|
||||
fontFamily="Arial, sans-serif"
|
||||
fontSize="20"
|
||||
fill="white"
|
||||
>
|
||||
Keystone
|
||||
</text>
|
||||
</svg>
|
||||
</Link>
|
||||
<div className="footer-info mb_51">
|
||||
<a href="#" className="link text-body-2 text_dark">
|
||||
<a href="#" className="link text-body-2" style={{ color: 'white' }}>
|
||||
themesflat@gmail.com
|
||||
</a>
|
||||
<div className="text-body-2 text_dark">
|
||||
<div className="text-body-2" style={{ color: 'white' }}>
|
||||
No. 3A, 1st Floor, Balaji Nagar,<br />
|
||||
Dharapadavedu, Vellore - 632007,<br />
|
||||
Tamil Nadu, India
|
||||
</div>
|
||||
<div className="text-body-2 text_dark">+91 90954 50005</div>
|
||||
<div className="text-body-2" style={{ color: 'white' }}>+91 90954 50005</div>
|
||||
</div>
|
||||
<div className="tf-social">
|
||||
<a href="#" className="icon-twitter-x" />
|
||||
<a href="#" className="icon-facebook-f" />
|
||||
<a href="#" className="icon-github" />
|
||||
<a href="#" className="icon-instagram" />
|
||||
<a href="#" className="icon-youtube" />
|
||||
<a href="#" className="icon-twitter-x" style={{ color: 'white' }} />
|
||||
<a href="#" className="icon-facebook-f" style={{ color: 'white' }} />
|
||||
<a href="#" className="icon-github" style={{ color: 'white' }} />
|
||||
<a href="#" className="icon-instagram" style={{ color: 'white' }} />
|
||||
<a href="#" className="icon-youtube" style={{ color: 'white' }} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-6">
|
||||
<div className="footer-col-block">
|
||||
<h6 className="footer-heading footer-heading-mobile text_dark fw-6">
|
||||
<h6 className="footer-heading footer-heading-mobile fw-6" style={{ color: 'white' }}>
|
||||
Company
|
||||
</h6>
|
||||
<div className="tf-collapse-content">
|
||||
<ul className="footer-menu-list">
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link href={`/#`} className="link footer-menu_item">
|
||||
About Advitex
|
||||
<li className="text-body-2">
|
||||
<Link href={`/about`} className="link footer-menu_item" style={{ color: 'white' }}>
|
||||
About Keystone
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<li className="text-body-2">
|
||||
<Link
|
||||
href={`/contact-us`}
|
||||
className="link footer-menu_item"
|
||||
style={{ color: 'white' }}
|
||||
>
|
||||
Contact us
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link
|
||||
href={`/#`}
|
||||
className="link footer-menu_item"
|
||||
>
|
||||
Portfolio
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link href={`/#`} className="link footer-menu_item">
|
||||
How We Work
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
|
||||
<li className="text-body-2">
|
||||
<Link href={`/career`} className="link footer-menu_item" style={{ color: 'white' }}>
|
||||
Careers
|
||||
</Link>
|
||||
</li>
|
||||
{/* <li className="text-body-2">
|
||||
<Link
|
||||
href={`/#`}
|
||||
className="link footer-menu_item"
|
||||
style={{ color: 'white' }}
|
||||
>
|
||||
Career
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link href={`/#`} className="link footer-menu_item">
|
||||
Our Team
|
||||
</Link>
|
||||
</li>
|
||||
</li> */}
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-6">
|
||||
<div>
|
||||
<div className="footer-col-block">
|
||||
<h6 className="footer-heading footer-heading-mobile text_dark fw-6">
|
||||
Links
|
||||
</h6>
|
||||
<div className="tf-collapse-content">
|
||||
<ul className="footer-menu-list">
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link
|
||||
href={`/contact-us`}
|
||||
className="link footer-menu_item"
|
||||
>
|
||||
Help Center
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link
|
||||
href={`/#`}
|
||||
className="link footer-menu_item"
|
||||
>
|
||||
Privacy Policy
|
||||
</Link>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<a href="#" className="link footer-menu_item">
|
||||
Term & Conditon
|
||||
</a>
|
||||
</li>
|
||||
<li className="text-body-2 text_mono-gray-5">
|
||||
<Link
|
||||
href={`/#`}
|
||||
className="link footer-menu_item"
|
||||
>
|
||||
FAQs
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Links section commented out */}
|
||||
</div>
|
||||
<div className="col-lg-4">
|
||||
<div className="footer-newsletter">
|
||||
<h6 className="footer-heading text_dark fw-6">
|
||||
Sign Up for Email
|
||||
<h6 className="footer-heading fw-6" style={{ color: 'white' }}>
|
||||
Contact Us
|
||||
</h6>
|
||||
<div className="tf-collapse-content">
|
||||
<div className="wrap-newsletter">
|
||||
<p className="text-body-2 text_mono-gray-5 mb_17">
|
||||
Sign up to get first dibs on new arrivals, sales
|
||||
<p className="text-body-2 mb_17" style={{ color: 'white' }}>
|
||||
Get in touch with us for your data processing needs.
|
||||
<br />
|
||||
exclusive content, events and more!
|
||||
We're here to help with your business requirements!
|
||||
</p>
|
||||
<div
|
||||
className={`tfSubscribeMsg footer-sub-element ${showMessage ? "active" : ""
|
||||
className={`tfSubscribeMsg footer-sub-element ${showMessage ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
{success ? (
|
||||
<p style={{ color: "rgb(52, 168, 83)" }}>
|
||||
You have successfully subscribed.
|
||||
Your message has been sent successfully.
|
||||
</p>
|
||||
) : (
|
||||
<p style={{ color: "red" }}>Something went wrong</p>
|
||||
@ -240,6 +211,7 @@ export default function Footer3() {
|
||||
placeholder="Enter your e-mail"
|
||||
tabIndex={0}
|
||||
aria-required="true"
|
||||
style={{ backgroundColor: 'white', color: '#272727' }}
|
||||
/>
|
||||
</fieldset>
|
||||
<div className="button-submit">
|
||||
@ -248,19 +220,19 @@ export default function Footer3() {
|
||||
className="subscribe-button tf-btn btn-dark"
|
||||
type="submit"
|
||||
>
|
||||
<span>Subscribe</span>
|
||||
<span>Submit</span>
|
||||
<span className="bg-effect" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="icon">
|
||||
<i className="icon-envelope-solid" />
|
||||
<i className="icon-envelope-solid" style={{ color: 'white' }} />
|
||||
</div>
|
||||
</div>
|
||||
<div id="subscribe-msg" className="subscribe-msg" />
|
||||
</form>
|
||||
<p className="description text-body-2 text_dark">
|
||||
By subscribing, you accepted the our{" "}
|
||||
<a href="#" className="link text_dark">
|
||||
<p className="description text-body-2" style={{ color: 'white' }}>
|
||||
By contacting us, you agree to our{" "}
|
||||
<a href="#" className="link" style={{ color: 'white', textDecoration: 'underline' }}>
|
||||
Privacy Policy
|
||||
</a>
|
||||
</p>
|
||||
@ -272,38 +244,18 @@ export default function Footer3() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom">
|
||||
<div className="footer-bottom" style={{ backgroundColor: '#1f1f1f', borderTop: '1px solid rgba(255,255,255,0.1)' }}>
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="wrapper d-flex align-items-center flex-wrap gap_12">
|
||||
<p className="text-body-2">
|
||||
<p className="text-body-2 m-0" style={{ color: 'white' }}>
|
||||
© {new Date().getFullYear()} Copyright by{" "}
|
||||
<a href="#" className="link-black text_primary text-body-3">
|
||||
Themesflat
|
||||
<a href="#" className="link-black text-body-3" style={{ color: 'white', fontWeight: '600' }}>
|
||||
Keystone
|
||||
</a>{" "}
|
||||
. All Right Reserved.
|
||||
. All Rights Reserved.
|
||||
</p>
|
||||
<ul className="right d-flex align-items-center">
|
||||
<li>
|
||||
<Link
|
||||
href={`/pricing`}
|
||||
className="link text_mono-gray-5 text-body-1"
|
||||
>
|
||||
Privacy Policy
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" className="link text_mono-gray-5 text-body-1">
|
||||
Terms of Services
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" className="link text_mono-gray-5 text-body-1">
|
||||
Virtual Reality
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -311,4 +263,4 @@ export default function Footer3() {
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,24 +1,100 @@
|
||||
import React from "react";
|
||||
'use client'
|
||||
import React, { useState } from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import Nav from "./Nav";
|
||||
|
||||
export default function Header4() {
|
||||
const [isServicesDropdownOpen, setIsServicesDropdownOpen] = useState(false);
|
||||
|
||||
const handleServicesMouseEnter = () => {
|
||||
setIsServicesDropdownOpen(true);
|
||||
};
|
||||
|
||||
const handleServicesMouseLeave = () => {
|
||||
setIsServicesDropdownOpen(false);
|
||||
};
|
||||
|
||||
// Service items with ID-based URLs (matching Services component behavior)
|
||||
const serviceItems = [
|
||||
{ id: 11, title: "Data Entry Services", href: "/service-details/11" },
|
||||
{ id: 12, title: "Data Conversion", href: "/service-details/12" },
|
||||
{ id: 13, title: "Data Processing", href: "/service-details/13" },
|
||||
{ id: 14, title: "Receipt Data Entry Services", href: "/service-details/14" },
|
||||
{ id: 15, title: "Logistics Data Entry Services", href: "/service-details/15" },
|
||||
{ id: 16, title: "Construction", href: "/service-details/16" }
|
||||
];
|
||||
|
||||
const renderServiceLink = (service) => {
|
||||
// Disable Construction service (id: 16) same as in Services component
|
||||
const isDisabled = service.id === 16;
|
||||
|
||||
if (isDisabled) {
|
||||
return (
|
||||
<span
|
||||
style={{
|
||||
display: 'block',
|
||||
padding: '8px 16px',
|
||||
color: '#999999',
|
||||
fontSize: '14px',
|
||||
fontWeight: '500',
|
||||
borderLeft: '3px solid transparent',
|
||||
cursor: 'not-allowed',
|
||||
opacity: '0.5'
|
||||
}}
|
||||
>
|
||||
{service.title}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
href={service.href}
|
||||
style={{
|
||||
display: 'block',
|
||||
padding: '8px 16px',
|
||||
color: '#333333',
|
||||
textDecoration: 'none',
|
||||
fontSize: '14px',
|
||||
fontWeight: '500',
|
||||
transition: 'all 0.2s ease',
|
||||
borderLeft: '3px solid transparent'
|
||||
}}
|
||||
onMouseEnter={(e) => {
|
||||
e.target.style.backgroundColor = '#f8f9ff';
|
||||
e.target.style.color = '#28285B';
|
||||
e.target.style.borderLeftColor = '#28285B';
|
||||
e.target.style.paddingLeft = '20px';
|
||||
}}
|
||||
onMouseLeave={(e) => {
|
||||
e.target.style.backgroundColor = 'transparent';
|
||||
e.target.style.color = '#333333';
|
||||
e.target.style.borderLeftColor = 'transparent';
|
||||
e.target.style.paddingLeft = '16px';
|
||||
}}
|
||||
>
|
||||
{service.title}
|
||||
</Link>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<header id="header-main" className="header style-3">
|
||||
<header id="header-main" className="header style-3" style={{ backgroundColor: 'white', borderBottom: '1px solid #e5e5e5'}}>
|
||||
<div className="header-inner">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="header-inner-wrap">
|
||||
<div className="header-left d-flex align-items-center">
|
||||
<div className="header-logo">
|
||||
<Link href={`/`} className="site-logo">
|
||||
<div className="header-logo" style={{ display: 'flex', alignItems: 'center' }}>
|
||||
<Link href={`/`} className="site-logo" style={{ display: 'flex', alignItems: 'center' }}>
|
||||
<svg
|
||||
width="139.5"
|
||||
width="160"
|
||||
height={40}
|
||||
viewBox="0 0 140 40"
|
||||
viewBox="0 0 150 40"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
style={{ display: 'block' }}
|
||||
>
|
||||
<path
|
||||
d="M18.2183 15.7033L29.395 34.7289C29.4936 34.8967 29.6741 34.9994 29.8687 34.9985L41.1397 34.9463C41.3308 34.9455 41.5075 34.8448 41.6058 34.6809L47.5 24.8527L35.944 24.8365C35.7518 24.8362 35.5738 24.7349 35.4754 24.5698L23.9713 5.2667C23.8727 5.10131 23.6944 5 23.5019 5L12.3005 5C12.1083 5 11.9302 5.10099 11.8315 5.26594L5.91087 15.1639L0.167756 24.7208C0.0644005 24.8928 0.0636223 25.1076 0.165723 25.2804L5.75222 34.7316C5.85055 34.8979 6.02941 35 6.22264 35L16.7708 35C17.1948 35 17.4573 34.538 17.2402 34.1738L5.91087 15.1639L17.276 15.1639C17.6635 15.1639 18.022 15.3691 18.2183 15.7033Z"
|
||||
@ -26,35 +102,106 @@ export default function Header4() {
|
||||
/>
|
||||
<text
|
||||
x="55"
|
||||
y="30"
|
||||
y="20"
|
||||
fontFamily="Arial, sans-serif"
|
||||
fontSize="20"
|
||||
fontSize="22"
|
||||
fontWeight="600"
|
||||
fill="#121416"
|
||||
dominantBaseline="central"
|
||||
>
|
||||
Keystone
|
||||
</text>
|
||||
</svg>
|
||||
|
||||
</Link>
|
||||
</div>
|
||||
<nav className="main-menu style-3">
|
||||
<ul className="navigation">
|
||||
<Nav />
|
||||
<li
|
||||
className="menu-item"
|
||||
style={{ position: 'relative' }}
|
||||
onMouseEnter={handleServicesMouseEnter}
|
||||
onMouseLeave={handleServicesMouseLeave}
|
||||
>
|
||||
<Link
|
||||
href="/#"
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '4px',
|
||||
textDecoration: 'none',
|
||||
color: '#333333',
|
||||
transition: 'color 0.3s ease'
|
||||
}}
|
||||
>
|
||||
Services
|
||||
<svg
|
||||
width="12"
|
||||
height="8"
|
||||
viewBox="0 0 12 8"
|
||||
fill="none"
|
||||
style={{
|
||||
transform: isServicesDropdownOpen ? 'rotate(180deg)' : 'rotate(0deg)',
|
||||
transition: 'transform 0.3s ease'
|
||||
}}
|
||||
>
|
||||
<path
|
||||
d="M1 1.5L6 6.5L11 1.5"
|
||||
stroke="currentColor"
|
||||
strokeWidth="1.5"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</Link>
|
||||
|
||||
{/* Dropdown Menu */}
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '100%',
|
||||
left: '0',
|
||||
minWidth: '220px',
|
||||
backgroundColor: '#ffffff',
|
||||
boxShadow: '0 4px 16px rgba(0, 0, 0, 0.1)',
|
||||
borderRadius: '8px',
|
||||
padding: '8px 0',
|
||||
opacity: isServicesDropdownOpen ? '1' : '0',
|
||||
visibility: isServicesDropdownOpen ? 'visible' : 'hidden',
|
||||
transform: isServicesDropdownOpen ? 'translateY(0px)' : 'translateY(-10px)',
|
||||
transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',
|
||||
zIndex: '1000',
|
||||
border: '1px solid rgba(0, 0, 0, 0.08)',
|
||||
backdropFilter: 'blur(20px)',
|
||||
WebkitBackdropFilter: 'blur(20px)'
|
||||
}}
|
||||
>
|
||||
<ul
|
||||
style={{
|
||||
listStyle: 'none',
|
||||
margin: '0',
|
||||
padding: '0'
|
||||
}}
|
||||
>
|
||||
{serviceItems.map((service, index) => (
|
||||
<li key={index}>
|
||||
{renderServiceLink(service)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="menu-item">
|
||||
<Link href="/about" style={{ color: '#333333', textDecoration: 'none' }}>About</Link>
|
||||
</li>
|
||||
<li className="menu-item">
|
||||
<Link href="/career" style={{ color: '#333333', textDecoration: 'none' }}>Career</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="header-right d-flex align-items-center">
|
||||
<div className="support text-body-2 d-flex gap_12 align-items-center text_mono-dark-9">
|
||||
<i className="icon-customer-support" />
|
||||
24/7 Support: +91 90954 50005
|
||||
</div>
|
||||
<Link
|
||||
href={`/about`}
|
||||
className="tf-btn btn-border border-1 hide-sm h36 rounded-12"
|
||||
>
|
||||
<span className="text-caption">Get Started</span>
|
||||
<span className="bg-effect" />
|
||||
</Link>
|
||||
<Link
|
||||
href={`/contact-us`}
|
||||
className="tf-btn hide-sm rounded-12 h36"
|
||||
@ -82,4 +229,4 @@ export default function Header4() {
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -23,46 +23,8 @@ export default function Nav() {
|
||||
isActiveParent(homepages) ? "current-menu" : ""
|
||||
} `}
|
||||
>
|
||||
<a href="#">Home</a>
|
||||
{/* <div className="submenu mega-menu">
|
||||
<div className="wrap-demo-item tf-grid-layout-lg lg-col-3">
|
||||
{homepages.map((item, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`demo-item ${
|
||||
isActive(item.href) ? "current-menu-item" : ""
|
||||
}`}
|
||||
>
|
||||
<Link href={item.href}>
|
||||
<div className="demo-image">
|
||||
<Image
|
||||
className="lazyload"
|
||||
data-src={item.src}
|
||||
src={item.src}
|
||||
alt={item.alt}
|
||||
width={480}
|
||||
height={228}
|
||||
/>
|
||||
</div>
|
||||
<h6 className="demo-name fw-4">{item.title}</h6>
|
||||
</Link>
|
||||
</div>
|
||||
))}
|
||||
<div className="comming-soon">
|
||||
<Link href={`/coming-soon`} className="wrap">
|
||||
<h5 className="demo-name">Coming Soon</h5>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</li>
|
||||
<li
|
||||
className={`has-child position-relative ${
|
||||
isActiveParent(otherPages) ? "current-menu" : ""
|
||||
} `}
|
||||
>
|
||||
<a href="#">Pages</a>
|
||||
{/* <ul className="submenu">
|
||||
<a href="#">Services</a>
|
||||
<ul className="submenu">
|
||||
{otherPages.map((item) => (
|
||||
<li
|
||||
key={item.href}
|
||||
@ -73,7 +35,7 @@ export default function Nav() {
|
||||
<Link href={item.href}>{item.label}</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul> */}
|
||||
</ul>
|
||||
</li>
|
||||
<li
|
||||
className={`has-child position-relative ${
|
||||
|
||||
@ -3,7 +3,7 @@ import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
export default function Features() {
|
||||
return (
|
||||
<div className="section-about tf-spacing-19">
|
||||
<div className="section-about">
|
||||
<div className="tf-container-3">
|
||||
<div className="box-choose style-1">
|
||||
<div className="content">
|
||||
|
||||
@ -1,19 +1,20 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function About() {
|
||||
return (
|
||||
<div className="section">
|
||||
<div className="tf-container">
|
||||
<div className="box-about style-2">
|
||||
<div className="left">
|
||||
<div className=" mb_50">
|
||||
<div className="mb_50">
|
||||
<div className="point text-body-1 mb_14">
|
||||
<span className="item" />
|
||||
About Us
|
||||
</div>
|
||||
<h3 className="heading-title text_mono-dark-9">
|
||||
We’re A Trusted And Professional Insurance Company,{" "}
|
||||
<h3 className="heading-title text_primary">
|
||||
We're a Trusted and Professional BPO Partner,{" "}
|
||||
<Image
|
||||
alt="item"
|
||||
className="wow animate__rollIn animate__animated"
|
||||
@ -22,11 +23,11 @@ export default function About() {
|
||||
width={48}
|
||||
height={48}
|
||||
/>{" "}
|
||||
Committed To Your Financial Security.
|
||||
Committed to Driving Your Business Success.
|
||||
</h3>
|
||||
</div>
|
||||
<div className="bot">
|
||||
<div className="clutch-rating-item style-1 d-flex align-items-center mb_16">
|
||||
{/* <div className="clutch-rating-item style-1 d-flex align-items-center mb_16">
|
||||
<div className="logo">
|
||||
<svg
|
||||
width={34}
|
||||
@ -63,12 +64,18 @@ export default function About() {
|
||||
</div>
|
||||
<p className="text-body-4">Based on 24 reviews</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<p className="text-body-1 text_mono-gray-6 mb_31">
|
||||
As a trusted and professional insurance company, we are
|
||||
committed to providing comprehensive coverage and exceptional
|
||||
service to our <br />
|
||||
valued clients.
|
||||
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.
|
||||
<br />
|
||||
Our integrated approach ensures that every service—from data entry
|
||||
and conversion to processing and logistics—works together to
|
||||
support your growth. With a highly skilled team and cutting-edge
|
||||
tools, we deliver consistent, scalable, and reliable results you can trust.
|
||||
</p>
|
||||
<Link
|
||||
href={`/about`}
|
||||
|
||||
@ -13,47 +13,45 @@ export default function Hero() {
|
||||
<div className="heading-title d-flex flex-wrap-lg mb_40 justify-content-between">
|
||||
<div className="left">
|
||||
<p className="sub text-body-1 text_primary point">
|
||||
<span className="item" /> Ultimate Peace Of Mind
|
||||
<span className="item" /> Ultimate Accuracy & Efficiency
|
||||
</p>
|
||||
<div className="text_primary text-display-3 title">
|
||||
Shaping{" "}
|
||||
Transforming{" "}
|
||||
<img
|
||||
className="icon animate__rollIn animate__animated"
|
||||
data-wow-delay="0s"
|
||||
alt="icon"
|
||||
src="/images/box-icon/check-verified-01.svg"
|
||||
/>{" "}
|
||||
Futures <br />
|
||||
With{" "}
|
||||
Data <br />
|
||||
Into{" "}
|
||||
<img
|
||||
className="icon heart animate__rollIn animate__animated"
|
||||
alt="icon"
|
||||
src="/images/box-icon/heart-circle.svg"
|
||||
/>{" "}
|
||||
Insurance Solutions
|
||||
Business Power
|
||||
</div>
|
||||
</div>
|
||||
<div className="right">
|
||||
<p className="sub-heading text_mono-dark-9 mb_24 split-text split-lines-transform">
|
||||
Maximize your coverage, minimize your worries. We're committed
|
||||
to providing exceptional customer service and comprehensive
|
||||
insurance solutions that exceed your expectations.
|
||||
Streamline your operations with fast, accurate, and affordable data entry, conversion, and processing services tailored to your business needs.
|
||||
</p>
|
||||
<div className="d-flex gap_10 wrap-btn flex-wrap-sm">
|
||||
<Link
|
||||
href={`/#`}
|
||||
{/* <Link
|
||||
href={`/contact-us`}
|
||||
className="tf-btn btn-border border-1 rounded-12 height-3"
|
||||
>
|
||||
<span className="text-body-1 text_primary">
|
||||
Book a Free Consulting
|
||||
Request a Free Consultation
|
||||
</span>
|
||||
<span className="bg-effect" />
|
||||
</Link>
|
||||
</Link> */}
|
||||
<Link
|
||||
href={`/contact-us`}
|
||||
href="#services"
|
||||
className="tf-btn rounded-12 height-3"
|
||||
>
|
||||
<span className="text-body-1">Find your plan</span>
|
||||
<span className="text-body-1">Explore Our Services</span>
|
||||
<span className="bg-effect" />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
@ -2,9 +2,10 @@ import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { services2 } from "@/data/services";
|
||||
|
||||
export default function Services() {
|
||||
return (
|
||||
<div className="section tf-spacing-46 pb-0">
|
||||
<div className="section tf-spacing-46 pb-0" style={{ backgroundColor: "#fff" }}>
|
||||
<div className="tf-container">
|
||||
<div className="heading-section d-flex gap_12 justify-content-between align-items-end flex-wrap-md mb_57">
|
||||
<div className="left">
|
||||
@ -24,17 +25,9 @@ export default function Services() {
|
||||
to you, avoiding unnecessary expenses
|
||||
</p>
|
||||
</div>
|
||||
<div className="right">
|
||||
<Link
|
||||
href={`/#`}
|
||||
className="tf-btn height-3 rounded-12 btn-px-28"
|
||||
>
|
||||
<span>See our services</span>
|
||||
<span className="bg-effect" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="tf-grid-layout lg-col-3">
|
||||
{/* Updated for 3x2 grid layout */}
|
||||
<div className="tf-grid-layout lg-col-3 md-col-2 sm-col-1">
|
||||
{services2.map((service, index) => (
|
||||
<div
|
||||
key={index}
|
||||
@ -54,13 +47,21 @@ export default function Services() {
|
||||
</Link>
|
||||
</h3>
|
||||
<p className="text-body-1 mb_23">{service.description}</p>
|
||||
<Link
|
||||
href={`/service-details/${service.id}`}
|
||||
className="tf-btn-link"
|
||||
>
|
||||
<span> Learn more </span>
|
||||
<i className="icon-arrow-top-right"> </i>
|
||||
</Link>
|
||||
{/* Conditionally render Learn more - disabled for Construction (id: 16) */}
|
||||
{service.id !== 16 ? (
|
||||
<Link
|
||||
href={`/service-details/${service.id}`}
|
||||
className="tf-btn-link"
|
||||
>
|
||||
<span> Learn more </span>
|
||||
<i className="icon-arrow-top-right"> </i>
|
||||
</Link>
|
||||
) : (
|
||||
<span className="tf-btn-link disabled" style={{ opacity: 0.5, cursor: 'not-allowed' }}>
|
||||
<span> Learn more </span>
|
||||
<i className="icon-arrow-top-right"> </i>
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<div
|
||||
className="item scroll-tranform"
|
||||
@ -80,4 +81,4 @@ export default function Services() {
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -3,6 +3,7 @@ import React, { useState } from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { services3 } from "@/data/services";
|
||||
|
||||
export default function Services() {
|
||||
const [activeService, setActiveService] = useState(1);
|
||||
return (
|
||||
@ -22,38 +23,50 @@ export default function Services() {
|
||||
</div>
|
||||
<div className="right">
|
||||
<p className="text-body-1 text_mono-gray-7 split-text split-lines-transform">
|
||||
Explore our range of expert services designed to <br />
|
||||
elevate your business. From strategic planning to <br />
|
||||
Explore our range of expert services designed to
|
||||
elevate your business. From strategic planning to
|
||||
execution, we deliver solutions.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="top mb_48">
|
||||
<div className="navigation-bar overflow-x-auto">
|
||||
<div className="navigation-bar">
|
||||
<div
|
||||
className={`nav-item ${activeService == 1 ? "is-active" : ""} `}
|
||||
onClick={() => setActiveService(1)}
|
||||
>
|
||||
Market Research & Analysis
|
||||
Data Entry Services
|
||||
</div>
|
||||
<div
|
||||
className={`nav-item ${activeService == 2 ? "is-active" : ""} `}
|
||||
onClick={() => setActiveService(2)}
|
||||
>
|
||||
Brand Development & Positioning
|
||||
Data Conversion
|
||||
</div>
|
||||
<div
|
||||
className={`nav-item ${activeService == 3 ? "is-active" : ""} `}
|
||||
onClick={() => setActiveService(3)}
|
||||
>
|
||||
Digital Marketing
|
||||
Data Processing
|
||||
</div>
|
||||
<div
|
||||
className={`nav-item ${activeService == 4 ? "is-active" : ""} `}
|
||||
onClick={() => setActiveService(4)}
|
||||
>
|
||||
Receipt Data Entry Services
|
||||
</div>
|
||||
<div
|
||||
className={`nav-item ${activeService == 5 ? "is-active" : ""} `}
|
||||
onClick={() => setActiveService(5)}
|
||||
>
|
||||
Logistics Data Entry Services
|
||||
</div>
|
||||
</div>
|
||||
<div className="navigation-arrows">
|
||||
<div
|
||||
className="arrow"
|
||||
onClick={() =>
|
||||
setActiveService((pre) => (pre == 1 ? 3 : pre - 1))
|
||||
setActiveService((pre) => (pre == 1 ? 5 : pre - 1))
|
||||
}
|
||||
id="prevButton"
|
||||
>
|
||||
@ -83,7 +96,7 @@ export default function Services() {
|
||||
<div
|
||||
className="arrow"
|
||||
onClick={() =>
|
||||
setActiveService((pre) => (pre == 3 ? 1 : pre + 1))
|
||||
setActiveService((pre) => (pre == 5 ? 1 : pre + 1))
|
||||
}
|
||||
id="nextButton"
|
||||
>
|
||||
@ -148,7 +161,7 @@ export default function Services() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="right">
|
||||
<div className="img-style">
|
||||
<div className="img-style" style={{ maxWidth: '100%', overflow: 'hidden' }}>
|
||||
<Image
|
||||
className="lazyload"
|
||||
data-src={service.image}
|
||||
@ -156,6 +169,12 @@ export default function Services() {
|
||||
src={service.image}
|
||||
width={393}
|
||||
height={417}
|
||||
style={{
|
||||
width: '100%',
|
||||
height: 'auto',
|
||||
maxWidth: '393px',
|
||||
objectFit: 'cover'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -169,4 +188,4 @@ export default function Services() {
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -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 services—powered 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 time—every 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>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -2,6 +2,7 @@
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
|
||||
export default function Contact() {
|
||||
return (
|
||||
<div className="page-title style-default -mb_11">
|
||||
@ -11,22 +12,22 @@ export default function Contact() {
|
||||
<div className="col-lg-6">
|
||||
<div className="left">
|
||||
<div className="heading">
|
||||
<h1 className="mb_21">
|
||||
Success is a team play, right? Let's work together!
|
||||
<h1 className="mb_21 text_primary">
|
||||
Let's Start Building Solutions Together
|
||||
</h1>
|
||||
<ul className="breadcrumb">
|
||||
{/* <ul className="breadcrumb">
|
||||
<li>
|
||||
<Link href={`/`} className="link">
|
||||
Home
|
||||
</Link>
|
||||
</li>
|
||||
<li>Contact</li>
|
||||
</ul>
|
||||
</ul> */}
|
||||
</div>
|
||||
<div className="bot">
|
||||
<div className="content mb-0">
|
||||
<h6>+91 90954 50005</h6>
|
||||
<p className="text-body-2 text_mono-gray-6">
|
||||
<div className="content mb-0 ">
|
||||
<h6 className="text_primary">+91 90954 50005</h6>
|
||||
<p className="text-body-2 text_primary">
|
||||
Call us for urgent
|
||||
</p>
|
||||
</div>
|
||||
@ -97,14 +98,14 @@ export default function Contact() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="shape position-absolute">
|
||||
{/* <div className="shape position-absolute">
|
||||
<Image
|
||||
alt="item"
|
||||
src="/images/item/shape-5.png"
|
||||
width={1105}
|
||||
height={720}
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -1,32 +1,156 @@
|
||||
import React from "react";
|
||||
import Image from "next/image";
|
||||
import ServiceInfo from "./ServiceInfo";
|
||||
export default function ServiceDetails() {
|
||||
|
||||
// Service-specific data
|
||||
const serviceDetailsData = {
|
||||
11: { // Health Insurance
|
||||
title: "Data Entry Services",
|
||||
description:
|
||||
"Keystone offers quality data entry services for various businesses and industries. We guarantee timely delivery without compromising the exceptional quality we are known for. Using the latest technologies, we ensure fast turnaround times and accurate results. Our commitment is to provide reliable, high-quality services at costs that remain affordable to all our clients.Our Data Entry Services include:",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [
|
||||
"Online Data Entry",
|
||||
"Offline Data Entry",
|
||||
"MS Access Data Entry",
|
||||
"Excel Data Entry",
|
||||
"XML Data Entry",
|
||||
"Web Data Entry",
|
||||
"Questionnaire Data Entry",
|
||||
"Insurance Claims Data Entry",
|
||||
"Data Capture",
|
||||
"Book Data Entry",
|
||||
"Online Typing Services",
|
||||
"XML Conversion",
|
||||
"Data Input Services",
|
||||
"Data Purchasing",
|
||||
"Medical Billing",
|
||||
"MSDS Data",
|
||||
"Data Keying Services"
|
||||
]
|
||||
},
|
||||
12: { // Property Insurance
|
||||
title: "Data Conversion",
|
||||
description:
|
||||
"Keystone provides professional data conversion services, transforming your existing physical or digital data into the required format with zero risk of data loss. Our skilled team and proven technologies ensure accurate, high-quality results delivered on time.",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [
|
||||
"XML / XHTML Conversion",
|
||||
"PDF Conversion",
|
||||
"TEXT / TXT Conversion",
|
||||
"Document OCR Conversion",
|
||||
"Catalogue Conversion",
|
||||
"File Conversion",
|
||||
"HTML Conversion",
|
||||
"Audio Conversion",
|
||||
"Book Conversion",
|
||||
"XLS / CSV Conversion",
|
||||
"Image Conversion"
|
||||
]
|
||||
},
|
||||
13: { // Business Insurance
|
||||
title: "Data Processing",
|
||||
description:
|
||||
"Keystone offers superior data processing services 365x24x7. We undertake all types of data processing services at affordable costs. We ensure advanced analysis, summary, and synthesis of complex and unsorted raw data. We undertake bulk data processing, providing valuable information out of raw and unstructured data. Our Data Processing Services include:",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [
|
||||
"Word Processing",
|
||||
"Check Processing",
|
||||
"Form Processing",
|
||||
"OCR Cleanup",
|
||||
"Survey Processing",
|
||||
"Resume Processing",
|
||||
"Image Processing",
|
||||
"Catalogue Processing",
|
||||
"Credit Card Processing",
|
||||
"Medical Data Processing",
|
||||
"Insurance Claims Processing"
|
||||
]
|
||||
},
|
||||
14: { // Life Insurance
|
||||
title: "Receipt Data Entry Services",
|
||||
description:
|
||||
"Keystone offers reliable Receipt Data Entry Services to help businesses maintain accurate digital records of their receipts. Our advanced technology and skilled professionals ensure high-quality data, consistency, and quick turnaround times to support your business operations.",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [] // no subcategories in brochure
|
||||
},
|
||||
15: { // Auto Insurance
|
||||
title: "Logistics Data Entry Services",
|
||||
description:
|
||||
"Keystone provides high-quality Logistics Data Entry Services to clients worldwide. We prioritize accuracy and timely delivery, ensuring you have reliable information at your fingertips to manage your logistics business efficiently. Our skilled team delivers superior data entry performance, handles bulk projects with ease, and offers services at affordable rates—allowing you to focus on timely deliveries. Our services in Logistics Data Entry Services include:",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [
|
||||
"Freight Bill Data Entry",
|
||||
"Freight Bill Processing",
|
||||
"Contract Management",
|
||||
"Bill of Lading Verification & Data Entry",
|
||||
"Invoice Processing"
|
||||
]
|
||||
}
|
||||
};
|
||||
|
||||
export default function ServiceDetails({ service }) {
|
||||
// Get service-specific data or fall back to default
|
||||
const serviceData = serviceDetailsData[service?.id] || {
|
||||
title: "INSURANCE SERVICES",
|
||||
description: "Keystone offers comprehensive insurance solutions tailored to your specific needs. Our experienced team provides personalized service and competitive rates to ensure you get the coverage that's right for you.",
|
||||
image: "/images/section/img-with-shape-6.jpg",
|
||||
features: [
|
||||
"Personalized Consultation",
|
||||
"Competitive Rates",
|
||||
"24/7 Customer Support",
|
||||
"Claims Assistance",
|
||||
"Policy Management",
|
||||
"Risk Assessment",
|
||||
"Coverage Reviews",
|
||||
"Multi-policy Discounts"
|
||||
]
|
||||
};
|
||||
|
||||
// Inline styles for the list container
|
||||
const listContainerStyles = {
|
||||
columns: 2,
|
||||
columnGap: '20px',
|
||||
listStyleType: 'disc',
|
||||
paddingLeft: '20px',
|
||||
marginLeft: '15px',
|
||||
display: 'block'
|
||||
};
|
||||
|
||||
// Inline styles for list items
|
||||
const listItemStyles = {
|
||||
marginBottom: '8px',
|
||||
paddingLeft: '5px',
|
||||
breakInside: 'avoid',
|
||||
listStyleType: 'disc',
|
||||
display: 'list-item',
|
||||
listStylePosition: 'outside'
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="text-with-img-2 v2 tf-spacing-11">
|
||||
<div className="text-with-img-2 v2 tf-spacing-47">
|
||||
<div className="tf-container">
|
||||
<div className="row">
|
||||
<div className="col-xl-6">
|
||||
<div className="content">
|
||||
<h2 className="title">
|
||||
Tailor The Message To Resonate With Your Apecific Audience.
|
||||
{serviceData.title}
|
||||
</h2>
|
||||
<p className="description text-body-1 text_mono-gray-7 description-1">
|
||||
Business strategy planning is the cornerstone of
|
||||
organizational success. It involves a systematic process of
|
||||
defining a company's long-term goals and objectives, and then
|
||||
devising a plan to achieve them. A well-crafted strategy
|
||||
provides a roadmap for the entire organization, ensuring
|
||||
alignment and focus.
|
||||
</p>
|
||||
<p className="description text-body-1 text_mono-gray-7 description-2">
|
||||
By investing time and effort in strategic planning,
|
||||
organizations can position themselves for long-term success.
|
||||
Regular review and adjustment of the strategy is crucial to
|
||||
adapt to changing market conditions and emerging
|
||||
opportunities.
|
||||
{serviceData.description}
|
||||
</p>
|
||||
{serviceData.features.length > 0 && (
|
||||
<ul
|
||||
className="description text-body-1 text_mono-gray-7 description-2"
|
||||
style={listContainerStyles}
|
||||
>
|
||||
{serviceData.features.map((feature, index) => (
|
||||
<li key={index} style={listItemStyles}>
|
||||
{feature}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-6">
|
||||
@ -34,7 +158,7 @@ export default function ServiceDetails() {
|
||||
<div className="shape-img-bg mgl-auto">
|
||||
<Image
|
||||
alt="shape"
|
||||
src="/images/section/img-with-shape-6.jpg"
|
||||
src={serviceData.image}
|
||||
width={696}
|
||||
height={598}
|
||||
/>
|
||||
@ -93,19 +217,6 @@ export default function ServiceDetails() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="section-service style-3 tf-spacing-9">
|
||||
<div className="tf-container">
|
||||
<div className="heading-secion mb_88">
|
||||
<h2>Comprehensive Service Information</h2>
|
||||
<p className="text-body-1 text_mono-gray-7 mt_18">
|
||||
Our comprehensive service offerings are designed to elevate your
|
||||
business and <br />
|
||||
drive sustainable growth.
|
||||
</p>
|
||||
</div>
|
||||
<ServiceInfo />
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
168
data/services.js
168
data/services.js
@ -70,120 +70,176 @@ export const services = [
|
||||
export const services2 = [
|
||||
{
|
||||
id: 11,
|
||||
title: "Health Insurance",
|
||||
title: "Data Entry Services",
|
||||
description:
|
||||
"Health insurance covers medical expenses, such as doctor visits, hospital stays & prescription drugs.",
|
||||
"Keystone provides fast, accurate, and affordable data entry services for all industries, ensuring quality without compromise.",
|
||||
icon: "/images/box-icon/medical-circle.svg",
|
||||
bgColor: "bg-color-yellow",
|
||||
delay: "0s",
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
title: "Property Insurance",
|
||||
title: "Data Conversion",
|
||||
description:
|
||||
"Property insurance protects your belongings from damage or loss caused by events like fire, theft, or natural disasters",
|
||||
"Keystone converts data to your desired format quickly and accurately, with zero data loss risk.",
|
||||
icon: "/images/box-icon/coins-stacked.svg",
|
||||
bgColor: "bg-color-green",
|
||||
delay: ".2s",
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
title: "Business Insurance",
|
||||
title: "Data Processing",
|
||||
description:
|
||||
"Business insurance protects your company from various risks, such as property damage",
|
||||
"Maximize your online presence with data-driven digital marketing strategies. We help you reach, engage, and convert your target audience across the digital landscape.",
|
||||
icon: "/images/box-icon/building-07.svg",
|
||||
bgColor: "bg-color-red",
|
||||
delay: ".3s",
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
title: "Receipt Data Entry Services",
|
||||
description:
|
||||
"Keystone delivers fast, accurate receipt data entry, ensuring consistent and reliable digital records for your business.",
|
||||
icon: "/images/box-icon/coins-stacked.svg",
|
||||
bgColor: "bg-color-blue",
|
||||
delay: ".4s",
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
title: "Logistics Data Entry Services",
|
||||
description:
|
||||
"Keystone delivers accurate, affordable logistics data entry, helping you manage operations efficiently and meet delivery schedules.",
|
||||
icon: "/images/box-icon/medical-circle.svg",
|
||||
bgColor: "bg-color-purple",
|
||||
delay: ".5s",
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
title: "Constructions",
|
||||
description:
|
||||
"Keystone delivers accurate, affordable construction service, helping you manage operations efficiently and meet delivery schedules.",
|
||||
icon: "/images/box-icon/building-07.svg",
|
||||
bgColor: "bg-color-skygreen",
|
||||
delay: ".5s",
|
||||
}
|
||||
];
|
||||
|
||||
export const services3 = [
|
||||
{
|
||||
id: 14,
|
||||
number: "01",
|
||||
title: "Market Research & Analysis",
|
||||
title: "Data Entry Services",
|
||||
description:
|
||||
"Gain actionable insights with our comprehensive market research and analysis services. We help you understand your audience, competitors, and industry trends.",
|
||||
"Keystone provides fast, accurate, and affordable data entry services for all industries, ensuring quality without compromise.",
|
||||
image: "/images/section/service-9.jpg",
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
number: "02",
|
||||
title: "Brand Development & Positioning",
|
||||
title: "Data Conversion",
|
||||
description:
|
||||
"Craft a compelling identity that sets you apart. Our tailored brand development and positioning services help you define who you are, communicate your value",
|
||||
"Keystone converts data to your desired format quickly and accurately, with zero data loss risk.",
|
||||
image: "/images/section/service-10.jpg",
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
number: "03",
|
||||
title: "Digital Marketing",
|
||||
title: "Data Processing",
|
||||
description:
|
||||
"Maximize your online presence with data-driven digital marketing strategies. We help you reach, engage, and convert your target audience across the digital landscape.",
|
||||
image: "/images/section/service-11.jpg",
|
||||
},
|
||||
{
|
||||
id: 17,
|
||||
number: "04",
|
||||
title: "Receipt Data Entry Services",
|
||||
description:
|
||||
"Keystone delivers fast, accurate receipt data entry, ensuring consistent and reliable digital records for your business.",
|
||||
image: "/images/section/service-9.jpg",
|
||||
},
|
||||
{
|
||||
id: 18,
|
||||
number: "05",
|
||||
title: "Logistics Data Entry Services",
|
||||
description:
|
||||
"Keystone delivers accurate, affordable logistics data entry, helping you manage operations efficiently and meet delivery schedules.",
|
||||
image: "/images/section/service-10.jpg",
|
||||
},
|
||||
];
|
||||
|
||||
export const services4 = [
|
||||
{
|
||||
id: 17,
|
||||
title: "Business Strategy <br /> Planning",
|
||||
|
||||
imgSrc: "/images/box-icon/business-idea.png",
|
||||
id: 14,
|
||||
title: "Data Entry Services",
|
||||
imgSrc: "/images/section/service-9.jpg",
|
||||
description:
|
||||
"Market analysis and research, Competitive landscape assessment, SWOT analysis, Strategic goal setting.",
|
||||
"Keystone provides fast, accurate, and affordable data entry services for all industries, ensuring quality without compromise.",
|
||||
delay: "0s",
|
||||
items: [
|
||||
"Financial Planning",
|
||||
"Strategic Goal Setting",
|
||||
"Market Analysis",
|
||||
"SWOT Analysis",
|
||||
"Online Data Entry",
|
||||
"Offline Data Entry",
|
||||
"MS Access Data Entry",
|
||||
"Excel Data Entry",
|
||||
"XML Data Entry"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
title: "Data Conversion",
|
||||
imgSrc: "/images/section/service-10.jpg",
|
||||
description:
|
||||
"Keystone converts data to your desired format quickly and accurately, with zero data loss risk.",
|
||||
delay: ".15s",
|
||||
items: [
|
||||
"XML / XHTML Conversion",
|
||||
"PDF Conversion",
|
||||
"TEXT / TXT Conversion",
|
||||
"Document OCR Conversion",
|
||||
"Catalogue Conversion"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
title: "Data Processing",
|
||||
imgSrc: "/images/section/service-11.jpg",
|
||||
description:
|
||||
"Maximize your online presence with data-driven digital marketing strategies. We help you reach, engage, and convert your target audience across the digital landscape.",
|
||||
delay: ".25s",
|
||||
items: [
|
||||
"Word Processing",
|
||||
"Check Processing",
|
||||
"Form Processing",
|
||||
"OCR Cleanup",
|
||||
"Survey Processing"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 17,
|
||||
title: "Receipt Data Entry Services",
|
||||
imgSrc: "/images/section/service-9.jpg",
|
||||
description:
|
||||
"Keystone delivers fast, accurate receipt data entry, ensuring consistent and reliable digital records for your business.",
|
||||
delay: ".35s",
|
||||
items: [],
|
||||
},
|
||||
{
|
||||
id: 18,
|
||||
title: "Financial Consulting <br /> & Strategy",
|
||||
imgSrc: "/images/box-icon/currency-exchange.png",
|
||||
title: "Logistics Data Entry Services",
|
||||
imgSrc: "/images/section/service-10.jpg",
|
||||
description:
|
||||
"Financial statement analysis, Cost-benefit analysis, Budgeting and forecasting, Risk management.",
|
||||
delay: ".15s",
|
||||
"Keystone delivers accurate, affordable logistics data entry, helping you manage operations efficiently and meet delivery schedules.",
|
||||
delay: ".45s",
|
||||
items: [
|
||||
"Risk Management",
|
||||
"Financial Planning and Analysis",
|
||||
"Mergers and Acquisitions",
|
||||
"Capital Raising",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 19,
|
||||
title: "Operations & Analyst <br /> Improvement",
|
||||
imgSrc: "/images/box-icon/stock-market.png",
|
||||
description:
|
||||
"Process Optimization, Lean Manufacturing, Supply Chain Management, Quality Control.",
|
||||
delay: ".25s",
|
||||
items: [
|
||||
"Process Optimization",
|
||||
"Data-Driven Decision Making",
|
||||
"Technology Implementation",
|
||||
"Continuous Improvement",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 20,
|
||||
title: "Tailor Personnel <br /> Consulting",
|
||||
imgSrc: "/images/box-icon/email-marketing.png",
|
||||
description:
|
||||
"Talent Acquisition, Employee Development, Performance Management, Organizational Culture Development.",
|
||||
delay: ".35s",
|
||||
items: [
|
||||
"Customized Recruitment Solutions",
|
||||
"Comprehensive Talent Acquisition",
|
||||
"Strategic Talent Management",
|
||||
"Executive Search",
|
||||
"Freight Bill Data Entry",
|
||||
"Freight Bill Processing",
|
||||
"Contract Management",
|
||||
"Bill of Lading Verification & Data Entry",
|
||||
"Invoice Processing"
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
export const allServices = [
|
||||
...serviceBoxes,
|
||||
...services,
|
||||
|
||||
2
public/css/bootstrap.css
vendored
2
public/css/bootstrap.css
vendored
@ -5377,7 +5377,7 @@ fieldset:disabled .btn {
|
||||
float: left;
|
||||
padding-right: var(--bs-breadcrumb-item-padding-x);
|
||||
color: var(--bs-breadcrumb-divider-color);
|
||||
content: var(--bs-breadcrumb-divider, "/")
|
||||
content: var(--bs-breadcrumb-divider, "")
|
||||
}
|
||||
|
||||
.breadcrumb-item.active {
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 94 KiB |
@ -1804,6 +1804,12 @@ a {
|
||||
.bg-color-blue {
|
||||
background-color: var(--Primary-ic-blue);
|
||||
}
|
||||
.bg-color-purple{
|
||||
background-color: var(--Primary-ic-purple);
|
||||
}
|
||||
.bg-color-skygreen{
|
||||
background-color: var(--Primary-ic-skygreen);
|
||||
}
|
||||
.bg-mono-gray-1 {
|
||||
background-color: var(--Mono-gray-1);
|
||||
}
|
||||
@ -1882,7 +1888,7 @@ a {
|
||||
}
|
||||
|
||||
.wrap-page-header {
|
||||
background: linear-gradient(103.01deg, #eff4ff 0%, #c9d9ff 100.23%);
|
||||
background: var(--Bg-color-1);
|
||||
}
|
||||
|
||||
.grid-2 {
|
||||
|
||||
@ -653,7 +653,7 @@
|
||||
}
|
||||
&.v2 {
|
||||
.content {
|
||||
padding-top: 114px;
|
||||
padding-top: 4px;
|
||||
}
|
||||
.shape-img-bg {
|
||||
margin-left: auto;
|
||||
|
||||
@ -9,8 +9,8 @@
|
||||
|
||||
.page-title {
|
||||
&.style-default {
|
||||
padding-top: 111px;
|
||||
padding-bottom: 133px;
|
||||
padding-top: 44px;
|
||||
padding-bottom: 44px;
|
||||
margin-bottom: -27px;
|
||||
&.v2 {
|
||||
padding-bottom: 204px;
|
||||
@ -291,7 +291,7 @@
|
||||
|
||||
.section-testimonial {
|
||||
&.style-1 {
|
||||
background-color: var(--Sub-color-1);
|
||||
background-color: var(--Bg-color-1);
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.wrap {
|
||||
@ -313,7 +313,7 @@
|
||||
right: 0;
|
||||
z-index: 4;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(180deg, #f2f6ff 35%, #1357f000 100%);
|
||||
background-image: linear-gradient(180deg, #f9f5f1 35%, #1357f000 100%);
|
||||
height: 150px;
|
||||
}
|
||||
&::before {
|
||||
@ -321,7 +321,7 @@
|
||||
content: "";
|
||||
position: absolute;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(180deg, #f2f6ff00 0%, #f2f6ff 70%);
|
||||
background-image: linear-gradient(180deg, #f2f6ff00 0%, #f9f5f1 70%);
|
||||
height: 200px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
@ -567,9 +567,7 @@
|
||||
.section-contact {
|
||||
&.style-default {
|
||||
overflow: hidden;
|
||||
background: linear-gradient(103.01deg, #eff4ff 0%, #c9d9ff 100.23%);
|
||||
padding-top: 110px;
|
||||
padding-bottom: 122px;
|
||||
background: var(--Bg-color-1);
|
||||
border-radius: 40px;
|
||||
.bot {
|
||||
.content {
|
||||
@ -1133,3 +1131,14 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.features-list {
|
||||
list-style-type: disc !important;
|
||||
list-style-position: outside !important;
|
||||
padding-left: 20px !important;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.features-list li {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
|
||||
@ -35,6 +35,8 @@ $fontIcon: "icomoon";
|
||||
--Primary-ic-red: #ff8283;
|
||||
--Primary-ic-green: #a7decf;
|
||||
--Primary-ic-yellow: #fedc6e;
|
||||
--Primary-ic-purple: #d457d8;
|
||||
--Primary-ic-skygreen: #80d370;
|
||||
// Business Consulting
|
||||
--Primary: #0075ff;
|
||||
--Primary-1: #e2ecf9;
|
||||
|
||||
@ -181,7 +181,7 @@
|
||||
margin-top: 0;
|
||||
}
|
||||
.footer-bottom {
|
||||
padding-top: 107px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
&.style-3 {
|
||||
|
||||
@ -65,8 +65,8 @@
|
||||
}
|
||||
&.style-3 {
|
||||
.header-inner-wrap {
|
||||
padding: 37px 0 22px;
|
||||
border-bottom: 1px dashed #a7a7a7;
|
||||
padding: 20px 0 22px;
|
||||
|
||||
|
||||
}
|
||||
.header-left {
|
||||
|
||||
Reference in New Issue
Block a user