Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-22 16:20:32 +00:00

View File

@@ -1,373 +1,128 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
export default function LandingPage() {
export default function Page() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="medium"
sizing="largeSmallSizeLargeTitles"
background="noise"
cardStyle="glass-depth"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="medium"
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Services",
id: "services",
},
{
name: "Work",
id: "work",
},
{
name: "Process",
id: "process",
},
{
name: "Contact",
id: "cta",
},
]}
brandName="AzaanUllah Khan"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
background={{
variant: "gradient-bars",
}}
title="Websites that win clients for you."
description="I design and build premium websites for US service businesses — focused on conversions, not just aesthetics."
tag="Available for new projects"
buttons={[
{
text: "View my work",
href: "#work",
},
{
text: "Book a free call →",
href: "#cta",
},
]}
carouselItems={[
{
id: "c1",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg",
imageAlt: "minimal web design office desk",
},
{
id: "c2",
imageSrc: "http://img.b2bpic.net/free-photo/webpage-content-design-website-icon_53876-120651.jpg",
imageAlt: "web design project display screen",
},
{
id: "c3",
imageSrc: "http://img.b2bpic.net/free-photo/adult-businessman-sweater-intently-using-smartphone-while-working-laptop-city-cafe_574295-4320.jpg",
imageAlt: "professional freelancer working on laptop",
},
{
id: "c4",
imageSrc: "http://img.b2bpic.net/free-photo/hobby-education-academic-knowledge-book-study-concept_53876-124406.jpg",
imageAlt: "abstract minimalist graphic design background",
},
{
id: "c5",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hands-holding-paper_23-2149930960.jpg",
imageAlt: "design mockup on professional screen",
},
{
id: "c6",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-office-space-cartoon-style_23-2151043395.jpg",
imageAlt: "modern studio interior minimalist",
},
]}
/>
</div>
<div id="trust" data-section="trust">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"TechCorp",
"GrowthCo",
"InnovateLab",
"StartupXYZ",
"AgencyFlow",
"DigitalEdge",
"PixelPerfect",
]}
title="Trusted by ambitious teams"
description="Companies that demand exceptional digital results."
/>
</div>
<div id="services" data-section="services">
<FeatureCardMedia
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
id: "s1",
title: "Web Design",
description: "High-fidelity, conversion-focused interfaces tailored to your business goals.",
tag: "Design",
imageSrc: "http://img.b2bpic.net/free-photo/website-development-layout-sketch-drawing_53876-124188.jpg",
},
{
id: "s2",
title: "Web Development",
description: "Blazing fast, secure, and responsive builds optimized for performance.",
tag: "Development",
imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884869.jpg",
},
{
id: "s3",
title: "Conversion Strategy",
description: "Data-informed layout decisions to guide visitors toward specific actions.",
tag: "Strategy",
imageSrc: "http://img.b2bpic.net/free-photo/business-chart-visual-graphics-report-concept_53876-167093.jpg",
},
]}
title="Services built for conversion"
description="Premium design systems and high-converting web experiences."
/>
</div>
<div id="work" data-section="work">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Law Firm Houston",
price: "1.5x Leads",
imageSrc: "http://img.b2bpic.net/free-photo/law-judgement-rights-weighing-legal-concept_53876-124060.jpg",
},
{
id: "p2",
name: "Tech Startup Platform",
price: "20% Retention",
imageSrc: "http://img.b2bpic.net/free-vector/gradient-ui-ux-landing-page_52683-69728.jpg",
},
{
id: "p3",
name: "Clinic Web Portal",
price: "100% Satisfaction",
imageSrc: "http://img.b2bpic.net/free-photo/indian-physician-consulting-patient-medical-facility-chroma-key_482257-118431.jpg",
},
{
id: "p4",
name: "Luxury Real Estate",
price: "30% Increase",
imageSrc: "http://img.b2bpic.net/free-psd/real-estate-building-web-template_23-2149324968.jpg",
},
{
id: "p5",
name: "Fashion Storefront",
price: "50% Conversion",
imageSrc: "http://img.b2bpic.net/free-photo/woman-working-laptop-stairs-warm-light-home-office_169016-69174.jpg",
},
{
id: "p6",
name: "Analytics Software",
price: "2x Speed",
imageSrc: "http://img.b2bpic.net/free-photo/financial-application-ui-pc-screen-showing-company-revenue_482257-119232.jpg",
},
]}
title="Selected projects"
description="A collection of premium digital experiences."
/>
</div>
<div id="process" data-section="process">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{
id: "m1",
value: "Discovery",
title: "Define & Research",
description: "Deep dive into your business and audience needs.",
imageSrc: "http://img.b2bpic.net/free-photo/two-espionage-agents-reviewing-confidential-documents-vintage-library_482257-113968.jpg",
},
{
id: "m2",
value: "Execution",
title: "Design & Build",
description: "Iterative design and development with full transparency.",
imageSrc: "http://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148368370.jpg",
},
{
id: "m3",
value: "Delivery",
title: "Launch & Optimize",
description: "Deployment, testing, and continuous improvement cycles.",
imageSrc: "http://img.b2bpic.net/free-photo/indian-medic-consulting-her-patient-medical-facility-copy-space_482257-118104.jpg",
},
]}
title="My process"
description="Strategic, iterative, and transparent."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Sarah J.",
role: "CEO",
testimonial: "Exceptional vision and execution. Results exceeded expectations.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-fashionable-young-blonde-female-dressed-stylish-clothes-posing-isolated-looking-up-with-eyes-expressing-interest-curiosity-opening-mouth-human-facial-expressions_343059-4360.jpg",
},
{
id: "t2",
name: "Michael C.",
role: "CTO",
testimonial: "AzaanUllah delivers professional, high-impact results every single time.",
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-office-holding-tablet_23-2148356266.jpg",
},
{
id: "t3",
name: "Emily R.",
role: "Marketing Dir",
testimonial: "The best investment for our digital conversion strategy.",
imageSrc: "http://img.b2bpic.net/free-photo/experienced-grey-haired-businessman-standing_74855-9871.jpg",
},
{
id: "t4",
name: "David K.",
role: "Product Manager",
testimonial: "Expert design sense paired with clean, reliable development.",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
},
{
id: "t5",
name: "Jessica L.",
role: "Founder",
testimonial: "Professional, quick, and highly skilled. Highly recommended.",
imageSrc: "http://img.b2bpic.net/free-photo/female-employee-black-suit-looks-regretful_114579-15074.jpg",
},
]}
title="Client feedback"
description="Words from partners I've helped succeed."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "How long does a project take?",
content: "Typical project duration ranges from 3 to 6 weeks depending on scale.",
},
{
id: "f2",
title: "Do you offer ongoing support?",
content: "Yes, I offer monthly retainers for maintenance and growth optimization.",
},
{
id: "f3",
title: "What tools do you use?",
content: "Primarily Webflow, React, Next.js, and Framer for high-fidelity prototyping.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/fashionable-young-man-reading-e-book-his-generic-laptop-leaning-his-elbow-looking-interested-confident-freelancer-using-notebook-pc-remote-work-enjoying-rest-coffee-break_273609-1940.jpg"
title="Common questions"
description="Answers to get us started."
faqsAnimation="slide-up"
/>
</div>
<div id="cta" data-section="cta">
<ContactText
useInvertedBackground={false}
background={{
variant: "plain",
}}
text="Let's build something that works."
buttons={[
{
text: "Book my free call →",
href: "#",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Sitemap",
items: [
{
label: "Services",
href: "#services",
},
{
label: "Portfolio",
href: "#work",
},
{
label: "Process",
href: "#process",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
bottomLeftText="© 2024 AzaanUllah Khan."
bottomRightText="Usually responds within 24 hours."
/>
</div>
</ReactLenis>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Work", id: "#work" },
{ name: "Services", id: "#services" }
]}
brandName="AzaanUllah Khan"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
background={{ variant: "gradient-bars" }}
title="Websites that win clients for you."
description="I design and build premium websites for US service businesses — focused on conversions, not just aesthetics."
tag="Available for new projects"
buttons={[{ text: "View my work", href: "#work" }, { text: "Book a free call →", href: "#cta" }]}
carouselItems={[{id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/close-up-tidy-workspace-with-laptop_23-2148592296.jpg", imageAlt: "minimal web design office desk"}, {id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/webpage-content-design-website-icon_53876-120651.jpg", imageAlt: "web design project display screen"}, {id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/adult-businessman-sweater-intently-using-smartphone-while-working-laptop-city-cafe_574295-4320.jpg", imageAlt: "professional freelancer working on laptop"}, {id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/hobby-education-academic-knowledge-book-study-concept_53876-124406.jpg", imageAlt: "abstract minimalist graphic design background"}, {id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hands-holding-paper_23-2149930960.jpg", imageAlt: "design mockup on professional screen"}, {id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-office-space-cartoon-style_23-2151043395.jpg", imageAlt: "modern studio interior minimalist"}]}
/>
</div>
<div id="trust" data-section="trust">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={["TechCorp", "GrowthCo", "InnovateLab", "StartupXYZ", "AgencyFlow", "DigitalEdge", "PixelPerfect"]}
title="Trusted by ambitious teams"
description="Companies that demand exceptional digital results."
/>
</div>
<div id="services" data-section="services">
<FeatureCardMedia
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[{id: "s1", title: "Web Design", description: "High-fidelity, conversion-focused interfaces tailored to your business goals.", tag: "Design", imageSrc: "http://img.b2bpic.net/free-photo/website-development-layout-sketch-drawing_53876-124188.jpg"}, {id: "s2", title: "Web Development", description: "Blazing fast, secure, and responsive builds optimized for performance.", tag: "Development", imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884869.jpg"}, {id: "s3", title: "Conversion Strategy", description: "Data-informed layout decisions to guide visitors toward specific actions.", tag: "Strategy", imageSrc: "http://img.b2bpic.net/free-photo/business-chart-visual-graphics-report-concept_53876-167093.jpg"}]}
title="Services built for conversion"
description="Premium design systems and high-converting web experiences."
/>
</div>
<div id="work" data-section="work">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={false}
products={[{id: "p1", name: "Law Firm Houston", price: "1.5x Leads", imageSrc: "http://img.b2bpic.net/free-photo/law-judgement-rights-weighing-legal-concept_53876-124060.jpg"}, {id: "p2", name: "Tech Startup Platform", price: "20% Retention", imageSrc: "http://img.b2bpic.net/free-vector/gradient-ui-ux-landing-page_52683-69728.jpg"}, {id: "p3", name: "Clinic Web Portal", price: "100% Satisfaction", imageSrc: "http://img.b2bpic.net/free-photo/indian-physician-consulting-patient-medical-facility-chroma-key_482257-118431.jpg"}, {id: "p4", name: "Luxury Real Estate", price: "30% Increase", imageSrc: "http://img.b2bpic.net/free-psd/real-estate-building-web-template_23-2149324968.jpg"}, {id: "p5", name: "Fashion Storefront", price: "50% Conversion", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-laptop-stairs-warm-light-home-office_169016-69174.jpg"}, {id: "p6", name: "Analytics Software", price: "2x Speed", imageSrc: "http://img.b2bpic.net/free-photo/financial-application-ui-pc-screen-showing-company-revenue_482257-119232.jpg"}]}
title="Selected projects"
description="A collection of premium digital experiences."
/>
</div>
<div id="process" data-section="process">
<MetricCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
metrics={[{id: "m1", value: "Discovery", title: "Define & Research", description: "Deep dive into your business and audience needs.", imageSrc: "http://img.b2bpic.net/free-photo/two-espionage-agents-reviewing-confidential-documents-vintage-library_482257-113968.jpg"}, {id: "m2", value: "Execution", title: "Design & Build", description: "Iterative design and development with full transparency.", imageSrc: "http://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148368370.jpg"}, {id: "m3", value: "Delivery", title: "Launch & Optimize", description: "Deployment, testing, and continuous improvement cycles.", imageSrc: "http://img.b2bpic.net/free-photo/indian-medic-consulting-her-patient-medical-facility-copy-space_482257-118104.jpg"}]}
title="My process"
description="Strategic, iterative, and transparent."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[{id: "t1", name: "Sarah J.", role: "CEO", testimonial: "Exceptional vision and execution. Results exceeded expectations.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-fashionable-young-blonde-female-dressed-stylish-clothes-posing-isolated-looking-up-with-eyes-expressing-interest-curiosity-opening-mouth-human-facial-expressions_343059-4360.jpg"}, {id: "t2", name: "Michael C.", role: "CTO", testimonial: "AzaanUllah delivers professional, high-impact results every single time.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-office-holding-tablet_23-2148356266.jpg"}, {id: "t3", name: "Emily R.", role: "Marketing Dir", testimonial: "The best investment for our digital conversion strategy.", imageSrc: "http://img.b2bpic.net/free-photo/experienced-grey-haired-businessman-standing_74855-9871.jpg"}, {id: "t4", name: "David K.", role: "Product Manager", testimonial: "Expert design sense paired with clean, reliable development.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg"}, {id: "t5", name: "Jessica L.", role: "Founder", testimonial: "Professional, quick, and highly skilled. Highly recommended.", imageSrc: "http://img.b2bpic.net/free-photo/female-employee-black-suit-looks-regretful_114579-15074.jpg"}]}
title="Client feedback"
description="Words from partners I've helped succeed."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
useInvertedBackground={true}
faqs={[{id: "f1", title: "How long does a project take?", content: "Typical project duration ranges from 3 to 6 weeks depending on scale."}, {id: "f2", title: "Do you offer ongoing support?", content: "Yes, I offer monthly retainers for maintenance and growth optimization."}, {id: "f3", title: "What tools do you use?", content: "Primarily Webflow, React, Next.js, and Framer for high-fidelity prototyping."}]}
imageSrc="http://img.b2bpic.net/free-photo/fashionable-young-man-reading-e-book-his-generic-laptop-leaning-his-elbow-looking-interested-confident-freelancer-using-notebook-pc-remote-work-enjoying-rest-coffee-break_273609-1940.jpg"
title="Common questions"
description="Answers to get us started."
faqsAnimation="slide-up"
mediaAnimation="slide-up"
/>
</div>
<div id="cta" data-section="cta">
<ContactText
useInvertedBackground={false}
background={{ variant: "plain" }}
text="Let's build something that works."
buttons={[{ text: "Book my free call →", href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[{title: "Sitemap", items: [{label: "Services", href: "#services"}, {label: "Portfolio", href: "#work"}, {label: "Process", href: "#process"}]}, {title: "Legal", items: [{label: "Privacy Policy", href: "#"}, {label: "Terms of Service", href: "#"}]}]}
bottomLeftText="© 2024 AzaanUllah Khan."
bottomRightText="Usually responds within 24 hours."
/>
</div>
</ThemeProvider>
);
}