* { box-sizing: border-box; }
body { margin: 0; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #003d4d55; border-radius: 10px; }
.scroll-x::-webkit-scrollbar { height: 6px; }

/* Hero */
.hero-bg {
  background:
    radial-gradient(circle at 85% 20%, rgba(255,140,0,0.25), transparent 45%),
    linear-gradient(120deg, #003d4d 0%, #00566b 55%, #007089 100%);
}
.floaty {
  position: absolute; border-radius: 50%;
  background: rgba(255,255,255,0.06);
  animation: float 8s ease-in-out infinite;
}
.f1 { width: 180px; height: 180px; top: -40px; left: 5%; }
.f2 { width: 100px; height: 100px; bottom: -20px; left: 30%; animation-delay: 1.5s; }
.f3 { width: 140px; height: 140px; top: 30%; left: 50%; background: rgba(255,140,0,0.08); animation-delay: 3s; }
@keyframes float {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-25px) scale(1.05); }
}

/* Shimmer badge */
.shimmer {
  background-image: linear-gradient(100deg, #ff8c00 30%, #ffb347 50%, #ff8c00 70%);
  background-size: 200% 100%;
  animation: shimmer 2.5s linear infinite;
}
@keyframes shimmer { to { background-position: -200% 0; } }

/* Glow button */
.glow-btn { box-shadow: 0 6px 20px rgba(255,140,0,0.4); }
.glow-btn:hover { box-shadow: 0 8px 30px rgba(255,140,0,0.6); }

/* Nav underline */
.nav-link { position: relative; }
.nav-link::after {
  content: ''; position: absolute; bottom: 4px; right: 50%;
  width: 0; height: 2px; background: #ff8c00; transition: all .25s ease;
  transform: translateX(50%);
}
.nav-link:hover::after { width: 60%; }

/* Category cards */
.cat-card { transition: all .25s ease; }

/* Product cards */
.product-card { transition: transform .3s ease, box-shadow .3s ease; }
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(0,61,77,0.18);
}
.product-emoji { transition: transform .35s ease; }
.product-card:hover .product-emoji { transform: scale(1.18) rotate(-4deg); }
.add-btn { transition: background .25s ease, transform .15s ease; }
.add-btn:active { transform: scale(0.97); }

/* Cart badge bump */
.cart-badge { transition: transform .2s ease; }
.cart-badge.bump { animation: bump .5s ease; }
@keyframes bump {
  0% { transform: scale(1); }
  30% { transform: scale(1.5); }
  60% { transform: scale(0.9); }
  100% { transform: scale(1); }
}

/* Toast */
.toast { animation: toastIn .3s ease; }
@keyframes toastIn {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* Drawer transition already handled inline */
.drawer { transition: transform .35s cubic-bezier(.4,0,.2,1); }

/* Range/checkbox accent fallback */
input[type="checkbox"] { accent-color: #ff8c00; }