/* Logos / Partner - Masse aus Figma: Label 14px Versalien, Titel 36px
   blau, Lead 18px; Logos grau (48px hoch) mit 64px Abstand nach oben;
   Textlink unten. Raster mit 6 Logos pro Reihe (12 Logos = 2 Reihen). */

#content section.mantik-logos,
.mantik-logos { padding: 80px 0; margin: 0; }

.mantik-logos__copy { display: flex; flex-direction: column; gap: 6px; }
#content .mantik-logos .mantik-logos__kicker,
.mantik-logos .mantik-logos__kicker { margin: 0; font-size: .875rem; line-height: 1.5; font-weight: 500; text-transform: uppercase; color: #212529; }
#content .mantik-logos .mantik-logos__title,
.mantik-logos .mantik-logos__title { margin: 0; font-size: 2.25rem; line-height: 1.3; font-weight: 500; color: #009fe3; }
#content .mantik-logos .mantik-logos__lead,
.mantik-logos .mantik-logos__lead { margin: 24px 0 0; max-width: 640px; font-size: 1.125rem; line-height: 1.5; color: #212529; }

/* Raster: 6 pro Reihe */
.mantik-logos__row {
  list-style: none; padding: 0; margin: 64px 0 0;
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 48px 32px; align-items: center;
}
.mantik-logos__item { margin: 0; padding: 0; display: flex; justify-content: center; min-width: 0; }

/* Logo: grau, beim Hover (mit Link) in Originalfarbe */
.mantik-logos__link { display: flex; align-items: center; justify-content: center; height: 64px; max-width: 100%; }
#content .mantik-logos .mantik-logos__img,
.mantik-logos .mantik-logos__img {
  /* feste Hoehe, Breite aus dem Seitenverhaeltnis. !important gegen
     "section img { height: auto !important }" (mantik.css) und "img { width: 100% }" (app.css) */
  display: block; height: 48px !important; width: auto !important; max-width: 100%; object-fit: contain;
  filter: grayscale(1); opacity: .7; transition: filter .2s ease, opacity .2s ease;
}
a.mantik-logos__link:hover .mantik-logos__img,
a.mantik-logos__link:focus .mantik-logos__img { filter: none; opacity: 1; }

#content .mantik-logos .mantik-logos__more,
.mantik-logos .mantik-logos__more {
  display: inline-block; margin-top: 64px;
  font-size: 1rem; line-height: 1.5; font-weight: 500; color: #009fe3; text-decoration: none;
}
#content .mantik-logos .mantik-logos__more:hover,
.mantik-logos .mantik-logos__more:hover { color: #009fe3; text-decoration: none; }
.mantik-logos__arrow { display: inline-block; transition: transform .2s ease; }
.mantik-logos__more:hover .mantik-logos__arrow { transform: translateX(4px); }

@media (max-width: 991px) {
  #content section.mantik-logos, .mantik-logos { padding: 48px 0; }
  #content .mantik-logos .mantik-logos__title,
  .mantik-logos .mantik-logos__title { font-size: 1.75rem; }
  .mantik-logos__row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin-top: 40px; }
  #content .mantik-logos .mantik-logos__img,
  .mantik-logos .mantik-logos__img { height: 36px !important; }
  #content .mantik-logos .mantik-logos__more,
  .mantik-logos .mantik-logos__more { margin-top: 40px; }
}
@media (max-width: 480px) {
  .mantik-logos__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}