:root{--primary-blue:#1E88E5;--primary-orange:#FF6B35;--primary-gray:#2C2C2C;--light-blue:#E3F2FD;--light-orange:#FFF3E0;--light-gray:#F5F5F5;--white:#FFFFFF;--success:#4CAF50;--error:#F44336}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:var(--primary-gray);background:var(--white)}
.klc-header{background:linear-gradient(135deg,var(--primary-blue),var(--primary-orange));color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.1)}
.klc-header-inner{max-width:1200px;margin:0 auto;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.klc-logo h1{font-size:1.6rem;margin:0}.klc-logo .motto{margin:0;opacity:.9;font-style:italic;font-size:.9rem}
.klc-nav{display:flex;gap:.75rem;align-items:center}
.klc-nav a{color:#fff;text-decoration:none;padding:.5rem 1rem;border-radius:6px}
.klc-nav a:hover{background-color:rgba(255,255,255,.18)}
.klc-container{max-width:1200px;margin:0 auto;padding:2rem}
.course-hero{background:linear-gradient(135deg,var(--light-blue),var(--light-orange));border-radius:16px;padding:2rem;text-align:center;box-shadow:0 5px 16px rgba(0,0,0,.08)}
.course-hero h1{margin:.25rem 0 1rem 0;font-size:2.2rem}
.course-stats{display:flex;justify-content:center;gap:2.5rem;margin-top:1.5rem;flex-wrap:wrap}
.stat{text-align:center}.stat-number{font-size:1.8rem;font-weight:700;color:var(--primary-blue)}.stat-label{color:#666}
.card{background:#fff;border-radius:12px;box-shadow:0 3px 12px rgba(0,0,0,.08)}.card .card-body{padding:1.25rem}
.grid{display:grid;gap:1rem}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.grid.cols-3,.grid.cols-2{grid-template-columns:1fr}}
.btn{display:inline-block;padding:.7rem 1.2rem;border-radius:8px;border:none;cursor:pointer;text-decoration:none;font-weight:600;transition:.2s}
.btn-primary{background:var(--primary-blue);color:#fff}.btn-primary:hover{background:#1976D2;transform:translateY(-1px)}
.btn-success{background:var(--success);color:#fff}.btn-outline{background:transparent;border:2px solid var(--primary-blue);color:var(--primary-blue)}.btn-outline:hover{background:var(--primary-blue);color:#fff}
.lesson-header{background:linear-gradient(135deg,var(--primary-blue),var(--primary-orange));color:#fff;padding:2rem;text-align:center;border-radius:12px 12px 0 0}
.lesson-media{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.25rem 0}
@media(max-width:900px){.lesson-media{grid-template-columns:1fr}}
.lesson-media img, .lesson-media iframe{width:100%;border-radius:10px;box-shadow:0 3px 10px rgba(0,0,0,.08)}
.lesson-content{background:#fff;border-radius:0 0 12px 12px;box-shadow:0 3px 12px rgba(0,0,0,.08)}
.lesson-content .inner{padding:1.5rem}
.lesson-content h2{margin:1rem 0 .5rem}.lesson-content h3{margin:1rem 0 .5rem}
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:900px){.comparison{grid-template-columns:1fr}}
.comparison-item{background:var(--light-gray);padding:1rem;border-radius:8px}
.activity{background:var(--light-orange);padding:1rem;border-radius:8px;margin:1rem 0;border-left:4px solid var(--primary-orange)}
.quiz{margin-top:1rem;padding:1.25rem;background:#fafafa;border:1px solid #eee;border-radius:10px}
.quiz .q{margin:1rem 0}.quiz .opts label{display:block;background:#fff;border:1px solid #e5e5e5;border-radius:6px;padding:.6rem .8rem;margin:.4rem 0;cursor:pointer}
.result{margin-top:.75rem;font-weight:700}
.footer{background:var(--primary-gray);color:#fff;text-align:center;padding:2rem;margin-top:2rem}