/* Dedicated Module page: learning path, topic groups and module navigation. */
.articles-module-facts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--articles-space-2);
  margin: var(--articles-space-6) 0 0;
  padding: 0;
  list-style: none;
}

.articles-module-facts li {
  display: flex;
  align-items: baseline;
  gap: 0.42rem;
  min-height: 3.2rem;
  padding: 0.62rem 0.9rem;
  border: 1px solid var(--articles-line-soft);
  border-radius: var(--articles-radius-sm);
  color: var(--articles-muted);
  background: rgba(13, 25, 43, 0.62);
  font-size: var(--articles-text-xs);
}

.articles-module-facts strong {
  color: var(--articles-ink-strong);
  font-size: 1.35rem;
  line-height: 1;
}

.articles-module-hero {
  display: grid;
  grid-template-columns: minmax(19rem, 0.95fr) minmax(20rem, 1.05fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 4rem);
  width: min(calc(100% - (2 * var(--articles-space-page))), var(--articles-container));
  margin: 0 auto clamp(2.75rem, 7vw, 5rem);
  padding: clamp(1.75rem, 5vw, 3.25rem);
  border: 1px solid var(--articles-line-soft);
  border-radius: var(--articles-radius-lg);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 22% 55%, var(--module-glow, rgba(244, 170, 37, 0.12)), transparent 48%),
    var(--articles-panel);
  box-shadow: var(--articles-shadow-sm);
}

.articles-module-hero__copy { min-width: 0; }

.articles-module-hero h2 {
  margin: 0;
  color: var(--articles-ink-strong);
  font-family: var(--articles-font-serif);
  font-size: var(--articles-title-section);
  line-height: 1.15;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.articles-module-hero__copy > p:last-child {
  margin: var(--articles-space-4) 0 0;
  color: var(--articles-muted);
  line-height: 1.72;
}

.articles-module-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 18rem);
  align-items: start;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  width: min(100%, var(--articles-container));
  margin-inline: auto;
  padding: 0 var(--articles-space-page) var(--articles-space-8);
}

.articles-topic-list { min-width: 0; }

.articles-topic {
  margin: 0 0 var(--articles-space-3);
  border: 1px solid var(--articles-line-soft);
  border-radius: var(--articles-radius-md);
  overflow: hidden;
  background: var(--articles-panel);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

.articles-topic > h2 { margin: 0; }

.articles-topic > .articles-topic__heading {
  padding: 1.15rem 1.35rem;
  color: var(--articles-ink-strong);
  font-family: var(--articles-font-serif);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  line-height: 1.25;
  text-wrap: balance;
}

.articles-topic :is(summary, [data-topic-toggle], .articles-topic__toggle) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  align-items: center;
  gap: var(--articles-space-4);
  min-height: 4.75rem;
  border: 0;
  padding: 1.15rem 1.35rem;
  color: var(--articles-ink-strong);
  background: transparent;
  font-family: var(--articles-font-serif);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
  list-style: none;
}

.articles-topic summary::-webkit-details-marker { display: none; }

.articles-topic [data-topic-toggle] > span:first-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

