/* SCHAFER TRAINING: Layout wie die bisherige Seite. Farben und Schriften stehen in theme.json. */

/* ------------------------------------------------------------ Grundgerüst */

.wp-theme-schafer {
	margin: 0 0 0 1px;
	padding-left: 70px;
	background: #fff url(../images/shadow_left_1.jpg) left top repeat-y;
}
.wp-site-blocks > * { margin-block: 0; }
.st-haupt > *, .st-spalten > * { margin-block: 0; }
img { max-width: 100%; height: auto; }

/* ------------------------------------------------------------ Kopfzeile */

.st-kopf { padding: 33px 0 27px; background: #fff; }
.st-logo { margin: 0 0 0 50px; }
.st-logo a, .st-logo img { display: block; }

.st-menu {
	margin: 20px 0 0 50px;
	padding-top: 10px;
	height: 80px;
	background: url(../images/nav_shadow_top.png) left bottom repeat-x;
	align-items: flex-start;
}
.st-menu .wp-block-navigation__container { gap: 0; }
.st-menu .wp-block-navigation-item { background: url(../images/menu_line.jpg) left top no-repeat; }
.st-menu .wp-block-navigation-item__content {
	padding: 50px 19px 10px;
	font-size: 15px;
	line-height: 15px;
	color: #000;
	text-decoration: none;
}
.st-menu .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--blau); }
.st-menu .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--blau);
	background: url(../images/nav_active.jpg) center top no-repeat;
}

/* ------------------------------------------------------------ Banner und Spalten */

