:root {
  --bq-qgds-grid-gap-size: 2rem;
  --qgds-grid-gap-size: 2rem;
}
.bq-qgds-inner, .qgds-inner {
  margin: 0 auto;
  max-width: 82rem;
  padding: 1.5rem 1rem;
}
@media (min-width: 699px) {
  .bq-qgds-inner, .qgds-inner {
    padding: 1.5rem 2rem;
  }
}
@media (min-width: 992px) {
  .bq-qgds-inner, .qgds-inner {
    padding: 1.5rem 3rem;
  }
}
@media (min-width: 85rem) {
  .bq-qgds-inner, .qgds-inner {
    padding: 1.5rem 0;
  }
}
@supports (display: grid) {
  .grid-3-col-responsive {
    display: grid;
    gap: var(--bq-qgds-grid-gap-size);
  }
  @media (min-width: 576px) {
    .grid-3-col-responsive {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media (min-width: 992px) {
    .grid-3-col-responsive {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  .grid-2-col-responsive {
    display: grid;
    gap: var(--bq-qgds-grid-gap-size);
  }
  @media (min-width: 768px) {
    .grid-2-col-responsive {
      grid-template-columns: repeat(2, 1fr);
    }
    .grid-2-col-responsive.flipped > div:first-child {
      order: 2;
    }
    .grid-2-col-responsive.flipped > div:last-child {
      order: 1;
    }
  }
}