.articles-topic [data-topic-toggle] small,
.articles-topic__heading small {
  display: block;
  grid-column: 1;
  margin-top: 0.28rem;
  color: var(--articles-muted-soft);
  font-family: var(--articles-font-sans);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.articles-topic__chevron {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border: 1px solid var(--articles-line);
  border-radius: 50%;
  color: var(--articles-gold-light);
  font-family: var(--articles-font-sans);
  font-size: 1.1rem;
  line-height: 1;
  transition: transform var(--articles-motion-fast) ease;
}

.articles-topic [data-topic-toggle] .articles-topic__chevron {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.articles-topic [data-topic-toggle][aria-expanded="true"] .articles-topic__chevron {
  transform: rotate(180deg);
}

.articles-topic :is([data-topic-panel], .articles-topic__panel) {
  padding: 0 1.35rem 1.35rem;
  border-top: 1px solid var(--articles-line-soft);
}

.articles-topic__intro {
  max-width: 66ch;
  margin: 1rem 0;
  color: var(--articles-muted);
  font-size: var(--articles-text-sm);
}

.articles-lesson-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.articles-lesson-list > li {
  display: grid;
  grid-template-columns: 2.65rem minmax(0, 1fr);
  gap: var(--articles-space-3);
  align-items: start;
  min-height: 4.25rem;
  padding: 0.9rem 0.2rem;
  border-top: 1px solid rgba(195, 206, 222, 0.11);
}

.articles-lesson-list > li:first-child { border-top: 0; }

.articles-lesson-list__number {
  padding-top: 0.08rem;
  color: var(--module-accent, var(--articles-gold-light));
  font-size: var(--articles-text-xs);
  font-weight: 850;
  letter-spacing: 0.05em;
}

.articles-lesson-list__copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.25rem 0.75rem;
  min-width: 0;
}

.articles-lesson-list__copy > :is(a, strong) {
  min-width: 0;
  color: #dce5f1;
  font-size: var(--articles-text-base);
  line-height: 1.45;
  overflow-wrap: anywhere;
  text-decoration-line: underline;
  text-decoration-color: transparent;
}

.articles-lesson-list__copy > strong { text-decoration-line: none; }

.articles-lesson-list__copy > a:hover,
.articles-lesson-list__copy > a:focus-visible {
  color: var(--articles-ink-strong);
  text-decoration-color: var(--articles-gold);
}

.articles-lesson-list__copy > small {
  grid-column: 1 / -1;
  color: var(--articles-muted-soft);
  font-size: var(--articles-text-sm);
  line-height: 1.55;
}

.articles-lesson-list .articles-status {
  align-self: start;
  border: 1px solid rgba(195, 206, 222, 0.18);
  border-radius: var(--articles-radius-pill);
  padding: 0.2rem 0.48rem;
  white-space: nowrap;
}

.articles-module-aside,
.articles-sidebar {
  border: 1px solid var(--articles-line-soft);
  border-radius: var(--articles-radius-md);
  padding: var(--articles-space-5);
  background: var(--articles-panel);
}

.articles-module-aside {
  position: sticky;
  top: 1.25rem;
}

.articles-module-aside h2 {
  margin: 0 0 var(--articles-space-3);
  font-family: var(--articles-font-serif);
  font-size: 1.4rem;
}

.articles-module-aside nav { display: grid; gap: 0.25rem; }

.articles-module-aside a {
  display: block;
  padding: 0.58rem 0;
  border-bottom: 1px solid rgba(195, 206, 222, 0.11);
  color: #d4dfec;
  font-size: var(--articles-text-sm);
  text-decoration-line: underline;
  text-decoration-color: transparent;
}

.articles-module-aside a:hover,
.articles-module-aside a:focus-visible {
  color: var(--articles-ink-strong);
  text-decoration-color: var(--articles-gold);
}

.articles-module-aside__note {
  margin: var(--articles-space-4) 0 0;
  color: var(--articles-muted-soft);
  font-size: var(--articles-text-xs);
}

@media (max-width: 56rem) {
  .articles-module-hero { grid-template-columns: 1fr; }

  .articles-module-hero > .articles-image-deck,
  .articles-module-hero__visual {
    width: min(100%, 38rem);
    margin-inline: auto;
  }

  .articles-module-layout { grid-template-columns: 1fr; }
  .articles-module-aside { position: static; }
}

@media (max-width: 42rem) {
  .articles-module-hero {
    width: calc(100% - 1.5rem);
    border-radius: var(--articles-radius-md);
    padding: 1.2rem;
  }

  .articles-module-layout { padding-inline: 0.75rem; }

  .articles-topic :is(summary, [data-topic-toggle], .articles-topic__toggle) {
    min-height: 4.25rem;
    gap: 0.75rem;
    padding: 1rem;
  }

  .articles-topic > .articles-topic__heading { padding: 1rem; }

  .articles-topic :is([data-topic-panel], .articles-topic__panel) {
    padding: 0 1rem 1rem;
  }

  .articles-lesson-list > li {
    grid-template-columns: 2.2rem minmax(0, 1fr);
  }

  .articles-lesson-list__copy { grid-template-columns: 1fr; }
  .articles-lesson-list .articles-status { justify-self: start; }
}