/* Small-screen safety net on top of the original design.
   These rules only change anything where content was wider than the screen. */

/* Flex children default to min-width:auto and refuse to shrink below their
   content, which pushes sections off narrow phones. */
.elementor-widget-container > *,
.e-con-inner > * {
  min-width: 0;
}

/* Headings whose longest word is wider than the screen are scaled down by
   responsive-fixes.js (never broken mid-word). */

/* The contact block is a wrapping flex row that becomes one column at 768px.
   Its 300px column floor then only forces the page sideways on small phones.
   Prefixed with body so these win over the page's own single-class rules,
   which come later in the document. */
@media (max-width: 768px) {
  body .nv-contact-info,
  body .nv-form-wrapper {
    min-width: 0;
    max-width: 100%;
  }
}

/* Contact details: the email address is one unbreakable string that is wider
   than a 320px phone. Let it wrap instead of pushing the page sideways. */
@media (max-width: 480px) {
  body .nv-detail-item > * {
    min-width: 0;
  }
  body .nv-detail-item {
    overflow-wrap: anywhere;
  }
}
