:root {
  --bunchee-navy: #1e2f63;
  --bunchee-navy-light: #293f82;
  --bunchee-yellow: #fac114;
  --bunchee-coral: #f0645a;
  --bunchee-ink: #1f2937;
  --bunchee-surface: #ffffff;
  --bunchee-background: #f7f8fb;
  --bunchee-border: #dfe4ee;
}

.course-site { background: var(--bunchee-background); color: var(--bunchee-ink); }
.course-site .course-skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; }
.course-site .course-skip-link:focus { top: 1rem; }
.course-site .course-header { background: #fff; border-bottom: 1px solid var(--bunchee-border); }
.course-site .course-brand-bar { background: var(--bunchee-coral); color: #fff; }
.course-site .course-nav { background: var(--bunchee-navy); }
.course-site .course-nav a:hover,
.course-site .course-nav a:focus-visible,
.course-site .course-nav a[aria-current="page"] { color: var(--bunchee-yellow); }
.course-site :focus-visible { outline: 3px solid var(--bunchee-yellow); outline-offset: 3px; }
.course-site .course-footer { background: var(--bunchee-navy); color: #fff; }
.course-site .card-shadow { box-shadow: 0 12px 30px rgba(30, 47, 99, .08); }

.course-site {
  min-height: 100vh;
  font-family: "Mitr", "Prompt", sans-serif;
}

.course-site .course-shell {
  width: min(100% - 2rem, 80rem);
  margin-inline: auto;
}

.course-site .course-skip-link {
  padding: .75rem 1rem;
  border-radius: .375rem;
  background: var(--bunchee-yellow);
  color: var(--bunchee-navy);
  font-weight: 600;
  text-decoration: none;
}

.course-site .course-header {
  position: sticky;
  top: 0;
  z-index: 50;
}

.course-site .course-brand-bar__inner,
.course-site .course-header__main,
.course-site .course-nav__inner {
  display: flex;
  align-items: center;
}

.course-site .course-brand-bar__inner {
  min-height: 2.25rem;
  justify-content: space-between;
  gap: 1rem;
  font-size: .8125rem;
}

.course-site .course-brand-contact {
  display: flex;
  gap: 1.25rem;
}

.course-site .course-brand-bar a,
.course-site .course-footer a {
  color: inherit;
}

.course-site .course-header__main {
  min-height: 5rem;
  justify-content: space-between;
  gap: 2rem;
}

.course-site .course-logo {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 2.75rem;
  align-items: center;
}

.course-site .course-logo img {
  display: block;
  width: auto;
  height: 3.75rem;
  object-fit: contain;
}

.course-site .course-association-nav,
.course-site .course-nav__inner {
  gap: 1.5rem;
}

.course-site .course-association-nav {
  display: flex;
  align-items: center;
}

.course-site .course-member-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .75rem;
  padding-left: 1rem;
  border-left: 1px solid var(--bunchee-border);
}

.course-site .course-member-actions a,
.course-site .course-mobile-member-actions a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  color: var(--bunchee-navy);
  font-size: .875rem;
  font-weight: 500;
  text-decoration: none;
}

.course-site .course-member-actions a:hover,
.course-site .course-member-actions a:focus-visible,
.course-site .course-mobile-member-actions a:hover,
.course-site .course-mobile-member-actions a:focus-visible {
  color: var(--bunchee-coral);
}

.course-site .course-member-actions__greeting {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .375rem;
  padding: .375rem .5rem;
  border: 0;
  border-radius: .375rem;
  background: transparent;
  color: var(--bunchee-ink);
  font-size: .8125rem;
  font-weight: 400;
  white-space: nowrap;
  cursor: pointer;
}

.course-site .course-member-dropdown {
  position: relative;
}

.course-site .course-member-actions__greeting i {
  color: var(--bunchee-navy);
  font-size: .6875rem;
  transition: transform .18s ease-out;
}

.course-site .course-member-actions__greeting[aria-expanded="true"] {
  background: #f1f4fb;
  color: var(--bunchee-navy);
}

.course-site .course-member-actions__greeting[aria-expanded="true"] i {
  transform: rotate(180deg);
}

.course-site .course-member-actions__greeting:focus-visible {
  outline: 2px solid var(--bunchee-navy);
  outline-offset: 2px;
}

.course-site .course-member-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + .375rem);
  right: 0;
  min-width: 10.5rem;
  padding: .375rem;
  border: 1px solid var(--bunchee-border);
  border-radius: .5rem;
  background: #fdfdfd;
  box-shadow: 0 .75rem 1.5rem rgba(30, 47, 99, .14);
}

