// pages.jsx — Shop & Product detail pages const Shop = ({ onOpenProduct, onAdd }) => { const [filter, setFilter] = useState("All"); const filtered = filter === "All" ? PRODUCTS : PRODUCTS.filter(p => p.concern === filter); const filters = ["All", "Hydration", "Renewal", "Calm", "Brightening"]; return (
The Collection

The Collection.

Six essentials. A complete ritual. Each formulation has a single purpose. Together, they restore the skin to its quietest, most luminous state.

{filters.map(f => ( ))}
{filtered.length} {filtered.length === 1 ? "product" : "products"}
{filtered.map(p => )}
); }; const Product = ({ product, onAdd, onOpenProduct }) => { const [openTab, setOpenTab] = useState("formulation"); if (!product) return null; const others = PRODUCTS.filter(p => p.id !== product.id).slice(0, 3); const tabs = [ ["formulation", "The Formulation", product.actives], ["ritual", "The Ritual", product.ritual], ["result", "The Result", product.result], ["provenance", "The Provenance", product.provenance], ]; return (
{product.name}
{product.concern}

{product.name}

{product.descriptor}

{product.longDescriptor}

${product.price} {product.size}
{/* Micro trust strip */}
Free shipping >$200 30-day return Concierge ‹24h
{/* Accordion sections */}
{tabs.map(([key, label, content]) => (
{openTab === key && (
{Array.isArray(content) ? (
    {content.map(c => (
  • {c}
    • ))}
) : (

{content}

)}
)}
))}
{/* Pairs well with */}
Pairs well with

Complete the ritual.

{others.map(p => )}
); }; window.Shop = Shop; window.Product = Product;