.tutorial-step{margin:2.5rem 0;padding:2.5rem;background:#ffffffb3;backdrop-filter:blur(20px);border-radius:20px;border:2px solid rgba(255,255,255,.5);transition:all .3s ease;position:relative;overflow:visible}.tutorial-step:hover{transform:translateY(-3px);box-shadow:0 12px 30px #0000001a;border-color:#3700ff4d}.tutorial-step-header{display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;position:relative}.tutorial-step-number{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(135deg,#3700ffe6,#3700ff);color:#fff;border-radius:50%;font-weight:800;font-size:1.1rem;flex-shrink:0;box-shadow:0 4px 15px #3700ff4d}.tutorial-step-title{font-size:1.4rem;font-weight:800;color:#1f2937;margin:0;line-height:1.3}.tutorial-step-content{line-height:1.8;color:#4b5563}.tutorial-step-content p{margin-bottom:1.5rem}.tutorial-step-content p:last-child{margin-bottom:0}.tutorial-step .code-container{margin:1.5rem 0}@media (max-width: 768px){.tutorial-step{padding:2rem;margin:2rem 0}.tutorial-step-header{flex-direction:column;align-items:flex-start;gap:1rem;text-align:left}.tutorial-step-number{width:36px;height:36px;font-size:1rem}.tutorial-step-title{font-size:1.25rem}}@media (max-width: 480px){.tutorial-step{padding:1.5rem;margin:1.5rem 0}.tutorial-step-header{gap:.75rem}}