Compare commits
21 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| ed551d1576 | |||
| d5f0000073 | |||
| fb76de3853 | |||
| 4c7eff5b7b | |||
| a691134c75 | |||
| 67d74e8ac6 | |||
| 7cc8b9841d | |||
| 85ddafcbe6 | |||
| eb4d2aed18 | |||
| 06db69a346 | |||
| da2052e388 | |||
| fe2426f287 | |||
| e328fc60f8 | |||
| 45bf005a64 | |||
| 42e68533a6 | |||
| 5ffda9744f | |||
| aa0adcff89 | |||
| a94d6eb793 | |||
| 7bcd6205c5 | |||
| 0174e14436 | |||
| 2b00b7ecdf |
@@ -1,42 +1,19 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Halant } from "next/font/google";
|
||||
import { Inter } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||
import Tag from "@/tag/Tag";
|
||||
|
||||
const halant = Halant({
|
||||
variable: "--font-halant", subsets: ["latin"],
|
||||
weight: ["300", "400", "500", "600", "700"],
|
||||
});
|
||||
|
||||
const inter = Inter({
|
||||
variable: "--font-inter", subsets: ["latin"],
|
||||
});
|
||||
import "./styles/base.css";
|
||||
import "./styles/variables.css";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Helion Era | Premium Digital Growth Agency", description: "Premium digital growth agency offering UI/UX design, website development, social media management, and lead generation systems. Move your brand forward with strategic growth solutions.", keywords: "digital growth agency, UI UX design, website development, lead generation, social media management, SEO strategy, conversion optimization", openGraph: {
|
||||
title: "Helion Era | Growth Systems That Move Brands Forward", description: "Premium digital growth agency delivering strategic solutions that accelerate brand growth and market dominance.", siteName: "Helion Era", type: "website"},
|
||||
robots: {
|
||||
index: true,
|
||||
follow: true,
|
||||
},
|
||||
title: "Helion Era | Digital Growth Solutions", description: "Transform your business with premium digital growth strategies and solutions."
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
}) {
|
||||
return (
|
||||
<html lang="en" suppressHydrationWarning>
|
||||
<ServiceWrapper>
|
||||
<body
|
||||
className={`${halant.variable} ${inter.variable} antialiased`}
|
||||
>
|
||||
<Tag />
|
||||
{children}
|
||||
|
||||
<html lang="en">
|
||||
<body>{children}
|
||||
<script
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `
|
||||
@@ -1404,7 +1381,6 @@ export default function RootLayout({
|
||||
}}
|
||||
/>
|
||||
</body>
|
||||
</ServiceWrapper>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
557
src/app/page.tsx
557
src/app/page.tsx
@@ -1,264 +1,323 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroBillboardDashboard from "@/components/sections/hero/HeroBillboardDashboard";
|
||||
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
|
||||
import TimelineCardStack from "@/components/cardStack/layouts/timelines/TimelineCardStack";
|
||||
import TextBox from "@/components/Textbox";
|
||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||
import { Sparkles, House, MessageSquareText, Settings, CircleDollarSign, ArrowLeftRight, Send, CheckCircle, X, Zap, Target, Rocket, TrendingUp, Calendar, Twitter, Linkedin, Github } from "lucide-react";
|
||||
|
||||
const Dashboard = ({ title, stats, logoIcon: LogoIcon, sidebarItems, buttons, listItems, imageSrc, searchPlaceholder, chartTitle, chartData, listTitle, videoSrc, imageAlt, videoAriaLabel, className, containerClassName, sidebarClassName, statClassName, chartClassName, listClassName }) => {
|
||||
return (
|
||||
<div className={containerClassName}>
|
||||
<div className="flex flex-col gap-6">
|
||||
<div className="text-center">
|
||||
<h3 className="text-xl font-semibold">{title}</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default function Home() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="mediumLarge"
|
||||
background="aurora"
|
||||
cardStyle="layered-gradient"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="extrabold"
|
||||
sizing="mediumSizeLargeTitles"
|
||||
background="none"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
brandName="Helion Era"
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Process", id: "process" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
button={{
|
||||
text: "Book Strategy Call", href: "contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="Helion Era"
|
||||
bottomLeftText="Global Community"
|
||||
bottomRightText="hello@helionera.com"
|
||||
/>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "plain" }}
|
||||
title="Growth Systems That Move Brands Forward"
|
||||
description="Helion Era helps brands grow through premium UI/UX design, website development, social media management, lead generation systems, and digital growth strategy. We craft growth systems that move your business forward."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-vector/gradient-data-logo-template_23-2149211225.jpg", alt: "Digital Growth Agency Trust Badge"
|
||||
}
|
||||
]}
|
||||
avatarText="DIGITAL GROWTH AGENCY"
|
||||
buttons={[
|
||||
{ text: "Book Strategy Call", href: "contact" },
|
||||
{ text: "View Services", href: "services" }
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<main className="flex flex-col w-full">
|
||||
<section id="hero" data-section="hero" className="w-full">
|
||||
<HeroBillboardDashboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Digital Growth"
|
||||
tagIcon={Sparkles}
|
||||
title="Grow Your Revenue 3x Faster"
|
||||
description="Average clients see 3x revenue growth within 90 days. Our proven digital growth solutions deliver measurable results through strategic planning, expert execution, and continuous optimization."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "#contact" },
|
||||
{ text: "View Our Work", href: "#featured-work" },
|
||||
]}
|
||||
dashboard={{
|
||||
title: "Growth Metrics Hub", logoIcon: House,
|
||||
imageSrc: "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100&h=100&fit=crop&crop=face", buttons: [
|
||||
{ text: "Dashboard", href: "#" },
|
||||
{ text: "Export CSV", href: "#" },
|
||||
],
|
||||
sidebarItems: [
|
||||
{ icon: House, active: true },
|
||||
{ icon: MessageSquareText },
|
||||
{ icon: Settings },
|
||||
],
|
||||
stats: [
|
||||
{
|
||||
title: "Revenue Growth", values: [178425, 245890, 312750],
|
||||
valuePrefix: "$", description: "Monthly increase."
|
||||
},
|
||||
{
|
||||
title: "Client Conversions", values: [7.84, 12.5, 9.32],
|
||||
valuePrefix: "", valueSuffix: "%", description: "Conversion rate."
|
||||
},
|
||||
{
|
||||
title: "Active Clients", values: [11240, 15680, 13450],
|
||||
description: "Growing portfolio."
|
||||
},
|
||||
],
|
||||
chartTitle: "Monthly Performance", chartData: [
|
||||
{ value: 50 },
|
||||
{ value: 30 },
|
||||
{ value: 70 },
|
||||
{ value: 40 },
|
||||
{ value: 90 },
|
||||
],
|
||||
listTitle: "Recent Wins", listItems: [
|
||||
{ icon: CircleDollarSign, title: "$150K Revenue", status: "Secured" },
|
||||
{ icon: ArrowLeftRight, title: "Brand Pivot", status: "Executed" },
|
||||
{ icon: Send, title: "Campaign Launch", status: "Live" },
|
||||
],
|
||||
}}
|
||||
/>
|
||||
</section>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSix
|
||||
title="Our Premium Services"
|
||||
description="Strategic digital solutions designed to accelerate your brand growth and market dominance"
|
||||
tag="SERVICES"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "UI/UX Design", description: "Stunning interfaces that drive engagement and conversions. Premium design systems that elevate your brand presence and user experience.", imageSrc: "http://img.b2bpic.net/free-vector/barber-shop-booking-app_52683-40856.jpg"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Website Development", description: "High-performance websites built for conversions. Custom development that transforms your vision into powerful digital assets.", imageSrc: "http://img.b2bpic.net/free-photo/technician-inspecting-rackmounts-data-center_482257-123455.jpg"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Social Media Management", description: "Strategic content and community management that builds loyal audiences. Data-driven campaigns that amplify your brand voice.", imageSrc: "http://img.b2bpic.net/free-photo/successful-connected-business-people_53876-25176.jpg"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Lead Generation Systems", description: "Sophisticated systems that attract and qualify high-value leads. Automated funnels designed to drive consistent business growth.", imageSrc: "http://img.b2bpic.net/free-vector/dashboard-business-user-panel_23-2148359299.jpg"
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "SEO Strategy", description: "Organic visibility that drives sustainable growth. Technical and content strategies that rank your brand at the top.", imageSrc: "http://img.b2bpic.net/free-photo/digital-laptop-working-global-business-concept_53876-23438.jpg"
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
title: "Conversion Optimization", description: "Scientific testing and refinement that maximizes ROI. Every element optimized to turn visitors into paying customers.", imageSrc: "http://img.b2bpic.net/free-photo/every-needed-information-is-corkboard_329181-10308.jpg"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
tag="CASE STUDY"
|
||||
title="We Help Brands Grow Through Strategic Innovation"
|
||||
description="Helion Era transforms ambitious brands into market leaders. We combine strategic thinking, premium design, and technical excellence to create growth systems that deliver measurable results. Our approach focuses on understanding your unique challenges and building tailored solutions that accelerate your success."
|
||||
metrics={[
|
||||
{ value: "500+", title: "Projects Delivered" },
|
||||
{ value: "98%", title: "Client Satisfaction" }
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
imageSrc="http://img.b2bpic.net/free-vector/infographic-with-retro-colors-flat-design_23-2148434870.jpg"
|
||||
imageAlt="Case study results and metrics"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<FeatureCardSix
|
||||
title="Our Process"
|
||||
description="A proven methodology that transforms your growth vision into reality"
|
||||
tag="HOW WE WORK"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
title: "Strategy", description: "Deep analysis of your market, audience, and competitive landscape. We develop comprehensive growth strategies tailored to your unique business objectives.", imageSrc: "http://img.b2bpic.net/free-photo/office-workers-working-together-as-team_23-2149310878.jpg"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Build", description: "Technical excellence meets creative vision. Our team develops robust systems and interfaces that bring your strategy to life with precision.", imageSrc: "http://img.b2bpic.net/free-photo/software-programer-pointing-pencil-source-code-computer-screen-explaining-algorithm-coworker-standing-desk-programmers-discussing-online-cloud-computing-with-team_482257-33535.jpg"
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Launch", description: "Flawless execution and deployment of your growth systems. We ensure every element is optimized for maximum impact and user engagement.", imageSrc: "http://img.b2bpic.net/free-photo/hands-up-photo-young-team-classical-clothes-celebrating-success-while-holding-drinks-modern-good-lighted-office_146671-13658.jpg"
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Scale", description: "Continuous optimization and expansion of your successful systems. We refine and scale what works to drive exponential growth.", imageSrc: "http://img.b2bpic.net/free-photo/business-success-report-graph-concept_53876-121032.jpg"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
title="Our Impact"
|
||||
description="Proven results that speak to our commitment to your success"
|
||||
tag="RESULTS"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
metrics={[
|
||||
{
|
||||
id: "1", value: "3.2x", title: "Average ROI Increase", items: ["Data-driven strategy optimization", "Continuous A/B testing", "Performance monitoring"]
|
||||
},
|
||||
{
|
||||
id: "2", value: "150%", title: "Average Lead Growth", items: ["Qualified lead pipeline", "Conversion funnel optimization", "Automated nurture systems"]
|
||||
},
|
||||
{
|
||||
id: "3", value: "45%", title: "Average Cost Reduction", items: ["Efficient ad spending", "Automation and scaling", "Process optimization"]
|
||||
},
|
||||
{
|
||||
id: "4", value: "6 months", title: "Average Time to ROI", items: ["Strategic planning phase", "Rapid implementation", "Quick optimization cycle"]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
title="What Our Clients Say"
|
||||
description="Real feedback from brands we've helped scale to new heights"
|
||||
tag="TESTIMONIALS"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Johnson", role: "CEO", company: "TechFlow Solutions", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/face-handsome-cafe-adult-job_1157-3664.jpg"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Michael Chen", role: "Founder", company: "InnovateLab", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/content-business-woman-talking-smartphone-outdoors_1262-20534.jpg"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Emily Rodriguez", role: "Marketing Director", company: "GrowthCo", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-smiling-looking-camera_23-2148112827.jpg"
|
||||
},
|
||||
{
|
||||
id: "4", name: "David Kim", role: "COO", company: "StartupXYZ", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-businessman-walking-near-business-center_171337-19784.jpg"
|
||||
},
|
||||
{
|
||||
id: "5", name: "Jessica Martinez", role: "VP Operations", company: "Digital Ventures", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-business-woman-standing-outdoors_1262-20546.jpg"
|
||||
},
|
||||
{
|
||||
id: "6", name: "James Wilson", role: "Founder", company: "NextGen Agency", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elderly-businessman-entrepreneur-sitting-workspace-looking-camera_482257-8143.jpg"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Let's Build Something That Moves Your Brand Forward"
|
||||
description="Book a strategy call directly with Helion Era and discover how we can accelerate your growth. We'll analyze your business and show you exactly how our growth systems can drive results."
|
||||
useInvertedBackground={false}
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
{ name: "company", type: "text", placeholder: "Company Name", required: true },
|
||||
{ name: "phone", type: "tel", placeholder: "Phone Number", required: true }
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Tell us about your growth goals and challenges...", rows: 4,
|
||||
required: true
|
||||
}}
|
||||
buttonText="Book Your Growth Call"
|
||||
mediaAnimation="slide-up"
|
||||
mediaPosition="right"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Helion Era"
|
||||
columns={[
|
||||
{
|
||||
<section id="services" data-section="services" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<FeatureCardSixteen
|
||||
negativeCard={{
|
||||
items: [
|
||||
{ label: "Home", href: "#" },
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "Process", href: "#process" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"Generic templates", "One-size-fits-all approach", "Limited scalability", "Poor performance tracking"
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Sitemap", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Twitter", href: "https://twitter.com" },
|
||||
{ label: "LinkedIn", href: "https://linkedin.com" },
|
||||
{ label: "Instagram", href: "https://instagram.com" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
"Custom-built solutions", "Tailored strategy for your business", "Infinitely scalable", "Real-time analytics & insights"
|
||||
],
|
||||
}}
|
||||
animationType="slide-up"
|
||||
title="Why Choose Helion Era"
|
||||
description="We don't believe in one-size-fits-all. Our approach is customized to your unique business needs and goals."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</section>
|
||||
|
||||
<section id="process" data-section="process" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<TimelineCardStack
|
||||
title="Our Process"
|
||||
description="Follow our proven 4-step approach to transform your business and achieve exponential growth."
|
||||
tag="How We Work"
|
||||
tagIcon={Zap}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Learn More", href: "#featured-work" },
|
||||
]}
|
||||
>
|
||||
<div className="flex flex-col gap-6 p-8 bg-white dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-blue-100 dark:bg-blue-900 rounded-lg flex items-center justify-center">
|
||||
<Target className="w-6 h-6 text-blue-600 dark:text-blue-400" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold">Strategy & Discovery</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 mt-2">We dive deep into your business, market, and goals to craft a personalized growth strategy tailored to your unique needs and competitive landscape.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-6 p-8 bg-white dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-purple-100 dark:bg-purple-900 rounded-lg flex items-center justify-center">
|
||||
<Rocket className="w-6 h-6 text-purple-600 dark:text-purple-400" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold">Execution & Launch</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 mt-2">Our expert team executes your strategy with precision. We build, optimize, and launch campaigns designed to drive immediate impact and measurable results.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-6 p-8 bg-white dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-green-100 dark:bg-green-900 rounded-lg flex items-center justify-center">
|
||||
<TrendingUp className="w-6 h-6 text-green-600 dark:text-green-400" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold">Optimization & Growth</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 mt-2">We continuously monitor performance, test new approaches, and refine strategies based on real data to maximize your ROI and accelerate sustainable growth.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-6 p-8 bg-white dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-shrink-0 w-12 h-12 bg-orange-100 dark:bg-orange-900 rounded-lg flex items-center justify-center">
|
||||
<Sparkles className="w-6 h-6 text-orange-600 dark:text-orange-400" />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold">Scale & Success</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 mt-2">Once proven effective, we scale what works. Your business grows exponentially while we maintain quality, consistency, and continued innovation throughout the journey.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</TimelineCardStack>
|
||||
</section>
|
||||
|
||||
<section id="featured-work" data-section="featured-work" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<div className="flex flex-col gap-12">
|
||||
<div className="flex flex-col items-center gap-4">
|
||||
<TextBox
|
||||
title="Featured Work"
|
||||
description="Discover how we've transformed businesses across industries. Each project showcases our commitment to delivering exceptional results and driving measurable growth."
|
||||
textboxLayout="default"
|
||||
center={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "View All Projects", href: "#contact"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 w-full">
|
||||
<div className="flex flex-col gap-4 p-6 bg-slate-50 dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800 h-full">
|
||||
<div className="w-full h-48 bg-gradient-to-br from-blue-400 to-blue-600 rounded-lg"></div>
|
||||
<div className="flex flex-col gap-2 flex-grow">
|
||||
<h3 className="text-lg font-semibold">E-Commerce Platform Redesign</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 text-sm">Increased conversion rate by 45% through strategic UX improvements and A/B testing</p>
|
||||
</div>
|
||||
<div className="flex gap-2 mt-2 flex-wrap">
|
||||
<span className="px-3 py-1 text-xs bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 rounded-full">UX Design</span>
|
||||
<span className="px-3 py-1 text-xs bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 rounded-full">Development</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4 p-6 bg-slate-50 dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800 h-full">
|
||||
<div className="w-full h-48 bg-gradient-to-br from-purple-400 to-purple-600 rounded-lg"></div>
|
||||
<div className="flex flex-col gap-2 flex-grow">
|
||||
<h3 className="text-lg font-semibold">SaaS Marketing Campaign</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 text-sm">Generated $2.3M in qualified leads through targeted content and conversion optimization</p>
|
||||
</div>
|
||||
<div className="flex gap-2 mt-2 flex-wrap">
|
||||
<span className="px-3 py-1 text-xs bg-purple-100 dark:bg-purple-900 text-purple-700 dark:text-purple-300 rounded-full">Marketing</span>
|
||||
<span className="px-3 py-1 text-xs bg-purple-100 dark:bg-purple-900 text-purple-700 dark:text-purple-300 rounded-full">Strategy</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4 p-6 bg-slate-50 dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800 h-full">
|
||||
<div className="w-full h-48 bg-gradient-to-br from-green-400 to-green-600 rounded-lg"></div>
|
||||
<div className="flex flex-col gap-2 flex-grow">
|
||||
<h3 className="text-lg font-semibold">Brand Transformation</h3>
|
||||
<p className="text-slate-600 dark:text-slate-300 text-sm">Rebranded legacy company, resulting in 3x increase in market visibility and engagement</p>
|
||||
</div>
|
||||
<div className="flex gap-2 mt-2 flex-wrap">
|
||||
<span className="px-3 py-1 text-xs bg-green-100 dark:bg-green-900 text-green-700 dark:text-green-300 rounded-full">Branding</span>
|
||||
<span className="px-3 py-1 text-xs bg-green-100 dark:bg-green-900 text-green-700 dark:text-green-300 rounded-full">Design</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="booking" data-section="booking" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<div className="flex flex-col gap-12 items-center">
|
||||
<div className="w-full max-w-2xl">
|
||||
<TextBox
|
||||
title="Schedule Your Growth Consultation"
|
||||
description="Let's discuss your business goals and discover how our proven strategies can accelerate your revenue growth. Book a free 30-minute consultation with our team."
|
||||
textboxLayout="default"
|
||||
center={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="w-full max-w-2xl mx-auto">
|
||||
<div className="flex flex-col items-center justify-center p-12 bg-slate-50 dark:bg-slate-900 rounded-lg border border-slate-200 dark:border-slate-800 text-center">
|
||||
<Calendar className="w-12 h-12 text-slate-400 dark:text-slate-600 mb-4" />
|
||||
<p className="text-slate-600 dark:text-slate-300 mb-4">Calendly Booking Widget</p>
|
||||
<p className="text-sm text-slate-500 dark:text-slate-400">Embedded Calendly scheduling system would appear here for seamless appointment booking.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="cta-premium" data-section="cta-premium" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<div className="flex flex-col items-center justify-center">
|
||||
<div className="w-full max-w-3xl mx-auto bg-gradient-to-r from-blue-600 to-purple-600 dark:from-blue-700 dark:to-purple-700 rounded-lg p-8 md:p-12 text-white text-center">
|
||||
<h2 className="text-3xl md:text-4xl font-bold mb-4">Ready to Grow 3x Faster?</h2>
|
||||
<p className="text-base md:text-lg text-blue-100 mb-8">Join 300+ companies growing 3x faster with our proven framework</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<button className="px-8 py-3 bg-white text-blue-600 font-semibold rounded-lg hover:bg-blue-50 transition-colors">
|
||||
Start Your Growth Journey
|
||||
</button>
|
||||
<button className="px-8 py-3 bg-white/20 text-white font-semibold rounded-lg border border-white/30 hover:bg-white/30 transition-colors">
|
||||
View Our Plans
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="about" data-section="about" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<div className="flex flex-col items-center gap-8">
|
||||
<TextBox
|
||||
title="About Helion Era"
|
||||
description="We are a team of growth strategists, designers, and developers dedicated to helping businesses achieve exponential growth through innovative digital solutions."
|
||||
textboxLayout="default"
|
||||
center={true}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="contact" data-section="contact" className="w-full py-16 md:py-24 lg:py-32">
|
||||
<div className="flex flex-col items-center gap-8">
|
||||
<TextBox
|
||||
title="Get In Touch"
|
||||
description="Ready to grow? Reach out to us and let's discuss how we can help your business thrive."
|
||||
textboxLayout="default"
|
||||
center={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us", href: "mailto:hello@helionera.com"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer className="w-full py-12 md:py-16 mt-12 md:mt-16">
|
||||
<FooterCard
|
||||
logoText="Helion Era"
|
||||
copyrightText="© 2025 Helion Era. All rights reserved."
|
||||
socialLinks={[
|
||||
{ icon: Twitter, href: "https://twitter.com/helionera", ariaLabel: "Twitter" },
|
||||
{ icon: Linkedin, href: "https://linkedin.com/company/helionera", ariaLabel: "LinkedIn" },
|
||||
{ icon: Github, href: "https://github.com/helionera", ariaLabel: "GitHub" }
|
||||
]}
|
||||
/>
|
||||
</footer>
|
||||
</main>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user