9 Commits

Author SHA1 Message Date
a36e24309d Update src/app/services/page.tsx 2026-04-15 15:15:09 +00:00
ccb238cabc Update src/app/services/page.tsx 2026-04-15 15:14:45 +00:00
299bba03c8 Update src/app/contact/page.tsx 2026-04-15 15:14:44 +00:00
e473ff8e9a Update src/app/about/page.tsx 2026-04-15 15:14:44 +00:00
8f93e5c839 Add src/app/services/page.tsx 2026-04-15 15:14:11 +00:00
b2bd0348e3 Add src/app/projects/page.tsx 2026-04-15 15:14:11 +00:00
666caa2cb7 Update src/app/page.tsx 2026-04-15 15:14:10 +00:00
574790d9bc Add src/app/contact/page.tsx 2026-04-15 15:14:10 +00:00
219dee1d7e Add src/app/about/page.tsx 2026-04-15 15:14:09 +00:00
5 changed files with 366 additions and 99 deletions

89
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,89 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FooterBase from "@/components/sections/footer/FooterBase";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import TextAbout from "@/components/sections/about/TextAbout";
import TeamCardFive from "@/components/sections/team/TeamCardFive";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import { Award, TrendingUp, Users } from "lucide-react";
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="metallic"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", id: "/" },
{ name: "Services", id: "/services" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
button={{ text: "Get Started", href: "/contact" }}
/>
<TextAbout
title="About Us"
tag="Our Story"
useInvertedBackground={false}
className="pt-32"
/>
<MetricCardOne
title="Our Impact"
description="We focus on results and long-term partnerships."
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{ id: "projects", value: "100+", title: "Projects", description: "Successfully delivered across all industries", icon: Award },
{ id: "satisfaction", value: "99%", title: "Satisfaction", description: "Client satisfaction rate and counting", icon: Users },
{ id: "years", value: "8+", title: "Years", description: "Of crafting exceptional digital experiences", icon: TrendingUp },
]}
/>
<TeamCardFive
title="Meet the Team"
description="The creative minds behind your next project."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
team={[
{ id: "1", name: "Sarah Miller", role: "Lead Developer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-1.webp", imageAlt: "Sarah Miller" },
{ id: "2", name: "Valentina Reyes", role: "Creative Director", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-2.webp", imageAlt: "Valentina Reyes" },
{ id: "3", name: "Carlos Mendoza", role: "UX Designer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/team-3.webp", imageAlt: "Carlos Mendoza" },
]}
/>
<ContactCTA
title="Join Our Journey"
description="Let's build something extraordinary together."
tag="Contact"
useInvertedBackground={false}
background={{ variant: "rotated-rays-animated" }}
buttons={[{ text: "Contact Us", href: "/contact" }]}
/>
<FooterBase
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] },
{ title: "Services", items: [{ label: "Web Development", href: "/services" }, { label: "SEO", href: "/services" }] },
{ title: "Connect", items: [{ label: "Twitter", href: "#" }, { label: "LinkedIn", href: "#" }] },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

