/* Phone-width layout corrections.

   Squarespace's Fluid Engine places blocks on a grid and lets them share rows —
   deliberately, for things like text over a colour panel. On About Us two pairs
   of *text* blocks share rows, so on a phone the headings run straight through
   the paragraphs beneath them.

   These rules move the paragraph below the heading instead of into it. They are
   scoped to phone widths, so the desktop layout is untouched, and to the two
   blocks that actually collide, so nothing else in the design shifts.

   Loaded after the site stylesheet, hence no !important is needed. */

@media screen and (max-width: 767px) {

  /* About Us — "WORKING WITH US LOOKS LIKE..." over "Fair Compensation..."
     Heading occupies rows 2-6; the text started on row 6. */
  .fluid-engine .fe-block-246a2e8a3e666caed6d2 {
    grid-area: 7 / 2 / 14 / 10;
  }

  /* About Us — "OUR MISSION" over "Everything we do is centred..."
     Heading occupies rows 1-4; the text started on row 3. */
  .fluid-engine .fe-block-yui_3_17_2_1_1709196616998_18351 {
    grid-area: 5 / 2 / 9 / 13;
  }
}
