.product-family {margin:2.4rem 0}
.product-family h2 {margin:0 0 .8rem}
.product-family__grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;list-style:none;padding:0;margin:1.6rem 0}
.product-family__grid li {min-width:0}
.product-family__card {display:flex;flex-direction:column;align-items:center;height:100%;padding:1rem;border:1px solid rgba(var(--color-foreground),.22);border-radius:var(--product-card-corner-radius,8px);color:rgb(var(--color-foreground));text-decoration:none;box-sizing:border-box;background:rgb(var(--color-background));transition:border-color .15s ease}
.product-family__card img {width:100%;aspect-ratio:1;object-fit:contain;height:auto;background:white}
.product-family__label {font-weight:600;margin-top:.8rem;overflow-wrap:anywhere;text-align:center}
.product-family__state {font-size:1.1rem;line-height:1.5;margin-top:.4rem;text-align:center}
.product-family__card.is-current {border:2px solid rgb(var(--color-foreground));padding:calc(1rem - 1px)}
.product-family__card:focus-visible {outline:3px solid rgb(var(--color-foreground));outline-offset:3px}
.product-family__card:hover {border-color:rgb(var(--color-foreground))}
@media(max-width:749px){.product-family__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.product-family__card{transition:none}}