bender/edbb89ac-9fbc-445b-ab83-1d1f9077d35f
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #2

Merged
bender merged 2 commits from version_2 into main 2026-03-27 21:09:15 +00:00
Conversation 0 Commits 2 Files Changed 2 +56 -265
2 changed files with 56 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files

313
src/app/page.tsx
View File

@@ -3,15 +3,15 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterCard from '@/components/sections/footer/FooterCard';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import { Calendar } from "lucide-react";
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
import { Calendar, CheckCircle2, TrendingUp, Target, Users } from "lucide-react";
export default function LandingPage() {
return (
@@ -22,31 +22,19 @@ export default function LandingPage() {
contentWidth="mediumSmall"
sizing="mediumLargeSizeMediumTitles"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
cardStyle="outline"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Process",
id: "how-it-works",
},
{
name: "Results",
id: "results",
},
{
name: "Services",
id: "services",
},
{
name: "About",
id: "about",
},
{ name: "Process", id: "how-it-works" },
{ name: "Results", id: "results" },
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
]}
brandName="VELROS"
/>
@@ -55,281 +43,84 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroLogo
logoText="VELROS"
description="We don’t just create content. We build systems that turn your Instagram, TikTok, and Paid Ads into a consistent stream of booked client appointments."
buttons={[
{
text: "Book a Free Growth Guidance Call",
href: "#contact",
},
]}
description="We architect predictable inbound systems that turn social content and paid ads into a consistent stream of booked client appointments."
buttons={[{ text: "Book a Strategy Call", href: "#contact" }]}
buttonAnimation="slide-up"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/uploaded-1774645566480-drcehppw.png"
videoSrc="https://www.w3schools.com/html/mov_bbb.mp4?_wi=1"
/>
</div>
<div id="problem" data-section="problem">
<FeatureCardSeven
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Content Fatigue",
description: "Posting content endlessly without generating a single qualified lead.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=1",
},
{
id: 2,
title: "Vanity Metrics",
description: "Getting thousands of views, but no conversions or booked appointments.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=2",
},
{
id: 3,
title: "Referral Reliance",
description: "Struggling to scale because you rely solely on word-of-mouth rather than predictable systems.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=3",
},
{
id: 4,
title: "Inconsistent Pipeline",
description: "The feast-or-famine cycle that makes planning for long-term growth nearly impossible.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=4",
},
{
id: 5,
title: "Lead Leakage",
description: "Losing high-intent prospects due to slow follow-up and unoptimized booking funnels.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=5",
},
]}
title="The Growth Bottleneck"
description="Most local service businesses are stuck in a cycle of inconsistent lead flow. We change that."
/>
</div>
<div id="solution" data-section="solution">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="The Velros System"
description="We architect predictable inbound machines for med spas, fitness brands, and clinics by integrating short-form content with high-intent paid advertising."
bulletPoints={[
{
title: "High-Impact Content",
description: "Data-driven Instagram Reels and TikTok videos designed to convert.",
},
{
title: "Scaled Paid Ads",
description: "Meta and Google ad funnels that amplify your best-performing organic content.",
},
{
title: "Lead Follow-up",
description: "Optimized systems to ensure every generated lead turns into a booked client.",
},
]}
mediaAnimation="slide-up"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=6"
videoSrc="https://www.w3schools.com/html/mov_bbb.mp4?_wi=2"
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureCardSeven
<FeatureCardTwentyThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
textboxLayout="split"
title="Our 4-Stage Growth System"
features={[
{
id: 1,
title: "Research & Strategy",
description: "Analyzing your niche and identifying winning formats that work for you.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=7",
},
{
id: 2,
title: "Script & Create",
description: "We handle the scripting and production strategy based on proven data.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=8",
},
{
id: 3,
title: "Edit & Optimize",
description: "Turning raw content into high-converting assets optimized for platform algorithms.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=9",
},
{
id: 4,
title: "Scale & Iterate",
description: "Turning your best organic content into high-performing ads with continuous A/B testing.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=10",
},
{
id: 5,
title: "Revenue Realization",
description: "Connecting the system directly to your calendar for automated client intake.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-marketing-agency-hero-banne-1774645591476-81274930.png?_wi=11",
},
{ id: "1", title: "Discovery & Strategy", tags: ["Research", "Niche"], description: "Identifying winning content formats that align with your business goals." },
{ id: "2", title: "Production & Editing", tags: ["Scripting", "Editing"], description: "Turning raw concepts into high-converting, algorithm-optimized assets." },
{ id: "3", title: "Paid Funnel Setup", tags: ["Meta", "Google"], description: "Amplifying your best organic content through targeted, high-intent ad funnels." },
{ id: "4", title: "Automated Booking", tags: ["Intake", "Growth"], description: "Connecting the system directly to your calendar for hands-free client intake." },
]}
title="How We Build Your Machine"
description="A refined 4-stage process to ensure consistent, scalable results."
/>
</div>
<div id="results" data-section="results">
<MetricCardTwo
<MetricCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
textboxLayout="split"
title="Proven Performance"
description="Measurable impact for local service brands."
metrics={[
{
id: "m1",
value: "15M+",
description: "Views generated across platforms",
},
{
id: "m2",
value: "24/7",
description: "Repeatable content formats",
},
{
id: "m3",
value: "100%",
description: "Focus on inbound acquisition",
},
{
id: "m4",
value: "500+",
description: "Appointments booked for partners",
},
{
id: "m5",
value: "4x",
description: "Typical ad spend efficiency growth",
},
{ id: "m1", icon: TrendingUp, title: "Platform Reach", value: "15M+" },
{ id: "m2", icon: Target, title: "Client Intake", value: "500+" },
{ id: "m3", icon: Users, title: "Ad Efficiency", value: "4x" },
]}
title="Proven Scalability"
description="Numbers speak for themselves."
/>
</div>
<div id="services" data-section="services">
<PricingCardThree
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
textboxLayout="split"
title="Core Offerings"
plans={[
{
id: "p1",
price: "$850/mo",
name: "Velros Core System",
features: [
"Content Strategy",
"Platform Optimization",
"Paid Ads Management",
"Reporting & Iteration",
],
buttons: [
{
text: "Get Started",
href: "#contact",
},
],
},
{
id: "p2",
price: "$1,850/mo",
name: "Velros Scale Partner",
features: [
"Everything in Core",
"Custom Content Filming",
"Direct Ad Funnel Management",
"Dedicated Account Manager",
],
buttons: [
{
text: "Get Started",
href: "#contact",
},
],
},
{ id: "p1", badge: "Essential", price: "$850/mo", subtitle: "Core System", features: ["Content Strategy", "Platform Optimization", "Paid Ads Management"], buttons: [{ text: "Select", href: "#contact" }] },
{ id: "p2", badge: "Growth", price: "$1,850/mo", subtitle: "Scale Partner", features: ["Core Features Included", "Custom Content Filming", "Dedicated Management"], buttons: [{ text: "Select", href: "#contact" }] },
]}
title="Our Partnerships"
description="Content System + Client Acquisition System for consistent growth."
/>
</div>
<div id="about" data-section="about">
<TeamCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
team={[
{
id: "d1",
name: "Dodley Dorval",
role: "Strategist",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-portrait-of-a-male-marketin-1774645590746-c69e352f.png",
},
{
id: "t1",
name: "Taylor Fray",
role: "Strategist",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BXq0br6XYaKUcF55yjr5Drp1g8/professional-portrait-of-a-male-social-m-1774645592766-3830a074.png",
},
<TextSplitAbout
title="The Agency Story"
description={[
"Velros was born out of a desire to fix the broken marketing model for local businesses. We don't believe in vanity metrics; we believe in systems that drive revenue.", "Founders Dodley Dorval and Taylor Fray built Velros to bring enterprise-grade acquisition strategies to med spas, clinics, and fitness studios."
]}
title="Meet The Operators"
description="Dodley Dorval and Taylor Fray, social media growth strategists dedicated to helping local businesses scale through superior systems."
buttons={[{ text: "Learn More", href: "#" }]}
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
animationType="slide-up"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "How long until I see results?",
content: "Ads typically show short-term traction, while content systems start gaining momentum within 3-4 months.",
},
{
id: "f2",
title: "What businesses do you serve?",
content: "We specialize in local service businesses like med spas, fitness studios, and clinics.",
},
{
id: "f3",
title: "Do I need a big ad budget?",
content: "We scale your budget as the systems prove profitability, starting small to test and iterate.",
},
{
id: "f4",
title: "What if I hate being on camera?",
content: "We have strategies for remote content filming and leveraging team members or high-converting UGC.",
},
{
id: "f5",
title: "How do we get started?",
content: "Book a discovery call to audit your current system, and we'll outline a strategy if we're a match.",
},
]}
ctaTitle="Ready to scale?"
ctaDescription="Book a Free Growth Guidance Call to evaluate your current acquisition system."
ctaButton={{
text: "Book Call Now",
href: "#",
}}
ctaTitle="Scale Your Bookings"
ctaDescription="Book a free 15-minute consultation to audit your current system and see if we're a match."
ctaButton={{ text: "Book Now", href: "#" }}
ctaIcon={Calendar}
faqs={[
{ id: "1", title: "How do we get started?", content: "Book a discovery call so we can audit your current acquisition funnel." },
{ id: "2", title: "Is this suitable for my niche?", content: "We focus on high-ticket service-based local businesses." }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
<FooterBaseCard
logoText="VELROS"
columns={[
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Careers", href: "#" }] },
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQ", href: "#contact" }] }
]}
copyrightText="© 2025 Velros. All rights reserved."
/>
</div>

8
src/app/styles/variables.css
View File

@@ -11,14 +11,14 @@
--background-accent: #ffffff; */
--background: #0a0a0a;
--card: #141414;
--foreground: #ffffff;
--card: #1a1a1a;
--foreground: #f5f5f5;
--primary-cta: #d4af37;
--primary-cta-text: #000000;
--secondary-cta: #1a1a1a;
--secondary-cta-text: #ffffff;
--accent: #333333;
--background-accent: #d4af37;
--accent: #b8860b;
--background-accent: #8b6914;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);