/* ==========================================================================
   Gemeinsamer Aufbau aller Unterseiten (nicht der Startseite)

   Seiten, Neuigkeiten (Beiträge, Archive), Suche und 404:
   - oben der gemeinsame Seitenkopf (style.css, inc/seitenkopf.php),
   - links die weiße Inhaltskarte (.hrs-inhaltskarte),
   - darin oben der Titelkopf (.hrs-titelkopf: Dachzeile + h1 in
     Abschnittskopf-Optik), bei Seiten darunter Brotkrumen und Auszug,
     bei Beiträgen Datum / Autor / Kategorie,
   - rechts die Seitenleiste (Tablet/Handy: unter dem Inhalt).

   Markup: inc/seiten.php (Titelkopf, Karte, „In diesem Bereich“),
   inc/news.php (Dachzeile Neuigkeiten, Karte im Archiv),
   inc/extras.php (Suche, 404). Body-Klasse: .hrs-unterseite.
   Die Bereichs-Dateien (seiten.css, news.css, extras.css) enthalten nur
   noch die Gestaltung des jeweiligen Inhalts.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Abstände und Spalten
   -------------------------------------------------------------------------- */

body.hrs-unterseite #main > [data-vertical-spacing],
body.hrs-unterseite #main > .hrs-sonderseite {
	--theme-content-vertical-spacing: clamp(1.75rem, 4vw, 3rem);
}

body.hrs-unterseite [data-sidebar] {
	--sidebar-width: 300px;
	--sidebar-gap: clamp(1.5rem, 3vw, 2.5rem);
	--sidebar-widgets-spacing: 1.5rem;
	align-items: start;
}

/* --------------------------------------------------------------------------
   Inhaltskarte
   -------------------------------------------------------------------------- */

/* Zweiter Selektor: gleiche Gewichtung wie Blocksys „[class*=ct-container] > article“ (Stil „boxed“). */
.hrs-inhaltskarte,
[class*="ct-container"] > article.hrs-inhaltskarte {
	--hrs-karte-abstand: clamp(1.1rem, 3.5vw, 2.5rem);
	box-sizing: border-box;
	min-width: 0;
	padding: var(--hrs-karte-abstand);
	background: var(--hrs-white);
	border: 1px solid rgba(49, 50, 51, 0.1);
	border-radius: var(--hrs-radius);
	box-shadow: 0 18px 50px rgba(49, 50, 51, 0.07);
}

/*
 * Ohne Seitenleiste (automatisch, z. B. Kalenderseite, oder per Seiten-/
 * Beitrags-Option „Seitenstruktur“): Blocksy gibt dann einen Container über
 * die volle Breite aus. Die Karte wird auf die normale bzw. schmale
 * Inhaltsbreite begrenzt und mittig gesetzt.
 */
.ct-container-full[data-content] > article.hrs-inhaltskarte {
	width: var(--theme-container-width, 90%);
	max-width: min(
		var(--theme-normal-container-max-width, 1180px),
		calc(var(--theme-block-max-width, 1180px) + 2 * var(--hrs-karte-abstand))
	);
	margin-inline: auto;
}

/* Blocksy-Titel (Typ 1) in der Karte. */
.hrs-inhaltskarte .hero-section[data-type="type-1"] {
	--alignment: left;
	--margin-bottom: clamp(1.5rem, 3vw, 2.1rem);
}

.hrs-inhaltskarte .hero-section[data-type="type-1"] .entry-header {
	--item-spacing: 1rem;
}

.hrs-inhaltskarte .entry-content > :first-child {
	margin-top: 0;
}

.hrs-inhaltskarte .entry-content > :last-child {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   Titelkopf: Dachzeile + Titel (h1) in Abschnittskopf-Optik
   -------------------------------------------------------------------------- */

.hrs-titelkopf {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
	margin-bottom: clamp(1.3rem, 3vw, 1.75rem);
	padding: clamp(0.95rem, 2.2vw, 1.25rem) clamp(1rem, 2.6vw, 1.5rem) clamp(1.05rem, 2.4vw, 1.35rem);
	background: var(--hrs-pastel), var(--hrs-white);
	border: 1px solid var(--hrs-line);
	border-radius: var(--hrs-radius);
	box-shadow: var(--hrs-shadow-soft);
	text-align: left;
}

/* Regenbogenlinie an der Unterkante. */
.hrs-titelkopf::after {
	content: "";
	position: absolute;
	right: 1rem;
	bottom: -5px;
	left: 1rem;
	height: 5px;
	background: var(--hrs-rainbow);
	border-radius: 999px;
}

.hrs-titelkopf__text {
	flex: 1 1 18rem;
	min-width: 0;
}

.hrs-titelkopf__dachzeile {
	margin: 0 0 0.35rem;
	color: var(--hrs-red-text);
	font-size: 0.78rem;
	font-weight: 850;
	letter-spacing: 0.14em;
	line-height: 1.3;
	text-transform: uppercase;
}

.hrs-titelkopf__dachzeile a {
	color: inherit;
	text-decoration: none;
}

.hrs-titelkopf__dachzeile a:hover {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.hrs-titelkopf .page-title {
	margin: 0;
	color: var(--hrs-ink);
	font-size: clamp(1.45rem, 2.7vw, 2.1rem);
	font-weight: 850;
	line-height: 1.15;
	overflow-wrap: break-word;
	hyphens: auto;
}

/* Im Blocksy-Titelbereich: Abstand zum Titelkopf statt der Elemente-Abstände. */
.entry-header > .hrs-titelkopf:last-child {
	margin-bottom: 0;
}

.entry-header > .hrs-titelkopf + * {
	margin-top: 0 !important;
}

/* --------------------------------------------------------------------------
   Unter dem Titelkopf: Brotkrumen, Auszug, Meta
   -------------------------------------------------------------------------- */

.hrs-inhaltskarte .hero-section .ct-breadcrumbs {
	color: var(--hrs-muted);
	font-size: 0.84rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
}

.hrs-inhaltskarte .hero-section .ct-breadcrumbs a {
	color: var(--hrs-ink);
	text-decoration: underline;
	text-decoration-color: rgba(49, 50, 51, 0.35);
	text-underline-offset: 0.2em;
}

.hrs-inhaltskarte .hero-section .ct-breadcrumbs a:hover {
	color: var(--hrs-red-text);
	text-decoration-color: currentColor;
}

.hrs-inhaltskarte .hero-section .ct-breadcrumbs .ct-separator {
	margin-inline: 0.4rem;
}

.hrs-inhaltskarte .hero-section .page-description {
	display: block;
	max-width: 46rem;
	margin-top: 0.9rem;
	color: var(--hrs-ink);
	font-size: clamp(1.02rem, 1.5vw, 1.14rem);
	line-height: 1.55;
}

.hrs-inhaltskarte .hero-section .page-description p {
	margin: 0;
}

/* Meta bei Beiträgen: Datum / Autor / Kategorie (Reihenfolge per order, siehe news.css). */
.hrs-inhaltskarte .hero-section .entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--hrs-ink);
	font-size: 0.86rem;
	font-weight: 800;
	line-height: 1.4;
	text-transform: none;
}

