Files
0a4620be-695b-4869-8895-afb…/src/app/page.tsx
2026-06-11 09:29:02 +00:00

403 lines
24 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { CalendarDays } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="largeSizeMediumTitles"
background="aurora"
cardStyle="soft-shadow"
primaryButtonStyle="shadow"
secondaryButtonStyle="radial-glow"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "About", id: "#about"},
{
name: "Services", id: "#services"},
{
name: "Work", id: "#portfolio"},
{
name: "Results", id: "#results"},
{
name: "Contact", id: "#contact"},
]}
button={{
text: "Book a Call", href: "https://calendly.com/mjsn/30mins"}}
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ez7srKw0Muaa70ZMY6lLLNlrAg/uploaded-1781169772954-vlkbzdzz.png"
logoAlt="MJSN Agency Logo"
brandName="MJSN"
/>
</div>
<div id="hero" data-section="hero">
<HeroOverlayTestimonial
title="We Scale Brands Across Egypt · GCC · Europe"
description="Performance marketing agency powered by data, creativity, and AI-enhanced workflows."
testimonials={[
{
name: "Strategic Insight", handle: "Growth", testimonial: "Expert analysis and innovative solutions for measurable growth.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103638.jpg"},
{
name: "Creative Edge", handle: "Innovation", testimonial: "Captivating campaigns that resonate and convert across diverse markets.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/variety-gradient-forms-copy-space-surface-bubbles_23-2148290143.jpg"},
{
name: "AI-Powered", handle: "Efficiency", testimonial: "Advanced AI tools streamline workflows and maximize campaign performance.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/black-yellow-marble-textured_53876-94546.jpg"},
{
name: "Market Acumen", handle: "Precision", testimonial: "Targeted strategies with deep understanding of local and international nuances.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/abstract-brown-gradient-well-used-as-background-product-display_1258-88216.jpg"},
{
name: "Results Driven", handle: "Impact", testimonial: "Consistently delivering measurable ROI and substantial brand growth.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg"},
]}
tag="Now Booking — 2026"
tagIcon={CalendarDays}
buttons={[
{
text: "Book a Strategy Call", href: "https://calendly.com/mjsn/30mins"},
{
text: "View Our Work", href: "#portfolio"},
]}
imageSrc="http://img.b2bpic.net/free-photo/abstract-neon-lights-background_1017-2666.jpg"
imageAlt="Cinematic background of a data visualization hub for performance marketing"
showDimOverlay={true}
showBlur={true}
textPosition="bottom"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/handsome-muscular-young-man-posing_158595-3045.jpg", alt: "Satisfied client avatar 1"},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-woman-working-as-lawyer_23-2151152058.jpg", alt: "Satisfied client avatar 2"},
{
src: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background-glasses_158538-9601.jpg", alt: "Satisfied client avatar 3"},
{
src: "http://img.b2bpic.net/free-photo/digital-art-portrait-person-listening-music-headphones_23-2151065048.jpg", alt: "Satisfied client avatar 4"},
{
src: "http://img.b2bpic.net/free-photo/futuristic-fantasy-portrait-with-costume_23-2151159116.jpg", alt: "Satisfied client avatar 5"},
]}
avatarText="Join 150+ thriving brands"
/>
</div>
<div id="marquee" data-section="marquee">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"Paid Ads", "SEO", "Branding", "Meta Ads", "TikTok", "AI Automation", "Lead Gen", "Web Dev", "Content", "GCC", "Egypt", "Europe"]}
speed={60}
showCard={false}
title="" /* Added missing prop */
description="" /* Added missing prop */
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Unlocking Your Global Potential"
description="MJSN is a Cairo-based performance marketing agency with a global outlook. We combine deep Arabic-native content expertise with European-level execution standards, powered by AI-enhanced workflows. Our experience spans across diverse markets including the UAE, GCC, and broader Europe, ensuring your brand resonates with precision and impact."
metrics={[
{
value: "Egypt", title: "Home Market"},
{
value: "GCC", title: "Key Expansion"},
{
value: "Europe", title: "Global Reach"},
]}
imageSrc="http://img.b2bpic.net/free-photo/map-svalbard-jan-mayen-gold-glitter-map-dark-background_559531-10667.jpg"
imageAlt="Stylized map connecting Egypt, GCC, and Europe"
mediaAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
carouselMode="buttons"
features={[
{
title: "Paid Advertising", description: "Meta, Google, & TikTok ad campaigns optimized for maximum ROI.", imageSrc: "http://img.b2bpic.net/free-photo/line-graph-data-analysis-icon_53876-20801.jpg"},
{
title: "Social Media Marketing", description: "Engaging strategies to build community and amplify your brand voice.", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-hand-holding-gold-stars-business-concept_107791-15942.jpg"},
{
title: "SEO", description: "Boost your organic visibility and rank higher in search results.", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-25th-years-anniversary-celebration-pen-tool-created-clipping-path-included-jpeg-easy-composite_460848-12250.jpg"},
{
title: "Web Development", description: "Crafting high-performance websites and landing pages that convert.", imageSrc: "http://img.b2bpic.net/free-vector/creative-web-design-25-line-filled-icon-pack-such-as-internet-computer-design-web-design_1142-23177.jpg"},
{
title: "Branding & Identity", description: "Develop a distinct brand voice and visual identity that captivates.", imageSrc: "http://img.b2bpic.net/free-photo/open-book-icon-symbol-yellow-background-education-bookstore-concept-3d-rendering_56104-1334.jpg"},
{
title: "Influencer Marketing", description: "Connect with key opinion leaders to expand your market reach.", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-geometric-background_23-2150853661.jpg"},
{
title: "Content Creation", description: "From captivating visuals to persuasive copy, we tell your story.", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-flat-design-bookstore-logo-template_23-2149336469.jpg"},
{
title: "AI Automation & Workflows", description: "Streamline operations and enhance campaign efficiency with AI.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-data-center-worker-pointing-finger-ai-tech-pc-screen_482257-128444.jpg"},
{
title: "Lead Generation Funnels", description: "Build high-converting funnels to capture and nurture valuable leads.", imageSrc: "http://img.b2bpic.net/free-vector/cardano-blockchain-cryptocurrency-icon-vector-gold-open-source-finance-concept_53876-126028.jpg"},
]}
title="Our Core Services"
description="Comprehensive performance marketing solutions tailored to drive your brand's growth."
/>
</div>
<div id="results" data-section="results">
<MetricCardFourteen
useInvertedBackground={true}
title="Our Impact at a Glance"
tag="Proven Performance"
metrics={[
{
id: "m1", value: "30K+ AED", description: "Ad Budgets Managed"},
{
id: "m2", value: "22%", description: "Lead-to-Sale Conversion Rate"},
{
id: "m3", value: "18%", description: "CPL Reduction QoQ"},
{
id: "m4", value: "1.4M+", description: "Social Media Views"},
{
id: "m5", value: "Egypt · GCC · Europe", description: "Markets Served"},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="portfolio" data-section="portfolio">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
carouselMode="buttons"
products={[
{
id: "cs1", brand: "QuickPlus + Ajman Free Zone", name: "Lead Gen & Meta Ads", price: "MENA Market", rating: 5,
reviewCount: "High Conversion", imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-muslim-hijab-asking-union-holding-banner-with-united-stand-message-serious-face-thinking-about-question-very-confused-idea_839833-20662.jpg", imageAlt: "QuickPlus Ajman Free Zone Case Study"},
{
id: "cs2", brand: "Pink Musée", name: "K-Beauty E-commerce Growth", price: "Shopify, Social Media", rating: 5,
reviewCount: "Increased Engagement", imageSrc: "http://img.b2bpic.net/free-photo/market-trends-concept-with-laptop_23-2150372444.jpg", imageAlt: "Pink Musée K-Beauty E-commerce Case Study"},
{
id: "cs3", brand: "Gold Avenue", name: "Precious Metals Investment", price: "Saudi Arabia, Bilingual Ads", rating: 5,
reviewCount: "Strong ROI", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-shallow-depth-field-modern-communication_1048-12682.jpg", imageAlt: "Gold Avenue Precious Metals Investment Case Study"},
{
id: "cs4", brand: "Standexpo", name: "Exhibition Stands B2B", price: "Website + Branding", rating: 5,
reviewCount: "Enhanced Brand Presence", imageSrc: "http://img.b2bpic.net/free-photo/mature-group-college-students-read-green-screen-device_482257-123157.jpg", imageAlt: "Standexpo Exhibition Stands Case Study"},
]}
title="Our Work & Case Studies"
description="Explore how weve driven success for leading brands across diverse industries and markets."
/>
</div>
<div id="why-mjsn" data-section="why-mjsn">
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{
id: "faq1", title: "Deep MENA Market Understanding", content: "Leverage our profound insights into the Middle East & North Africa region, ensuring culturally resonant campaigns."},
{
id: "faq2", title: "European-Level Execution Standards", content: "Benefit from marketing strategies and creative outputs that meet the highest international benchmarks."},
{
id: "faq3", title: "Arabic-Native Content & Creative", content: "Access authentic, high-quality Arabic content and creative tailored for effective local engagement."},
{
id: "faq4", title: "Data-Driven Campaign Optimization", content: "Every campaign is backed by rigorous data analysis and continuous optimization for peak performance."},
{
id: "faq5", title: "Fast Creative Turnaround", content: "Our agile teams ensure quick development and deployment of high-impact creative assets."},
{
id: "faq6", title: "AI-Enhanced Marketing Systems", content: "Harness the power of Artificial Intelligence to streamline processes and elevate campaign effectiveness."},
]}
imageSrc="http://img.b2bpic.net/free-photo/businesspeople-planning-glass-wall_53876-15196.jpg"
imageAlt="Abstract illustration of strategic thinking and market understanding"
mediaAnimation="slide-up"
mediaPosition="right"
title="Why Choose MJSN?"
description="Our unique approach combines local market understanding with global execution standards."
faqsAnimation="slide-up"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="depth-3d"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
carouselMode="buttons"
testimonials={[
{
id: "t1", name: "QuickPlus & Ajman Free Zone", role: "Lead Generation Partner", company: "Real Estate Development", rating: 5,
testimonial: "MJSN delivered exceptional lead generation and conversion results, significantly boosting our outreach.", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-arrangement-with-paint-containers-copy-space_23-2148391884.jpg", imageAlt: "Testimonial from QuickPlus & Ajman Free Zone"},
{
id: "t2", name: "Pink Musée", role: "E-commerce Growth", company: "K-Beauty Retailer", rating: 5,
testimonial: "Their social media strategies and content creation ignited our e-commerce growth and brand engagement.", imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99727.jpg", imageAlt: "Testimonial from Pink Musée"},
{
id: "t3", name: "Standexpo", role: "Branding & Web Development", company: "Exhibition Solutions", rating: 5,
testimonial: "MJSN transformed our online presence with stunning web development and cohesive branding.", imageSrc: "http://img.b2bpic.net/free-photo/colored-ceramic-stones-abstract-smooth-brown-mosiac-texture-abstract-ceramic-mosaic-adorned-building-abstract-seamless-pattern_1258-72060.jpg", imageAlt: "Testimonial from Standexpo"},
{
id: "t4", name: "Global Retail Group", role: "Performance Marketing Lead", company: "International Retail", rating: 5,
testimonial: "Their data-driven approach consistently delivers measurable results and strong ROI for our diverse brands.", imageSrc: "http://img.b2bpic.net/free-photo/map-colorado-gold-glitter-map-dark-background_559531-11073.jpg", imageAlt: "Testimonial from Global Retail Group"},
{
id: "t5", name: "MENA Tech Innovators", role: "Digital Strategy Director", company: "Technology Startup", rating: 5,
testimonial: "MJSN's AI-enhanced workflows and deep market insights have been crucial to our successful market entry.", imageSrc: "http://img.b2bpic.net/free-photo/gold-marble-texture-dark-background_1409-1780.jpg", imageAlt: "Testimonial from MENA Tech Innovators"},
]}
title="What Our Clients Say"
description="Hear directly from the brands we've helped scale to new heights."
/>
</div>
<div id="process" data-section="process">
<PricingCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "p1", title: "1. Discovery & Audit", price: "Phase 1", period: "Initial Assessment", features: [
"In-depth market research", "Competitor analysis", "Current strategy audit", "Goal alignment workshop"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-photo/man-analyzing-stock-market-charts-financial-data-electronic-board_169016-14901.jpg", imageAlt: "Discovery and Audit Stage"},
{
id: "p2", title: "2. Strategy & Planning", price: "Phase 2", period: "Roadmap Creation", features: [
"Custom campaign strategy", "Audience segmentation", "Channel selection", "Budget allocation"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-vector/illustration-business-target-icon_53876-5899.jpg", imageAlt: "Strategy and Planning Stage"},
{
id: "p3", title: "3. Creative Production", price: "Phase 3", period: "Asset Development", features: [
"Copywriting (EN/AR)", "Graphic design", "Video production", "Ad creative concepts"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-photo/professional-video-camera-movie-set-with-lot-cables_1268-17213.jpg", imageAlt: "Creative Production Stage"},
{
id: "p4", title: "4. Campaign Launch", price: "Phase 4", period: "Go-Live", features: [
"Platform setup & integration", "Initial campaign deployment", "Tracking & analytics setup", "Real-time monitoring"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-design-arrow-circle_23-2148445364.jpg", imageAlt: "Campaign Launch Stage"},
{
id: "p5", title: "5. Optimization & Scaling", price: "Phase 5", period: "Continuous Improvement", features: [
"A/B testing & iteration", "Performance analysis", "Budget re-allocation", "Scaling successful campaigns"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-photo/target-aspiration-goal-mission-success-aim-concept_53876-13727.jpg", imageAlt: "Optimization and Scaling Stage"},
{
id: "p6", title: "6. Reporting & Growth", price: "Phase 6", period: "Partnership Review", features: [
"Detailed performance reports", "Strategic recommendations", "Market trend analysis", "Future growth planning"],
button: {
text: "Learn More"},
imageSrc: "http://img.b2bpic.net/free-photo/business-analysis-report-folder-icon_53876-14637.jpg", imageAlt: "Reporting and Growth Stage"},
]}
title="Our Proven Process"
description="A streamlined, transparent workflow designed to deliver consistent, high-impact results."
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Let's Scale Your Brand Across Egypt · GCC · Europe"
description="Ready to elevate your performance marketing? Book a free strategy call or connect with us directly."
inputs={[
{
name: "name", type: "text", placeholder: "Your Name", required: true,
},
{
name: "email", type: "email", placeholder: "Your Email", required: true,
},
]}
textarea={{
name: "message", placeholder: "Your Message", rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/network-concept-with-yellow-squares_23-2148999199.jpg"
imageAlt="Abstract illustration of strategic communication and networking"
mediaAnimation="slide-up"
mediaPosition="left"
buttonText="Send Message"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ez7srKw0Muaa70ZMY6lLLNlrAg/uploaded-1781169772954-vlkbzdzz.png"
logoAlt="MJSN Agency Logo"
logoText="MJSN."
columns={[
{
title: "Services", items: [
{
label: "Paid Advertising", href: "#services"},
{
label: "Social Media Marketing", href: "#services"},
{
label: "SEO", href: "#services"},
{
label: "Web Development", href: "#services"},
{
label: "Branding & Identity", href: "#services"},
],
},
{
title: "Company", items: [
{
label: "About Us", href: "#about"},
{
label: "Our Work", href: "#portfolio"},
{
label: "Results", href: "#results"},
{
label: "Contact", href: "#contact"},
],
},
{
title: "Connect", items: [
{
label: "Book a Call", href: "https://calendly.com/mjsn/30mins"},
{
label: "WhatsApp: +20 105 500 0524", href: "https://wa.me/201055000524"},
{
label: "Email: hello@mjsn.agency", href: "mailto:hello@mjsn.agency"},
{
label: "LinkedIn", href: "#"},
{
label: "Instagram", href: "#"},
{
label: "TikTok", href: "#"},
],
},
]}
copyrightText="© 2026 MJSN. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}