src/App.tsx

@@ -3,7 +3,7 @@ import ContactSplitEmail from '@/components/sections/contact/ContactSplitEmail';
 import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
 import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
 import FooterSimpleCard from '@/components/sections/footer/FooterSimpleCard';
-import HeroSplitMediaGrid from '@/components/sections/hero/HeroSplitMediaGrid';
+import Hero from '@/components/sections/hero/Hero';
 import NavbarCentered from '@/components/ui/NavbarCentered';
 import ProductMediaCards from '@/components/sections/product/ProductMediaCards';
 import TestimonialOverlayCards from '@/components/sections/testimonial/TestimonialOverlayCards';
@@ -13,7 +13,7 @@ export default function App() {
     <>
   <div id="nav" data-section="nav">
       <NavbarCentered
-      logo="Mine"
+      logo="Valla"
       navItems={[
         {
           name: "Home",
@@ -40,34 +40,14 @@ export default function App() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroSplitMediaGrid
-      tag="Luxury Florals"
-      title="Flowers Crafted for Your Most Precious Moments"
-      description="Mine Studio brings nature's finest petals together to create lasting memories. Hand-selected, artisan-arranged, delivered to your doorstep."
-      primaryButton={{
-        text: "Explore Collection",
-        href: "#products",
-      }}
-      secondaryButton={{
-        text: "Contact Us",
-        href: "#contact",
-      }}
-      items={[
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=drxwpp",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=umoq0j",
-        },
-      ]}
-    />
+      <Hero />
   </div>
 
   <div id="about" data-section="about">
       <AboutMediaOverlay
       tag="Our Story"
       title="Where Art Meets Petals"
-      description="At Mine, we believe flowers are more than decoration; they are language. We source locally, design passionately, and deliver joy. Our team of skilled floral artisans curates every arrangement with precision and love."
+      description="At Valla, we believe flowers are more than decoration; they are language. We source locally, design passionately, and deliver joy. Our team of skilled floral artisans curates every arrangement with precision and love."
       imageSrc="https://img.b2bpic.net/free-photo/top-view-table-full-food_23-2149209253.jpg?id=21088367"
     />
   </div>
@@ -152,35 +132,35 @@ export default function App() {
         {
           name: "Elena R.",
           role: "Wedding Client",
-          company: "Mine Studio",
+          company: "Valla",
           rating: 5,
           imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jzbjqq",
         },
         {
           name: "Mark S.",
           role: "Subscriber",
-          company: "Mine Studio",
+          company: "Valla",
           rating: 5,
           imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=twhw4g",
         },
         {
           name: "Sarah J.",
           role: "Event Planner",
-          company: "Mine Studio",
+          company: "Valla",
           rating: 5,
           imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=35x1z4",
         },
         {
           name: "David W.",
           role: "Gifting",
-          company: "Mine Studio",
+          company: "Valla",
           rating: 5,
           imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h8agz9",
         },
         {
           name: "Jenny L.",
           role: "Home Decor",
-          company: "Mine Studio",
+          company: "Valla",
           rating: 5,
           imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9884ym",
         },
@@ -227,7 +207,7 @@ export default function App() {
 
   <div id="footer" data-section="footer">
       <FooterSimpleCard
-      brand="Mine Flowers Studio"
+      brand="Valla"
       columns={[
         {
           title: "Shop",
@@ -247,7 +227,7 @@ export default function App() {
           ],
         },
         {
-          title: "Mine",
+          title: "Valla",
           items: [
             {
               label: "About Us",
@@ -277,7 +257,7 @@ export default function App() {
           ],
         },
       ]}
-      copyright="© 2024 Mine Flowers Studio. All rights reserved."
+      copyright="© 2024 Valla. All rights reserved."
       links={[
         {
           label: "Instagram",
@@ -292,4 +272,4 @@ export default function App() {
   </div>
     </>
   );
-}
+}

src/components/sections/hero/Hero.tsx

@@ -0,0 +1,28 @@
+export default function Hero() {
+  return (
+    <section aria-label="Hero section" className="relative w-full h-screen min-h-[600px] flex items-center justify-center overflow-hidden">
+      <div className="absolute inset-0 z-0">
+        <img 
+          src="https://images.unsplash.com/photo-1490750967868-88aa4486c946?q=80&w=2940&auto=format&fit=crop" 
+          alt="Hero background" 
+          className="w-full h-full object-cover"
+        />
+        <div className="absolute inset-0 bg-black/40" />
+      </div>
+      <div className="relative z-10 flex flex-col items-center gap-6 text-center px-6 w-content-width mx-auto">
+        <h1 className="text-8xl md:text-9xl font-medium text-foreground tracking-tighter">Valla</h1>
+        <p className="text-xl md:text-2xl text-white/90 max-w-2xl">
+          Flowers Crafted for Your Most Precious Moments
+        </p>
+        <div className="flex gap-4 mt-4">
+          <a href="#products" className="px-8 py-3 primary-button text-primary-cta-text font-medium rounded transition-opacity hover:opacity-90">
+            Explore Collection
+          </a>
+          <a href="#contact" className="px-8 py-3 secondary-button text-foreground font-medium rounded transition-opacity hover:opacity-90">
+            Contact Us
+          </a>
+        </div>
+      </div>
+    </section>
+  );
+}