/* Page layout for the public redesigned site. Components come from /design-system/components.css;
   this file only arranges them, using role tokens from tokens-proposed.css. */
html { scroll-padding-block-start: var(--ds-space-4); }
body.site { --ds-content-max: 76rem; margin: 0; background: var(--ds-color-surface); }
@media (min-width: 1280px) { body.site { --ds-gutter: 3rem; } }
.site main:focus { outline: none; }
.site-wrap { width: 100%; max-width: calc(var(--ds-content-max) + 2 * var(--ds-gutter)); margin-inline: auto; padding-inline: var(--ds-gutter); }
.site .nc-header-inner, .site .nc-header-top { max-width: calc(var(--ds-content-max) + 2 * var(--ds-gutter)); margin-inline: auto; }
.site .nc-header-top { max-width: none; }
.site .nc-header-top .nc-header-util { max-width: var(--ds-content-max); width: 100%; margin-inline: auto; justify-content: flex-end; }
.site .nc-footer { padding-inline: 0; }

/* Hero */
.home-hero { background: var(--ds-color-surface-alt); }
@media (min-width: 768px) { .home-hero.nc-hero--split { grid-template-columns: 1fr 1fr; } .home-hero .nc-hero-media { min-height: 30rem; } }
.home-hero .nc-hero-copy { padding-block: var(--ds-space-10) var(--ds-space-12); gap: var(--ds-space-5); }
@media (min-width: 1280px) { .home-hero .nc-hero-copy { padding-inline-start: max(var(--ds-gutter), calc((100vw - var(--ds-content-max)) / 2)); } }
.home-hero .nc-search { max-width: 34rem; }
.home-term { text-decoration: underline dotted; text-underline-offset: .18em; cursor: pointer; }
.home-term:focus-visible { outline: 2px solid var(--ds-color-action); outline-offset: 2px; }
.home-term-explanation { max-width: 34rem; padding: var(--ds-space-4); border-inline-start: var(--ds-space-1) solid var(--ds-color-action); background: var(--ds-color-surface); color: var(--ds-color-text); }
.home-term-explanation[hidden] { display: none; }

/* Sections */
.home-section { padding-block: var(--ds-space-12); }
.home-section--alt { background: var(--ds-color-surface-alt); }
.home-h2 { margin: 0 0 var(--ds-space-6); font-family: var(--ds-font-heading); font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); font-weight: var(--ds-weight-bold); }
.home-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--ds-space-2) var(--ds-space-6); margin-block-end: var(--ds-space-6); }
.home-head .home-h2 { margin: 0; }

/* Goals: four photo cards, the whole card is the link */
.goal-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: var(--ds-space-4); }
.nc .goal-card { position: relative; display: grid; grid-template-rows: 9rem 1fr; height: 100%; overflow: hidden; color: var(--ds-color-text); text-decoration: none; background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); transition: border-color var(--ds-duration-hover) var(--ds-easing), box-shadow var(--ds-duration-hover) var(--ds-easing); }
.nc .goal-card:hover { border-color: var(--ds-color-action); box-shadow: var(--ds-shadow-raised); color: var(--ds-color-text); }
.goal-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.goal-body { display: grid; gap: var(--ds-space-1); align-content: start; padding: var(--ds-space-4) var(--ds-space-10) var(--ds-space-5) var(--ds-space-4); }
.goal-body b { font-size: var(--ds-text-h4); line-height: var(--ds-leading-h4); color: var(--ds-color-action); }
.goal-body span { color: var(--ds-color-text-muted); }
.goal-card > .nc-icon { position: absolute; inset-inline-end: var(--ds-space-4); inset-block-end: var(--ds-space-5); color: var(--ds-color-action); }

/* Featured courses */
.home-cards > li { display: grid; }
/* Card titles use the standard card heading size (20px phone, 22px wide) now that the header row is shorter */
.home-cards .home-card-fact-wide { grid-column: 1 / -1; }
.home-cards .nc-card { grid-template-rows: auto auto auto auto 1fr; }
.home-cards .nc-card-facts { align-content: start; }
.home-cards .nc-card-foot { align-self: end; }

/* Subject areas */
.area-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); gap: var(--ds-space-3); }
.nc .area-card { display: flex; justify-content: space-between; align-items: center; gap: var(--ds-space-4); min-height: var(--ds-control-height); height: 100%; padding: var(--ds-space-4) var(--ds-space-5); color: var(--ds-color-text); text-decoration: none; background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); transition: color var(--ds-duration-hover) var(--ds-easing), background-color var(--ds-duration-hover) var(--ds-easing), border-color var(--ds-duration-hover) var(--ds-easing); }
.nc .area-card:hover { border-color: var(--ds-color-action); background: var(--ds-color-action-subtle); color: var(--ds-color-text); }
.area-card b { font-weight: var(--ds-weight-semibold); }
.area-card span { flex: none; font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }

/* Kinds of learning */
.kind-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); gap: var(--ds-space-4); }
.kind-card { display: grid; gap: var(--ds-space-3); align-content: start; justify-items: start; padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.kind-card h3 { margin: 0; font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.kind-card p { margin: 0; color: var(--ds-color-text-muted); }

/* Campuses with the SUNY gradient banner */
.home-split { display: grid; gap: var(--ds-space-8); align-items: center; }
@media (min-width: 900px) { .home-split { grid-template-columns: 1fr 1fr; } }
.home-split-copy { display: grid; gap: var(--ds-space-5); justify-items: start; }
.home-split-copy .home-h2 { margin: 0; }
.home-split-copy .nc-location { width: 100%; }
.home-banner img { display: block; width: 100%; height: auto; border-radius: var(--ds-radius-md); }

/* Funding */
.fund-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: var(--ds-space-4); }
.fund-grid li { display: grid; gap: var(--ds-space-1); padding: var(--ds-space-5); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-inline-start: var(--ds-space-1) solid var(--ds-color-action); border-radius: var(--ds-radius-md); }
.fund-grid b { font-size: var(--ds-text-h4); }
.fund-grid span { font-weight: var(--ds-weight-semibold); }
.fund-grid small { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
.site .nc-pagehead--plain:has(+ .funding-page) { min-height: 0; }
.funding-page { padding-block: var(--ds-space-8) var(--ds-space-16); display: grid; gap: var(--ds-space-10); }
.funding-page > section > h2 { margin: 0 0 var(--ds-space-5); font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); }
.funding-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-8); }
.funding-options > section { position: relative; scroll-margin-block-start: var(--ds-space-5); padding-block-start: var(--ds-space-4); border-block-start: var(--ds-space-1) solid var(--ds-color-action); display: grid; gap: var(--ds-space-3); align-content: start; }
.funding-options .nc-term { position: static; }
.funding-options .nc-term-def--popover { inset-block-start: calc(var(--ds-space-4) + 2rem); inset-inline-start: 0; width: min(22rem, 100%); }
.funding-options h3 { margin: 0; font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.funding-options p { margin: 0; max-width: 36rem; }
.funding-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--ds-space-2) var(--ds-space-5); }
.funding-page > .nc-help { max-width: none; }
@media (max-width: 767px) { .funding-options { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 599px) {
  .site #funding-head { padding-block-start: 9rem; }
  #funding-head::before { height: 8rem !important; background-position: 50% 35% !important; }
}

/* Help */
.home-help .nc-help { max-width: none; padding: var(--ds-space-8); }
.home-help .nc-help h2 { font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); }
.help-page { display: grid; gap: var(--ds-space-10); padding-block: var(--ds-space-8) var(--ds-space-16); }
.help-page > section > h2 { margin: 0 0 var(--ds-space-5); font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); }
.help-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-5); max-width: 56rem; }
.help-options .nc-help { max-width: none; align-content: start; justify-items: start; }
.help-options .nc-help .nc-btn { margin-block-start: auto; }
.help-topic-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-8); margin: 0; padding: 0; list-style: none; }
.help-topic-list > li { display: grid; gap: var(--ds-space-2); align-content: start; justify-items: start; padding-block-start: var(--ds-space-4); border-block-start: var(--ds-space-1) solid var(--ds-color-action); }
.help-topic-list h3, .help-topic-list p { margin: 0; }
.help-topic-list h3 { font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.help-topic-list .nc-link { margin-block-start: var(--ds-space-2); }
.help-page > .nc-help { max-width: none; }
.help-ask { display: grid; gap: var(--ds-space-8); padding-block: var(--ds-space-8) var(--ds-space-16); max-width: 48rem; }
.site .nc-pagehead:has(+ .help-ask) { min-height: 0; }
.help-ask > .nc-alert, .help-ask > .nc-help, .help-ask > .nc-confirmation { max-width: 40rem; }
.help-ask [hidden] { display: none; }
.help-review-details { display: grid; gap: var(--ds-space-3); margin: 0; }
.help-review-details > div { display: grid; gap: 0; }
.help-review-details dt { color: var(--ds-color-text-muted); }
.help-review-details dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.help-contact > a { justify-self: start; }
@media (max-width: 767px) { .help-options { grid-template-columns: 1fr; } .help-topic-list { grid-template-columns: 1fr; } }

/* Placeholder pages */
.site .nc-pagehead { padding-inline: 0; min-height: 24rem; align-content: start; }
.site .nc-pagehead .site-wrap { display: grid; gap: var(--ds-space-3); }
.home-cards .nc-card-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .area-grid { grid-template-columns: repeat(3, 1fr); } }
.kind-card { display: flex; flex-direction: column; align-items: flex-start; }
.kind-card > .nc-link { margin-block-start: auto; padding-block-start: var(--ds-space-2); }

