/* ==========================================================================
   RS plus: Aussehen des Child-Themes
   Nur CSS auf Astras Klassen. Kein Wert hier setzt voraus, dass Astras
   Standardwerte aus includes/astra.php noch gelten. Die Astra-Palette trägt
   die Markenfarben für die Redaktion; dieses Stylesheet nutzt feste
   --rsp-*-Töne, damit eine Palettenänderung im Customizer Kopf- und
   Fußzeile nicht zerstören kann.
   ========================================================================== */

:root {
	--rsp-rs-deep: #116492;
	--rsp-rs: #158acb;
	--rsp-ink: #10222e;
	--rsp-ink-2: #4a5c68;
	--rsp-surface: #fff;
	--rsp-fos: #ef8018;
	--rsp-ink-3: #64737e;
	--rsp-rule: #e4e0d8;
	--rsp-rule-soft: #efece5;
	--rsp-rs-wash: #eaf4fa;
	--rsp-fos-deep: #a85b0c;
	--rsp-fos-wash: #fdf1e4;
	--rsp-font-display: "Archivo", "Open Sans", system-ui, sans-serif;
	--rsp-font-body: "Open Sans", system-ui, -apple-system, sans-serif;
	--rsp-header-h: 76px;
	--rsp-r-md: 6px;
	--rsp-r-lg: 10px;
}

/* ---- Schrift ---------------------------------------------------------- */
body,
button,
input,
select,
textarea {
	font-family: var(--rsp-font-body);
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-content :is(h1, h2, h3, h4, h5, h6) {
	font-family: var(--rsp-font-display);
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.14;
	text-wrap: balance;
}

/* Astra Pro setzt Beitragstitel in Übersichten (.blog/.archive/.search
   .entry-title) auf die Systemschrift; gleich stark, aber später geladen. */
:is(.blog, .archive, .search) .entry-title,
:is(.blog, .archive, .search) .entry-title a {
	font-family: var(--rsp-font-display);
}

/* Ein sichtbarer Fokusring überall. Astras a:focus und button:focus sind
   stärker als ein :where(), deshalb !important (2.4.7). */
:is(a, button, input, select, textarea, summary, video, audio, [tabindex]):focus-visible {
	outline: 3px solid var(--rsp-rs) !important;
	outline-offset: 2px !important;
}

/* Fokus nicht unter der klebenden Kopfzeile (2.4.11) */
html {
	scroll-padding-top: calc(var(--rsp-header-h) + var(--wp-admin--admin-bar--height, 0px) + 24px);
}

/* ---- Kopfzeile -------------------------------------------------------- */
#masthead.site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 900;
}

#masthead .ast-primary-header-bar,
#masthead .ast-mobile-header-wrap .ast-primary-header-bar {
	background: rgb(251 250 247 / 94%);
	backdrop-filter: blur(16px);
	border-bottom: 1px solid var(--rsp-rule);
}

#masthead .site-primary-header-wrap {
	min-height: var(--rsp-header-h);
}

/* Wortmarke */
.rsp-wortmarke {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: var(--rsp-ink);
	text-decoration: none;
}

.rsp-wortmarke:hover,
.rsp-wortmarke:focus {
	color: var(--rsp-ink);
}

.rsp-wortmarke__balken {
	flex-shrink: 0;
}

.rsp-wortmarke__text {
	line-height: 1.2;
}

.rsp-wortmarke__name {
	display: block;
	font-family: var(--rsp-font-display);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.rsp-wortmarke__ort {
	display: block;
	font-size: 0.72rem;
	color: var(--rsp-ink-3);
}

/* Hauptmenü. Astra gibt den Links height: 100% und erbt 80px Zeilenhöhe:
   ohne height/line-height würde aus der Pille ein Block über die ganze
   Kopfzeile, und die Kopfzeile wüchse auf 99px. */
#masthead .main-header-menu > .menu-item > .menu-link {
	height: auto;
	padding: 9px;
	border-radius: 6px;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--rsp-ink-2);
}

/* Aufklappknopf im Menüpunkt: Trefferfläche mindestens 24 px hoch (2.5.8).
   Der negative Rand hält die Pille so hoch wie vorher. */
#masthead .main-header-menu > .menu-item > .menu-link > .ast-header-navigation-arrow {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	margin-block: -1.5px;
}

#masthead .main-header-menu > .menu-item:hover > .menu-link,
#masthead .main-header-menu > .menu-item:focus-within > .menu-link,
#masthead .main-header-menu > .current-menu-item > .menu-link,
#masthead .main-header-menu > .current-menu-ancestor > .menu-link {
	color: var(--rsp-ink);
	background: rgb(16 34 46 / 5%);
}

#masthead .main-header-menu .sub-menu {
	min-width: 232px;
	padding: 8px;
	border: 1px solid var(--rsp-rule);
	border-radius: 10px;
	background: var(--rsp-surface);
	box-shadow: 0 2px 4px rgb(16 34 46 / 6%), 0 18px 40px -18px rgb(16 34 46 / 28%);
}

#masthead .main-header-menu .sub-menu .menu-link {
	padding: 8px 12px;
	border-radius: 3px;
	font-size: 0.9375rem;
	color: var(--rsp-ink-2);
}

