.navbar{position:relative;z-index:1}
.navbar:before{left:50%;right:auto;width:100vw;height:100%;transform:translateX(-50%);z-index:-1;background:#0b1020}
.navbar>*{position:relative;z-index:1}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#f8fafc,#eef2ff)}
.auth-page-card{width:min(430px,100%);padding:38px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 25px 70px #0b10201c}
.auth-page-card .auth-brand{display:flex;align-items:center;gap:9px;color:var(--ink);font:700 14px var(--font-display);letter-spacing:.12em}
.auth-page-card .auth-heading{margin:34px 0 25px}
.auth-page-card .auth-heading h1{margin:0;font:700 29px var(--font-display);letter-spacing:-.04em}
.auth-page-card .auth-heading p{margin:8px 0 0;color:var(--muted);font-size:13px}
.auth-form{display:flex;flex-direction:column;gap:15px}
.auth-success{margin:0 0 15px;padding:12px 14px;border:1px solid #bbf7d0;border-radius:8px;background:#f0fdf4;color:#166534;font-size:12px}
.auth-form label{color:var(--ink);font-size:12px;font-weight:700}
.auth-form input{display:block;width:100%;margin-top:7px;padding:12px 13px;border:1px solid var(--line);border-radius:8px;outline:0;color:var(--ink);font-size:13px}
.auth-form input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #635bff18}
.auth-form .form-error{min-height:0;margin:0;color:#dc5360;font-size:11px}
.auth-form .button-submit{width:100%;padding:13px;margin-top:5px}
.auth-page-card .auth-switch{text-align:center;margin:22px 0 0;color:var(--muted);font-size:12px}
.auth-page-card .auth-switch a{color:var(--purple);font-weight:700}
.dashboard-page{min-height:100vh;display:grid;place-items:center;background:var(--wash)}
.dashboard-page .dashboard-selection{display:flex;flex-direction:column;gap:14px;width:min(340px,calc(100% - 40px))}
.dashboard-page .dashboard-option{display:block;padding:20px 24px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:600 18px var(--font-display);text-align:left;box-shadow:0 10px 25px #0b10200a;transition:.2s}
.dashboard-page .dashboard-option:hover,.dashboard-page .dashboard-option-active{border-color:var(--purple);color:var(--purple);box-shadow:0 10px 25px #635bff1c}
.dashboard-page .dashboard-option-active{background:#f0efff}
@media(max-width:460px){.auth-page-card{padding:30px 24px}}
.learning-page{min-height:100vh;background:var(--wash)}
.app-header{height:76px;padding:0 max(28px,calc((100% - 1180px)/2));display:flex;align-items:center;gap:48px;background:var(--nav);color:#fff}
.auth-check-status{padding:48px 16px;text-align:center;color:var(--muted)}
.app-brand{display:flex;align-items:center;gap:10px;font:700 16px var(--font-display);letter-spacing:.14em}
.app-header nav{display:flex;gap:26px;color:#94a3b8;font-size:13px}.app-header nav a:hover,.app-header nav .nav-current{color:#fff}
.header-user{display:flex;align-items:center;gap:18px;margin-left:auto;color:#cbd5e1;font-size:12px}.header-user .button{padding:8px 12px;font-size:12px}
.dashboard-content,.detail-content,.learning-content{width:min(1100px,calc(100% - 48px));margin:0 auto}
.dashboard-hero{display:flex;align-items:end;justify-content:space-between;padding:70px 0 58px;border-bottom:1px solid var(--line)}.dashboard-hero h1{margin:14px 0 10px;font:700 clamp(36px,5vw,58px) var(--font-display);letter-spacing:-.06em}.dashboard-hero>div>p:last-child{margin:0;color:var(--muted)}
.course-section{padding:62px 0}.section-title{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px}.section-title h2{margin:9px 0 0;font:700 30px var(--font-display);letter-spacing:-.04em}.section-title .eyebrow{margin:0}.status-label,.course-level{color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.course-tile{display:flex;flex-direction:column;align-items:flex-start;padding:20px;border:1px solid var(--line);border-radius:15px;background:#fff}.course-art{display:grid;place-items:center;width:100%;height:135px;border-radius:11px;color:#fff;font-size:47px}.art-purple{background:linear-gradient(135deg,#7068ff,#b5a9ff)}.art-cyan{background:linear-gradient(135deg,#12bdd4,#b2f3f3)}.art-dark{background:linear-gradient(135deg,#0b1020,#475569)}.course-tile .course-level{margin:22px 0 8px;font-size:10px}.course-tile h3{margin:0 0 9px;font:600 19px var(--font-display)}.course-tile>p:not(.course-level):not(.progress-copy){margin:0 0 20px;color:var(--muted);font-size:13px;line-height:1.5}.course-tile .button{margin-top:auto;padding:10px 14px;font-size:12px}.empty-state{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:28px;border:1px dashed #cbd5e1;border-radius:15px;background:#fff}.empty-state strong{font:600 18px var(--font-display)}.empty-state span{color:var(--muted);font-size:13px;margin-bottom:12px}.mini-progress{width:100%;height:7px;margin:8px 0 4px;border-radius:99px;background:#edf0f7}.mini-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--purple),var(--cyan))}.progress-copy{color:var(--muted);font-size:11px;margin:0 0 17px}
.course-price{margin:0 0 16px;color:var(--purple);font:700 22px var(--font-display)}
.access-message{margin:28px 0 0;padding:13px 16px;border:1px solid #ddd9ff;border-radius:10px;background:#f7f6ff;color:var(--purple);font-size:13px}
.course-lesson-heading{max-width:780px;margin:55px 0 28px}.course-lesson-heading h1{margin:13px 0;font:700 clamp(36px,6vw,66px)/1.04 var(--font-display);letter-spacing:-.06em}.course-lesson-heading p:not(.eyebrow){max-width:650px;color:var(--muted);font-size:16px;line-height:1.65}
.protected-video{min-height:390px;padding:35px;display:flex;flex-direction:column;justify-content:end;border-radius:18px;background:linear-gradient(145deg,#0b1020,#303b6b);color:#fff;box-shadow:0 24px 55px #0b102022}.protected-video>span{display:grid;place-items:center;width:62px;height:62px;margin-bottom:auto;border-radius:50%;background:var(--purple);font-size:22px}.protected-video h2{margin:0 0 8px;font:600 25px var(--font-display)}.protected-video p{margin:0;color:#cbd5e1;font-size:13px}.course-materials{max-width:680px;margin-top:24px}.course-materials ol{margin:18px 0 0;padding-left:22px;color:var(--muted);line-height:2;font-size:14px}
.detail-content,.learning-content{padding:43px 0 80px}.back-link{color:var(--muted);font-size:13px}.detail-layout,.learning-layout{display:grid;grid-template-columns:1fr 380px;gap:80px;align-items:start;margin-top:70px}.detail-layout h1{max-width:600px;margin:15px 0 18px;font:700 clamp(40px,6vw,70px)/1.03 var(--font-display);letter-spacing:-.06em}.detail-description{max-width:520px;color:var(--muted);font-size:17px;line-height:1.65;margin-bottom:30px}.lesson-card{padding:26px;border:1px solid var(--line);border-radius:15px;background:#fff}.lesson-card ul{list-style:none;padding:0;margin:20px 0 0}.lesson-card li{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid #f1f5f9;color:var(--ink);font-size:13px}.lesson-card li:last-child{border-bottom:0}.lesson-card li span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#f0efff;color:var(--purple);font-size:11px}.lesson-card li b{margin-left:auto;color:#94a3b8;font-size:10px;font-weight:500}.video-placeholder{min-height:430px;padding:40px;display:flex;flex-direction:column;justify-content:end;border-radius:18px;background:linear-gradient(145deg,#0b1020,#272c4c);color:#fff}.video-placeholder>span{display:grid;place-items:center;width:62px;height:62px;margin-bottom:auto;border-radius:50%;background:var(--purple);font-size:22px}.video-placeholder h1{margin:0 0 8px;font:600 30px var(--font-display)}.video-placeholder p{margin:0;color:#cbd5e1;font-size:13px}.lesson-active{background:#f8f7ff;border-radius:8px;padding-left:10px!important}.learning-content .lesson-card .button{width:100%;margin-top:20px}.certificate-content{display:flex;flex-direction:column;align-items:center;gap:25px;padding:70px 24px}.certificate{width:min(720px,100%);padding:70px 40px;text-align:center;border:10px solid #e8e6ff;outline:1px solid var(--purple);background:#fff;box-shadow:0 20px 50px #0b102012}.certificate h1{margin:12px 0 35px;font:700 48px var(--font-display);letter-spacing:-.05em}.certificate h2{margin:12px 0 26px;font:600 29px var(--font-display)}.certificate h3{margin:14px 0 28px;font:600 22px var(--font-display);color:var(--purple)}.certificate p:not(.eyebrow),.certificate small{color:var(--muted);font-size:13px}.certificate-line{width:160px;margin:0 auto 22px;border-top:1px solid var(--line)}
@media(max-width:760px){.app-header{padding:0 20px;gap:20px}.app-header nav{display:none}.header-user span{display:none}.dashboard-content,.detail-content,.learning-content{width:min(100% - 32px,600px)}.dashboard-hero{display:block;padding:48px 0}.course-grid,.detail-layout,.learning-layout{grid-template-columns:1fr;gap:25px}.detail-layout{margin-top:45px}.course-section{padding:40px 0}.certificate{padding:45px 20px}}

/* Landing polish and responsive navigation */
.landing-view{background:radial-gradient(circle at 85% 18%,#eeecff 0,transparent 28%),var(--wash)}
.navbar{height:88px}.navbar:before{height:88px}
.navbar .brand,.app-brand{letter-spacing:.16em}.brand-mark{box-shadow:0 8px 18px #635bff55}
.nav-links a{position:relative}.nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:2px;background:var(--cyan);transition:right .2s}.nav-links a:hover:after{right:0}
.hero{min-height:650px;padding-top:76px}.hero-copy{position:relative;z-index:1}.hero h1{font-size:clamp(44px,6.5vw,78px)}.hero-description{font-size:16px}
.hero-visual:before{content:"";position:absolute;inset:7% 3%;border-radius:50%;background:#fff8;filter:blur(30px)}.learning-card{box-shadow:0 30px 70px #332d8d24}.floating-note,.floating-stat{animation:float-in 4s ease-in-out infinite}.floating-note{animation-delay:-1.5s}
@keyframes float-in{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.section{padding:100px 0}.feature-card{box-shadow:0 12px 30px #1e293b08}.feature-card-dark{box-shadow:0 18px 35px #0b10202e}
.quote-section{background:linear-gradient(135deg,#0b1020,#202854)}.footer{position:relative;isolation:isolate;padding-top:35px;padding-bottom:35px}.footer:before{content:"";position:absolute;top:0;bottom:0;left:50%;z-index:-1;width:100vw;transform:translateX(-50%);background:#0b1020}
.dashboard-content,.detail-content,.learning-content{max-width:1140px}.dashboard-hero{padding-top:78px}.course-tile,.lesson-card,.auth-page-card{box-shadow:0 16px 40px #0b10200a;transition:transform .25s,box-shadow .25s}.course-tile:hover,.lesson-card:hover{transform:translateY(-4px);box-shadow:0 20px 45px #0b102014}
.course-art{position:relative;overflow:hidden}.course-art:after{content:"";position:absolute;width:130px;height:130px;right:-45px;bottom:-58px;border:1px solid #fff8;border-radius:50%;box-shadow:0 0 0 18px #fff1,0 0 0 36px #fff1}

@media(max-width:760px){
  .navbar{height:72px}.navbar:before{height:72px}.navbar .nav-links{display:none}.navbar .nav-actions{display:none}.mobile-menu{display:block;padding:8px;font-size:0}.mobile-menu:after{content:"☰";font-size:24px}
  .navbar.menu-open{z-index:20}.navbar.menu-open:after{content:"";position:fixed;inset:0;background:#0b102099;z-index:-2}
  .navbar.menu-open .nav-links,.navbar.menu-open .nav-actions{display:flex;position:fixed;left:16px;right:16px;z-index:10;flex-direction:column;align-items:stretch;gap:4px;padding:18px;border:1px solid #ffffff20;border-radius:18px;background:#111830;box-shadow:0 24px 60px #0b102066}
  .navbar.menu-open .nav-links{top:82px}.navbar.menu-open .nav-actions{top:211px;flex-direction:row}.navbar.menu-open .nav-links a{padding:14px 12px;color:#fff;font-size:16px}.navbar.menu-open .nav-links a:after{display:none}.navbar.menu-open .nav-actions .button{flex:1}.navbar.menu-open .mobile-menu:after{content:"×"}
  .hero{grid-template-columns:1fr;gap:30px;min-height:auto;padding:55px 0 70px}.hero h1{font-size:clamp(43px,13vw,65px)}.hero-description{font-size:15px}.hero-actions{align-items:stretch;flex-direction:column;gap:14px}.hero-actions .button{width:100%}.play-button{justify-content:center}.social-proof{margin-top:32px}.hero-visual{min-height:370px}.learning-card{width:calc(100% - 25px);padding:20px}.floating-stat{left:-4px;top:55px}.floating-note{right:-4px;bottom:35px}
  .section{padding:72px 0}.section-heading{display:block}.section-heading h2{font-size:36px}.section-heading p{margin-top:15px}.feature-grid{grid-template-columns:1fr}.feature-card{min-height:250px}.quote-inner{padding-top:70px;padding-bottom:70px}.footer{flex-wrap:wrap;gap:20px}
}

/* Keep the testimonial light and easy to read. */
.quote-section{background:#fff;color:var(--ink)}
.quote-section blockquote{color:var(--ink)}
.quote-section .quote-mark{color:var(--purple)}
.quote-section .quote-author strong{color:var(--ink)}
.quote-section .quote-author span{color:var(--muted)}
