/* Append after the existing site styles. Content and desktop geometry are unchanged. */
@media (max-width: 1050px) {
  :root { --shell: min(900px, calc(100% - 3rem)); }

  .service-detail-layout,
  .service-detail-applications > .page-shell,
  .service-assurance-heading,
  .legal-layout,
  .about-production-grid,
  .approach-engagement-grid,
  .human-direction-grid,
  .cap-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .service-detail-layout > *,
  .service-detail-applications > .page-shell > *,
  .service-assurance-heading > *,
  .legal-layout > *,
  .about-production-grid > *,
  .about-production-list > *,
  .approach-engagement-grid > *,
  .engagement-options > *,
  .outcome-row > *,
  .human-direction-grid > *,
  .direction-principles > *,
  .cap-grid > *,
  .cap-heading > * {
    min-width: 0;
  }

  .service-detail-intro h2,
  .service-detail-applications h2,
  .service-assurance-heading h2,
  .legal-heading h2,
  .about-production h2,
  .about-production-list h3,
  .approach-engagement h2,
  .engagement-options h3,
  .outcome-row h3,
  .outcome-row p,
  .direction-principles h3,
  .direction-principles p,
  .cap-grid h3,
  .cap-grid p,
  .cap-heading h2,
  .legal-copy,
  .legal-process li strong {
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  /* Let translated copy wrap instead of setting an oversized grid minimum. */
  main h1,
  main h2,
  main h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  main p,
  main li {
    overflow-wrap: anywhere;
  }

  .direction-principles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .service-detail-applications > .page-shell > .text-link,
  .service-detail-cta .text-link,
  .rights-note .text-link {
    width: fit-content;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .about-page h1,
  .about-page h2,
  .about-page h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  .site-nav a {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 700px) {
  :root { --shell: calc(100% - 2rem); }

  /* Preserve whole long headings on narrow screens where automatic language
     hyphenation is unavailable; normal sizes return as space increases. */
  .service-detail-intro h2,
  .service-detail-applications h2,
  .service-assurance-heading h2,
  .vi-section-heading h2 {
    font-size: clamp(2rem, 10.5vw, 3.05rem);
  }

  .about-production h2 {
    font-size: clamp(2rem, 11vw, 3.3rem);
  }

  html[lang="de"] .legal-heading #terms-title {
    font-size: clamp(1.8rem, 9.3vw, 3rem);
  }

  /* Override the later desktop two-column editorial-card rule. */
  .outcome-row,
  .about-production-list,
  .engagement-options,
  .direction-principles,
  .cap-grid,
  .cap-grid.four,
  .legal-process ol,
  .vi-area-grid,
  .vi-capability-grid,
  .vi-security-grid,
  .vi-section-heading,
  .assist-system-grid,
  .assist-system-card ul {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-hero-grid > *,
  .origin-grid > *,
  .leadership-heading > *,
  .human-direction-grid > *,
  .about-proof-grid > *,
  .about-cta-grid > * {
    min-width: 0;
  }

  .footer-legal nav,
  .legal-process li,
  .vi-area-grid > *,
  .vi-capability-grid > *,
  .vi-security-grid > *,
  .assist-system-grid > *,
  .assist-system-card li,
  .vi-section-heading > *,
  .vi-dashboard-list article > * {
    min-width: 0;
    max-width: 100%;
  }

  .vi-section-heading h2 {
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  .vi-area-grid article,
  .vi-capability-grid article,
  .vi-security-grid article,
  .assist-system-card,
  .vi-dashboard-list article > * {
    overflow-wrap: anywhere;
  }

  .vi-dashboard-list article {
    grid-template-columns: 55px minmax(0, 1fr);
  }
}