:root{--primary-color:#0f172a;--accent-color:#3b82f6;--bg-color:#f8fafc;--card-bg:#fff;--text-main:#334155;--text-muted:#64748b;--border-color:#e2e8f0;--radius:8px;--shadow:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-hover:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a}body{background-color:var(--bg-color);color:var(--text-main);margin:0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}.navbar{background-color:var(--card-bg);z-index:100;justify-content:space-between;align-items:center;padding:1.5rem 3rem;display:flex;position:sticky;top:0;box-shadow:0 1px 3px #0000001a}.nav-links{gap:2rem;display:flex}.nav-link{color:var(--text-main);font-weight:600;text-decoration:none;transition:color .2s}.nav-link:hover{color:var(--accent-color)}.container{max-width:1200px;margin:0 auto;padding:2rem}.btn{background-color:var(--primary-color);color:#fff;border-radius:var(--radius);cursor:pointer;text-align:center;border:none;padding:.75rem 1.5rem;font-weight:600;text-decoration:none;transition:background-color .2s;display:inline-block}.btn:hover{background-color:#1e293b}.btn-outline{border:2px solid var(--primary-color);color:var(--primary-color);background-color:#0000}.btn-outline:hover{background-color:var(--primary-color);color:#fff}.products-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem;display:grid}.product-card{background:var(--card-bg);border-radius:var(--radius);border:1px solid var(--border-color);box-shadow:var(--shadow);flex-direction:column;padding:1.5rem;transition:transform .2s,box-shadow .2s;display:flex}.product-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-5px)}.product-image{object-fit:contain;width:100%;height:200px;margin-bottom:1rem}.filters-bar{justify-content:center;gap:1rem;margin-bottom:2rem;display:flex}.filter-btn{border:1px solid var(--border-color);background:var(--card-bg);cursor:pointer;border-radius:20px;padding:.5rem 1rem}.filter-btn.active{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}