/* Hero: one first choice, search or browse, with location and help beside it */
.home-or { display: flex; align-items: center; gap: var(--ds-space-3); }
.home-or > span { color: var(--ds-color-text-muted); }
.home-hero-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ds-space-1) var(--ds-space-6); }
.home-hero-links .nc-icon { width: 1.375rem; height: 1.375rem; flex: none; }
.home-hero-links .nc-link { gap: var(--ds-space-2); align-items: center; }

/* Good to know: three short notes in one band */
.know-strip { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); gap: var(--ds-space-8); }
.know-strip > li { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-2); padding-block-start: var(--ds-space-4); border-block-start: var(--ds-space-1) solid var(--ds-color-action); }
.know-strip h2 { margin: 0; font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.know-strip p { margin: 0; color: var(--ds-color-text-muted); }
.know-strip p b { color: var(--ds-color-text); }
.know-strip > li > .nc-link { margin-block-start: auto; }
.know-kinds { margin: 0; display: grid; gap: var(--ds-space-2); }
.know-kinds div { display: grid; gap: 0; }
.know-kinds dt { font-weight: var(--ds-weight-bold); }
.know-kinds dd { margin: 0; color: var(--ds-color-text); }
.know-strip p { color: var(--ds-color-text); }
ul.know-kinds { list-style: none; padding: 0; }
.know-kinds li b { font-weight: var(--ds-weight-bold); }
.know-kinds li { margin: 0; color: var(--ds-color-text); }
.nc-scroller-head { margin-block-end: 0; align-items: center; }
.home-see-all { justify-self: start; }

/* Starting soon results and course details */
.site .course-head, .site .course-list-head { min-height: 0; padding-block: var(--ds-space-8); }
.course-eyebrow { font-weight: var(--ds-weight-semibold); color: var(--ds-color-action); }
.course-list { padding-block: var(--ds-space-8) var(--ds-space-12); }
.course-list > ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: var(--ds-space-4); }
.course-list > ul > li { display: grid; }
.course-list .home-card-fact-wide { grid-column: 1 / -1; }
.course-list .nc-card { grid-template-rows: auto auto auto auto 1fr; }
.course-list .nc-card-facts { align-content: start; }
.course-list .nc-card-foot { align-self: end; }
@media (min-width: 700px) { .course-list > ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .course-list > ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Courses results */
.results { padding-block: var(--ds-space-6) var(--ds-space-16); display: grid; gap: var(--ds-space-6); }
.results-search { max-width: 40rem; }
.results-layout { display: grid; gap: var(--ds-space-6); align-items: start; }
@media (min-width: 1024px) { .results-layout { grid-template-columns: 17rem minmax(0, 1fr); gap: var(--ds-space-8); } .results-filter-toggle { display: none; } }
.results-filters-title { margin: 0 0 var(--ds-space-2); font-size: var(--ds-text-h4); }
.results-filters-head { display: flex; justify-content: space-between; align-items: center; }
.results-filters-close, .results-filters-foot { display: none; }
@media (max-width: 1023px) {
  .results-layout { grid-template-columns: minmax(0, 1fr); }
  .results-filters { display: none; }
  .results-filters.is-open { display: flex; flex-direction: column; position: fixed; inset: 0; z-index: var(--ds-z-drawer); background: var(--ds-color-surface); }
  .results-filters.is-open .results-filters-head { padding: var(--ds-space-3) var(--ds-gutter); border-block-end: 1px solid var(--ds-color-border); }
  .results-filters.is-open .results-filters-close { display: inline-flex; }
  .results-filters.is-open #filter-groups { flex: 1; overflow: auto; padding: var(--ds-space-2) var(--ds-gutter); }
  .results-filters.is-open .results-filters-foot { display: block; padding: var(--ds-space-3) var(--ds-gutter); border-block-start: 1px solid var(--ds-color-border); }
  body.filters-open { overflow: hidden; }
}
.results-filters .nc-filter-body .is-extra { display: none; }
.results-filters .nc-filter-body.show-all .is-extra { display: flex; }
.results-filters .nc-filter-body .results-more { justify-self: start; }
.results-main { display: grid; gap: var(--ds-space-5); min-width: 0; }
.results-bar-actions { display: flex; flex-wrap: wrap; align-items: end; gap: var(--ds-space-3); }
.results-chips:empty { display: none; }
.results-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); gap: var(--ds-space-4); }
.results-cards > li { display: grid; }
.results-cards .nc-card-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.results-cards .nc-card-distinction { margin: 0; color: var(--ds-color-text-muted); font-size: var(--ds-text-small); font-weight: var(--ds-weight-semibold); }
.results-empty { grid-column: 1 / -1; }
.results-count:focus, #results-count:focus { outline: none; }
.results-fields { display: grid; gap: var(--ds-space-3); padding: var(--ds-space-5); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.results-fields h2 { margin: 0; font-size: var(--ds-text-h4); }
.results-field-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
.nc .results-field { background: var(--ds-color-surface); border-color: var(--ds-color-border-input); }
.nc .results-field.is-on { background: var(--ds-color-action-subtle); border-color: var(--ds-color-action); }
.site .nc-pagehead:has(+ .results) { min-height: 0; }

/* Course summary */
.course-summary { padding-block: var(--ds-space-6) var(--ds-space-16); display: grid; gap: var(--ds-space-5); max-width: 56rem; }
.course-summary #course-body { display: grid; gap: var(--ds-space-5); }
.course-campus { margin: 0; color: var(--ds-color-text-muted); }
.course-funding-summary { display: grid; gap: var(--ds-space-3); padding-block-start: var(--ds-space-5); border-block-start: 1px solid var(--ds-color-border); }
.course-funding-summary h2, .course-funding-summary p { margin: 0; }
.course-funding-summary ul { display: grid; gap: var(--ds-space-3); margin: 0; padding-inline-start: var(--ds-space-5); }

/* Arranged-training guide: numbered cards joined by a line, so it reads as steps in order */
.guide { padding-block: var(--ds-space-8) var(--ds-space-16); display: grid; gap: var(--ds-space-8); max-width: 50rem; }
.guide-steps { margin: 0; padding: 0; list-style: none; counter-reset: step; display: grid; gap: var(--ds-space-5); position: relative; }
.guide-steps::before { content: ""; position: absolute; inset-block: 1.5rem; inset-inline-start: 1.125rem; border-inline-start: 2px dashed var(--ds-color-action); opacity: .5; }
.guide-steps > li { counter-increment: step; position: relative; display: grid; gap: var(--ds-space-3); margin-inline-start: 3.5rem; padding: var(--ds-space-5) var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.guide-steps > li::before { content: counter(step); position: absolute; inset-inline-start: -3.5rem; inset-block-start: var(--ds-space-5); display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--ds-color-action); color: var(--ds-color-on-action); font-weight: var(--ds-weight-bold); box-shadow: 0 0 0 6px var(--ds-color-surface-alt); }
.guide-steps h2 { margin: 0; font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.guide-steps p { margin: 0; }
.guide-payers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr)); gap: var(--ds-space-3); }
.guide-payers li { display: grid; gap: var(--ds-space-2); padding: var(--ds-space-4); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.guide-payers span:not(.nc-goal-mark) { color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.guide .nc-search-row { max-width: none; }
.site .nc-pagehead:has(+ .guide) { min-height: 0; }
@media (min-width: 900px) { .goal-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px) { .course-summary .nc-facts { grid-template-columns: repeat(4, 1fr); } }

/* Browse subjects */
.subjects { padding-block: var(--ds-space-8) var(--ds-space-16); }
.subject-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(19rem, 100%), 1fr)); gap: var(--ds-space-4); }
.subject-card { display: flex; flex-direction: column; gap: var(--ds-space-2); padding: var(--ds-space-5); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.subject-card h2 { margin: 0; font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); }
.subject-count { margin: 0; color: var(--ds-color-text-muted); }
.subject-topics { list-style: none; margin: var(--ds-space-2) 0 0; padding: var(--ds-space-3) 0 0; border-block-start: 1px solid var(--ds-color-border); display: grid; gap: var(--ds-space-2); }
.subject-topics li { display: flex; justify-content: space-between; gap: var(--ds-space-3); }
.subject-topics span { color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.site .nc-pagehead:has(+ .subjects), .site .nc-pagehead:has(+ .campuses), .site .nc-pagehead:has(+ .choosing) { min-height: 0; }

/* Campuses */
.campuses { padding-block: var(--ds-space-8) var(--ds-space-16); display: grid; gap: var(--ds-space-6); }
.campus-where h2:focus { outline: none; }
#campus-place { scroll-margin-top: 7rem; }
.campus-where-form { display: flex; flex-wrap: wrap; align-items: end; gap: var(--ds-space-3); }
.campus-where-field { flex: 1 1 18rem; max-width: 28rem; }
.campus-where-msg { margin: 0; color: var(--ds-color-text-muted); }
.campus-where-msg:empty { display: none; }
.campus-where-msg.is-error { color: var(--ds-color-invalid); font-weight: var(--ds-weight-semibold); }
.campus-online { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-2) var(--ds-space-4); padding: var(--ds-space-4) var(--ds-space-5); background: var(--ds-color-action-subtle); border-radius: var(--ds-radius-md); }
.campus-online p { margin: 0; flex: 1 1 16rem; }
.campus-online .nc-goal-mark { background: var(--ds-color-surface); flex: none; }
@media (max-width: 599px) { .campus-online > .nc-link { margin-inline-start: auto; } }
.campus-tools { display: grid; grid-template-columns: 1fr; gap: var(--ds-space-4); }
@media (min-width: 768px) { .campus-tools { grid-template-columns: 2fr 1fr 1fr; align-items: end; } }
.campus-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); gap: var(--ds-space-4); }
.campus-card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-2); padding: var(--ds-space-5); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.campus-card[hidden] { display: none; }
.campus-card img { height: 2.75rem; width: auto; max-width: 12rem; object-fit: contain; margin-block-end: var(--ds-space-2); }
.campus-card h2 { margin: 0; font-size: var(--ds-text-h4); line-height: var(--ds-leading-h4); }
.campus-town { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-1) var(--ds-space-2); margin: 0; font-weight: var(--ds-weight-semibold); }
.campus-town .nc-icon { color: var(--ds-color-text-muted); }
.campus-distance { margin: 0; color: var(--ds-color-action-strong); font-weight: var(--ds-weight-semibold); font-size: var(--ds-text-small); }
.campus-distance[hidden] { display: none; }
.campus-areas { margin-block-start: var(--ds-space-1); }
.campus-where-status { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-3); }
.campus-where-status:has(.campus-where-msg:empty) { display: none; }
.campus-mix, .campus-none { margin: 0; color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.campus-actions { margin-block-start: auto; padding-block-start: var(--ds-space-3); display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-2) var(--ds-space-5); }
.campus-about { font-size: var(--ds-text-small); }
.campus-card--none { border-style: dashed; }