#masthead .main-header-menu .sub-menu .menu-link:hover,
#masthead .main-header-menu .sub-menu .menu-link:focus {
	background: var(--rsp-rs-wash);
	color: var(--rsp-rs-deep);
}

/* Menüpunkt mit der CSS-Klasse „rsp-fos“ (Design → Menüs → CSS-Klassen) */
#masthead .main-header-menu .rsp-fos .sub-menu .menu-link:hover,
#masthead .main-header-menu .rsp-fos .sub-menu .menu-link:focus {
	background: var(--rsp-fos-wash);
	color: var(--rsp-fos-deep);
}

/* Anmeldeknopf: blaue Fläche trägt Weiß (6,4:1) */
#masthead .ast-builder-button-wrap .ast-custom-button {
	min-height: 42px;
	padding: 9px 18px;
	border: 2px solid transparent;
	border-radius: 6px;
	background: var(--rsp-rs-deep);
	color: #fff;
	font-family: var(--rsp-font-display);
	font-size: 0.9375rem;
	font-weight: 600;
	white-space: nowrap;
}

/* Der Knopf gibt keinen Platz an das Menü ab, sonst bricht „Onlineanmeldung“ um. */
#masthead .ast-builder-button-wrap {
	flex-shrink: 0;
}

#masthead .ast-builder-button-wrap .ast-custom-button:hover,
#masthead .ast-builder-button-wrap .ast-custom-button:focus {
	background: #0d5077;
	color: #fff;
}

/* Schmale Desktops bis zu Astras Umschaltpunkt (ab 922px abwärts mobil):
   Wortmarke, acht Punkte und Knopf bleiben in einer Reihe. */
@media (min-width: 923px) and (max-width: 1239px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 8px 5px;
		font-size: 0.8125rem;
	}

	#masthead .rsp-wortmarke__name {
		max-width: 10em;
	}

	#masthead .ast-builder-button-wrap .ast-custom-button {
		padding: 9px 12px;
		font-size: 0.875rem;
	}
}

@media (min-width: 923px) and (max-width: 1023px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 8px 3px;
		font-size: 0.75rem;
	}

	#masthead .rsp-wortmarke__name {
		font-size: 0.875rem;
	}

	#masthead .ast-builder-button-wrap .ast-custom-button {
		padding: 8px;
		font-size: 0.8125rem;
	}
}

/* Astra Pro begrenzt das aufgeklappte Mobilmenü der klebenden Kopfzeile auf
   60vh; darunter schien die Seite durch. Jetzt reicht es bis zum Bildrand. */
#ast-mobile-header .ast-mobile-header-content {
	max-height: calc(100vh - var(--rsp-header-h) - var(--wp-admin--admin-bar--height, 0px));
	max-height: calc(100dvh - var(--rsp-header-h) - var(--wp-admin--admin-bar--height, 0px));
	overscroll-behavior: contain;
}

/* Mobil: Menüknopf, Pfeile und Anmeldeknopf mindestens 48px hoch (Astra: 42–44px) */
.ast-header-break-point #masthead .menu-toggle,
.ast-header-break-point #masthead .ast-menu-toggle {
	min-width: 48px;
	min-height: 48px;
}

#masthead .ast-mobile-header-content .ast-builder-button-wrap .ast-custom-button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
}

/* Mobil: Menü als Liste mit großen Zielen */

/* Der Drawer hängt außerhalb von #masthead; ast-header-break-point sitzt am body.
   Nur Links im Menü: Astras Knopf trägt einen versteckten .menu-link, der
   sonst als zweites „Onlineanmeldung“ erscheint. */
.ast-mobile-popup-drawer .main-header-menu .menu-link,
.ast-header-break-point #masthead .main-header-menu .menu-link,
.ast-mobile-header-content .main-header-menu .menu-link {
	min-height: 48px;
	display: flex;
	align-items: center;
	font-weight: 600;
	color: var(--rsp-ink);
}

/* ---- Fußzeile --------------------------------------------------------- */
.site-footer,
.site-footer .site-above-footer-wrap[data-section],
.site-footer .site-primary-footer-wrap[data-section],
.site-footer .site-below-footer-wrap[data-section] {
	background: var(--rsp-ink);
	color: rgb(255 255 255 / 72%);
}

/* Seitenabstand wie in der Kopfzeile; auf dem Desktop bleibt die Reihe 1200px breit */
.site-footer .site-above-footer-wrap[data-section],
.site-footer .site-primary-footer-wrap[data-section],
.site-footer .site-below-footer-wrap[data-section] {
	padding-right: 20px;
	padding-left: 20px;
}

.site-footer .site-above-footer-wrap[data-section] {
	padding-top: 64px;
	padding-bottom: 48px;
}

.site-footer .site-primary-footer-wrap[data-section],
.site-footer .site-below-footer-wrap[data-section] {
	border-top: 1px solid rgb(255 255 255 / 12%);
}

.site-footer .rsp-wortmarke {
	color: #fff;
}

.site-footer .rsp-wortmarke__ort {
	color: rgb(255 255 255 / 50%);
}

.site-footer .footer-widget-area p {
	max-width: 30ch;
	margin-top: 16px;
	font-size: 0.9375rem;
}

.site-footer .footer-widget-area .rsp-fuss-titel {
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgb(255 255 255 / 16%);
	font-size: 0.8125rem;
	font-weight: 700;
	color: #fff;
}

