.hwe-pimg-link { display: block; position: relative; overflow: hidden; text-decoration: none; color: inherit; line-height: 0; }
.hwe-pimg-link--has-overlay::after { content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none; will-change: background-color; transition-property: background-color; transition-duration: 400ms; transition-timing-function: ease; }
.hwe-pimg--primary { display: block; width: 100%; height: auto; object-fit: cover; object-position: center; }
.hwe-pimg--hover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; will-change: opacity; transition: opacity 400ms ease; pointer-events: none; }
.hwe-pimg-link:hover .hwe-pimg--hover, .hwe-pimg-link:focus-within .hwe-pimg--hover { opacity: 1; }
.hwe-pimg-badge { position: absolute; z-index: 10; line-height: 1; pointer-events: none; font-size: 0.75rem; font-weight: 600; padding: 4px 8px; border-radius: 4px; }
.hwe-pimg-badge--sale { background-color: #e02020; color: #ffffff; }
.hwe-pimg-badge--new { background-color: #2e9e5b; color: #ffffff; }
.hwe-pimg-badge--top-right { top: var(--hwe-badge-v, 10px); right: var(--hwe-badge-h, 10px); }
.hwe-pimg-badge--top-left { top: var(--hwe-badge-v, 10px); left: var(--hwe-badge-h, 10px); }
.hwe-pimg-badge--bottom-right { bottom: var(--hwe-badge-v, 10px); right: var(--hwe-badge-h, 10px); }
.hwe-pimg-badge--bottom-left { bottom: var(--hwe-badge-v, 10px); left: var(--hwe-badge-h, 10px); }