Update src/app/styles/variables.css

Merge version_6 into main

src/app/page.tsx

@@ -32,16 +32,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "Home", id: "hero"},
-          name: "Home",          id: "hero"},
+        { name: "About", id: "about"},
-        {
+        { name: "Music", id: "features"},
-          name: "About",          id: "about"},
+        { name: "Store", id: "products"},
-        {
+        { name: "Tour", id: "contact"},
-          name: "Music",          id: "features"},
-        {
-          name: "Store",          id: "products"},
-        {
-          name: "Tour",          id: "contact"},
       ]}
       brandName="Iron Vendetta"
     />
@@ -49,54 +44,36 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroSplitKpi
-      background={{
+      background={{ variant: "plain"}}
-        variant: "plain"}}
+      title="Iron Vendetta"
-      title="Iron Vendetta: Unleash the Fury"
+      description="Unleash raw power with our latest high-octane album, forged in fire and grit for an experience you'll feel in your core."
-      description="True heavy metal forged in fire and grit. Experience the crushing weight of our latest album on all platforms."
       kpis={[
-        {
+        { value: "500+", label: "Listeners"},
-          value: "1.2M",          label: "Listeners"},
+        { value: "5+", label: "Shows"},
-        {
+        { value: "5", label: "Anthems"},
-          value: "15+",          label: "Shows"},
-        {
-          value: "5",          label: "Anthems"},
       ]}
       enableKpiAnimation={true}
       buttons={[
-        {
+        { text: "Listen Now", href: "https://www.youtube.com/@IRONVENDETTA-h7v/videos"},
-          text: "Listen Now",          href: "#"},
+        { text: "Get Tickets", href: "#"},
-        {
-          text: "Get Tickets",          href: "#"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/musicians-stage-concert_1321-454.jpg"
       imageAlt="metal band concert stage lighting"
       mediaAnimation="slide-up"
       avatars={[
-        {
+        { src: "http://img.b2bpic.net/free-photo/musicians-stage-concert_1321-452.jpg", alt: "musicians on stage during a concert"},
-          src: "http://img.b2bpic.net/free-photo/musicians-stage-concert_1321-452.jpg",          alt: "musicians on stage during a concert"},
+        { src: "http://img.b2bpic.net/free-photo/artist-playing-guitar-long-view_23-2148751571.jpg", alt: "Artist playing guitar long view"},
-        {
+        { src: "http://img.b2bpic.net/free-photo/powerful-female-guitarist-performs-live-with-thrash-metal-vibe_482257-117355.jpg", alt: "Powerful female guitarist performs live with a thrash metal vibe"},
-          src: "http://img.b2bpic.net/free-photo/artist-playing-guitar-long-view_23-2148751571.jpg",          alt: "Artist playing guitar long view"},
+        { src: "http://img.b2bpic.net/free-photo/rock-band-silhouettes-stage-concert_1204-199.jpg", alt: "Rock band silhouettes on stage at concert."},
-        {
+        { src: "http://img.b2bpic.net/free-photo/rear-view-excited-people-with-arms-raised-having-fun-while-watching-confetti-fireworks-front-stage-music-festival-copy-space_637285-568.jpg", alt: "Rear view of excited people with arms raised having fun while watching confetti fireworks"},
-          src: "http://img.b2bpic.net/free-photo/powerful-female-guitarist-performs-live-with-thrash-metal-vibe_482257-117355.jpg",          alt: "Powerful female guitarist performs live with a thrash metal vibe"},
-        {
-          src: "http://img.b2bpic.net/free-photo/rock-band-silhouettes-stage-concert_1204-199.jpg",          alt: "Rock band silhouettes on stage at concert."},
-        {
-          src: "http://img.b2bpic.net/free-photo/rear-view-excited-people-with-arms-raised-having-fun-while-watching-confetti-fireworks-front-stage-music-festival-copy-space_637285-568.jpg",          alt: "Rear view of excited people with arms raised having fun while watching confetti fireworks"},
       ]}
       avatarText="Join our 50k+ legion of fans."
       marqueeItems={[
-        {
+        { type: "text", text: "Touring 2024"},
-          type: "text",          text: "Touring 2024"},
+        { type: "text-icon", text: "New Album Out Now", icon: Flame},
-        {
+        { type: "text", text: "Exclusive Merch"},
-          type: "text-icon",          text: "New Album Out Now",          icon: Flame,
+        { type: "text-icon", text: "Live Experience", icon: Music},
-        },
+        { type: "text", text: "Iron Vendetta"},
-        {
-          type: "text",          text: "Exclusive Merch"},
-        {
-          type: "text-icon",          text: "Live Experience",          icon: Music,
-        },
-        {
-          type: "text",          text: "Iron Vendetta"},
       ]}
     />
   </div>
@@ -107,12 +84,10 @@ export default function LandingPage() {
       title="Forged in Chaos"
       description="We are not just a band; we are an relentless movement of sound and defiance. Founded in the underground scene, our music is a testament to our struggle and power."
       metrics={[
-        {
+        { value: "1 Yrs", title: "History"},
-          value: "10 Yrs",          title: "History"},
+        { value: "20+", title: "Gigs"},
-        {
-          value: "200+",          title: "Gigs"},
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/portrait-man-posing-with-universe-projection-texture_23-2149581273.jpg"
+      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777580428726-qy5w25x7.jpg"
       imageAlt="heavy metal band portrait moody"
       mediaAnimation="blur-reveal"
       metricsAnimation="slide-up"
@@ -125,30 +100,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       features={[
-        {
+        { title: "Riff Crafting", description: "Precision engineered guitar work designed to pierce the soul.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-beautiful-guitar_23-2148605831.jpg", imageAlt: "electric guitar strings closeup dark" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/closeup-part-drum-kit-blurred-background_169016-20617.jpg", imageAlt: "drum kit dark stage lighting" } },
-          title: "Riff Crafting",          description: "Precision engineered guitar work designed to pierce the soul.",          phoneOne: {
+        { title: "Percussive Storm", description: "Thunderous drums that push the limits of speed and power.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/drum-kit-dark-background-with-stage-lighting-copy-space_169016-14183.jpg", imageAlt: "drum kit dark stage lighting" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/guitar-chair-indoors_23-2149614046.jpg", imageAlt: "electric guitar strings closeup dark" } },
-            imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-beautiful-guitar_23-2148605831.jpg",            imageAlt: "electric guitar strings closeup dark"
+        { title: "Vocal Fury", description: "Voices that scream raw defiance against the silent world.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/closeup-black-electric-guitar-dark-background_169016-20244.jpg", imageAlt: "electric guitar strings closeup dark" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/snare-drum-percussion-instrument-dark-background-with-smoke-copy-space_169016-14170.jpg", imageAlt: "drum kit dark stage lighting" } },
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/closeup-part-drum-kit-blurred-background_169016-20617.jpg",            imageAlt: "drum kit dark stage lighting"
-          }
-        },
-        {
-          title: "Percussive Storm",          description: "Thunderous drums that push the limits of speed and power.",          phoneOne: {
-            imageSrc: "http://img.b2bpic.net/free-photo/drum-kit-dark-background-with-stage-lighting-copy-space_169016-14183.jpg",            imageAlt: "drum kit dark stage lighting"
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/guitar-chair-indoors_23-2149614046.jpg",            imageAlt: "electric guitar strings closeup dark"
-          }
-        },
-        {
-          title: "Vocal Fury",          description: "Voices that scream raw defiance against the silent world.",          phoneOne: {
-            imageSrc: "http://img.b2bpic.net/free-photo/closeup-black-electric-guitar-dark-background_169016-20244.jpg",            imageAlt: "electric guitar strings closeup dark"
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/snare-drum-percussion-instrument-dark-background-with-smoke-copy-space_169016-14170.jpg",            imageAlt: "drum kit dark stage lighting"
-          }
-        },
       ]}
       showStepNumbers={true}
       title="Sonic Dominance"
@@ -163,19 +117,12 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={true}
       products={[
-        {
+        { id: "p1", brand: "Merch", name: "Betrayed Warrior ", price: "$29", rating: 5, reviewCount: "120", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232655-9ln049id.png?w=600&h=600"},
-          id: "p1",          brand: "Merch",          name: "Classic Logo Tee",          price: "$29",          rating: 5,
+        { id: "p2", brand: "Music", name: "Limited Vinyl", price: "$45", rating: 5, reviewCount: "89", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-uet0zilz.png?w=600&h=600"},
-          reviewCount: "120",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232655-9ln049id.png"},
+        { id: "p3", brand: "Merch", name: "Dark ", price: "$65", rating: 4, reviewCount: "205", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-3um1iozw.png"},
-        {
+        { id: "p4", brand: "Merch", name: "Scorched Oaths ", price: "$15", rating: 5, reviewCount: "50", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-31k9ioda.jpg"},
-          id: "p2",          brand: "Music",          name: "Limited Vinyl",          price: "$45",          rating: 5,
-          reviewCount: "89",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-uet0zilz.png"},
-        {
-          id: "p3",          brand: "Merch",          name: "Vendetta Hoodie",          price: "$65",          rating: 4,
-          reviewCount: "205",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-3um1iozw.png"},
-        {
-          id: "p4",          brand: "Merch",          name: "Wristband Pack",          price: "$15",          rating: 5,
-          reviewCount: "50",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777579232656-31k9ioda.jpg"},
       ]}
+      imageClassName="aspect-square object-cover"
       title="Exclusive Vendetta Gear"
       description="Wear the flame. Support the rebellion with our latest merchandise."
     />
@@ -187,18 +134,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "500+", title: "Streams", items: ["Spotify", "Apple Music", "YouTube"] },
-          id: "m1",          value: "1M+",          title: "Streams",          items: [
+        { id: "m2", value: "4 ", title: "Countries", items: ["Romania ", "UK", "Germany", "Japan"] },
-            "Spotify",            "Apple Music",            "YouTube"],
+        { id: "m3", value: "5 ", title: "Albums", items: ["Betrayed Warrior ", "Burn It Down! ", "Dark "] },
-        },
-        {
-          id: "m2",          value: "12",          title: "Countries",          items: [
-            "US",            "UK",            "Germany",            "Japan"],
-        },
-        {
-          id: "m3",          value: "3",          title: "Albums",          items: [
-            "Vendetta I",            "Vendetta II",            "Vendetta III"],
-        },
       ]}
       title="By The Numbers"
       description="The impact we've left on the metal community."
@@ -209,16 +147,11 @@ export default function LandingPage() {
       <TestimonialCardTwelve
       useInvertedBackground={true}
       testimonials={[
-        {
+        { id: "t1", name: "Alex R.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777580476379-nhwv4s3s.jpg"},
-          id: "t1",          name: "Alex R.",          imageSrc: "http://img.b2bpic.net/free-photo/image-angry-distressed-asian-woman-screaming-ripping-hair-head-losing-temper-standing-h_1258-114377.jpg"},
+        { id: "t2", name: "Jordan M.", imageSrc: "http://img.b2bpic.net/free-photo/retro-summer-activities-with-80-s-inspired-aesthetic_23-2151425826.jpg"},
-        {
+        { id: "t3", name: "Casey K.", imageSrc: "http://img.b2bpic.net/free-photo/soccer-fans-cheering-team-monochrome_23-2151530268.jpg"},
-          id: "t2",          name: "Jordan M.",          imageSrc: "http://img.b2bpic.net/free-photo/retro-summer-activities-with-80-s-inspired-aesthetic_23-2151425826.jpg"},
+        { id: "t4", name: "Taylor P.", imageSrc: "http://img.b2bpic.net/free-photo/happy-lady-guy-with-tinsel-bottle-beverage-showing-two-gesture_23-2147989249.jpg"},
-        {
+        { id: "t5", name: "Riley S.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outside_23-2149439874.jpg"},
-          id: "t3",          name: "Casey K.",          imageSrc: "http://img.b2bpic.net/free-photo/soccer-fans-cheering-team-monochrome_23-2151530268.jpg"},
-        {
-          id: "t4",          name: "Taylor P.",          imageSrc: "http://img.b2bpic.net/free-photo/happy-lady-guy-with-tinsel-bottle-beverage-showing-two-gesture_23-2147989249.jpg"},
-        {
-          id: "t5",          name: "Riley S.",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outside_23-2149439874.jpg"},
       ]}
       cardTitle="Fan Testimonials"
       cardTag="Raving Reviews"
@@ -231,17 +164,14 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "q1", title: "When is the next tour?", content: "Check our tour dates page for updates."},
-          id: "q1",          title: "When is the next tour?",          content: "Check our tour dates page for updates."},
+        { id: "q2", title: "Where can I buy merch?", content: "Our official store is linked in the navigation bar."},
-        {
+        { id: "q3", title: "Are you hiring band members?", content: "We are currently full but watch for announcements."},
-          id: "q2",          title: "Where can I buy merch?",          content: "Our official store is linked in the navigation bar."},
-        {
-          id: "q3",          title: "Are you hiring band members?",          content: "We are currently full but watch for announcements."},
       ]}
       title="FAQs"
       description="Everything you need to know about Iron Vendetta."
       faqsAnimation="blur-reveal"
-      imageSrc="http://img.b2bpic.net/free-photo/stage-performance-with-modern-metallic-equipment-drum-kit-generative-ai_188544-7799.jpg"
+      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3D5jfanRxnLYlbytCFsB9XUtL0A/uploaded-1777580497500-7p4qcokm.png"
       imageAlt="Stage performance with modern metallic equipment and drum kit"
       mediaAnimation="blur-reveal"
     />
@@ -253,17 +183,10 @@ export default function LandingPage() {
       title="Get In Touch"
       description="Send us your questions, bookings, or feedback."
       inputs={[
-        {
+        { name: "name", type: "text", placeholder: "Name", required: true },
-          name: "name",          type: "text",          placeholder: "Name",          required: true,
+        { name: "email", type: "email", placeholder: "Email", required: true },
-        },
-        {
-          name: "email",          type: "email",          placeholder: "Email",          required: true,
-        },
       ]}
-      textarea={{
+      textarea={{ name: "message", placeholder: "Message", rows: 4, required: true }}
-        name: "message",        placeholder: "Message",        rows: 4,
-        required: true,
-      }}
       imageSrc="http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-16233.jpg"
       imageAlt="abstract dark glitch texture"
     />
@@ -273,22 +196,8 @@ export default function LandingPage() {
       <FooterBaseReveal
       logoText="Iron Vendetta"
       columns={[
-        {
+        { title: "Navigation", items: [ { label: "About", href: "#about"}, { label: "Merch", href: "#products"} ] },
-          title: "Navigation",          items: [
+        { title: "Legal", items: [ { label: "Privacy Policy", href: "#"}, { label: "Terms of Use", href: "#"} ] },
-            {
-              label: "About",              href: "#about"},
-            {
-              label: "Merch",              href: "#products"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms of Use",              href: "#"},
-          ],
-        },
       ]}
     />
   </div>

src/app/styles/variables.css

@@ -12,13 +12,13 @@
 
   --background: #0a0a0a;
   --card: #1a1a1a;
-  --foreground: #f5f5f5;
+  --foreground: #ffffffe6;
-  --primary-cta: #ff0000;
+  --primary-cta: #e6e6e6;
   --primary-cta-text: #ffffff;
   --secondary-cta: #1a1a1a;
   --secondary-cta-text: #ffffff;
-  --accent: #991b1b;
+  --accent: #737373;
-  --background-accent: #7f1d1d;
+  --background-accent: #737373;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);