/* White + blue theme with green accent, simple responsive layout */ 
:root{--blue:#0b5cff;--green:#10b981;--muted:#6b7280;--bg:#ffffff}
*{box-sizing:border-box}body{font-family:Inter,Arial,Helvetica,sans-serif;margin:0;background:var(--bg);color:#1f2937}
.container{max-width:1100px;margin:0 auto;padding:1rem}
.site-header{border-bottom:1px solid #e6edf8;background:#fff}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:0.75rem;cursor:pointer}
.logo{width:44px;height:44px;border-radius:8px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.brand-text .title{font-weight:800} .brand-text .subtitle{font-size:0.85rem;color:var(--muted)}
.main-nav a{margin:0 10px;color:var(--muted);text-decoration:none}
.main-nav a:hover{color:var(--blue)}
.actions .btn{margin-left:8px;padding:8px 10px;border-radius:6px;text-decoration:none;border:1px solid #d6e4ff;color:var(--muted)}
.btn.primary{background:var(--blue);color:#fff;border:0}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:center;padding:2.5rem 0}
.hero h1{color:var(--blue);font-size:2rem;margin:0}
.hero-right img{width:100%;max-width:420px}
.info-cards{display:flex;gap:1rem;margin:1.5rem 0}
.card{flex:1;padding:1rem;border-radius:8px;background:#f8fafb}
.site-footer{border-top:1px solid #eaeef6;margin-top:2rem;background:#fbfdff;padding:1rem 0}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.footer-bottom{text-align:center;padding:0.5rem;color:var(--muted);font-size:0.85rem}
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.product{border:1px solid #eef6ff;border-radius:8px;padding:0.75rem;display:flex;flex-direction:column}
.product img{height:160px;object-fit:cover;border-radius:6px}
.product .meta{display:flex;justify-content:space-between;align-items:center;margin-top:0.5rem}
.small{font-size:0.9rem;color:var(--muted)}
.cart-item{display:flex;gap:10px;align-items:center;border:1px solid #eef6ff;padding:10px;border-radius:8px;margin-bottom:8px}
.checkout-form label{display:block;margin-bottom:8px}
.checkout-form input, .checkout-form textarea{width:100%;padding:8px;border:1px solid #dfe9ff;border-radius:6px}
.form-actions{margin-top:10px}
.order-success{padding:1rem;border:1px solid #e6f8ec;background:#f0ffef;border-radius:8px}
@media (max-width:800px){
  .hero{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .main-nav{display:none}
}