// Restante das seções function CollectionsBand() { return (
Quatro mundos,
um único céu.} sub="Cada coleção nasce de uma história, uma paisagem, um instante de luz que vale a pena guardar." />
{COLLECTIONS.map((c, i) => ( e.currentTarget.style.transform = 'translateY(-6px)'} onMouseLeave={(e)=> e.currentTarget.style.transform = 'translateY(0)'}>
{c.subtitle} · {c.count} peças
{c.name}
))}
); } function SectionHead({ eyebrow, title, sub, align = 'center' }) { return (
{eyebrow}

{title}

{sub &&

{sub}

}
); } // ----- Produtos ----- const CAT_SLUG = { 'Tudo': 'todos', 'Brincos': 'brincos', 'Colares': 'colares', 'Pulseiras': 'pulseiras', 'Chokers': 'chokers' }; const CAT_ORDER = ['Pulseiras', 'Brincos', 'Colares', 'Chokers']; function ProductsSection({ visibleCategories }) { const [cat, setCat] = useState('Tudo'); const [dbProducts, setDbProducts] = useState(null); const cart = useCart(); const visible = Array.isArray(visibleCategories) && visibleCategories.length ? visibleCategories : null; useEffect(() => { requestAnimationFrame(() => { const els = document.querySelectorAll('.reveal:not(.in)'); const io = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting) { e.target.classList.add('in'); io.unobserve(e.target); } }); }, { threshold: 0.12 }); els.forEach(el => io.observe(el)); }); }, [cat, dbProducts]); useEffect(() => { let cancelled = false; fetch('/api/products?_=' + Date.now(), { cache: 'no-store' }) .then(r => r.ok ? r.json() : null) .then(data => { if (cancelled || !data || !Array.isArray(data.products)) return; // Mostra produtos sazonais aqui também — eles aparecem no grid // do tema ativo (acima do hero) e no catálogo geral. setDbProducts(data.products); }) .catch(() => {}); return () => { cancelled = true; }; }, []); const rawSource = dbProducts || []; const source = visible ? rawSource.filter(p => !p.cat || visible.includes(p.cat)) : rawSource; const catsInData = Array.from(new Set(source.map(p => p.cat).filter(Boolean))); let cats = ['Tudo', ...new Set([ ...CATEGORIES.filter(c => c !== 'Tudo' && catsInData.includes(c)), ...catsInData.filter(c => !CATEGORIES.includes(c)), ])]; if (visible) cats = cats.filter(c => c === 'Tudo' || visible.includes(c)); const PAGE_SIZE = 8; let visibleItems, hasMore; if (cat === 'Tudo') { // Round-robin entre categorias na ordem CAT_ORDER. Vai mesclando 1 por // vez até atingir PAGE_SIZE ou esgotar o catálogo. Se uma categoria // tem só 1 produto, mostra esse 1 e segue. Nunca inventa. const byCat = new Map(CAT_ORDER.map(c => [c, source.filter(p => p.cat === c)])); // categorias extras que apareceram no DB mas não estão em CAT_ORDER source.forEach(p => { if (p.cat && !byCat.has(p.cat)) byCat.set(p.cat, source.filter(x => x.cat === p.cat)); }); const queues = Array.from(byCat.values()).map(arr => arr.slice()); const mixed = []; let progress = true; while (mixed.length < PAGE_SIZE && progress) { progress = false; for (const q of queues) { if (mixed.length >= PAGE_SIZE) break; if (q.length) { mixed.push(q.shift()); progress = true; } } } visibleItems = mixed; hasMore = source.length > visibleItems.length; } else { const filtered = source.filter(p => p.cat === cat); visibleItems = filtered.slice(0, PAGE_SIZE); hasMore = filtered.length > PAGE_SIZE; } const catSlug = CAT_SLUG[cat] || 'todos'; return (
Best-sellers

As preferidas da casa

