/* Fixes layered over the Webflow export (2026-10-14). Phone (under 480px) is
   Webflow's own layout, untouched. Desktop text wrapping is untouched.
   1. The "steps" grid on /short-sale (.grid-3) was four 400px columns in a
      940px container, so steps 3 and 4 sat off the right edge at every width
      above phone and the page scrolled sideways. Same 400px cards, two per row.
   2. Between 480px and 1279px, fixed-width text blocks (65rem) and the
      three-step grid on /sell-your-home ran off the edge. */
@media screen and (min-width: 480px) {
  .grid-3 { grid-template-columns: repeat(2, 400px); justify-content: center; }
  .grid-3 .div-block-19, .grid-3 .text-block-9.small, .grid-3 .text-block-9.small.lower { max-width: 100%; }
}
@media screen and (min-width: 480px) and (max-width: 1279px) {
  .text-block-9, .paragraph-3.bio, .div-block-19, .text-block-9.small, .text-block-9.small.lower { max-width: 100%; }
  .grid-3-copy.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-3-copy .div-block-19, .grid-3-copy .text-block-9.small, .grid-3-copy .text-block-9.small.lower { width: 100%; }
}
@media screen and (min-width: 480px) and (max-width: 991px) {
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3-copy.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .div-block-19, .text-block-9.small, .text-block-9.small.lower { width: 100%; }
}