.how-to-learn-section{background:linear-gradient(180deg,#fdfbff,#fff 50%,#fafbff);overflow:hidden;padding:60px 24px;position:relative;transition:background .3s ease,background-color .3s ease;width:100%}:root[data-theme=dark] .how-to-learn-section{background:linear-gradient(180deg,#0f0d1a,#0d1117 50%,#0a0e14)}.how-to-learn-container{margin:0 auto;max-width:1200px}.how-to-learn-header{margin-bottom:40px;text-align:center}.how-to-learn-title{color:var(--landing-text-primary);font-size:clamp(20px,3vw,36px);font-weight:800;letter-spacing:-.02em;line-height:1.2;margin:0 0 10px;transition:color .3s ease}:root[data-theme=dark] .how-to-learn-title{color:#fff}.brand-highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--landing-primary) 0,var(--landing-primary-light) 100%);-webkit-background-clip:text;background-clip:text}.how-to-learn-subtitle{color:var(--landing-text-secondary);font-size:clamp(14px,1.2vw,18px);font-weight:500;line-height:1.6;margin:0;transition:color .3s ease}:root[data-theme=dark] .how-to-learn-subtitle{color:#a1a1aa}.how-to-learn-split-layout{grid-gap:60px;align-items:start;display:grid;gap:60px;grid-template-columns:1fr 1fr}.steps-timeline-wrapper{display:flex;flex-direction:column;gap:20px}.steps-timeline{display:flex;flex-direction:column;gap:0;position:relative}.timeline-step{align-items:flex-start;animation:fadeInUp .6s ease-out forwards;background:#fff;border:2px solid #0000000f;border-radius:12px;cursor:pointer;display:flex;gap:16px;margin-bottom:12px;opacity:0;padding:16px 20px;position:relative;transform:translateY(20px);transition:all .4s cubic-bezier(.4,0,.2,1)}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}:root[data-theme=dark] .timeline-step{background:#ffffff0a;border-color:#ffffff14}.timeline-step:hover{border-color:rgba(var(--landing-accent-purple-rgb),.3);box-shadow:0 8px 30px rgba(var(--landing-accent-purple-rgb),.12);transform:translateY(-4px)}.timeline-step.active{border-color:rgba(var(--landing-accent-purple-rgb),.5);box-shadow:0 12px 40px rgba(var(--landing-accent-purple-rgb),.2)}.step-timeline-connector{border-left:2px dashed;height:12px;left:32px;opacity:.4;position:absolute;top:100%;width:2px}.timeline-step-icon-wrapper{flex-shrink:0;position:relative}.timeline-step-icon{align-items:center;background:#fff;border:2px solid;border-radius:12px;display:flex;font-size:24px;height:48px;justify-content:center;position:relative;transition:all .4s cubic-bezier(.68,-.55,.265,1.55);width:48px;z-index:2}:root[data-theme=dark] .timeline-step-icon{background:#ffffff0d}.timeline-step:hover .timeline-step-icon{transform:scale(1.1) rotate(5deg)}.timeline-step-number{align-items:center;border-radius:50%;box-shadow:0 4px 12px #00000026;color:#fff;display:flex;font-size:12px;font-weight:800;height:22px;justify-content:center;position:absolute;right:-6px;top:-6px;width:22px;z-index:3}.timeline-step-content{flex:1 1}.timeline-step-header{align-items:center;display:flex;gap:12px;justify-content:space-between}.timeline-step-title{color:var(--landing-text-primary);flex:1 1;font-size:17px;font-weight:700;line-height:1.3;margin:0}:root[data-theme=dark] .timeline-step-title{color:#fff}.timeline-step-dropdown-icon{color:var(--landing-text-secondary);flex-shrink:0;font-size:24px;transition:transform .3s}:root[data-theme=dark] .timeline-step-dropdown-icon{color:#9ca3af}.timeline-step.active .timeline-step-dropdown-icon{transform:rotate(180deg)}.timeline-step-description{animation:slideDown .3s ease-out;border-top:1px solid #0000000f;margin-top:12px;padding-top:12px}:root[data-theme=dark] .timeline-step-description{border-top-color:#ffffff0f}@keyframes slideDown{0%{max-height:0;opacity:0}to{max-height:200px;opacity:1}}.timeline-step-description p{color:var(--landing-text-secondary);font-size:14px;font-weight:500;line-height:1.6;margin:0}:root[data-theme=dark] .timeline-step-description p{color:#9ca3af}.start-learning-btn{align-items:center;align-self:flex-start;background:linear-gradient(135deg,var(--landing-primary) 0,var(--landing-primary-light) 100%);border:none;border-radius:12px;box-shadow:0 8px 24px rgba(var(--landing-primary-rgb),.3);color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:700;gap:10px;padding:14px 32px;transition:all .4s cubic-bezier(.4,0,.2,1)}.start-learning-btn:hover{box-shadow:0 16px 40px rgba(var(--landing-primary-rgb),.4);transform:translateY(-3px)}.start-learning-btn svg{font-size:24px;transition:transform .3s}.start-learning-btn:hover svg{transform:translateX(6px)}.cta-note{align-items:center;color:var(--landing-success);display:flex;font-size:13px;font-weight:600;gap:6px;margin:0}:root[data-theme=dark] .cta-note{color:#34d399}.cta-note svg{font-size:16px}.walkthrough-visual-wrapper{display:flex;flex-direction:column;height:600px;position:relative}@keyframes fadeInRight{0%{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}.walkthrough-visual-container{flex-direction:column;overflow:visible}.walkthrough-video-frame,.walkthrough-visual-container{border-radius:28px;display:flex;height:100%;position:relative}.walkthrough-video-frame{align-items:center;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:8px solid #fff;box-shadow:0 30px 80px #00000026;justify-content:center;overflow:hidden;transition:transform .4s;width:100%}:root[data-theme=dark] .walkthrough-video-frame{background:linear-gradient(135deg,#1a1a2e,#0f0a1a);border-color:#ffffff1a;box-shadow:0 30px 80px #00000080}.walkthrough-video-frame:hover{transform:scale(1.02)}.walkthrough-video{border-radius:20px;display:block;height:100%;object-fit:cover;width:100%}.video-play-overlay{align-items:center;background:linear-gradient(135deg,rgba(var(--landing-primary-rgb),.85) 0,#3a7dd8d9 100%);border-radius:20px;cursor:pointer;display:flex;flex-direction:column;gap:16px;inset:0;justify-content:center;opacity:0;position:absolute;transition:opacity .4s}.walkthrough-video-frame:hover .video-play-overlay{opacity:1}.play-button{align-items:center;background:#fff;border-radius:50%;box-shadow:0 8px 32px #0003;color:var(--landing-primary);display:flex;font-size:36px;height:80px;justify-content:center;transition:transform .3s;width:80px}.video-play-overlay:hover .play-button{transform:scale(1.15)}.video-label{color:#fff;font-size:20px;font-weight:700;margin:0;text-shadow:0 2px 8px #0003}.walkthrough-feature{align-items:center;animation:floatWalkthrough 3s ease-in-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff;border:1px solid #00000014;border-radius:14px;box-shadow:0 12px 32px #0000001f;display:flex;gap:12px;padding:14px 18px;position:absolute;z-index:3}:root[data-theme=dark] .walkthrough-feature{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff14;border-color:#ffffff1f}@media (max-width:768px){.walkthrough-feature{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fffffffa}:root[data-theme=dark] .walkthrough-feature{-webkit-backdrop-filter:none;backdrop-filter:none;background:#1e1e28f2}}@keyframes floatWalkthrough{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.walkthrough-feature-1{animation-delay:0s;right:-10%;top:10%}.walkthrough-feature-2{animation-delay:1s;bottom:20%;left:-12%}.walkthrough-feature-3{animation-delay:2s;right:-8%;top:50%}.walkthrough-feature-icon{color:var(--landing-primary);flex-shrink:0;font-size:28px}:root[data-theme=dark] .walkthrough-feature-icon{color:var(--landing-primary-light)}.walkthrough-feature-content{display:flex;flex-direction:column;gap:2px}.walkthrough-feature-label{color:#9ca3af;font-size:11px;font-weight:600;letter-spacing:.5px;line-height:1;text-transform:uppercase}:root[data-theme=dark] .walkthrough-feature-label{color:#d1d5db}.walkthrough-feature-value{color:var(--landing-text-primary);font-size:16px;font-weight:700;line-height:1}:root[data-theme=dark] .walkthrough-feature-value{color:#fff}.walkthrough-background-glow{background:radial-gradient(circle,rgba(var(--landing-primary-rgb),.15) 0,#0000 70%);filter:blur(25px);inset:-40%;position:absolute;z-index:-1}@keyframes pulseWalkthrough{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}@media (max-width:1024px){.how-to-learn-section{padding:50px 20px}.how-to-learn-title{font-size:32px}.how-to-learn-subtitle{font-size:15px}.how-to-learn-split-layout{gap:50px}.timeline-step{padding:14px 18px}.timeline-step-icon{font-size:22px;height:44px;width:44px}.timeline-step-title{font-size:16px}.walkthrough-feature{padding:12px 16px}.walkthrough-feature-icon{font-size:24px}.walkthrough-feature-value{font-size:14px}}@media (max-width:768px){.how-to-learn-section{overflow-x:clip;overflow-y:visible;padding:40px 0}.how-to-learn-container{margin:0;max-width:none;overflow-x:clip;overflow-y:visible;padding:0}.how-to-learn-header{margin-bottom:30px;margin-left:auto;margin-right:auto;max-width:100%;padding-left:16px;padding-right:16px}.how-to-learn-title{font-size:28px}.how-to-learn-subtitle{font-size:14px}.how-to-learn-split-layout{gap:32px;grid-template-columns:1fr;overflow:visible}.walkthrough-visual-wrapper{height:250px;margin-left:auto;margin-right:auto;max-height:250px;max-width:100%;min-height:250px;order:1;padding-left:16px;padding-right:16px}.walkthrough-visual-container{height:250px;max-height:250px;overflow:hidden;padding:0}.walkthrough-video-frame{align-items:center;border-width:3px;display:flex;height:250px;justify-content:center;max-height:250px;overflow:hidden;padding:8px;width:100%}.walkthrough-video{display:block;height:100%;max-height:234px;object-fit:cover;width:100%}.walkthrough-video-frame:hover{transform:none}.steps-timeline-wrapper{margin-left:0;margin-right:0;order:2;overflow:visible;position:relative;width:100%}.steps-timeline{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;display:flex;flex-direction:row;flex-wrap:nowrap;gap:16px;overflow-x:auto;overflow-y:hidden;padding:0 16px 16px;scroll-behavior:smooth;scrollbar-width:none}.steps-timeline::-webkit-scrollbar{display:none;height:0;width:0}.timeline-step{align-items:flex-start;display:flex;flex-direction:column;flex-shrink:0;gap:12px;margin-bottom:0;min-width:85vw;padding:20px;text-align:left}.timeline-step:hover{transform:none}.step-timeline-connector{display:none}.timeline-step-icon{font-size:20px;height:40px;width:40px}.timeline-step-number{font-size:11px;height:20px;width:20px}.timeline-step-title{font-size:15px}.start-learning-btn{align-self:stretch;font-size:14px;justify-content:center;margin-left:16px;margin-right:16px;margin-top:8px;max-width:calc(100% - 32px);padding:12px;width:calc(100% - 32px)}.start-learning-btn span{font-size:14px;white-space:nowrap}.cta-note{font-size:12px;padding-left:16px;padding-right:16px;text-align:center}.walkthrough-feature-1{right:2%;top:5%}.walkthrough-feature-2{bottom:5%;left:2%}.walkthrough-feature-3{display:none}.play-button{font-size:28px;height:60px;width:60px}.video-label{font-size:16px}}@media (max-width:480px){.how-to-learn-section{padding:35px 0}.how-to-learn-header,.walkthrough-visual-wrapper{padding-left:12px;padding-right:12px}.how-to-learn-title{font-size:24px}.how-to-learn-subtitle{font-size:13px}.walkthrough-visual-wrapper{min-height:200px}.walkthrough-video-frame,.walkthrough-visual-container,.walkthrough-visual-wrapper{height:200px;max-height:200px}.walkthrough-video{height:100%;max-height:184px}.timeline-step{flex-shrink:0;margin-bottom:0;min-width:260px;padding:14px}.timeline-step-icon{font-size:18px;height:36px;width:36px}.timeline-step-number{font-size:10px;height:18px;width:18px}.timeline-step-title{font-size:14px}.start-learning-btn{font-size:13px;margin-left:12px;margin-right:12px;max-width:calc(100% - 24px);padding:10px;width:calc(100% - 24px)}.start-learning-btn span{font-size:13px}.cta-note{font-size:11px;padding-left:12px;padding-right:12px}.walkthrough-feature{display:none}.walkthrough-video-frame{border-width:4px}.play-button{font-size:24px;height:50px;width:50px}.video-label{font-size:14px}}@media (prefers-reduced-motion:reduce){.timeline-step,.walkthrough-background-glow,.walkthrough-feature,.walkthrough-visual-wrapper{animation:none}.timeline-step{opacity:1;transform:none}.play-button,.start-learning-btn svg,.timeline-step-icon,.walkthrough-video-frame{transition:none}}