.video-with-text__media-wrapper{position:relative;width:100%;height:100%;overflow:hidden;border-radius:var(--media-radius)}.video-with-text__media-wrapper--adapt{position:relative}.video-with-text__media-wrapper--adapt:before{content:"";display:block;padding-bottom:var(--video-aspect-ratio, 56.25%)}.video-with-text__media-wrapper--adapt>*{position:absolute;top:0;left:0;width:100%;height:100%}.video-with-text__media-wrapper--small{height:19.4rem}.video-with-text__media-wrapper--medium{height:29.6rem}.video-with-text__media-wrapper--large{height:43.5rem}@media screen and (min-width: 750px){.video-with-text__media-wrapper--small{height:31.4rem}.video-with-text__media-wrapper--medium{height:46rem}.video-with-text__media-wrapper--large{height:69.5rem}}.video-with-text__video{width:100%;height:100%;object-fit:cover;display:block}.video-with-text__iframe{width:100%;height:100%;border:0}.video-with-text__poster{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;cursor:pointer;transition:opacity .4s ease}.video-with-text__poster.is-hidden{opacity:0;pointer-events:none}.video-with-text__poster-image{width:100%;height:100%;object-fit:cover}.video-with-text__play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8rem;height:8rem;border-radius:50%;background:rgba(var(--color-foreground),.9);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .3s ease,background .3s ease;z-index:3}.video-with-text__play-button:hover{transform:translate(-50%,-50%) scale(1.08);background:rgba(var(--color-foreground),1)}.video-with-text__play-button:focus-visible{outline:2px solid rgba(var(--color-foreground),.5);outline-offset:4px}.video-with-text__play-button svg{width:2.4rem;height:2.4rem;fill:rgb(var(--color-background));margin-left:.3rem}.video-with-text__pause-button{position:absolute;bottom:1.6rem;right:1.6rem;width:4rem;height:4rem;border-radius:50%;background:rgba(var(--color-foreground),.7);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease,background .3s ease;z-index:4}.video-with-text__media-wrapper:hover .video-with-text__pause-button,.video-with-text__pause-button:focus{opacity:1}.video-with-text__pause-button:hover{background:rgba(var(--color-foreground),.9)}.video-with-text__pause-button svg{width:1.6rem;height:1.6rem;fill:rgb(var(--color-background))}.video-with-text__loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4rem;height:4rem;border:3px solid rgba(var(--color-foreground),.2);border-top-color:rgba(var(--color-foreground),.8);border-radius:50%;animation:video-spin .8s linear infinite;z-index:5;opacity:0;pointer-events:none}.video-with-text__media-wrapper.is-loading .video-with-text__loader{opacity:1}@keyframes video-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@media screen and (max-width: 749px){.video-with-text__poster--mobile-only{display:block}.video-with-text__video--autoplay-desktop{display:none}.video-with-text__media-wrapper.is-playing .video-with-text__video--autoplay-desktop{display:block}}.video-with-text__placeholder{display:flex;align-items:center;justify-content:center;background:rgba(var(--color-foreground),.04);height:100%;min-height:20rem}.video-with-text__placeholder svg{width:6rem;height:6rem;fill:rgba(var(--color-foreground),.3)}@media screen and (min-width: 750px){.video-with-text__placeholder{min-height:30rem}}.video-with-text__mute-indicator{position:absolute;bottom:1.6rem;left:1.6rem;padding:.6rem 1.2rem;background:rgba(var(--color-foreground),.7);border-radius:2rem;font-size:1.2rem;color:rgb(var(--color-background));display:flex;align-items:center;gap:.6rem;opacity:0;transition:opacity .3s ease;z-index:4;cursor:pointer;border:none}.video-with-text__media-wrapper:hover .video-with-text__mute-indicator{opacity:1}.video-with-text__mute-indicator svg{width:1.4rem;height:1.4rem;fill:currentColor}.video-with-text__media-wrapper:fullscreen{background:rgb(var(--color-background))}.video-with-text__media-wrapper:fullscreen .video-with-text__video{object-fit:contain}
/*# sourceMappingURL=/cdn/shop/t/28/assets/component-video-with-text.css.map */
