Merge version_9 into main

Merge version_9 into main

src/app/page.tsx

@@ -2,7 +2,7 @@
 
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
-import MediaAbout from '@/components/sections/about/MediaAbout';
+import SplitAbout from '@/components/sections/about/SplitAbout';
 import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
@@ -25,13 +25,16 @@ const assetMap = [
   {"id":"product-3","url":"http://img.b2bpic.net/free-photo/young-business-woman-trendy-coat-outside_1303-21537.jpg","alt":"enigmatic trench coat dark street"},
   {"id":"product-4","url":"http://img.b2bpic.net/free-photo/still-life-waving-fabric-wind_23-2151096239.jpg","alt":"gothic velvet top dark texture"},
   {"id":"product-5","url":"http://img.b2bpic.net/free-photo/portrait-beautiful-brunette-model-dressed-summer-hipster-jacket-jeans-clothes-trendy-girl-sitting-bench-street_158538-1659.jpg","alt":"dark leather jacket mysterious vibe"},
-  {"id":"product-6","url":"http://img.b2bpic.net/free-photo/back-view-incognito-elegant-sexy-blondie-with-nude-shoulder-perfect-hairstyle-posing-sexy-long-dress-fashionable-look-studio-against-gray-background-shopping-sale-fashion_132075-11636.jpg","alt":"elegant dark skirt mysterious woman"},
-  {"id":"shirt-1","url":"https://via.placeholder.com/400x500/000000/FFFFFF?text=Noir+Shirt+Classic","alt":"classic noir shirt"},
-  {"id":"cap-1","url":"https://via.placeholder.com/400x500/333333/FFFFFF?text=Mystic+Cap+Leather","alt":"mystic leather cap"},
-  {"id":"shirt-2","url":"https://via.placeholder.com/400x500/111111/FFFFFF?text=Shadow+Tee+Graphic","alt":"shadow graphic tee"},
-  {"id":"cap-2","url":"https://via.placeholder.com/400x500/666666/FFFFFF?text=Enigma+Beanie+Knit","alt":"enigma knit beanie"},
-  {"id":"shirt-3","url":"https://via.placeholder.com/400x500/222222/FFFFFF?text=Midnight+Blouse+Silk","alt":"midnight silk blouse"},
-  {"id":"cap-3","url":"https://via.placeholder.com/400x500/444444/FFFFFF?text=Dark+Visor+Sport","alt":"dark sport visor"},
+  {"id":"product-6","url":"http://img.b2bpic.net/free-photo/back-view-incognito-elegant-sexy-blondie-with-nude-shoulder-perfect-hairstyle-posing-sexy-long-dress-fashionable-look-studio-against-grey-background-shopping-sale-fashion_132075-11636.jpg","alt":"elegant dark skirt mysterious woman"},
+  {"id":"shirt-1","url":"https://via.placeholder.com/400x500/0a0a0a/CCCCCC?text=Noir+Shirt+Classic","alt":"classic noir shirt"},
+  {"id":"cap-1","url":"https://via.placeholder.com/400x500/1a1a1a/EEEEEE?text=Mystic+Cap+Leather","alt":"mystic leather cap"},
+  {"id":"shirt-2","url":"https://via.placeholder.com/400x500/0d0d0d/BBBBBB?text=Shadow+Tee+Graphic","alt":"shadow graphic tee"},
+  {"id":"cap-2","url":"https://via.placeholder.com/400x500/2a2a2a/DDDDDD?text=Enigma+Beanie+Knit","alt":"enigma knit beanie"},
+  {"id":"shirt-3","url":"https://via.placeholder.com/400x500/1e1e1e/AAAAAA?text=Midnight+Blouse+Silk","alt":"midnight silk blouse"},
+  {"id":"cap-3","url":"https://via.placeholder.com/400x500/3a3a3a/CCCCCC?text=Dark+Visor+Sport","alt":"dark sport visor"},
+  {"id":"shoe-1","url":"https://via.placeholder.com/400x500/050505/AAAAAA?text=Noir+Boots+Leather","alt":"noir leather boots"},
+  {"id":"jacket-1","url":"https://via.placeholder.com/400x500/101010/BBBBBB?text=Shadow+Jacket+Wool","alt":"shadow wool jacket"},
+  {"id":"dress-1","url":"https://via.placeholder.com/400x500/080808/CCCCCC?text=Midnight+Dress+Silk","alt":"midnight silk dress"},
   {"id":"testimonial-1","url":"http://img.b2bpic.net/free-photo/beautiful-portrait-teenager-woman_23-2149453480.jpg","alt":"stylish woman dramatic lighting portrait"},
   {"id":"testimonial-2","url":"http://img.b2bpic.net/free-photo/studio-portrait-elegant-black-american-male-dressed-suit-grey-vignette-background_613910-9543.jpg","alt":"fashion critic man serious portrait"},
   {"id":"testimonial-3","url":"http://img.b2bpic.net/free-photo/portrait-handsome-man-wearing-denim-coat-sunglasses-standing-night-street-illuminated-signboards-neon-lights_613910-20596.jpg","alt":"young fashionista enigmatic smile"},
@@ -64,10 +67,10 @@ export default function LandingPage() {
       borderRadius="soft"
       contentWidth="medium"
       sizing="largeSmallSizeLargeTitles"
-      background="grid"
-      cardStyle="gradient-radial"
-      primaryButtonStyle="diagonal-gradient"
-      secondaryButtonStyle="layered"
+      background="aurora"
+      cardStyle="solid"
+      primaryButtonStyle="shadow"
+      secondaryButtonStyle="solid"
       headingFontWeight="semibold"
     >
       <div id="nav" data-section="nav">
@@ -118,15 +121,19 @@ export default function LandingPage() {
         />
       </div>
       <div id="about" data-section="about">
-        <MediaAbout
+        <SplitAbout
           title="A Arte de Vestir o Mistério"
           description="No Nocturne Atelier, cada peça é uma obra de arte, meticulosamente criada para evocar a profundidade e a sofisticação do estilo noir. Nossas coleções são uma celebração da elegância atemporal, combinando tecidos luxuosos com silhuetas dramáticas para aqueles que ousam se destacar na escuridão."
           tag="Nosso Legado"
           buttons={[
             { text: "Conheça Nossa História", href: "#" }
           ]}
-          imageSrc={getAssetUrl("about-image")}
-          imageAlt={getAssetAlt("about-image")}
+          bulletPoints={[
+            { title: "Criações Meticulosas", description: "Cada peça é desenhada e confeccionada com atenção inigualável aos detalhes, garantindo exclusividade." },
+            { title: "Elegância Atemporal", description: "Nossas coleções refletem a sofisticação do estilo noir, com designs que transcendem tendências passageiras." },
+            { title: "Tecidos de Luxo", description: "Utilizamos apenas os mais finos materiais, selecionados por sua qualidade, conforto e caimento perfeito." }
+          ]}
+          textboxLayout="default"
           useInvertedBackground={false}
         />
       </div>
@@ -150,8 +157,11 @@ export default function LandingPage() {
             { id: "s1", name: "Camisa Lua Negra", price: "R$ 550", variant: "Algodão Premium", imageSrc: getAssetUrl("shirt-1"), imageAlt: getAssetAlt("shirt-1") },
             { id: "c1", name: "Boné Eclipse", price: "R$ 220", variant: "Couro Sintético", imageSrc: getAssetUrl("cap-1"), imageAlt: getAssetAlt("cap-1") },
             { id: "s2", name: "Camiseta Sombra", price: "R$ 380", variant: "Estampa Gráfica", imageSrc: getAssetUrl("shirt-2"), imageAlt: getAssetAlt("shirt-2") },
-            { id: "c2", name: "Gorro Neblina", price: "R$ 180", variant: "Lã Fina", imageSrc: getAssetUrl("cap-2"), imageAlt: getAssetAlt("cap-2") },
+            { id: "shoe1", name: "Bota Enigma", price: "R$ 750", variant: "Couro Legítimo", imageSrc: getAssetUrl("shoe-1"), imageAlt: getAssetAlt("shoe-1") },
             { id: "s3", name: "Blusa Crepúsculo", price: "R$ 450", variant: "Veludo Borgonha", imageSrc: getAssetUrl("shirt-3"), imageAlt: getAssetAlt("shirt-3") },
+            { id: "jacket1", name: "Jaqueta Nebulosa", price: "R$ 980", variant: "Lã Italiana", imageSrc: getAssetUrl("jacket-1"), imageAlt: getAssetAlt("jacket-1") },
+            { id: "c2", name: "Gorro Neblina", price: "R$ 180", variant: "Lã Fina", imageSrc: getAssetUrl("cap-2"), imageAlt: getAssetAlt("cap-2") },
+            { id: "dress1", name: "Vestido Meia-Noite", price: "R$ 1200", variant: "Seda Pura", imageSrc: getAssetUrl("dress-1"), imageAlt: getAssetAlt("dress-1") },
             { id: "c3", name: "Viseira Noite", price: "R$ 150", variant: "Poliéster", imageSrc: getAssetUrl("cap-3"), imageAlt: getAssetAlt("cap-3") }
           ]}
           gridVariant="uniform-all-items-equal"

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #060000;
-  --card: #1d0d0d;
-  --foreground: #ffe6e6;
-  --primary-cta: #ff3d4a;
-  --primary-cta-text: #ffffff;
-  --secondary-cta: #1f0a0a;
-  --secondary-cta-text: #ffe6e6;
-  --accent: #7b2d2d;
-  --background-accent: #b8111f;
+  --background: #000000;
+  --card: #0c0c0c;
+  --foreground: #ffffff;
+  --primary-cta: #cee7ff;
+  --primary-cta-text: #000000;
+  --secondary-cta: #000000;
+  --secondary-cta-text: #ffffff;
+  --accent: #535353;
+  --background-accent: #CEE7FF;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);