/* Bauzeichnung Rodrian – site-specific overrides */
@font-face {
	font-display: swap;
	font-family: "IBM Plex Sans";
	font-style: normal;
	font-weight: 400;
	src: url("../../Fonts/IBMPlexSans/IBMPlexSans-Regular.woff2") format("woff2");
}
@font-face {
	font-display: swap;
	font-family: "IBM Plex Sans";
	font-style: normal;
	font-weight: 500;
	src: url("../../Fonts/IBMPlexSans/IBMPlexSans-Medium.woff2") format("woff2");
}
@font-face {
	font-display: swap;
	font-family: "IBM Plex Sans";
	font-style: normal;
	font-weight: 600;
	src: url("../../Fonts/IBMPlexSans/IBMPlexSans-SemiBold.woff2") format("woff2");
}
@font-face {
	font-display: swap;
	font-family: "IBM Plex Sans";
	font-style: normal;
	font-weight: 700;
	src: url("../../Fonts/IBMPlexSans/IBMPlexSans-Bold.woff2") format("woff2");
}
:root {
	--rodrian-accent-color: #800000;
}

body {
	background-color: #fff;
	font-family: "IBM Plex Sans", sans-serif;
}
.site-rodrian .head {
	height: auto;
}
.site-rodrian p {
 max-width: 55rem;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "IBM Plex Sans", sans-serif;
}
.site .allcont:before {
	display: none;
}

/* Klickpfad und Buttons in Rodrian-Farbe (Hauptmenü bleibt grau) */
.site-rodrian nav.breadcrumbs a {
	color: var(--rodrian-accent-color);
}
.site-rodrian a.button,
.site-rodrian button {
	background: var(--rodrian-accent-color);
}
.site-rodrian .hamburger-inner,
.site-rodrian .hamburger-inner::before,
.site-rodrian .hamburger-inner::after {
	background-color: var(--rodrian-accent-color);
}

.site-rodrian .head .head2>.inner {
	flex-wrap: nowrap;
}

/* Logo-Box: Theme setzt Breite/Höhe pro Breakpoint fest (317x80, 217x60,
   180x50), aber das Rodrian-Logo hat ein eigenes Seitenverhältnis (480:92)
   das zu keiner dieser Boxen passt. Höhe daher pro Breakpoint fest auf das
   echte Verhältnis umgerechnet: Höhe = Breite / (480/92).

   Zusätzlich liegt "ul.nav::before" (dekorativer Gradient-Streifen des
   Themes, für das kürzere Standard-Logo gedacht) über der gesamten
   Header-Breite und lag dadurch über dem unteren Teil des (zweizeiligen)
   Rodrian-Logos – position:relative + z-index hebt das Logo darüber. */
.site-rodrian .head .head2>.inner .logo {
	height: 61px;
	position: relative;
	width: 317px;
	z-index: 1;
}
@media all and (max-width: 850px) {
	.site-rodrian .head .head2>.inner .logo {
		height: 42px;
		width: 217px;
	}
}
@media all and (max-width: 320px) {
	.site-rodrian .head .head2>.inner .logo {
		height: 35px;
		width: 180px;
	}
}

/* Verhindert 1px-Sprung im Hauptmenü beim Hover: Border-Bottom wird bereits
   im Grundzustand reserviert (transparent), Hover/Active ändern nur die Farbe */
.site-rodrian .head .nav > li > a {
	border-bottom: 1px solid transparent;
}
.site-rodrian .head .nav > li:hover > a,
.site-rodrian .head .nav > li.over > a {
	border-bottom-color: #373e46;
}
.site-rodrian .head .nav > li.active > a,
.site-rodrian .head .nav > li.act > a {
	border-bottom-color: var(--rodrian-accent-color);
}

/* "Text neben Bild" (CE textpic/textmedia, Position "in text", links/rechts):
   das Feld "Spalten für Bilder" (imagecols) wird hier NICHT als Bildanzahl
   pro Reihe interpretiert, sondern als Breitenverhältnis Bild:Text auf einem
   12-Spalten-Raster. "2 Spalten" = Bild 2/12, Text 10/12. "6 Spalten" = 50/50.
   Dafür liefert das Rodrian-only Partial packages/pxcadinare/Resources/Private/
   Partials/Rodrian/Media/Gallery.html zusätzlich --imagecols (Custom Property)
   mit dem rohen Feldwert, unabhängig von der tatsächlichen Bilderzahl.
   fluid_styled_content liefert dafür sonst keine responsive CSS-Regeln mit
   (nur feste width/height-Attribute am img), daher hier ergänzt:
   - Bilder skalieren responsiv (max-width:100%) statt fixer Pixelbreite
   - mehrere Bilder in der Galerie werden untereinander statt nebeneinander
     ausgegeben (Spalten-Feld steuert nur noch die Gesamtbreite, nicht mehr
     die Anzahl Bilder pro Reihe)
   - ab Desktop-Breite ist die Bildspalte auf imagecols von 12 Layout-Spalten
     begrenzt; der Text füllt automatisch die restliche Breite (Float + BFC) */
.site-rodrian .ce-textpic.ce-intext .ce-column {
	float: none;
	width: 100%;
}
.site-rodrian .ce-textpic.ce-intext .ce-gallery img {
	height: auto;
	max-width: 100%;
}
@media all and (min-width: 851px) {
	.site-rodrian .ce-textpic.ce-intext .ce-gallery[data-imagecols] {
		width: calc(var(--imagecols, 2) / 12 * 100%);
	}
}