@font-face {
          font-family: 'Material Symbols Outlined';
          font-style: normal;
          font-weight: 400;
          src: url('./assets/img/Materia SymbolsOutlined.woff2') format('woff2');
        }
  
        .material-symbols-outlined {
          font-family: 'Material Symbols Outlined';
          font-weight: normal;
          font-style: normal;
          font-size: 24px;
          line-height: 1;
          letter-spacing: normal;
          text-transform: none;
          display: inline-block;
          white-space: nowrap;
          word-wrap: normal;
          direction: ltr;
          -webkit-font-feature-settings: 'liga';
          -webkit-font-smoothing: antialiased;
        }

@media (max-width: 575px) {
  .brandimagewrapper {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* 2 Spalten */
    gap: 8px;
    margin: 0 8px;
  }
  /* Button als eigenes Grid-Item unter den Logos zentrieren */
  .brandimagewrapper .showmorebutton {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: 8px;
  }
}

/* Ab Tablet wieder normale Bootstrap-Row verwenden */
@media (min-width: 576px) {
  .brandimagewrapper {
    display: flex !important; /* oder “display: flex; flex-wrap: wrap;” je nach gewünschtem Verhalten */
  }
}