:root{--b:#0969da;--y:#ffb300;--bg:#f5f7fa;--t:#17212b;--m:#667085;--l:#e5e9ef}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Arial,sans-serif;color:var(--t)}a{text-decoration:none;color:inherit}.nav{background:#fff;border-bottom:1px solid var(--l);position:sticky;top:0;z-index:5}.navin,.wrap{max-width:1220px;margin:auto}.navin{padding:13px 18px;display:flex;align-items:center;gap:13px}.logo{font-size:25px;font-weight:900;color:var(--b)}.logo i{color:var(--y);font-style:normal}.search{flex:1;padding:13px;border:1px solid #ccd3dc;border-radius:10px}.btn{display:inline-block;padding:11px 16px;border:0;border-radius:9px;background:var(--b);color:#fff;font-weight:700;cursor:pointer}.btn.alt{background:#edf5ff;color:var(--b)}.wrap{padding:20px 18px}.hero{padding:32px;border-radius:20px;background:linear-gradient(120deg,#073b73,#0c75df);color:#fff}.hero h1{font-size:34px;margin:0 0 9px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.title{margin:28px 0 14px;display:flex;justify-content:space-between}.card{background:#fff;border:1px solid var(--l);border-radius:15px;overflow:hidden}.pimg{width:100%;height:190px;object-fit:cover;background:#e9edf2}.pad{padding:14px}.price{font-size:21px;font-weight:900}.muted{color:var(--m);font-size:13px}.shop{font-weight:700;border-top:1px solid var(--l);margin-top:10px;padding-top:10px}.form{max-width:650px;margin:25px auto;background:#fff;padding:24px;border-radius:15px;border:1px solid var(--l)}input,textarea,select{width:100%;padding:12px;margin:6px 0 14px;border:1px solid #ccd3dc;border-radius:8px}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:11px;border-bottom:1px solid var(--l);text-align:left}.stat{background:#fff;border:1px solid var(--l);padding:18px;border-radius:14px}.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.cat{background:#fff;padding:18px 8px;text-align:center;border:1px solid var(--l);border-radius:13px;font-weight:700}@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}.cats{grid-template-columns:repeat(3,1fr)}.hero h1{font-size:25px}.navin{flex-wrap:wrap}.search{order:3;flex-basis:100%}}@media(max-width:480px){.wrap{padding:12px 9px}.grid{gap:9px}.pimg{height:145px}.logo{font-size:20px}}
