/* VOIMA Brillenmarken. Keine globalen Selektoren; keine externen Fonts oder Bibliotheken. */
.vbm-brands {
  --vbm-ink: #2b2b2b;
  --vbm-accent: #feda31;
  --vbm-surface: #f8f8f5;
  --vbm-line: #e3e3dd;
  --vbm-radius: .5rem;
  --vbm-gap: 1rem;
  color: var(--vbm-ink);
  font: inherit;
  container-type: inline-size;
}
.vbm-brands.vbm-theme-uhu {
  --vbm-accent: #618595;
  --vbm-surface: #edf6f8;
  --vbm-line: #c7dfe6;
  --vbm-radius: 1.25rem;
}
.vbm-brands .vbm-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--vbm-gap);
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: stretch;
}
.vbm-brands .vbm-brand {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .25rem;
  min-width: 0;
  min-height: 6rem;
  box-sizing: border-box;
  margin: 0;
  padding: 1.35rem 1.45rem;
  background: var(--vbm-surface);
  border: 1px solid var(--vbm-line);
  border-radius: var(--vbm-radius);
  box-shadow: 0 .125rem .25rem rgb(43 43 43 / 2%);
}
.vbm-brands .vbm-brand::before {
  content: '';
  display: block;
  width: 1.75rem;
  height: .2rem;
  background: var(--vbm-accent);
  margin: 0 0 .55rem;
  border-radius: .125rem;
}
.vbm-brands .vbm-name {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-weight: 700;
  font-size: 1.125rem;
  letter-spacing: -.015em;
  line-height: 1.4;
  color: var(--vbm-ink);
  overflow-wrap: anywhere;
}
.vbm-brands.vbm-theme-bischofberger .vbm-name { font-family: Montserrat, Arial, sans-serif; }
.vbm-brands.vbm-theme-uhu .vbm-name { font-family: 'Create Something', Arial, sans-serif; font-size: 1.2rem; }
.vbm-brands .vbm-description {
  margin: .4rem 0 0;
  padding: 0;
  font: inherit;
  font-size: .95rem;
  line-height: 1.6;
  color: var(--vbm-ink);
}
.vbm-brands .vbm-logo { margin: .1rem 0 .75rem; }
.vbm-brands .vbm-logo img {
  display: block;
  object-fit: contain;
  object-position: left center;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 4rem;
  border-radius: 0;
}
.vbm-brands .vbm-link-wrap { margin: .75rem 0 0; padding: 0; font-size: .875rem; }
.vbm-brands a.vbm-link {
  color: var(--vbm-ink);
  background-image: none !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}
.vbm-brands a.vbm-link:hover { text-decoration-thickness: 2px; }
.vbm-brands a.vbm-link:focus-visible { outline: .15rem solid var(--vbm-ink); outline-offset: .25rem; }
@media (max-width: 900px) {
  .vbm-brands .vbm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .vbm-brands { --vbm-gap: .7rem; }
  .vbm-brands .vbm-grid { grid-template-columns: minmax(0, 1fr); }
  .vbm-brands .vbm-brand { min-height: 5rem; padding: 1.1rem 1.2rem; }
}
/* Auch in schmalen Elementor-Spalten brauchbar, unabhängig von der Bildschirmbreite. */
@container (max-width: 660px) {
  .vbm-brands .vbm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (max-width: 380px) {
  .vbm-brands .vbm-grid { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .vbm-brands .vbm-brand { box-shadow: none; break-inside: avoid; }
}
