@supports (grid-template-rows:subgrid){:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product){margin-top:calc(var(--card-band-gap,0px)*-1);grid-template-rows:repeat(12,auto);row-gap:0}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).gap-y-5{--card-band-gap:calc(5 * var(--space-unit))}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).gap-y-8{--card-band-gap:calc(8 * var(--space-unit))}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).gap-y-10{--card-band-gap:calc(10 * var(--space-unit))}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).gap-y-16{--card-band-gap:calc(16 * var(--space-unit))}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product)>li{grid-row:span 12;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;padding-top:var(--card-band-gap,0px);display:grid}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product)>li>.card--product{grid-row:1/-1;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;width:100%;display:grid}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product)>li>.card--product>.card__compare{grid-row:1}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product)>li>.card--product>.card__media{grid-row:2}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product)>li>.card--product>.card__info-container{grid-row:3/-1;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;display:grid}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-container>.card__info{grid-row:1/-2;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;display:grid}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info>.card__info-inner{grid-row:1/-1;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;display:grid}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__vendor{grid-row:1}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__title{grid-row:2;margin-bottom:0}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__subtitle{grid-row:3}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__weight{grid-row:4}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__rating{grid-row:5;margin-top:0}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.price--top{grid-row:6;margin-top:0}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__swatches,:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__colors-text{grid-row:7}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__inventory{grid-row:8}:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product) .card__info-inner>.card__price-bottom{grid-row:9}}@media (width>=600px){@supports (grid-template-rows:subgrid){:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).sm\:gap-y-8{--card-band-gap:calc(8 * var(--space-unit))}}}@media (width>=769px){@supports (grid-template-rows:subgrid){:where(.main-products-grid[data-layout=grid],.products-grid-container) .grid:has(>li>.card--product).md\:gap-y-8{--card-band-gap:calc(8 * var(--space-unit))}}}@media (width<=768.98px){@supports (grid-template-rows:subgrid){:where(.main-products-grid[data-layout=grid]) .grid.grid-cols-2:has(>li>.card--product){--card-band-gap:0px}}}