/*
 * EGE-School regular pages and fallback archives (design B-about): dark hero
 * with breadcrumbs, content card. Colours only from base.css tokens.
 */

/*
 * The header has its own rounded bottom corners; the hero slides under it
 * (negative margin) so header and hero read as one dark block, as in the
 * mockups.
 */
.es-page-hero {
  margin-top: -40px;
  padding-top: 40px;
  border-radius: 0 0 40px 40px;
  background: var(--es-ink);
  color: var(--es-white);
}

.es-page-hero__inner {
  display: flex;
  flex-direction: column;
  gap: var(--es-s-6);
  padding-top: var(--es-s-8);
  padding-bottom: clamp(40px, 5vw, 72px);
}

.es-page-hero__title {
  max-width: 960px;
  margin: 0;
  color: var(--es-white);
  font-family: var(--es-font-display);
  font-size: clamp(28px, 4.4vw, 56px);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -0.03em;
}

.es-page-hero__lead {
  max-width: 760px;
  margin: 0;
  color: var(--es-on-dark);
  font-size: clamp(17px, 1.6vw, 20px);
  line-height: 1.55;
}

/* page body */
.es-page__body {
  padding-top: clamp(32px, 4vw, 56px);
  padding-bottom: clamp(48px, 6vw, 88px);
}

.es-page__card {
  max-width: 960px;
  margin-inline: auto;
  padding: clamp(24px, 4vw, 48px);
  border-radius: var(--es-r-xl);
}

.es-page__card .es-prose {
  max-width: 100%;
}

.es-page__links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--es-s-2);
  margin-top: var(--es-s-6);
}

/* fallback archives (index.php) */
.es-archive__body {
  padding-top: clamp(32px, 4vw, 56px);
  padding-bottom: clamp(48px, 6vw, 88px);
}

.es-archive__pager {
  margin-top: var(--es-s-8);
}

.es-archive__empty {
  color: var(--es-muted-2);
  font-size: 18px;
}