/* On phones every multi-column row becomes one column, one item at a time (all pages) */
@media (max-width: 767.98px) {
  section:not(.lahuni83) .row > [class*="col-"],
  section:not(.lahuni83) .row > .item,
  section:not(.lahuni83) .row > .dlist {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
  }
  /* even spacing between the stacked items */
  section:not(.lahuni83) .row > .item,
  section:not(.lahuni83) .row > .dlist,
  section:not(.lahuni83) .row > [class*="col-"].item {
    margin-bottom: 1.75rem;
  }
  section:not(.lahuni83) .row > .item:last-child,
  section:not(.lahuni83) .row > .dlist:last-child {
    margin-bottom: 0;
  }
  /* round pictures get a bit more room when each item has the full width */
  section:not(.lahuni83) .circle .content-image {
    width: min(60%, 220px);
    padding-bottom: min(60%, 220px);
    margin-left: auto;
    margin-right: auto;
  }
}

/* Phone fit: nothing may be wider than the screen */
@media (max-width: 767.98px) {
  html { overflow-x: hidden; }
  body { overflow-x: clip; }
  section:not(.lahuni83) img {
    max-width: 100% !important;
    height: auto !important;
  }
  .faq-container {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
  }
  .faq-item,
  .faq-question {
    max-width: 100%;
    box-sizing: border-box;
  }
  .light-gray-box {
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  .column.column-text,
  .column.column-text .section-text {
    max-width: 100%;
    box-sizing: border-box;
  }
  section:not(.lahuni83) .section-description,
  section:not(.lahuni83) ul {
    max-width: 100%;
    overflow-wrap: break-word;
  }
}

/* Demo call form (cold calling / IT support pages): tidy, full-width inputs on phones */
@media (max-width: 767.98px) {
  #first_name, #cell_phone, #email {
    display: block;
    width: 100% !important;
    max-width: 320px;
    box-sizing: border-box;
    height: 2.6rem;
    margin: 0 auto .6rem;
    padding: 0 .75rem;
  }
}
