.tutorial-video-hero{--tvh-blue: #d9e3ff;--tvh-ink: #111111;position:relative;min-height:650px;margin-bottom:180px;padding:76px 0 0;overflow:visible;background-color:var(--tvh-blue);background-image:var(--tvh-bg-image);background-position:var(--tvh-bg-position);background-repeat:no-repeat;background-size:cover;color:var(--tvh-ink)}.tutorial-video-hero__inner{position:relative;min-height:inherit}.tutorial-video-hero__copy{position:relative;z-index:2;width:min(100%,760px);margin:0 auto;text-align:center}.tutorial-video-hero__eyebrow{margin:0 0 24px;font-size:16px;font-weight:400;line-height:1.3}.tutorial-video-hero__heading{max-width:900px;margin:0 auto 22px;color:var(--tvh-ink);font-size:52px;font-weight:900;line-height:.98;letter-spacing:-.025em;text-transform:none}.tutorial-video-hero__heading-mobile{display:none}.tutorial-video-hero__subtitle{max-width:620px;margin:0 auto;font-size:16px;line-height:1.45}.tutorial-video-hero__subtitle p{margin:0}.tutorial-video-hero__slider{position:relative;z-index:3;width:min(68vw,860px);margin:0 auto;transform:translateY(70px)}.tutorial-video-hero__frame{position:relative;padding:10px;border-radius:16px;background:var(--tvh-frame-color);box-shadow:0 18px 34px #11111129;transform:rotate(-2deg)}.tutorial-video-hero__viewport{border-radius:10px;background:#111}.tutorial-video-hero__track{display:block;width:100%}.tutorial-video-hero__slide{position:relative;display:none;min-width:0;aspect-ratio:16 / 9;background:#111;pointer-events:all}.tutorial-video-hero__slide.is-active{display:block;pointer-events:all}.tutorial-video-hero__video,.tutorial-video-hero__slide iframe,.tutorial-video-hero__slide video{display:block;width:100%;height:100%;border:0;object-fit:cover;pointer-events:all;touch-action:manipulation}.tutorial-video-hero__hosted-wrap{position:relative;width:100%;height:100%}.tutorial-video-hero__video-toggle{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:grid;width:100%;height:100%;padding:0;place-items:center;border:0;background:transparent;color:#fff;cursor:pointer;touch-action:manipulation}.tutorial-video-hero__video-icon{display:block;width:64px;height:64px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.34))}.tutorial-video-hero__video-icon svg{display:block;width:100%;height:100%}.tutorial-video-hero__video-icon--stop,.tutorial-video-hero__hosted-wrap.is-playing .tutorial-video-hero__video-icon--play{display:none}.tutorial-video-hero__hosted-wrap.is-playing .tutorial-video-hero__video-icon--stop{display:block}.tutorial-video-hero__arrow{position:absolute;top:50%;z-index:5;display:grid;width:48px;height:48px;padding:0;place-items:center;border:0;border-radius:50%;background:#fff;box-shadow:0 10px 26px #00000024;color:#111;cursor:pointer;transform:translateY(-50%)}.tutorial-video-hero__arrow--prev{left:-68px}.tutorial-video-hero__arrow--next{right:-68px}.tutorial-video-hero__arrow:focus-visible{outline:2px solid #111;outline-offset:3px}@media screen and (max-width:64rem){.tutorial-video-hero{min-height:680px;margin-bottom:0;padding:43px 0 0;background-image:var(--tvh-mobile-bg-image);background-position:center bottom;background-size:cover}.tutorial-video-hero__inner{padding-right:15px;padding-left:15px}.tutorial-video-hero__copy{width:min(100%,360px)}.tutorial-video-hero__eyebrow{margin-bottom:16px;font-size:14px}.tutorial-video-hero__heading{margin-bottom:15px;font-size:24px;line-height:1.05}.tutorial-video-hero__heading-desktop{display:none}.tutorial-video-hero__heading-mobile{display:inline}.tutorial-video-hero__subtitle{max-width:340px;font-size:16px;line-height:1.45}.tutorial-video-hero__slider{top:34px;width:calc(100% - 28px);max-width:520px;margin-top:0;transform:none}.tutorial-video-hero__frame{background:var(--tvh-frame-color);box-shadow:0 18px 34px #11111129;padding:5px;border-radius:9px;transform:none}.tutorial-video-hero__viewport{border-radius:5px}.tutorial-video-hero__arrow{width:38px;height:38px}.tutorial-video-hero__arrow--prev{left:-12px}.tutorial-video-hero__arrow--next{right:-12px}.tutorial-video-hero__video-icon{width:52px;height:52px}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-tutorial-video-hero.css.map */