.banner__media video,.banner__media iframe{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border:0}.banner__media .deferred-media{position:absolute;top:0;left:0;width:100%;height:100%}.banner__media .deferred-media__poster{width:100%;height:100%;border:0;padding:0;background:transparent;cursor:pointer}.banner__media .deferred-media__poster img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.video-banner--wrapper{border-radius:2.4rem}.video-banner__pl-button{transition:transform .3s ease-in-out;z-index:4}.video-banner__pl-button>button svg:last-child{display:none}.video-banner__pl-button>button svg{width:1.1rem;height:1.1rem}.video-banner--wrapper .video-banner:before,.video-banner--wrapper .video-banner:after{transition:all 1s ease-in-out;pointer-events:none!important}.video-banner--wrapper.playing .video-banner:after{opacity:0!important}.video-banner--wrapper.playing deferred-media{z-index:4}.video-banner--wrapper.playing .deferred-media__poster{display:none!important;pointer-events:none}.video-banner--wrapper:not(.playing) .deferred-media__poster{display:flex;z-index:3}.video-banner--wrapper.playing .banner__media video{z-index:2;pointer-events:auto}.video-banner--wrapper.playing:not(:hover) .video-banner__pl-button{transform:translateY(200%)}.video-banner--wrapper.playing .video-banner__pl-button>button svg:first-child{display:none}.video-banner--wrapper.playing .video-banner__pl-button>button svg:last-child{display:block}.video-banner__pl-button{position:absolute;bottom:1rem;left:1rem;z-index:3;cursor:pointer}.video-banner--wrapper .banner__box{height:100%}.video-banner--wrapper .banner__box{padding:0rem}.video-banner__pl-button{border-radius:5.5rem;background:rgb(var(--color-button));width:fit-content;padding:.7rem 1.8rem .7rem .7rem;cursor:pointer}.video-banner__pl-button button{border-radius:50%;background:rgb(var(--color-button-text));outline:none;border:none;width:3.3rem;height:3.3rem;padding:0rem;color:rgb(var(--color-button))}.video-banner__pl-button>p{margin:0rem;color:rgb(var(--color-button-text))}.video-banner__pl-button:hover{background:rgb(var(--color-button-text))}.video-banner__pl-button:hover button{background:rgb(var(--color-button));color:rgb(var(--color-button-text))}.video-banner__pl-button:hover p{color:rgb(var(--color-button))}@media screen and (min-width:750px){.video-banner--wrapper .banner__content{pointer-events:none}.video-banner--wrapper .banner__content .banner__box{transition:all 1s ease-in-out}.video-banner--wrapper.playing .banner__content .banner__box{transform:translateY(-100%)}.video-banner__pl-button{bottom:4rem;left:4rem}.video-banner__pl-button{background:rgb(var(--color-button));padding:1.1rem 2.7rem 1.1rem 1.1rem}.video-banner__pl-button button{width:5rem;height:5rem}.video-banner__pl-button>button svg{width:1.8rem;height:2rem}}@media screen and (max-width:750px){.video-banner--wrapper>div,.video-banner--wrapper .banner__content,.video-banner--wrapper .banner__box.content-container{background-color:transparent!important}.video-banner--wrapper .banner__box.content-container{--color-foreground: 24, 41, 65}.video-banner--wrapper .media{border-radius:1.2rem}.video-banner{row-gap:2rem}.video-banner .banner__box .banner__heading+*{margin-top:.8rem}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/component-video-banner.css.map */
