Merge version_2 into main #1
260
src/app/page.tsx
260
src/app/page.tsx
@@ -3,9 +3,9 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
@@ -32,22 +32,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#features" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="PAK-AI"
|
||||
/>
|
||||
@@ -55,42 +43,15 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Pioneering the AI Frontier in Pakistan"
|
||||
description="Transforming industries with cutting-edge artificial intelligence, machine learning, and deep-tech innovation designed for the future."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Get Started", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-particle-flow-background_1048-12436.jpg",
|
||||
imageAlt: "AI tech interface dark mode",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg",
|
||||
imageAlt: "AI learning data structure 3D",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/motion-lights-background-concept_23-2148241225.jpg",
|
||||
imageAlt: "cybernetic tech connections",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/illustration-circle-with-abstract-neon-light-effects-great-futuristic-background_181624-32778.jpg",
|
||||
imageAlt: "robotic arm AI concept",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fiber-optics-lights-abstract-background_23-2148241222.jpg",
|
||||
imageAlt: "particle cloud AI visualization",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-circuit-board-close-up_23-2149174334.jpg",
|
||||
imageAlt: "advanced AI processor 3D",
|
||||
},
|
||||
{ videoSrc: "https://www.w3schools.com/howto/rain.mp4", videoAriaLabel: "AI abstract visualization" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg", imageAlt: "AI learning data structure 3D" },
|
||||
{ videoSrc: "https://www.w3schools.com/howto/rain.mp4", videoAriaLabel: "Neural network connections" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/illustration-circle-with-abstract-neon-light-effects-great-futuristic-background_181624-32778.jpg", imageAlt: "robotic arm AI concept" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -103,9 +64,8 @@ export default function LandingPage() {
|
||||
description="We are dedicated to bridging the technological gap by providing bespoke AI solutions for local and global enterprises."
|
||||
subdescription="Our team of engineers specializes in large language models, computer vision, and autonomous systems."
|
||||
icon={Sparkles}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/futurism-perspective-digital-nomads-lifestyle_23-2151252421.jpg"
|
||||
videoSrc="https://www.w3schools.com/howto/rain.mp4"
|
||||
mediaAnimation="blur-reveal"
|
||||
imageAlt="tech agency office futuristic"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -114,21 +74,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Data Analytics",
|
||||
description: "Predictive insights powered by advanced neural networks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-cup-coffee-with-tablet-background_1098-3450.jpg",
|
||||
},
|
||||
{
|
||||
title: "Machine Learning",
|
||||
description: "Custom models tailored for your specific business logic.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-network-concept-with-thread_23-2148999217.jpg",
|
||||
},
|
||||
{
|
||||
title: "Computer Vision",
|
||||
description: "Automated visual processing with sub-millisecond latency.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/macro-eye-iris_23-2151618590.jpg",
|
||||
},
|
||||
{ title: "Data Analytics", description: "Predictive insights powered by advanced neural networks.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
{ title: "Machine Learning", description: "Custom models tailored for your specific business logic.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
{ title: "Computer Vision", description: "Automated visual processing with sub-millisecond latency.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
]}
|
||||
title="Core AI Capabilities"
|
||||
description="Powerful infrastructure for your digital transformation."
|
||||
@@ -142,42 +90,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Neural Insight",
|
||||
price: "$999",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-admin-office-sing-tablet-design-machine-learning-algorithms_482257-112941.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Vision Automator",
|
||||
price: "$1299",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/surveillance-hacking-room-with-russian-flag-big-screen_482257-127592.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "BotForge LLM",
|
||||
price: "$1599",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-switching-bulbs-using-voice-command-tablet_482257-8730.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "DataGuard AI",
|
||||
price: "$799",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/futuristic-infographic-collection_23-2148473527.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Vision Pro",
|
||||
price: "$1899",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/military-drone-control-outpost-spreading-misinformation-russian-government_482257-124740.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Agentic Core",
|
||||
price: "$2199",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-tech-office-ready-stock-trading_482257-121465.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Neural Insight", price: "$999", imageSrc: "http://img.b2bpic.net/free-photo/close-up-admin-office-sing-tablet-design-machine-learning-algorithms_482257-112941.jpg" },
|
||||
{ id: "p2", name: "Vision Automator", price: "$1299", imageSrc: "http://img.b2bpic.net/free-photo/surveillance-hacking-room-with-russian-flag-big-screen_482257-127592.jpg" },
|
||||
{ id: "p3", name: "BotForge LLM", price: "$1599", imageSrc: "http://img.b2bpic.net/free-photo/man-switching-bulbs-using-voice-command-tablet_482257-8730.jpg" },
|
||||
]}
|
||||
title="Our AI Suite"
|
||||
description="Off-the-shelf AI products for rapid deployment."
|
||||
@@ -190,27 +105,9 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "15+",
|
||||
title: "AI Models Trained",
|
||||
description: "Successfully deployed models.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-office-displays-statistics_482257-119484.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "20%",
|
||||
title: "Efficiency Gain",
|
||||
description: "Average client processing boost.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/finger-pressing-digital-graphic_1134-293.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "100%",
|
||||
title: "Uptime",
|
||||
description: "Reliable enterprise infrastructure.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-investor-looking-stock-trade-sales-computer-using-financial-statistics-plan-business-investment-growth-market-analyst-working-with-real-time-forex-exchange-graphs_482257-40949.jpg",
|
||||
},
|
||||
{ id: "m1", value: "15+", title: "AI Models Trained", description: "Successfully deployed models.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
{ id: "m2", value: "20%", title: "Efficiency Gain", description: "Average client processing boost.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
{ id: "m3", value: "100%", title: "Uptime", description: "Reliable enterprise infrastructure.", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
]}
|
||||
title="By The Numbers"
|
||||
description="Our growth and impact metrics."
|
||||
@@ -222,46 +119,8 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Game Changer",
|
||||
quote: "They transformed our data pipeline.",
|
||||
name: "Ali Hassan",
|
||||
role: "CTO",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/waist-up-confident-businessman-office_329181-19349.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "Fast Deployment",
|
||||
quote: "Incredible delivery speed.",
|
||||
name: "Sara Malik",
|
||||
role: "Founder",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-viewer-changing-channels-television-set-with-remote-control_482257-92306.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Innovation Leader",
|
||||
quote: "The best AI team in Pakistan.",
|
||||
name: "Omar Raza",
|
||||
role: "Manager",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businessman-with-crossed-arms_23-2147955274.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Highly Professional",
|
||||
quote: "Great communication and expertise.",
|
||||
name: "Fatima Noor",
|
||||
role: "CEO",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beauty-style-fashion-age-concept-close-up-portrait-positive-elegant-60-year-old-female-with-gray-hair-wrinkled-face-posing-against-white-brick-wall_344912-1854.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Future Focused",
|
||||
quote: "Cutting edge solutions every time.",
|
||||
name: "Zaid Iqbal",
|
||||
role: "Lead Engineer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-smiling-handsome-man-holding-tablet-computer-looking-straight-front_342744-405.jpg",
|
||||
},
|
||||
{ id: "t1", title: "Game Changer", quote: "They transformed our data pipeline.", name: "Ali Hassan", role: "CTO", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
{ id: "t2", title: "Fast Deployment", quote: "Incredible delivery speed.", name: "Sara Malik", role: "Founder", videoSrc: "https://www.w3schools.com/howto/rain.mp4" },
|
||||
]}
|
||||
title="Client Success"
|
||||
description="Hear from our partners."
|
||||
@@ -269,27 +128,15 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
<FaqDouble
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What AI services do you offer?",
|
||||
content: "We offer full-cycle AI development.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "How do we start?",
|
||||
content: "Contact us for a discovery meeting.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Is my data secure?",
|
||||
content: "Security is our top priority.",
|
||||
},
|
||||
{ id: "1", title: "What AI services do you offer?", content: "We offer full-cycle AI development." },
|
||||
{ id: "2", title: "How do we start?", content: "Contact us for a discovery meeting." },
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
title="Questions?"
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="split"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -299,53 +146,20 @@ export default function LandingPage() {
|
||||
title="Start Your AI Journey"
|
||||
description="Get in touch today to discuss your project."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email",
|
||||
required: true,
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email", required: true },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/joyful-entrepreneur-talking-with-remote-coworker-online-videocall_482257-77697.jpg"
|
||||
imageAlt="modern tech office reception"
|
||||
videoSrc="https://www.w3schools.com/howto/rain.mp4"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
<FooterMedia
|
||||
videoSrc="https://www.w3schools.com/howto/rain.mp4"
|
||||
logoText="PAK-AI"
|
||||
columns={[
|
||||
{ title: "Navigation", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#features" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #000000;
|
||||
--card: #0c0c0c;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #106EFB;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #e6e6e6;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #000000;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #535353;
|
||||
--background-accent: #106EFB;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user