/* Help choosing: numbered steps beside a summary with the live match count */
.choosing { padding-block: var(--ds-space-8) var(--ds-space-16); }
.choosing-form { display: grid; gap: var(--ds-space-8); align-items: start; }
@media (min-width: 1024px) { .choosing-form { grid-template-columns: minmax(0, 1fr) 20rem; gap: var(--ds-space-10); } .choosing-summary { position: sticky; top: var(--ds-space-6); } }
.choosing-steps { display: grid; gap: var(--ds-space-10); }
.choosing-step { margin: 0; padding: 0; border: 0; min-width: 0; }
.choosing-step legend { display: block; padding: 0; margin-block-end: var(--ds-space-4); font-size: var(--ds-text-h3); line-height: var(--ds-leading-h3); font-weight: var(--ds-weight-bold); }
.choosing-step .nc-choices { display: grid; gap: var(--ds-space-3); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) {
  .choosing-goals { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .choosing-goals > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .choosing-two { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .choosing-three { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
.choosing-mark { --nc-duo: var(--ds-color-highlight); --nc-duo-opacity: 1; }
.choosing-goals .choosing-choice { min-height: 4.75rem; }
.choosing-summary { display: grid; gap: var(--ds-space-3); padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.choosing-summary h2 { margin: 0; font-size: var(--ds-text-h4); }
.choosing-count { margin: 0 0 var(--ds-space-2); display: grid; gap: var(--ds-space-1); }
.choosing-count b { font-size: 2.75rem; line-height: 1; color: var(--ds-color-action); }
.choosing-count b:empty { display: none; }
.choosing-selections { border-block-start: 1px solid var(--ds-color-border); padding-block-start: var(--ds-space-4); margin-block-start: var(--ds-space-2); }
.choosing-selections h3 { margin: 0 0 var(--ds-space-3); font-size: var(--ds-text-body); }
.choosing-selections dl { display: grid; gap: var(--ds-space-3); margin: 0; }
.choosing-selections dl > div { display: grid; gap: var(--ds-space-1); }
.choosing-selections dt { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
.choosing-selections dd { margin: 0; font-weight: var(--ds-weight-semibold); line-height: 1.35; }
.choosing-selections [hidden] { display: none; }
.choosing-talk { display: grid; gap: var(--ds-space-2); margin-block-start: var(--ds-space-3); padding-block-start: var(--ds-space-4); border-block-start: 1px solid var(--ds-color-border); }
.choosing-talk h3 { margin: 0; font-size: var(--ds-text-body); }
.choosing-talk p { margin: 0; color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.choosing-form.is-arranged .choosing-step:not(:first-child) { opacity: .5; }
/* Courses page header: faded photo on the end side, text on the plain surface */
.site .results-head { min-height: 15rem; padding-block: var(--ds-space-6) var(--ds-space-8); }
.results-head::before { background-position: var(--nc-focus, 60% 30%) !important; }
.results-head .site-wrap { position: relative; }
.results-head p { max-width: 34rem; }
@media (min-width: 1280px) { .results-head::before { width: 50%; } }
@media (max-width: 599px) { .site .results-head { min-height: 0; padding-block-start: 6rem; } .results-head::before { height: 5rem !important; background-position: var(--nc-focus, 60% 25%) !important; } }
/* Subject area titles read as headings: text color, blue underline like course card titles */
.nc .subject-card h2 a { color: var(--ds-color-text); text-decoration-color: var(--ds-color-action); text-decoration-thickness: 2px; text-underline-offset: 0.2em; }
.nc .subject-card h2 a:hover { color: var(--ds-color-action-strong); }

/* Phones: count, then Filters and Sort side by side at one height; applied filters in one swipeable row */
@media (max-width: 599px) {
  .results .nc-results-bar { display: grid; gap: var(--ds-space-3); padding-block-end: var(--ds-space-3); }
  #results-order { display: none; }
  .results-bar-actions { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--ds-space-2); align-items: stretch; }
  .results-bar-actions .results-filter-toggle, .results-bar-actions .nc-select { width: 100%; min-height: var(--ds-control-height-sm); height: var(--ds-control-height-sm); }
  .results-bar-actions .results-filter-toggle { padding-inline: var(--ds-space-3); }
  .results-bar-actions .nc-sort { display: block; }
  .results-bar-actions .nc-sort .nc-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .results-bar-actions .nc-select { padding-block: 0; font-size: var(--ds-text-label); font-weight: var(--ds-weight-semibold); }
  .results-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-block: var(--ds-space-1); -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 1.5rem), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 1.5rem), transparent); }
  .results-chips::-webkit-scrollbar { display: none; }
  .results-chips > li { flex: none; }
  .results-chips .nc-chip { white-space: nowrap; }
}
@media (max-width: 599px) { .results-bar-actions .nc-select { padding-inline: var(--ds-space-3) var(--ds-space-8); background-position: right var(--ds-space-2) center; } }
@media (max-width: 599px) { .results-bar-actions .nc-sort .nc-select { width: 100%; max-width: none; } }
/* Phones: tighter gap between search and the result count */
@media (max-width: 599px) { .results { gap: var(--ds-space-4); padding-block-start: var(--ds-space-5); } }
.campus-about { display: inline-flex; align-items: center; gap: var(--ds-space-1); }

/* Funding: one caveat, routes by who is paying, a checklist before paying */
.funding-promise { display: flex; gap: var(--ds-space-3); align-items: flex-start; margin: 0; padding: var(--ds-space-4) var(--ds-space-5); background: var(--ds-color-action-subtle); border-radius: var(--ds-radius-md); max-width: 48rem; }
.funding-promise .nc-icon { width: 1.375rem; height: 1.375rem; color: var(--ds-color-action); flex: none; margin-block-start: 0.1rem; }
.funding-options > section:last-child:nth-child(odd) { grid-column: 1 / -1; }
.funding-options > section:last-child:nth-child(odd) p { max-width: 48rem; }
.funding-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); }
.funding-checklist li { display: flex; gap: var(--ds-space-3); align-items: flex-start; }
.funding-checklist .nc-icon { color: var(--ds-color-success, var(--ds-color-action)); flex: none; margin-block-start: 0.2rem; }
.funding-before .nc-btn-group { margin-block-start: var(--ds-space-2); }
.choosing-form { max-width: none; }