.site-footer .footer-widget-area .rsp-fuss-titel--rs {
	border-bottom-color: var(--rsp-rs);
}

.site-footer .footer-widget-area .rsp-fuss-titel--fos {
	border-bottom-color: var(--rsp-fos);
}

.site-footer .footer-widget-area .rsp-fuss-links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer .footer-widget-area .rsp-fuss-links a {
	display: flex;
	align-items: center;
	min-height: 40px;
	font-size: 0.9375rem;
	color: rgb(255 255 255 / 66%);
	text-decoration: none;
}

.site-footer .footer-widget-area a:hover,
.site-footer .footer-widget-area a:focus {
	color: #fff;
}

/* Standorte: Farbe kodiert die Schule. Wolfstein ist RS plus, Lauterecken beide. */
.site-footer .rsp-standorte {
	gap: 40px;
	margin: 0;
	padding: 40px 0;
}

.site-footer .rsp-standort {
	padding-left: 20px;
	border-left: 3px solid var(--rsp-rs);
}

.site-footer .rsp-standort--beide {
	border-image: linear-gradient(var(--rsp-rs) 50%, var(--rsp-fos) 50%) 1;
}

.site-footer .rsp-standort h3 {
	margin: 0 0 4px;
	font-size: 1rem;
	color: #fff;
}

.site-footer .rsp-standort p {
	max-width: none;
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.9;
}

.site-footer .rsp-standort a {
	display: inline-block;
	min-height: 24px;
	line-height: 1.5;
	border-bottom: 1px solid rgb(255 255 255 / 30%);
	color: rgb(255 255 255 / 85%);
	text-decoration: none;
}

/* Untere Reihe: Copyright und Rechtliches */
.site-footer .ast-footer-copyright,
.site-footer .ast-footer-copyright p {
	font-size: 0.8125rem;
	color: rgb(255 255 255 / 62%);
}

.site-footer #astra-footer-menu .menu-link {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	font-size: 0.8125rem;
	color: rgb(255 255 255 / 62%);
}

.site-footer #astra-footer-menu .menu-link:hover,
.site-footer #astra-footer-menu .menu-link:focus {
	color: #fff;
}

.site-footer :is(a, button):focus-visible {
	outline-color: #fff !important;
}

.site-footer .site-below-footer-wrap .ast-builder-grid-row > .site-footer-section:last-child {
	justify-content: flex-end;
}

@media (max-width: 921px) {

	.site-footer .site-below-footer-wrap .ast-builder-grid-row > .site-footer-section:last-child {
		justify-content: flex-start;
	}

	/* Astra zentriert das Fußzeilenmenü mobil; bündig mit dem Copyright, 44px Ziele */
	.site-footer #astra-footer-menu {
		justify-content: flex-start;
	}

	.site-footer #astra-footer-menu .menu-item {
		align-items: flex-start;
	}

	.site-footer #astra-footer-menu .menu-link {
		display: flex;
		align-items: center;
		min-height: 44px;
	}
}

/* Seiten laufen in Astras Vollbreite (ast-page-builder-template). Astra legt
   dort 2em oben und 20px seitlich um den Beitrag (0,3,1). Randlose Abschnitte
   sollen aber bis an den Fensterrand und direkt unter die Kopfzeile reichen;
   die Abstände bringen die Abschnitte selbst mit. Nur auf Seiten mit
   Spectra-Abschnitt; reine Textseiten (Impressum …) behalten Astras Rand.
   Stärker (0,4,1) als Astras Regel. */
.ast-single-post.ast-page-builder-template .site-main > article:has(.uagb-is-root-container) {
	padding: 0;
}

/* ---- Abschnitte (Spectra-Container mit Theme-Klassen) -----------------
   Spectra gibt jedem Container Innenabstände über .uagb-block-<id>. Die Regeln
   hier sind stärker (0,3,0) und legen Abstände und Flächen einheitlich fest,
   damit die Redaktion keine Zahlen in Spectra pflegen muss. */