Ver tudo
{/* category pills */}
{cats.map(c => ( ))}
{visibleItems.map(p => ( cart.add(p)} onBuy={()=> cart.buyNow(p)}/> ))}
{hasMore && (
Ver mais peças
)}
); } function ProductCard({ p, onAdd, onBuy }) { const [hover, setHover] = useState(false); const [imgError, setImgError] = useState(false); const auth = useAuth(); const isFav = auth?.isFavorite ? auth.isFavorite(p.id) : false; const [favBusy, setFavBusy] = useState(false); async function onFavClick(e){ e.preventDefault(); e.stopPropagation(); if (favBusy) return; setFavBusy(true); try { await auth.toggleFavorite(p.id, p.name); } finally { setFavBusy(false); } } return ( setHover(true)} onMouseLeave={()=> setHover(false)} style={{ background: 'white', borderRadius: 20, overflow: 'hidden', border: '1px solid ' + (hover ? 'rgba(212,175,106,0.4)' : 'var(--line)'), transition: 'transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease, border-color .25s ease', transform: hover ? 'translateY(-6px)' : 'translateY(0)', boxShadow: hover ? '0 30px 60px -20px rgba(10,31,61,0.22), 0 4px 12px -4px rgba(212,175,106,0.18)' : '0 2px 6px rgba(10,31,61,0.04)', display: 'flex', flexDirection: 'column', color: 'inherit', textDecoration: 'none', }}>
{p.image && !imgError ? ( <> {p.name} setImgError(true)} style={{ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover', transition: 'opacity .4s ease, transform .5s ease', transform: hover ? 'scale(1.04)' : 'scale(1)', opacity: hover && p.images && p.images[1] ? 0 : 1, }} /> {p.images && p.images[1] && ( {p.images[1].alt )} ) : ( )} {p.badge && ( {p.badge} )} {/* hover quick actions */}
{p.cat}
{p.name}
{brl(p.price)} {p.old && {brl(p.old)}}
ou 6x de {brl(p.price / 6)}
{/* always-visible mobile actions */}
); } // ----- Sobre / Como Funciona ----- function HowItWorks() { return (
{/* signature badge */}
Lua Azul Joias
Salvador · Bahia · Desde 2025
Como funciona

Da nossa mesa até sua janela.

Cada peça passa por 14 etapas — do desenho à mão à embalagem final — feita à mão, com calma, em Salvador. Sem intermediários, sem pressa.

{STEPS.map((s,i)=>(
{s.n}
{s.title}
{s.text}
))}
); } // ----- Benefits ----- function Benefits() { return (
Beleza que não enferruja com o tempo.} sub="Quatro motivos pra usar uma joia Lua Azul todos os dias da sua vida." />
{BENEFITS.map((b,i)=>(
{ e.currentTarget.style.transform='translateY(-4px)'; e.currentTarget.style.boxShadow = '0 24px 40px -16px rgba(8,51,68,0.18)'; }} onMouseLeave={(e)=>{ e.currentTarget.style.transform='translateY(0)'; e.currentTarget.style.boxShadow = 'none'; }}>
{b.title}
{b.text}
))}
); } // ----- Testimonials ----- function Testimonials({ testimonials }) { const [idx, setIdx] = useState(0); // testimonials===null → admin nunca configurou → usa fallback hardcoded. // testimonials===[] → admin configurou mas escondeu todos → respeita. // testimonials===[...] → usa só os que vieram (já filtrados de hidden no API). const isConfigured = Array.isArray(testimonials); const fromConfig = isConfigured ? testimonials.filter(t => !t.hidden).map(t => ({ name: t.name, city: t.city, rating: t.rating || 5, photo: t.photo || null, text: t.text, })) : null; const cta = TESTIMONIALS.find(t => t.isCta); const list = fromConfig ? (cta ? [...fromConfig, cta] : fromConfig) : TESTIMONIALS; const realsLen = list.filter(t => !t.isCta).length; const realCount = realsLen || 1; const showArrows = realsLen >= 4; // só rotaciona quando há mais do que cabe no grid return (
Depoimentos

Histórias que
viraram joia.

{[1,2,3,4,5].map(n=> )}
Avaliações 5 estrelas de quem já presenteou
{showArrows ? (
{String(idx+1).padStart(2,'0')} / {String(realCount).padStart(2,'0')}
) : ( Quero deixar meu depoimento )}
{(() => { const reals = list.filter(t => !t.isCta); const ctaItem = list.find(t => t.isCta) || TESTIMONIALS.find(t => t.isCta); const n = reals.length || 1; const visible = reals.length ? [ reals[idx % n], reals[(idx+1) % n], reals[(idx+2) % n], ctaItem, ].filter(Boolean) : [ctaItem].filter(Boolean); return visible.map((item,k)=>{ if (item.isCta){ return ( { e.currentTarget.style.background = 'var(--blue-50)'; e.currentTarget.style.borderColor = 'var(--blue-600)'; }} onMouseLeave={(e)=>{ e.currentTarget.style.background = 'var(--cream)'; e.currentTarget.style.borderColor = 'var(--blue-300)'; }}>
"

{item.text}

{item.name}
{item.city}
 ); } return (
"

{item.text}

{item.photo ? ( {item.name} ) : (
{item.name[0]}
)}
{item.name}
{item.city}
); }); })()}
); } const navArrow = { width: 46, height: 46, borderRadius: '50%', background: 'white', border: '1px solid var(--line)', color: 'var(--ink)', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', }; // ----- Plans ----- function Plans() { return (
Compre uma vez ou
vire cliente do clube.} sub={Três formas de fazer parte do nosso universo. Sem fidelidade, pause quando quiser.} />
{PLANS.map((p,i)=>(
{p.tag && (
{p.tag}
)}
{p.name}
{p.blurb}
{p.price === 0 ? 'R$0' : 'R$' + p.price} {p.period}
    {p.perks.map((perk,k)=>(
  • {perk}
    • ))}
))}
); } // ----- FAQ ----- function FaqSection() { const [open, setOpen] = useState(0); return (
Dúvidas

Perguntas frequentes.

Não achou o que procurava? Fale com a gente pelo WhatsApp — respondemos rápido.

Falar no WhatsApp
{FAQ.map((it,i)=>(

{it.a}

))}
); } // ----- Contact ----- function ContactSection() { const [submitted, setSubmitted] = useState(false); return (
Fale com a gente

Tem uma ideia,
uma encomenda especial,
uma dúvida?

Nossa equipe responde dentro do horário de atendimento, com cuidado pessoal — direto no WhatsApp ou por email.

Seg a Sex · 7h às 18h
Sábado · 8h às 12h}/>
{ e.preventDefault(); setSubmitted(true); }} style={{ background: 'white', borderRadius: 24, padding: '36px 32px', border: '1px solid var(--line)', boxShadow: '0 20px 50px -20px rgba(8,51,68,0.12)', }}> {submitted ? (

Mensagem enviada

A gente responde no seu email em até 1 hora útil. Até já!

) : ( <>

Envie sua mensagem

Respondemos em até 1 hora útil.