.course-site .course-member-menu a {
  display: flex;
  min-height: 2.5rem;
  align-items: center;
  gap: .5rem;
  padding: .5rem .625rem;
  border-radius: .3125rem;
  color: var(--bunchee-ink);
  font-size: .8125rem;
}

.course-site .course-member-menu a:hover,
.course-site .course-member-menu a:focus-visible {
  background: #f1f4fb;
  color: var(--bunchee-navy);
}

.course-site .course-member-actions .course-member-actions__primary,
.course-site .course-mobile-member-actions .course-member-actions__primary {
  padding-inline: .875rem;
  border-radius: .375rem;
  background: var(--bunchee-navy);
  color: #f7f8fb;
}

.course-site .course-member-actions .course-member-actions__primary:hover,
.course-site .course-member-actions .course-member-actions__primary:focus-visible,
.course-site .course-mobile-member-actions .course-member-actions__primary:hover,
.course-site .course-mobile-member-actions .course-member-actions__primary:focus-visible {
  background: var(--bunchee-navy-light);
  color: var(--bunchee-yellow);
}

.course-site .course-member-message {
  padding-block: .625rem;
  border-top: 1px solid #f0d892;
  background: #fff6d8;
  color: var(--bunchee-ink);
  font-size: .875rem;
}

.course-site .course-association-nav a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  color: var(--bunchee-ink);
  font-size: .9375rem;
  font-weight: 500;
  text-decoration: none;
}

.course-site .course-association-nav a:hover,
.course-site .course-association-nav a:focus-visible {
  color: var(--bunchee-coral);
}

.course-site .course-nav__inner {
  min-height: 3rem;
}

.course-site .course-nav a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  color: #f7f8fb;
  font-size: .9375rem;
  font-weight: 500;
  text-decoration: none;
}

.course-site .course-menu-toggle {
  display: none;
  width: 2.75rem;
  height: 2.75rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--bunchee-border);
  border-radius: .375rem;
  background: var(--bunchee-surface);
  color: var(--bunchee-navy);
  font-size: 1.25rem;
}

.course-site .course-mobile-menu {
  display: none;
  padding: .5rem 1rem 1rem;
  background: var(--bunchee-surface);
  border-top: 1px solid var(--bunchee-border);
}

.course-site .course-footer {
  margin-top: 3rem;
}

.course-site .course-footer__grid {
  display: grid;
  grid-template-columns: minmax(15rem, 1.35fr) repeat(2, minmax(11rem, 1fr));
  gap: 3rem;
  padding-block: 3.25rem;
}

.course-site .course-footer__brand img {
  width: min(100%, 12.5rem);
  height: auto;
  padding: .625rem .3125rem .3125rem;
  object-fit: contain;
}

.course-site .course-footer__brand p {
  max-width: 34ch;
  margin: 1rem 0 0;
  color: #e2e8f6;
  font-size: .9375rem;
  line-height: 1.7;
}

.course-site .course-footer h2 {
  margin: 0 0 1rem;
  color: var(--bunchee-yellow);
  font-size: 1rem;
  font-weight: 600;
}

.course-site .course-footer__links,
.course-site .course-footer__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .75rem;
}

.course-site .course-footer__links a,
.course-site .course-footer__contact a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .625rem;
  color: #e2e8f6;
  font-size: .9rem;
  text-decoration: none;
}

