/* Mobile Services only. Desktop and tablet retain their current composition. */
@media (max-width: 767px) {
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero--capabilities {
    padding: 0; background: #20221f;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero__grid {
    position: relative; display: grid; grid-template-columns: minmax(0,1fr);
    gap: 0; width: 100%; margin: 0; padding: 0; isolation: isolate;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero__grid > .tpi-native-container:first-child {
    grid-area: 1/1; z-index: 2; align-self: end; padding: 170px 20px 28px;
    background: linear-gradient(transparent,rgba(10,15,13,.87));
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero__grid > :is(figure,.tpi-native-tag-figure) {
    grid-area: 1/1; width: 100%; height: 100%; min-height: 450px; align-self: stretch;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero :is(figure,.tpi-native-tag-figure) .elementor-widget-image,
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero :is(figure,.tpi-native-tag-figure) .elementor-widget-container {
    height: 100%; width: 100%;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero h1 {
    color: #fff; font-size: clamp(30px,8.7vw,44px) !important; line-height: 1.09;
    letter-spacing: -.025em; text-transform: none; overflow-wrap: normal; word-break: normal; hyphens: none;
    max-width: 18ch; margin-bottom: 22px;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-page-hero .button {
    width: 100%; min-height: 48px;
  }
  /* Keep the existing visual journey and every caption in a compact swipe row. */
  body.family-field:is(.page-id-5,.page-id-100) .field-photo-strip {
    display: flex; overflow-x: auto; scroll-snap-type: x proximity; gap: 12px; padding: 16px 20px;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-photo-strip > :is(figure,.tpi-native-tag-figure) {
    flex: 0 0 78%; min-width: 0; height: 180px; scroll-snap-align: center; border: 0;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-photo-strip :is(figcaption,.tpi-native-tag-figcaption) { padding: 12px; font-size: 14px; }
  body.family-field:is(.page-id-5,.page-id-100) .field-capabilities--page { padding: 32px 0; }
  body.family-field:is(.page-id-5,.page-id-100) .field-capabilities__layout {
    display: flex; flex-direction: column; min-height: 0; border: 0; gap: 24px;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-capabilities--page .field-manifesto {
    padding: 0; border: 0;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-manifesto h2 {
    font-size: clamp(27px,7.2vw,36px) !important; line-height: 1.12;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-services-support { margin-top: 18px; }
  body.family-field:is(.page-id-5,.page-id-100) .field-services-support img { max-height: 200px; object-fit: cover; }
  body.family-field:is(.page-id-5,.page-id-100) .field-capabilities--page .field-capability-index {
    display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; border: 0;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-capabilities--page .tpi-mobile-service-card {
    display: grid; grid-template-columns: 38px minmax(0,1fr); align-content: start; align-items: center;
    padding: 0 0 16px; gap: 14px 10px; background: var(--paper-deep); border: 0 !important;
    min-width: 0; overflow: hidden;
  }
  body.family-field:is(.page-id-5,.page-id-100) .tpi-mobile-service-image {
    display: block !important; grid-column: 1/-1; width: 100%; margin: 0;
  }
  body.family-field:is(.page-id-5,.page-id-100) .tpi-mobile-service-image img {
    display: block; width: 100%; height: auto; aspect-ratio: 1.65; object-fit: cover;
  }
  body.family-field:is(.page-id-5,.page-id-100) .tpi-mobile-service-card > .elementor-widget-text-editor { padding-left: 14px; }
  body.family-field:is(.page-id-5,.page-id-100) .tpi-mobile-service-card > .tpi-native-container { padding-right: 14px; }
  body.family-field:is(.page-id-5,.page-id-100) .tpi-mobile-service-card h3 {
    font-size: 21px !important; line-height: 1.22; text-transform: none;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-application-row article {
    display: flex; align-items: center; gap: 16px; padding: 20px; min-height: 64px;
  }
  body.family-field:is(.page-id-5,.page-id-100) .field-application-row h3 { font-size: 20px !important; line-height: 1.3; }
  body.family-field:is(.page-id-5,.page-id-100) .field-process__line { margin: 0 0 0 10px; }
  body.family-field:is(.page-id-5,.page-id-100) .field-process__line li { padding-bottom: 24px; }
  body.family-field:is(.page-id-5,.page-id-100) .field-process__line h3 { font-size: 21px !important; line-height: 1.3; }
  body.family-field:is(.page-id-5,.page-id-100) .field-faq .elementor-tab-title { min-height: 48px; padding-block: 16px; }
  body.family-field:is(.page-id-5,.page-id-100) .field-enquiry .button { min-height: 48px; width: 100%; }
}
