/* Mobile reading layout. Desktop keeps the existing section presentation. */
.mobile-service-card { display: none; }
.service-desktop { width: 100%; margin-block: auto; }
.mobile-disclosure > summary { display: none; }

@media screen and (max-width: 800px) {
  .home-document, .inner-document { scroll-snap-type: none; }
  .home-page .home-panel,
  .inner-page .page-intro,
  .inner-page .content-panel,
  .inner-page .page-enquiry,
  .inner-page .case-hero,
  .inner-page .case-chapter,
  .inner-page .mobile-step {
    min-height: 0;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
    padding-block: 28px;
  }
  .home-page .home-panel { display: block; }
  .inner-page .mobile-split { padding-block: 0; }
  .inner-page .mobile-step { justify-content: flex-start; }
  .inner-page .step-body { margin-block: 0; }
  .inner-page .mobile-step + .mobile-step { padding-top: 22px; }
  .section-pagination,
  .section-rail,
  .inner-page .continuation,
  .inner-page:has(main[data-section-navigation]) .eyebrow,
  .inner-page .mobile-step > .step-body > .eyebrow.mobile-copy { display: none; }

  .home-page .hero-layout,
  .home-page .panel-grid,
  .case-hero-grid,
  .case-chapter-grid { gap: 22px; }
  .home-page h1,
  .inner-page h1 { font-size: 34px; line-height: 1.12; }
  .home-page h2,
  .inner-page h2 { font-size: 28px; line-height: 1.18; }
  .home-page .hero-copy > p,
  .inner-page .page-intro .page-lead,
  .case-lead { font-size: 16px; line-height: 1.55; }
  .home-page .home-panel .wrap { margin-block: 0; }
  .page-jumps { gap: 0 18px; margin-top: 16px; }
  .page-jumps a { min-height: 44px; }
  .case-back { margin-bottom: 8px; }
  .case-lead,
  .case-copy > p:not(.eyebrow) { margin-top: 14px; }
  .case-section-nav { margin-bottom: 6px; }
  .case-hero .case-cover img { max-height: 250px; object-fit: contain; }
  .case-plan-image img { max-height: 65svh; }
  .inner-page .project-card { min-height: 0; }
  .inner-page .mobile-step.work-list > .step-body > h3 { font-size: 23px; line-height: 1.25; }
  .inner-page .work-list li { font-size: 18px; padding-block: 10px; }

  /* One summary per service; every approved paragraph is in the disclosure. */
  .service-desktop,
  .inner-page .service-desktop-continuation { display: none; }
  .mobile-service-card { display: block; }
  .mobile-service-card h2 { max-width: 24ch; }
  .mobile-service-card figure { margin: 16px 0 12px; }
  .mobile-service-card .service-photo { display: block; text-decoration: none; }
  .mobile-service-card img {
    display: block; width: 100%; height: clamp(140px, 21svh, 180px);
    object-fit: cover; object-position: center;
  }
  #steelwork .mobile-service-card img { object-position: center 65%; }
  .mobile-service-card figcaption {
    display: flex; align-items: center; justify-content: space-between;
    min-height: 36px; font-size: 13px; line-height: 1.4;
  }
  .mobile-service-card > p { font-size: 16px; line-height: 1.5; }
  .service-highlights { margin: 14px 0; padding-left: 19px; font-size: 15px; line-height: 1.5; }
  .service-highlights li + li { margin-top: 3px; }
  .service-more { border-block: 1px solid var(--line); margin: 16px 0 4px; }
  .service-more > summary,
  .mobile-disclosure > summary {
    display: list-item; padding-block: 13px; cursor: pointer;
    font: 600 16px/1.4 Arial, Helvetica, sans-serif; color: var(--navy);
  }
  .service-more > summary:focus-visible,
  .mobile-disclosure > summary:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; }
  .service-more-copy { padding-bottom: 20px; }
  .service-more-copy p { margin-block: 12px; line-height: 1.6; }
  .service-more-copy h3 { margin-top: 22px; font: 23px/1.25 Georgia, serif; }
  .service-more-copy .scope-list { display: block; }
  .service-more-copy .scope-list li { padding-block: 8px; }
  .tone-navy .service-more > summary { color: #fff; }
  .mobile-service-card > .text-link { min-height: 44px; align-items: center; font-size: 15px; }
  #qualification-awards > .step-body > .mobile-copy { display: none; }
  #qualification-awards { padding-top: 0; border-top: 0; }
  .mobile-disclosure { border-block: 1px solid var(--line); }
}
