/* Article page title and breadcrumbs occupy separate rows at every viewport. */
.page-title.article-page-title > .container {
  flex-direction: column;
  align-items: flex-start !important;
  gap: 8px;
}

.page-title.article-page-title > .container > :first-child {
  width: 100%;
  margin-bottom: 0 !important;
  color: var(--heading-color);
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.page-title.article-page-title .breadcrumbs {
  width: 100%;
  min-width: 0;
}

.page-title.article-page-title .breadcrumbs ol {
  flex-wrap: nowrap;
  width: 100%;
  min-width: 0;
}

.page-title.article-page-title .breadcrumbs li:first-child {
  flex: 0 0 auto;
}

.page-title.article-page-title .breadcrumbs .current {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}