.bento-grid-vid{height:90svh;width:100%}.bento-grid-vid .grid-main{height:100%;width:100%;display:flex;justify-content:space-between;gap:1vw;background:transparent linear-gradient(180deg,#fff0,#fff 9% 100%) 0% 0% no-repeat padding-box;padding-block:2.5vw}.bento-grid-vid .grid-main .grid-left,.bento-grid-vid .grid-main .grid-right{display:flex;flex-direction:column;gap:1vw;width:35%}.bento-grid-vid .grid-main .grid-mid{width:30%;display:flex;flex-direction:column;gap:1vw}.bento-grid-vid .grid-main .grid-left .grid-empty-div,.bento-grid-vid .grid-main .grid-right .grid-empty-div,.bento-grid-vid .grid-main .grid-mid .grid-empty-div{overflow:hidden}.bento-grid-vid .grid-main .grid-left .grid-empty-div.one,.bento-grid-vid .grid-main .grid-left .grid-empty-div.two{height:50%;width:100%;background:var(--bg);border-radius:0 59px 59px 0}.bento-grid-vid .grid-main .grid-right .grid-empty-div.one{height:60%;width:100%;background:var(--bg);border-radius:59px 0 0 59px}.bento-grid-vid .grid-main .grid-right .grid-empty-div.two{height:40%;width:100%;background:var(--bg);border-radius:59px 0 0 59px}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.one{height:32.5%;width:100%;border-radius:0 0 59px 59px;position:relative;top:0;left:0}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.one:before{content:"";position:absolute;height:100%;width:100%;background:transparent linear-gradient(180deg,#fff,#fff0)}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.two{height:32.5%;width:100%;border-radius:59px 59px 0 0;position:relative}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.two:after{content:"";position:absolute;height:100%;width:100%;background:transparent linear-gradient(0deg,#fff,#fff0);top:0;left:0}.bento-grid-vid .grid-main .grid-mid .grid-video{height:35%;width:100%;background:var(--bg);border-radius:59px;padding:1.5%;overflow:hidden;box-shadow:0 0 25px #00000029;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.bento-grid-vid .grid-main .grid-mid .grid-video span.head-mid{font-family:free-script-regular;font-size:3vw;line-height:1}.video-modal{display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:#000000f2;opacity:0;transition:opacity .3s ease}.video-modal.active{display:flex;align-items:center;justify-content:center;opacity:1}.video-modal-content{position:relative;width:90%;max-width:1200px;max-height:90vh;transform:scale(.9);transition:transform .3s ease}.video-modal.active .video-modal-content{transform:scale(1)}.video-modal-wrapper{position:relative;width:100%;padding-bottom:56.25%;background:#000;border-radius:50px;overflow:hidden}.modal-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}.video-modal-close{position:absolute;top:-50px;right:0;background:transparent;border:none;color:#fff;font-size:48px;font-weight:300;cursor:pointer;z-index:10000;padding:0;width:48px;height:48px;line-height:48px;text-align:center;transition:transform .2s ease,opacity .2s ease;opacity:.8;display:flex;justify-content:center;align-items:center}.video-modal-close svg{height:60%;width:60%}.bento-grid-vid .grid-main .grid-mid .grid-video video,.bento-grid-vid .grid-main .grid-mid .grid-video img{border-radius:50px}@media screen and (max-width: 950px){.bento-grid-vid{height:auto}.bento-grid-vid .grid-main{display:flex;flex-direction:column;gap:3vw;background:linear-gradient(to bottom,#fff,#f7f7f7 15%,#ebebeb 70%,#f7f7f7,#fff)}.bento-grid-vid .grid-main .grid-left,.bento-grid-vid .grid-main .grid-right{width:100%;z-index:2;padding-inline:2vw}.bento-grid-vid .grid-main .grid-mid{width:60%}.bento-grid-vid .grid-main .grid-left .grid-empty-div.one{border-radius:0 0 37px}.bento-grid-vid .grid-main .grid-left .grid-empty-div.two{border-radius:0 37px 0 0}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.one,.bento-grid-vid .grid-main .grid-mid .grid-empty-div.two{height:15%}.bento-grid-vid .grid-main .grid-left .grid-empty-div.one,.bento-grid-vid .grid-main .grid-left .grid-empty-div.two{border-radius:20px;height:35vw}.bento-grid-vid .grid-main .grid-left,.bento-grid-vid .grid-main .grid-mid,.bento-grid-vid .grid-main .grid-right{gap:1.8vw}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.one{border-radius:0 0 20px;position:absolute;top:-33vw;left:-5vw;background:#fff;z-index:1;width:30%;height:50vw}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.two{border-radius:0 20px 0 0;position:absolute;bottom:-25vw;left:-5vw;background:#fff;z-index:1;width:30%;height:50vw}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.three{position:absolute;z-index:1;background:#fff;height:50vw;width:25%;top:-18vw;right:0;border-radius:0 0 0 20px}.bento-grid-vid .grid-main .grid-mid .grid-empty-div.four{position:absolute;z-index:1;background:#fff;height:50vw;width:25%;bottom:-40vw;right:0;border-radius:20px 0 0}.bento-grid-vid .grid-main .grid-mid .grid-video span.head-mid{font-size:7vw}.bento-grid-vid .grid-main .grid-mid .grid-video{height:70%;box-shadow:0 0 50px #00000029;padding:3%}.bento-grid-vid .grid-main .grid-right .grid-empty-div.one{height:70vw;border-radius:20px}.bento-grid-vid .grid-main .grid-right .grid-empty-div.two{height:50%;border-radius:37px 0 0}.video-modal-content{width:95%}.video-modal-close{top:-40px;font-size:40px;width:40px;height:40px;line-height:40px}.video-modal-wrapper{border-radius:4px;height:150vw;min-height:150vw}.play-overlay svg{width:48px;height:48px}.bento-grid-vid .grid-main .grid-mid{width:100%;display:flex;justify-content:center;align-items:center;position:relative}.bento-grid-vid .grid-main .grid-mid .grid-video{height:45vw;width:45%;border-radius:20px}.bento-grid-vid .grid-main .grid-mid .grid-video .head-logo{display:flex;justify-content:center;align-items:center;width:50%;height:4.5vw}.bento-grid-vid .grid-main .grid-mid .grid-video .head-logo svg{height:100%;width:100%}}
/*# sourceMappingURL=/cdn/shop/t/13/assets/bento-grid-video.css.map */