/* [weave_brands]: brand cards. Colours, fonts and radius come from the
   site's --weave-* variables (neutral fallbacks only, as in weave-carousel.css). */
.weave-brands {
    --_accent: var(--weave-accent, #1f6f5c);
    --_ink: var(--weave-ink, #1b1b1b);
    --_surface: var(--weave-surface, #fff);
    --_muted: var(--weave-muted, #6b6b6b);
    --_radius: var(--weave-radius, 10px);
    --_line: color-mix(in srgb, var(--_ink) 12%, transparent);
    font-family: var(--weave-font, inherit);
    color: var(--_ink);
}
.weave-brands__head { margin: 0 0 20px; }
.weave-brands__title { margin: 0; font-family: var(--weave-display-font, inherit); font-weight: var(--weave-display-weight, 400); color: var(--weave-heading-color, inherit); font-size: 1.6rem; }
.weave-brands__intro { margin: 6px 0 0; color: var(--_muted); }
.weave-brands__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--weave-brand-cols, 4), minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1023px) { .weave-brands__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599px) { .weave-brands__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
.weave-brands__card { min-width: 0; }
.weave-brands__link {
    display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; padding: 18px 14px 16px;
    border: 1px solid var(--_line); border-radius: var(--_radius); background: var(--_surface); color: inherit; text-decoration: none; text-align: center;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
a.weave-brands__link:hover, a.weave-brands__link:focus-visible { border-color: var(--_accent); box-shadow: 0 8px 24px rgb(0 0 0 / 0.07); transform: translateY(-2px); outline: none; }
.weave-brands__photo { display: flex; align-items: center; justify-content: center; width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: color-mix(in srgb, var(--_accent) 8%, transparent); }
.weave-brands__photo img { width: 100%; height: 100%; object-fit: cover; }
.weave-brands__initial { font-family: var(--weave-display-font, inherit); font-size: 2rem; font-weight: 600; color: var(--_accent); }
.weave-brands__name { font-weight: 600; font-size: 1rem; line-height: 1.3; }
.weave-brands__count { font-size: 0.85rem; color: var(--_muted); }
.weave-brands__card--out .weave-brands__link { opacity: 0.6; }
.weave-brands__empty { color: var(--_muted); }