/* Shared Korean/Russian-inspired layout for course pages only. */
html body.course-page {
  --course-ui-red: #e82127;
  --course-ui-ink: #172b49;
  --course-ui-muted: #536174;
  --course-ui-blush: #fff3f4;
  overflow-x: clip;
}

html body.course-page main.course-details-page {
  color: var(--course-ui-ink);
  background: #fff;
}

html body.course-page main.course-details-page > section.course-details-main {
  padding: 38px 0 24px;
}

/* Standalone language templates use the same section components without the dynamic wrapper. */
html body.course-page:not(.mandarin-course-page) :is(.fr-countries-sec, .mssp-cefr-section) {
  color: var(--course-ui-ink);
}

html body.course-page:not(.mandarin-course-page) .fr-countries-grid,
html body.course-page:not(.mandarin-course-page) .gco-grid,
html body.course-page:not(.mandarin-course-page) .career-global-opportunity-list,
html body.course-page:not(.mandarin-course-page) .sabf-list {
  gap: 12px;
}

html body.course-page:not(.mandarin-course-page) .fr-countries-card,
html body.course-page:not(.mandarin-course-page) .gco-card,
html body.course-page:not(.mandarin-course-page) .career-workop-item,
html body.course-page:not(.mandarin-course-page) .mssp-cefr-card {
  border-radius: 14px;
}

html body.course-page:not(.mandarin-course-page) .mssp-cefr-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

html body.course-page:not(.mandarin-course-page) .mssp-cefr-card {
  min-width: 0;
  height: 100%;
}

html body.course-page:not(.mandarin-course-page) .mssp-cefr-card p,
html body.course-page:not(.mandarin-course-page) .why-learn-fr-desc,
html body.course-page:not(.mandarin-course-page) .why-learn-fr-content > p {
  text-align: justify;
  text-justify: inter-word;
}

html body.course-page main.course-details-page .course-details-main > .container {
  width: min(1180px, calc(100% - 40px));
  max-width: 1180px;
  margin-inline: auto;
  padding-inline: 0;
}

html body.course-page main.course-details-page .course-section-heading h2,
html body.course-page main.course-details-page .course-content-section h2,
html body.course-page main.course-details-page .cpb-copy h2,
html body.course-page main.course-details-page .li-section h2 {
  color: var(--course-ui-ink);
  line-height: 1.2;
  letter-spacing: -.02em;
}

html body.course-page main.course-details-page .course-section-subtitle,
html body.course-page main.course-details-page .course-rich-content,
html body.course-page main.course-details-page .cpb-rich,
html body.course-page main.course-details-page .li-section-head p,
html body.course-page main.course-details-page .li-tech-head p {
  color: var(--course-ui-muted);
  line-height: 1.7;
}

/* Country, Why Learn, and course-content panels use one consistent card system. */
html body.course-page main.course-details-page .fr-countries-sec {
  padding: 42px 0;
  background: var(--course-ui-blush);
}

html body.course-page main.course-details-page .fr-countries-sec > .container {
  width: min(1080px, calc(100% - 40px));
  max-width: 1080px;
}

html body.course-page main.course-details-page .fr-countries-heading-wrap {
  margin: 0 auto 22px;
  text-align: center;
}

html body.course-page main.course-details-page .fr-countries-title {
  color: var(--course-ui-ink);
  font-size: clamp(23px, 2.5vw, 32px);
  font-weight: 800;
}

html body.course-page main.course-details-page .fr-countries-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

