/* Simple reset */
* { box-sizing: border-box; margin:0; padding:0; }
body { font-family: 'Inter', system-ui, Arial, sans-serif; line-height:1.4; background:#f5f7fa; color:#111; }
a { color:#0a5bd8; }

/* Header */
.header { display:flex; justify-content:space-between; align-items:center; padding:12px 20px; background:#fff; border-bottom:1px solid #e6eef6; }
.brand { display:flex; gap:12px; align-items:center; }
.logo { width:44px; height:44px; }
.brand h1 { font-size:1rem; }
.brand .tag { font-size:0.85rem; color:#666; }

.nav { display:flex; gap:10px; }
.nav a { padding:6px 10px; border-radius:6px; font-weight:600; color:#0b1720; }
.nav a.active, .nav a:hover { background:#e9f3ff; color:#0a5bd8; }

/* Main container and grid */
.container { max-width:1100px; margin:18px auto; padding:0 16px; display:grid; grid-template-columns: 1fr 300px; gap:16px; }
.container.two-col { grid-template-columns: 1fr 320px; }
.center { max-width:900px; margin:18px auto; padding:0 16px; }

.hero { background:#fff; padding:16px; border-radius:8px; border:1px solid #e6eef6; }

.products { display:grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.card { background:#fff; border:1px solid #e6eef6; padding:12px; border-radius:8px; display:flex; flex-direction:column; gap:8px; }
.card img { height:140px; object-fit:cover; border-radius:6px; }
.price { color:#0a5bd8; font-weight:700; }
.btn { background:#0a5bd8; color:#fff; border:none; padding:8px; border-radius:6px; cursor:pointer; }

.aside { background:#fff; padding:12px; border-radius:8px; border:1px solid #e6eef6; }
.promo { margin-top:8px; color:#444; }

/* Footer */
.footer { display:flex; justify-content:space-between; align-items:center; padding:12px 20px; background:#0b1720; color:#fff; margin-top:18px; }
.footer a { color:#cfe6ff; }

/* Forms */
.form label { display:block; margin-bottom:10px; font-weight:600; }
.form input[type="text"], .form input[type="email"], .form textarea { width:100%; padding:8px; border:1px solid #cfdbe8; border-radius:6px; }
.form textarea { min-height:100px; }
.req { color:#d93025; margin-left:6px; }

/* Simple card used in cart */
.card { box-shadow: none; }

/* Responsive */
@media (max-width:900px) {
  .container, .container.two-col { grid-template-columns: 1fr; }
  .header { padding:10px; }
}
