:root{--primary:#198754;--text:#1f2937}
*{box-sizing:border-box}
body{font-family:'Poppins',sans-serif;color:var(--text)}
.announcement-bar{background:linear-gradient(90deg,#0ea5e9,#22c55e);padding:.5rem 0}
@media(max-width:576px){
  .announcement-bar{padding:.4rem 0}
  .announcement-bar .container{flex-direction:column;align-items:flex-start;gap:.25rem}
  .announcement-bar .container>.d-flex{flex-wrap:wrap;gap:.5rem}
  .announcement-bar span,.announcement-bar .small{font-size:.85rem}
}
.navbar-styled{position:relative}
.navbar-styled{box-shadow:0 10px 30px rgba(0,0,0,.06)}
.navbar-styled:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:linear-gradient(90deg,#22c55e,#0ea5e9)}
.navbar .navbar-brand{color:#0f172a;background:linear-gradient(90deg,#22c55e,#0ea5e9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.search-form .form-control{height:44px}
.search-form .input-group{border:1px solid #e5e7eb;border-radius:999px;overflow:hidden;box-shadow:0 6px 16px rgba(0,0,0,.06)}
.search-form .form-control{border:none}
.search-form .form-control:focus{box-shadow:none}
.search-form .input-group-text{border:none}
.mega .dropdown-menu{min-width:700px;max-width:calc(100vw - 32px);right:0;left:auto;overflow-x:auto}
.mega .dropdown-menu{box-shadow:0 20px 40px rgba(0,0,0,.10);border:none;border-radius:12px}
.mega>.nav-link.dropdown-toggle{background:var(--primary);color:#fff;border-radius:999px;padding:.45rem .9rem}
.mega>.nav-link.dropdown-toggle:hover{filter:brightness(1.1)}
.mega-menu .dropdown-item{padding:.25rem 0}
.hero .hero-slide{height:520px;background-size:cover;background-position:center;background-color:#0f172a}
.hero .hero-slide .container .text-white{max-width:560px;margin:0 auto;text-align:center}
.section-title{font-weight:600}
.category-card{text-decoration:none;border:1px solid #e5e7eb;transition:transform .2s,box-shadow .2s}
.category-card:hover{transform:translateY(-4px);box-shadow:0 10px 20px rgba(0,0,0,.08)}
.category-card .card-img-top{height:140px;width:100%;object-fit:cover}
.product-card{position:relative;border:1px solid #e5e7eb;transition:transform .2s,box-shadow .2s}
.product-card:hover{transform:translateY(-4px);box-shadow:0 10px 20px rgba(0,0,0,.08)}
.product-card .card-img-top{height:180px;width:100%;object-fit:cover}
.mobile-actions{display:none!important}
img{max-width:100%;display:block}
.btn-gradient{background:linear-gradient(90deg,#22c55e,#0ea5e9);color:#fff;border:none;border-radius:999px}
.btn-gradient:hover{opacity:.92;color:#fff}
.navbar .nav-link.position-relative{border-radius:999px}
#cartCount{animation:pulse 2s infinite}
@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.08)}100%{transform:translate(-50%,-50%) scale(1)}}
.banner{display:flex;align-items:center;justify-content:space-between}
.banner.wide{min-height:120px}
.gradient-1{background:linear-gradient(90deg,#22c55e,#16a34a)}
.gradient-2{background:linear-gradient(90deg,#0ea5e9,#0284c7)}
.gradient-3{background:linear-gradient(90deg,#f59e0b,#d97706)}
.gradient-4{background:linear-gradient(90deg,#a855f7,#7c3aed)}
.gradient-5{background:linear-gradient(90deg,#ef4444,#dc2626)}
.brand-logo{height:60px;object-fit:contain}
.icon-box .icon{font-size:28px;color:var(--primary)}
.footer a{text-decoration:none}
.footer .list-unstyled li{margin:.25rem 0}
.newsletter input{height:48px}
footer.footer{position:relative;z-index:1}
.footer .text-muted{color:rgba(255,255,255,.85)!important}
.footer a.text-muted{color:rgba(255,255,255,.85)!important}
.footer a.text-muted:hover{color:#ffffff!important}
@media(max-width:992px){.mega .dropdown-menu{min-width:unset;width:100%}}
@media(max-width:768px){
  .hero .hero-slide{height:380px}
  .product-card .card-img-top{height:160px}
  .category-card .card-img-top{height:120px}
  .brand-logo{height:48px}
}
@media(max-width:576px){
  .hero .hero-slide{height:300px}
  .hero h1{font-size:1.5rem}
  .hero .lead{font-size:.95rem}
  .search-form .input-group{border-radius:14px}
}
.product-card .card-body .d-flex{flex-wrap:wrap}
@media(max-width:576px){
  .product-card .card-body .d-flex{flex-direction:column;gap:.5rem}
  .product-card .card-body .d-flex .btn{width:100%}
}
.announcement-bar{display:block}
@media(max-width:576px){.announcement-bar{display:none!important}}
.offcanvas-end#cartSidebar{--bs-offcanvas-width:360px}
@media(max-width:576px){.offcanvas-end#cartSidebar{--bs-offcanvas-width:100vw}}
#brandsCarousel .carousel-item .d-flex{flex-wrap:wrap}