:root{--primario:#6c47ff;--secundario:#1a0a2e;--cream:#fdf8f3;--ink:#1a1208;--muted:#7a6a56;--sand:#e8d5b7;--radio:16px;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--ink);overflow-x:hidden;}
img{display:block;max-width:100%;}
.hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.hero-fondo{position:absolute;inset:0;transition:background .5s;}
.hero-ruido{position:absolute;inset:0;opacity:.4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");}
.hero-centro{position:relative;z-index:1;text-align:center;padding:2.5rem 1.2rem;max-width:700px;margin:0 auto;width:100%;}
.hero-logo{max-height:90px;max-width:220px;margin:0 auto 1.2rem;border-radius:10px;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4));}
.hero-nombre{font-family:'Playfair Display',serif;font-size:clamp(2.5rem,9vw,7rem);font-weight:900;line-height:.92;color:#fff;margin-bottom:.8rem;letter-spacing:-.02em;}
.hero-slogan{font-size:clamp(.95rem,2.5vw,1.25rem);color:var(--sand);margin-bottom:.6rem;line-height:1.6;}
.hero-desc{font-size:.92rem;color:rgba(232,213,183,.7);max-width:480px;margin:0 auto 1.3rem;line-height:1.7;}
.hero-botones{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin-bottom:1rem;}
.btn-hero{display:inline-block;padding:.78rem 1.7rem;border-radius:50px;text-decoration:none;font-weight:600;font-size:.9rem;background:var(--primario);color:#fff;transition:transform .2s,box-shadow .2s;}
.btn-hero:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.3);}
.btn-wa{background:#25D366;}.btn-wa:hover{background:#1da851;}
.hero-ciudad{font-size:.78rem;color:rgba(232,213,183,.4);letter-spacing:.06em;}
.catalogo{padding:4rem 1.2rem 5rem;background:var(--cream);}
.contenedor{max-width:1320px;margin:0 auto;}
.catalogo-cabeza{text-align:center;margin-bottom:2rem;}
.catalogo-cabeza h2{font-family:'Playfair Display',serif;font-size:clamp(1.8rem,5vw,2.8rem);font-weight:700;margin-bottom:.3rem;}
.catalogo-cabeza p{color:var(--muted);}
.filtros-cat{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;margin-bottom:.8rem;}
.filtro-cat{border:2px solid var(--sand);background:transparent;color:var(--muted);padding:.4rem 1rem;border-radius:50px;cursor:pointer;font-family:'DM Sans',sans-serif;font-size:.84rem;font-weight:500;transition:all .2s;}
.filtro-cat:hover,.filtro-cat.activo{background:var(--primario);border-color:var(--primario);color:#fff;}
.subfiltros-cat{margin-bottom:.8rem;}
.subfiltros-lista{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:center;padding:.6rem;background:rgba(108,71,255,.05);border-radius:50px;}
.subfiltro-cat{border:1.5px solid var(--sand);background:transparent;color:var(--muted);padding:.28rem .82rem;border-radius:50px;cursor:pointer;font-family:'DM Sans',sans-serif;font-size:.78rem;font-weight:500;transition:all .18s;}
.subfiltro-cat:hover,.subfiltro-cat.activo{background:var(--primario);border-color:var(--primario);color:#fff;}
.buscador-wrap{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:2rem;}
.buscador-wrap span{color:var(--muted);}
#buscadorCatalogo{width:100%;max-width:440px;padding:.68rem 1.3rem;border:2px solid var(--sand);border-radius:50px;font-family:'DM Sans',sans-serif;font-size:.92rem;background:#fff;outline:none;transition:border-color .2s;}
#buscadorCatalogo:focus{border-color:var(--primario);}
.productos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.6rem;}
.prod-card{background:#fff;border-radius:var(--radio);overflow:hidden;box-shadow:0 4px 20px rgba(26,18,8,.09);transition:transform .25s,box-shadow .25s;position:relative;display:flex;flex-direction:column;}
.prod-card:hover{transform:translateY(-5px);box-shadow:0 12px 36px rgba(26,18,8,.13);}
.prod-card.agotado{opacity:.72;}
.badge-dest{position:absolute;top:.65rem;right:.65rem;z-index:3;background:var(--primario);color:#fff;font-size:.7rem;font-weight:700;padding:.2rem .65rem;border-radius:50px;}
.prod-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--sand);}
.prod-galeria{position:relative;width:100%;height:100%;}
.prod-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .4s;}
.prod-img-1{opacity:1;z-index:1;}
.prod-img-2{opacity:0;z-index:0;}
.prod-card:hover .prod-img-1{opacity:0;}
.prod-card:hover .prod-img-2{opacity:1;z-index:2;}
.prod-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:4rem;opacity:.3;}
.agotado-label{position:absolute;inset:0;background:rgba(0,0,0,.48);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;font-weight:700;z-index:5;}
.prod-body{padding:1.1rem 1.3rem 1.4rem;display:flex;flex-direction:column;flex:1;gap:.3rem;}
.prod-cats{display:flex;flex-wrap:wrap;gap:.4rem;font-size:.72rem;color:var(--muted);}
.prod-sub{background:rgba(108,71,255,.1);color:var(--primario);padding:.1rem .5rem;border-radius:50px;font-weight:600;}
.prod-nombre{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;line-height:1.3;}
.prod-desc{font-size:.82rem;color:var(--muted);line-height:1.55;flex:1;}
.prod-precio{font-size:1.15rem;font-weight:700;color:var(--primario);}
.btn-pedir{display:block;text-align:center;margin-top:auto;background:#25D366;color:#fff;padding:.58rem 1rem;border-radius:50px;text-decoration:none;font-weight:600;font-size:.86rem;transition:background .2s;}
.btn-pedir:hover{background:#1da851;}
.btn-agotado{display:block;text-align:center;margin-top:auto;background:var(--sand);color:var(--muted);padding:.58rem 1rem;border-radius:50px;font-size:.86rem;}
.cargando{display:flex;align-items:center;justify-content:center;gap:.8rem;padding:2rem;color:var(--muted);}
.spinner{width:24px;height:24px;border:2.5px solid var(--sand);border-top-color:var(--primario);border-radius:50%;animation:girar .7s linear infinite;flex-shrink:0;}
@keyframes girar{to{transform:rotate(360deg)}}
.sin-resultados{text-align:center;padding:4rem;color:var(--muted);}
.sin-resultados span{font-size:3rem;display:block;margin-bottom:.7rem;}
.oculto{display:none!important;}
.pie{background:var(--ink);color:var(--sand);padding:2.5rem 1.2rem;text-align:center;}
.pie-nombre{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:700;margin-bottom:.3rem;}
.pie-ciudad{font-size:.82rem;color:rgba(232,213,183,.5);margin-bottom:.8rem;}
.pie-redes{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;margin:.8rem 0;}
.pie-redes a{color:var(--sand);text-decoration:none;font-size:.83rem;padding:.28rem .82rem;border:1px solid rgba(232,213,183,.22);border-radius:50px;transition:border-color .2s;}
.pie-redes a:hover{border-color:var(--primario);color:#fff;}
.pie-copy{font-size:.72rem;opacity:.35;margin-top:.8rem;}
@media(max-width:900px){.productos-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.2rem;}}
@media(max-width:640px){.productos-grid{grid-template-columns:1fr 1fr;gap:.9rem;}.hero-botones{flex-direction:column;align-items:center;}.btn-hero{width:100%;max-width:280px;text-align:center;}}
@media(max-width:400px){.productos-grid{grid-template-columns:1fr 1fr;gap:.65rem;}.prod-body{padding:.8rem;}.prod-desc{display:none;}.prod-nombre{font-size:.9rem;}}

/* ===== TIPOGRAFÍA MEJORADA ===== */

/* Base general */
body,
p,
span,
input,
button {
  font-family: 'Inter', sans-serif;
}

/* Títulos principales (mantener elegancia) */
.hero-nombre,
.catalogo-cabeza h2,
.pie-nombre {
  font-family: 'Playfair Display', serif;
  letter-spacing: -0.02em;
}

/* Nombres de productos (más legible y moderno) */
.prod-nombre {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Filtros y buscador */
.filtro-cat,
.subfiltro-cat,
#buscadorCatalogo {
  font-family: 'Inter', sans-serif;
}

/* Botones */
.btn-pedir,
.btn-hero {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
}
