/* ===========================
   1) Hintergrund / Animation
   =========================== */

@keyframes fahrendesFahrzeug {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

.Header__headerBg::after {
  content: "";
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  background: url(https://autobizcom.sharepoint.com/:i:/r/sites/nrmops/Documents%20partages/CS%20Support%20%F0%9F%9B%A0%EF%B8%8F/Files/Kristian/Trade_Marketing_2.png?csf=1&web=1&e=48qC73) no-repeat;
  background-size: contain;
  animation: fahrendesFahrzeug 30s linear infinite;
  opacity: 0.1;
  z-index: -1;
}

/* ===========================
   2) Kategoriekarten – Titel/Struktur
   =========================== */

.kbCategory__gridView .TitleContainer__gridView .TitleContainer__title,
.TitleContainer__title { 
  display: none;
}

.kbCategory__gridView .TitleContainer__gridView .TitleContainer__title {
  font-size: 12px;
}

.TitleContainer__container {
  position: relative;
  box-shadow: none;
  border: none;
}

.TitleContainer__container a.Link__link.commonStyle__link.commonStyle__cursor.commonStyle__verticalMiddle.TitleContainer__boxLink {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0; top: 0;
  z-index: 10;
  border: none;
}

/* ===========================
   3) Bildfläche definieren
   - Einheitliche Höhe für Logo-Bereich
   - Centering via Flex
   =========================== */

.kbCategory__gridView .TitleContainer__headerIcon {
  height: 130px;                 /* <- Größe der Bildfläche (ggf. 120–150px anpassen) */
  padding: 8px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===========================
   4) Bilder richtig einpassen
   - Kein Beschnitt (object-fit: contain)
   - Keine globale Breite 100%
   =========================== */

.kbCategory__gridView .TitleContainer__headerIcon img,
.kbCategory__gridView .Avatar__large img {
  width: auto !important;        /* überschreibt width:100% */
  max-width: 100%;
  height: 100%;
  max-height: 130px;             /* identisch zur Containerhöhe */
  object-fit: contain;
  object-position: center;
  display: block;
  margin: 0 auto;
}

/* Sicherheitsnetz: vorhandene globale Regeln neutralisieren */
.TitleContainer__container .Avatar__large { 
  width: auto !important;
  height: auto !important;
}

.Avatar__square.Avatar__large img {
  width: auto !important;
  height: auto !important;
  max-height: 130px !important;
}

/* ===========================
   5) Skalierung (dezent größer)
   =========================== */

.kbCategory__gridView .TitleContainer__headerIcon img {
  transform: scale(1.15);        /* +15% größer, ohne Beschnitt */
  transition: transform 0.2s ease-in-out;
}

/* Optional: leichte Interaktion beim Hover
.kbCategory__gridView .TitleContainer__headerIcon:hover img {
  transform: scale(1.22);
}
*/

/* ===========================
   6) Sonstige bestehende Anpassungen
   =========================== */

.kbCategory__gridView .TitleContainer__gridView .Avatar__large { width: auto; }
.kbCategory__gridView .TitleContainer__gridView .Avatar__large img { width: auto; height: auto; }

/* Logo im Container 'mysubscription' gezielt kleiner halten (falls gewünscht) */
.TitleContainer__container.mysubscription .TitleContainer__headerIcon .Avatar__large {
  transform: scale(0.5) !important;
}

/* Zentrierung / UI-Details */
.TitleContainer__headerIcon {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Ausblendungen laut Vorgabe */
.LoginDetail__signin,
.ArticleCmd__articleLike,
.article_subcategory .SubscribeDepart__subs .SubscribeDepart__followContent,
.articleList .SubscribeDepart__subs .SubscribeDepart__followContent,
.articleList .treeView {
  display: none;
}

/* Sprachauswahl-Dropdown */
#languageDropdown {
  display: block;
  margin: 10px 0;
  padding: 5px;
  font-size: 16px;
}

/* ===========================
   7) Responsives Finetuning
   =========================== */

@media (max-width: 640px) {
  .kbCategory__gridView .TitleContainer__headerIcon {
    height: 110px;               /* auf kleineren Screens etwas kompakter */
  }
  .kbCategory__gridView .TitleContainer__headerIcon img,
  .Avatar__square.Avatar__large img {
    max-height: 110px !important;
    transform: scale(1.1);
  }
}

