Update src/app/styles/variables.css

Merge version_7 into main

src/app/page.tsx

@@ -45,8 +45,8 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroLogo
-      logoText="JT Production And Visual"
+      logoText="Propulsez Votre Identité Visuelle"
-      description="Production vidéo haut de gamme pour artistes et marques visionnaires."
+      description="Transformez votre image avec une production vidéo d'élite, conçue pour capter l'attention et sublimer votre signature artistique."
       buttons={[
         { text: "Découvrir", href: "#services" },
         { text: "Contact", href: "/contact" },
@@ -58,7 +58,7 @@ export default function LandingPage() {
   <div id="about" data-section="about">
       <TextAbout
       useInvertedBackground={false}
-      title="Plus qu'une agence, une vision."
+      title="Redéfinir le possible, capturer l'excellence."
     />
   </div>
 
@@ -68,13 +68,13 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       metrics={[
-        { id: "m1", title: "Projets réalisés", value: "150+", icon: CheckCircle },
+        { id: "m1", title: "Projets réalisés", value: "200+", icon: CheckCircle },
-        { id: "m2", title: "Artistes accompagnés", value: "40+", icon: Award },
+        { id: "m2", title: "Artistes accompagnés", value: "50+", icon: Award },
-        { id: "m3", title: "Vues générées", value: "10M+", icon: Eye },
+        { id: "m3", title: "Vues générées", value: "15M+", icon: Eye },
-        { id: "m4", title: "Années d'expérience", value: "5+", icon: Clock },
+        { id: "m4", title: "Années d'expérience", value: "7+", icon: Clock },
       ]}
-      title="Nos chiffres"
+      title="L'impact PJT en chiffres"
-      description="Une expertise confirmée par nos réalisations et la confiance de nos partenaires."
+      description="Des résultats tangibles portés par une vision artistique sans compromis."
     />
   </div>
 
@@ -83,10 +83,10 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
-      negativeCard={{ items: ["Direction Artistique", "Prise de Vue Drone", "Distribution Digitale", "Strategy Content"] }}
+      negativeCard={{ items: ["Stratégie de contenu", "Gestion de campagnes", "Distribution digitale", "Consulting artistique"] }}
-      positiveCard={{ items: ["Production Vidéo", "Montage Motion Design", "Color Grading", "Post-Production"] }}
+      positiveCard={{ items: ["Production cinématographique", "Color Grading avancé", "Motion design & VFX", "Prise de vue aérienne"] }}
-      title="Nos services"
+      title="Nos expertises"
-      description="Nous accompagnons vos projets de A à Z avec une exigence technique totale."
+      description="Chaque projet est une opportunité de repousser les limites techniques et créatives."
     />
   </div>
 
@@ -100,8 +100,8 @@ export default function LandingPage() {
         { id: "a1", name: "EDESS", role: "Artiste Associé", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/portrait-of-a-modern-music-artist-edess--1776862514061-4a80a08f.png" },
         { id: "a2", name: "MOCRO KID", role: "Artiste Partenaire", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/portrait-of-a-modern-music-artist-mocro--1776862523184-8cd19ee5.png" },
       ]}
-      title="Artistes en vue"
+      title="Talents de demain"
-      description="Découvrez les talents avec qui nous collaborons quotidiennement."
+      description="Nous collaborons avec des artistes audacieux pour créer des contenus uniques."
     />
   </div>
 
@@ -112,15 +112,12 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={false}
       products={[
-        { id: "p1", name: "Clip Officiel", price: "Music Vidéo", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862533827-d65fc820.png" },
+        { id: "p1", name: "Signature Series Vol. 1", price: "Musique", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862533827-d65fc820.png" },
-        { id: "p2", name: "Teaser Artiste", price: "Social Media", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862544700-a6be436c.png" },
+        { id: "p2", name: "Horizon Visuel", price: "Commercial", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862544700-a6be436c.png" },
-        { id: "p3", name: "Pub Lifestyle", price: "Brand", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862553246-27350114.png" },
+        { id: "p3", name: "Urban Pulse", price: " Lifestyle", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862553246-27350114.png" },
-        { id: "p4", name: "Session Live", price: "Studio", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862561226-00e1bd32.png" },
-        { id: "p5", name: "Documentaire", price: "Feature", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862568094-b1010b6a.png" },
-        { id: "p6", name: "Event Recap", price: "Corporate", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ci1qjHXSCLfuA8FFxvqsQ1UVCw/abstract-dynamic-video-production-reel-c-1776862576307-950bf389.png" },
       ]}
-      title="Dernières réalisations"
+      title="Portfolio de références"
-      description="Un aperçu de notre univers visuel et créatif."
+      description="Le reflet de notre savoir-faire au service de votre identité."
     />
   </div>
 
@@ -128,8 +125,8 @@ export default function LandingPage() {
       <ContactText
       useInvertedBackground={false}
       background={{ variant: "gradient-bars" }}
-      text="Prêt à passer au niveau supérieur ? Rejoins JT Production."
+      text="Une vision unique mérite une production d'exception."
-      buttons={[{ text: "Contacte-nous", href: "/contact" }]}
+      buttons={[{ text: "Démarrer votre projet", href: "/contact" }]}
     />
   </div>
 
@@ -139,8 +136,8 @@ export default function LandingPage() {
         { title: "PJT", items: [{ label: "Portfolio", href: "/portfolio" }, { label: "Services", href: "/services" }] },
         { title: "Infos", items: [{ label: "Tarifs", href: "/tarifs" }, { label: "Contact", href: "/contact" }] },
       ]}
-      bottomLeftText="© 2024 JT Production."
+      bottomLeftText="© 2025 JT Production."
-      bottomRightText="All rights reserved."
+      bottomRightText="Tous droits réservés."
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ff0808;
+  --background: #ffffff;
-  --card: #1a1a1a;
+  --card: #f8f9fa;
-  --foreground: #FFFFFF;
+  --foreground: #1a1a1a;
-  --primary-cta: #FFD700;
+  --primary-cta: #ef4444;
-  --primary-cta-text: #000000;
+  --primary-cta-text: #0a051a;
-  --secondary-cta: #1a1a1a;
+  --secondary-cta: #fca5a5;
-  --secondary-cta-text: #FFFFFF;
+  --secondary-cta-text: #d4d4f6;
-  --accent: #FFD700;
+  --accent: #dc2626;
-  --background-accent: #333333;
+  --background-accent: #fee2e2;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/app/tarifs/page.tsx

@@ -3,11 +3,12 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactText from '@/components/sections/contact/ContactText';
-import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import { CheckCircle } from "lucide-react";
 
-export default function LandingPage() {
+export default function TarifsPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="icon-arrow"
@@ -37,15 +38,24 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="feature" data-section="feature">
+  <div id="pricing" data-section="pricing">
-      <FeatureCardSixteen
+      <PricingCardEight
       animationType="slide-up"
+      title="Nos Tarifs & Packages"
+      description="Des solutions sur mesure pour artistes et professionnels."
       textboxLayout="default"
       useInvertedBackground={false}
-      title="Packages"
+      plans={[
-      description="Nos offres tarifaires."
+        {
-      positiveCard={{ items: ["Pack Gold", "Pack Platinum"] }}
+          id: "artist-pack",          badge: "Artistes",          price: "Sur Devis",          subtitle: "Pour vos projets musicaux",          features: ["Clip Officiel 4K", "Shooting Photo Promo", "Stratégie de sortie", "Distribution Digitale"],
-      negativeCard={{ items: ["Pack Silver", "Starter"] }}
+          buttons: [{ text: "Contactez-nous", href: "/contact" }]
+        },
+        {
+          id: "pro-pack",          badge: "Professionnels",          badgeIcon: CheckCircle,
+          price: "Sur Devis",          subtitle: "Contenu corporate & brand",          features: ["Production Événementielle", "Pub Lifestyle", "Hôtellerie incluse", "Montage & Étalonnage Pro"],
+          buttons: [{ text: "Contactez-nous", href: "/contact" }]
+        }
+      ]}
     />
   </div>
 
@@ -53,8 +63,8 @@ export default function LandingPage() {
       <ContactText
       useInvertedBackground={false}
       background={{ variant: "plain" }}
-      text="Sur mesure."
+      text="Conditions de réservation : Réservation sous 30 jours, déplacement facturé selon distance. Devis personnalisé après étude de votre brief."
-      buttons={[{ text: "Devis", href: "/contact" }]}
+      buttons={[{ text: "Demander un devis", href: "/contact" }]}
     />
   </div>