/* Shared integration rules for responsive images and the homepage product grid. */
.responsive-media{display:contents}
.architecture>picture>img{width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:600px){.architecture>picture>img{object-position:63% center}}

/* Three product categories on the homepage. */
.products .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.products .product{margin-top:0;min-width:0}
.products .product-image{aspect-ratio:4/3}
.products .product-image img{object-position:center}
.products .product-title{flex-direction:column;align-items:flex-start;gap:8px}
@media(max-width:850px){.products .product-grid{grid-template-columns:1fr;gap:37px}}