.brand-collection-hotspots { width:100%; box-sizing:border-box; }
.bch-stage { position:relative; width:100%; }
.bch-stage img.bch-image { display:block; width:100%; height:auto; }
.bch-placeholder { padding:80px 24px; text-align:center; background:#eee; color:#333; }
.bch-anchor { position:absolute; left:var(--bch-x); top:var(--bch-y); transform:translate(-50%,-50%); z-index:2; }
.bch-target { display:flex; position:relative; align-items:center; justify-content:center; width:44px; height:44px; padding:0; color:inherit; text-decoration:none; border-radius:50%; }
.bch-dot { display:block; flex-shrink:0; width:var(--bch-dot-size); height:var(--bch-dot-size); border-radius:50%; background:var(--bch-dot-color); box-shadow:0 0 0 6px rgb(255 255 255 / 25%),0 1px 4px rgb(0 0 0 / 25%); }
.bch-label { position:absolute; top:100%; left:50%; transform:translateX(-50%); padding:5px 9px; background:#fff; color:#222; font-size:12px; line-height:1.4; white-space:nowrap; border-radius:3px; box-shadow:0 1px 4px rgb(0 0 0 / 15%); }
.bch-target:hover .bch-dot { box-shadow:0 0 0 8px rgb(255 255 255 / 40%),0 1px 4px rgb(0 0 0 / 25%); }
.bch-target:focus-visible { outline:2px solid #333; outline-offset:3px; }
.bch-target--empty { cursor:default; }
@media (max-width:959px) { .bch-anchor { left:var(--bch-mx); top:var(--bch-my); } }
@media (min-width:960px) { .bch-stage .bch-image.hidden-desktop { display:none; } }
@media (max-width:959px) { .bch-stage .bch-image.hidden-mobile { display:none; } }