*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Cairo',sans-serif;background:#f5f5f5}
.header{background:#000;color:#fff;padding:15px;display:flex;gap:10px}
.logo{font-size:22px;font-weight:700}
.search{flex:1;position:relative}
.search input{width:100%;padding:10px 35px;border-radius:25px;border:none}
.slider img{width:100%}
.dots{text-align:center;margin:10px}
.dots span{display:inline-block;width:8px;height:8px;background:#ccc;border-radius:50%;margin:0 3px}
.dots .active{background:#000}
.section-title{margin:20px;font-size:18px;font-weight:700}
.categories{display:flex;gap:10px;padding:10px}
.category{background:#fff;padding:10px;border-radius:12px;text-align:center;width:90px}
.offers{background:#000;color:#fff;padding:20px}
.offer-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.offer{background:#fff;color:#000;border-radius:12px;padding:10px}
.badge{background:red;color:#fff;font-size:12px;padding:4px 6px;border-radius:6px}
.badge.yellow{background:#facc15;color:#000}
.bottom-nav{position:fixed;bottom:0;width:100%;display:flex;justify-content:space-around;background:#fff;padding:10px}
.bottom-nav .active{color:#000;font-weight:700}