.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt {
	padding-block: 80px;
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--eng {
	padding-block: 48px 32px;
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--kopf {
	padding-bottom: 0;
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--fuss {
	padding-top: 0;
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--flaeche {
	background: var(--rsp-surface);
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--kopf.rsp-abschnitt--flaeche {
	border-top: 1px solid var(--rsp-rule-soft);
}

.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--fuss.rsp-abschnitt--flaeche {
	border-bottom: 1px solid var(--rsp-rule-soft);
}

/* Der Bildungsweg ragt in den Hero hinein */
.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--ueberlappend {
	position: relative;
	z-index: 5;
	margin-top: -64px;
	padding-block: 0;
}

/* Spectras 10px Innenabstand des inneren Containers würde die Überlappung
   auf 54px kürzen */
.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt--ueberlappend > .uagb-container-inner-blocks-wrap > .wp-block-uagb-container {
	padding-top: 0;
}

.rsp-abschnitt__titel {
	margin: 0 0 12px;
	font-size: clamp(2rem, 4vw, 2.75rem);
}

.rsp-abschnitt__titel--klein {
	margin-bottom: 32px;
	font-size: 1.125rem;
}

/* align-self: Spectras Container zentrieren ihre Kinder (align-items: center) */
.rsp-abschnitt__einleitung {
	align-self: flex-start;
	max-width: 58ch;
	margin: 0 0 40px;
	font-size: 1.125rem;
	color: var(--rsp-ink-2);
}

/* Anmeldung: zwei Hälften bis an den Rand, links RS, rechts FOS */
.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-anmeldung {
	padding: 0;
}

.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-anmeldung > .uagb-container-inner-blocks-wrap {
	max-width: none;
	gap: 0;
	column-gap: 0;
	row-gap: 0;
	padding: 0;
	/* Beide Hälften so hoch wie die höhere */
	align-items: stretch;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte {
	padding: 64px 48px;
	justify-content: flex-start;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte > * {
	max-width: 30rem;
	margin-inline: auto;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte--rs {
	background: var(--rsp-rs-deep);
	color: #fff;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte--fos {
	background: var(--rsp-fos);
	color: var(--rsp-ink);
}

.rsp-anmeldung__haelfte h2 {
	margin-bottom: 12px;
	font-size: 1.875rem;
	color: inherit;
}

.rsp-anmeldung__haelfte p {
	font-size: 0.9375rem;
	opacity: 0.9;
}

.rsp-anmeldung__haelfte .rsp-anmeldung__wann {
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid currentcolor;
	font-size: 0.8125rem;
	font-weight: 600;
	opacity: 0.8;
}

/* Auf Orange reicht der Kontrast mit 0.8 nicht (4,46 : 1 bei 13px) */
.rsp-anmeldung__haelfte--fos .rsp-anmeldung__wann {
	opacity: 1;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte--rs :is(a, button):focus-visible {
	outline-color: #fff !important;
}

.wp-block-uagb-container.rsp-anmeldung__haelfte--fos :is(a, button):focus-visible {
	outline-color: var(--rsp-ink) !important;
}

.rsp-anmeldung__haelfte--rs .wp-block-button__link {
	background: #fff;
	color: var(--rsp-rs-deep);
}

.rsp-anmeldung__haelfte--rs .wp-block-button__link:hover,
.rsp-anmeldung__haelfte--rs .wp-block-button__link:focus {
	background: #e7f1f7;
	color: var(--rsp-rs-deep);
}

.rsp-anmeldung__haelfte--fos .wp-block-button__link {
	background: var(--rsp-ink);
	color: #fff;
}

.rsp-anmeldung__haelfte--fos .wp-block-button__link:hover,
.rsp-anmeldung__haelfte--fos .wp-block-button__link:focus {
	background: #1e3b4d;
	color: #fff;
}

@media (max-width: 820px) {

	.wp-block-uagb-container.uagb-is-root-container.rsp-abschnitt:not(.rsp-abschnitt--eng):not(.rsp-abschnitt--ueberlappend) {
		padding-block: 64px;
	}

	.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-abschnitt.rsp-abschnitt--kopf {
		padding-bottom: 0;
	}

	.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-abschnitt.rsp-abschnitt--fuss {
		padding-top: 0;
	}

	.wp-block-uagb-container.rsp-anmeldung__haelfte {
		padding: 48px 24px;
	}
}

/* ---- Leselayout der Unterseiten ---------------------------------------
   Text links, Seitenleiste rechts (Spectra-Container 2:1). Kernblöcke im
   Lesetext bekommen hier ihre Gestaltung; eigene Blöcke (.rsp-block) nicht. */
.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout {
	padding-block: 64px 80px;
}

.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout > .uagb-container-inner-blocks-wrap {
	align-items: flex-start;
	column-gap: 64px;
}

/* Die Seitenleiste ist höher als ein Laptop-Bildschirm. Klebte sie als
   Ganzes, bliebe der Anmeldekasten unten dauerhaft außer Sicht. Deshalb reicht
   die Spalte über die ganze Texthöhe, und nur das Inhaltsverzeichnis klebt;
   Kennzahlen und Anmeldung laufen normal mit und gleiten darunter durch. */
.wp-block-uagb-container.rsp-seitenspalte {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: stretch;
	align-self: stretch;
	gap: 24px;
}

@media (min-width: 1081px) and (min-height: 640px) {

	/* Spectra setzt Kindern seiner Container position: relative, mit einem
	   Selektor aus über zehn :not()-Klassen. Nur !important hält dagegen. */
	.wp-block-uagb-container.rsp-seitenspalte > .rsp-verzeichnis {
		position: sticky !important;
		top: calc(var(--rsp-header-h) + var(--wp-admin--admin-bar--height, 0px) + 24px);
		z-index: 1;
	}
}

/* Spectras Container zentrieren ihre Kinder (align-items: center); der Lesetext
   ist linksbündig, breite Kinder füllen die Spalte weiter ganz aus. */
.wp-block-uagb-container.rsp-lesetext {
	align-items: flex-start;
}

.wp-block-uagb-container.rsp-lesetext > * {
	width: 100%;
}

/* Zitate haben Außenabstand: mit width 100% (auch von Spectra gesetzt) ragten sie am Handy über den Rand;
   max-width zieht beide Ränder ab. */
.wp-block-uagb-container.rsp-lesetext > blockquote.wp-block-quote {
	max-width: calc(100% - 3em);
}

/* Lesetext: schmale Spalte, ruhige Überschriften */
.rsp-lesetext > p,
.rsp-lesetext > .rsp-hinweis p {
	max-width: 68ch;
	color: var(--rsp-ink-2);
}

.rsp-lesetext strong {
	font-weight: 600;
	color: var(--rsp-ink);
}

.rsp-lesetext > h2.wp-block-heading {
	margin: 64px 0 8px;
	padding-top: 20px;
	border-top: 2px solid var(--rsp-ink);
	font-size: 1.875rem;
}

.rsp-lesetext > h2.wp-block-heading:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.rsp-lesetext > h3.wp-block-heading {
	margin: 32px 0 8px;
	font-size: 1.125rem;
}

/* Aufzählungen: kleines Quadrat in der Schulfarbe */
.rsp-lesetext > ul.wp-block-list,
.rsp-lesetext .rsp-hinweis ul.wp-block-list,
.rsp-lesetext .rsp-standortkarte ul.wp-block-list {
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}

.rsp-lesetext > ul.wp-block-list > li,
.rsp-lesetext .rsp-hinweis ul.wp-block-list > li,
.rsp-lesetext .rsp-standortkarte ul.wp-block-list > li {
	position: relative;
	max-width: 66ch;
	padding-left: 24px;
	color: var(--rsp-ink-2);
}

.rsp-lesetext ul.wp-block-list > li + li {
	margin-top: 12px;
}

.rsp-lesetext ul.wp-block-list > li::before {
	content: "";
	position: absolute;
	top: 0.62em;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 2px;
	background: var(--rsp-rs);
}

.rsp-leselayout--fos .rsp-lesetext ul.wp-block-list > li::before {
	background: var(--rsp-fos);
}

/* Links im Fließtext, nicht in eigenen Blöcken */
.rsp-lesetext > p a,
.rsp-lesetext > .rsp-hinweis p a {
	border-bottom: 1px solid currentcolor;
	font-weight: 600;
	color: var(--rsp-rs-deep);
	text-decoration: none;
}

.rsp-leselayout--fos .rsp-lesetext > p a,
.rsp-leselayout--fos .rsp-lesetext > .rsp-hinweis p a {
	color: var(--rsp-fos-deep);
}

/* Hinweiskasten */
.wp-block-group.rsp-hinweis {
	margin-top: 24px;
	padding: 20px 24px;
	border-left: 4px solid var(--rsp-fos);
	border-radius: 0 var(--rsp-r-md) var(--rsp-r-md) 0;
	background: var(--rsp-fos-wash);
}

.wp-block-group.rsp-hinweis--rs {
	border-left-color: var(--rsp-rs);
	background: var(--rsp-rs-wash);
}

.wp-block-group.rsp-hinweis h3 {
	margin: 0 0 8px;
	font-size: 1rem;
}

.wp-block-group.rsp-hinweis p,
.wp-block-group.rsp-hinweis li {
	font-size: 0.9375rem;
}

/* Kachelraster: zwei Spalten, auf schmalen Schirmen eine */
.wp-block-group.rsp-kachelraster {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 24px;
}

.wp-block-group.rsp-kachel,
.wp-block-group.rsp-standortkarte {
	margin: 0;
	padding: 20px;
	border: 1px solid var(--rsp-rule);
	border-radius: var(--rsp-r-md);
	background: var(--rsp-surface);
}

.wp-block-group.rsp-kachel h3,
.wp-block-group.rsp-standortkarte h3 {
	margin: 0 0 4px;
	font-size: 1rem;
}

.wp-block-group.rsp-kachel p {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--rsp-ink-2);
}

/* Standorte: Farbe kodiert die Schule. Wolfstein RS plus, Lauterecken beide. */
.wp-block-group.rsp-standortkarte {
	border-top: 4px solid var(--rsp-rs);
	border-radius: 0 0 var(--rsp-r-md) var(--rsp-r-md);
}

/* Geteilte Linie als Hintergrund unter dem durchsichtigen oberen Rand:
   border-image würde Seitenränder und Radius verschlucken. */
.wp-block-group.rsp-standortkarte--beide {
	border-top-color: transparent;
	background:
		linear-gradient(90deg, var(--rsp-rs) 50%, var(--rsp-fos) 50%) top / 100% 4px no-repeat border-box,
		var(--rsp-surface);
}

/* Bild mit Bildunterschrift im Lesefluss */
.rsp-lesetext > .wp-block-image {
	margin-top: 24px;
}

.rsp-lesetext > .wp-block-image img {
	width: 100%;
	height: auto;
	border: 1px solid var(--rsp-rule);
	border-radius: var(--rsp-r-md);
	background: var(--rsp-surface);
}

.rsp-lesetext > .wp-block-image figcaption {
	margin-top: 12px;
	font-size: 0.8125rem;
	color: var(--rsp-ink-3);
}

/* Audio mit Bildunterschrift, etwa ein Radiobeitrag */
.rsp-lesetext > .wp-block-audio {
	margin-top: 24px;
}

.rsp-lesetext > .wp-block-audio audio {
	width: 100%;
}

.rsp-lesetext > .wp-block-audio figcaption {
	margin-top: 8px;
	font-size: 0.8125rem;
	color: var(--rsp-ink-3);
}

/* Aufklappbarer Text, etwa eine Abschrift unter dem Audio */
.rsp-lesetext > .wp-block-details {
	margin-top: 16px;
	border: 1px solid var(--rsp-rule);
	border-radius: var(--rsp-r-md);
	background: var(--rsp-surface);
}

.rsp-lesetext > .wp-block-details > summary {
	padding: 14px 20px;
	font-weight: 600;
	color: var(--rsp-rs-deep);
	cursor: pointer;
}

.rsp-lesetext > .wp-block-details[open] > summary {
	border-bottom: 1px solid var(--rsp-rule);
}

.rsp-lesetext > .wp-block-details > p {
	max-width: 68ch;
	margin: 16px 20px 0;
	color: var(--rsp-ink-2);
}

.rsp-lesetext > .wp-block-details > p:last-child {
	margin-bottom: 20px;
}

/* Quellenangaben unter einer Aussage: klein und zurückhaltend */
.wp-block-group.rsp-quellen {
	margin-top: 16px;
	font-size: 0.8125rem;
	color: var(--rsp-ink-3);
}

.wp-block-group.rsp-quellen p {
	margin: 0;
}

/* Die Quadrate der Lesetext-Listen (li::before) brauchen ein positioniertes li */
.wp-block-group.rsp-quellen ul.wp-block-list {
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
}

.rsp-lesetext .wp-block-group.rsp-quellen ul.wp-block-list > li {
	position: relative;
	padding-left: 16px;
}

.rsp-lesetext .wp-block-group.rsp-quellen ul.wp-block-list > li::before {
	top: 0.55em;
	width: 5px;
	height: 5px;
}

.rsp-lesetext .wp-block-group.rsp-quellen ul.wp-block-list > li + li {
	margin-top: 4px;
}

.wp-block-group.rsp-quellen a {
	color: var(--rsp-rs-deep);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Kästen der Seitenleiste aus Kernblöcken */
.wp-block-group.rsp-seitenkasten {
	padding: 20px 24px;
	border: 1px solid var(--rsp-rule);
	border-radius: var(--rsp-r-lg);
	background: var(--rsp-surface);
}

.wp-block-group.rsp-seitenkasten .rsp-seitenkasten__titel {
	margin: 0 0 12px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--rsp-ink);
	font-size: 0.8125rem;
	font-weight: 700;
}

.wp-block-group.rsp-seitenkasten p {
	margin: 0 0 16px;
	font-size: 0.9375rem;
	color: var(--rsp-ink-2);
}

.wp-block-group.rsp-seitenkasten .wp-block-button,
.wp-block-group.rsp-seitenkasten .wp-block-button__link {
	width: 100%;
}

/* Kurze Seiten: eine Spalte mit höchstens 760 px Text, ohne Seitenleiste.
   Die Innenhülle behält Spectras Breite, damit der Text linksbündig unter
   dem Seitenkopf beginnt; begrenzt wird nur die Spalte. Spectra setzt
   Breite und Abstand mit 0,4,0; hier 0,5,0. Die Spalte braucht 0,7,0, weil
   die Regel des breiten Leselayouts unter 1080 px sonst auf 100 % zieht. */
.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout--schmal > .uagb-container-inner-blocks-wrap {
	flex-direction: column;
}

.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout.rsp-leselayout--schmal > .uagb-container-inner-blocks-wrap > .wp-block-uagb-container {
	width: 100%;
	max-width: 760px;
}

/* ---- Gravity Forms ----------------------------------------------------
   Gravity Forms setzt seine Farben je Formular mit einem ID-Selektor
   (#gform_wrapper_N…, 1,2,0); dagegen hilft nur !important. Farben wie die
   eigenen Knöpfe: RS rs-deep mit Weiß, FOS Orange mit Tinte. Häkchen und
   Radiopunkte in der FOS in fos-deep, weil Orange auf Weiß unter 3:1 bleibt. */
.rsp-lesetext .gform_wrapper.gform-theme {
	--gf-color-primary: var(--rsp-rs-deep) !important;
	--gf-color-primary-rgb: 17, 100, 146 !important;
	--gf-color-primary-contrast: #fff !important;
	--gf-color-primary-contrast-rgb: 255, 255, 255 !important;
	--gf-color-primary-darker: #0d5077 !important;
	--gf-color-primary-lighter: var(--rsp-rs) !important;
	--gf-color-in-ctrl-primary: var(--rsp-rs-deep) !important;
	--gf-color-in-ctrl-primary-rgb: 17, 100, 146 !important;
	--gf-color-in-ctrl-primary-contrast: #fff !important;
	--gf-color-in-ctrl-primary-darker: #0d5077 !important;
	--gf-color-in-ctrl-primary-lighter: var(--rsp-rs) !important;
	--gf-ctrl-btn-bg-color-primary: var(--rsp-rs-deep) !important;
}

.rsp-leselayout--fos .rsp-lesetext .gform_wrapper.gform-theme {
	--gf-color-primary: var(--rsp-fos) !important;
	--gf-color-primary-rgb: 239, 128, 24 !important;
	--gf-color-primary-contrast: var(--rsp-ink) !important;
	--gf-color-primary-contrast-rgb: 16, 34, 46 !important;
	--gf-color-primary-darker: #dc7311 !important;
	--gf-color-primary-lighter: var(--rsp-fos) !important;
	--gf-color-in-ctrl-primary: var(--rsp-fos-deep) !important;
	--gf-color-in-ctrl-primary-rgb: 168, 91, 12 !important;
	--gf-color-in-ctrl-primary-darker: #8a4a09 !important;
	--gf-color-in-ctrl-primary-lighter: var(--rsp-fos-deep) !important;
	--gf-ctrl-btn-bg-color-primary: var(--rsp-fos) !important;
}

/* Kalenderknopf im Datumsfeld: 22 px → 24 px Zielgröße (2.5.8) */
.rsp-lesetext .gform_wrapper.gform-theme .gform-datepicker-toggle {
	min-width: 24px !important;
	min-height: 24px !important;
}

/* ---- Schulleben-Eintrag ------------------------------------------------
   Seitenkopf über die volle Breite, darunter Text, Videos und Bilder in einer
   Lesespalte wie beim schmalen Leselayout, die weiteren Einträge breiter.
   Beide beginnen linksbündig an der Textkante des Seitenkopfs (Rahmen
   1228 px mittig, 24 px Innenabstand, bis 820 px 20 px). Astra polstert den
   Artikel mit 0,3,1 (.ast-single-post.ast-page-builder-template), daher 0,3,2:
   sonst endet die Linie unter dem Seitenkopf 20 px vor dem Rand. */
body.single-rsp_schulleben.ast-single-post .site-main > article {
	margin: 0;
	padding: 0;
	background: none;
}

/* Astras leerer Titelkopf (Höhe 0, 32 px Außenabstand) schöbe den Seitenkopf
   tiefer als auf den Seiten. */
.single-rsp_schulleben .site-main > article .entry-header.ast-no-title {
	display: none;
}

.single-rsp_schulleben .entry-content > :not(.alignfull) {
	width: min(760px, 100% - 48px);
	margin-inline: calc(max(0px, (100% - 1228px) / 2) + 24px) auto;
}

.single-rsp_schulleben .entry-content > .rsp-schulleben {
	width: min(1180px, 100% - 48px);
	margin-bottom: 80px;
}

@media (max-width: 820px) {

	.single-rsp_schulleben .entry-content > :not(.alignfull) {
		width: calc(100% - 40px);
		margin-inline: 20px;
	}
}

.single-rsp_schulleben .entry-content > .rsp-seitenkopf + * {
	margin-top: 48px;
}

.single-rsp_schulleben .entry-content > p {
	color: var(--rsp-ink-2);
}

.single-rsp_schulleben .entry-content > p a {
	border-bottom: 1px solid currentcolor;
	font-weight: 600;
	color: var(--rsp-rs-deep);
	text-decoration: none;
}

.single-rsp_schulleben .entry-content > h2.wp-block-heading {
	margin-block: 56px 16px;
	padding-top: 20px;
	border-top: 2px solid var(--rsp-ink);
	font-size: 1.5rem;
}

/* Astra nimmt den Enkeln des Inhalts die Höchstbreite (0,4,0), daher 0,4,2. Bilder bleiben
   in ihrer Spalte, auch bei 320 px (1.4.10). */
.single-rsp_schulleben .site-main .entry-content > figure.wp-block-image img {
	max-width: 100%;
	height: auto;
}

.single-rsp_schulleben .entry-content > .wp-block-video video {
	display: block;
	width: 100%;
	height: auto;
	max-height: 80vh;
	object-fit: contain;
	background: var(--rsp-ink);
}

/* Unter 1080 px: Seitenleiste unter den Text, nichts klebt */
@media (max-width: 1080px) {

	.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout > .uagb-container-inner-blocks-wrap {
		flex-direction: column;
		row-gap: 48px;
	}

	.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout > .uagb-container-inner-blocks-wrap > .wp-block-uagb-container {
		width: 100%;
		max-width: 100%;
	}

	.wp-block-uagb-container.rsp-seitenspalte {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
	}
}

@media (max-width: 820px) {

	.wp-block-uagb-container.uagb-is-root-container.alignfull.rsp-leselayout {
		padding-block: 48px 64px;
	}

	.wp-block-group.rsp-kachelraster,
	.wp-block-uagb-container.rsp-seitenspalte {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Wer „weniger Bewegung“ eingestellt hat, bekommt keine Übergänge. */
@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
	}
}

/* Startseite: Hinweis auf den Kalender als PDF unter dem Terminkasten */
.rsp-termine-pdf {
	margin-top: 12px;
	font-size: var(--rsp-t-sm);
	color: var(--rsp-ink-2);
}

/* Flyer zeigt das ganze Motiv, nicht beschnitten */
.wp-block-gallery.rsp-flyer.is-cropped .wp-block-image img {
	height: auto;
	object-fit: contain;
}

/* Praktikumsverzeichnis: Betriebslogos in Farbe, damit auch helle Logos lesbar sind */
.wp-block-gallery.is-style-logoleiste.is-style-logoleiste.rsp-logos-farbig.has-nested-images figure.wp-block-image:not(#individual-image) img {
	filter: none;
	opacity: 1;
}

/* Hauptmenü mit neun Punkten: bleibt in einer Reihe */
@media (min-width: 1240px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 9px 5px;
		font-size: 0.8125rem;
	}
}

@media (min-width: 1100px) and (max-width: 1239px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 8px 3px;
		font-size: 0.75rem;
	}
}

@media (min-width: 923px) and (max-width: 1099px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 8px 2px;
		font-size: 0.6875rem;
	}

	#masthead .rsp-wortmarke__name {
		max-width: 8em;
		font-size: 0.8125rem;
	}

	#masthead .ast-builder-button-wrap .ast-custom-button {
		padding: 8px;
		font-size: 0.75rem;
	}
}

@media (min-width: 923px) and (max-width: 979px) {

	#masthead .main-header-menu > .menu-item > .menu-link {
		padding: 8px 1px;
	}

	#masthead .rsp-wortmarke__name {
		max-width: 7em;
	}
}

/* Tabelle mit Klasse rsp-tabelle-stapel: auf dem Handy jede Zeile als Karte,
   damit lange Bezeichnungen wie "Wirtschaft und Verwaltung" nicht mitten im Wort umbrechen.
   Spaltenbeschriftungen kommen aus der Kopfzeile der Wahlpflichtfächer-Tabelle. */
@media (max-width: 640px) {
	.rsp-tabelle-stapel table,
	.rsp-tabelle-stapel tbody,
	.rsp-tabelle-stapel tr,
	.rsp-tabelle-stapel td {
		display: block;
		width: 100%;
	}
	.rsp-tabelle-stapel thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}
	.rsp-tabelle-stapel table,
	.rsp-tabelle-stapel td {
		border: 0;
	}
	.rsp-tabelle-stapel tr {
		border: 1px solid var(--rsp-rule);
		border-radius: var(--rsp-r-md);
		margin-bottom: 0.75rem;
		overflow: hidden;
	}
	.rsp-tabelle-stapel td {
		padding: 0.5rem 0.875rem;
		border-top: 1px solid var(--rsp-rule-soft);
		word-break: normal;
		overflow-wrap: normal;
		hyphens: manual;
	}
	.rsp-tabelle-stapel td:first-child {
		border-top: 0;
		background: var(--rsp-rs-wash);
		color: var(--rsp-rs-deep);
		font-weight: 700;
	}
	.rsp-tabelle-stapel td:not(:first-child)::before {
		display: block;
		font-size: 0.8125em;
		font-weight: 600;
		color: var(--rsp-rs-deep);
	}
	.rsp-tabelle-stapel td:nth-child(2)::before { content: "Klassen 7 und 8"; }
	.rsp-tabelle-stapel td:nth-child(3)::before { content: "Klasse 9"; }
	.rsp-tabelle-stapel td:nth-child(4)::before { content: "Klasse 10"; }
}