/* Funding routes as scannable cards with a destination icon */
.funding-options { gap: var(--ds-space-5) !important; }
.funding-options > .funding-card { display: flex; flex-direction: column; gap: var(--ds-space-3); padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-block-start: var(--ds-space-1) solid var(--ds-color-action); border-radius: var(--ds-radius-md); }
.funding-card-head { display: flex; align-items: center; gap: var(--ds-space-4); }
.funding-card-head .nc-goal-mark { flex: none; }
.funding-card .funding-actions { margin-block-start: auto; padding-block-start: var(--ds-space-2); flex-direction: column; gap: var(--ds-space-3); }
.funding-options > .funding-card:last-child:nth-child(odd) { grid-column: auto; }
@media (min-width: 1024px) { .funding-options--three { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (min-width: 768px) and (max-width: 1023px) { .funding-options--three > .funding-card:last-child { grid-column: 1 / -1; } }
.funding-page > section > h2 { margin-block-end: var(--ds-space-5); }
.funding-card .funding-actions { align-items: flex-start; } .funding-card .funding-actions .nc-link { width: auto; }
.funding-card .funding-actions .nc-link--standalone { display: inline; } .funding-card .funding-actions .nc-link--standalone .nc-icon { display: inline-block; vertical-align: -0.2em; margin-inline-start: var(--ds-space-1); }
.funding-card .funding-go::after { content: "\00a0\00a0\00a0\00a0\00a0\00a0"; display: inline; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20d%3D%22M221.66%2C133.66l-72%2C72a8%2C8%2C0%2C0%2C1-11.32-11.32L196.69%2C136H40a8%2C8%2C0%2C0%2C1%2C0-16H196.69L138.34%2C61.66a8%2C8%2C0%2C0%2C1%2C11.32-11.32l72%2C72A8%2C8%2C0%2C0%2C1%2C221.66%2C133.66Z%22/%3E%3C/svg%3E") right center / 1.125rem no-repeat; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20256%20256%22%3E%3Cpath%20d%3D%22M221.66%2C133.66l-72%2C72a8%2C8%2C0%2C0%2C1-11.32-11.32L196.69%2C136H40a8%2C8%2C0%2C0%2C1%2C0-16H196.69L138.34%2C61.66a8%2C8%2C0%2C0%2C1%2C11.32-11.32l72%2C72A8%2C8%2C0%2C0%2C1%2C221.66%2C133.66Z%22/%3E%3C/svg%3E") right center / 1.125rem no-repeat; }
[dir="rtl"] .funding-card .funding-go::after { transform: scaleX(-1); }
.help-options > .funding-card { display: flex; flex-direction: column; gap: var(--ds-space-3); padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-block-start: var(--ds-space-1) solid var(--ds-color-action); border-radius: var(--ds-radius-md); }
.help-options > .funding-card p { margin: 0; }
/* Phones: a button alone on its row, or stacked buttons, take the full width */
@media (max-width: 599px) {
  .nc .nc-btn-group { flex-direction: column; align-items: stretch; }
  .nc .nc-btn-group > .nc-btn, .nc .funding-actions > .nc-btn { width: 100%; justify-content: center; }
}
@media (min-width: 768px) { .guide-payers { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.guide-steps::before { inset-block: 2.5rem 4rem; }
.guide-asks { list-style: none; margin: 0; padding: var(--ds-space-4); display: grid; gap: var(--ds-space-3); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.guide-asks li { display: flex; gap: var(--ds-space-3); align-items: flex-start; font-weight: var(--ds-weight-semibold); }
.guide-asks .nc-icon { color: var(--ds-color-action); flex: none; margin-block-start: .2rem; }
.guide-steps::before { inset-block: 2.5rem 4rem; }

/* Arranged-training extras */
.guide-more { display: grid; gap: var(--ds-space-5); }
.guide-more h2 { margin: 0; font-size: var(--ds-text-h2); }
.guide-more-grid { display: grid; gap: var(--ds-space-5); }
@media (min-width: 768px) { .guide-more-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.guide-more-grid > .funding-card, .help-options > .funding-card { display: flex; flex-direction: column; gap: var(--ds-space-3); padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-block-start: var(--ds-space-1) solid var(--ds-color-action); border-radius: var(--ds-radius-md); }
.guide-more-grid p { margin: 0; }
.guide-who-title { margin: var(--ds-space-3) 0 0; font-size: var(--ds-text-h3); }
.guide-who { margin: 0; display: grid; border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); overflow: hidden; }
.guide-who > div { display: grid; gap: var(--ds-space-1); padding: var(--ds-space-4) var(--ds-space-5); background: var(--ds-color-surface); }
.guide-who > div + div { border-block-start: 1px solid var(--ds-color-border); }
@media (min-width: 600px) { .guide-who > div { grid-template-columns: 1fr 1fr; align-items: center; } }
.guide-who dt { font-weight: var(--ds-weight-semibold); }
.guide-who dd { margin: 0; color: var(--ds-color-text-muted); }
.choosing-ask { grid-column: 1 / -1; border-block-start: 1px solid var(--ds-color-border); padding-block-start: var(--ds-space-6); }
/* Ask a question: the form beside what happens next */
.site-wrap.help-ask { max-width: calc(var(--ds-content-max) + 2 * var(--ds-gutter)); }
@media (min-width: 1024px) { .help-ask { grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; gap: var(--ds-space-10); } .help-ask-side { position: sticky; top: var(--ds-space-6); } }
.help-ask-main { display: grid; gap: var(--ds-space-6); min-width: 0; max-width: 44rem; }
.help-ask-form { max-width: none; gap: var(--ds-space-8); }
.help-ask-fields { display: grid; gap: var(--ds-space-5); }
.help-ask-topics { display: grid; gap: var(--ds-space-3); }
@media (min-width: 600px) { .help-ask-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.help-ask-more summary { cursor: pointer; font-weight: var(--ds-weight-semibold); color: var(--ds-color-action); text-decoration: underline; text-underline-offset: .2em; }
.help-ask-more[open] summary { margin-block-end: var(--ds-space-4); }
.help-ask-side { display: grid; gap: var(--ds-space-5); }
.help-ask-next { margin: 0; padding-inline-start: var(--ds-space-5); display: grid; gap: var(--ds-space-2); }
.help-ask-form .nc-field, .help-ask-form .nc-input, .help-ask-form .nc-select, .help-ask-form .nc-textarea { max-width: none; width: 100%; }
.help-ask-form .choosing-step .nc-fieldset legend { display: block; margin-block-end: var(--ds-space-2); font-size: var(--ds-text-label); line-height: var(--ds-leading-label); font-weight: var(--ds-weight-semibold); }
@media (min-width: 600px) { .help-ask-form .help-ask-topics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* Ask: how it works above, then a plain form beside account and contact help */
.site-wrap.help-ask { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .site-wrap.help-ask { grid-template-columns: minmax(0, 1fr) 20rem; } .help-ask-how { grid-column: 1 / -1; } }
.help-ask-how h2 { margin: 0 0 var(--ds-space-4); font-size: var(--ds-text-h3); }
.help-ask-steps { list-style: none; margin: 0; padding: 0; counter-reset: ask; display: grid; gap: var(--ds-space-4); }
@media (min-width: 768px) { .help-ask-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.help-ask-steps li { counter-increment: ask; display: grid; grid-template-columns: auto 1fr; gap: var(--ds-space-1) var(--ds-space-3); align-content: start; padding: var(--ds-space-5); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-block-start: var(--ds-space-1) solid var(--ds-color-action); border-radius: var(--ds-radius-md); }
.help-ask-steps li::before { content: counter(ask); grid-row: 1 / 3; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--ds-color-action); color: var(--ds-color-on-action); font-weight: var(--ds-weight-bold); }
.help-ask-steps span { color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.help-ask-form { gap: var(--ds-space-6); }
.help-ask-form .nc-fieldset legend { display: block; margin-block-end: var(--ds-space-2); }
.nc .help-ask-sub { margin: var(--ds-space-4) 0 0; padding-block-start: var(--ds-space-5); border-block-start: 1px solid var(--ds-color-border); font-size: var(--ds-text-h4); }
.help-contact .nc-link--external { display: inline-flex; align-items: center; gap: var(--ds-space-1); }

.help-ask-main { max-width: none !important; }
.help-review { display: grid; gap: var(--ds-space-4); padding: var(--ds-space-6); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.help-review h2, .help-review p { margin: 0; }
.help-review .help-review-details { padding: var(--ds-space-4); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
#question-sent h2 { display: flex; align-items: center; gap: var(--ds-space-2); }
.help-ask-main > .nc-alert[hidden] { display: none; }
.signin { padding-block: var(--ds-space-8) var(--ds-space-16); }
.signin-inner { display: grid; gap: var(--ds-space-6); max-width: 32rem; }
.signin .nc-alert { margin: 0; display: flex; gap: var(--ds-space-3); align-items: flex-start; }
.site .nc-pagehead:has(+ .signin) { min-height: 0; }

/* Sign in */
.signin-sent { display: grid; gap: var(--ds-space-3); justify-items: start; }
.signin-sent[hidden] { display: none; }
.signin-sent h2, .signin-sent p { margin: 0; }
.signin-mail { display: grid; gap: var(--ds-space-3); justify-items: start; width: 100%; margin-block-start: var(--ds-space-3); padding: var(--ds-space-5); background: var(--ds-color-surface-alt); border: 1px dashed var(--ds-color-border); border-radius: var(--ds-radius-md); }
.signin-mail p { margin: 0; }
.signin-mail-from { color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.signin-again { display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
#verify .nc-alert { margin: 0; }

/* Account area: navigation on the left, content on the right */
.account { display: grid; gap: var(--ds-space-8); padding-block: var(--ds-space-8) var(--ds-space-16); align-items: start; }
@media (min-width: 900px) { .account { grid-template-columns: 16rem minmax(0, 1fr); gap: var(--ds-space-10); } .account-nav { position: sticky; top: var(--ds-space-6); } }
.account-nav { padding: var(--ds-space-4); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.account-hello { margin: 0 0 var(--ds-space-3); padding: 0 var(--ds-space-2); font-size: var(--ds-text-small); color: var(--ds-color-text-muted); overflow-wrap: anywhere; }
.account-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.nc .account-nav a { display: flex; align-items: center; gap: var(--ds-space-3); min-height: var(--ds-control-height-sm); padding: var(--ds-space-2) var(--ds-space-3); border-radius: var(--ds-radius-sm); color: var(--ds-color-text); text-decoration: none; font-weight: var(--ds-weight-semibold); }
.nc .account-nav a:hover { background: var(--ds-color-surface); color: var(--ds-color-action-strong); }
.nc .account-nav a[aria-current="page"] { background: var(--ds-color-surface); color: var(--ds-color-action); box-shadow: inset 3px 0 0 var(--ds-color-action); }
.account-nav a .nc-icon { color: var(--ds-color-action); }
.account-nav .nc-badge-count { margin-inline-start: auto; }
.account-nav-out { margin-block-start: var(--ds-space-2); padding-block-start: var(--ds-space-2); border-block-start: 1px solid var(--ds-color-border); }
.account-main { display: grid; gap: var(--ds-space-5); min-width: 0; }
.account-main > .nc-breadcrumb { margin: 0; }
.account-title { margin: 0; font-size: var(--ds-text-h1); line-height: var(--ds-leading-h1); }
.account-lead { margin: 0; font-size: var(--ds-text-body-lg); }
.account-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); }
.account-tiles > li { display: grid; }
.account-empty { justify-items: start; gap: var(--ds-space-3); }
.account-empty[hidden] { display: none; }
.account-empty h2 { margin: 0; }
.account-form { max-width: 44rem; gap: var(--ds-space-8); }
.account-section { display: grid; gap: var(--ds-space-4); padding-block-start: var(--ds-space-6); border-block-start: 1px solid var(--ds-color-border); }
.account-form > .account-section:first-of-type { border: 0; padding: 0; }
.account-section h2 { margin: 0; font-size: var(--ds-text-h3); }
.account-section > p { margin: 0; }
.account-messages { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); }
.account-messages[hidden] { display: none; }
.account-message { display: grid; gap: var(--ds-space-2); padding: var(--ds-space-5); background: var(--ds-color-surface); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.account-message > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--ds-space-2); }
.account-message p { margin: 0; }
.account-message small { color: var(--ds-color-text-muted); }
#profile-saved[hidden] { display: none; }

/* Footer stays at the bottom when a page is short */
body.site { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body.site > main { flex: 1 0 auto; display: flex; flex-direction: column; }
body.site > main > * { flex: none; }
/* Short task pages: one panel centered in the space between header and footer */
body.site > main > .site-focus { flex: 1 0 auto; display: grid; place-items: center; padding-block: var(--ds-space-12); }
.focus-panel { width: 100%; max-width: 26rem; }
.focus-form { display: grid; gap: var(--ds-space-4); justify-items: stretch; text-align: center; }
.focus-form[hidden] { display: none; }
.focus-form > .nc-goal-mark { justify-self: center; }
.nc .focus-form h1 { margin: 0; font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); }
.focus-form p { margin: 0; }
.focus-form .nc-field { text-align: start; }
.focus-form .nc-error-summary { text-align: start; }
.focus-note { display: grid; gap: var(--ds-space-3); padding: var(--ds-space-4); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
.focus-links { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--ds-space-2) var(--ds-space-5); }
.nc .nc-link-btn:hover { color: var(--ds-color-action-strong); }
.nc .nc-link-btn:focus-visible { outline: var(--ds-focus-width) solid var(--ds-color-focus); outline-offset: var(--ds-focus-offset); }

/* Learner or employer switch: a sliding highlight */
.focus-switch { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 4px; background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-pill); }
.focus-switch-thumb { position: absolute; inset-block: 4px; inset-inline-start: 4px; width: calc(50% - 4px); background: var(--ds-color-surface); border-radius: var(--ds-radius-pill); box-shadow: var(--ds-shadow-raised); transition: transform 250ms ease; }
.focus-switch[data-role="employer"] .focus-switch-thumb { transform: translateX(100%); }
[dir="rtl"] .focus-switch[data-role="employer"] .focus-switch-thumb { transform: translateX(-100%); }
.nc .focus-switch button { position: relative; min-height: var(--ds-control-height-sm); border: 0; background: none; border-radius: var(--ds-radius-pill); font: inherit; font-weight: var(--ds-weight-semibold); color: var(--ds-color-text); cursor: pointer; transition: color 250ms ease; }
.nc .focus-switch button[aria-pressed="true"] { color: var(--ds-color-action); }
.nc .focus-switch button:focus-visible { outline: var(--ds-focus-width) solid var(--ds-color-focus); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .focus-switch-thumb, .nc .focus-switch button { transition: none; } }
.focus-card { display: grid; gap: var(--ds-space-4); padding: var(--ds-space-8) var(--ds-space-6); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.focus-card > .nc-goal-mark { justify-self: center; background: var(--ds-color-surface); --nc-duo: var(--ds-color-highlight); --nc-duo-opacity: 1; }
.focus-card .nc-input { background: var(--ds-color-surface); }
.focus-card .focus-note { background: var(--ds-color-surface); }
.focus-panel .nc-goal-mark { --nc-duo: var(--ds-color-highlight); --nc-duo-opacity: 1; }
.focus-form [data-for][hidden] { display: none; }
.focus-form { gap: var(--ds-space-5); }
.focus-panel { max-width: 28rem; }

/* Account shells */
.account-group { margin: var(--ds-space-4) 0 var(--ds-space-1); padding: 0 var(--ds-space-3); font-size: var(--ds-text-small); font-weight: var(--ds-weight-semibold); color: var(--ds-color-text-muted); }
.account-nav > ul + ul { margin-block-start: var(--ds-space-2); }
.account--welcome { grid-template-columns: minmax(0, 44rem) !important; justify-content: center; }
.account-card { display: grid; gap: var(--ds-space-3); padding: var(--ds-space-5) var(--ds-space-6); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.account-card h2 { margin: 0; font-size: var(--ds-text-h4); }
.account-card p { margin: 0; }
.account-muted { color: var(--ds-color-text-muted); }
.account-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-2); }
.account-steps li { display: flex; align-items: center; gap: var(--ds-space-3); }
.account-steps .nc-icon { color: var(--ds-color-text-muted); }
.account-steps li.is-done { color: var(--ds-color-text-muted); text-decoration: line-through; }
.account-steps li.is-done .nc-icon { color: var(--ds-color-success-text, green); }
.account-later { display: flex; gap: var(--ds-space-2); align-items: flex-start; margin: 0; font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
.account-later .nc-icon { flex: none; margin-block-start: .15rem; }
.account-split { display: grid; gap: var(--ds-space-4); }
@media (min-width: 768px) { .account-split { grid-template-columns: 1fr 1fr; } }
.account-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-3); }
.account-stats li { display: grid; gap: var(--ds-space-1); padding: var(--ds-space-4) var(--ds-space-5); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.account-stats b { font-size: var(--ds-text-h2); color: var(--ds-color-action); }
.account-stats span { color: var(--ds-color-text-muted); font-size: var(--ds-text-small); }
.account-admins { list-style: none; margin: 0; padding: 0; }
.account-admins li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-1) var(--ds-space-3); padding: var(--ds-space-3) var(--ds-space-4); border: 1px solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.account-admins span:not(.nc-tag) { color: var(--ds-color-text-muted); }
[data-saved][hidden] { display: none; }
.account-form .nc-field, .account-form .nc-input, .account-form .nc-select, .account-form .nc-search-box { max-width: none; width: 100%; }

.account-nav-fold > summary { display: none; }
@media (max-width: 899px) {
  .account-nav { padding: var(--ds-space-2); }
  .account-nav-fold > summary { display: flex; align-items: center; gap: var(--ds-space-3); min-height: var(--ds-control-height-sm); padding: var(--ds-space-2) var(--ds-space-3); font-weight: var(--ds-weight-semibold); color: var(--ds-color-action); cursor: pointer; list-style: none; }
  .account-nav-fold > summary::-webkit-details-marker { display: none; }
  .account-nav-fold[open] > summary { margin-block-end: var(--ds-space-2); }
  .account { gap: var(--ds-space-5); padding-block-start: var(--ds-space-5); }
}

/* Course page */
.course-page { padding-block: var(--ds-space-6) var(--ds-space-16); display: grid; gap: var(--ds-space-6); }
.course-top { display: grid; gap: var(--ds-space-3); }
.course-top .nc-breadcrumb[hidden], .course-top .nc-back[hidden] { display: none; }
.course-top .nc-course-head { display: grid; gap: var(--ds-space-3); }
.nc .course-top .nc-course-title { margin: 0; font-size: var(--ds-text-display); line-height: var(--ds-leading-display); max-width: 48rem; }
.course-top-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-3) var(--ds-space-5); }
.course-top-row .nc-campus { margin: 0; flex: 1 1 18rem; }
.course-campus-logo { height: 2.5rem; width: auto; max-width: 10rem; object-fit: contain; }
.course-top-actions { display: flex; gap: var(--ds-space-1); }
.course-facts { margin: 0; }
/* Two columns: content, and a decision column that stays in view */
.course-layout { display: grid; gap: var(--ds-space-6); align-items: start; }
@media (min-width: 1024px) {
  .course-layout { grid-template-columns: minmax(0, 1fr) 23rem; gap: var(--ds-space-10); }
  .course-aside { position: sticky; top: var(--ds-space-4); max-height: calc(100vh - var(--ds-space-8)); display: flex; flex-direction: column; }
  .course-choose { min-height: 0; display: flex; flex-direction: column; }
  .course-choose-list { overflow: auto; min-height: 6rem; overscroll-behavior: contain; padding: 2px; margin: -2px; }
}
@media (max-width: 1023px) { .course-aside { order: -1; } }
.course-main { display: grid; gap: var(--ds-space-8); min-width: 0; }
.course-sec { display: grid; gap: var(--ds-space-3); }
.nc .course-sec > h2 { margin: 0; font-size: var(--ds-text-h2); line-height: var(--ds-leading-h2); }
.course-sec p { margin: 0; }
.course-sec > p, .course-sec .nc-readmore-text { max-width: 44rem; }
.course-sec .nc-outcomes, .course-sec .nc-block { max-width: none; }
.course-skills { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-2) var(--ds-space-6); grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr)); }
.course-skills li { display: flex; gap: var(--ds-space-2); align-items: flex-start; }
.course-skills .nc-icon { color: var(--ds-color-action); flex: none; margin-block-start: .2rem; }
.course-bullets { margin: 0; padding-inline-start: var(--ds-space-5); display: grid; gap: var(--ds-space-2); }
.course-careers { margin: 0; }
/* Decision column: price and action first, the class list below */
.course-aside { gap: var(--ds-space-4); padding: var(--ds-space-5); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.course-decide { display: grid; gap: var(--ds-space-2); padding-block-end: var(--ds-space-4); border-block-end: 1px solid var(--ds-color-border); }
.course-price { margin: 0; font-weight: var(--ds-weight-regular); }
.course-price b { font-size: var(--ds-text-h1); line-height: 1.1; }
.course-price span { color: var(--ds-color-text-muted); }
.course-chosen { margin: 0; font-weight: var(--ds-weight-semibold); }
.course-chosen:empty { display: none; }
.course-action { display: grid; gap: var(--ds-space-2); margin-block-start: var(--ds-space-2); }
.course-action p:empty { display: none; }
.course-choose { display: grid; gap: var(--ds-space-3); }
.nc .course-aside-title { margin: 0; font-size: var(--ds-text-h4); }
.course-aside .nc-sections { margin: 0; display: grid; gap: var(--ds-space-2); }
.course-aside .nc-option { background: var(--ds-color-surface); padding: var(--ds-space-3) var(--ds-space-4); }
.course-aside .nc-option-row { flex-wrap: wrap; gap: var(--ds-space-1) var(--ds-space-2); }
.course-aside .nc-option-note { margin: var(--ds-space-1) 0 0; font-size: var(--ds-text-small); }
/* Questions and campus, in the main column */
.course-campus-card { display: flex; gap: var(--ds-space-4); align-items: flex-start; padding: var(--ds-space-5); border: var(--ds-border-width-strong) solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.course-campus-card img { height: 2.5rem; width: auto; max-width: 9rem; object-fit: contain; flex: none; }
.course-campus-card > div { display: grid; gap: var(--ds-space-1); min-width: 0; overflow-wrap: anywhere; }
.course-campus-name { font-weight: var(--ds-weight-bold); }
.course-campus-links { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-5); margin-block-start: var(--ds-space-2) !important; }
@media (max-width: 599px) { .course-campus-card { flex-direction: column; } }
/* Getting there */
.course-map { height: 18rem; border-radius: var(--ds-radius-md); background: var(--ds-color-surface-alt); border: 1px solid var(--ds-color-border); z-index: 0; }
.course-there-form { display: flex; flex-wrap: wrap; align-items: end; gap: var(--ds-space-3); }
.course-there-form .nc-field { flex: 1 1 14rem; max-width: 20rem; }
.course-there-msg:empty { display: none; }
.course-there-msg, .course-there-plan { font-weight: var(--ds-weight-semibold); }
.course-trips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
.course-address { line-height: 1.4; }
/* More like this */
.course-more { display: grid; gap: var(--ds-space-5); padding-block-start: var(--ds-space-8); border-block-start: 1px solid var(--ds-color-border); }
.nc .course-more h2 { margin: 0; font-size: var(--ds-text-h2); }
.course-more-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-4); grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); }
.course-more-list > li { display: grid; }
.course-sticky[hidden] { display: none; }
@media (min-width: 1024px) { .course-sticky { display: none !important; } }
[data-eligibility][hidden] { display: none; }
.course-aside .nc-sections > legend + .nc-sections-help, .course-aside .nc-sections > legend + .nc-option { margin-block-start: 0; }