77
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,77 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBase from "@/components/sections/footer/FooterBase";
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="metallic"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", id: "work" },
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
{ name: "Contact", id: "/contact" },
]}
button={{ text: "Get Started", href: "/contact" }}
/>
<div className="pt-32 pb-20">
<ContactSplit
tag="Contact Us"
title="Let's Start Your Next Project"
description="Have a vision you want to bring to life? We're here to help. Reach out and let's create something extraordinary together."
background={{ variant: "canvas-reveal" }}
useInvertedBackground={false}
mediaPosition="right"
/>
</div>
<FooterBase
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{
title: "Company", items: [
{ label: "About", href: "#about" },
{ label: "Services", href: "#services" },
{ label: "Work", href: "#work" },
{ label: "Contact", href: "/contact" },
],
},
{
title: "Services", items: [
{ label: "Web Development", href: "#" },
{ label: "SEO", href: "#" },
{ label: "Branding", href: "#" },
{ label: "UI/UX Design", href: "#" },
],
},
{
title: "Connect", items: [
{ label: "Twitter", href: "#" },
{ label: "LinkedIn", href: "#" },
{ label: "Instagram", href: "#" },
{ label: "Dribbble", href: "#" },
],
},
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -36,9 +36,9 @@ export default function WebAgency2Page() {
{ name: "Work", id: "work" }, { name: "Work", id: "work" },
{ name: "Services", id: "services" }, { name: "Services", id: "services" },
{ name: "About", id: "about" }, { name: "About", id: "about" },
{ name: "Contact", id: "contact" }, { name: "Contact", id: "/contact" },
]} ]}
button={{ text: "Get Started", href: "#contact" }} button={{ text: "Get Started", href: "/contact" }}
/> />
<HeroSplitDoubleCarousel <HeroSplitDoubleCarousel
title="We Build Digital Experiences" title="We Build Digital Experiences"
@@ -48,7 +48,7 @@ export default function WebAgency2Page() {
tagAnimation="slide-up" tagAnimation="slide-up"
background={{ variant: "canvas-reveal" }} background={{ variant: "canvas-reveal" }}
buttons={[ buttons={[
{ text: "Start Project", href: "#contact" }, { text: "Start Project", href: "/contact" },
{ text: "View Work", href: "#work" }, { text: "View Work", href: "#work" },
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
@@ -78,28 +78,18 @@ export default function WebAgency2Page() {
buttonAnimation="slide-up" buttonAnimation="slide-up"
features={[ features={[
{ {
title: "SEO", title: "SEO", description: "We optimize your website to rank higher on search engines and drive organic traffic.", bentoComponent: "marquee", centerIcon: Search,
description: "We optimize your website to rank higher on search engines and drive organic traffic.", variant: "text", texts: ["Keywords", "Backlinks", "Meta Tags", "Organic Traffic", "Rankings", "Analytics", "SERP", "Indexing"],
bentoComponent: "marquee",
centerIcon: Search,
variant: "text",
texts: ["Keywords", "Backlinks", "Meta Tags", "Organic Traffic", "Rankings", "Analytics", "SERP", "Indexing"],
}, },
{ {
title: "Web Development", title: "Web Development", description: "Custom-built websites that are fast, responsive, and designed to convert.", bentoComponent: "media-stack", items: [
description: "Custom-built websites that are fast, responsive, and designed to convert.",
bentoComponent: "media-stack",
items: [
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp", imageAlt: "Web project - AgentFlow AI platform" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp", imageAlt: "Web project - AgentFlow AI platform" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp", imageAlt: "Web project - Architecture studio" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp", imageAlt: "Web project - Architecture studio" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-3.webp", imageAlt: "Web project - Summit Roofing" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-3.webp", imageAlt: "Web project - Summit Roofing" },
], ],
}, },
{ {
title: "Branding", title: "Branding", description: "Build a memorable brand identity that resonates with your audience.", bentoComponent: "media-stack", items: [
description: "Build a memorable brand identity that resonates with your audience.",
bentoComponent: "media-stack",
items: [
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp", imageAlt: "Brand project 1" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-1.webp", imageAlt: "Brand project 1" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp", imageAlt: "Brand project 2" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-2.webp", imageAlt: "Brand project 2" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-4.webp", imageAlt: "Brand project 3" }, { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/shot-4.webp", imageAlt: "Brand project 3" },
@@ -117,45 +107,20 @@ export default function WebAgency2Page() {
cardClassName="!h-auto aspect-video" cardClassName="!h-auto aspect-video"
features={[ features={[
{ {
title: "Umbra Skincare", title: "Umbra Skincare", description: "Luxury fragrance e-commerce", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", imageAlt: "Umbra Skincare website", buttonIcon: ArrowUpRight,
description: "Luxury fragrance e-commerce", buttonHref: "#"},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp",
imageAlt: "Umbra Skincare website",
buttonIcon: ArrowUpRight,
buttonHref: "#",
},
{ {
title: "Luxuria Travel", title: "Luxuria Travel", description: "Bespoke luxury travel experiences", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", imageAlt: "Luxuria Travel website", buttonIcon: ArrowUpRight,
description: "Bespoke luxury travel experiences", buttonHref: "#"},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp",
imageAlt: "Luxuria Travel website",
buttonIcon: ArrowUpRight,
buttonHref: "#",
},
{ {
title: "Dental Care", title: "Dental Care", description: "Premier dental practice", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp", imageAlt: "Luxury Dental Care website", buttonIcon: ArrowUpRight,
description: "Premier dental practice", buttonHref: "#"},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp",
imageAlt: "Luxury Dental Care website",
buttonIcon: ArrowUpRight,
buttonHref: "#",
},
{ {
title: "Summit Roofing", title: "Summit Roofing", description: "Professional roofing services", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp", imageAlt: "Summit Roofing website", buttonIcon: ArrowUpRight,
description: "Professional roofing services", buttonHref: "#"},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp",
imageAlt: "Summit Roofing website",
buttonIcon: ArrowUpRight,
buttonHref: "#",
},
{ {
title: "Dubai Real Estate", title: "Dubai Real Estate", description: "Luxury property listings", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp", imageAlt: "Dubai Real Estate website", buttonIcon: ArrowUpRight,
description: "Luxury property listings", buttonHref: "#"},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-5.webp",
imageAlt: "Dubai Real Estate website",
buttonIcon: ArrowUpRight,
buttonHref: "#",
},
]} ]}
/> />
<FeatureBento <FeatureBento
@@ -166,14 +131,9 @@ export default function WebAgency2Page() {
animationType="slide-up" animationType="slide-up"
features={[ features={[
{ {
title: "All Devices Optimization", title: "All Devices Optimization", description: "Pixel-perfect websites that look stunning on every screen size and device.", bentoComponent: "phone", statusIcon: Lock,
description: "Pixel-perfect websites that look stunning on every screen size and device.",
bentoComponent: "phone",
statusIcon: Lock,
alertIcon: Monitor, alertIcon: Monitor,
alertTitle: "Responsive check", alertTitle: "Responsive check", alertMessage: "All breakpoints passed", apps: [
alertMessage: "All breakpoints passed",
apps: [
{ name: "Phone", icon: Phone }, { name: "Phone", icon: Phone },
{ name: "SMS", icon: MessageCircle }, { name: "SMS", icon: MessageCircle },
{ name: "Books", icon: BookOpen }, { name: "Books", icon: BookOpen },
@@ -185,29 +145,17 @@ export default function WebAgency2Page() {
], ],
}, },
{ {
title: "Secure Hosting", title: "Secure Hosting", description: "Enterprise-grade security and 99.9% uptime for your website.", bentoComponent: "reveal-icon", icon: Shield,
description: "Enterprise-grade security and 99.9% uptime for your website.",
bentoComponent: "reveal-icon",
icon: Shield,
}, },
{ {
title: "Fast Turnaround", title: "Fast Turnaround", description: "From concept to launch in record time without sacrificing quality.", bentoComponent: "timeline", heading: "Project Launch", subheading: "Week 1", items: [
description: "From concept to launch in record time without sacrificing quality.",
bentoComponent: "timeline",
heading: "Project Launch",
subheading: "Week 1",
items: [
{ label: "Discovery & wireframes", detail: "Day 1-3" }, { label: "Discovery & wireframes", detail: "Day 1-3" },
{ label: "Design & development", detail: "Day 4-10" }, { label: "Design & development", detail: "Day 4-10" },
{ label: "Testing & deployment", detail: "Day 11-14" }, { label: "Testing & deployment", detail: "Day 11-14" },
], ],
completedLabel: "Live", completedLabel: "Live"},
},
{ {
title: "Seamless Integrations", title: "Seamless Integrations", description: "Connect with the tools you already use — CRMs, analytics, payments, and more.", bentoComponent: "orbiting-icons", centerIcon: Puzzle,
description: "Connect with the tools you already use — CRMs, analytics, payments, and more.",
bentoComponent: "orbiting-icons",
centerIcon: Puzzle,
items: [ items: [
{ icon: Shield }, { icon: Shield },
{ icon: Monitor }, { icon: Monitor },
@@ -216,10 +164,7 @@ export default function WebAgency2Page() {
], ],
}, },
{ {
title: "Growth Trends", title: "Growth Trends", description: "Data-driven insights to optimize your search presence and drive traffic.", bentoComponent: "line-chart"},
description: "Data-driven insights to optimize your search presence and drive traffic.",
bentoComponent: "line-chart",
},
]} ]}
/> />
<TestimonialCardFifteen <TestimonialCardFifteen
@@ -254,21 +199,11 @@ export default function WebAgency2Page() {
animationType="slide-up" animationType="slide-up"
negativeCard={{ negativeCard={{
items: [ items: [
"Generic templates with no personality", "Generic templates with no personality", "Slow load times and poor performance", "No SEO strategy or search visibility", "Outdated design that hurts credibility", "No ongoing support after launch"],
"Slow load times and poor performance",
"No SEO strategy or search visibility",
"Outdated design that hurts credibility",
"No ongoing support after launch",
],
}} }}
positiveCard={{ positiveCard={{
items: [ items: [
"Custom designs tailored to your brand", "Custom designs tailored to your brand", "Lightning-fast performance on all devices", "Built-in SEO to drive organic traffic", "Modern design that builds trust", "Dedicated support and maintenance"],
"Lightning-fast performance on all devices",
"Built-in SEO to drive organic traffic",
"Modern design that builds trust",
"Dedicated support and maintenance",
],
}} }}
/> />
<TeamCardFive <TeamCardFive
@@ -304,7 +239,7 @@ export default function WebAgency2Page() {
description="Let's build something extraordinary together. Get in touch and let's discuss your next project." description="Let's build something extraordinary together. Get in touch and let's discuss your next project."
background={{ variant: "rotated-rays-animated" }} background={{ variant: "rotated-rays-animated" }}
buttons={[ buttons={[
{ text: "Start Your Project", href: "#contact" }, { text: "Start Your Project", href: "/contact" },
{ text: "View Our Work", href: "#work" }, { text: "View Our Work", href: "#work" },
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
@@ -315,17 +250,15 @@ export default function WebAgency2Page() {
copyrightText="© 2026 | Webild" copyrightText="© 2026 | Webild"
columns={[ columns={[
{ {
title: "Company", title: "Company", items: [
items: [
{ label: "About", href: "#about" }, { label: "About", href: "#about" },
{ label: "Services", href: "#services" }, { label: "Services", href: "#services" },
{ label: "Work", href: "#work" }, { label: "Work", href: "#work" },
{ label: "Contact", href: "#contact" }, { label: "Contact", href: "/contact" },
], ],
}, },
{ {
title: "Services", title: "Services", items: [
items: [
{ label: "Web Development", href: "#" }, { label: "Web Development", href: "#" },
{ label: "SEO", href: "#" }, { label: "SEO", href: "#" },
{ label: "Branding", href: "#" }, { label: "Branding", href: "#" },
@@ -333,8 +266,7 @@ export default function WebAgency2Page() {
], ],
}, },
{ {
title: "Connect", title: "Connect", items: [
items: [
{ label: "Twitter", href: "#" }, { label: "Twitter", href: "#" },
{ label: "LinkedIn", href: "#" }, { label: "LinkedIn", href: "#" },
{ label: "Instagram", href: "#" }, { label: "Instagram", href: "#" },

92
src/app/projects/page.tsx Normal file
View File

@@ -0,0 +1,92 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
import FooterBase from "@/components/sections/footer/FooterBase";
import { ArrowUpRight } from "lucide-react";
export default function ProjectsPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="metallic"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", id: "/#work" },
{ name: "Projects", id: "/projects" },
{ name: "Services", id: "/#services" },
{ name: "About", id: "/#about" },
{ name: "Contact", id: "/#contact" },
]}
button={{ text: "Get Started", href: "/#contact" }}
/>
<div className="pt-32 pb-20">
<FeatureCardTwentySix
title="Portfolio"
description="Discover our latest digital success stories across various industries."
textboxLayout="default"
useInvertedBackground={false}
cardClassName="!h-auto aspect-video"
features={[
{
title: "Umbra Skincare", description: "Luxury fragrance e-commerce", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-1.webp", imageAlt: "Umbra Skincare website", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Luxuria Travel", description: "Bespoke luxury travel experiences", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-2.webp", imageAlt: "Luxuria Travel website", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Dental Care", description: "Premier dental practice", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-3.webp", imageAlt: "Luxury Dental Care website", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Summit Roofing", description: "Professional roofing services", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/project-4.webp", imageAlt: "Summit Roofing website", buttonIcon: ArrowUpRight,
buttonHref: "#"},
]}
/>
</div>
<FooterBase
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{
title: "Company", items: [
{ label: "About", href: "/#about" },
{ label: "Services", href: "/#services" },
{ label: "Work", href: "/#work" },
{ label: "Contact", href: "/#contact" },
],
},
{
title: "Services", items: [
{ label: "Web Development", href: "#" },
{ label: "SEO", href: "#" },
{ label: "Branding", href: "#" },
{ label: "UI/UX Design", href: "#" },
],
},
{
title: "Connect", items: [
{ label: "Twitter", href: "#" },
{ label: "LinkedIn", href: "#" },
{ label: "Instagram", href: "#" },
{ label: "Dribbble", href: "#" },
],
},
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

77
src/app/services/page.tsx Normal file
View File

@@ -0,0 +1,77 @@
"use client";
import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FooterBase from "@/components/sections/footer/FooterBase";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FeatureBento from "@/components/sections/feature/FeatureBento";
import { Search } from "lucide-react";
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="metallic"
secondaryButtonStyle="glass"
headingFontWeight="medium"
>
<ReactLenis root>
<NavbarLayoutFloatingOverlay
brandName="Webild"
navItems={[
{ name: "Work", id: "/" },
{ name: "Services", id: "/services" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
]}
button={{ text: "Get Started", href: "/contact" }}
/>
<FeatureBento
title="Our Services"
description="Full suite of digital capabilities."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
className="pt-32"
features={[
{
title: "SEO", description: "Strategic search optimization to drive organic growth.", bentoComponent: "marquee", centerIcon: Search,
variant: "text", texts: ["Keywords", "Backlinks", "Meta Tags", "Rankings", "Analytics"],
},
{
title: "Web Development", description: "Custom high-performance web solutions.", bentoComponent: "media-stack", items: [
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp?_wi=1", imageAlt: "Dev 1" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-1.webp", imageAlt: "Dev 2" },
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/web-agency-2/dev-2.webp?_wi=2", imageAlt: "Dev 3" },
],
},
]}
/>
<ContactCTA
title="Ready to Start?"
description="Let's discuss how we can help your brand."
tag="Contact"
useInvertedBackground={false}
background={{ variant: "rotated-rays-animated" }}
buttons={[{ text: "Get Started", href: "/contact" }]}
/>
<FooterBase
logoText="Webild"
copyrightText="© 2026 | Webild"
columns={[
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] },
{ title: "Services", items: [{ label: "Web Development", href: "/services" }, { label: "SEO", href: "/services" }] },
{ title: "Connect", items: [{ label: "Twitter", href: "#" }, { label: "LinkedIn", href: "#" }] },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}