async function cargarCatalogo() {
    const response = await fetch('data.json');
    const productos = await response.json();
    const contenedor = document.getElementById('catalogo');

    productos.forEach(producto => {
        const card = document.createElement('div');
        card.className = 'card';
        card.innerHTML = `
            <img src="${producto.imagen}" alt="${producto.titulo}">
            <h3>${producto.titulo}</h3>
            <p>${producto.descripcion}</p>
            <p class="precio">${producto.precio}</p>
            <a href="https://wa.me/${producto.whatsapp}" target="_blank" class="btn-wa">Consultar</a>
        `;
        contenedor.appendChild(card);
    });
}

cargarCatalogo();