.course-group { padding-block-start: var(--ds-space-2); }
.course-group > summary { cursor: pointer; color: var(--ds-color-action); font-weight: var(--ds-weight-semibold); text-decoration: underline; text-underline-offset: .2em; }
.course-group[open] > summary { margin-block-end: var(--ds-space-3); }
.course-group-form { display: grid; gap: var(--ds-space-3); }
.course-group-form .nc-input { max-width: 8rem; background: var(--ds-color-surface); }
.course-group-row { display: flex; align-items: center; gap: var(--ds-space-4); }
.course-group-msg { margin: var(--ds-space-3) 0 0; font-weight: var(--ds-weight-semibold); }
.course-group-msg:empty { display: none; }
.course-group-next { display: grid; gap: var(--ds-space-2); margin-block-start: var(--ds-space-3); }
.course-group-next[hidden] { display: none; }
.course-sticky .nc-sticky-info { flex: 1 1 auto; }
.course-sticky .nc-btn { flex: none; }
.course-aside .course-muted, .course-option-lines { line-height: 1.4; }
/* Course banner: course on the left, campus logo on the right */
.site .course-head-band { padding: var(--ds-space-6) 0 var(--ds-space-8); }
.course-band { display: grid; gap: var(--ds-space-5); align-items: center; }
@media (min-width: 900px) { .course-band { grid-template-columns: minmax(0, 1fr) auto; gap: var(--ds-space-10); } }
.course-band-text { display: grid; gap: var(--ds-space-3); min-width: 0; }
.course-band-text .nc-breadcrumb[hidden], .course-band-text .nc-back[hidden] { display: none; }
.nc .course-band .nc-course-title { margin: 0; font-size: var(--ds-text-display); line-height: var(--ds-leading-display); max-width: 48rem; }
.course-band-campus { margin: 0; color: var(--ds-color-text-muted); }
.course-band-campus b { color: var(--ds-color-text); }
.course-band-logo { display: grid; place-items: center; width: 16rem; height: 9rem; padding: var(--ds-space-5); background: var(--ds-color-surface); border: 1px solid var(--ds-color-border); border-radius: var(--ds-radius-md); }
.course-band-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 899px) { .course-band-logo { order: -1; width: auto; height: auto; justify-self: start; padding: var(--ds-space-2) var(--ds-space-3); } .course-band-logo img { height: 2.5rem; width: auto; max-width: 11rem; } }
.course-band .course-top-row { gap: var(--ds-space-3) var(--ds-space-5); }
.site .nc-pagehead.course-head-band { min-height: 0; }
@media (max-width: 899px) {
  .course-band { gap: var(--ds-space-3); }
  .course-band-text { display: contents; }
  .course-band-text > .nc-breadcrumb, .course-band-text > .nc-back { order: 0; }
  .course-band-logo { order: 1; }
  .course-band-text > .nc-course-head { order: 2; }
}
.course-more { margin-block-start: var(--ds-space-12); padding-block-start: var(--ds-space-10); }

