/* -- MOBILE -- */
@media(max-width:600px){
  :root{--nav-h:50px}
  .topbar{display:none}
  .hero{padding:16px 13px;gap:10px}
  .hero h1{font-size:1.3rem}.hero p{font-size:.78rem}
  .hero-stats{flex-wrap:wrap;gap:6px}.hst{padding:9px 10px;flex:1;min-width:70px}.hst .hn{font-size:1.1rem}
  .n-logo{font-size:1.1rem}
  .n-search input{font-size:.82rem}
  .nbtn{padding:3px 5px}.nbtn .nb{font-size:.68rem}
  .nbtn .nt{display:none}
  .acc-badge{font-size:.62rem;padding:3px 7px}
  .shop-wrap{flex-direction:column;padding:8px}
  .sidebar{width:100%;position:static;max-height:none}
  .sidebar h3{display:none}
  .sidebar-scroll{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;padding:2px 0}
  .sidebar-scroll::-webkit-scrollbar{display:none}
  .scat{white-space:nowrap;flex-shrink:0}
  .pgrid{grid-template-columns:repeat(2,1fr);gap:7px}
  .feat-grid{grid-template-columns:repeat(2,1fr);gap:7px}
  .cats-grid{grid-template-columns:repeat(3,1fr);gap:6px}
  .m-layout{flex-direction:column}
  .m-img{width:100%;min-height:170px;padding:10px}.m-img img{max-height:165px}.m-info{padding:12px}
  .cart-panel{width:100vw}
  .hsec{padding:8px}
  .lcard{padding:22px 16px}
  .otp-row{gap:6px}.obox{width:42px;height:50px;font-size:1.2rem}
  .inner-pg{padding:9px}
  .grad-hd{padding:16px 14px}
}
@media(max-width:380px){
  .pgrid{grid-template-columns:repeat(2,1fr);gap:6px}
  .obox{width:38px;height:46px;font-size:1.1rem}
  .otp-row{gap:5px}
}