/* Blasterr service-page mobile story order | 2026-10-13
   Keep desktop/tables untouched. Mobile: copy > CTAs > visual > benefits. */
@media (max-width: 767px) {
  /* Service detail pages: flatten the copy wrapper solely at phone widths.
     The visual and proof list can then be reordered without duplicated markup. */
  body.bd-service-detail .service-hero-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }
  body.bd-service-detail .service-hero-grid > .service-hero-copy {
    display: contents !important;
  }
  body.bd-service-detail .service-hero-grid > .service-hero-visual {
    order: 1 !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 8px auto 4px !important;
  }
  body.bd-service-detail .service-hero-grid > .service-hero-copy > .service-proof-list {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px 0 20px !important;
  }

  /* Service HUB – flatten only the mobile copy wrapper so visual can be
     placed between actions and the proof list (HU/EN shared DOM).
     These scoped selectors intentionally outrank site-layout.min.css's
     main .bd-services-page .bd-services-hero-visual { order:1!important }. */
  main .bd-services-page .bd-services-hero-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    row-gap: 0 !important;
  }
  main .bd-services-page .bd-services-hero-inner > .bd-services-hero-copy {
    display: contents !important;
  }
  main .bd-services-page .bd-services-hero-copy > nav.bd-breadcrumb--site {
    order: 1 !important;
    margin: 0 0 18px !important;
  }
  main .bd-services-page .bd-services-hero-copy > .bd-eyebrow {
    order: 2 !important;
    margin-top: 0 !important;
  }
  main .bd-services-page .bd-services-hero-copy > h1 { order: 3 !important; }
  main .bd-services-page .bd-services-hero-copy > h2 { order: 4 !important; }
  main .bd-services-page .bd-services-hero-copy > p { order: 5 !important; }
  main .bd-services-page .bd-services-hero-copy > .bd-services-hero-actions {
    order: 6 !important;
  }
  main .bd-services-page .bd-services-hero-inner > .bd-services-hero-visual {
    order: 7 !important;
    width: 100% !important;
    margin: 4px auto 16px !important;
  }
  main .bd-services-page .bd-services-hero-copy > .bd-services-proof-row {
    order: 8 !important;
  }
}