/* Firmenverzeichnis im Praktikumsverzeichnis (Seite 331): je Betrieb ein aufklappbarer Eintrag,
   dicht untereinander, der Ort steht hell hinter dem Namen. */
.rsp-lesetext > .wp-block-details.rsp-firma + .wp-block-details.rsp-firma {
	margin-top: 8px;
}
.rsp-lesetext > .wp-block-details.rsp-firma > summary {
	padding: 10px 16px;
}
.rsp-leselayout--fos .rsp-lesetext > .wp-block-details.rsp-firma > summary {
	color: var(--rsp-fos-deep);
}
.rsp-firma__ort {
	margin-left: 0.5em;
	font-weight: 400;
	color: var(--rsp-ink-3);
}
/* Logo rechts in der Zeile wie im alten Verzeichnis. Summary als Flexzeile, das Dreieck kommt deshalb aus ::before. */
.rsp-lesetext > .wp-block-details.rsp-firma > summary {
	display: flex;
	align-items: center;
	min-height: 56px;
	list-style: none;
}
.rsp-lesetext > .wp-block-details.rsp-firma > summary::-webkit-details-marker {
	display: none;
}
.rsp-lesetext > .wp-block-details.rsp-firma > summary::before {
	content: "";
	flex: none;
	width: 0;
	height: 0;
	margin-right: 10px;
	border-style: solid;
	border-width: 5px 0 5px 7px;
	border-color: transparent transparent transparent currentColor;
	transition: transform 0.15s;
}
.rsp-firma__name {
	flex: 1 1 auto;
	min-width: 0;
}
.rsp-firma__name .rsp-firma__ort {
	white-space: nowrap;
}
.rsp-lesetext > .wp-block-details.rsp-firma[open] > summary::before {
	transform: rotate(90deg);
}
.rsp-lesetext > .wp-block-details.rsp-firma > summary img {
	flex: none;
	width: auto;
	height: auto;
	max-width: 130px;
	max-height: 40px;
	margin-left: auto;
	padding-left: 16px;
	object-fit: contain;
}
@media (max-width: 480px) {
	.rsp-lesetext > .wp-block-details.rsp-firma > summary img {
		max-width: 84px;
		max-height: 32px;
	}
}
.rsp-lesetext > .wp-block-details.rsp-firma > p {
	margin: 12px 16px 16px;
	line-height: 1.6;
	overflow-wrap: anywhere;
}

/* Klassenelternsprecher (Seite 224): schmale Tabelle, Klassenspalte hervorgehoben */
.rsp-tabelle-kes td:first-child {
	font-weight: 700;
	color: var(--rsp-rs-deep);
	white-space: nowrap;
}