/* Individual course pages: shared brand colors, Space Grotesk headings and Inter copy. */
html:has(body[data-page="course-detail"]){scroll-padding-top:180px}
body[data-page="course-detail"] .page-shell{overflow:clip}
body[data-page="course-detail"] .courses-dropdown a[aria-current="page"]{color:var(--purple);background:var(--purple-soft)}
.course-breadcrumbs{padding:22px 12px 28px;flex-wrap:wrap;row-gap:6px}
.course-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:56px;align-items:center;padding:24px 12px 48px}
.course-hero h1{font:600 80px/1.05 var(--font-heading);letter-spacing:-.045em;margin-top:20px}
.course-hero h1>span{display:block;color:var(--purple)}
.course-promise{font:400 var(--type-lead-size)/var(--type-lead-line) var(--font-body);color:var(--text-secondary);margin-top:24px;max-width:44ch}
.course-key-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:32px 0 0;padding:0;gap:20px}
.course-key-facts>div{display:flex;flex-direction:column;gap:6px;min-width:0}
.course-key-facts>div+div{padding-left:20px;border-left:1px solid var(--border-subtle)}
.course-key-facts dt{font:400 var(--type-small-size)/var(--type-small-line) var(--font-body);color:var(--muted)}
.course-key-facts dd{order:-1;margin:0;font:600 40px/48px var(--font-heading);letter-spacing:-.035em;font-variant-numeric:tabular-nums;white-space:nowrap}
.course-key-facts dd>span{font:500 18px/28px var(--font-body);letter-spacing:normal}
.course-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.course-hero-actions .button{padding-inline:22px;gap:18px}
.course-hero-visual{background:var(--purple-soft);border:1px solid var(--border-subtle);border-radius:24px;overflow:hidden}
.hero-course-art{aspect-ratio:1.25;overflow:hidden}
.hero-course-art>img{width:100%;height:100%;object-fit:cover}
.development-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;position:relative;height:100%;background:radial-gradient(ellipse at 90% 90%,#6f4c9e,transparent 65%),#241a31;color:var(--lime)}
.dev-file{position:absolute;left:28px;top:24px;color:#e6ddf1;font-size:14px;line-height:22px}
.dev-code{font:500 76px/1.1 var(--font-heading);letter-spacing:-.04em}
.dev-stack{color:#e6ddf1;font-size:14px;line-height:22px;text-align:center;padding:0 20px}
.mern .development-visual{background:radial-gradient(ellipse at 90% 90%,#a9dff4,transparent 60%),#e7f4fc;color:var(--purple)}
.mern .dev-file,.mern .dev-stack{color:var(--text-secondary)}
.course-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--border-subtle);border-radius:20px;margin:0 12px 32px;padding:8px 24px;gap:0 24px}
.course-highlights>div{display:flex;align-items:center;gap:12px;min-height:66px;font-weight:500}
.course-highlights>div:nth-child(-n+3){border-bottom:1px solid var(--border-subtle)}
.course-highlights .icon{color:var(--purple);width:24px;height:24px;flex:none}
.course-page-nav{position:sticky;top:92px;z-index:20;background:#fffffff5;backdrop-filter:blur(12px);border-block:1px solid var(--border-subtle);padding:12px;display:flex;gap:16px;align-items:center;justify-content:space-between;margin-inline:0}
.course-page-nav>nav{display:flex;gap:22px;align-items:center}
.course-page-nav a{font-size:14px;line-height:22px;font-weight:500;padding:8px 0;color:var(--muted)}
.course-page-nav a:hover,.course-page-nav a[aria-current="location"]{color:var(--purple)}
.course-page-nav a[aria-current="location"]{text-decoration:underline;text-underline-offset:6px}
.course-page-nav>.button{padding:12px 18px;gap:12px;flex:none}
.course-jump{display:none}
.detail-section{margin:104px 12px 0;scroll-margin-top:24px;min-width:0}
.detail-section-heading>h2,.detail-section>h2,.course-final-cta>h2,body[data-page="course-detail"] .certification-copy h2{font:600 52px/1.1 var(--font-heading);letter-spacing:-.04em}
.detail-section-heading>h2{margin-top:20px}
.detail-section-heading h2>span,.course-final-cta h2>span{color:var(--purple)}
.detail-section-heading>p:not(.section-label){color:var(--muted);max-width:64ch;margin-top:20px}
.course-overview{display:grid;grid-template-columns:1fr 1fr;gap:72px}
.overview-copy{padding-top:32px;color:var(--text-secondary)}
.overview-copy p+p{margin-top:20px}
.course-audience{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding-top:40px;border-top:1px solid var(--border-subtle);margin-top:40px}
.course-audience h2,.tools-heading h2,.related-heading h2{font:600 32px/40px var(--font-heading);letter-spacing:-.035em}
.course-audience p{color:var(--muted);margin-top:12px;max-width:36ch}
.course-audience>ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0;padding:0}
.course-audience li{display:flex;gap:10px;align-items:center;font-size:16px;line-height:26px}
.course-audience .icon{color:var(--purple);width:18px;height:18px;flex:none}
.course-skills{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding:44px;background:var(--purple-soft);border-radius:24px;margin-inline:0}
.skills-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;align-content:center}
.skills-list li{display:flex;align-items:flex-start;gap:10px}
.skills-list .icon{width:20px;height:20px;flex:none;color:var(--purple);margin-top:3px}
.course-syllabus{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:64px;align-items:start}
.syllabus-intro{position:sticky;top:204px}
.syllabus-intro .button{margin-top:28px}
.syllabus-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;color:var(--muted);font-size:14px;line-height:22px}
.syllabus-toolbar button{display:inline-flex;align-items:center;gap:8px;background:none;padding:8px 0;color:var(--purple);font:500 16px/24px var(--font-body)}
.syllabus-toolbar .icon{width:18px;height:18px}
.syllabus-module{border:1px solid var(--border-subtle);border-radius:14px;overflow:hidden;background:var(--white);margin-bottom:10px}
.syllabus-module[open]{border-color:#b8a5d0;background:#fbf9fd}
.syllabus-module summary{display:flex;align-items:center;gap:16px;padding:20px;cursor:pointer;list-style:none;font-size:18px;font-weight:500;line-height:26px}
.syllabus-module summary::-webkit-details-marker,.course-faq-list summary::-webkit-details-marker{display:none}
.syllabus-module summary>span:nth-child(2){flex:1;min-width:0}
.module-number{color:var(--purple);font-size:14px;font-weight:400;width:24px;flex:none}
.syllabus-module summary>.icon{width:20px;height:20px;color:var(--purple);flex:none}
.syllabus-module[open] summary>.icon,.course-faq-list details[open] summary>.icon{transform:rotate(45deg)}
.module-content{padding:0 24px 24px 60px}
.module-content ul{padding-left:18px;margin:0;color:var(--text-secondary)}
.module-content li{padding-left:4px;margin-bottom:8px}
.module-content li:last-child{margin-bottom:0}
.module-content li::marker{color:var(--purple)}
.tools-heading{display:flex;align-items:baseline;gap:24px;justify-content:space-between}
.tools-heading p{color:var(--muted)}
.tools-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;margin:28px 0 0;padding:0}
.tools-list li{display:flex;align-items:center;gap:14px;border:1px solid var(--border-subtle);border-radius:14px;padding:20px 16px;font-weight:500}
.tool-logo{display:flex;align-items:center;justify-content:center;width:64px;height:48px;flex:none;gap:6px}
.tool-logo img{display:block;width:auto;height:auto;max-width:100%;max-height:44px;object-fit:contain}
.tool-logo-pair img{max-width:28px;max-height:36px}
.tool-wordmark{display:block;width:64px;height:32px;overflow:hidden}
.tool-logo-symbol>.icon{width:32px;height:32px;color:var(--purple)}
.course-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:36px}
.course-project-grid article{display:flex;flex-direction:column;border:1px solid var(--border-subtle);border-radius:20px;padding:28px}
.project-icon{display:grid;place-items:center;width:52px;height:52px;background:var(--purple-soft);color:var(--purple);border-radius:14px;margin-bottom:24px}
.project-icon>.icon{width:26px;height:26px}
.course-project-grid h3,.course-support-grid h3{font:600 24px/30px var(--font-heading);letter-spacing:-.025em}
.course-project-grid p,.course-support-grid p{margin-top:14px;color:var(--muted)}
.project-tools{display:block;padding-top:24px;margin-top:auto;font-size:14px;line-height:22px;color:var(--purple)}
body[data-page="course-detail"] .certification.section{margin-top:104px;border-radius:24px;padding:44px;scroll-margin-top:24px}
.course-support-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:40px}
.course-support-grid article{border-top:1px solid var(--border-subtle);padding-top:28px}
.course-support-grid article>.icon{width:30px;height:30px;color:var(--purple);margin-bottom:20px}
.course-learner-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:center}
.course-learner-story>div>.button{margin-top:28px}
.course-learner-story figure{background:var(--purple);color:white;padding:40px;border-radius:24px;margin:0}
.story-quote{display:block;font:72px/50px Georgia,serif;color:var(--lime)}
.course-learner-story blockquote{font:400 28px/40px var(--font-heading);margin:16px 0 32px;letter-spacing:-.02em}
.course-learner-story figcaption{display:flex;gap:14px;align-items:center}
.story-avatar{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--lime);color:#344422;font-weight:600;flex:none}
.course-learner-story figcaption strong{display:block;font-weight:600}
.course-learner-story figcaption div>span{display:block;font-size:14px;line-height:22px;color:#e6ddf1;margin-top:2px}
.course-faq{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px}
.course-faq>div>.button{margin-top:28px}
.course-faq-list details{border-bottom:1px solid var(--border-subtle)}
.course-faq-list summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-weight:500;cursor:pointer}
.course-faq-list summary>.icon{width:22px;height:22px;color:var(--purple);flex:none}
.course-faq-list details>p{padding:0 32px 24px 0;color:var(--muted)}
.course-final-cta{background:var(--purple);color:white;padding:56px;border-radius:24px;text-align:center;margin-inline:0}
.course-final-cta .section-label{justify-content:center;color:#e6ddf1}
.course-final-cta .section-label>span{background:var(--lime)}
.course-final-cta h2{margin-top:20px}
.course-final-cta h2>span{color:var(--lime)}
.course-final-cta>p:not(.section-label){max-width:56ch;margin:24px auto;color:#f2edf8}
.course-final-cta .button{background:white;color:var(--purple);border-color:white}
.course-final-cta .button:hover{background:var(--purple-soft)}
.related-courses{margin-top:56px;margin-bottom:56px}
.related-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.related-heading>a{display:inline-flex;gap:12px;align-items:center;font-weight:600;color:var(--purple)}
.related-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
.related-grid>a{position:relative;border:1px solid var(--border-subtle);border-radius:18px;padding:24px 64px 24px 24px;transition:background .2s}
.related-grid>a:hover{background:var(--purple-soft)}
.related-grid>a>span{font-size:14px;line-height:22px;color:var(--muted)}
.related-grid h3{font:600 24px/32px var(--font-heading);letter-spacing:-.035em;margin-top:12px}
.related-grid>a>.icon{position:absolute;right:24px;top:calc(50% - 12px);color:var(--purple)}

@media(max-width:1200px){.course-page-nav>nav{gap:16px}.course-page-nav>.button{display:none}.course-hero{gap:32px}.course-hero h1{font-size:64px;line-height:72px}.course-hero-actions .button{padding-inline:18px}.course-syllabus{gap:36px}}
@media(max-width:1100px){
 .course-hero h1{font-size:56px;line-height:64px}.course-key-facts{gap:16px}.course-key-facts>div+div{padding-left:16px}.course-key-facts dd{font-size:32px;line-height:40px}.course-key-facts dd>span{font-size:16px;line-height:24px}.course-hero{grid-template-columns:1.2fr 1fr;gap:28px}
 .course-hero-actions{flex-direction:column;align-items:flex-start}.course-hero-visual{align-self:center}
 .course-page-nav{top:78px}.course-page-nav>nav{flex-wrap:wrap;gap:4px 24px}
 .detail-section{margin-top:80px}.detail-section-heading>h2,.detail-section>h2,.course-final-cta>h2,body[data-page="course-detail"] .certification-copy h2{font-size:40px;line-height:48px}
 .course-overview,.course-audience{gap:40px}.course-audience{margin-top:36px}.course-skills{gap:32px;padding:32px}
 .course-syllabus{grid-template-columns:1fr;gap:32px}.syllabus-intro{position:static}.syllabus-intro h2 br{display:none}.syllabus-intro .button{margin-top:24px}
 .tools-heading{display:block}.tools-heading p{margin-top:12px}.tools-list{gap:12px}.tools-list li{flex-direction:column;align-items:flex-start}
 .course-project-grid{gap:16px}.course-project-grid article{padding:24px}.course-project-grid h3{font-size:22px;line-height:28px}
 body[data-page="course-detail"] .certification.section{margin-top:80px;padding:32px}.course-support-grid{grid-template-columns:1fr 1fr;gap:32px}
 .course-learner-story,.course-faq{gap:32px}.course-learner-story figure{padding:32px}.course-learner-story blockquote{font-size:24px;line-height:34px}
 .related-courses{margin-top:48px}
}
@media(max-width:760px){
 html:has(body[data-page="course-detail"]){scroll-padding-top:150px}
 .course-hero{grid-template-columns:1fr;padding-top:8px;gap:32px}.course-hero-actions{flex-direction:row}
 .hero-course-art{aspect-ratio:1.6}.course-hero-visual{max-width:560px;width:100%}
 .course-highlights{grid-template-columns:1fr 1fr;padding:8px 20px;gap:0 18px}.course-highlights>div{min-height:74px;font-size:14px;line-height:22px}.course-highlights>div:nth-child(4){border-bottom:1px solid var(--border-subtle)}
 .course-page-nav{padding:10px 12px}.course-page-nav>nav{display:none}.course-page-nav>.button{display:flex;min-height:44px;padding:10px 16px;font-size:14px;line-height:22px}
 .course-jump{display:block}.course-jump summary{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;line-height:22px;list-style:none;cursor:pointer;min-height:44px}
 .course-jump summary::-webkit-details-marker{display:none}.course-jump summary>.icon{width:18px;height:18px}.course-jump[open] summary>.icon{transform:rotate(180deg)}
 .course-jump nav{position:absolute;left:0;right:0;top:100%;display:flex;flex-direction:column;padding:12px 20px;background:white;border:1px solid var(--border-subtle);border-radius:0 0 16px 16px;box-shadow:0 12px 24px #19171e0a;max-height:calc(100dvh - 150px);overflow:auto}
 .course-jump nav>a{font-size:16px;line-height:24px;padding:12px 0}
 .course-overview,.course-audience,.course-skills,.course-learner-story,.course-faq{grid-template-columns:1fr;gap:28px}.overview-copy{padding:0}.course-audience>ul{gap:18px}
 .course-project-grid{grid-template-columns:1fr}.course-project-grid h3{font-size:24px;line-height:32px}.course-project-grid article{padding:28px}
 .tools-list{grid-template-columns:1fr 1fr}.tools-list li{flex-direction:row;align-items:center}.course-faq-list{margin-top:0}
 .course-final-cta{padding:40px 28px}.related-heading{align-items:flex-start;flex-direction:column;gap:16px}.related-grid{grid-template-columns:1fr;gap:16px}
}
@media(max-width:540px){
 .course-breadcrumbs{padding:18px 8px 24px;font-size:14px;line-height:22px;column-gap:8px}
 .course-hero{padding:4px 8px 28px}.course-hero h1{font-size:40px;line-height:48px;letter-spacing:-.04em;margin-top:16px}.course-promise{margin-top:20px}
 .course-key-facts{gap:10px;margin-top:28px}.course-key-facts>div+div{padding-left:10px}.course-key-facts dd{font-size:28px;line-height:36px}.course-key-facts dd>span{font-size:14px;line-height:22px}
 .course-hero-actions{gap:12px;margin-top:24px}.course-hero-actions .button{width:100%;justify-content:center}
 
 .dev-code{font-size:64px}.dev-file{top:18px;left:20px}.dev-stack{font-size:14px;line-height:22px}.development-visual{gap:16px;padding-top:20px}
 .course-highlights{margin:0 8px 24px;padding:6px 14px;gap:0 14px;border-radius:16px}.course-highlights>div{gap:8px}.course-highlights .icon{width:20px;height:20px}
 .course-page-nav{top:76px;padding:8px}.course-page-nav .button{gap:8px;padding-inline:12px}.course-page-nav .button>.icon{width:18px;height:18px}
 .detail-section{margin:64px 8px 0}.detail-section-heading>h2,.detail-section>h2,.course-final-cta>h2,body[data-page="course-detail"] .certification-copy h2{font-size:32px;line-height:40px;letter-spacing:-.035em}.detail-section-heading>h2{margin-top:16px}
 .course-audience{margin-top:28px;padding-top:28px}.course-audience h2,.tools-heading h2,.related-heading h2{font-size:28px;line-height:36px}.course-audience>ul{grid-template-columns:1fr;gap:14px}
 .course-skills{margin-inline:0;padding:28px 24px}.skills-list{grid-template-columns:1fr;gap:16px}
 .syllabus-module summary{padding:18px 14px;gap:10px;font-size:16px;line-height:24px}.module-number{width:22px}.module-content{padding:0 18px 22px 42px}
 .tools-list{gap:12px}.tools-list li{flex-direction:column;align-items:flex-start;padding:16px;font-size:14px;line-height:22px}
 .course-project-grid{margin-top:28px}.course-project-grid article{padding:24px}
 body[data-page="course-detail"] .certification.section{margin-top:64px;padding:28px 24px}
 .course-support-grid{grid-template-columns:1fr;gap:24px;margin-top:28px}.course-support-grid article{padding-top:24px}.course-support-grid article>.icon{margin-bottom:16px}
 .course-learner-story figure{padding:28px 24px}.course-learner-story blockquote{font-size:24px;line-height:34px}.course-learner-story figcaption{align-items:flex-start}
 .course-final-cta{margin-inline:0;padding:36px 24px}.course-final-cta>.button{width:100%}.course-final-cta h2{margin-top:18px}
 .related-courses{margin-top:40px;margin-bottom:40px}.related-grid>a{padding:24px 56px 24px 24px}.related-grid h3{font-size:22px;line-height:28px}
}