/* Original SVG retained as vector artwork; transparent hotspots add true interactions. */
#hyeperks-ecosystem-diagram .hyeperks-ecosystem-figure{position:relative}
.hye-svg-hotspots{position:absolute;inset:0;pointer-events:none}
.hye-svg-hotspot{position:absolute;left:var(--x);top:43.4%;transform:translate(-50%,-50%);width:10.2%;aspect-ratio:1;border:2px solid transparent;border-radius:50%;background:transparent;color:transparent;font-size:0;cursor:pointer;pointer-events:auto;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
.hye-svg-hotspot:hover,.hye-svg-hotspot:focus-visible{background:rgba(231,181,21,.12);border-color:#e4b51b;box-shadow:0 0 0 5px rgba(231,181,21,.16);transform:translate(-50%,-50%) scale(1.06);outline:none}
.hye-svg-hotspot[aria-pressed="true"]{border-color:#e4b51b;box-shadow:0 0 0 4px rgba(231,181,21,.18)}
.hye-svg-info{position:relative;max-width:820px;margin:0 auto 28px;padding:20px 58px 20px 25px;border-left:4px solid #e4b51b;background:#fff;color:#444657;box-shadow:0 12px 35px #34344218}
.hye-svg-info[hidden]{display:none}.hye-svg-info h3{font-size:24px;margin:0 0 6px;color:#444657}.hye-svg-info p{margin:0;line-height:1.6;color:#66697b}.hye-svg-close{position:absolute;top:9px;right:15px;background:transparent;border:0;color:#444657;font-size:30px;cursor:pointer}
@media(max-width:700px){#hyeperks-ecosystem-diagram .hye-svg-info{position:sticky;left:0;max-width:calc(100vw - 30px);margin:0 15px 24px}.hye-svg-hotspot{min-width:76px}}
@media(prefers-reduced-motion:reduce){.hye-svg-hotspot{transition:none}}