.hotspot-container{position:relative;transform:translateZ(0);backface-visibility:hidden}.hotspot-container .hotspot{position:absolute;width:28px;height:28px;background-color:#10283e;border:2px solid #F0F6FF;border-radius:50%;cursor:pointer;transform:translate3d(-50%,-50%,0);z-index:1;box-shadow:0 2px 5px #0003;transition:transform .2s cubic-bezier(.4,0,.2,1);display:none;align-items:center;justify-content:center;will-change:transform}@media screen and (min-width: 769px){.product__media-item.is-active .hotspot,.product__media-item:first-child .hotspot{display:flex}}@media screen and (max-width: 768px){.product__media-item .hotspot{display:flex}}.hotspot-container .hotspot:after{content:"";position:absolute;z-index:-1;width:100%;height:100%;background-color:#10283eb3;border-radius:50%;animation:hotspot-pulse 1.75s infinite cubic-bezier(.4,0,.6,1);will-change:transform,opacity}.hotspot-container .hotspot:hover{transform:translate3d(-50%,-50%,0) scale(1.1)}.hotspot-container .hotspot-icon{font-size:18px;color:#f0f6ff;font-weight:700;line-height:1;-webkit-user-select:none;user-select:none;pointer-events:none;z-index:2;position:relative;font-display:swap}@keyframes hotspot-pulse{0%{transform:scale(1);opacity:.7}to{transform:scale(2);opacity:0}}.hotspot-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;z-index:9999;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;opacity:0;transition:opacity .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.hotspot-modal.is-visible{display:flex;opacity:1}.hotspot-modal-content{background:#fff;border-radius:16px;box-shadow:0 10px 30px #0000004d;width:800px;height:400px;display:flex;position:relative;overflow:hidden;transform:scale(.95);transition:transform .3s cubic-bezier(.4,0,.2,1)}.hotspot-modal.is-visible .hotspot-modal-content{transform:scale(1)}.hotspot-modal-close{position:absolute;top:15px;right:15px;width:32px;height:32px;background:#0009;color:#fff;border-radius:50%;border:none;font-size:20px;line-height:32px;text-align:center;cursor:pointer;z-index:10;transition:background .2s ease,transform .2s ease;outline:2px solid transparent;outline-offset:2px}.hotspot-modal-close:hover{background:#000c;transform:scale(1.05)}.hotspot-modal-close:focus{outline-color:#fff}.hotspot-modal-image-container{flex:0 0 400px;width:400px;height:400px;background-color:#f8f8f8;position:relative;border-radius:16px 0 0 16px;overflow:hidden;display:flex;align-items:center;justify-content:center}.hotspot-modal-image{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .3s ease}.hotspot-modal-image.loaded{opacity:1}.hotspot-modal-text{flex:0 0 400px;width:400px;height:400px;padding:40px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;box-sizing:border-box}.hotspot-modal-headline{font-size:20px;margin:0 0 10px;font-weight:600;color:#1a1a1a;line-height:1.3;font-display:swap}.hotspot-modal-description{font-size:14px;line-height:1.5;margin:0;color:#444;font-display:swap}@media screen and (max-width: 768px){.hotspot-modal{padding:15px}.hotspot-modal-content{flex-direction:column;width:calc(100vw - 30px);max-width:500px;height:auto;max-height:85vh}.hotspot-modal-image-container{flex:0 0 auto;width:100%;height:200px;aspect-ratio:1.6 / 1;border-radius:16px 16px 0 0}.hotspot-modal-text{flex:1;width:100%;height:auto;padding:25px 20px;justify-content:flex-start;overflow-y:auto}.hotspot-modal-headline{font-size:18px;margin-bottom:5px}.hotspot-modal-description{font-size:14px;line-height:1.5}}@media (prefers-reduced-motion: reduce){.hotspot-container .hotspot:after{animation:none}.hotspot-container .hotspot,.hotspot-modal,.hotspot-modal-content,.hotspot-modal-image{transition:none}}@media (prefers-contrast: high){.hotspot-container .hotspot{border-width:3px;box-shadow:0 0 0 2px #fffc}}.cart-item .hotspot,.cart-drawer .hotspot,.mini-cart .hotspot,.checkout .hotspot,.collection-grid .hotspot,.search-results .hotspot{display:none!important}.hotspot-modal-image-container:before{content:"";position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border:3px solid #f3f3f3;border-top:3px solid #10283e;border-radius:50%;animation:spin 1s linear infinite;opacity:0;transition:opacity .3s ease}.hotspot-modal-image-container.loading:before{opacity:1}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/hotspots.css.map */
