/* Courses page composed from native Elementor containers and widgets. */
.mtr-course-page,
.mtr-course-page * {
  box-sizing: border-box;
}

.elementor .e-con.mtr-course-page {
  display: block;
  width: 100%;
  max-width: 960px;
  margin: 0 auto var(--semantic-space-outer-m);
  color: var(--ui-text-default);
}

.mtr-course-page .elementor-widget,
.mtr-course-page .elementor-widget-container,
.mtr-course-page .elementor-heading-title,
.mtr-course-page p {
  margin: 0;
}

.elementor .mtr-course-page .mtr-course-page__intro {
  display: grid;
  margin-bottom: var(--semantic-space-inner-llll);
  padding-bottom: var(--semantic-space-inner-ll);
  border-bottom: 1px solid var(--ui-line-default);
  gap: var(--semantic-space-inner-s);
}

.mtr-course-page__eyebrow .elementor-heading-title {
  color: var(--ui-text-brand-primary);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.mtr-course-page__heading .elementor-heading-title {
  color: var(--ui-text-default);
  font-size: 28px;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: 1.4px;
  font-feature-settings: "palt" 1;
}

.mtr-course-page__copy {
  max-width: 760px;
}

.mtr-course-page__copy p {
  font-size: 16px;
  line-height: 28px;
}

.mtr-course-page__note p {
  color: var(--ui-text-light);
  font-size: 14px;
  line-height: 24px;
}

.elementor .mtr-course-page .mtr-course-list {
  display: grid;
  gap: var(--semantic-space-inner-l);
}

.elementor .mtr-course-page .mtr-course-card {
  display: block;
  overflow: hidden;
  border: 1px solid var(--ui-line-default);
  border-radius: var(--semantic-corner-radius-m);
  background: var(--ui-background-default);
}

.elementor .mtr-course-page .mtr-course-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, max-content);
  align-items: start;
  padding: var(--semantic-space-inner-l);
  border-bottom: 1px solid var(--ui-line-thin);
  background: var(--ui-background-ultra-light);
  gap: var(--semantic-space-inner-l);
}

.elementor .mtr-course-page .mtr-course-card__title-block {
  display: grid;
  gap: var(--semantic-space-inner-s);
}

.mtr-course-card__title .elementor-heading-title {
  color: var(--ui-text-brand-primary);
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 1.32px;
  font-feature-settings: "palt" 1;
}

.mtr-course-card__title a {
  color: var(--ui-text-brand-primary);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
}

.mtr-course-card__title a:hover {
  color: var(--ui-status-hover);
}

.mtr-course-card__title a:focus-visible {
  border-radius: var(--semantic-corner-radius-s);
  outline: 3px solid var(--ui-line-status-focus);
  outline-offset: 2px;
}

.mtr-course-card__instructors p,
.mtr-course-card__code p {
  display: grid;
  gap: var(--semantic-space-inner-sss);
}

.mtr-course-card__instructors p {
  font-size: 14px;
  line-height: 24px;
}

.mtr-course-card__instructors span,
.mtr-course-card__code span {
  color: var(--ui-text-light);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
}

.mtr-course-card__instructors strong {
  color: var(--ui-text-default);
  font-weight: 500;
}

.mtr-course-card__code {
  min-width: 160px;
  padding: var(--semantic-space-inner-s) var(--semantic-space-inner-m);
  border-left: 3px solid var(--brand-primary);
  border-radius: var(--semantic-corner-radius-s);
  background: var(--ui-background-default);
}

.mtr-course-card__code strong {
  color: var(--ui-text-brand-primary);
  font-size: 18.29px;
  line-height: 24px;
}

.elementor .mtr-course-page .mtr-course-card__body {
  display: grid;
  padding: var(--semantic-space-inner-l);
  gap: var(--semantic-space-inner-m);
}

.mtr-course-card__body-heading .elementor-heading-title {
  color: var(--ui-text-default);
  font-size: 18.29px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 1.2px;
  font-feature-settings: "palt" 1;
}

.mtr-course-card__body-copy p {
  font-size: 16px;
  line-height: 28px;
}

.mtr-course-card__body-copy p + p {
  margin-top: var(--semantic-space-inner-m);
}

@media screen and (max-width: 767px) {
  .elementor .e-con.mtr-course-page {
    margin-bottom: var(--semantic-space-outer-sss);
  }

  .elementor .mtr-course-page .mtr-course-page__intro {
    margin-bottom: var(--semantic-space-inner-ll);
    padding-bottom: var(--semantic-space-inner-l);
  }

  .mtr-course-page__heading .elementor-heading-title {
    font-size: 24px;
    line-height: 32px;
    letter-spacing: 1.32px;
  }

  .elementor .mtr-course-page .mtr-course-card__header {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--semantic-space-inner-m);
    gap: var(--semantic-space-inner-m);
  }

  .mtr-course-card__title .elementor-heading-title {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: 1.31px;
  }

  .mtr-course-card__code {
    width: 100%;
    min-width: 0;
  }

  .elementor .mtr-course-page .mtr-course-card__body {
    padding: var(--semantic-space-inner-m);
  }
}
