/** Shopify CDN: Minification failed

Line 213:91 Unexpected ")"

**/
.shopify-section--collection-grid {
  position: static;
  container-type: initial;
  overflow: initial;

  & .mx-collection-grid {
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
    justify-content: stretch;
  }

  & .display-product-list {
    display: grid;
    grid-template-columns: repeat(var(--column-count), 1fr);
    width: 100%;
    max-width: var(--max-width, 125rem);
    margin: 1.25rem auto 0;
    gap: 1rem;

    --aspect-ratio: 5 / 7;

    @media (min-width: 40rem) {
      margin-block-start: 2.5rem;
    }
  }

  & .display-product-container {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    grid-column: span var(--base-column-width);
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    aspect-ratio: var(--aspect-ratio);
    border-radius: 0.25rem;
  }

  & .mx-product-card {
    height: 100%;
  }

  @media (max-width: 39.99rem) {
    & .display-product-list {
      --column-count: 2;
      --base-column-width: 1;
      --alt-column-width: 2;
    }

    & .display-product-container:nth-child(3n + 1) {
      grid-column: span var(--alt-column-width);

      --aspect-ratio: calc(7 * (100% - 2 * var(--mx-mobile-gutter) - 1rem));
    }

    & .display-product-container:is(:nth-child(3n + 2), :nth-child(3n + 3)) {
      --aspect-ratio: calc(7 * (100% - 2 * var(--mx-mobile-gutter) - 1rem) / 2);
    }
  }

  @media (min-width: 40rem) and (max-width: 59.99rem) {
    & .display-product-list {
      --column-count: 6;
      --base-column-width: 2;
      --alt-column-width: 3;
    }

    & .display-product-container:is(:nth-child(5n + 1), :nth-child(5n + 2)) {
      grid-column: span var(--alt-column-width);

      --aspect-ratio: calc(7 * (100% - 2 * var(--mx-mobile-gutter) - 1rem) / 2);
    }

    & .display-product-container:is(:nth-child(5n + 3), :nth-child(5n + 4), :nth-child(5n + 5)) {
      --aspect-ratio: calc(7 * (100% - 2 * var(--mx-mobile-gutter) - 2rem) / 3);
    }
  }

  @media (min-width: 60rem) {
    & .display-product-list {
      --column-count: 60;
    }

    & .display-product-container {
      aspect-ratio: calc(var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

      --base-column-width: 12;
      --alt-column-width: 12;
    }

    & .card-image-container {
      height: calc(100% - 2.75rem);
    }

    & .display-product-container:is([data-pattern='XX']) {
      --base-column-width: 30;
      --alt-column-width: 30;
    }

    &
      .display-product-container:is(
        [data-pattern='XXX'],
        [data-pattern='XYY'],
        [data-pattern='YYX'],
        [data-pattern='XYY/2'],
        [data-pattern='YYX/2']
      ) {
      --base-column-width: 20;
      --alt-column-width: 20;

      &:is([data-pattern='XYY'][data-index='2'], [data-pattern='YYX'][data-index='1']) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 40;
      }

      &:is([data-pattern='XYY/2'][data-index='2'], [data-pattern='YYX/2'][data-index='1']) {
        grid-column: span var(--alt-column-width);
        grid-row: span 2;
        aspect-ratio: calc(0.5 * var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

        --alt-column-width: 40;
      }
    }

    &
      .display-product-container:is(
        [data-pattern='XXXX'],
        [data-pattern='XYYY'],
        [data-pattern='YYYX'],
        [data-pattern='XXYY'],
        [data-pattern='XYYX'],
        [data-pattern='YYXX'],
        [data-pattern='XYYY/2'],
        [data-pattern='YYYX/2'],
        [data-pattern='XXYY/2'],
        [data-pattern='XYYX/2'],
        [data-pattern='YYXX/2']
      ) {
      --base-column-width: 15;
      --alt-column-width: 15;

      &:is([data-pattern='XYYY'][data-index='2'], [data-pattern='YYYX'][data-index='1']) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 45;
      }

      &:is([data-pattern='XYYY/2'][data-index='2'], [data-pattern='YYYX/2'][data-index='1']) {
        grid-column: span var(--alt-column-width);
        grid-row: span 2;
        aspect-ratio: calc(0.5 * var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

        --alt-column-width: 45;
      }

      &:is(
          [data-pattern='XXYY'][data-index='3'],
          [data-pattern='XYYX'][data-index='2'],
          [data-pattern='YYXX'][data-index='1']
        ) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 30;
      }

      &:is(
          [data-pattern='XXYY/2'][data-index='3'],
          [data-pattern='XYYX/2'][data-index='2'],
          [data-pattern='YYXX/2'][data-index='1']
        ) {
        grid-column: span var(--alt-column-width);
        grid-row: span 2;
        aspect-ratio: calc(0.5 * var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

        --alt-column-width: 30;
      }
    }

    &
      .display-product-container:is(
        [data-pattern='XXXXX'],
        [data-pattern='XYYYY'],
        [data-pattern='YYYYX'],
        [data-pattern='XXYYY'],
        [data-pattern='XYYYX'],
        [data-pattern='YYYXX'],
        [data-pattern='XYYZZ'],
        [data-pattern='YYXZZ'],
        [data-pattern='YYZZX'],
        [data-pattern='XXXYY'],
        [data-pattern='XXYYX'],
        [data-pattern='XYYXX'],
        [data-pattern='YYXXX'],
        [data-pattern='XYYYY/2'],
        [data-pattern='YYYYX/2'],
        [data-pattern='XXYYY/2'],
        [data-pattern='XYYYX/2'],
        [data-pattern='YYYXX/2']
      ) {
      --base-column-width: 12;
      --alt-column-width: 12;

      &:is([data-pattern='XYYYY'][data-index='2'], [data-pattern='YYYYX'][data-index='1'], ) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 48;
      }

      &:is([data-pattern='XYYYY/2'][data-index='2'], [data-pattern='YYYYX/2'][data-index='1']) {
        grid-column: span var(--alt-column-width);
        grid-row: span 2;
        aspect-ratio: calc(0.5 * var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

        --alt-column-width: 48;
      }

      &:is(
          [data-pattern='XXYYY'][data-index='3'],
          [data-pattern='XYYYX'][data-index='2'],
          [data-pattern='YYYXX'][data-index='1']
        ) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 36;
      }

      &:is(
          [data-pattern='XYYZZ']:is([data-index='2'], [data-index='3']),
          [data-pattern='YYXZZ']:is([data-index='1'], [data-index='3']),
          [data-pattern='YYZZX']:is([data-index='1'], [data-index='2']),
          [data-pattern='XXXYY'][data-index='4'],
          [data-pattern='XXYYX'][data-index='3'],
          [data-pattern='XYYXX'][data-index='2'],
          [data-pattern='YYXXX'][data-index='1']
        ) {
        grid-column: span var(--alt-column-width);

        --alt-column-width: 24;
      }

      &:is(
          [data-pattern='XXYYY/2'][data-index='3'],
          [data-pattern='XYYYX/2'][data-index='2'],
          [data-pattern='YYYXX/2'][data-index='1']
        ) {
        grid-column: span var(--alt-column-width);
        grid-row: span 2;
        aspect-ratio: calc(0.5 * var(--alt-column-width) * var(--aspect-ratio) / var(--base-column-width));

        --alt-column-width: 36;
      }
    }
  }
}