.tutorial-step{border-radius:1rem;border-width:2px;overflow:hidden;transition:all .3s}.tutorial-step--active{border-color:#ff4a20;background-color:#fff;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);transform:scale(1.02)}.tutorial-step--completed{border-color:#dadbd2;background-color:#fff;opacity:.75}.tutorial-step--inactive{border-color:#dadbd2;background-color:#fff;opacity:.5}.tutorial-step__media{position:relative;aspect-ratio:16/9;background:linear-gradient(to bottom right,#eeefe8,#e0dfd7);overflow:hidden}.tutorial-step__image,.tutorial-step__video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.tutorial-step__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.tutorial-step__placeholder-content{text-align:center}.tutorial-step__placeholder-icon-container{width:5rem;height:5rem;margin-left:auto;margin-right:auto;margin-bottom:1rem;border-radius:9999px;background-color:rgba(255,74,32,.1);display:flex;align-items:center;justify-content:center}.tutorial-step__placeholder-icon{width:2.5rem;height:2.5rem;color:#ff4a20}.tutorial-step__placeholder-text{font-size:.875rem;color:#777;font-weight:500}.tutorial-step__badge{position:absolute;top:1rem;left:1rem;width:2.5rem;height:2.5rem;border-radius:9999px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;backdrop-filter:blur(4px)}.tutorial-step__badge--active{background-color:#ff4a20;color:#fff}.tutorial-step__badge--completed{background-color:hsla(0,0%,100%,.9);color:#191919}.tutorial-step__badge--inactive{background-color:hsla(0,0%,100%,.7);color:#5a5a5a}.tutorial-step__content{padding:1.5rem}.tutorial-step__title{font-size:1.5rem;font-weight:700;color:#191919;margin-bottom:.75rem}.tutorial-step__description{font-size:1rem;color:#5a5a5a;margin-bottom:1rem;line-height:1.75}.tutorial-step__custom-content{margin-top:1rem}