/* MimoPackage product families: approved compact dark icon navigation. */
.product-families {
  --family-surface:var(--charcoal);
  --family-ink:var(--plaster);
  --family-active:#DCC5A1;
  padding:11px 0;scroll-margin-top:90px;
  background:var(--family-surface);color:var(--family-ink);
}
.product-families .wrap {max-width:1200px;}
.family-list {
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;
  list-style:none;margin:0;padding:0;
}
.family-link {
  display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:0 8px;text-align:center;text-decoration:none;
  color:var(--family-ink);transition:color .2s ease;
}
.family-icon {display:block;width:52px;height:52px;flex:none;transition:transform .25s ease;}
.family-icon :is(path,rect,ellipse) {vector-effect:non-scaling-stroke;stroke-width:1.1px;}
.family-name {font-family:'Jost',sans-serif;font-size:14px;font-weight:400;line-height:1.25;letter-spacing:.01em;}
.family-name span {display:block;}
.family-link:hover {color:var(--family-active);}
.family-link:hover .family-icon {transform:translateY(-2px);}
.family-link:active .family-icon {transform:none;}
.family-link:focus-visible {outline:2px solid var(--family-active);outline-offset:5px;}
.col-grid .tile[id] {scroll-margin-top:100px;}
@media(max-width:760px) {
  .product-families {padding:10px 0;}
  .family-list {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;}
  .family-link {gap:4px;padding:0;}
  .family-icon {width:36px;height:36px;}
}
@media(prefers-reduced-motion:reduce) {
  .family-link,.family-icon {transition:none;}
  .family-link:hover .family-icon,.family-link:active .family-icon {transform:none;}
}