/* Course columns represent the learning path, not a statistical bar chart. */
.course-path{gap:14px;position:relative;isolation:isolate}
.course-path li{--column-light:var(--glow-blue);background:linear-gradient(155deg,color-mix(in srgb,var(--glow-blue) 18%,var(--navy)),var(--navy) 42%,var(--night));color:var(--white);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--glow-blue) 52%,transparent),0 13px 16px -11px color-mix(in srgb,var(--glow-blue) 48%,transparent);transform:none;transition:transform 180ms var(--out),box-shadow 180ms ease}
.course-path li:nth-child(2){background:linear-gradient(155deg,color-mix(in srgb,var(--white) 28%,var(--glow-blue)),var(--glow-blue) 45%,color-mix(in srgb,var(--glow-blue) 83%,var(--navy)));color:var(--night);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--white) 68%,transparent),0 13px 18px -11px color-mix(in srgb,var(--glow-blue) 65%,transparent)}
.course-path li:last-child{--column-light:var(--orange);background:linear-gradient(155deg,color-mix(in srgb,var(--white) 23%,var(--orange)),var(--orange) 45%,color-mix(in srgb,var(--orange) 90%,var(--night)));color:var(--night);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--white) 62%,transparent),0 13px 18px -11px color-mix(in srgb,var(--orange) 55%,transparent)}
.course-path li::after{content:'';position:absolute;z-index:-1;pointer-events:none;left:10%;right:10%;bottom:-10px;height:12px;background:radial-gradient(ellipse,var(--column-light),transparent 70%);opacity:.22;filter:blur(6px)}
.course-path button{border-radius:inherit}
.course-path button>i{color:inherit}
.course-path li:nth-child(2) button:focus-visible{outline-color:var(--night)}
@media(hover:hover) and (pointer:fine){.course-path li:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--white) 50%,transparent),0 16px 22px -12px color-mix(in srgb,var(--column-light) 62%,transparent)}.course-path button:hover{background:transparent}}
@media(max-width:760px){.course-path{gap:8px}.course-path li::after{left:7%;right:7%;bottom:-7px;opacity:.18}}
@media(prefers-reduced-motion:reduce){.course-path li,.course-path li:hover{transform:none!important;transition:none!important}}