.st-haupt { max-width: 935px; margin-left: 50px; padding-bottom: 80px; }
.st-banner { margin: 0 0 15px; background: #fff; }
/* Festes Format wie bisher (935 x 228), höhere Bilder werden oben ausgerichtet beschnitten */
.st-banner img { display: block; width: 100%; height: auto; aspect-ratio: 935 / 228; object-fit: cover; object-position: top; }

.st-spalten {
	display: grid;
	grid-template-columns: 250px minmax(0, 1fr);
	column-gap: 50px;
}
.st-seitenleiste {
	padding: 20px 20px 0 0;
	background: url(../images/side_nav.png) right top no-repeat;
}
.st-inhalt { margin-top: 40px !important; }
.st-inhalt > * { margin-block: 0; }

.st-inhalt h1 {
	margin: 14px 0 20px;
	padding-bottom: 9px;
	border-bottom: 1px solid var(--wp--preset--color--linie);
}
.st-inhalt h2, .st-inhalt h3 { margin-top: 25px; margin-bottom: 10px; }

/* ------------------------------------------------------------ Seitennavigation */

.st-subnav p { margin: 0; }
.st-subnav__titel {
	margin-bottom: 50px !important;
	padding-bottom: 3px;
	font-size: 15px;
	border-bottom: 1px solid #b6b9bc;
}
.st-subnav__titel a { color: #b6b9bc; text-decoration: none; }
.st-subnav__titel a:hover { color: var(--wp--preset--color--text); }
.st-subnav ul { margin: 0; padding: 0; list-style: none; }
.st-subnav > ul > li { margin-bottom: 12px; }
.st-subnav > ul > li > a {
	display: block;
	font-size: 15px;
	color: #000;
	text-decoration: none;
	border-bottom: 1px solid #fff;
}
.st-subnav > ul > li.active > a,
.st-subnav > ul > li > a:hover {
	color: var(--wp--preset--color--blau);
	border-bottom-color: #b6b9bc;
}
.st-subnav > ul > li.active > ul {
	margin: 0 0 11px;
	padding: 8px 0 14px;
	border-bottom: 1px solid #b6b9bc;
}
.st-subnav ul ul a {
	display: block;
	padding-left: 18px;
	font-size: 15px;
	line-height: 20px;
	color: var(--wp--preset--color--grau);
	text-decoration: none;
	background: url(../images/sub_li14.jpg) left top no-repeat;
}
.st-subnav ul ul li.active > a,
.st-subnav ul ul a:hover {
	color: #000;
	background-image: url(../images/sub_li_active14.jpg);
}

.st-adresse { margin-top: 46px; padding-bottom: 15px; }
.st-adresse p { margin: 0 0 18px; }
.st-adresse a { color: var(--wp--preset--color--text); }

/* ------------------------------------------------------------ Inhalt */

.wp-block-post-content ul.wp-block-list { margin: 0 0 18px; padding: 0; }
.wp-block-post-content ul.wp-block-list > li {
	margin: 0 0 2px;
	padding-left: 18px;
	list-style: none;
	line-height: 20px;
	letter-spacing: .5px;
	background: url(../images/bullet.jpg) left top no-repeat;
}
.st-einzug { margin-left: 30px; }

/* Team Profil: Text und Foto */
.st-profil { gap: 20px; }
.st-profil .wp-block-image { margin: 0; }

/* Referenzen: Logo und Adresse, Trennlinie pro Firma */
.st-referenz {
	gap: 20px;
	margin: 0 !important;
	padding: 20px 0;
	border-bottom: 1px solid var(--wp--preset--color--linie);
}
.st-referenz:first-child { border-top: 1px solid var(--wp--preset--color--linie); }
.st-referenz .wp-block-image { margin: 0; }
.st-referenz .wp-block-image img { display: block; max-height: 130px; width: auto !important; object-fit: contain; }
.st-referenz .wp-block-image :is(a, figure) { display: block; }
.st-referenz p { margin: 0; }

.wp-block-embed.is-type-video { max-width: 560px; }

/* ------------------------------------------------------------ Kontaktformular */

.st-formular p { margin: 0 0 5px; }
.st-feld { display: flex; flex-wrap: wrap; align-items: flex-start; }
.st-feld > label { flex: 0 0 125px; }
.st-feld input:not([type="checkbox"]),
.st-feld textarea {
	flex: 1 1 260px;
	max-width: 360px;
	padding: 2px 4px;
	font: inherit;
	color: inherit;
	border: 1px solid #a9a9a9;
}
.st-feld--check { margin-left: 125px !important; flex-wrap: nowrap; gap: .4rem; }
.st-feld--check label { flex: 1; }
.st-feld--senden { margin: 10px 0 0 125px !important; }
.st-feld button {
	padding: 4px 12px;
	font: inherit;
	color: #fff;
	background: var(--wp--preset--color--blau);
	border: 0;
	cursor: pointer;
}
.st-feld button:hover { background: var(--wp--preset--color--hellblau); }
.st-falle { position: absolute; left: -9999px; }
.st-meldung { margin: 0 0 15px; padding: 10px 12px; border-left: 4px solid; }
.st-meldung p { margin: 0; }
.st-meldung--ok { border-color: #2e8b57; background: #eef7f1; }
.st-meldung--fehler { border-color: #c00; background: #fdf0f0; }

/* ------------------------------------------------------------ Tablet und Handy */

@media (max-width: 1084px) {
	.wp-theme-schafer { margin-left: 0; padding-left: 0; background-image: none; }
}

/* Burger Menü schon unter 1010px (Core schaltet erst bei 600px um) */
@media (min-width: 600px) and (max-width: 1010px) {
	.st-menu .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.st-menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
@media (max-width: 1010px) {
	.st-kopf {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		padding: 16px;
	}
	.st-logo { margin: 0; flex: 0 1 280px; }
	.st-menu { margin: 0; padding: 0; height: auto; background: none; }
	.st-menu .is-menu-open .wp-block-navigation__container { gap: .5rem; }
	.st-menu .is-menu-open .wp-block-navigation-item { background: none; }
	.st-menu .is-menu-open .wp-block-navigation-item__content { padding: .5rem 0; font-size: 1.25rem; line-height: 1.3; }
	.st-menu .is-menu-open .current-menu-item > .wp-block-navigation-item__content { background: none; }

	.st-haupt { margin: 0; max-width: none; padding-bottom: 0; }
	.st-spalten { grid-template-columns: minmax(0, 1fr); }
	.st-inhalt { order: 1; margin-top: 10px !important; padding: 0 16px 30px; }
	.st-seitenleiste {
		order: 2;
		padding: 20px 16px;
		color: #fff;
		background: var(--wp--preset--color--blau-mobil);
	}
	.st-subnav__titel { margin-bottom: 10px !important; border-bottom-color: #fff; }
	.st-subnav__titel a,
	.st-subnav > ul > li > a,
	.st-subnav ul ul a,
	.st-subnav ul ul li.active > a,
	.st-adresse a { color: #fff; }
	.st-subnav > ul > li > a { border-bottom-color: transparent; }
	.st-subnav > ul > li.active > a { color: #fff; font-weight: 700; border-bottom-color: #fff; }
	.st-subnav ul ul a { background: none; padding-left: 12px; }
	.st-adresse { margin-top: 24px; }
}
@media (max-width: 600px) {
	.st-feld > label { flex-basis: 100%; }
	.st-feld input:not([type="checkbox"]), .st-feld textarea { max-width: none; }
	.st-feld--check, .st-feld--senden { margin-left: 0 !important; }
}