/* Keep every mobile product card within its own column. */
@media(max-width:700px){
 #products.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px;align-items:stretch}
 #products.product-grid>.product{display:flex;flex-direction:column;grid-row:auto;grid-template-rows:none;min-width:0;max-width:100%;align-content:normal}
 #products .product>*{min-width:0;max-width:100%;box-sizing:border-box}
 #products .product-picture{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:100%;height:clamp(180px,55vw,260px);margin:0;overflow:hidden}
 #products .product-picture img{display:block;width:100%;max-width:100%;height:100%;margin:0;padding:20px 8px;object-fit:contain;object-position:center;transform:none}
 #products .product-picture .badge{left:6px;right:6px;top:8px;max-width:calc(100% - 12px);padding:5px 3px;font-size:9px;line-height:1.3;letter-spacing:.3px;text-align:center;white-space:normal}
 #products .product h3{min-height:2.7em;height:auto;margin:14px 0 8px;font-size:clamp(15px,4.1vw,19px);line-height:1.35;letter-spacing:0}
 #products .product-title{display:block;font:inherit;line-height:inherit;white-space:normal;overflow-wrap:anywhere;word-break:normal}
 #products .product p{font-size:13px;line-height:1.5;white-space:normal;overflow-wrap:anywhere;margin:6px 0 10px}
 #products .product .card-benefit{min-height:4.5em;font-size:13px;line-height:1.5;margin:0 0 10px}
 #products .product .card-benefit+p:not(.mwa-price){min-height:3em}
 #products .product .mwa-price{grid-row:auto;font-size:18px;line-height:1.4;margin:8px 0 14px!important}
 #products .product .mwa-price del{font-size:13px}
 #products .product>.product-actions{display:grid;grid-row:auto;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;gap:8px;margin-top:auto;width:100%}
 #products .product-actions>button,#products .product-actions>.view-product{width:100%;max-width:100%;min-width:0;min-height:44px;height:auto;padding:10px 6px;font-size:13px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
}

/* Pair corresponding card fields so different description lengths cannot move prices. */
@media(max-width:700px){
 @supports(grid-template-rows:subgrid){
  #products.product-grid>.product{display:grid;grid-template-rows:subgrid;grid-row:span 6;row-gap:0;align-content:stretch}
  #products .product>.product-picture{grid-row:1}
  #products .product>h3{grid-row:2}
  #products .product>.card-benefit{grid-row:3}
  #products .product>.card-benefit+p:not(.mwa-price){grid-row:4}
  #products .product>.mwa-price{grid-row:5;align-self:start}
  #products .product>.product-actions{grid-row:6;align-self:stretch;margin-top:0}
 }
 @supports not(grid-template-rows:subgrid){
  #products .product>.mwa-price{margin-top:auto!important}
  #products .product>.product-actions{margin-top:0}
 }
}