*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f7f7f7;color:#202020}.top{background:#111;color:#fff;padding:14px 6%;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:5}.brand{font-size:26px;font-weight:800}.brand span{color:#f5a623}.nav button{background:none;border:0;color:white;margin-left:14px;cursor:pointer;font-size:15px}.hero{padding:65px 7%;background:linear-gradient(120deg,#171717,#393939);color:white}.hero h1{font-size:48px;margin:0 0 12px}.hero p{max-width:600px;font-size:18px;line-height:1.6}.btn{border:0;border-radius:8px;padding:12px 18px;cursor:pointer;font-weight:700}.primary{background:#f5a623;color:#111}.container{max-width:1150px;margin:0 auto;padding:35px 20px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:25px}.filters button{padding:9px 15px;border:1px solid #ddd;background:white;border-radius:20px;cursor:pointer}.filters .active{background:#111;color:#fff}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}.card{background:white;border-radius:14px;overflow:hidden;box-shadow:0 2px 12px #00000012}.card img{width:100%;height:155px;object-fit:cover}.card-body{padding:16px}.price{font-weight:800;font-size:18px}.card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:15px}.cart{position:fixed;right:20px;bottom:20px;background:#111;color:#fff;border:0;border-radius:50px;padding:15px 22px;cursor:pointer;box-shadow:0 4px 18px #0004}.modal-bg{position:fixed;inset:0;background:#0008;display:flex;align-items:center;justify-content:center;padding:20px;z-index:10}.modal{background:#fff;border-radius:15px;padding:25px;width:min(600px,100%);max-height:90vh;overflow:auto}.input{width:100%;padding:12px;margin:7px 0 12px;border:1px solid #ccc;border-radius:7px}.row{display:flex;gap:12px}.row>*{flex:1}.order-item{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eee}.notice{padding:12px;border-radius:8px;background:#fff4d8;margin:15px 0}.success{background:#e8f7ec}.danger{background:#ffe9e9}.footer{text-align:center;padding:35px;background:#111;color:#ddd;margin-top:40px}@media(max-width:600px){.hero h1{font-size:36px}.top{padding:12px 4%}.nav button{margin-left:5px}.row{flex-direction:column}}
