.m-product-card-mini {
  --grid-columns: [visual-start heading-start description-start] auto
                  [visual-end] 1fr
                  [heading-end label-start price-start] auto
                  [label-end price-end description-end];
  --grid-rows: [visual-start label-start] auto
                  [label-end visual-end heading-start price-start] auto
                  [heading-end price-end description-start] auto
                  [description-end];
  --grid-gap: 1.2rem 2.4rem;
  --price-justify: end;
  --label-justify: end;
  --price-align: start;
  --label-align: start;
  --image-margin-block-end: 1.2rem;
  --meta-display: contents;
  --heading-size: 1.6rem;
  border-radius: 2rem;
  overflow: clip;
}
.m-product-card-mini__inner {
  display: grid;
  grid-template-columns: var(--grid-columns);
  grid-template-rows: var(--grid-rows);
  gap: var(--grid-gap);
  padding: var(--item-padding-block, 1.6rem) var(--item-padding-inline, 1.6rem);
  text-decoration: none;
  align-content: start;
}
.m-product-card-mini__image {
  display: block;
  margin: 0 0 var(--image-margin-block-end) 0;
  border-radius: 2rem;
  overflow: clip;
  grid-area: visual;
  aspect-ratio: 1;
  width: 16rem;
}
.m-product-card-mini__image img, .m-product-card-mini__image svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  margin: 0;
}
.m-product-card-mini__content {
  display: contents;
}
.m-product-card-mini__meta {
  display: var(--meta-display);
  grid-column: label-start/price-end;
  grid-row: label;
  align-self: end;
  grid-template-columns: [label-start] 1fr [label-end price-start] 1fr [price-end];
  grid-template-rows: [label-start price-start] 1fr [label-end price-end];
  gap: 2.4rem;
  min-height: 3rem;
}
.m-product-card-mini__heading {
  grid-area: heading;
  font-family: var(--ff-primary);
  font-size: var(--heading-size);
  font-weight: 600;
}
.m-product-card-mini__heading:is(h2, h3, h4, h5, h6) {
  font-size: var(--heading-size);
  margin: 0;
}
.m-product-card-mini__label {
  grid-area: label;
  justify-self: var(--label-justify);
  font-size: var(--body-fs-xl);
  align-self: var(--label-align);
}
.m-product-card-mini__price {
  grid-area: price;
  justify-self: var(--price-justify);
  font-weight: 600;
  font-size: var(--heading-size);
  align-self: var(--price-align);
}
.m-product-card-mini__price .m-price.m-price--sm {
  font-size: var(--heading-size);
}
.m-product-card-mini__description {
  grid-area: description;
}

@container (min-width: 600px) {
  .m-product-card-mini {
    --label-justify: start;
    --price-align: center;
    --label-align: center;
    --grid-columns: [visual-start] auto
                    [visual-end heading-start description-start label-start] 1fr
                    [heading-end label-end price-end description-end];
    --grid-rows: [visual-start heading-start] auto
                    [heading-end description-start] auto
                    [description-end label-start price-start] 1fr
                    [visual-end heading-end label-end price-end];
    --image-margin-block-end: 0;
    --meta-display: grid;
    --heading-size: 2rem;
  }
}