/* The compact menu replaces two navigation rows. Reserve only its actual
   height, plus one shared breathing space; desktop layouts stay untouched. */
@media (max-width: 900px) {
  html.mobile-menu-enabled body:is(.page-home, .page-about, .page-approach, .page-press, .page-contact, .page-news, .page-careers) {
    --mobile-page-start: calc(var(--header-height, 68px) + 32px);
    --section-top: var(--mobile-page-start);
    --section-inset: clamp(20px, 4vw, 32px);
    --mobile-intro-gap: 32px;
  }

  /* Cancel both parts of the old home offset (collapsing margin + padding).
     Keep the authored type, alignment and animated image stage unchanged. */
  html.mobile-menu-enabled body.page-home .home-sections {
    margin-block: 0;
    padding-top: 0;
  }
  html.mobile-menu-enabled body.page-home .home-sections > .story-block:first-child {
    margin-top: 0 !important;
    padding-top: var(--mobile-page-start) !important;
  }
  html.mobile-menu-enabled body.page-home .home-sections > .story-block:first-child .story-copy h1 {
    margin-bottom: 24px !important;
  }
  html.mobile-menu-enabled body.page-home.home-header-fade #main-content {
    /* Finish the fade above the raised title; it still fades when scrolled. */
    --home-fade-ramp: 32px;
  }
  html.mobile-menu-enabled body.page-home .home-chapter {
    padding-top: var(--mobile-page-start);
  }

  html.mobile-menu-enabled body:is(.page-about, .page-approach, .page-press, .page-contact, .page-news, .page-careers) #main-content [data-page-intro] > h1 {
    margin: 12px 0 24px !important;
  }
  html.mobile-menu-enabled body.page-press .press-intro,
  html.mobile-menu-enabled body.page-careers .careers-intro,
  html.mobile-menu-enabled body.page-news .news-index > .news-intro {
    margin-bottom: var(--mobile-intro-gap);
  }
  html.mobile-menu-enabled body:is(.page-news, .page-careers) [data-page-intro] > .latest-strip {
    margin: 0 0 24px;
  }

  /* Article pages have a back link instead of the index eyebrow. They use
     the same header clearance and side gutter, not the legacy 155px gap. */
  html.mobile-menu-enabled body.page-news .news-page.news-story {
    box-sizing: border-box;
    padding-top: var(--section-top);
    padding-inline: var(--section-inset);
  }
  html.mobile-menu-enabled body.page-news .news-story .news-intro {
    margin-top: 24px;
    margin-bottom: var(--mobile-intro-gap);
  }
  html.mobile-menu-enabled body.page-news .news-story .news-intro > h1 {
    font-size: clamp(3rem, 8vw, 7.375rem);
    margin: 12px 0 24px;
  }
}