.sleep-shoppable-banner{width:100%;overflow:hidden}.sleep-shoppable-banner__container{max-width:100%;margin:0 auto}.sleep-shoppable-banner__image-wrapper{position:relative;width:100%;display:block}.page-width .sleep-shoppable-banner__image-wrapper{border-radius:20px;overflow:hidden}.sleep-shoppable-banner__image{width:100%;height:100%;display:block;object-fit:cover;border-radius:20px}.sleep-shoppable-banner__image--mobile{display:none}@media screen and (max-width:768px){.sleep-shoppable-banner__image--desktop{display:none}.sleep-shoppable-banner__image--mobile{display:block}}.sleep-shoppable-banner__placeholder{width:100%;min-height:400px;background-color:#f5f5f5;display:flex;align-items:center;justify-content:center}.sleep-shoppable-banner__hotspot{position:absolute;transform:translate(-50%,-50%);z-index:2}.sleep-shoppable-banner__point{position:relative;width:40px;height:40px;background:transparent;border:none;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}.sleep-shoppable-banner__point-pulse{position:absolute;width:40px;height:40px;border-radius:50%;background-color:#fff6;animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(.8);opacity:1}50%{transform:scale(1.2);opacity:.5}to{transform:scale(.8);opacity:1}}.sleep-shoppable-banner__point-dot{position:relative;width:16px;height:16px;border-radius:50%;background-color:#fff;border:2px solid rgba(0,0,0,.1);box-shadow:0 2px 8px #00000026;z-index:2;transition:transform .3s ease}.sleep-shoppable-banner__point:hover .sleep-shoppable-banner__point-dot{transform:scale(1.2);box-shadow:0 4px 12px #00000040}.sleep-shoppable-banner__popup{position:absolute;top:50%;transform:translateY(-50%);width:320px;background-color:transparent;border-radius:15px;box-shadow:0 8px 32px #00000026;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:1;pointer-events:none}.sleep-shoppable-banner__popup--visible{opacity:1;visibility:visible;pointer-events:all}.sleep-shoppable-banner__popup--right{left:50px}.sleep-shoppable-banner__popup--left{right:50px}.sleep-shoppable-banner__popup-content{display:flex;flex-direction:column;background-color:var(--sleep-popup-content-bg);border-radius:15px}.sleep-shoppable-banner__popup-image{width:100%;overflow:hidden;border-radius:12px 12px 0 0}.sleep-shoppable-banner__popup-image img{border-radius:12px;margin:10px 10px 0;height:auto;display:block;object-fit:cover}.sleep-shoppable-banner__popup-info{display:flex;flex-direction:column;padding:8px 18px;border-radius:12px;margin:10px;background-color:var(--sleep-popup-info-bg)}.sleep-shoppable-banner__popup-title{font-size:14px;font-weight:350;line-height:100%;margin:0;color:#1b1b1b}.sleep-shoppable-banner__popup-variant-name{font-size:1rem;font-weight:400;line-height:1;font-family:var(--font-body-family);margin-bottom:8px;color:#000}.sleep-shoppable-banner__popup-price{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sleep-shoppable-banner__popup-price--compare{font-size:24px;font-family:var(--font-body-family);font-weight:400;color:#999;text-decoration:line-through}.sleep-shoppable-banner__popup-price--current{font-size:24px;font-family:var(--font-body-family);font-weight:600;color:#202020}.sleep-shoppable-banner__popup-price-button{display:flex;justify-content:space-between;gap:12px;margin-top:8px}.sleep-shoppable-banner__popup-price-button .price{font-weight:400;font-size:12px;line-height:100%;color:#1b1b1b}.sleep-shoppable-banner__popup-button{display:inline-block;background:transparent;padding:14px 10px;text-align:center;text-decoration:none;border-radius:6px;transition:all .3s ease;font-size:14px;font-weight:600;border:none;cursor:pointer}.sleep-shoppable-banner__popup-button:before{background:transparent}.sleep-shoppable-banner__popup-button:hover{transform:translateY(-2px)}.sleep-shoppable-banner__popup-variants{display:flex;gap:8px;flex-wrap:wrap;padding:0 24px 8px}.sleep-shoppable-banner__popup-variant-swatch-wrapper{display:inline-block}.sleep-shoppable-banner__popup-variant-swatch{display:block;width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;cursor:pointer;transition:all .3s ease}.sleep-shoppable-banner__popup-variant-swatch:hover{border-color:#000;transform:scale(1.1)}.sleep-shoppable-banner__popup-variant-swatch--active{border-color:#000;box-shadow:0 0 0 2px #fff,0 0 0 4px #000}.sleep-shoppable-banner__mobile-toggle{display:none;position:absolute;bottom:27px;left:21px;background-color:#202020;color:#fff;border:none;border-radius:8px;padding:4px 6px;box-shadow:0 4px 16px #00000026;cursor:pointer;align-items:center;gap:6px;font-size:14px;font-weight:600;z-index:2;transition:all .3s ease}.sleep-shoppable-banner__mobile-toggle svg{width:14px;height:14px}.sleep-shoppable-banner__mobile-toggle--active{background-color:#000;color:#fff}.sleep-shoppable-banner__mobile-carousel{display:none;width:100%;max-height:0;overflow:hidden;opacity:0;transition:max-height .4s ease,opacity .4s ease,padding .4s ease;background-color:#eceae6;border-radius:12px}.sleep-shoppable-banner__mobile-carousel--visible{max-height:600px;opacity:1;padding:22px 16px}.sleep-shoppable-banner__mobile-carousel-title{font-size:20px;font-weight:500;font-family:var(--font-heading-family);margin-bottom:22px;color:#000}.sleep-shoppable-banner__mobile-carousel-wrapper{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;padding:0 20px}.sleep-shoppable-banner__mobile-carousel-wrapper::-webkit-scrollbar{display:none}.sleep-shoppable-banner__mobile-card{flex:0 0 calc(100% - 40px);max-width:400px;overflow:hidden;scroll-snap-align:start}.sleep-shoppable-banner__mobile-card-image{width:100%;aspect-ratio:1;overflow:hidden}.sleep-shoppable-banner__mobile-card-image img{width:100%;height:100%;object-fit:cover;display:block;border-radius:10px}.sleep-shoppable-banner__mobile-card-info{padding:14px 16px;margin-top:10px;display:flex;flex-direction:column;background-color:#fff;border-radius:10px}.sleep-shoppable-banner__mobile-card-title{font-size:18px;font-weight:400;font-family:var(--font-body-family);line-height:1.4;margin:0;color:#222220}.sleep-shoppable-banner__mobile-card-variant-name{font-size:18px;font-weight:400;font-family:var(--font-body-family);line-height:1.4;margin:4px 0 0;color:#222220}.sleep-shoppable-banner__mobile-card-price-button{display:flex;justify-content:space-between;align-items:center;gap:12px}.sleep-shoppable-banner__mobile-card-price{display:flex;gap:4px}.sleep-shoppable-banner__mobile-card-price--compare{font-size:20px;font-family:var(--font-body-family);font-weight:400;color:#999;text-decoration:line-through}.sleep-shoppable-banner__mobile-card-price--current{font-size:20px;font-family:var(--font-body-family);font-weight:600;color:#202020}.sleep-shoppable-banner__mobile-card-variants{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;margin-bottom:12px}.sleep-shoppable-banner__mobile-card-variant-swatch-wrapper{display:inline-block}.sleep-shoppable-banner__mobile-card-variant-swatch{display:block;width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;cursor:pointer;transition:all .3s ease}.sleep-shoppable-banner__mobile-card-variant-swatch:hover{border-color:#000;transform:scale(1.1)}.sleep-shoppable-banner__mobile-card-variant-swatch--active{border-color:#000;box-shadow:0 0 0 2px #fff,0 0 0 4px #000}.sleep-shoppable-banner__mobile-card-button{display:inline-flex;align-items:center;justify-content:center;background:transparent;padding:12px;border:1px solid #e0e0e0;border-radius:50%;transition:all .3s ease;flex-shrink:0}.sleep-shoppable-banner__mobile-card-button:before{background:transparent}.sleep-shoppable-banner__mobile-card-button:hover{border-color:#000;background-color:#000}.sleep-shoppable-banner__mobile-card-button:hover svg path{fill:#fff}.sleep-shoppable-banner__mobile-carousel-dots{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:16px}.sleep-shoppable-banner__mobile-carousel-dot{width:8px;height:8px;border-radius:50%;background-color:#e0e0e0;border:none;padding:0;cursor:pointer;transition:all .3s ease}.sleep-shoppable-banner__mobile-carousel-dot--active{background-color:#000;width:24px;border-radius:4px}@media screen and (max-width:768px){.sleep-shoppable-banner__hotspot{display:none}.sleep-shoppable-banner__mobile-toggle{display:flex}.sleep-shoppable-banner__mobile-carousel{display:block}.sleep-shoppable-banner__popup{width:280px}.sleep-shoppable-banner__popup--right{left:40px}.sleep-shoppable-banner__popup--left{right:40px}.sleep-shoppable-banner__popup-content{padding:16px}.sleep-shoppable-banner__popup-title{font-size:14px}.sleep-shoppable-banner__popup-price--current{font-size:16px}.sleep-shoppable-banner__point,.sleep-shoppable-banner__point-pulse{width:36px;height:36px}.sleep-shoppable-banner__point-dot{width:14px;height:14px}}@media screen and (max-width:480px){.sleep-shoppable-banner__popup{width:240px}.sleep-shoppable-banner__popup--right,.sleep-shoppable-banner__popup--left{left:50%;right:auto;transform:translate(-50%,-50%);top:auto;bottom:50px}.sleep-shoppable-banner__popup:before{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid #ffffff}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/shoppable-banner.css.map */