/* containers */

@define-mixin container {
  width: calc(100% - (var(--hiq-container-horizontal-gap, 2rem) * 2));
  max-width: calc(var(--hiq-max-container-width, 50rem) - (var(--hiq-container-horizontal-gap, 2rem) * 2));
  margin-right: auto;
  margin-left: auto;
}

@define-mixin is-fluid {
  max-width: none;
}

.container {
  @mixin container;

  &.is-fluid {
    @mixin is-fluid;
  }
}