body { font-family: Arial, sans-serif; margin:0; padding:0; background:#f4f4f4; }
header { padding:20px; background:#fff; text-align:center; box-shadow:0 2px 5px rgba(0,0,0,0.1); }
.filters { margin:10px 0; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.filters select, .filters input, .filters button { padding:8px 12px; font-size:14px; border-radius:5px; border:1px solid #ccc; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:15px; padding:20px; }
.card { background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.1); display:flex; flex-direction:column; transition: transform 0.3s, opacity 0.3s; opacity:0; transform: translateY(30px); }
.card.visible { opacity:1; transform: translateY(0); }
.card img { width:100%; height:180px; object-fit:cover; display:block; cursor:pointer; }
.card-content { padding:10px; flex:1; display:flex; flex-direction:column; }
.card-content h3 { font-size:16px; margin:5px 0; }
.card-content p { font-size:14px; margin:3px 0; flex:1; }
.buttons { display:flex; gap:5px; margin-top:5px; }
.buttons a { flex:1; text-align:center; padding:5px 8px; border-radius:5px; color:#fff; text-decoration:none; }
.buttons a:nth-child(1) { background:#007BFF; }
.buttons a.buy-now { background:#25D366; }
.loading { text-align:center; padding:10px; color:#555; }
footer { text-align:center; padding:20px; background:#fff; box-shadow:0 -2px 5px rgba(0,0,0,0.1); }