/* Mobile composition review, October 27. Awaiting owner acceptance.
   Loaded only by the reviewed release pages; Downloads stays unchanged. */
@media (max-width: 600px) {
  /* A stable masthead across marketing and documentation. */
  .site-header.nav-island .brand img:is(.product-wordmark, .press-wordmark) {
    width: 112px !important;
    height: 34px !important;
  }
  .site-header.nav-island { padding-left: 18px; }
  .site-header.nav-island .mobile-menu-toggle { padding: 10px 14px; }

  /* Remove desktop negative space from the train crop; both layers align. */
  .home-page .scene-train-story .scene-art {
    aspect-ratio: 1.45;
    overflow: hidden;
    mask-image: linear-gradient(transparent, #000 10%, #000 78%, transparent);
    -webkit-mask-image: linear-gradient(transparent, #000 10%, #000 78%, transparent);
  }
  .home-page .scene-train-story .scene-art img {
    position: absolute;
    inset: -12% auto auto -60%;
    width: 160%;
    height: auto;
    aspect-ratio: 3 / 2;
  }
  .home-page .hero-tail { margin-top: 0; padding-top: 12px; }
  .home-page .marketing-hero .scene-stage > .product-scene { margin-top: 12px; }

  /* Keep headings expressive without leaving a brand name on its own line. */
  .restored-page.about-page h2 { font-size: clamp(32px, 8.7vw, 38px); line-height: 1.1; }
  .restored-page .about-founder .about-copy { padding-top: 12px; }
  .restored-page .portrait-scene { width: 72%; max-width: 300px; margin-bottom: 8px; }
  .restored-page .about-hero .scene-context { display: none; }
  .restored-page .partners-hero .relation-copy h1 { text-wrap: balance; }
  .restored-page .partner-directions h2 { font-size: clamp(30px, 8vw, 36px); line-height: 1.12; text-wrap: balance; }

  /* Contact is an invitation, not a full extra screen of decorative artwork. */
  .restored-contact .relation-copy .service-lead { font-size: 18px; line-height: 1.6; }
  .restored-contact .relation-hero .about-scene { height: auto; aspect-ratio: 1.3; }

  /* The short Blog state needs one connected reading sequence. */
  .mobile-blog .service-hero { padding-bottom: 12px; }
  .mobile-blog .story-flow { height: 52px; margin: 8px 0; }
  .mobile-blog .service-section { margin-top: 24px; }
  .mobile-blog .service-section h2 { font-size: clamp(30px, 8vw, 34px); line-height: 1.13; text-wrap: balance; }

  .community-page .community-welcome h1 { font-size: clamp(32px, 9.5vw, 38px); line-height: 1.1; }
}
