/* JR — Mobile Entry Hero Title Vertical Center (All Headers) */

@media (max-width: 768px) {

  /* The SECTION is the full banner (e.g. 120px tall). Center its inner wrapper. */
  body section.entry-hero.page-hero-section,
  body section.entry-hero {
    display: flex !important;
    align-items: center !important; /* vertical center the inner wrapper */
  }

  /* This is the container around the title area (your screenshot 2). Make it fill & center. */
  body section.entry-hero.page-hero-section > .entry-hero-container-inner,
  body section.entry-hero > .entry-hero-container-inner {
    width: 100% !important;
    height: 100% !important;
    min-height: inherit !important;
    display: flex !important;
    align-items: center !important;  /* vertical center contents */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
  }

  /* Ensure inner content containers don't introduce offset */
  body section.entry-hero .hero-container,
  body section.entry-hero .hero-container.site-container {
    width: 100% !important;
    margin: 0 auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body section.entry-hero header.entry-header {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body section.entry-hero header.entry-header .entry-title {
    margin: 0 !important;
  }
}