:root{--primary-color: #646cff;--primary-hover: #535bf2;--secondary-color: #10b981;--accent-color: #f59e0b;--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-dark: #1e293b;--text-primary: #1e293b;--text-secondary: #64748b;--text-light: #94a3b8;--border-color: #e2e8f0;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.6;font-weight:400;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[data-theme=dark]{--bg-primary: #0f172a;--bg-secondary: #1e293b;--text-primary: #f1f5f9;--text-secondary: #cbd5e1;--text-light: #94a3b8;--border-color: #334155;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .3);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .4), 0 2px 4px -2px rgb(0 0 0 / .4);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .5), 0 4px 6px -4px rgb(0 0 0 / .5);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .6), 0 8px 10px -6px rgb(0 0 0 / .6)}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}#app{max-width:100%;margin:0;padding:0;text-align:left}.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}.header{background-color:var(--bg-primary);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:100}.nav{padding:1rem 0}.nav .container{display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.875rem;font-weight:700;color:var(--primary-color);letter-spacing:-.025em}.logo-tagline{font-size:.875rem;font-weight:400;color:var(--text-secondary);letter-spacing:0;margin-left:.5rem}.nav-links{display:flex;list-style:none;gap:2rem;align-items:center}.nav-links a{color:var(--text-primary);text-decoration:none;font-weight:500;transition:color .2s ease}.nav-links a:hover{color:var(--primary-color)}.language-btn,.theme-btn{background-color:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);padding:.5rem;border-radius:var(--radius-md);font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.language-btn{padding:.5rem 1rem}.theme-btn{min-width:42px;height:42px}.language-btn:hover,.theme-btn:hover{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.theme-icon{font-size:1.125rem}.hero{background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);padding:6rem 0;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:0;right:0;width:50%;height:100%;background:radial-gradient(circle at 100% 50%,rgba(100,108,255,.1) 0%,transparent 70%);pointer-events:none}.hero .container{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}.hero-content h1{font-size:3.5rem;font-weight:800;line-height:1.1;color:var(--text-primary);margin-bottom:1.5rem;letter-spacing:-.025em}.hero-content p{font-size:1.25rem;color:var(--text-secondary);margin-bottom:2.5rem;line-height:1.6}.cta-btn{background-color:var(--primary-color);color:#fff;border:none;padding:1rem 2rem;font-size:1.125rem;font-weight:600;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-md)}.cta-btn:hover{background-color:var(--primary-hover);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.hero-visual{display:flex;justify-content:center;align-items:center}.code-animation{background-color:var(--bg-dark);color:#f8fafc;padding:2rem;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem;line-height:1.8;overflow:hidden;position:relative}.code-animation:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,transparent 0%,rgba(30,41,59,.8) 100%);pointer-events:none}.code-line{opacity:0;animation:fadeInUp .5s ease forwards;position:relative;z-index:1}.code-line:nth-child(1){animation-delay:.1s}.code-line:nth-child(2){animation-delay:.2s}.code-line:nth-child(3){animation-delay:.3s}.code-line:nth-child(4){animation-delay:.4s}.code-line:nth-child(5){animation-delay:.5s}.code-line:nth-child(6){animation-delay:.6s}.code-line:nth-child(7){animation-delay:.7s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.courses{padding:6rem 0;background-color:var(--bg-primary)}.courses h2{font-size:2.5rem;font-weight:700;text-align:center;color:var(--text-primary);margin-bottom:3rem;letter-spacing:-.025em}.courses-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}.course-card{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:2rem;text-align:center;transition:all .3s ease;box-shadow:var(--shadow-sm);filter:grayscale(100%);opacity:.7}.course-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl);border-color:var(--primary-color)}.course-icon{width:4rem;height:4rem;display:flex;justify-content:center;align-items:center;margin:0 auto 1.5rem;border-radius:var(--radius-full);font-size:1.5rem;font-weight:700}.js-icon{background:linear-gradient(135deg,#f7df1e,#eab308);color:#111827}.react-icon{background:linear-gradient(135deg,#61dafb,#2563eb);color:#fff}.vue-icon{background:linear-gradient(135deg,#42b883,#35495e);color:#fff}.node-icon{background:linear-gradient(135deg,#393,#2ecc71);color:#fff}.bun-icon{background:linear-gradient(135deg,#f66f6f,#e74c3c);color:#fff}.course-card.bun-card{filter:grayscale(0);opacity:1}.python-icon{background:linear-gradient(135deg,#3776ab,#4b8bbe);color:#fff}.java-icon{background:linear-gradient(135deg,#007396,#0056b3);color:#fff}.mysql-icon{background:linear-gradient(135deg,#4479a1,#2c5282);color:#fff}.course-card h3{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0}.coming-soon{background-color:var(--bg-secondary);border:2px dashed var(--accent-color);border-radius:var(--radius-lg);padding:2rem;text-align:center;margin-top:3rem;animation:pulse 2s infinite}.coming-soon p{font-size:1.25rem;font-weight:600;color:var(--accent-color);margin:0}@keyframes pulse{0%,to{box-shadow:0 0 #f59e0b66}50%{box-shadow:0 0 0 10px #f59e0b00}}.features{padding:6rem 0;background-color:var(--bg-secondary)}.features h2{font-size:2.5rem;font-weight:700;text-align:center;color:var(--text-primary);margin-bottom:3rem;letter-spacing:-.025em}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.5rem}.feature-card{background-color:var(--bg-primary);padding:2.5rem;border-radius:var(--radius-lg);text-align:center;box-shadow:var(--shadow-sm);transition:all .3s ease;border:1px solid var(--border-color)}.feature-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.feature-icon{font-size:3rem;margin-bottom:1.5rem}.feature-card h3{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem}.feature-card p{color:var(--text-secondary);line-height:1.6}.footer{background-color:var(--bg-dark);color:#fff;padding:3rem 0 1.5rem}.footer-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.footer-logo{font-size:1.875rem;font-weight:700;color:#fff}.footer-links{display:flex;gap:2rem}.footer-links a{color:var(--text-light);text-decoration:none;transition:color .2s ease}.footer-links a:hover{color:var(--primary-color)}.copyright{color:var(--text-light);font-size:.875rem;margin-top:1rem}@media(max-width:1024px){.hero .container{grid-template-columns:1fr;text-align:center}.hero-content h1{font-size:2.75rem}.hero-visual{order:-1}.courses-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media(max-width:768px){.nav-links{gap:1rem}.hero{padding:4rem 0}.hero-content h1{font-size:2.25rem}.hero-content p{font-size:1.125rem}.courses,.features{padding:4rem 0}.courses h2,.features h2{font-size:2rem}.courses-grid,.features-grid{grid-template-columns:1fr;gap:1.5rem}.footer-links{flex-direction:column;gap:.75rem;text-align:center}}@media(max-width:640px){.nav .container{flex-direction:column;gap:1rem}.nav-links{flex-wrap:wrap;justify-content:center}.hero-content h1{font-size:2rem}.cta-btn{padding:.875rem 1.5rem;font-size:1rem}}