/* Shared headers for utility and catalog pages. */


.page-trends .trends-page,
.page-about .about-post-card__body {
  padding-top: 15px;
  padding-inline: 16px;
}

.page-trends .trends-page {
  padding: 0;
}

.page-trends .trends-page__header {
  padding: 0 16px 15px;
}

.page-matches .matches-hero,
.page-rankings .rankings-hero,
.page-tournaments .tournaments-hero {
  padding: 0 16px 15px;
}

.page-trends .site-breadcrumbs,
.page-matches .site-breadcrumbs,
.page-rankings .site-breadcrumbs,
.page-tournaments .site-breadcrumbs,
.page-teams .site-breadcrumbs,
.page-about .site-breadcrumbs {
  min-height: 18px;
  gap: 9px;
  margin: 0 0 7px;
  padding-top: 11px;
  color: var(--text-muted);
  font-size: 0.69rem;
  font-weight: 620;
  line-height: 1.2;
}

/* Keep utility-page breadcrumb bars identical to the team profile topbar. */
.page-matches .matches-hero,
.page-rankings .rankings-hero,
.page-tournaments .tournaments-catalog__header,
.page-trends .trends-page .trends-page__header,
.page-cs3bet .cs3bet-page__header {
  min-height: 32px !important;
  height: 32px !important;
  padding: 1px 17px 0 !important;
  gap: 18px !important;
}

.page-matches .matches-hero__breadcrumbs,
.page-rankings .rankings-hero__breadcrumbs,
.page-tournaments .tournaments-catalog__breadcrumbs,
.page-trends .trends-page .trends-page__breadcrumbs,
.page-cs3bet .cs3bet-page__breadcrumbs {
  min-height: 18px;
  height: 100% !important;
  margin: 0;
  padding: 0;
  align-items: center;
  font-size: 0.69rem !important;
  line-height: 1 !important;
}

.page-matches .matches-hero__title,
.page-rankings .rankings-hero__title,
.page-tournaments .tournaments-catalog__title,
.page-trends .trends-page .trends-page__title,
.page-cs3bet .cs3bet-page__description {
  max-width: 52% !important;
  color: var(--text-muted) !important;
  font-size: 0.63rem !important;
  font-weight: 620 !important;
  line-height: 1.2 !important;
  text-align: right !important;
  text-wrap: pretty !important;
}

@media (max-width: 700px) {
  .page-matches .matches-hero,
    .page-rankings .rankings-hero,
    .page-tournaments .tournaments-catalog__header,
    .page-trends .trends-page .trends-page__header,
    .page-cs3bet .cs3bet-page__header {
    min-height: 38px;
    height: 38px;
  }

  .page-matches .matches-hero__breadcrumbs,
  .page-tournaments .tournaments-catalog__breadcrumbs {
    position: static;
    height: 100%;
    min-height: 18px;
    padding: 0 13px;
    font-size: 0.69rem;
  }

  .page-trends .trends-page .trends-page__breadcrumbs {
    font-size: 0.69rem;
  }
}

.page-matches .matches-hero__title,
.page-tournaments .tournaments-hero__title,
.page-rankings .rankings-hero__title,
.page-teams .teams-hero__title,
.page-trends .trends-page__title,
.page-about #about-title {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.36rem, 2.55vw, 1.78rem);
  font-weight: 860;
  line-height: 1.04;
  letter-spacing: 0;
  text-transform: none;
}

.page-matches .matches-hero__description,
.page-tournaments .tournaments-hero__description,
.page-rankings .rankings-hero__description,
.page-teams .teams-hero__description,
.page-trends .trends-page__lead,
.page-about .about-post-card__body > p:first-of-type {
  max-width: 620px;
  margin: 7px 0 0;
  color: var(--text-soft);
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.42;
  letter-spacing: 0;
}

@media (max-width: 700px) {
  .page-trends .trends-page__title,
  .page-about #about-title,
  .page-matches .matches-hero__title,
  .page-rankings .rankings-hero__title,
  .page-tournaments .tournaments-hero__title,
  .page-teams .teams-hero__title {
    font-size: clamp(1.26rem, 7vw, 1.58rem);
  }
}