/* Hero */
.hero{ background:linear-gradient(120deg,var(--brand) 0%,var(--brand-dark) 100%); color:#fff; border-radius:.75rem; overflow:hidden; }
.hero h1{ font-weight:800; }
.hero-badge{ background:rgba(255,255,255,.15); border-radius:2rem; padding:.35rem .9rem; font-size:.8rem; display:inline-flex; align-items:center; gap:.35rem; }

/* Category cards */
.cat-card{ background:#fff; border-radius:.6rem; padding:1rem .5rem; text-align:center; transition:.2s; border:1px solid #eee; height:100%; }
.cat-card:hover{ transform:translateY(-4px); box-shadow:0 8px 20px rgba(0,0,0,.08); border-color:var(--brand); }
.cat-card .cat-icon{ font-size:1.8rem; color:var(--brand); }
.cat-card .cat-img{ width:56px; height:56px; object-fit:cover; border-radius:50%; background:var(--brand-light); }
.cat-card small{ display:block; margin-top:.4rem; color:#444; }

/* Flash sale */
.flash-sale{ background:var(--dark); color:#fff; border-radius:.75rem; }
.countdown-box{ background:rgba(255,255,255,.1); border-radius:.4rem; padding:.4rem .7rem; min-width:52px; text-align:center; }
.countdown-box .num{ font-size:1.2rem; font-weight:700; }
.countdown-box .lbl{ font-size:.65rem; color:#aaa; }

/* Brand strip */
.brand-pill{ background:#fff; border:1px solid #eee; border-radius:.5rem; padding:1rem; text-align:center; font-weight:600; color:#333; height:100%; display:flex; align-items:center; justify-content:center; }
.brand-pill:hover{ border-color:var(--brand); color:var(--brand); }

/* Newsletter */
.newsletter{ background:var(--brand-light); border-radius:.75rem; }

@media (max-width:767px){ .hero h1{ font-size:1.6rem; } }