.image-hotspot-section{position:fixed;top:0;left:0;width:100%;height:100%}.image-hotspot-container{width:100%;height:100%;margin:0;padding:0;overflow:hidden;position:relative;display:block}.image-hotspot-wrapper{position:relative;width:100vw;height:100vh;min-width:1366px;overflow-x:auto;overflow-y:hidden;display:block;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.image-hotspot-wrapper{overflow-x:auto;overflow-y:hidden;width:100vw;min-width:100vw;height:100%;display:block;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.image-hotspot-content{min-width:1366px;width:auto;height:100vh;position:relative;display:block}.image-hotspot-main{min-width:1366px;width:100%;height:100vh;object-fit:cover;display:block;pointer-events:none}.image-hotspot-wrapper::-webkit-scrollbar{display:none;width:0;height:0}.image-hotspot-main{display:block;width:100%;height:100%;max-height:100vh;object-fit:cover}@media screen and (min-width: 769px){.image-hotspot-main{width:100%;max-width:100%}}@media screen and (max-width: 768px){.image-hotspot-content{width:auto;min-width:1366px}.image-hotspot-main{width:100%;max-width:none}.image-hotspot-wrapper:before,.image-hotspot-wrapper:after{content:"";position:absolute;top:0;height:100%;width:40px;pointer-events:none;z-index:10;opacity:0;transition:opacity .3s ease}.image-hotspot-wrapper:before{left:0}.image-hotspot-wrapper:after{right:0}.image-hotspot-wrapper:hover:before,.image-hotspot-wrapper:hover:after{opacity:1}@keyframes pulse{0%{opacity:.7}50%{opacity:.3}to{opacity:.7}}}.hotspot-point{position:absolute;transform:translate(-50%,-50%);z-index:10;pointer-events:auto}hotspot-point{position:absolute;z-index:2}.hotspot-marker{width:11px;height:11px;border-radius:50%;cursor:pointer;position:relative;z-index:2;transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1);background:#fff;box-shadow:0 0 #ffffff1f}.hotspot-point:hover .hotspot-marker,.hotspot-marker:focus,.hotspot-marker.active{transform:scale(1.7);box-shadow:0 4px 24px #ffffff2e,0 0 0 8px #ffffff1f;opacity:1}.hotspot-marker:hover{opacity:0;transition:opacity .3s ease}.hotspot-marker:after{content:"";position:absolute;left:50%;top:50%;width:100%;height:100%;border-radius:50%;border:4px solid rgba(255,255,255,.45);transform:translate(-50%,-50%) scale(1);opacity:.7;pointer-events:none;z-index:1;transition:none;animation:hotspot-grow-trail 1.2s cubic-bezier(.22,1,.36,1) infinite}@keyframes hotspot-grow-trail{0%{transform:translate(-50%,-50%) scale(1);opacity:.7;border-width:4px}60%{opacity:.25;border-width:8px}to{transform:translate(-50%,-50%) scale(2.8);opacity:0;border-width:12px}}.hotspot-content{position:absolute;top:-50px;left:50%;transform:translate(-50%);background-color:#fff;color:#000;padding:8px 16px;border-radius:50px;box-shadow:0 1px 4px #00000026;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:20;text-align:center;white-space:normal;min-width:40px;max-width:200px;width:max-content;display:flex;align-items:center;justify-content:center;overflow-wrap:break-word;box-sizing:border-box}.hotspot-content.active,.hotspot-point:hover .hotspot-content{opacity:1;visibility:visible}.hotspot-title{margin:0;padding:0;font-size:.9rem;font-weight:500;color:#000;font-family:itc-benguiat-condensed,sans-serif;word-break:keep-all;-webkit-hyphens:auto;hyphens:auto}.hotspot-description{margin-bottom:12px;font-size:.9rem;line-height:1.4;color:#000}.hotspot-link{display:inline-block;color:#000;text-decoration:underline;font-weight:500;transition:opacity .2s ease;margin-top:10px}.hotspot-link:hover{opacity:.7}.hotspot-product-image{max-width:50px;height:auto;margin:10px auto;display:block;background-color:#fff}.image-hotspot-wrapper{position:relative}.scroll-indicator{background:#faf0d7;position:absolute;right:16px;bottom:20px;display:inline-flex;align-items:center;gap:8px;color:#222;border-radius:0;padding:8px 12px;font-family:itc-benguiat-condensed,sans-serif;font-size:.9rem;letter-spacing:.02em;line-height:1;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:60;border:2px solid #222}.scroll-indicator.visible{opacity:1;visibility:visible}.scroll-indicator__arrow{position:relative;width:34px;height:25px;display:inline-block;animation:wiggle-x 1.2s ease-in-out infinite}.scroll-indicator__arrow:before{content:"";position:absolute;left:0;top:50%;width:16px;height:2px;background:currentColor;border:none;transform:translateY(-50%);border-radius:1px}.scroll-indicator__arrow:after{content:"";position:absolute;right:0;top:50%;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor;transform:translateY(-50%)}.scroll-indicator__text-mobile{display:none}.scroll-indicator__text-desktop{display:inline}@keyframes wiggle-x{0%{transform:translate(-3px)}50%{transform:translate(5px)}to{transform:translate(-3px)}}@media (prefers-reduced-motion: reduce){.scroll-indicator__arrow{animation:none}}@media (max-width: 768px){.image-hotspot-container{padding:0}.hotspot-content{width:200px}.hotspot-marker{width:11px;height:11px}.scroll-indicator{bottom:52px}.scroll-indicator__text-mobile{display:inline}.scroll-indicator__text-desktop{display:none}}@media (max-width: 480px){.image-hotspot-container{padding:0}.hotspot-content{max-width:160px;padding:6px 12px}.hotspot-title{font-size:.75rem}.hotspot-point:nth-child(1) .hotspot-content,.hotspot-point:nth-child(5) .hotspot-content{left:0;transform:translate(0)}.hotspot-point:nth-child(2) .hotspot-content,.hotspot-point:nth-child(4) .hotspot-content{left:auto;right:0;transform:translate(0)}}@media (max-width: 320px){.hotspot-content{width:140px;padding:5px 10px;top:calc(100% + 10px)}.hotspot-title{font-size:.7rem}}@media (min-width: 901px){.hotspot-marker{opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease,transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1)}}@media (max-width: 769px){.image-hotspot-wrapper,.image-hotspot-content{min-width:unset!important;width:auto!important}.image-hotspot-main{min-width:unset!important;width:auto!important;height:var(--mobile-inner-height, 100vh)!important;max-height:var(--mobile-inner-height, 100vh)!important;object-fit:contain!important}}
/*# sourceMappingURL=/cdn/shop/t/16/assets/image-hotspot.css.map */
