Merge version_3 into main #3
@@ -1,12 +1,12 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Public_Sans } from "next/font/google";
|
||||
import { DM_Sans } from "next/font/google";
|
||||
import { Inter } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||
import Tag from "@/tag/Tag";
|
||||
|
||||
const publicSans = Public_Sans({
|
||||
variable: "--font-public-sans", subsets: ["latin"],
|
||||
const dmSans = DM_Sans({
|
||||
variable: "--font-dm-sans", subsets: ["latin"],
|
||||
});
|
||||
|
||||
const inter = Inter({
|
||||
@@ -14,17 +14,17 @@ const inter = Inter({
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Premium Creative Studio | Branding, Video & Web Design", description: "Award-winning creative studio specializing in brand strategy, cinematic video production, and custom web design for ambitious founders and studios.", keywords: "creative studio, branding, video production, web design, brand identity, portfolio", metadataBase: new URL("https://studio.co"),
|
||||
title: "Creative Agency | Strategic Branding & Design", description: "We craft editorial, sophisticated creative campaigns for brands with vision. Strategic design, compelling storytelling, and real impact.", keywords: "creative agency, branding, design, editorial, strategic creative, brand design", metadataBase: new URL("https://studio.co"),
|
||||
alternates: {
|
||||
canonical: "https://studio.co"},
|
||||
openGraph: {
|
||||
title: "Premium Creative Studio | Branding, Video & Web Design", description: "Strategic creativity for studios, startups, and visionary founders who refuse ordinary.", url: "https://studio.co", siteName: "Studio", images: [
|
||||
title: "Creative Agency | Strategic Branding & Design", description: "Sophisticated creative solutions for ambitious brands.", url: "https://studio.co", siteName: "Studio", images: [
|
||||
{
|
||||
url: "http://img.b2bpic.net/free-photo/office-desk-filled-with-productivity-items-empty-home_482257-101134.jpg", alt: "Studio portfolio showcase"},
|
||||
url: "http://img.b2bpic.net/free-photo/office-desk-filled-with-productivity-items-empty-home_482257-101134.jpg", alt: "Creative studio workspace"},
|
||||
],
|
||||
type: "website"},
|
||||
twitter: {
|
||||
card: "summary_large_image", title: "Premium Creative Studio | Branding, Video & Web Design", description: "Strategic creativity for studios, startups, and visionary founders who refuse ordinary.", images: [
|
||||
card: "summary_large_image", title: "Creative Agency | Strategic Branding & Design", description: "Sophisticated creative solutions for ambitious brands.", images: [
|
||||
"http://img.b2bpic.net/free-photo/office-desk-filled-with-productivity-items-empty-home_482257-101134.jpg"],
|
||||
},
|
||||
robots: {
|
||||
@@ -42,7 +42,7 @@ export default function RootLayout({
|
||||
<html lang="en" suppressHydrationWarning>
|
||||
<ServiceWrapper>
|
||||
<body
|
||||
className={`${publicSans.variable} ${inter.variable} antialiased`}
|
||||
className={`${dmSans.variable} ${inter.variable} antialiased`}
|
||||
>
|
||||
<Tag />
|
||||
{children}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { Sparkles, Send } from "lucide-react";
|
||||
import { Sparkles, Send, ArrowRight } from "lucide-react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
|
||||
@@ -14,19 +14,18 @@ import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
export default function HomePage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Work", id: "/work" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
{ name: "Work", id: "featured-work" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Navigate", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Work", href: "/work" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Featured Work", href: "#featured-work" },
|
||||
{ label: "Services", href: "#services" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -34,7 +33,7 @@ export default function HomePage() {
|
||||
{ label: "Instagram", href: "https://instagram.com" },
|
||||
{ label: "LinkedIn", href: "https://linkedin.com" },
|
||||
{ label: "Email", href: "mailto:hello@studio.co" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -48,51 +47,51 @@ export default function HomePage() {
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="fluid"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="radial-glow"
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="none"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="Studio"
|
||||
bottomLeftText="Premium Creative Studio"
|
||||
bottomLeftText="Editorial Creative Studio"
|
||||
bottomRightText="hello@studio.co"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
title="We build brands that mean something"
|
||||
description="Strategic creativity for studios, startups, and visionary founders who refuse ordinary."
|
||||
title="Strategic creativity with editorial edge"
|
||||
description="We craft sophisticated campaigns that move culture forward. Real impact through confident design, compelling storytelling, and intentional craft."
|
||||
background={{ variant: "plain" }}
|
||||
tag="Premium Studio"
|
||||
tag="Creative Agency"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="blur-reveal"
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{ text: "View Work", href: "/work" },
|
||||
{ text: "Start a Project", href: "/contact" },
|
||||
{ text: "View Work", href: "featured-work" },
|
||||
{ text: "Start a Project", href: "contact" },
|
||||
]}
|
||||
buttonAnimation="blur-reveal"
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/office-desk-filled-with-productivity-items-empty-home_482257-101134.jpg"
|
||||
imageAlt="Creative studio workspace"
|
||||
mediaAnimation="blur-reveal"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="featured-work" data-section="featured-work">
|
||||
<ProductCardThree
|
||||
title="Featured Projects"
|
||||
description="A curated selection of recent work across branding, video, web, and social."
|
||||
description="A selection of recent work that demonstrates strategic thinking, visual excellence, and meaningful results. Each project showcases our approach to creating lasting cultural impact."
|
||||
tag="Case Studies"
|
||||
tagAnimation="blur-reveal"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
@@ -106,20 +105,20 @@ export default function HomePage() {
|
||||
id: "4", name: "Social Campaign", price: "View Case Study", imageSrc: "http://img.b2bpic.net/free-psd/winning-marketing-game-online-template_23-2151997287.jpg?_wi=1", imageAlt: "Social media campaign"},
|
||||
]}
|
||||
gridVariant="bento-grid"
|
||||
animationType="blur-reveal"
|
||||
animationType="scale-rotate"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
title="What Our Clients Say"
|
||||
description="Real feedback from founders and creative directors we've partnered with."
|
||||
title="What Visionary Brands Say"
|
||||
description="Recognition from founders and creative directors who trust us to deliver work that resonates."
|
||||
tag="Client Stories"
|
||||
tagAnimation="blur-reveal"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
gridVariant="uniform-all-items-equal"
|
||||
animationType="blur-reveal"
|
||||
animationType="scale-rotate"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Chen", role: "Founder", company: "Momentum Labs", rating: 5,
|
||||
@@ -139,31 +138,31 @@ export default function HomePage() {
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<PricingCardFive
|
||||
title="How We Work"
|
||||
description="Service offerings designed for ambitious brands and studios."
|
||||
title="How We Create"
|
||||
description="Service offerings designed for ambitious brands seeking editorial excellence and strategic impact."
|
||||
tag="Services"
|
||||
tagAnimation="blur-reveal"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="blur-reveal"
|
||||
animationType="scale-rotate"
|
||||
plans={[
|
||||
{
|
||||
id: "branding", tag: "Brand Strategy & Design", price: "From £3,500", period: "", description:
|
||||
"Complete brand identity systems, guidelines, and visual language.", button: { text: "Inquire", href: "/contact" },
|
||||
"Complete brand identity systems, guidelines, and visual language that communicate with clarity and sophistication.", button: { text: "Inquire", href: "contact" },
|
||||
featuresTitle: "Includes:", features: [
|
||||
"Brand strategy workshop", "Logo and visual system design", "Brand guidelines document", "Unlimited revisions", "3-month support"],
|
||||
"Strategic brand workshop", "Visual identity system design", "Comprehensive brand guidelines", "Unlimited revisions", "3-month strategic support"],
|
||||
},
|
||||
{
|
||||
id: "video", tag: "Video & Motion", price: "From £5,000", period: "", description:
|
||||
"Cinematic video production, motion design, and post-production.", button: { text: "Inquire", href: "/contact" },
|
||||
"Cinematic video production and motion design that tells your story with editorial precision and artistic vision.", button: { text: "Inquire", href: "contact" },
|
||||
featuresTitle: "Includes:", features: [
|
||||
"Concept and storyboarding", "Professional production", "Color grading and motion design", "Revisions and exports", "4K delivery formats"],
|
||||
"Concept development and storyboarding", "Professional production direction", "Color grading and motion design", "Multiple revision rounds", "4K and web-optimized deliverables"],
|
||||
},
|
||||
{
|
||||
id: "web", tag: "Web Design & Development", price: "From £4,200", period: "", description:
|
||||
"Custom web experiences from design through full-stack development.", button: { text: "Inquire", href: "/contact" },
|
||||
"Custom web experiences from concept through development—thoughtfully designed for performance, aesthetics, and user engagement.", button: { text: "Inquire", href: "contact" },
|
||||
featuresTitle: "Includes:", features: [
|
||||
"User experience design", "Responsive design mockups", "Front-end and back-end development", "SEO optimization", "Performance optimization"],
|
||||
"Strategic UX design process", "High-fidelity design mockups", "Full-stack development", "SEO optimization", "Performance and accessibility optimization"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -172,10 +171,10 @@ export default function HomePage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Get In Touch"
|
||||
title="Start Your Project"
|
||||
description="We typically respond within 24 hours. Let's discuss how we can bring your vision to life."
|
||||
title="Let's Create Something Meaningful"
|
||||
description="We typically respond within 24 hours. Share your vision, and let's discuss how we can bring it to life with intention and excellence."
|
||||
tagIcon={Send}
|
||||
tagAnimation="blur-reveal"
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
inputPlaceholder="your@email.com"
|
||||
@@ -188,7 +187,7 @@ export default function HomePage() {
|
||||
<FooterSimple
|
||||
columns={footerColumns}
|
||||
bottomLeftText="© 2025 Studio. All rights reserved."
|
||||
bottomRightText="Crafted with intent"
|
||||
bottomRightText="Crafted with intention and care"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
|
||||
@@ -11,7 +11,7 @@ html {
|
||||
body {
|
||||
background-color: var(--background);
|
||||
color: var(--foreground);
|
||||
font-family: var(--font-inter), sans-serif;
|
||||
font-family: var(--font-dm-sans), sans-serif;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
overscroll-behavior: none;
|
||||
@@ -24,5 +24,5 @@ h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-public-sans), sans-serif;
|
||||
font-family: var(--font-dm-sans), sans-serif;
|
||||
}
|
||||
|
||||
@@ -2,23 +2,23 @@
|
||||
/* Base units */
|
||||
/* --vw is set by ThemeProvider */
|
||||
|
||||
/* --background: #080000;;
|
||||
--card: #1e0d0d;;
|
||||
--foreground: #ffe6e6;;
|
||||
--primary-cta: #ff7a7a;;
|
||||
--secondary-cta: #1e0909;;
|
||||
--accent: #7b4242;;
|
||||
--background-accent: #65292c;; */
|
||||
/* --background: #f5f4ef;;
|
||||
--card: #ffffff;;
|
||||
--foreground: #2a2928;;
|
||||
--primary-cta: #2a2928;;
|
||||
--secondary-cta: #ecebea;;
|
||||
--accent: #ffffff;;
|
||||
--background-accent: #c6b180;; */
|
||||
|
||||
--background: #080000;;
|
||||
--card: #1e0d0d;;
|
||||
--foreground: #ffe6e6;;
|
||||
--primary-cta: #ff7a7a;;
|
||||
--background: #f5f4ef;;
|
||||
--card: #ffffff;;
|
||||
--foreground: #2a2928;;
|
||||
--primary-cta: #2a2928;;
|
||||
--primary-cta-text: #080000;;
|
||||
--secondary-cta: #1e0909;;
|
||||
--secondary-cta: #ecebea;;
|
||||
--secondary-cta-text: #ffe6e6;;
|
||||
--accent: #7b4242;;
|
||||
--background-accent: #65292c;;
|
||||
--accent: #ffffff;;
|
||||
--background-accent: #c6b180;;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user