Update src/app/styles/variables.css

Merge version_3 into main

src/app/page.tsx

@@ -2,16 +2,12 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
 import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterBase from '@/components/sections/footer/FooterBase';
 import HeroOverlay from '@/components/sections/hero/HeroOverlay';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
 import { Zap } from "lucide-react";
 
 export default function LandingPage() {
@@ -31,29 +27,9 @@ export default function LandingPage() {
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingInline
-      navItems={[
+      navItems={[]}
-        {
-          name: "Features",
-          id: "features",
-        },
-        {
-          name: "Pricing",
-          id: "pricing",
-        },
-        {
-          name: "FAQ",
-          id: "faq",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
-      ]}
       brandName="Usta.ai"
-      button={{
+      button={{ text: "Get Started", href: "#contact" }}
-        text: "Get Started",
-        href: "#contact",
-      }}
     />
   </div>
 
@@ -61,276 +37,62 @@ export default function LandingPage() {
       <HeroOverlay
       title="Build Smarter AI, Faster."
       description="Usta.ai empowers teams to rapidly build, deploy, and scale custom AI solutions without the complexity. Your platform for innovation."
-      buttons={[
+      buttons={[{ text: "Start Building", href: "#contact" }]}
-        {
+      imageSrc="https://img.b2bpic.net/free-photo/mountain-landscape-peak-top-view-nature-travel-concept_123827-23424.jpg"
-          text: "Start Building",
+      imageAlt="Majestic mountain peak landscape"
-          href: "#contact",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/futuristic-ai-data-visualization_23-2151977857.jpg"
-      imageAlt="Usta.ai Platform Dashboard"
       showBlur={true}
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg",
-          alt: "User avatar",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/closeup-beautiful-strict-woman-glasses_1262-1732.jpg",
-          alt: "User avatar",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",
-          alt: "User avatar",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/friendly-successful-business-woman-posing-with-arms-crossed_74855-2813.jpg",
-          alt: "User avatar",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/african-guy-wears-trendy-wristwatch-posing-with-smile-near-beige-wall-outdoor-portrait-black-man-good-mood-standing-with-arms-crossed_197531-21794.jpg",
-          alt: "User avatar",
-        },
-      ]}
       avatarText="Join 5,000+ developers"
     />
   </div>
 
   <div id="features" data-section="features">
       <FeatureCardTwentyOne
-      useInvertedBackground={false}
       title="Engineered for Efficiency"
       description="Powerful capabilities to transform your workflow."
       accordionItems={[
-        {
+        { id: "f1", title: "Modular AI Blocks", content: "Connect pre-built logic blocks to create complex AI flows without writing code." },
-          id: "f1",
+        { id: "f2", title: "Real-time Deployment", content: "One-click deployment to any cloud provider or edge device." },
-          title: "Modular AI Blocks",
+        { id: "f3", title: "Auto-scaling Infrastructure", content: "Our backend automatically scales to handle your most demanding AI models." },
-          content: "Connect pre-built logic blocks to create complex AI flows without writing code.",
-        },
-        {
-          id: "f2",
-          title: "Real-time Deployment",
-          content: "One-click deployment to any cloud provider or edge device.",
-        },
-        {
-          id: "f3",
-          title: "Auto-scaling Infrastructure",
-          content: "Our backend automatically scales to handle your most demanding AI models.",
-        },
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/3d-shape-glowing-with-bright-holographic-colors_23-2151037254.jpg"
+      imageSrc="https://img.b2bpic.net/free-photo/planet-earth-orbit-space-background-concept_123827-23455.jpg"
       mediaAnimation="slide-up"
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="about" data-section="about">
       <TestimonialAboutCard
-      useInvertedBackground={true}
       tag="Our Mission"
-      title="Democratizing AI Development"
+      title="Scaling New Horizons"
-      description="At Usta.ai, we believe every organization should have access to world-class artificial intelligence tools."
+      description="At Usta.ai, we are charting a path towards intelligent infrastructure that feels as vast and limitless as the cosmos."
-      subdescription="We are bridging the gap between complex research and practical application."
+      subdescription="We are bridging the gap between complex research and planetary-scale application."
       icon={Zap}
-      imageSrc="http://img.b2bpic.net/free-photo/programmer-colleague-office-training-machine-learning-algorithms_482257-116901.jpg"
+      imageSrc="https://img.b2bpic.net/free-photo/astronomer-looking-stars-night-sky-mountain_123827-23412.jpg"
       mediaAnimation="blur-reveal"
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="social-proof" data-section="social-proof">
       <SocialProofOne
+      names={["InnovateLab", "DataCore", "NexTech", "CloudScale", "VisionaryAI"]}
+      title="Trusted by Global Explorers"
+      description="Driving innovation across the tech frontier."
       textboxLayout="default"
       useInvertedBackground={false}
-      names={[
-        "InnovateLab",
-        "DataCore",
-        "NexTech",
-        "CloudScale",
-        "VisionaryAI",
-        "LogicSoft",
-        "QuantumOps",
-      ]}
-      title="Trusted by Industry Leaders"
-      description="Driving innovation across global enterprises."
-    />
-  </div>
-
-  <div id="pricing" data-section="pricing">
-      <PricingCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={true}
-      plans={[
-        {
-          id: "p1",
-          badge: "Starter",
-          price: "$99",
-          subtitle: "For early-stage startups",
-          features: [
-            "5 AI Models",
-            "Standard Support",
-            "Shared Infrastructure",
-          ],
-        },
-        {
-          id: "p2",
-          badge: "Professional",
-          price: "$299",
-          subtitle: "For growing teams",
-          features: [
-            "20 AI Models",
-            "Priority Support",
-            "Dedicated Resources",
-          ],
-        },
-        {
-          id: "p3",
-          badge: "Enterprise",
-          price: "Custom",
-          subtitle: "For large organizations",
-          features: [
-            "Unlimited Models",
-            "24/7 Dedicated Support",
-            "Enterprise Security",
-          ],
-        },
-      ]}
-      title="Simple, Scalable Pricing"
-      description="Plans designed for teams of any size."
-    />
-  </div>
-
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardTwo
-      animationType="scale-rotate"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "t1",
-          name: "Sarah Chen",
-          role: "Head of AI",
-          testimonial: "Usta.ai reduced our development time by 70%. It's a game-changer.",
-          imageSrc: "http://img.b2bpic.net/free-photo/scientist-factory-using-tablet-check-photovoltaics-materials-parameters_482257-120526.jpg",
-        },
-        {
-          id: "t2",
-          name: "Mark Miller",
-          role: "CTO",
-          testimonial: "The most intuitive platform for scaling custom models I've ever used.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-entrepreneur-with-corporate-job-looking-camera-business-office-portrait-young-man-preparing-work-planning-development-industry-with-technology-computer_482257-29387.jpg",
-        },
-        {
-          id: "t3",
-          name: "Elena Rossi",
-          role: "Lead Engineer",
-          testimonial: "Reliable, fast, and simple. Everything we need in one place.",
-          imageSrc: "http://img.b2bpic.net/free-photo/factory-inspector-suit-monitoring-solar-panel-production-output_482257-125982.jpg",
-        },
-        {
-          id: "t4",
-          name: "David Park",
-          role: "Product Lead",
-          testimonial: "Usta.ai made deploying our AI solution a seamless experience.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-doing-presentation-meeting_23-2148817046.jpg",
-        },
-        {
-          id: "t5",
-          name: "Jana Schmidt",
-          role: "Researcher",
-          testimonial: "Finally, a builder platform that actually understands how we work.",
-          imageSrc: "http://img.b2bpic.net/free-photo/pov-businessman-attending-videocall-meeting-office-using-online-videoconference-talk-consultant-about-financial-strategy-company-employee-chatting-remote-teleconference-close-up_482257-40929.jpg",
-        },
-      ]}
-      title="Loved by Developers Worldwide"
-      description="See why teams choose Usta.ai."
-    />
-  </div>
-
-  <div id="faq" data-section="faq">
-      <FaqSplitText
-      useInvertedBackground={true}
-      faqs={[
-        {
-          id: "q1",
-          title: "Is coding required?",
-          content: "No, our visual builder allows you to create complex AI workflows entirely without code.",
-        },
-        {
-          id: "q2",
-          title: "Can I export my models?",
-          content: "Yes, you can export your models and deploy them to your own infrastructure easily.",
-        },
-        {
-          id: "q3",
-          title: "What cloud providers do you support?",
-          content: "We support AWS, Google Cloud, and Azure for easy deployment.",
-        },
-      ]}
-      sideTitle="Questions? Answers."
-      faqsAnimation="blur-reveal"
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactSplitForm
-      useInvertedBackground={false}
-      title="Ready to Start?"
-      description="Reach out to our team to schedule a demo."
-      inputs={[
-        {
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Your Email",
-          required: true,
-        },
-      ]}
-      textarea={{
-        name: "message",
-        placeholder: "Tell us about your project",
-        required: true,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/laptop-desk-office-showing-stock-exchange-indices_482257-106388.jpg"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterBase
-      columns={[
-        {
-          items: [
-            {
-              label: "Features",
-              href: "#features",
-            },
-            {
-              label: "Pricing",
-              href: "#pricing",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Support",
-              href: "#",
-            },
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-          ],
-        },
-      ]}
       logoText="Usta.ai"
+      columns={[
+        { title: "Product", items: [{ label: "Features", href: "#features" }] },
+        { title: "Support", items: [{ label: "Privacy", href: "#" }] },
+      ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-dm-sans), sans-serif;
+  font-family: var(--font-figtree), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-manrope), sans-serif;
+  font-family: var(--font-figtree), sans-serif;
 }

src/app/styles/variables.css

@@ -11,14 +11,14 @@
   --background-accent: #ffffff; */
 
   --background: #000000;
-  --card: #1a2f1d;
+  --card: #0f0f0f;
   --foreground: #ffffff;
-  --primary-cta: #ffffff;
+  --primary-cta: #f97316;
   --primary-cta-text: #0a1a0c;
-  --secondary-cta: #0d200f;
+  --secondary-cta: #171717;
   --secondary-cta-text: #d4f6d8;
-  --accent: #1a3d1f;
+  --accent: #f97316;
-  --background-accent: #355e3b;
+  --background-accent: #171717;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);