// Pages.jsx — Home, PLP, PDP, Cart, Checkout pages. const { useState, useMemo } = React; // --------------------------------------------------------------- // HomePage const HomePage = ({ onNav, onAdd, onFav, favs }) => { const featured = CATALOG.slice(0, 4); const offers = CATALOG.filter(p => p.discount).slice(0, 4); const fresh = CATALOG.slice(8, 12); const { isMobile, isTablet } = useViewport(); const gridCols = isMobile ? "1fr 1fr" : isTablet ? "repeat(3, 1fr)" : "repeat(4, 1fr)"; const catCols = isMobile ? "repeat(4, 1fr)" : isTablet ? "repeat(4, 1fr)" : "repeat(8, 1fr)"; const pad = isMobile ? "0 16px" : "0 32px"; return (
{/* Hero */}
Marzo · Mes del hogar

Hasta 40% en lo que más usas en casa.

Cocina, electrodomésticos, organización y limpieza. Envío gratis a Puerto Vallarta en compras mayores a $599.

{!isMobile && (
)}
{/* Categories strip */}

Descubre por categoría

onNav("plp")} style={{ color: "var(--primary)", font: "600 13px var(--font-sans)", cursor: "pointer", display: "flex", alignItems: "center", gap: 4 }}> Ver todas
{CATEGORIES.map(c => ( ))}
{/* Lo más nuevo */}
onNav("plp")} isMobile={isMobile}> onNav("pdp", { id: p.id })} onAdd={onAdd} onFav={onFav} favs={favs} />
{/* Promo strip */}
onNav("prime")} />
{/* Ofertas */}
onNav("plp", { onlyDiscount: true })} isMobile={isMobile}> onNav("pdp", { id: p.id })} onAdd={onAdd} onFav={onFav} favs={favs} />
{/* Brands */}

Marcas destacadas

onNav("plp")} style={{ color: "var(--primary)", font: "600 13px var(--font-sans)", cursor: "pointer" }}>Ver todas →
{BRANDS.map(b => ( ))}
{/* Lo más vendido */}
onNav("plp")} isMobile={isMobile}> onNav("pdp", { id: p.id })} onAdd={onAdd} onFav={onFav} favs={favs} />
{/* Trust strip */}
{[ { icon: "local_shipping", title: "Envío gratis +$599", sub: "A todo México" }, { icon: "credit_card", title: "12 MSI sin intereses",sub: "Bancos participantes" }, { icon: "verified", title: "Compra protegida", sub: "Devolución 30 días" }, { icon: "support_agent", title: "Soporte 24/7", sub: "En español, siempre" }, ].map(t => (
{t.title}
{t.sub}
))}
); }; const Section = ({ title, subtitle, onSeeAll, children, isMobile }) => (

{title}

{subtitle &&
{subtitle}
}
{onSeeAll && Ver todos →}
{children}
); const Grid = ({ items, cols, onOpen, onAdd, onFav, favs }) => (
{items.map(p => )}
); const PromoTile = ({ title, sub, cta, bg, fg, onClick }) => (

{title}

{sub}

); window.HomePage = HomePage;