html body.course-page main.course-details-page .fr-countries-card {
  min-height: 112px;
  padding: 13px;
  border: 1px solid #f1e4e6;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 7px 20px rgba(23, 43, 73, .05);
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-section {
  width: min(1180px, calc(100% - 40px));
  margin: 28px auto 34px;
  padding: 22px;
  border: 1px solid #edf0f4;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(20, 47, 79, .055);
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-layout {
  grid-template-columns: minmax(260px, .92fr) minmax(0, 1.08fr);
  gap: 26px;
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-image {
  min-height: 280px;
  border-radius: 15px;
  background: #fff4f5;
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-image img {
  min-height: 280px;
  object-fit: contain;
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-stat-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-stat {
  min-height: 82px;
  border: 1px solid #f4e0e1;
  border-radius: 13px;
  background: #fff1f1;
}

html body.course-page main.course-details-page .course-content-section,
html body.course-page main.course-details-page .cpb-section .cpb-card,
html body.course-page main.course-details-page .gco-card,
html body.course-page main.course-details-page .career-workop-item {
  border-color: #edf0f4;
  border-radius: 14px;
  box-shadow: 0 7px 20px rgba(23, 43, 73, .045);
}

html body.course-page main.course-details-page .cpb-section {
  padding: 42px 0;
}

html body.course-page main.course-details-page .cpb-section > .container {
  width: min(1180px, calc(100% - 40px));
  max-width: 1180px;
}

html body.course-page main.course-details-page .cpb-section .cpb-grid {
  gap: 12px;
}

html body.course-page main.course-details-page .cpb-section .cpb-card {
  min-height: 0;
  padding: 16px;
}

html body.course-page main.course-details-page .cpb-section .cpb-card h6 {
  color: var(--course-ui-ink);
  font-size: 15px;
  line-height: 1.35;
}

html body.course-page main.course-details-page .cpb-section .cpb-card p {
  color: var(--course-ui-muted);
  font-size: 13px;
  line-height: 1.5;
}

html body.course-page main.course-details-page .gco-grid,
html body.course-page main.course-details-page .career-global-opportunity-list,
html body.course-page main.course-details-page .sabf-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
}

html body.course-page main.course-details-page .cefr-pro-grid,
html body.course-page main.course-details-page .mssp-cefr-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

@media (max-width: 991.98px) {
  html body.course-page:not(.mandarin-course-page) .fr-countries-grid,
  html body.course-page:not(.mandarin-course-page) .gco-grid,
  html body.course-page:not(.mandarin-course-page) .career-global-opportunity-list,
  html body.course-page:not(.mandarin-course-page) .sabf-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.course-page:not(.mandarin-course-page) .mssp-cefr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.course-page main.course-details-page .fr-countries-grid,
  html body.course-page main.course-details-page .gco-grid,
  html body.course-page main.course-details-page .career-global-opportunity-list,
  html body.course-page main.course-details-page .sabf-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-layout {
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr);
    gap: 18px;
  }
}

@media (max-width: 767.98px) {
  html body.course-page:not(.mandarin-course-page) .fr-countries-grid,
  html body.course-page:not(.mandarin-course-page) .gco-grid,
  html body.course-page:not(.mandarin-course-page) .career-global-opportunity-list,
  html body.course-page:not(.mandarin-course-page) .sabf-list,
  html body.course-page:not(.mandarin-course-page) .mssp-cefr-grid { grid-template-columns: 1fr; }
  html body.course-page main.course-details-page > section.course-details-main,
  html body.course-page main.course-details-page .cpb-section { padding: 30px 0; }
  html body.course-page main.course-details-page .course-details-main > .container,
  html body.course-page main.course-details-page .cpb-section > .container,
  html body.course-page main.course-details-page .fr-countries-sec > .container { width: calc(100% - 28px); }
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-section { width: calc(100% - 28px); margin: 22px auto; padding: 15px; }
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-layout { grid-template-columns: 1fr; gap: 17px; }
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-image,
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-feature-image img { min-height: 210px; max-height: 340px; }
  html body.course-page:not(.mandarin-course-page) main.course-details-page .why-learn-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  html body.course-page main.course-details-page .cefr-pro-grid,
  html body.course-page main.course-details-page .mssp-cefr-grid { grid-template-columns: 1fr; }
}