.course-site .course-footer a:hover,
.course-site .course-footer a:focus-visible {
  color: var(--bunchee-yellow);
}

.course-site .course-footer__legal {
  padding-block: 1rem;
  border-top: 1px solid rgba(226, 232, 246, .2);
  color: #c7d2eb;
  font-size: .8125rem;
  text-align: center;
}

/* Keep the course card spacious without Bootstrap's p-4/p-5 utilities overriding it. */
.course-site .course-card__content {
  padding: 1rem;
}

.course-site .course-card__info {
  padding: 1.5rem;
}

/* Font Awesome 6 class compatibility for the bundled Font Awesome 5 assets. */
.course-site .fa-solid,
.course-site .fa-regular,
.course-site .fa-brands {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}

.course-site .fa-solid {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
}

.course-site .fa-regular {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 400;
}

.course-site .fa-brands {
  font-family: 'Font Awesome 5 Brands';
  font-weight: 400;
}

.course-site .fa-calendar-days:before { content: "\f073"; }
.course-site .fa-camera-rotate:before { content: "\f083"; }
.course-site .fa-chalkboard-user:before { content: "\f51c"; }
.course-site .fa-circle-check:before { content: "\f058"; }
.course-site .fa-circle-info:before { content: "\f05a"; }
.course-site .fa-circle-question:before { content: "\f059"; }
.course-site .fa-circle-xmark:before { content: "\f057"; }
.course-site .fa-cloud-arrow-up:before { content: "\f382"; }
.course-site .fa-file-arrow-up:before { content: "\f574"; }
.course-site .fa-file-lines:before { content: "\f15c"; }
.course-site .fa-house:before { content: "\f015"; }
.course-site .fa-id-card-clip:before { content: "\f2c2"; }
.course-site .fa-list-check:before { content: "\f0ae"; }
.course-site .fa-location-dot:before { content: "\f3c5"; }
.course-site .fa-magnifying-glass:before { content: "\f002"; }
.course-site .fa-map-location-dot:before { content: "\f5a0"; }
.course-site .fa-star-o:before { content: "\f005"; }
.course-site .fa-trash-can:before { content: "\f2ed"; }
.course-site .fa-triangle-exclamation:before { content: "\f071"; }

@media (max-width: 991.98px) {
  .course-site .course-association-nav,
  .course-site .course-member-actions {
    display: none;
  }

  .course-site .course-menu-toggle {
    display: inline-flex;
  }

  .course-site .course-nav {
    display: none;
  }

  .course-site .course-mobile-menu:not([hidden]) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .25rem;
  }

  .course-site .course-mobile-menu a {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    padding: .5rem .75rem;
    border-radius: .375rem;
    color: var(--bunchee-ink);
    font-size: .9375rem;
    font-weight: 500;
    text-decoration: none;
  }

  .course-site .course-mobile-menu a:hover,
  .course-site .course-mobile-menu a:focus-visible,
  .course-site .course-mobile-menu a[aria-current="page"] {
    background: #f1f4fb;
    color: var(--bunchee-navy);
  }

  .course-site .course-mobile-member-actions {
    display: contents;
  }

  .course-site .course-mobile-member-actions .course-member-actions__greeting {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    padding: .5rem .75rem;
  }
}

@media (max-width: 767.98px) {
  .course-site .course-mobile-menu[hidden] { display: none; }
  .course-site .course-mobile-menu { max-height: calc(100vh - 5rem); overflow-y: auto; }

  .course-site .course-card__info--wide {
    margin-inline: -.75rem;
    padding: 1rem;
  }


  .course-site .course-footer__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding-block: 2.5rem;
  }
}

@media (max-width: 479.98px) {
  .course-site .course-brand-contact a[href^="mailto:"] {
    display: none;
  }

  .course-site .course-logo img {
    height: 3.25rem;
  }

  .course-site .course-mobile-menu:not([hidden]) {
    grid-template-columns: 1fr;
  }
}