/*
 * Faculty alignment layer for /mediacia.
 * Keeps the page's editorial content, cards, imagery and colour moments intact,
 * while bringing its reading width and type scale closer to the other study
 * programme pages.
 */
.mp-mediacia-page .mp-shell {
  width: min(870px, calc(100% - 48px)) !important;
}

.mp-mediacia-page .mp-hero {
  padding-block: 54px !important;
}

/*
 * The programme hero uses the same media treatment as the other faculty
 * presentation pages. The figure clips both the image and its caption so the
 * corners remain consistent on desktop and mobile.
 */
.mp-mediacia-page .mp-hero__image-wrap {
  border-radius: 16px !important;
  overflow: hidden !important;
}

.mp-mediacia-page .mp-hero__image {
  border-radius: 16px 16px 0 0 !important;
}

.mp-mediacia-page .mp-display,
.mp-mediacia-page .mp-hero .mp-display {
  max-width: 16ch !important;
  font-family: Merriweather, Georgia, "Times New Roman", serif !important;
  font-size: 40px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
}

.mp-mediacia-page .mp-heading {
  max-width: 24ch !important;
  font-family: "Open Sans", Arial, sans-serif !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
}

/*
 * Programme subheadings follow the same sans-serif hierarchy as Theology and
 * Counseling. The page title remains serif, preserving the faculty's editorial
 * voice and the distinction between the page title and navigational content.
 */
.mp-mediacia-page h3 {
  font-family: "Open Sans", Arial, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.mp-mediacia-page .mp-lead {
  font-size: 18px !important;
  line-height: 1.5 !important;
}

.mp-mediacia-page .mp-section {
  padding-block: 52px !important;
}

@media (max-width: 700px) {
  .mp-mediacia-page .mp-shell {
    width: calc(100% - 32px) !important;
  }

  .mp-mediacia-page .mp-hero {
    padding-block: 40px !important;
  }

  .mp-mediacia-page .mp-display,
  .mp-mediacia-page .mp-hero .mp-display {
    max-width: none !important;
    font-size: 25.6px !important;
    line-height: 1.2 !important;
  }

  .mp-mediacia-page .mp-heading {
    max-width: none !important;
    font-size: 20.8px !important;
    line-height: 1.2 !important;
  }

  .mp-mediacia-page .mp-lead {
    font-size: 16px !important;
    line-height: 1.5 !important;
  }

  .mp-mediacia-page .mp-section {
    padding-block: 38px !important;
  }
}