/* ==================================================================
   Auto Brehm – Marken-Logos im Vehica-Header
   Gehört nach: wp-content/mu-plugins/autobrehm-markenlogos/brand-bar.css
   ------------------------------------------------------------------
   Drei Anzeige-Varianten, je nach Breite:
     >= 1400px : Logos GROSS in der Desktop-Menüzeile (neben "Termin buchen")
     1200-1399 : Logos auf eigener, zentrierter Reihe unter dem Menü
                 (dort ist neben dem Menü zu wenig Platz)
     <  1200px : Logos in der mobilen Kopfzeile (zwischen Logo & Hamburger)
   Der 1200er-Punkt = Vehicas eigener Umschaltpunkt Desktop/Hamburger.
   ================================================================== */

.brand-bar{
	align-items:center;
	justify-content:center;
	gap:clamp(14px, 1.8vw, 30px);
	flex-wrap:nowrap;
}

/* Höhe mit !important, da Elementor global ".elementor img{height:auto}"
   setzt und das sonst unsere Größe überschreibt. */
.brand-bar .brand-bar__logo{
	width:auto !important;
	max-width:none !important;
	object-fit:contain;
	display:block;
}

/* --- A) Breiter Desktop (>=1400px): in der Menüzeile --- */
.brand-bar--desktop{
	display:none;
	margin-left:auto;      /* an den Button heranschieben */
	margin-right:24px;     /* Abstand zum "Termin buchen"-Button */
}
.brand-bar--desktop .brand-bar__logo{
	height:clamp(46px, 3.4vw, 56px) !important;
}
@media (min-width:1400px){
	.brand-bar--desktop{ display:flex; }
}

/* --- B) Schmaler Desktop (1200-1399px): eigene Reihe unter dem Menü --- */
.brand-bar--row{ display:none; }
@media (min-width:1200px) and (max-width:1399px){
	.brand-bar--row{
		display:flex;
		width:100%;
		padding:8px 16px;
		border-top:1px solid rgba(0,0,0,.08);
		background:#ffffff;
		box-sizing:border-box;
	}
	.brand-bar--row .brand-bar__logo{
		height:clamp(44px, 3.6vw, 52px) !important;
	}
}

/* --- C) Mobil/Hamburger (<1200px): in der Kopfzeile --- */
.brand-bar--mobile{ display:none; }
@media (max-width:1199px){
	.brand-bar--mobile{
		display:flex;
		margin-right:auto;     /* im row-reverse-Header: Abstand zum Hamburger */
		margin-left:16px;      /* Abstand zum Site-Logo */
	}
	.brand-bar--mobile .brand-bar__logo{
		height:clamp(30px, 7vw, 40px) !important;
	}
}

/* Sehr schmale Handys: Logos etwas kompakter */
@media (max-width:360px){
	.brand-bar--mobile .brand-bar__logo{ height:28px !important; }
	.brand-bar--mobile{ gap:10px; margin-left:10px; }
}
