/* =============================================================
   pages/brands.css — Seite „BRANDS“
   ============================================================= */

.brands-intro { padding-block: 0 var(--space-md); }
.brands-intro .page-lead { margin-top: var(--space-sm); }

.brands-intro__split {
  gap: var(--space-sm);
  margin-top: var(--space-md);
  padding-inline: 20px;
}

.brands-intro__text {
  font-family: var(--f-heading);
  font-size: 1.4375rem;   /* 23px */
  line-height: 1.5;
  text-align: center;
}
.brands-intro__text p { margin-bottom: var(--space-xs); }

.brands-intro__media { display: grid; gap: var(--space-sm); }
.brands-intro__media img { width: 100%; }

/* ---------- Kennzahlen ---------- */
.brands-stats { padding-block: var(--space-md); }
.stats--wide .stat { flex: 1; }
.stats--wide .stat__value { font-size: 4.3125rem; font-family: var(--f-display); }

/* ---------- Partnerlogos ---------- */
.brands-partners { padding-block: var(--space-md); }
.brands-partners__logos {
  width: 100%;
  max-width: 800px;
  margin: var(--space-sm) auto 0;
}

/* ---------- Referenzen ---------- */
.brands-voices { padding-block: var(--space-lg); }
.brands-voices__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-md);
  align-items: start;
}
@media (max-width: 767px) {
  .brands-voices__grid { grid-template-columns: 1fr; }
}

/* Ab Tablet schrumpft nur der Einleitungstext; Kennzahlen bleiben groß. */
@media (max-width: 1024px) {
  .brands-intro > .container { padding-inline: 0; }
  .brands-intro__split { grid-template-columns: 51% 46%; }
  .brands-intro__text  { font-size: var(--fs-body); }
  .brands-intro__text p { margin-bottom: var(--space-sm); }
}
@media (max-width: 767px) {
  .brands-intro__split { grid-template-columns: 1fr; }
}