:root{--primary-color:#06a94d;--sidebar-width:240px;--bg-gradient:linear-gradient(135deg,#f8fafc,#f1f5f9);--sidebar-bg:#fff;--text-primary:#1e293b;--text-secondary:#64748b;--accent-blue:#3b82f6;--accent-purple:#8b5cf6;--accent-orange:#f97316;--accent-yellow:#eab308;--accent-pink:#ec4899}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f8fafc;color:var(--text-primary);-webkit-font-smoothing:antialiased}.main-content{margin-left:var(--sidebar-width);min-height:100vh;transition:margin-left .3s ease}@media (max-width:768px){.main-content{margin-left:0!important}}.page-header-wrapper{background:transparent;padding:24px 0 32px;margin-bottom:24px}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;background:var(--sidebar-bg);border-right:1px solid #e2e8f0;box-shadow:4px 0 24px rgba(0,0,0,.02);z-index:1000;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:2px}.sidebar-logo{padding:32px 24px;border-bottom:1px solid #f1f5f9;position:relative}.sidebar-logo h4{color:#0f172a;margin:0;font-size:22px;font-weight:800;letter-spacing:-.5px;display:flex;align-items:center;gap:10px}.sidebar-menu{display:flex;flex-direction:column;padding:24px 16px;gap:4px;flex:1 1}.sidebar-menu-item{padding:12px 16px;display:flex;align-items:center;gap:14px;color:#64748b;text-decoration:none;transition:all .2s ease;border-radius:12px;font-size:15px;font-weight:500}.sidebar-menu-item i{font-size:20px;color:#94a3b8;transition:color .2s}.sidebar-menu-item:hover{background:#f8fafc;color:#1e293b}.sidebar-menu-item:hover i{color:#06a94d}.sidebar-menu-item.active{background:#f0fdf4;color:#166534;border:1px solid #dcfce7;box-shadow:0 2px 4px rgba(0,0,0,.02)}.sidebar-menu-item.active i{color:#06a94d}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .8s ease-out forwards}.animate-slide-up{animation:slideUp .8s ease-out forwards}.delay-100{animation-delay:.1s}.delay-200{animation-delay:.2s}.delay-300{animation-delay:.3s}.hover-lift{transition:transform .3s ease,box-shadow .3s ease}.hover-lift:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,.1)}.course-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 6px -1px rgba(0,0,0,.05),0 2px 4px -1px rgba(0,0,0,.03);border:1px solid #e2e8f0;height:100%;display:flex;flex-direction:column;transition:all .3s ease}.course-card:hover{transform:translateY(-5px);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.course-card-header{position:relative;height:200px;overflow:hidden;background:#cbd5e1}.course-thumbnail{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.course-card:hover .course-thumbnail{transform:scale(1.05)}.course-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e2e8f0,#cbd5e1);color:#94a3b8;font-size:48px}.course-card-badges-top{position:absolute;top:12px;left:12px;display:flex;gap:8px;z-index:10}.course-badge-premium{background:rgba(6,169,77,.9);color:#fff;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.course-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);width:56px;height:56px;background:hsla(0,0%,100%,.9);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#06a94d;font-size:28px;opacity:0;transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;box-shadow:0 4px 6px rgba(0,0,0,.1)}.course-card:hover .course-play-btn{opacity:1;transform:translate(-50%,-50%) scale(1)}.course-play-btn:hover{background:#fff;color:#04873d;transform:translate(-50%,-50%) scale(1.1)!important}.course-card-body{padding:20px;flex:1 1;display:flex;flex-direction:column}.course-title{font-size:1.1rem;font-weight:700;color:#1e293b;margin-bottom:8px;line-height:1.4;height:2.8em;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.course-author{font-size:.9rem;color:#64748b;margin-bottom:16px}.course-stats-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:12px;gap:12px;margin-bottom:20px}.course-stat-badge{display:flex;align-items:center;gap:8px;font-size:.85rem;color:#64748b;font-weight:500}.course-stat-badge i{font-size:14px}.course-stat-badge i.bi-people-fill{color:#3b82f6}.course-stat-badge i.bi-star-fill{color:#f59e0b}.course-stat-badge i.bi-file-earmark-text-fill{color:#f97316}.course-stat-badge i.bi-clock-fill{color:#8b5cf6}.course-enroll-btn{margin-top:auto;display:block;text-align:center;padding:12px;background:#06a94d;color:#fff;border-radius:10px;text-decoration:none;font-weight:700;transition:all .2s;box-shadow:0 4px 6px -1px rgba(6,169,77,.2)}.course-enroll-btn:hover{background:#059669;color:#fff;transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(6,169,77,.3)}.course-enroll-btn.enrolled{background:#1e293b;color:#fff;box-shadow:none}.course-enroll-btn.enrolled:hover{background:#0f172a;color:#fff}.page-title{position:relative;display:inline-block}.page-title:after{content:"";position:absolute;bottom:-4px;left:0;width:40px;height:4px;background:#06a94d;border-radius:2px}.course-detail-container{max-width:1400px;margin:0 auto;padding:0 clamp(16px,3vw,24px) 80px}.course-layout-grid{display:grid;grid-template-columns:1fr;grid-gap:32px;gap:32px;position:relative}@media (min-width:1024px){.course-layout-grid{grid-template-columns:1fr 360px;gap:48px;align-items:start}}.course-main-content{min-width:0}.course-sidebar-wrapper{position:relative;z-index:10}@media (min-width:1024px){.course-sidebar-wrapper{position:-webkit-sticky;position:sticky;top:24px}}.course-sidebar-card{border-radius:16px;overflow:hidden;box-shadow:0 4px 6px -1px rgba(0,0,0,.05),0 10px 15px -3px rgba(0,0,0,.05)}.course-sidebar-card,.learnings-box{background:#fff;border:1px solid #e2e8f0}.learnings-box{border-radius:16px;padding:32px;margin-bottom:40px}.learnings-grid{display:grid;grid-template-columns:1fr;grid-gap:16px;gap:16px}@media (min-width:768px){.learnings-grid{grid-template-columns:1fr 1fr}}.learning-item{display:flex;gap:12px}.instructor-box{display:flex;gap:24px;align-items:flex-start;margin-bottom:40px}.instructor-avatar{flex-shrink:0;width:80px;height:80px;border-radius:50%;overflow:hidden;background:#f1f5f9}.instructor-avatar img{width:100%;height:100%;object-fit:cover}.instructor-info{flex:1 1}.course-description{color:#475569;line-height:1.8;font-size:1.05rem;margin-bottom:48px}.section-title{font-size:1.5rem;font-weight:700;color:#1e293b;margin-bottom:24px}.course-player-container{display:flex;flex-direction:column;height:100vh;background-color:#0f172a;overflow:hidden}.player-navbar{height:64px;background-color:#1e293b;border-bottom:1px solid #334155;display:flex;align-items:center;justify-content:space-between;padding:0 24px;flex-shrink:0;z-index:50}.player-back-link{display:flex;align-items:center;gap:8px;color:#94a3b8;font-weight:600;text-decoration:none;font-size:.95rem;transition:color .2s}.player-back-link:hover{color:#fff}.player-title{color:#fff;font-size:1.1rem;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50%}.player-progress-wrapper{display:flex;align-items:center;gap:16px}.player-progress-info{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}.player-progress-info span{font-size:.75rem;color:#94a3b8}.player-progress-info strong{color:#06a94d;font-size:.9rem}.player-progress-bar-container{width:120px;height:6px;background:#334155;border-radius:3px;overflow:hidden}.player-progress-bar-fill{height:100%;background:#06a94d;border-radius:3px;transition:width .3s ease}.player-wrapper{display:flex;flex:1 1;overflow:hidden}.video-section{flex:1 1;display:flex;flex-direction:column;overflow-y:auto;background-color:#0f172a;position:relative}.video-container{width:100%;aspect-ratio:16/9;background:#000;position:relative;z-index:10}.video-container iframe{width:100%;height:100%;display:block}.syllabus-sidebar{width:400px;background:#fff;border-left:1px solid #334155;display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto}.syllabus-header{padding:20px 24px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.lesson-list{background:#fff}.lesson-item:hover{background-color:#f8fafc}@media (max-width:1024px){.player-wrapper{flex-direction:column;overflow-y:auto}.course-player-container{height:auto;overflow:visible}.video-section{overflow:visible}.video-container{position:relative}.syllabus-sidebar{width:100%;height:auto;border-left:none;border-top:1px solid #e2e8f0}}@media (max-width:768px){.player-back-link span{display:none}.player-progress-bar-container{width:60px}.player-title{font-size:.9rem;max-width:140px}.player-navbar{padding:0 16px;gap:12px}}.mobile-menu-toggle{display:none;position:fixed;top:16px;left:16px;z-index:2000;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:8px 12px;font-size:24px;color:#1e293b;cursor:pointer;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}.sidebar-overlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.5);z-index:999;opacity:0;transition:opacity .3s ease}@media (max-width:768px){.mobile-menu-toggle{display:block}.sidebar{transform:translateX(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar.open{transform:translateX(0)}.sidebar-overlay.active{display:block;opacity:1}.main-content{margin-left:0!important}}@media (max-width:640px){.hide-on-mobile{display:none!important}.landing-nav{padding:16px 20px!important}.landing-nav>div:first-child i{font-size:32px!important}.landing-nav>div:last-child{gap:12px!important}.landing-nav a[href="/login"]{font-size:.9rem!important}}.mobile-categories{display:none}.desktop-categories{display:flex;gap:10px;flex-wrap:wrap}@media (max-width:768px){.mobile-categories{display:block;width:100%}.desktop-categories{display:none}}