.hrs-inhaltskarte .hero-section .entry-meta > li {
	margin: 0;
}

.hrs-inhaltskarte .hero-section .entry-meta > li::after {
	display: none;
}

.hrs-inhaltskarte .hero-section .entry-meta > :is(.meta-author, .meta-categories)::before {
	content: "/";
	margin-inline: 0.5rem;
	color: var(--hrs-muted);
	font-weight: 600;
}

.hrs-inhaltskarte .hero-section .entry-meta .meta-categories a {
	color: var(--hrs-red-text);
	text-decoration: underline;
	text-decoration-color: rgba(171, 66, 36, 0.35);
	text-underline-offset: 0.2em;
}

.hrs-inhaltskarte .hero-section .entry-meta .meta-categories a:hover {
	color: var(--hrs-ink);
	text-decoration-color: currentColor;
}

/* --------------------------------------------------------------------------
   Seitenleiste: Kästen („In diesem Bereich“ und Widgets)
   Kasten-Optik und Link-Kacheln kommen aus style.css
   (.is-style-hrs-leistenkasten, .is-style-hrs-schnellzugriffe).
   -------------------------------------------------------------------------- */

body.hrs-unterseite #sidebar .ct-widget > .wp-block-group.is-style-hrs-leistenkasten {
	margin: 0;
}

#sidebar .is-style-hrs-leistenkasten :is(h2, h3) {
	color: var(--hrs-ink);
	font-weight: 850;
	line-height: 1.25;
}

.hrs-bereich .is-style-hrs-dachzeile {
	margin: 0.3rem 0 0.2rem;
	color: var(--hrs-ink);
	font-size: 0.72rem;
}

.hrs-bereich h2 {
	margin-top: 0;
}

/* Aktuelle Seite: dunkel hinterlegt und mit Pfeil (nicht nur über Farbe). */
.hrs-bereich-liste a[aria-current="page"] {
	background: var(--hrs-ink);
	border-color: var(--hrs-ink);
	color: var(--hrs-white);
}

.hrs-bereich-liste a[aria-current="page"]::before {
	content: "▸ ";
}

.hrs-bereich-liste a:focus-visible {
	outline: 3px solid var(--hrs-ink);
	outline-offset: 2px;
}

.hrs-bereich-liste .is-eltern > a {
	background: var(--hrs-white);
	border-color: rgba(49, 50, 51, 0.3);
}

/* Unterseite, die nicht im Menü steht (z. B. Kollegium unter „Wir über uns“). */
.hrs-bereich-liste ul {
	display: grid;
	gap: 0.45rem;
	margin: 0.45rem 0 0 1rem;
	padding: 0;
	list-style: none;
}

.hrs-bereich-liste ul li {
	margin: 0;
}

.hrs-bereich-liste ul a {
	padding-block: 0.5rem;
	font-size: 0.92rem;
}

/* --------------------------------------------------------------------------
   Tablet und Handy: Seitenleiste unter dem Inhalt
   -------------------------------------------------------------------------- */

@media (max-width: 999.98px) {
	body.hrs-unterseite [data-sidebar] {
		row-gap: 1.75rem;
	}

	body.hrs-unterseite .ct-sidebar[data-sticky-sidebar] {
		position: static;
	}
}

@media (max-width: 689.98px) {
	.hrs-inhaltskarte {
		padding: 1rem;
	}

	.hrs-titelkopf .page-title {
		font-size: clamp(1.35rem, 6.4vw, 1.7rem);
	}
}

/* --------------------------------------------------------------------------
   Druck
   -------------------------------------------------------------------------- */

@media print {
	body.hrs-unterseite #sidebar,
	.hrs-inhaltskarte .hero-section .ct-breadcrumbs {
		display: none !important;
	}

	.hrs-inhaltskarte {
		padding: 0;
		border: 0;
		box-shadow: none;
	}

	.hrs-titelkopf {
		padding: 0 0 0.8rem;
		background: none;
		border: 0;
		box-shadow: none;
	}
}