170 lines
11 KiB
TypeScript
170 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import ReactLenis from "lenis/react";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
|
|
import FeatureBento from "@/components/sections/feature/FeatureBento";
|
|
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
|
|
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
|
import TeamCardFive from "@/components/sections/team/TeamCardFive";
|
|
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
|
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
|
import { Sparkles, Search, ArrowUpRight, Shield, Award, Users, MessageCircle } from "lucide-react";
|
|
|
|
export default function WebAgency2Page() {
|
|
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="Webcraft Studio"
|
|
navItems={[
|
|
{ name: "Work", id: "work" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
button={{ text: "Contact us", href: "#contact" }}
|
|
/>
|
|
<HeroSplitDoubleCarousel
|
|
title="Bespoke Digital Solutions for Modern Brands"
|
|
description="At Webcraft Studio, we blend artistic craftsmanship with rigorous technical engineering to build high-performance digital platforms that drive business growth."
|
|
tag="Premium Web Agency"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "canvas-reveal" }}
|
|
buttons={[
|
|
{ text: "Our Projects", href: "#work" },
|
|
{ text: "Discuss Project", href: "#contact" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
carouselPosition="right"
|
|
leftCarouselItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-psd/template-landing-page-website-furniture_145275-346.jpg", imageAlt: "Elegant UI design interface" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-with-businessman-patching-something-keyboard-graphics-monitor_482257-32827.jpg", imageAlt: "Corporate dashboard" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg", imageAlt: "Creative agency portfolio site" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-tube-product-with-gift-box-balloons-black-background_187299-46830.jpg", imageAlt: "Luxury product showcase" },
|
|
]}
|
|
rightCarouselItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-architect-using-tablet-with-touch-screen-analyze-building-model-architectural-development-man-engineer-working-with-device-construction-layout-design_482257-39970.jpg", imageAlt: "Tech platform layout" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/cartoon-clean-phone-left-side-white-background_187299-35394.jpg", imageAlt: "Mobile app preview" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/antique-word-website-template-layout-cursor-graphic_53876-120899.jpg", imageAlt: "Webcraft studio custom project" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-vector/web-elements-set_1057-409.jpg", imageAlt: "Interactive web module" },
|
|
]}
|
|
carouselItemClassName="!aspect-[4/5]"
|
|
/>
|
|
<FeatureBento
|
|
title="Our Digital Craft"
|
|
description="We specialize in high-impact services designed to scale your vision, from strategic architectural planning to high-performance development."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
features={[
|
|
{ title: "Web Strategy", description: "Defining the digital architecture that turns passive browsers into active brand advocates.", bentoComponent: "reveal-icon", icon: ArrowUpRight },
|
|
{ title: "Custom Development", description: "Hand-crafted, performant, and scalable web experiences built for high-traffic environments.", bentoComponent: "media-stack", items: [{ imageSrc: "http://img.b2bpic.net/free-photo/technology-internet-big-data-background_1387-1012.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-with-laptop-coffee-shop_23-2148002357.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/data-center-engineer-using-tablet-interpret-ai-generated-data-analytics-graphs_482257-126666.jpg" }] },
|
|
{ title: "Search Precision", description: "Advanced visibility strategies to dominate competitive digital marketplaces.", bentoComponent: "marquee", centerIcon: Search, variant: "text", texts: ["SEO Strategy", "Performance Audit", "Analytics Tracking", "Market Growth"] },
|
|
]}
|
|
/>
|
|
<FeatureCardTwentySix
|
|
title="Selected Works & Case Studies"
|
|
description="A collection of client projects demonstrating our dedication to precision, high-end style, and measurable growth."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{ title: "Vertex Cloud", description: "Scalable SaaS infrastructure portal architecture", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-content-management-system-web-template_23-2148811889.jpg", buttonIcon: ArrowUpRight },
|
|
{ title: "Bloom & Co", description: "Conversion-optimized high-end lifestyle e-commerce site", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-using-laptop-after-shopping_23-2147786792.jpg", buttonIcon: ArrowUpRight },
|
|
{ title: "Nova Fintech", description: "Intuitive, secure financial data dashboard UI", imageSrc: "http://img.b2bpic.net/free-photo/modern-work-environment-empty-office-business-industry-enterprise-culture_482257-118995.jpg", buttonIcon: ArrowUpRight },
|
|
{ title: "Zenith Realty", description: "High-conversion property listing and search platform", imageSrc: "http://img.b2bpic.net/free-photo/architecture-real-estate-building-concept_53876-124771.jpg", buttonIcon: ArrowUpRight }
|
|
]}
|
|
/>
|
|
<div id="about">
|
|
<TeamCardFive
|
|
title="The Artisans"
|
|
description="Meet the multi-disciplinary team of creative designers and developers architecting digital success for our global partners."
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
team={[
|
|
{ id: "1", name: "Elena Marc", role: "Lead Creative Architect", imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-young-businessman-glasses_1262-3810.jpg" },
|
|
{ id: "2", name: "David Chen", role: "Technical Lead Developer", imageSrc: "http://img.b2bpic.net/free-photo/businessman-solving-startup-problems-with-laptop-archived-documents-looking-annual-statistics-report-find-issue-young-analyst-reviewing-papers-executive-strategy-plan_482257-65811.jpg" },
|
|
{ id: "3", name: "Sarah West", role: "UX Strategy Specialist", imageSrc: "http://img.b2bpic.net/free-photo/video-editor-worker-standing-front-camera-smiling-working-creative-agency-office-holding-la_482257-3426.jpg" }
|
|
]}
|
|
/>
|
|
</div>
|
|
<div id="testimonials">
|
|
<TestimonialCardTwo
|
|
title="Partnership Success"
|
|
description="Hear what our partners have to say about our collaborative process and the growth we help achieve."
|
|
textboxLayout="split"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "1", name: "Alex Rivers", role: "Founder at Zenith Realty", testimonial: "Webcraft Studio took our rough concept and built a digital brand that perfectly aligns with our high-end market. Simply outstanding." },
|
|
{ id: "2", name: "Jamie Smith", role: "Director at Nova Fintech", testimonial: "The attention to detail and technical execution was far beyond our expectations. A truly professional team." }
|
|
]}
|
|
/>
|
|
</div>
|
|
<MetricCardOne
|
|
title="Tangible Results"
|
|
description="We define our success through your growth. Here are the core metrics that define our agency impact."
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "1", value: "50+", title: "Successful Projects", description: "Delivered with precision and care", icon: Award },
|
|
{ id: "2", value: "98%", title: "Client Retention", description: "Partners choosing long-term growth", icon: Users },
|
|
{ id: "3", value: "24/7", title: "Reliability", description: "Constant uptime and expert monitoring", icon: Shield }
|
|
]}
|
|
/>
|
|
<div id="faq">
|
|
<FaqSplitMedia
|
|
title="Questions & Answers"
|
|
description="Everything you need to know about working with the Webcraft Studio team."
|
|
textboxLayout="split"
|
|
faqsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{ id: "1", title: "What makes Webcraft different?", content: "We emphasize bespoke, high-performance hand-coding over restrictive builders, ensuring faster load times, superior SEO, and a completely unique brand identity." },
|
|
{ id: "2", title: "How do we begin our journey?", content: "Fill out our discovery contact form, and our lead strategist will reach out to schedule an audit call to define a clear, actionable roadmap." },
|
|
{ id: "3", title: "Do you handle ongoing maintenance?", content: "Yes, we provide comprehensive monthly support packages to keep your platform optimized, secure, and updated with modern features." }
|
|
]}
|
|
/>
|
|
</div>
|
|
<div id="contact">
|
|
<ContactSplit
|
|
tag="Let's Collaborate"
|
|
title="Architect Your Digital Future"
|
|
description="Ready to elevate your digital presence? Send us a note about your project goals and requirements. We're ready to start building something exceptional."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<FooterCard
|
|
logoText="Webcraft Studio"
|
|
copyrightText="© 2025 | Webcraft Studio"
|
|
socialLinks={[
|
|
{ icon: MessageCircle, href: "#", ariaLabel: "Instagram" },
|
|
{ icon: MessageCircle, href: "#", ariaLabel: "LinkedIn" }
|
|
]}
|
|
/>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|