/* Mobile homepage — match original base.css hero layout (commit 30fa30a) */

.home-mobile .hero-image-wrapper {
  max-width: 558px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 991px) {
  /* Stacked layout: keep phones in normal flow inside the fixed-height wrapper */
  .home-mobile .image.home-hero {
    position: relative;
    right: auto;
    top: auto;
    transform: none;
    margin-right: 0;
  }

  /*
   * base.css positions .bg.home-hero with bottom offsets (86px / 120px / 244px).
   * That only works when .hero-image-wrapper keeps its full height (718px).
   * Do not set height: auto or override .bg.home-hero — that shrinks the orange blob.
   */
}

@media screen and (max-width: 767px) {
  .home-hero-content {
    margin-bottom: 24px;
  }
}