.interactive-hotspots{padding:0}.interactive-hotspots__header{text-align:center;margin-bottom:3rem}.interactive-hotspots__header h2{font-family:var(--ssg-font-heading);font-size:var(--ssg-heading-size);font-weight:var(--ssg-heading-weight);line-height:var(--ssg-heading-line-height);margin:0 0 1rem}.interactive-hotspots__header p{font-family:var(--ssg-font-body);font-size:var(--ssg-subheading-size);line-height:var(--ssg-subheading-line-height);max-width:600px;margin:0 auto;opacity:.85}.interactive-hotspots__premium-badge{text-align:center;margin-bottom:1.5rem}.interactive-hotspots__premium-badge span{display:inline-block;background:linear-gradient(135deg,#095ed8,#334fb4);color:#fff;font-size:var(--ssg-label-size);font-weight:var(--ssg-label-weight);letter-spacing:var(--ssg-label-letter-spacing);text-transform:var(--ssg-label-transform);padding:.6rem 1.5rem;border-radius:50px;box-shadow:0 4px 15px #095ed84d}.interactive-hotspots__container{position:relative;max-width:400px;margin:0 auto}.interactive-hotspots__image{width:100%;height:auto;display:block;border-radius:32px}.hotspot{position:absolute;width:40px;height:40px;transform:translate(-50%,-50%);cursor:pointer;z-index:10}.hotspot__pulse{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;background:#095ed859;animation:hotspot-pulse 2.5s ease-in-out infinite}.hotspot__dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;background:#095ed8;box-shadow:0 0 0 3px #ffffffe6,0 0 15px #095ed8cc,0 0 30px #095ed880;animation:hotspot-glow 2.5s ease-in-out infinite}.hotspot:hover .hotspot__dot{transform:translate(-50%,-50%) scale(1.2);background:#334fb4;box-shadow:0 0 0 3px #fff,0 0 20px #095ed8,0 0 40px #095ed8b3;animation:none}.hotspot:hover .hotspot__pulse{animation:none;opacity:0}@keyframes hotspot-pulse{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes hotspot-glow{0%,to{box-shadow:0 0 0 3px #ffffffe6,0 0 12px #095ed8b3,0 0 25px #095ed866}50%{box-shadow:0 0 0 3px #ffffffe6,0 0 18px #095ed8e6,0 0 35px #095ed899}}.hotspot__tooltip{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%) translateY(8px);background:#1a1a2e;color:#fff;padding:12px 16px;border-radius:10px;width:220px;text-align:left;opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease,visibility .25s ease;box-shadow:0 8px 32px #00000040;z-index:100;pointer-events:none}.hotspot__tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:8px solid transparent;border-top-color:#1a1a2e}.hotspot:hover .hotspot__tooltip{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.hotspot--tooltip-left .hotspot__tooltip{left:0;transform:translate(0) translateY(8px)}.hotspot--tooltip-left:hover .hotspot__tooltip{transform:translate(0) translateY(0)}.hotspot--tooltip-left .hotspot__tooltip:after{left:14px;transform:none}.hotspot--tooltip-right .hotspot__tooltip{left:auto;right:0;transform:translate(0) translateY(8px)}.hotspot--tooltip-right:hover .hotspot__tooltip{transform:translate(0) translateY(0)}.hotspot--tooltip-right .hotspot__tooltip:after{left:auto;right:14px;transform:none}.hotspot--tooltip-bottom .hotspot__tooltip{bottom:auto;top:calc(100% + 12px)}.hotspot--tooltip-bottom .hotspot__tooltip:after{top:auto;bottom:100%;border:8px solid transparent;border-bottom-color:#1a1a2e;border-top-color:transparent}.hotspot__tooltip-title{font-family:var(--font-heading-family);font-weight:700;font-size:1.1rem;margin:0 0 6px;color:#fff}.hotspot__tooltip-text{font-size:1rem;line-height:1.5;margin:0;opacity:.85}.hotspot__tooltip-badge{display:inline-block;background:linear-gradient(135deg,#095ed8,#334fb4);color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:4px;margin-bottom:8px}@media screen and (max-width:749px){.hotspot{width:24px;height:24px}.hotspot__dot{width:12px;height:12px}.hotspot__tooltip{width:240px;padding:14px 16px;font-size:.75rem}.hotspot__tooltip-title{font-size:1.6rem;margin:0 0 8px}.hotspot__tooltip-text{font-size:1.35rem;line-height:1.5}.hotspot__tooltip-badge{font-size:.95rem}.interactive-hotspots__container{max-width:300px}}.interactive-hotspots__instruction{text-align:center;margin-top:1.5rem;font-size:var(--ssg-note-size);opacity:.6}.interactive-hotspots__instruction svg{width:16px;height:16px;vertical-align:middle;margin-right:6px;stroke:currentColor}
/*# sourceMappingURL=/cdn/shop/t/40/assets/section-interactive-hotspots.css.map */