2026-03-03 22:13:05 +00:00
4 changed files with 47 additions and 47 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,12 +1,12 @@
 import type { Metadata } from "next";
-import { Mulish } 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 mulish = Mulish({
-  variable: "--font-mulish",  subsets: ["latin"],
+const dmSans = DM_Sans({
+  variable: "--font-dm-sans",  subsets: ["latin"],
 });

 const inter = Inter({
@@ -43,7 +43,7 @@ export default function RootLayout({
    <html lang="en" suppressHydrationWarning>
      <ServiceWrapper>
        <body
-          className={`${mulish.variable} ${inter.variable} antialiased`}
+          className={`${dmSans.variable} ${inter.variable} antialiased`}
        >
          <Tag />
          {children}
@@ -1418,4 +1418,4 @@ export default function RootLayout({
      </ServiceWrapper>
    </html>
  );
-}
+}
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -15,16 +15,16 @@ import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis"
 export default function LandingPage() {
  return (
    <ThemeProvider
-      defaultButtonVariant="hover-bubble"
-      defaultTextAnimation="background-highlight"
-      borderRadius="soft"
-      contentWidth="small"
-      sizing="large"
-      background="blurBottom"
-      cardStyle="subtle-shadow"
-      primaryButtonStyle="shadow"
-      secondaryButtonStyle="radial-glow"
-      headingFontWeight="extrabold"
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="mediumLarge"
+      sizing="largeSizeMediumTitles"
+      background="none"
+      cardStyle="glass-depth"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="solid"
+      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
@@ -42,24 +42,24 @@ export default function LandingPage() {
        <HeroSplitKpi
          title="Skin that Glows from Within"
          description="Discover luxury skincare crafted with nature's most potent ingredients. Transform your skin with our award-winning formulas designed for radiance and renewal."
-          background={{ variant: "sparkles-gradient" }}
+          background={{ variant: "plain" }}
          kpis={[
            { value: "98%", label: "Customer Satisfaction" },
            { value: "100%", label: "Natural Ingredients" },
            { value: "30+", label: "Years of Expertise" }
          ]}
-          enableKpiAnimation={true}
+          enableKpiAnimation={false}
          tag="Luxury Skincare"
          tagIcon={Sparkles}
-          tagAnimation="blur-reveal"
+          tagAnimation="none"
          buttons={[
            { text: "Shop Now", href: "#products" },
            { text: "Learn More", href: "#about" }
          ]}
-          buttonAnimation="slide-up"
+          buttonAnimation="none"
          imageSrc="http://img.b2bpic.net/free-photo/high-angle-plant-selfcare-products_23-2149249586.jpg"
          imageAlt="Luxury skincare products showcase"
-          mediaAnimation="blur-reveal"
+          mediaAnimation="none"
          imagePosition="right"
        />
      </div>
@@ -68,14 +68,14 @@ export default function LandingPage() {
        <TestimonialAboutCard
          tag="Our Story"
          tagIcon={Heart}
-          tagAnimation="slide-up"
+          tagAnimation="none"
          title="Radiant was born from a passion for pure, transformative skincare. Every product is crafted with intention."
          description="Founded in 1993"
          subdescription="Premium Beauty Brand"
          icon={Leaf}
          imageSrc="http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-cleaning-with-lemon_23-2148883424.jpg"
          imageAlt="Founder story"
-          mediaAnimation="blur-reveal"
+          mediaAnimation="none"
          useInvertedBackground={false}
        />
      </div>
@@ -99,22 +99,22 @@ export default function LandingPage() {
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
-          animationType="slide-up"
+          animationType="none"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          tag="Benefits"
          tagIcon={CheckCircle}
-          tagAnimation="blur-reveal"
+          tagAnimation="none"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardTwo
          title="Our Collection"
-          description="Discover our bestselling skincare essentials loved by thousands. Curated with precision and crafted for luxury minimalism."
+          description="Discover our bestselling skincare essentials loved by thousands"
          tag="Bestsellers"
          tagIcon={Award}
-          tagAnimation="blur-reveal"
+          tagAnimation="none"
          products={[
            {
              id: "1",              brand: "Radiant",              name: "Luminous Facial Serum",              price: "$89.00",              rating: 5,
@@ -134,11 +134,11 @@ export default function LandingPage() {
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
-          animationType="slide-up"
+          animationType="none"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[{ text: "View All Products", href: "#products" }]}
-          buttonAnimation="blur-reveal"
+          buttonAnimation="none"
        />
      </div>

@@ -155,8 +155,8 @@ export default function LandingPage() {
            { src: "http://img.b2bpic.net/free-photo/happy-business-woman-white-shirt_23-2148095748.jpg", alt: "Customer testimonial" },
            { src: "http://img.b2bpic.net/free-photo/happy-business-woman-white-shirt_23-2148095748.jpg", alt: "Customer testimonial" }
          ]}
-          ratingAnimation="blur-reveal"
-          avatarsAnimation="slide-up"
+          ratingAnimation="none"
+          avatarsAnimation="none"
          useInvertedBackground={false}
        />
      </div>
@@ -167,7 +167,7 @@ export default function LandingPage() {
          description="Featured in the world's most prestigious beauty and wellness media outlets"
          tag="Awards & Recognition"
          tagIcon={Award}
-          tagAnimation="blur-reveal"
+          tagAnimation="none"
          textboxLayout="default"
          useInvertedBackground={false}
          logos={[
@@ -185,14 +185,14 @@ export default function LandingPage() {
        <ContactSplit
          tag="Stay Connected"
          tagIcon={Mail}
-          tagAnimation="blur-reveal"
+          tagAnimation="none"
          title="Get exclusive skincare tips and beauty insights"
          description="Join thousands of beauty enthusiasts receiving our curated newsletter with ingredient deep-dives, expert tips, and exclusive offers."
-          background={{ variant: "sparkles-gradient" }}
+          background={{ variant: "plain" }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-vector/ecommerce-email-template-collection_23-2148742262.jpg"
          imageAlt="Newsletter subscription"
-          mediaAnimation="blur-reveal"
+          mediaAnimation="none"
          mediaPosition="right"
          inputPlaceholder="Enter your email"
          buttonText="Subscribe"
@@ -237,4 +237,4 @@ export default function LandingPage() {
      </div>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/styles/base.css
+++ b/src/app/styles/base.css
@@ -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-mulish), sans-serif;
+  font-family: var(--font-dm-sans), sans-serif;
 }
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -4,21 +4,21 @@

  /* --background: #ffffff;;
  --card: #f9f9f9;;
-  --foreground: #120a00e6;;
-  --primary-cta: #FF7B05;;
-  --secondary-cta: #f9f9f9;;
-  --accent: #e2e2e2;;
-  --background-accent: #FF7B05;; */
+  --foreground: #1a1a1a;;
+  --primary-cta: #000000;;
+  --secondary-cta: #e8e8e8;;
+  --accent: #d0d0d0;;
+  --background-accent: #f0f0f0;; */

  --background: #ffffff;;
  --card: #f9f9f9;;
-  --foreground: #120a00e6;;
-  --primary-cta: #FF7B05;;
+  --foreground: #1a1a1a;;
+  --primary-cta: #000000;;
  --primary-cta-text: #ffffff;;
-  --secondary-cta: #f9f9f9;;
+  --secondary-cta: #e8e8e8;;
  --secondary-cta-text: #120a00e6;;
-  --accent: #e2e2e2;;
-  --background-accent: #FF7B05;;
+  --accent: #d0d0d0;;
+  --background-accent: #f0f0f0;;

  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);