:root{--primary:#8b5cf6;--primary-dark:#7c3aed;--primary-light:#a78bfa;--secondary:#c026d3;--bg-purple:#f6f3fd;--bg-purple-light:#efe9fb;--text-dark:#1a1425;--text-mid:#5c5468;--text-light:#8a8296;--white:#fff;--border:#eae6f5;--success:#16a34a;--warning:#f59e0b;--shadow-sm:0 2px 8px #8b3bf014;--shadow-md:0 8px 24px #8b3bf01f;--shadow-lg:0 16px 40px #8b3bf029;--radius-sm:12px;--radius-md:16px;--radius-lg:20px;--radius-xl:24px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}.landing-page{color:var(--text-dark);background:var(--white);-webkit-font-smoothing:antialiased;pointer-events:auto;min-height:100vh;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif;overflow-x:hidden}.landing-page a{color:inherit;text-decoration:none}.landing-page button{cursor:pointer;font-family:inherit}.container{max-width:100%;margin:0 auto;padding:0 1rem}@media (min-width:640px){.container{max-width:90rem;padding:0 1.5rem}}@media (min-width:1024px){.container{max-width:80rem;padding:0 2rem}}@media (min-width:1440px){.container{max-width:90rem}}.online-hero{background:radial-gradient(circle at 85% 10%,#e9defc 0%,#0000 45%),linear-gradient(#f5f0fd 0%,#ede4fb 100%);padding:80px 0 60px}.hero-grid{grid-template-columns:1fr;align-items:center;gap:2rem;display:grid}@media (min-width:768px){.hero-grid{grid-template-columns:1fr 1fr;gap:3rem}}@media (min-width:1024px){.hero-grid{gap:48px}}.hero-left{flex-direction:column;gap:24px;display:flex}.hero-badge{background:var(--white);color:var(--primary);box-shadow:var(--shadow-sm);border-radius:24px;align-items:center;gap:8px;width:fit-content;padding:8px 18px;font-size:13px;font-weight:700;display:inline-flex}.hero-title{letter-spacing:-1px;color:var(--text-dark);font-size:52px;font-weight:800;line-height:1.1}.gradient-text{background:linear-gradient(135deg,#8b3bf0,#c026d3);color:#0000;-webkit-background-clip:text;background-clip:text}.hero-subtitle{color:var(--text-mid);max-width:520px;font-size:16px;line-height:1.7}.search-bar{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);align-items:center;gap:8px;padding:4px;display:flex}.search-icon{color:var(--text-light);margin-left:12px}.search-input{color:var(--text-dark);border:none;outline:none;flex:1;padding:12px 8px;font-size:15px}.search-input::placeholder{color:var(--text-light)}.search-btn{color:var(--white);border-radius:var(--radius-sm);background:linear-gradient(135deg,#8b3bf0,#c026d3);padding:12px 24px;font-size:14px;font-weight:700;transition:all .2s}.search-btn:hover{opacity:.9}.popular-searches{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.popular-label{color:var(--text-mid);font-size:13px;font-weight:600}.search-tag{background:var(--bg-purple);color:var(--text-mid);border-radius:16px;padding:6px 14px;font-size:12px;font-weight:600;transition:all .2s}.search-tag:hover{background:var(--bg-purple-light);color:var(--primary)}.hero-buttons{gap:12px;display:flex}.btn-primary{color:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-md);background:linear-gradient(135deg,#8b3bf0,#c026d3);align-items:center;gap:8px;padding:14px 28px;font-size:15px;font-weight:700;transition:all .2s;display:inline-flex}.btn-primary:hover{opacity:.9;transform:translateY(-2px)}.btn-secondary{background:var(--white);color:var(--text-dark);border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-sm);align-items:center;gap:8px;padding:14px 28px;font-size:15px;font-weight:700;transition:all .2s;display:inline-flex}.btn-secondary:hover{background:var(--bg-purple);border-color:var(--primary)}.hero-right{justify-content:center;align-items:center;display:flex}.hero-illustration{aspect-ratio:1;width:100%;max-width:400px;height:auto;position:relative}.floating-card{background:var(--white);border-radius:var(--radius-md);width:80px;height:100px;box-shadow:var(--shadow-lg);justify-content:center;align-items:center;font-size:40px;animation:6s ease-in-out infinite float;display:flex;position:absolute}.card-1{animation-delay:0s;top:20%;left:10%}.card-2{animation-delay:1s;top:10%;right:15%}.card-3{animation-delay:2s;bottom:20%;left:20%}.card-4{animation-delay:3s;bottom:10%;right:10%}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.section-header{text-align:center;margin-bottom:48px}.section-title{letter-spacing:-.5px;color:var(--text-dark);margin-bottom:12px;font-size:36px;font-weight:800}.section-subtitle{color:var(--text-mid);font-size:16px}.category-section{padding:80px 0}.category-grid{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}@media (min-width:480px){.category-grid{grid-template-columns:repeat(3,1fr);gap:1.25rem}}@media (min-width:768px){.category-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.category-grid{grid-template-columns:repeat(5,1fr)}}@media (min-width:1280px){.category-grid{grid-template-columns:repeat(6,1fr);gap:1.25rem}}.category-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center;cursor:pointer;padding:24px;transition:all .3s}.category-card:hover{box-shadow:var(--shadow-md);border-color:var(--primary);transform:translateY(-4px)}.category-icon{background:var(--bg-purple);width:48px;height:48px;color:var(--primary);border-radius:var(--radius-sm);justify-content:center;align-items:center;margin:0 auto 16px;display:flex}.category-name{color:var(--text-dark);margin-bottom:8px;font-size:14px;font-weight:700}.category-count{color:var(--text-light);font-size:12px}.filters-section{background:var(--bg-purple);padding:32px 0}.filters-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;display:flex}.filter-group{align-items:center;gap:8px;display:flex}.filter-icon{color:var(--primary)}.filter-label{color:var(--text-dark);font-size:14px;font-weight:700}.filter-options{flex-wrap:wrap;gap:12px;display:flex}.filter-select{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-dark);background:var(--white);cursor:pointer;padding:10px 16px;font-size:14px;transition:all .2s}.filter-select:hover{border-color:var(--primary)}.filter-select:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #8b5cf61a}.courses-section{pointer-events:auto;padding:80px 0}.courses-grid{pointer-events:auto;grid-template-columns:1fr;gap:1.5rem;display:grid}@media (min-width:480px){.courses-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:768px){.courses-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.course-card{border:1px solid var(--border);background:var(--white);pointer-events:auto;border-radius:1.5rem;flex-direction:column;transition:all .2s;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000a}.course-card:hover{transform:translateY(-.25rem);box-shadow:0 8px 32px #00000014}.course-image{aspect-ratio:4/3;z-index:1;position:relative;overflow:hidden}.course-badge{text-transform:uppercase;letter-spacing:.05em;color:var(--primary);background:#fffffff2;border-radius:9999px;padding:.25rem .625rem;font-size:.625rem;font-weight:700;position:absolute;top:.75rem;left:.75rem;box-shadow:0 2px 8px #0000000a}.course-content{pointer-events:auto;z-index:2;flex-direction:column;flex:1;padding:1rem;display:flex;position:relative}.course-rating{align-items:center;gap:.25rem;font-size:.75rem;display:flex}.course-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.4rem;margin-top:.5rem;font-weight:700;line-height:1.2;display:-webkit-box;overflow:hidden}.course-instructor{color:#737373;margin-top:.25rem;font-size:.75rem}.course-price{align-items:baseline;gap:.5rem;margin-top:1rem;display:flex}.course-price-current{color:#0a0a0a;font-size:1.25rem;font-weight:900}.course-price-original{color:#737373;font-size:.875rem;text-decoration:line-through}.course-discount{color:#22c55e;background:#22c55e1a;border-radius:9999px;margin-left:auto;padding:.125rem .5rem;font-size:.625rem;font-weight:700}.enroll-btn{color:#fff;cursor:pointer;border:none;border-radius:9999px;flex:1;margin-top:0;padding:.625rem;font-size:.875rem;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #0000000a;background:#7c3aed!important}.enroll-btn:hover{box-shadow:0 4px 16px #8b5cf64d}.star-rating{align-items:center;gap:2px;display:flex}.course-actions{pointer-events:auto;z-index:5;align-items:stretch;gap:10px;margin-top:1.25rem;display:flex;position:relative}.view-btn{z-index:10;color:#fff;justify-content:center;align-items:center;text-decoration:none;display:inline-flex;position:relative;pointer-events:auto!important;cursor:pointer!important;background:#0ea5e9!important}.view-btn:hover{box-shadow:0 4px 16px #0ea5e94d}.btn-enroll{border-radius:var(--radius-sm);flex:1;padding:10px;font-size:13px;font-weight:700;color:var(--white)!important;background:#0f172a!important}.live-classes-section{background:var(--bg-purple);padding:80px 0}.live-classes-grid{grid-template-columns:1fr;gap:1.5rem;display:grid}@media (min-width:480px){.live-classes-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:768px){.live-classes-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.live-class-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;transition:all .3s}.live-class-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.live-class-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.live-badge{color:#ef4444;background:#ef44441a;border-radius:6px;align-items:center;gap:4px;padding:6px 12px;font-size:11px;font-weight:700;display:flex}.seats-left{color:var(--warning);align-items:center;gap:4px;font-size:12px;font-weight:600;display:flex}.live-class-name{color:var(--text-dark);margin-bottom:8px;font-size:16px;font-weight:700}.live-class-faculty{color:var(--text-mid);margin-bottom:16px;font-size:13px}.live-class-schedule{gap:16px;margin-bottom:16px;display:flex}.schedule-item{color:var(--text-mid);align-items:center;gap:6px;font-size:12px;display:flex}.schedule-item svg{color:var(--primary)}.btn-join-live{width:100%;color:var(--white);border-radius:var(--radius-sm);background:linear-gradient(135deg,#8b3bf0,#c026d3);justify-content:center;align-items:center;gap:8px;padding:12px;font-size:14px;font-weight:700;transition:all .2s;display:flex}.btn-join-live:hover{opacity:.9}.educators-section{background:linear-gradient(#fafafa 0%,#f5f5f5 100%);padding:80px 0}.educators-grid{grid-template-columns:1fr;gap:1.5rem;display:grid}@media (min-width:480px){.educators-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:640px){.educators-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:1024px){.educators-grid{grid-template-columns:repeat(4,1fr);gap:1.5rem}}.educator-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;padding:24px;transition:all .3s;position:relative;overflow:hidden}.educator-card:before{content:"";opacity:0;background:linear-gradient(135deg,#8b3bf0,#c026d3);height:4px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.educator-card:hover{border-color:var(--primary);transform:translateY(-8px);box-shadow:0 12px 32px #8b3bf026}.educator-card:hover:before{opacity:1}.educator-photo{border:3px solid var(--white);background:linear-gradient(135deg,#f6f3fd 0%,#efe9fb 100%);border-radius:50%;justify-content:center;align-items:center;width:96px;height:96px;margin:0 auto 20px;font-size:48px;transition:transform .3s;display:flex;box-shadow:0 4px 16px #8b3bf026}.educator-card:hover .educator-photo{transform:scale(1.1)}.educator-name{color:var(--text-dark);margin-bottom:6px;font-size:18px;font-weight:800;line-height:1.2}.educator-subject{color:var(--primary);background:var(--bg-purple);border-radius:20px;margin-bottom:20px;padding:6px 16px;font-size:14px;font-weight:600;display:inline-block}.educator-meta{flex-direction:column;gap:12px;margin-bottom:20px;display:flex}.educator-meta .meta-item{color:var(--text-mid);justify-content:center;align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.educator-meta .meta-item svg{color:var(--primary);width:16px;height:16px}.educator-rating{background:#fefce8;border-radius:20px;justify-content:center;align-items:center;gap:6px;margin-bottom:20px;padding:8px 16px;display:inline-flex}.educator-rating svg{color:#f59e0b;width:16px;height:16px}.educator-rating span{color:#92400e;font-size:14px;font-weight:700}.btn-view-profile{border:2px solid var(--primary);border-radius:var(--radius-sm);width:100%;color:var(--primary);cursor:pointer;background:0 0;padding:12px;font-size:14px;font-weight:700;transition:all .2s}.btn-view-profile:hover{color:var(--white);background:linear-gradient(135deg,#8b3bf0,#c026d3);border-color:#0000;transform:translateY(-2px);box-shadow:0 4px 16px #8b3bf04d}.why-choose-section{background:var(--bg-purple);padding:80px 0}.features-grid{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}@media (min-width:480px){.features-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width:768px){.features-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width:1024px){.features-grid{grid-template-columns:repeat(5,1fr);gap:1.25rem}}.feature-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center;padding:24px;transition:all .3s}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.feature-icon{background:var(--bg-purple);width:48px;height:48px;color:var(--primary);border-radius:var(--radius-sm);justify-content:center;align-items:center;margin:0 auto 16px;display:flex}.feature-title{color:var(--text-dark);margin-bottom:8px;font-size:14px;font-weight:700}.feature-desc{color:var(--text-mid);font-size:12px;line-height:1.4}.success-section{padding:80px 0}.success-grid{grid-template-columns:1fr;gap:1.5rem;display:grid}@media (min-width:480px){.success-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:768px){.success-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.success-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px}.success-header{align-items:center;gap:12px;margin-bottom:16px;display:flex}.success-avatar{background:var(--bg-purple);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:24px;display:flex}.success-info{flex:1}.success-name{color:var(--text-dark);margin-bottom:4px;font-size:15px;font-weight:700}.success-exam{color:var(--text-mid);font-size:12px}.success-course{color:var(--primary);align-items:center;gap:8px;margin-bottom:12px;font-size:12px;font-weight:600;display:flex}.success-review{color:var(--text-mid);font-size:14px;font-style:italic;line-height:1.6}.learning-process-section{background:var(--bg-purple);padding:80px 0}.process-steps{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid;position:relative}@media (min-width:480px){.process-steps{grid-template-columns:repeat(3,1fr)}}@media (min-width:640px){.process-steps{grid-template-columns:repeat(4,1fr)}}@media (min-width:768px){.process-steps{grid-template-columns:repeat(5,1fr)}}@media (min-width:1024px){.process-steps{grid-template-columns:repeat(7,1fr);gap:1rem}}.process-step{text-align:center;position:relative}.step-number{width:32px;height:32px;color:var(--white);background:linear-gradient(135deg,#8b3bf0,#c026d3);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 12px;font-size:14px;font-weight:800;display:flex}.step-icon{background:var(--white);width:48px;height:48px;color:var(--primary);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);justify-content:center;align-items:center;margin:0 auto 12px;display:flex}.step-title{color:var(--text-dark);margin-bottom:8px;font-size:13px;font-weight:700}.step-desc{color:var(--text-mid);font-size:11px;line-height:1.4}.step-connector{background:var(--primary);width:16px;height:2px;position:absolute;top:24px;right:-8px}.faq-section{padding:80px 0}.faq-list{flex-direction:column;gap:12px;max-width:800px;margin:0 auto;display:flex}.faq-item{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.faq-question{background:var(--white);width:100%;color:var(--text-dark);text-align:left;justify-content:space-between;align-items:center;gap:16px;padding:20px;font-size:15px;font-weight:600;transition:all .2s;display:flex}.faq-question:hover{background:var(--bg-purple)}.faq-question.active{background:var(--bg-purple-light)}.faq-chevron{color:var(--text-light);flex-shrink:0;transition:transform .3s}.faq-chevron.rotate{transform:rotate(180deg)}.faq-answer{border-top:1px solid var(--border);padding:0 20px 20px}.faq-answer p{color:var(--text-mid);padding-top:16px;font-size:14px;line-height:1.6}.cta-section{padding:80px 0}.cta-banner{border-radius:var(--radius-xl);text-align:center;background:linear-gradient(135deg,#8b3bf0 0%,#c026d3 100%);padding:64px}.cta-title{color:var(--white);margin-bottom:16px;font-size:40px;font-weight:800;line-height:1.2}.cta-subtitle{color:#ffffffe6;margin-bottom:32px;font-size:18px;line-height:1.6}.cta-buttons{justify-content:center;gap:16px;display:flex}.cta-buttons .btn-primary{background:var(--white);color:var(--primary)}.cta-buttons .btn-secondary{color:var(--white);background:0 0;border-color:#ffffff80}.cta-buttons .btn-secondary:hover{border-color:var(--white);background:#ffffff1a}@media (max-width:1440px){.container{max-width:1200px}.hero-title{font-size:48px}.category-grid{grid-template-columns:repeat(5,1fr)}.courses-grid,.live-classes-grid{gap:20px}}@media (max-width:1366px){.container{max-width:1100px}.category-grid{grid-template-columns:repeat(4,1fr)}}@media (max-width:1200px){.container{max-width:960px;padding:0 24px}.hero-title{font-size:44px}.category-grid{grid-template-columns:repeat(3,1fr)}.courses-grid,.live-classes-grid{grid-template-columns:repeat(2,1fr);gap:18px}.educators-grid,.features-grid{grid-template-columns:repeat(3,1fr)}.process-steps{grid-template-columns:repeat(4,1fr)}}@media (max-width:1024px){.hero-grid{grid-template-columns:1fr;gap:40px}.hero-right{display:none}.filters-bar{flex-direction:column;align-items:flex-start}.filter-options{width:100%}.filter-select{flex:1}}@media (max-width:768px){.container{max-width:100%;padding:0 20px}.online-hero{padding:60px 0 40px}.hero-title{font-size:36px}.hero-subtitle{font-size:14px}.hero-buttons{flex-direction:column}.search-bar{flex-direction:column;padding:12px}.search-btn{width:100%}.category-grid{grid-template-columns:repeat(2,1fr);gap:16px}.courses-grid,.live-classes-grid,.success-grid{grid-template-columns:1fr;gap:16px}.educators-grid,.features-grid,.process-steps{grid-template-columns:repeat(2,1fr)}.step-connector{display:none}.section-header{margin-bottom:32px}.section-title{font-size:28px}.section-subtitle{font-size:14px}.cta-banner{padding:48px 24px}.cta-title{font-size:32px}.cta-buttons{flex-direction:column}}@media (max-width:640px){.container{padding:0 16px}.online-hero{padding:48px 0 32px}.hero-title{font-size:28px}.hero-subtitle{font-size:13px}.category-grid{grid-template-columns:repeat(2,1fr)}.course-card{border-radius:var(--radius-md)}.course-content{padding:16px}.course-title{font-size:14px}.course-actions{flex-direction:column}.btn-view,.btn-enroll{width:100%}.educators-grid,.features-grid,.process-steps{grid-template-columns:1fr}.cta-title{font-size:24px}.cta-subtitle{font-size:16px}}@media (max-width:480px){.container{padding:0 12px}.online-hero{padding:40px 0 28px}.hero-title{font-size:24px}.hero-subtitle{font-size:12px}.hero-badge{padding:6px 14px;font-size:11px}.hero-buttons{gap:10px}.btn-primary,.btn-secondary{padding:12px 20px;font-size:14px}.search-bar{padding:10px}.category-grid{grid-template-columns:repeat(2,1fr);gap:12px}.category-card{padding:16px}.category-icon{width:40px;height:40px}.category-name{font-size:13px}.courses-grid{gap:16px}.course-card{border-radius:var(--radius-sm)}.course-content{padding:14px}.course-title{font-size:13px}.course-price-current{font-size:1.1rem}.enroll-btn{padding:.5rem;font-size:.8rem}.live-class-card{padding:20px}.live-class-name{font-size:14px}.live-class-schedule{flex-direction:column;gap:8px}.educator-card{padding:20px}.educator-photo{width:64px;height:64px;font-size:32px}.educator-name{font-size:14px}.feature-card{padding:20px}.feature-icon{width:40px;height:40px}.success-card{padding:20px}.success-avatar{width:40px;height:40px;font-size:20px}.success-name{font-size:14px}.faq-question{padding:16px;font-size:14px}.faq-answer p{font-size:13px}.cta-banner{padding:40px 20px}.cta-title{font-size:20px}.cta-subtitle{font-size:14px}}