.courses-page{box-sizing:border-box;background:linear-gradient(135deg,#f0fdf4 0%,#fff 50%,#f0fdf4 100%);min-height:100vh;padding:100px 2rem 4rem;overflow-x:hidden}.courses-page *,.courses-page :before,.courses-page :after{box-sizing:border-box}.courses-loading{justify-content:center;align-items:center;min-height:100vh;display:flex}.loader{border:3px solid #e5e5e5;border-top-color:#217346;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.courses-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem;max-width:1000px;margin:0 auto 3rem;display:flex}.courses-header-content h1{color:#1a1a1a;margin:0 0 .5rem;font-size:2.25rem;font-weight:800}.courses-header-content p{color:#666;margin:0;font-size:1.125rem}.courses-meta{gap:1.5rem;margin-top:.75rem;display:flex}.courses-meta span{color:#217346;align-items:center;gap:.35rem;font-size:.875rem;font-weight:600;display:flex}.courses-meta span:before{content:"";background:#217346;border-radius:50%;width:6px;height:6px}.overall-progress{text-align:center}.progress-circle{width:80px;height:80px;position:relative}.progress-circle svg{transform:rotate(-90deg)}.progress-circle span{color:#217346;font-size:1.125rem;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.progress-label{color:#666;margin-top:.5rem;font-size:.875rem}.courses-container{max-width:1000px;margin:0 auto}.levels-grid{flex-direction:column;gap:1.5rem;display:flex}.level-card{background:#fff;border-radius:16px;transition:all .3s;overflow:hidden;box-shadow:0 4px 20px #00000014}.level-card:hover{box-shadow:0 8px 30px #0000001f}.level-header{cursor:pointer;align-items:center;gap:1.5rem;padding:1.5rem;transition:background .3s;display:flex}.level-header:hover{background:#f9fafb}.level-icon{background:var(--level-color);color:#fff;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;display:flex}.level-info{flex:1;min-width:0}.level-number{text-transform:uppercase;letter-spacing:.05em;color:var(--level-color);font-size:.75rem;font-weight:600}.level-info h2{color:#1a1a1a;margin:.25rem 0;font-size:1.25rem;font-weight:700}.level-subtitle{color:#666;margin:0;font-size:.875rem}.level-progress{text-align:right;flex-shrink:0}.progress-bar{background:#e5e5e5;border-radius:4px;width:120px;height:8px;margin-bottom:.5rem;overflow:hidden}.progress-fill{background:var(--level-color);border-radius:4px;height:100%;transition:width .5s}.level-progress span{color:#666;font-size:.75rem}.level-toggle{color:#999;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:transform .3s;display:flex}.level-card.expanded .level-toggle{transform:rotate(180deg)}.level-content{max-height:0;transition:max-height .4s;overflow:hidden}.level-card.expanded .level-content{max-height:3500px}.level-description{color:#666;margin:0 0 1rem;padding:0 1.5rem;font-size:.95rem}.lessons-list{flex-direction:column;gap:.5rem;padding:0 1.5rem 1.5rem;display:flex}.lesson-item{background:#f9fafb;border-radius:10px;align-items:center;gap:1rem;padding:1rem;text-decoration:none;transition:all .3s;display:flex}.lesson-item:hover{background:#f0fdf4;transform:translate(4px)}.lesson-item.completed{background:#dcfce7;border:1px solid #86efac}.lesson-item.completed:hover{background:#bbf7d0}.lesson-status{flex-shrink:0}.lesson-number{color:#666;background:#e5e5e5;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:.75rem;font-weight:600;display:flex}.lesson-info{flex:1;min-width:0}.lesson-info h4{color:#1a1a1a;margin:0 0 .25rem;font-size:.95rem;font-weight:600}.lesson-description{color:#666;margin:0 0 .35rem;font-size:.8rem;line-height:1.4}.lesson-duration{color:#999;align-items:center;gap:.35rem;font-size:.8rem;display:flex}.lesson-arrow{color:#999;flex-shrink:0;transition:transform .3s}.lesson-item:hover .lesson-arrow{color:#217346;transform:translate(4px)}@media (max-width:768px){.courses-page{padding:100px 1rem 2rem}.courses-header{text-align:center;flex-direction:column}.level-header{flex-wrap:wrap;gap:1rem}.level-progress{text-align:left;order:4;width:100%}.progress-bar{width:100%}.level-toggle{position:absolute;top:1.5rem;right:1.5rem}.level-card{position:relative}.level-card.expanded .level-content{max-height:none;overflow:visible}.lesson-info h4{font-size:.9rem}.lesson-description{font-size:.75rem}}@media (max-width:480px){.courses-page{padding:80px .75rem 1.5rem}.courses-header-content h1{font-size:1.75rem}.level-header{gap:.75rem;padding:1rem}.level-icon{width:48px;height:48px}.level-info h2{font-size:1.1rem}.level-subtitle{font-size:.75rem}.lessons-list{gap:.35rem;padding:0 1rem 1rem}.lesson-item{gap:.75rem;padding:.75rem}.lesson-number{width:24px;height:24px;font-size:.7rem}.lesson-info h4{font-size:.85rem}.lesson-description{margin:0 0 .2rem;font-size:.7rem}.lesson-duration{font-size:.7rem}}