{ "projectName": "Ngcobo Naturals", "businessType": "", "industry": "", "tone": "", "tier": 3, "generatedAt": "2026-07-28T09:01:50.055Z", "sections": [ { "name": "HeroSection", "importPath": "@/components/sections/HeroSection", "position": 0, "role": "hero", "hasImage": true, "hasForm": false, "itemCount": -1, "layout": "flex-row", "headings": [ "{d.title}" ], "buttonLabels": [], "people": [], "allText": [ "use client", "next/image", "@/hooks/useVulaContent", "hero_banners", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin", "hero", "relative overflow-hidden bg-gray-900 text-white", "relative min-h-[480px] flex items-center", "object-cover opacity-40", "relative z-10 max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-24", "text-4xl sm:text-5xl font-bold mb-4 max-w-2xl", "text-xl text-gray-200 mb-8 max-w-xl", "inline-flex items-center px-8 py-3 bg-white text-gray-900 font-bold rounded-full hover:bg-gray-100 transition-colors" ], "cmsCollection": "hero_banners" }, { "name": "AdvertBannerSection", "importPath": "@/components/sections/AdvertBannerSection", "position": 1, "role": "hero", "hasImage": true, "hasForm": false, "itemCount": 4, "layout": "flex-row", "headings": [ "{headline}" ], "buttonLabels": [], "people": [], "allText": [ "next/image", "next/link", "@/lib/cms", "relative w-full overflow-hidden rounded-2xl my-8 mx-auto max-w-7xl px-4", "relative h-64 md:h-80 w-full", "object-cover rounded-2xl", "absolute inset-0 bg-black/45 rounded-2xl", "absolute inset-0 flex flex-col items-center justify-center text-center px-6 gap-3", "text-2xl md:text-4xl font-bold text-white drop-shadow", "text-sm md:text-base text-white/90", "mt-2 inline-block bg-white text-black font-semibold px-6 py-2 rounded-full hover:bg-primary hover:text-white transition-colors text-sm", "flex flex-col items-center justify-center gap-3 py-16 px-6 text-center bg-primary/10 rounded-2xl", "text-2xl md:text-3xl font-bold", "text-muted-foreground", "inline-block bg-primary text-white font-semibold px-6 py-2 rounded-full hover:bg-primary/80 transition-colors text-sm" ] }, { "name": "FeaturedProductsSection", "importPath": "@/components/sections/FeaturedProductsSection", "position": 2, "role": "services", "hasImage": false, "hasForm": false, "itemCount": 11, "layout": "grid", "headings": [ "Featured Products" ], "buttonLabels": [], "people": [], "allText": [ "use client", "@/hooks/useFeaturedProducts", "next/link", "lucide-react", "@/hooks/useMedusaCart", "KSh", "py-20", "container mx-auto px-4", "grid grid-cols-2 md:grid-cols-4 gap-6", "aspect-square rounded-xl bg-muted animate-pulse", "featuredproducts", "flex items-center justify-between mb-10", "text-xs uppercase tracking-widest text-primary font-semibold mb-1", "Curated for You", "text-3xl font-bold text-foreground", "Featured Products", "text-sm font-semibold text-primary hover:underline underline-offset-4", "View all →", "group bg-card rounded-xl overflow-hidden border border-border hover:shadow-md transition-all", "block", "relative aspect-square bg-muted", "w-full h-full object-cover group-hover:scale-105 transition-transform duration-500", "w-full h-full flex items-center justify-center", "h-8 w-8 text-muted-foreground/30", "p-4", "text-sm font-semibold text-foreground line-clamp-2 mb-1 hover:text-primary transition-colors", "text-sm font-bold text-primary mb-3", "cart-drawer-open", "w-full text-xs bg-primary/10 text-primary hover:bg-primary hover:text-primary-foreground py-2 rounded-lg transition-colors font-medium disabled:opacity-40", "Add to Cart" ] }, { "name": "BestsellersGridSection", "importPath": "@/components/sections/BestsellersGridSection", "position": 3, "role": "unknown", "hasImage": true, "hasForm": false, "itemCount": 10, "layout": "grid", "headings": [ "Top Picks Loved by Our Community" ], "buttonLabels": [ "Shop Now" ], "people": [], "allText": [ "use client", "@/hooks/useMedusaProducts", "next/image", "next/link", "@/components/ui/Button", "@/components/ui/Card", "@/components/ui/Badge", "lucide-react", "bestsellersgrid", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-[#6b8e23] border-t-transparent animate-spin", "bestsellers-grid", "py-20 bg-[#f4f5f2]", "max-w-7xl mx-auto px-4", "text-3xl md:text-4xl font-bold text-[#2c331f] text-center mb-2", "Top Picks Loved by Our Community", "text-center text-[#8b5a3c] mb-10 max-w-xl mx-auto", "Real results, trusted by thousands across South Africa.", "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6", "rounded-[20px] shadow-lg hover:shadow-xl transition-shadow duration-200 overflow-hidden bg-white", "relative aspect-square overflow-hidden", "object-cover hover:scale-105 transition-transform duration-500", "(max-width: 640px) 100vw, (max-width: 768px) 50vw, 33vw", "default", "absolute top-3 left-3 bg-[#8b5a3c] text-white text-xs px-3 py-1", "w-3 h-3 inline mr-1", "Bestseller", "px-4 pt-4 pb-0", "text-sm font-semibold text-[#2c331f]", "px-4 pb-4", "text-lg font-bold text-[#6b8e23]", "text-xs text-[#8b5a3c] mt-1", "Deep hydration & gentle care", "outline", "sm", "w-full border-[#6b8e23] text-[#6b8e23] hover:bg-[#6b8e23] hover:text-white transition-all duration-200", "Shop Now" ] }, { "name": "IngredientStorySection", "importPath": "@/components/sections/IngredientStorySection", "position": 4, "role": "about", "hasImage": true, "hasForm": false, "itemCount": 3, "layout": "grid", "headings": [ "Three Botanicals, One Purpose", "{item.name}" ], "buttonLabels": [], "people": [], "allText": [ "use client", "next/image", "Marula", "Deep hydration & antioxidant protection", "Wild-harvested from baobab trees in Limpopo", "Rooibos", "Calms redness & fights inflammation", "Cederberg region, hand-picked and fermented", "Buchu", "Antimicrobial & purifying for problem skin", "Clanwilliam fynbos, carefully distilled", "ingredientstory", "ingredient-story", "py-20 bg-[#f4f5f2]", "max-w-7xl mx-auto px-4", "text-3xl md:text-4xl font-bold text-[#2c331f] text-center mb-4", "Three Botanicals, One Purpose", "text-center text-[#8b5a3c] mb-12 max-w-2xl mx-auto", "Every jar tells a story of heritage — cold-pressed from nature's finest ingredients, grown by communities who have used them for generations.", "grid md:grid-cols-3 gap-8", "group bg-white rounded-[28px] shadow-lg overflow-hidden hover:shadow-xl transition-shadow duration-300", "relative h-48 overflow-hidden", "object-cover group-hover:scale-105 transition-transform duration-500", "(max-width: 768px) 100vw, 33vw", "p-6", "text-2xl font-bold text-[#2c331f] mb-2", "text-sm text-[#6b8e23] font-semibold mb-2", "text-[#2c331f] text-sm" ] }, { "name": "BotanicalWisdomSection", "importPath": "@/components/sections/BotanicalWisdomSection", "position": 5, "role": "blog", "hasImage": true, "hasForm": false, "itemCount": -1, "layout": "grid", "headings": [], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "@/hooks/useVulaContent", "@/components/ui/Card", "@/components/ui/Badge", "next/image", "posts", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin", "botanical-wisdom", "botanicalwisdom", "bg-[#f4f5f2] py-20 px-4", "max-w-6xl mx-auto", "text-center mb-12", "text-sm text-[#8b5a3c] font-medium mb-2", "From our journal", "text-3xl font-semibold text-[#2c331f]", "Botanical", "text-[#6b8e23]", "Wisdom", "grid grid-cols-1 md:grid-cols-3 gap-6", "rounded-[28px] overflow-hidden shadow-lg hover:shadow-xl transition-shadow border-0 bg-white", "relative h-48 w-full", "object-cover", "(max-width: 768px) 100vw, 33vw", "pb-2", "accent", "bg-[#6b8e23] text-white text-xs px-3 py-1 rounded-full self-start mb-2", "text-lg text-[#2c331f]", "pt-0", "text-sm text-[#2c331f]/70 line-clamp-3", "text-xs text-[#8b5a3c] mt-3 font-medium", "By" ], "cmsCollection": "posts" }, { "name": "CampaignSection", "importPath": "@/components/sections/CampaignSection", "position": 6, "role": "cms-campaigns", "hasImage": true, "hasForm": false, "itemCount": -1, "layout": "flex-row", "headings": [ "{d.headline}" ], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "@/hooks/useVulaContent", "@/components/ui/Button", "next/image", "campaigns", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin", "campaign-specials", "campaign", "bg-[#f4f5f2] py-20 px-4", "max-w-6xl mx-auto", "flex flex-col lg:flex-row gap-8 items-center", "bg-white rounded-[28px] shadow-lg overflow-hidden flex-1", "relative h-64 lg:h-80 w-full", "object-cover", "(max-width: 768px) 100vw, 50vw", "p-8 lg:p-10", "text-sm text-[#8b5a3c] font-medium mb-2", "text-3xl lg:text-4xl font-semibold text-[#2c331f] mb-4", "text-[#2c331f]/70 max-w-[44ch] mb-6", "default", "bg-[#6b8e23] hover:bg-[#5a7a1d] text-white rounded-full px-6 py-2" ], "cmsCollection": "campaigns" }, { "name": "GallerySection", "importPath": "@/components/sections/GallerySection", "position": 7, "role": "gallery", "hasImage": true, "hasForm": false, "itemCount": -1, "layout": "flex-row", "headings": [], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "@/hooks/useVulaContent", "next/image", "gallery", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-current border-t-transparent animate-spin", "py-20 px-4 bg-white", "max-w-6xl mx-auto", "text-3xl font-semibold text-[#2c331f] text-center mb-12", "text-[#6b8e23]", "Visual", "journey", "columns-2 md:columns-3 gap-4 space-y-4", "break-inside-avoid rounded-[28px] overflow-hidden shadow-lg hover:shadow-xl transition-shadow duration-200", "relative", "object-cover w-full h-auto", "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/50 to-transparent p-4", "text-white font-semibold text-sm", "text-white/80 text-xs" ], "cmsCollection": "gallery" }, { "name": "MostPopularSection", "importPath": "@/components/sections/MostPopularSection", "position": 8, "role": "unknown", "hasImage": false, "hasForm": false, "itemCount": 12, "layout": "grid", "headings": [ "Most Popular" ], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "@/hooks/useMedusaCart", "@/hooks/useMedusaProducts", "next/link", "lucide-react", "KSh", "py-20", "container mx-auto px-4", "grid grid-cols-2 md:grid-cols-4 gap-6", "aspect-square rounded-xl bg-muted animate-pulse", "mostpopular", "flex items-center justify-between mb-10", "flex items-center gap-3", "h-6 w-6 text-primary", "text-xs uppercase tracking-widest text-primary font-semibold mb-1", "Best Sellers", "text-3xl font-bold text-foreground", "Most Popular", "text-sm font-semibold text-primary hover:underline underline-offset-4 hidden md:inline-flex items-center gap-1", "View all →", "grid grid-cols-2 lg:grid-cols-4 gap-6", "group bg-card rounded-xl overflow-hidden border border-border hover:shadow-md transition-all relative", "absolute top-2 left-2 z-10 bg-primary text-primary-foreground text-xs font-semibold px-2 py-0.5 rounded-full", "Best Seller", "block overflow-hidden", "relative aspect-square bg-muted", "w-full h-full object-cover group-hover:scale-105 transition-transform duration-300", "w-full h-full flex items-center justify-center", "h-8 w-8 text-muted-foreground/30", "p-4", "text-sm font-semibold text-foreground line-clamp-2 mb-1 hover:text-primary transition-colors", "text-sm font-bold text-primary mb-3", "cart-drawer-open", "w-full text-xs bg-primary/10 text-primary hover:bg-primary hover:text-primary-foreground py-2 rounded-lg transition-colors font-medium disabled:opacity-40", "Add to Cart" ] }, { "name": "BrandCarouselSection", "importPath": "@/components/sections/BrandCarouselSection", "position": 9, "role": "partners", "hasImage": true, "hasForm": false, "itemCount": 4, "layout": "flex-row", "headings": [ "Shop by Collection" ], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "next/link", "next/image", "py-10 px-4", "max-w-7xl mx-auto", "text-xl font-bold mb-5", "Shop by Collection", "flex gap-4 overflow-x-auto pb-3 scrollbar-hide snap-x snap-mandatory", "flex-none snap-start w-36 group", "relative h-36 w-36 rounded-2xl overflow-hidden bg-muted mb-2 group-hover:shadow-md transition-shadow", "object-cover group-hover:scale-105 transition-transform duration-300", "w-full h-full flex items-center justify-center text-3xl font-bold text-primary/30 uppercase", "text-xs font-medium text-center line-clamp-2 group-hover:text-primary transition-colors" ] }, { "name": "ProductCarouselSection", "importPath": "@/components/sections/ProductCarouselSection", "position": 10, "role": "services", "hasImage": true, "hasForm": false, "itemCount": 4, "layout": "flex-row", "headings": [ "{section.title}" ], "buttonLabels": [], "people": [], "allText": [ "next/image", "next/link", "@/lib/cms", "KSh", "x-publishable-api-key", "py-8 px-4", "max-w-7xl mx-auto", "text-xl font-bold mb-5", "flex gap-4 overflow-x-auto pb-3 scrollbar-hide snap-x snap-mandatory", "flex-none snap-start w-44 group", "relative h-44 w-44 rounded-xl overflow-hidden bg-muted mb-2 group-hover:shadow-md transition-shadow", "object-cover group-hover:scale-105 transition-transform duration-300", "w-full h-full flex items-center justify-center text-muted-foreground text-xs", "No image", "text-xs font-medium line-clamp-2 group-hover:text-primary transition-colors mb-1", "text-xs font-bold text-primary" ] }, { "name": "CTAShopSection", "importPath": "@/components/sections/CTAShopSection", "position": 11, "role": "cta", "hasImage": false, "hasForm": false, "itemCount": 2, "layout": "unknown", "headings": [ "Discover Your Skin's Best-Kept Secret" ], "buttonLabels": [], "people": [], "allText": [ "use client", "next/link", "@/components/ui/Button", "lucide-react", "ctashop", "cta-shop", "relative py-24 bg-[#8b5a3c] overflow-hidden", "absolute inset-0 opacity-5 bg-[url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MCIgaGVpZ2h0PSI2MCI+PHBhdGggZD0iTTM2IDM0Yy0yIDgtMTAgNi0xMCAwIDAtNiA4LTggMTAgMHoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=')", "relative max-w-4xl mx-auto px-4 text-center", "text-4xl md:text-5xl font-bold text-white mb-4 leading-tight", "Discover Your Skin's Best-Kept Secret", "text-white/80 text-lg md:text-xl max-w-2xl mx-auto mb-10", "Cold-pressed marula, rooibos-infused oils, and buchu extracts — small-batch handcrafted in Pretoria.", "default", "lg", "bg-[#6b8e23] hover:bg-[#5a7a1d] text-white border-none shadow-xl shadow-black/20 group", "Explore the Collection", "ml-2 w-5 h-5 group-hover:translate-x-1 transition-transform" ] }, { "name": "NewsletterSection", "importPath": "@/components/sections/NewsletterSection", "position": 12, "role": "blog", "hasImage": false, "hasForm": true, "itemCount": 5, "layout": "flex-row", "headings": [ "Join the Ngcobo Naturals Circle" ], "buttonLabels": [], "people": [], "allText": [ "use client", "react", "@/components/ui/Input", "@/components/ui/Button", "lucide-react", "idle", "subscribed", "newsletter", "py-20 bg-[#f4f5f2]", "max-w-xl mx-auto px-4", "border-2 border-[#8b5a3c]/30 rounded-3xl p-10 bg-white shadow-xl shadow-[#6b8e23]/5", "text-center mb-8", "w-8 h-8 mx-auto mb-3 text-[#6b8e23]", "text-3xl font-bold text-[#2c331f]", "Join the Ngcobo Naturals Circle", "text-[#8b5a3c] mt-3 max-w-sm mx-auto", "Receive exclusive herbal recipes, seasonal skincare rituals, and early access to limited small-batch releases.", "text-center text-[#6b8e23] font-medium py-4", "✓ You're on the list! Welcome to the community.", "flex gap-3 items-start", "flex-1", "email", "your@email.com", "rounded-xl border-[#daddd4] bg-[#f4f5f2]", "submit", "default", "md", "bg-[#6b8e23] hover:bg-[#5a7a1d] text-white border-none rounded-xl px-6", "w-4 h-4 mr-2", "Subscribe" ] }, { "name": "ContactSection", "importPath": "@/components/sections/ContactSection", "position": 13, "role": "contact", "hasImage": false, "hasForm": true, "itemCount": -1, "layout": "grid", "headings": [ "We'd Love to Hear from You", "Studio & Workshop", "Phone", "Email", "Trading Hours", "Send an Enquiry" ], "buttonLabels": [ "Send Message" ], "people": [], "allText": [ "use client", "react", "@/hooks/useVulaContent", "lucide-react", "@/components/ui/Input", "@/components/ui/Button", "business_hours", "flex justify-center py-16", "w-8 h-8 rounded-full border-2 border-[#6b8e23] border-t-transparent animate-spin", "contact", "py-20 bg-[#f4f5f2]", "max-w-5xl mx-auto px-4", "text-center mb-14", "text-3xl md:text-4xl font-bold text-[#2c331f]", "We'd Love to Hear from You", "text-[#8b5a3c] mt-3 max-w-lg mx-auto", "From our studio in Pretoria to your skin — every enquiry is handwritten care.", "grid grid-cols-1 md:grid-cols-2 gap-10", "space-y-6", "flex items-start gap-4", "w-5 h-5 text-[#6b8e23] mt-1 shrink-0", "font-semibold text-[#2c331f]", "Studio & Workshop", "text-[#8b5a3c]", "42 Marula Lane, Hatfield, Pretoria, 0028", "Phone", "+27 12 345 6789", "Email", "hello@ngcobonaturals.co.za", "Trading Hours", "text-[#8b5a3c] space-y-1", "flex justify-between gap-4", "italic", "Closed", "text-xs text-[#8b5a3c]/70 mt-2", "Closed on South African public holidays.", "bg-white rounded-2xl p-8 shadow-lg shadow-[#6b8e23]/5 border border-[#daddd4]", "text-xl font-bold text-[#2c331f] mb-6", "Send an Enquiry", "text-center py-8", "w-12 h-12 mx-auto bg-[#6b8e23]/10 rounded-full flex items-center justify-center mb-4", "w-6 h-6 text-[#6b8e23]", "text-[#6b8e23] font-medium", "Thank you! We'll be in touch soon.", "space-y-4", "text", "Your name", "rounded-xl border-[#daddd4] bg-[#f4f5f2]", "email", "your@email.com" ], "cmsCollection": "business_hours" } ], "navigationLinks": [ "Ngcobo Naturals", "Home", "Featured Products", "Ingredient Story", "Bestsellers Grid", "Gallery", "Contact", "Products" ] }