Files
5edcbd8d-7365-4eec-b1da-76e…/src/app/page.tsx
2026-02-04 22:57:04 +00:00

232 lines
12 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Instagram, Mail, Rocket, Sparkles, Target, Video, Zap } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="small"
sizing="largeSmallSizeLargeTitles"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="double-inset"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="InClips Media"
navItems={[
{ name: "Services", id: "features" },
{ name: "Work", id: "product" },
{ name: "About", id: "about" },
{ name: "Testimonials", id: "testimonial" },
{ name: "Contact", id: "contact" }
]}
button={{ text: "Start Project", href: "contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogoBillboard
logoText="InClips Media"
description="We craft compelling digital narratives that elevate your brand. From content creation to strategic marketing, we deliver results that matter."
buttons={[
{ text: "Explore Our Work", href: "product" },
{ text: "Get in Touch", href: "contact" }
]}
background={{ variant: "sparkles-gradient" }}
imageSrc="https://img.b2bpic.net/free-photo/happy-young-colleagues-office-coworking_171337-17719.jpg"
imageAlt="InClips Media team collaborating on creative strategy"
frameStyle="card"
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "We are a creative-driven marketing agency transforming " },
{ type: "image", src: "https://img.b2bpic.net/free-vector/geometric-young-creative-agency-logo-template_742173-17664.jpg", alt: "InClips Media creative mark" },
{ type: "text", content: " brands through strategic storytelling and innovative digital solutions." }
]}
buttons={[
{ text: "Learn More", href: "#about" },
{ text: "Let's Collaborate", href: "contact" }
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="product" data-section="product">
<ProductCardOne
title="Our Digital Services"
description="Comprehensive marketing solutions tailored to elevate your brand presence and drive measurable growth."
tag="Services"
products={[
{
id: "1", name: "Content Creation", price: "Strategic Visual Storytelling", imageSrc: "https://img.b2bpic.net/free-photo/young-happy-colleagues-sitting-office-coworking_171337-17717.jpg", imageAlt: "Professional content creation and video production"
},
{
id: "2", name: "Social Media Marketing", price: "Community Building & Engagement", imageSrc: "https://img.b2bpic.net/free-photo/people-brainstorming-work-meeting_23-2148985491.jpg", imageAlt: "Social media strategy and campaign management"
},
{
id: "3", name: "Brand Strategy", price: "Identity & Positioning", imageSrc: "https://img.b2bpic.net/free-vector/minimal-colorful-business-card-template_23-2148371471.jpg", imageAlt: "Brand development and identity design"
}
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="features" data-section="features">
<FeatureBento
title="Why Choose InClips Media"
description="We combine creative excellence with data-driven strategies to deliver marketing solutions that actually work."
features={[
{
title: "Creative Excellence", description: "Award-winning creative team producing visually stunning and strategically sound campaigns.", bentoComponent: "reveal-icon", icon: Sparkles
},
{
title: "Data-Driven Strategy", description: "Every campaign backed by analytics and insights to maximize ROI and measurable results.", bentoComponent: "animated-bar-chart"
},
{
title: "Multi-Channel Expertise", description: "Seamless integration across social media, email, content, and paid advertising platforms.", bentoComponent: "orbiting-icons", centerIcon: Target,
items: [
{ icon: Instagram, ring: 1 },
{ icon: Mail, ring: 2 },
{ icon: Video, ring: 2 },
{ icon: Zap, ring: 3 }
]
},
{
title: "Rapid Turnaround", description: "Agile workflow ensuring quick delivery without compromising quality or strategic depth.", bentoComponent: "timeline", heading: "Project Timeline", subheading: "From brief to delivery", items: [
{ label: "Discovery", detail: "Understanding your goals and audience" },
{ label: "Strategy", detail: "Developing comprehensive marketing plan" },
{ label: "Execution", detail: "Creating and launching campaigns" }
],
completedLabel: "Complete"
}
]}
textboxLayout="default"
animationType="blur-reveal"
useInvertedBackground="noInvert"
carouselMode="buttons"
/>
</div>
<div id="testimonial" data-section="testimonial">
<TestimonialCardFifteen
testimonial="InClips Media transformed our brand's online presence. Their strategic approach and creative execution delivered a 250% increase in engagement within three months. Truly exceptional work."
rating={5}
author="Sarah Mitchell, CEO of TechVenture"
avatars={[
{ src: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", alt: "Sarah Mitchell" },
{ src: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg", alt: "James Chen" },
{ src: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg", alt: "Emma Rodriguez" },
{ src: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg", alt: "David Kim" }
]}
useInvertedBackground="noInvert"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
title="Common Questions"
description="Find answers to frequently asked questions about our services, process, and partnership approach."
faqs={[
{
id: "1", title: "What is your typical project timeline?", content: "Most projects range from 4-12 weeks depending on scope. We work with you to establish realistic timelines and maintain clear communication throughout the process."
},
{
id: "2", title: "How do you measure campaign success?", content: "We establish clear KPIs at project start and provide detailed analytics reports. We track engagement, conversions, reach, and ROI to ensure every marketing dollar is optimized."
},
{
id: "3", title: "What industries do you specialize in?", content: "We work across diverse sectors including tech startups, e-commerce, professional services, and consumer brands. Our experience spans multiple industries with proven results."
},
{
id: "4", title: "Do you offer ongoing retainer services?", content: "Yes, we provide flexible retainer packages for ongoing social media management, content creation, and strategy consultation tailored to your needs."
},
{
id: "5", title: "How much does a campaign typically cost?", content: "Pricing varies based on scope, complexity, and deliverables. We provide custom quotes after understanding your goals. We work with all budget sizes from startups to enterprises."
},
{
id: "6", title: "Can you help with content distribution?", content: "Absolutely. We handle the complete content lifecycle from creation to strategic distribution across your preferred channels for maximum impact."
}
]}
imageSrc="https://img.b2bpic.net/free-photo/people-working-call-center_23-2149288189.jpg"
imageAlt="InClips Media team providing customer support"
textboxLayout="default"
useInvertedBackground="noInvert"
mediaPosition="left"
animationType="smooth"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Get Started"
title="Ready to Elevate Your Brand?"
description="Let's discuss how InClips Media can transform your digital marketing strategy. Get in touch to schedule a consultation with our team."
tagIcon={Rocket}
background={{ variant: "gradient-bars" }}
useInvertedBackground="noInvert"
inputPlaceholder="your@email.com"
buttonText="Schedule Consultation"
termsText="We respect your privacy. Your information is secure and we'll never spam you."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="InClips Media"
columns={[
{
title: "Services", items: [
{ label: "Content Creation", href: "#services" },
{ label: "Social Media Marketing", href: "#services" },
{ label: "Brand Strategy", href: "#services" }
]
},
{
title: "Company", items: [
{ label: "About Us", href: "#about" },
{ label: "Work", href: "#work" },
{ label: "Testimonials", href: "#testimonial" }
]
},
{
title: "Connect", items: [
{ label: "Contact", href: "#contact" },
{ label: "LinkedIn", href: "https://linkedin.com" },
{ label: "Instagram", href: "https://instagram.com" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#privacy" },
{ label: "Terms of Service", href: "#terms" },
{ label: "Contact Policy", href: "#contact-policy" }
]
}
]}
copyrightText="© 2025 InClips Media. All rights reserved."
/>
</div>
</ThemeProvider>
);
}