/* Sign up on this site */
.site .nc-pagehead:has(+ .signup) { min-height: 0; }
.signup { display: grid; gap: var(--ds-space-8); padding-block: var(--ds-space-8) var(--ds-space-16); align-items: start; }
@media (min-width: 1024px) { .signup { grid-template-columns: minmax(0, 1fr) 22rem; gap: var(--ds-space-12); } .signup-side { position: sticky; top: var(--ds-space-4); } }
@media (max-width: 1023px) { .signup .signup-side { display: contents; } .signup-summary { order: -1; } .signup-facts, .signup-map, .signup-contact { order: 2; } }
.signup-main { display: grid; gap: var(--ds-space-6); min-width: 0; max-width: 44rem; }
.signup-fields, .signup-known { display: grid; gap: var(--ds-space-4); }
.signup-fields[hidden], .signup-known[hidden], .signup-fields .nc-field[hidden] { display: none; }
.signup-known .nc-link-btn { justify-self: start; }
.signup-checks { display: grid; gap: var(--ds-space-3); }
.signup-checks:empty { display: none; }
.signup-actions { justify-content: space-between; }
.signup-summary { display: grid; gap: var(--ds-space-2); padding: var(--ds-space-5); background: var(--ds-color-surface-alt); border-radius: var(--ds-radius-md); }
.signup-summary p { margin: 0; }
.signup-summary-title { font-weight: var(--ds-weight-bold); font-size: var(--ds-text-h4); }
.signup-summary-class { font-weight: var(--ds-weight-semibold); }
.signup-contact { margin: var(--ds-space-3) 0 0; overflow-wrap: anywhere; }
.signup-contact:empty { display: none; }
.signup-sent h3 { margin: var(--ds-space-2) 0 0; font-size: var(--ds-text-h4); }
@media print {
  .site-header, .site-footer, .nc-pagehead, .signup-side, .signup-sent-actions, .nc-skip { display: none !important; }
  .signup { display: block; padding: 0; }
}
/* Handoff to a campus website */
.course-handoff-tell { min-height: 0; }
.course-return { display: grid; gap: var(--ds-space-2); padding: var(--ds-space-3) var(--ds-space-4); background: var(--ds-color-surface); border: 1px solid var(--ds-color-border); border-inline-start: var(--ds-highlight-width) solid var(--ds-color-highlight); border-radius: var(--ds-radius-sm); }
.course-return[hidden], .course-return-btns[hidden], .course-return [hidden] { display: none; }
.course-return-q { margin: 0; font-weight: var(--ds-weight-semibold); }
.course-return-btns { display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
.account-class-ask { display: grid; gap: var(--ds-space-2); margin-block-start: var(--ds-space-3); padding-block-start: var(--ds-space-3); border-block-start: 1px solid var(--ds-color-border); }
.account-class-ask p { margin: 0; font-weight: var(--ds-weight-semibold); }
.signup-sent h2 { display: flex; align-items: center; gap: var(--ds-space-2); }
.course-alt { justify-self: start; font-size: var(--ds-text-small); text-align: start; margin-block: var(--ds-space-4) var(--ds-space-3); }

/* Dashboard lists */
.dash-pair { display: grid; gap: var(--ds-space-5); }
@media (min-width: 900px) { .dash-pair { grid-template-columns: 1fr 1fr; } }
.dash-pair > .account-card { align-content: start; }
.dash-list { list-style: none; margin: 0; padding: 0; display: grid; }
.dash-list[hidden], [data-dash-more][hidden], [data-dash-empty][hidden] { display: none; }
.dash-list li + li { border-block-start: 1px solid var(--ds-color-border); }
.dash-list a { display: grid; gap: 2px; padding-block: var(--ds-space-3); text-decoration: none; color: inherit; }
.dash-list a b { color: var(--ds-color-action); text-decoration: underline; text-underline-offset: .2em; }
.dash-list a span { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
.dash-list a:hover b { text-decoration-thickness: 2px; }
.account-due { margin: var(--ds-space-2) 0 0; font-weight: var(--ds-weight-semibold); color: var(--ds-status-waitlist-text, inherit); }
.account-pay { margin-block-start: var(--ds-space-2); }
.account-pay summary { cursor: pointer; color: var(--ds-color-action); font-weight: var(--ds-weight-semibold); text-decoration: underline; }
.account-pay p { margin: var(--ds-space-2) 0 0; }
/* Sign-up: payment choices */
.signup-due { font-weight: var(--ds-weight-bold); }
.signup-due:empty { display: none; }
[data-signup-questions][hidden], [data-signup-emergency][hidden], [data-signup-prereq][hidden] { display: none; }
/* Register a group */
.group-form { display: grid; gap: var(--ds-space-8); max-width: 52rem; }
.group-form[hidden], .group-paste[hidden], [data-group-missing][hidden] { display: none; }
.group-sec { display: grid; gap: var(--ds-space-3); }
.nc .group-sec > h2 { margin: 0; font-size: var(--ds-text-h3); }
.group-course p { margin: 0; }
.group-summary { margin: 0; font-weight: var(--ds-weight-semibold); }
.group-paste { display: grid; gap: var(--ds-space-3); max-width: 36rem; }

.signup-eyebrow { margin: 0; font-weight: var(--ds-weight-semibold); color: var(--ds-color-action); }
.account-section[hidden] { display: none; }
.signup-form .nc-sections { margin: 0; display: grid; gap: var(--ds-space-2); border: 0; padding: 0; }
.signup-welcome { grid-column: 1 / -1; max-width: 44rem; }
.signup-welcome[hidden] { display: none; }
@media (max-width: 1023px) { .signup-welcome { order: -2; } }
.signup-side { display: grid; gap: var(--ds-space-4); align-content: start; }
.signup-facts { margin: 0; grid-template-columns: 1fr !important; }
.signup-facts > div { padding: var(--ds-space-3) var(--ds-space-4); }
.signup-map { display: grid; gap: var(--ds-space-2); }
.signup-map[hidden] { display: none; }
.nc .signup-map h3 { margin: 0; font-size: var(--ds-text-h4); }
.signup-map .course-map { height: 12rem; }
.signup-map p { margin: 0; }
.signup-contact { margin: 0; }
@media (min-width: 1024px) { .signup-side { position: static; } }
/* Confirmation: use the full column, and give each part room */
.signup-main:has(> .signup-sent:not([hidden])) { max-width: none; }
.signup-sent { gap: var(--ds-space-5); padding: var(--ds-space-8); }
.signup-sent > h2 { font-size: var(--ds-text-h2); }
.signup-sent > [data-signup-ref-line] { margin-block-start: calc(var(--ds-space-3) * -1); }
.signup-sent > .signup-details { padding-block: var(--ds-space-5); border-block: 1px solid var(--ds-color-border); gap: var(--ds-space-3); }
.signup-sent > h3 { margin: 0; }
.signup-sent > h3 + p { margin-block-start: calc(var(--ds-space-3) * -1); max-width: 44rem; }
.signup-sent-actions { margin-block-start: var(--ds-space-2); }
@media (max-width: 599px) { .signup-sent { padding: var(--ds-space-5); } }
@media (max-width: 1023px) { .signup:has(.signup-sent:not([hidden])) .signup-summary { order: 2; } }
/* Prototype note: a reviewer's redline, deliberately unlike any product component */
.proto-note { margin: 0; padding: var(--ds-space-2) var(--ds-space-3); border: 2px dashed #c8102e; border-radius: 4px; color: #a00d24; background: #fff5f6; font-size: var(--ds-text-small); }
.proto-note b { color: inherit; }
/* Phone menu: language choice, since the top strip hides it on small screens */
.nc-header-panel-lang { display: flex; align-items: center; gap: var(--ds-space-3); padding-block-start: var(--ds-space-3); border-block-start: 1px solid rgba(255,255,255,.25); }
.nc-header-panel-lang > span { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-4); }
.nc .nc-header-panel .nc-header-panel-lang a { padding: 0; border: 0; min-height: 2.75rem; display: inline-flex; align-items: center; }
@media (min-width: 768px) { .nc-header-panel-lang { display: none; } }

/* Dashboard (learner and employer): white panels, one accent per job, filled icons */
.dash { display: grid; gap: var(--ds-space-5); }
@media (min-width: 1000px) { .dash { grid-template-columns: repeat(3, minmax(0, 1fr)); } .dash-attention, .dash-classes { grid-column: span 2; } }
.dash-panel { display: grid; gap: var(--ds-space-4); align-content: start; padding: var(--ds-space-5) var(--ds-space-6); background: var(--ds-color-surface); border: 1px solid var(--ds-color-border); border-radius: var(--ds-radius-md); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
.dash-panel[hidden] { display: none; }
.nc .dash-panel h2 { margin: 0; font-size: var(--ds-text-h4); }
.dash-panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ds-space-3); }
.dash-panel-head .nc-link[hidden] { display: none; }
.dash-attention { border-block-start: 4px solid var(--ds-color-highlight); }
/* Actions that need the person */
.dash-actions, .dash-dates { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-2); }
.dash-actions[hidden], .dash-dates[hidden] { display: none; }
.dash-actions a, .dash-dates a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--ds-space-3); padding: var(--ds-space-3) var(--ds-space-4); border: 1px solid var(--ds-color-border); border-radius: var(--ds-radius-md); color: inherit; text-decoration: none; background: var(--ds-color-surface); transition: border-color var(--ds-duration-hover) var(--ds-easing), background-color var(--ds-duration-hover) var(--ds-easing); }
.dash-actions a:hover, .dash-dates a:hover { border-color: var(--ds-color-action); background: var(--ds-color-action-subtle); }
.dash-actions a > .nc-icon:last-child, .dash-dates a > .nc-icon:last-child { color: var(--ds-color-action); }
.dash-action-mark { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--ds-color-action-subtle); color: var(--ds-color-action); }
.dash-action-mark .nc-icon { width: 1.5rem; height: 1.5rem; }
.dash-action--pay .dash-action-mark { background: var(--ds-status-waitlist-bg, #fff4d6); color: var(--ds-status-waitlist-text, #7a4b00); }
.dash-action--ask .dash-action-mark { background: var(--ds-status-soon-bg, #f3e8ff); color: var(--ds-status-soon-text, #5b2a86); }
.dash-action-text { display: grid; gap: 2px; min-width: 0; }
.dash-action-text b { color: var(--ds-color-action); }
.dash-action-text > span { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); overflow-wrap: anywhere; }
/* Classes with a date badge */
.dash-dates a { grid-template-columns: auto minmax(0, 1fr); }
.dash-date { display: grid; place-items: center; width: 3.25rem; padding-block: var(--ds-space-1); border-radius: var(--ds-radius-sm); background: var(--ds-color-action); color: var(--ds-color-on-action, #fff); line-height: 1.1; }
.dash-date small { font-size: var(--ds-text-small); text-transform: uppercase; letter-spacing: .04em; }
.dash-date b { font-size: var(--ds-text-h3); }
/* Calm empty states */
.dash-calm { display: flex; align-items: center; gap: var(--ds-space-3); }
.dash-calm[hidden] { display: none; }
.dash-calm > .nc-icon { width: 2.5rem; height: 2.5rem; flex: none; color: var(--ds-color-action); }
.dash-calm p { margin: 0; }
/* Get started with progress */
.dash-progress { height: .5rem; border-radius: 999px; background: var(--ds-color-surface-alt); overflow: hidden; }
.dash-progress span { display: block; height: 100%; background: var(--ds-color-success-text, #1b6b3a); border-radius: inherit; transition: width var(--ds-duration) var(--ds-easing); }
.dash-progress-text { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
/* Employer numbers */
.dash-stats { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); }
.dash-stats li { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: var(--ds-space-3); align-items: center; padding: var(--ds-space-3) var(--ds-space-4); border-radius: var(--ds-radius-md); background: var(--ds-color-action-subtle); }
.dash-stats .nc-icon { grid-row: span 2; width: 2rem; height: 2rem; color: var(--ds-color-action); }
.dash-stats b { font-size: var(--ds-text-h2); line-height: 1.1; }
.dash-stats span { font-size: var(--ds-text-small); color: var(--ds-color-text-muted); }
/* Everything in your account */
.nc .dash-more-title { margin: var(--ds-space-8) 0 0; font-size: var(--ds-text-h4); }
.dash-tile-mark .nc-icon { width: 1.75rem; height: 1.75rem; }
.dash-panel-head { flex-wrap: wrap; } .nc .dash-panel-head h2 { white-space: nowrap; }
/* Classes page: the same date badge as the dashboard */
.account-class { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--ds-space-4); align-items: start; }
.account-class-body { display: grid; gap: var(--ds-space-2); min-width: 0; }
.account-class-body > div:first-child { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ds-space-2) var(--ds-space-3); }
.account-class-body p, .account-class-body small { margin: 0; }
.account-message .nc-status { max-width: 100%; white-space: normal; }
.account-message.account-class > .account-class-body { display: grid; justify-content: stretch; gap: var(--ds-space-2); }
.account-class .dash-date small { color: inherit; font-size: var(--ds-text-small); }
.account-class-body small { overflow-wrap: normal; }
.account-message .nc-status { border-radius: var(--ds-radius-sm); }
/* Saved courses: the filled bookmark a course shows once saved */
.dash-saved-mark { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--ds-color-action-subtle); color: var(--ds-color-action); flex: none; }
.dash-saved-mark .nc-icon { width: 1.4rem; height: 1.4rem; }
.dash-saved-list a { grid-template-columns: auto minmax(0, 1fr); }
.dash-calm > .nc-icon[class] { color: var(--ds-color-action); }
