.products-hero { padding: 56px 0 0; background: linear-gradient(135deg,#f8f9fa 0%,white 100%); }
.products-hero h1 { font-size: 48px; font-weight: 800; }
.products-hero .breadcrumb-item a { color: var(--gray); text-decoration: none; }
.products-hero .breadcrumb-item.active { color: var(--dark); font-weight: 600; }
.product-card { background: white; border-radius: 16px; overflow: hidden; transition: all .3s; height: 100%; border: 1px solid rgba(0,0,0,.05); box-shadow: 0 12px 40px rgba(0,0,0,.1); display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.product-card:hover { border-color: rgba(0,0,0,.1); color: inherit; }
.product-image { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--light); }
.product-image-link { display: block; width: 100%; height: 100%; }
.product-image img { width: 100%; height: 100%; object-fit: cover; }
.product-image-fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #f0f2f5; }
.product-image-fallback i { font-size: 48px; color: #ccc; }
.no-pointer-events { pointer-events: none; }
.product-badge { position: absolute; top: 16px; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; color: white; }
.product-badge-left { left: 16px; }
.product-badge-right { right: 16px; }
.product-badge-br { bottom: 16px; right: 16px; top: auto; }
.badge-recently-updated { background: linear-gradient(135deg,#c91594,#cd0893); }
.badge-sale-amount { background: linear-gradient(135deg,#1DBF73,#18A965); }
.badge-sale-percent { background: linear-gradient(135deg,#FF6B35,#FF8C5A); }
.product-body { padding: 24px; flex: 1; display: flex; flex-direction: column; }
.product-body h3 { font-size: 22px; font-weight: 700; margin-bottom: 8px; color: var(--dark); }
.product-card:hover h3 { color: var(--dark); }
.product-excerpt { color: var(--gray); margin-bottom: 20px; font-size: 15px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 48px; }
.product-price { margin-bottom: 20px; }
.product-price .current { font-size: 28px; font-weight: 700; color: var(--dark); }
.product-price .old { font-size: 18px; color: #999; text-decoration: line-through; margin-left: 8px; }
.products-empty-icon { font-size: 48px; display: block; margin-bottom: 16px; }
@media(max-width:768px){.products-hero{padding:40px 0 0}.products-hero h1{font-size:32px}}