/**
 * KOPIE des Struktur-Stylesheets des HRB Unternehmensportals für das
 * Satelliten-Plugin: kein geteilter Code; Änderungen am Original werden hier nachgeführt.
 * Geladen nur auf Seiten mit gerendertem Shortcode (Shortcodes::enqueue_style()).
 * Token-Namen (--hrb-up-*) und Selektoren wie im Original, damit Theme-
 * Übersteuerungen auf Netzwerk-Ausgabeseiten und externen Zielen gleich wirken.
 * Bewusst abweichend vom Original: die Token-Werte im :root-Block, die Linkfarbe
 * (--hrb-up-muted), die Textfarbe von .hrb-up mit !important (einzige Ausnahme von
 * der Regel unten), der Select-Block für Safari im Suchfilter und der Abschnitt „Zusätze des
 * Satelliten-Plugins" — beim Nachführen nicht überschreiben.
 */

/**
 * Minimale Struktur-Styles der Standard-Templates.
 *
 * ABWEICHUNG, bewusst und begrenzt: "Theme-Implementierung und Styling der
 * Ausgabeseiten" sind aus dem Projektumfang ausgeschlossen. Diese Datei
 * bleibt deshalb auf Struktur, Raster und Rhythmus beschränkt und
 * gestaltet keine Seite, sondern nur die vier Plugin-Ansichten. Kein
 * `!important`, kein Reset, keine Element-Selektoren im Themenraum.
 *
 * Selektoren außerhalb von `.hrb-up` gibt es an GENAU EINER Stelle: im
 * Abschnitt "Rahmen der Ausgabe" für den Fallback-Kopf und -Fuß des
 * WordPress-Kerns (`#page > #header|#footer` aus
 * `wp-includes/theme-compat/`). Das ist ausdrücklich nicht der Kopf und Fuß
 * des Themes — die Begründung samt Ursache und richtiger Lösung steht dort.
 * Bringt das Theme einen eigenen Kopf mit, greift dieser Abschnitt nicht.
 *
 * HERKUNFT DER WERTE: die beiden produktiven
 * Vorbild-Seiten deine-jobmesse.de (zentrale Ausgabeseite) und
 * jobmesse-dresden.de (Messeseite). Befund: Beide laufen auf demselben
 * Design-System (Colibri, Open Sans) mit identischer Palette — es gibt genau
 * eine Gestaltungssprache zu treffen, nicht zwei. Die einzigen Unterschiede
 * sind unten unter "Variante Dresden" vermerkt.
 *
 * TOKEN-VERTRAG: Farben, Radien, Abstände und Schrift stehen ausschließlich
 * in dem `:root`-Block unten. Ein Theme übersteuert die Gestaltung
 * vollständig, indem es dieselben Eigenschaften erneut setzt — eine
 * Fundstelle, kein Eingriff in Regeln:
 *
 *     :root { --hrb-up-cta: #e30a1c; --hrb-up-tint: #eee; }
 *
 * `:root` und nicht `.hrb-up`, weil der Fallback-Kopf und -Fuß außerhalb des
 * Namensraums liegen und die Werte dort ebenfalls gelten müssen. Eine
 * Übersteuerung auf `.hrb-up` wirkt weiterhin, aber nur für die Ansichten.
 *
 * Die Werte sind bewusst NICHT an `--wp--preset--color--*` gekettet: Die
 * Preset-Namen der Themes sind nicht deckungsgleich (Twenty Twenty-Five führt
 * `accent-1` als Gelb, Colibri als Hellblau), eine Kettung ergäbe je Theme
 * eine andere und teils unlesbare Farbkombination.
 *
 * Variante Dresden (falls die beiden Ausgabeseiten auseinanderlaufen sollen)
 * — die drei einzigen gemessenen Unterschiede:
 *     --hrb-up-cta: #e30a1c;   statt #e3051b, ein Farbschritt Unterschied
 *     --hrb-up-tint: #eeeeee;  statt #f5fafd
 *     --hrb-up-radius: 5px;    Dresden setzt durchgehend 5px, nicht 10px
 *
 * BARRIEREFREIHEIT: Das Markenblau #03a9f4 erreicht auf Weiß nur 2,5:1 und
 * ist als Textfarbe nicht verwendbar (WCAG AA verlangt 4,5:1). Es dient hier
 * ausschließlich als Schmuckfarbe (Ränder, Marker); für Linktext steht die
 * abgedunkelte Markenvariante `--hrb-up-accent-ink` (#01699e, 5,8:1). Die
 * Vorbild-Seiten verwenden das helle Blau auch als Textfarbe — diese
 * Abweichung ist beabsichtigt.
 */

/* ------------------------------------------------------------------ *
 * Tokens und Grundlage
 * ------------------------------------------------------------------ */

/* Tokens auf `:root`, nicht auf `.hrb-up`: Der Fallback-Kopf und -Fuß des
   Kerns (s. Abschnitt "Rahmen der Ausgabe") sind GESCHWISTER von `.hrb-up`,
   keine Nachfahren — auf `.hrb-up` deklarierte Werte erreichen sie nicht. Die
   Namen sind durchgehend präfixiert und wirken nur, wo sie gelesen werden. */
:root {
	/* Schrift: Open Sans, wenn die Ausgabeseite sie lädt (produktiv der
	   Fall), sonst die Systemschrift. Das Plugin lädt bewusst keine
	   Webfont-Ressource nach — eine externe Anfrage je Seitenaufruf ist
	   eine Entscheidung des Betriebs, nicht des Plugins. */
	--hrb-up-font: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--hrb-up-text: #000000;
	/* dirty petrol*/
	--hrb-up-heading: #17252a;
	/* anthrazit */
	--hrb-up-muted: #5d686e;
	/* dunkelgrau */
	--hrb-up-accent: #03a9f4;
	/* mittelblau */
	--hrb-up-accent-ink: rgb(51, 51, 51);
	/* anthrazit */
	--hrb-up-cta: rgb(227, 10, 28);
	/* JM Rot */
	--hrb-up-cta-hover: rgb(227, 10, 28);
	/* JM Rot */
	--hrb-up-surface: #ffffff;
	--hrb-up-tint: #f9f7f7;
	/* sehr sehr helles Blau*/
	--hrb-up-border: rgb(224, 225, 225);
	/* hellgrau */
	--hrb-header-bg: #eeeef1;
	/* hellgrau */

	--hrb-up-radius: 0px;
	--hrb-up-radius-s: 0px;
	--hrb-up-radius-button: 5px;
	--hrb-up-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1);
	--hrb-up-shadow-lift: 0 0 8px rgba(86, 95, 98, 0.55);

	/* Abstandsstufen der Vorbild-Seiten. */
	--hrb-up-gap-s: 0.67rem;
	--hrb-up-gap: 1rem;
	--hrb-up-gap-m: 1.5rem;
	--hrb-up-gap-l: 2.25rem;
	--hrb-up-gap-xl: 3.38rem;

	--hrb-up-content: 1232px;
}

.hrb-up {
	max-width: var(--hrb-up-content);
	margin-inline: auto;
	padding-inline: clamp(0rem, 1vw, var(--hrb-up-gap-l));
	padding-block: clamp(1.5rem, 2vw, var(--hrb-up-gap-xl));
	font-family: var(--hrb-up-font);
	/* Grundgröße 16px/1.6 wie auf den Vorbild-Seiten. Ohne diese Angabe
	   erbt der Block die Fließgröße des Themes (Twenty Twenty-Five: 21,8px). */
	font-size: 1rem;
	line-height: 1.6;
	color: var(--hrb-up-text) !important;
}

/* Der Namensraum selbst MUSS mitgenannt sein: Erbt `.hrb-up` das `content-box` des Themes, gilt die
   Inhaltsbreite nur für den Inhaltskasten — die Spalte wird um den
   Innenabstand breiter (1232 + 72 = 1304px), und zwischen diesen beiden
   Fensterbreiten zentriert `margin-inline: auto` nicht mehr. */
.hrb-up,
.hrb-up *,
.hrb-up *::before,
.hrb-up *::after {
	box-sizing: border-box;
}

.hrb-up :focus-visible {
	outline: none;
	/*outline-offset: 2px;*/
}

/* ------------------------------------------------------------------ *
 * Rahmen der Ausgabe — Fallback-Kopf und -Fuß des WordPress-Kerns
 *
 * DIE EINZIGEN REGELN DIESER DATEI AUSSERHALB VON `.hrb-up`. Begründung:
 * Was auf den Plugin-Ansichten als Kopf und Fuß erscheint, ist NICHT der
 * Kopf und Fuß des Themes, sondern der Rückfall des Kerns aus
 * `wp-includes/theme-compat/` — `get_header()` / `get_footer()` in den
 * Standard-Templates finden in einem Block-Theme (lokal Twenty
 * Twenty-Five) keine `header.php` / `footer.php` und laden die
 * Kompatibilitätsdateien von 2010: `#page > #header > #headerimg > h1`,
 * zwei `<hr>` und „… is proudly powered by WordPress".
 *
 * Diese Regeln nehmen dieser Notlösung nur die optische Härte. Sie sind
 * KEINE Lösung der Ursache — die läge darin, die Templates
 * block-theme-fähig zu machen (`wp_is_block_theme()` ⇒
 * `block_header_area()` / `block_footer_area()`, beide seit WP 5.9
 * vorhanden), damit Kopf und Fuß DES THEMES samt Navigation erscheinen.
 * Das ist eine Änderung an den Templates, nicht am Stylesheet.
 *
 * Die Regeln sind mit `:has(> #headerimg)` an die Fallback-Struktur
 * gebunden: `#header` und `#footer` sind sehr allgemeine Bezeichner, die
 * auch klassische Themes vergeben. Bringt das Theme einen eigenen Kopf
 * mit, greift hier nichts. Fällt die Ursache weg, werden diese Regeln von
 * selbst wirkungslos.
 * ------------------------------------------------------------------ */

#page:has(> #header > #headerimg)>#header {
	border-bottom: 1px solid var(--hrb-up-border);
	background: var(--hrb-up-surface);
}

/* Kopfinhalt auf die Spaltenbreite des Inhalts bringen, damit Titel und
   Inhalt auf einer Kante stehen; der Trennstrich bleibt randlos.
   `box-sizing` MUSS hier erneut gesetzt werden (dieselbe Falle wie bei
   `.hrb-up`): Diese Elemente liegen außerhalb des Namensraums und werden
   von der Regel oben nicht erfasst. Mit `content-box` bliebe die
   Inhaltsbreite unerreicht, und der Titel stünde nicht auf der Kante des
   Inhalts. */
#page:has(> #header > #headerimg)>#header>#headerimg {
	box-sizing: border-box;
	max-width: var(--hrb-up-content);
	margin-inline: auto;
	padding-inline: clamp(1rem, 4vw, var(--hrb-up-gap-l));
	padding-block: var(--hrb-up-gap);
	font-family: var(--hrb-up-font);
}

#page:has(> #header > #headerimg)>#header h1 {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: normal;
}

#page:has(> #header > #headerimg)>#header h1 a {
	color: var(--hrb-up-heading);
	text-decoration: none;
}

#page:has(> #header > #headerimg)>#header h1 a:hover,
#page:has(> #header > #headerimg)>#header h1 a:focus-visible {
	color: var(--hrb-up-accent-ink);
}

#page:has(> #header > #headerimg)>#header .description {
	margin-top: 0.15rem;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--hrb-up-muted);
}

/* Die zwei `<hr>` der Fallback-Dateien sind reine Altlast — der
   Trennstrich liegt an Kopf und Fuß selbst. */
#page:has(> #header > #headerimg)>hr {
	display: none;
}

#page:has(> #header > #headerimg)>#footer {
	margin-top: var(--hrb-up-gap-xl);
	border-top: 1px solid var(--hrb-up-border);
	background: var(--hrb-up-tint);
}

#page:has(> #header > #headerimg)>#footer p {
	box-sizing: border-box;
	max-width: var(--hrb-up-content);
	margin: 0 auto;
	padding-inline: clamp(1rem, 4vw, var(--hrb-up-gap-l));
	padding-block: var(--hrb-up-gap-m);
	font-family: var(--hrb-up-font);
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--hrb-up-muted);
}

#page:has(> #header > #headerimg)>#footer a {
	color: var(--hrb-up-accent-ink);
	text-underline-offset: 0.15em;
}

/* ------------------------------------------------------------------ *
 * Typografie
 * ------------------------------------------------------------------ */

/* Seitentitel — 42px/300 wie die Abschnittsüberschriften der Vorbild-Seiten. */
.hrb-up>h1,
.hrb-up .hrb-up-company-name,
.hrb-up .hrb-up-job-title {
	margin: 0 0 var(--hrb-up-gap-m);
	font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.625rem);
	font-weight: 300;
	line-height: 1.15;
	color: var(--hrb-up-heading);
}

/* Abschnittsüberschriften — 20px/600, die Karten-/Blockstufe der
   Vorbild-Seiten. Bewusst nicht deren 36px/300: Diese Ansichten führen bis zu
   vierzehn Abschnitte, und die große Stufe zerlegt die Seite optisch. */
.hrb-up section>h2,
.hrb-up .hrb-up-company-contact-groups h2 {
	margin: 0 0 var(--hrb-up-gap);
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--hrb-up-cta);
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--hrb-up-heading);
}

.hrb-up section>h3,
.hrb-up section>h4 {
	margin: 0 0 var(--hrb-up-gap-s);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--hrb-up-heading);
}

.hrb-up section {
	margin-block: var(--hrb-up-gap-l);
}

.hrb-up a {
	color: var(--hrb-up-muted);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}

.hrb-up a:hover,
.hrb-up a:focus-visible {
	color: var(--hrb-up-heading);
}

/* Fließtext aus dem Editor (Admin\Editor::render()). */
.hrb-up-company-description,
.hrb-up-job-intro,
.hrb-up-job-tasks,
.hrb-up-job-we-offer {
	max-width: 100%;
}

.hrb-up-company-description p,
.hrb-up-job-intro p,
.hrb-up-job-tasks p,
.hrb-up-job-we-offer p {
	margin: 0 0 var(--hrb-up-gap);
}

.hrb-up-company-description ul,
.hrb-up-company-description ol,
.hrb-up-job-intro ul,
.hrb-up-job-intro ol,
.hrb-up-job-tasks ul,
.hrb-up-job-tasks ol,
.hrb-up-job-we-offer ul,
.hrb-up-job-we-offer ol {
	margin: 0 0 var(--hrb-up-gap);
	padding-left: 1.25rem;
}

/* Listenzeichen fest, damit ein Theme-Reset (list-style: none) sie nicht entfernt. */
.hrb-up-company-description ul,
.hrb-up-job-intro ul,
.hrb-up-job-tasks ul,
.hrb-up-job-we-offer ul {
	list-style: disc outside;
}

.hrb-up-company-description ol,
.hrb-up-job-intro ol,
.hrb-up-job-tasks ol,
.hrb-up-job-we-offer ol {
	list-style: decimal outside;
}

.hrb-up-company-description li,
.hrb-up-job-intro li,
.hrb-up-job-tasks li,
.hrb-up-job-we-offer li {
	margin-bottom: 0.35rem;
}

/* ------------------------------------------------------------------ *
 * Wiederkehrende Bausteine: Merkmalslisten, Karten, Schaltflächen
 * ------------------------------------------------------------------ */

/* Merkmale (Ort, Beschäftigung, Vertrag, Karrierestatus, Branchen,
   Sprachen) — als Auszeichnungen in einer Zeile statt als Aufzählung. */
.hrb-up-job-meta,
.hrb-up-job-item-meta,
.hrb-up-company-item-industries,
.hrb-up-company-industries ul,
.hrb-up-company-languages ul,
.hrb-up-job-industries ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-job-meta>li,
.hrb-up-job-item-meta>li,
.hrb-up-company-item-industries>li,
.hrb-up-company-industries ul>li,
.hrb-up-company-languages ul>li,
.hrb-up-job-industries ul>li {
	padding: 0.25rem 0.6rem;
	/*border: 1px solid var(--hrb-up-border);*/
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-header-bg);
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--hrb-up-text);
}

.hrb-up-job-meta .hrb-up-job-published,
.hrb-up-job-item-meta .hrb-up-job-published {
	border-color: transparent;
	background: none;
	padding-inline: 0.15rem;
	color: var(--hrb-up-muted);
}

/* Aufzählungen ohne Marker: Anschrift, Kontakt, Medien, Links. */
.hrb-up-company-address p,
.hrb-up-company-contact ul,
.hrb-up-company-videos ul,
.hrb-up-company-documents ul,
.hrb-up-company-links ul,
.hrb-up-job-links ul,
.hrb-up-job-contact ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-company-contact li,
.hrb-up-company-videos li,
.hrb-up-company-documents li,
.hrb-up-company-links li,
.hrb-up-job-links li,
.hrb-up-job-contact li {
	margin-bottom: 0.35rem;
}

/* Schaltfläche — Maße, Radius und Laufweite der Vorbild-Seiten. */
.hrb-up-submit button {
	padding: 6px 24px;
	border: 0;
	border-radius: var(--hrb-up-radius-button);
	background: var(--hrb-up-cta);
	font-family: inherit;
	font-size: 0.9rem;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #fff;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.hrb-up-submit button:hover,
.hrb-up-submit button:focus {
	background: var(--hrb-up-cta-hover);
}

/* ------------------------------------------------------------------ *
 * Übersichten: Such- und Filterleiste
 * ------------------------------------------------------------------ */
.hrb-up-company-archive .hrb-up-search-filter,
.hrb-up-job-archive .hrb-up-search-filter,
body:not(.home) .hrb-up-site-search .hrb-up-search-filter {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-end;
	width: 100%;
	max-width: 100%;
	gap: var(--hrb-up-gap);
	padding: 0.75em;
	border-radius: var(--hrb-up-radius);
	box-shadow: none;
	box-sizing: border-box;
	background: #eeeef1;
}

/* Abstand zwischen den Elementen */
.hrb-up-company-archive form.hrb-up-search-filter {
	gap: 12px;
}

/* Suchfeld: nimmt den übrigen Platz ein */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-search {
	margin: 0;
}

/* Branchen-Auswahl: kompakte, einheitliche Breite */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter {
	width: 230px;
	margin: 0;
}

.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter select {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

/* Button: keine zusätzlichen Außenabstände */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-submit {
	margin: 0;
}

/* Eingabefelder und Button auf eine gemeinsame Höhe bringen */
.hrb-up-company-archive form.hrb-up-search-filter input[type="search"],
.hrb-up-company-archive form.hrb-up-search-filter select,
.hrb-up-company-archive form.hrb-up-search-filter button {
	min-height: 42px;
	box-sizing: border-box;
}

/* Dünne Umrandung und dezenter Schatten */
.hrb-up-company-archive form.hrb-up-search-filter input[type="search"],
.hrb-up-company-archive form.hrb-up-search-filter select {
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	background: var(--hrb-up-surface);
}

.hrb-up-company-archive form.hrb-up-search-filter select {
	appearance: auto;
	-webkit-appearance: auto;
	background-image: none;
	padding-right: 2rem;
	cursor: pointer;
}


/* Auf kleinen Bildschirmen untereinander anordnen */
@media (max-width: 767px) {
	.hrb-up-company-archive form.hrb-up-search-filter {
		flex-wrap: wrap !important;
		align-items: stretch;
	}

	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-search,
	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter,
	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-submit {
		width: 100%;
		flex: 1 1 100% !important;
	}

}

/* Erstes Suchfeld: nimmt den verfügbaren Platz ein  */
.hrb-up-company-archive .hrb-up-search-filter>p.hrb-up-search.hrb-up-suggest-field {
	flex: 1 1 0;
	min-width: 0;
}


/* Eingabefeld selbst auf die verfügbare Breite strecken */
.hrb-up-company-archive .hrb-up-search-filter>p.hrb-up-search.hrb-up-suggest-field input[type="search"] {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

/* Andere Filter und Button behalten ihre benötigte Breite */
.hrb-up-company-archive .hrb-up-search-filter>.hrb-up-search-area,
.hrb-up-company-archive .hrb-up-search-filter>.hrb-up-filter,
.hrb-up-company-archive .hrb-up-search-filter>.hrb-up-submit {
	flex: 0 0 auto;
}

/* ========================================
Unternehmensarchiv: Filterleiste
======================================== */

.hrb-up-company-archive form.hrb-up-search-filter {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-end;
	gap: 12px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	margin-bottom: 24px;
}

/* Suchfeld links: ca. 40 % */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-search {
	flex: 0 1 100%;
	/* Mit Branchenfilter -> flex: 0 1 40%;*/
	/*width: 40%;*/
	min-width: 0;
	margin: 0;
}

.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-search input[type="search"] {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

/* Branchen-Auswahl: füllt den übrigen Platz */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter {
	flex: 1 1 0%;
	min-width: 0;
	margin: 0;
}

.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter select {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

/* Filterbutton ganz rechts */
.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-submit {
	flex: 0 0 auto;
	margin: 0 0 0 auto;
}

/* Einheitliche Höhe */
.hrb-up-company-archive form.hrb-up-search-filter input[type="search"],
.hrb-up-company-archive form.hrb-up-search-filter select,
.hrb-up-company-archive form.hrb-up-search-filter button {
	min-height: 42px;
	box-sizing: border-box;
}

/* Mobile: Filter untereinander */
@media (max-width: 767px) {
	.hrb-up-company-archive form.hrb-up-search-filter {
		flex-wrap: wrap;
		align-items: stretch;
	}

	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-search,
	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-filter,
	.hrb-up-company-archive form.hrb-up-search-filter>p.hrb-up-submit {
		flex: 1 1 100%;
		width: 100%;
		margin-left: 0;
	}

}

.hrb-up-search-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	/*gap: var(--hrb-up-gap);*/
	/*margin-bottom: var(--hrb-up-gap-l); */
	padding: 0px;
	/*border: 1px solid var(--hrb-up-border);  */
	border-radius: var(--hrb-up-radius);
	/*background: var(--hrb-up-surface);*/
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	justify-content: space-between;
}

.hrb-up-search-filter>p {
	margin: 0;
}

.hrb-up-search-filter label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--hrb-up-muted);
}

.hrb-up-search-filter input[type="search"],
.hrb-up-search-filter select {
	display: block;
	width: 100%;
	min-width: 16rem;
	/*margin-top: 0.3rem;*/
	padding: 0.45rem 0.5rem;
	border: 1px solid var(--hrb-up-surface);
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-surface);
	font-family: inherit;
	font-size: 0.98rem;
	color: var(--hrb-up-text);
}

input::placeholder {
	color: #999;
	opacity: 1;
	font-style: italic;
}

/* Safari- Select- Fix 
.hrb-up-search-filter select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 2.5rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235d686e' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9rem center;
	background-size: 0.75rem auto;
	line-height: 1.4;
}*/

/* Branchenfilter: Selectfeld in Safari angleichen 
p.hrb-up-filter.hrb-up-filter-branche select {
box-sizing: border-box;
height: 42px;
min-height: 42px;
width: 100%;
line-height: normal;
padding-top: 0;
padding-bottom: 0;
border-radius: 10px!important;
-webkit-appearance: none !important;
appearance: none !important;
}         */
/* Branchenfilter: Select mit eigener Rundung und eigenem Pfeil */
p.hrb-up-filter.hrb-up-filter-branche {
	position: relative;
}

p.hrb-up-filter.hrb-up-filter-branche select,
p.hrb-up-filter.hrb-up-filter-beschaeftigung select,
p.hrb-up-filter.hrb-up-filter-karrierestatus select {
	-webkit-appearance: none !important;
	appearance: none !important;
	box-sizing: border-box !important;
	height: 42px !important;
	min-height: 42px !important;
	width: 100%;
	border-radius: var(--hrb-up-radius) !important;
	padding: 0 38px 0 12px !important;
}

/* Eigenen Dropdown-Pfeil zeichnen */
p.hrb-up-filter.hrb-up-filter-branche,
p.hrb-up-filter.hrb-up-filter-beschaeftigung,
p.hrb-up-filter.hrb-up-filter-karrierestatus {
	position: relative;
}


p.hrb-up-filter.hrb-up-filter-branche::after,
p.hrb-up-filter.hrb-up-filter-beschaeftigung::after,
p.hrb-up-filter.hrb-up-filter-karrierestatus::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-70%) rotate(45deg);
	pointer-events: none;
}

/* ------------------------------------------------------------------ *
 * Übersichten: Unternehmen als Kartenraster, Stellen als Zeilen
 * ------------------------------------------------------------------ */
/* =========================================================
   Unternehmenskacheln: einheitliche Höhen und Ausrichtung
   ========================================================= */

/* Grid mit vier Spalten auf Desktop */
.hrb-up-company-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--hrb-up-gap-m);
	margin: 2em 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 64rem) {
	.hrb-up-company-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 40rem) {
	.hrb-up-company-list {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Kachel als vertikales Flex-Layout */
.hrb-up-company-item {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: var(--hrb-up-gap-m);
	border-radius: var(--hrb-up-radius);
	background: var(--hrb-up-surface);
	box-shadow: var(--hrb-up-shadow);
	transition: box-shadow 0.15s ease;
}

.hrb-up-company-item:hover {
	box-shadow: var(--hrb-up-shadow-lift);
}

/* Einheitlicher Logo-Bereich in allen Firmenkarten */
.hrb-up-company-logo-wrap {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	height: 6rem;
	margin-bottom: var(--hrb-up-gap);
	overflow: hidden;
}

/* Logo proportional skalieren und mittig platzieren */
.hrb-up-company-logo-wrap .hrb-up-company-item-logo {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	margin: 0;
	object-fit: contain;
	object-position: center;
}

/* Platzhalter für Aussteller ohne Logo: füllt die Höhe des Logo-Bereichs */
.hrb-up-company-item-logo-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 9rem;
	max-width: 100%;
	height: 100%;
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-tint);
	font-size: 2.5rem;
	color: var(--hrb-up-border);
}

/* Unternehmensname: reserviert immer zwei Zeilen */
.hrb-up-company-item-name {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	min-height: 2.6em;
	margin: 0 0 0.4rem;
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--hrb-up-heading);
	overflow-wrap: anywhere;
	text-overflow: ellipsis;
	hyphens: auto;
	-webkit-hyphens: auto;
	overflow-wrap: break-word;
}

.hrb-up-company-item-name a {
	color: var(--hrb-up-heading);
	text-decoration: none;
}

.hrb-up-company-item-name a:hover {
	color: var(--hrb-up-accent-ink);
	text-decoration: underline;
}

/* Stadt */
.hrb-up-company-item-city {
	margin: 0 0 0.5rem;
	font-size: 0.9375rem;
	color: var(--hrb-up-muted);
}

/* Beschreibung */
.hrb-up-company-item-excerpt {
	margin: 0 0 var(--hrb-up-gap);
	font-size: 0.9375rem;
}

/* Standnummer: einheitliche Position am Kachelende */
.hrb-up-company-item-booth {
	display: inline-block;
	align-self: flex-start;
	margin: 20px 0 0 0;
	padding: 0.2rem 0.6rem;
	border-left: 3px solid var(--hrb-up-cta);
	border-radius: 0 var(--hrb-up-radius-s) var(--hrb-up-radius-s) 0;
	background: var(--hrb-up-tint);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--hrb-up-heading);
}

/* Kreuzsuche: passende Stelle bzw. Zahl der passenden Stellen unter dem Namen;
   in schmalen Karten höchstens drei Zeilen (nur optisch, vorgelesen wird alles). */
.hrb-up-company-item-match {
	display: -webkit-box;
	margin: var(--hrb-up-gap-s) 0 0;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	font-size: 0.8125rem;
	color: var(--hrb-up-muted);
}


.hrb-up-job-list {
	display: grid;
	gap: var(--hrb-up-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-company-item,
.hrb-up-job-list>.hrb-up-job-item {
	padding: var(--hrb-up-gap-m);
	border-radius: var(--hrb-up-radius);
	background: var(--hrb-up-surface);
	box-shadow: var(--hrb-up-shadow);
	transition: box-shadow 0.15s ease;
}

.hrb-up-company-item:hover,
.hrb-up-job-list>.hrb-up-job-item:hover {
	box-shadow: var(--hrb-up-shadow-lift);
}

/* Logos verschiedener Seitenverhältnisse auf eine gemeinsame Höhe bringen,
   damit die Karten in einer Zeile stehen. */
.hrb-up-company-item-logo {
	display: block;
	max-width: 200px;
	max-height: 4.75rem;
	width: auto;
	height: auto;
	margin-bottom: var(--hrb-up-gap);
	object-fit: contain;
	object-position: left center;
}

.hrb-up-company-item-name,
.hrb-up-job-item-title {
	margin: 0 0 0.4rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--hrb-up-heading);
}

@media (max-width: 766px) {

	.hrb-up-company-item-name,
	.hrb-up-job-item-title {
		font-size: 1rem;
	}
}

.hrb-up-company-item-name a,
.hrb-up-job-item-title {
	color: var(--hrb-up-heading);
	text-decoration: none;
}

.hrb-up-company-item-name a:hover,
.hrb-up-job-item-title a:hover {
	color: var(--hrb-up-accent-ink);
	text-decoration: underline;
}

.hrb-up-company-item-city,
.hrb-up-job-item-company {
	margin: 0 0 0.5rem;
	font-size: 0.9375rem;
	color: var(--hrb-up-muted);
}

.hrb-up-company-item-excerpt {
	margin: 0 0 var(--hrb-up-gap);
	font-size: 0.9375rem;
}

/* Halle und Stand sind die Leitinformation einer Messeseite. */
/*
.hrb-up-company-item-booth {
	display: inline-block;
	margin: 0 0 var(--hrb-up-gap-s);
	padding: 0.2rem 0.6rem;
	border-left: 3px solid var(--hrb-up-cta);
	border-radius: 0 var(--hrb-up-radius-s) var(--hrb-up-radius-s) 0;
	background: var(--hrb-up-tint);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--hrb-up-heading);
}
*/
.hrb-up-no-results,
.hrb-up-not-found {
	margin: 0;
	padding: var(--hrb-up-gap-l);
	/*border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius);
	background: var(--hrb-up-tint);*/
	text-align: center;
	color: var(--hrb-up-muted);
}

/* ------------------------------------------------------------------ *
 * Paginierung (Schema /page/{n}/)
 * ------------------------------------------------------------------ */

.hrb-up-pagination {
	margin-top: var(--hrb-up-gap-l);
}

/* Obere Seitennavigation zwischen Suchleiste und Liste. */
.hrb-up-search-filter+.hrb-up-pagination {
	margin-bottom: var(--hrb-up-gap-l);
}

.hrb-up-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-pagination a,
.hrb-up-pagination span {
	display: block;
	min-width: 2.5rem;
	padding: 0.5rem 0.6rem;
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-surface);
	font-size: 0.9375rem;
	text-align: center;
	text-decoration: none;
}

.hrb-up-pagination a:hover {
	border-color: var(--hrb-up-accent);
}

.hrb-up-pagination [aria-current="page"] {
	border-color: var(--hrb-up-accent-ink);
	background: var(--hrb-up-accent-ink);
	font-weight: 600;
	color: #fff;
}

/* ------------------------------------------------------------------ *
 * Detailseiten
 * ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ *
 * Unternehmens-Profilkopf
 * Schwarzer Balken mit weißem, abgerundetem Logo-Feld links
 * und Firmeninformationen rechts
 * ------------------------------------------------------------------ */

.hrb-up-profile-header {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 0;
	width: 100%;
	margin-bottom: var(--hrb-up-gap-l);
	padding: 15px;
	background: #eeeef1;
	border-radius: var(--hrb-up-radius);
	box-sizing: border-box;
	overflow: hidden;
}

/* Weißes, quadratisches Logo-Feld */
.hrb-up-profile-header-logo {
	flex: 0 0 150px;
	width: 150px;
	height: 150px;
	min-width: 150px;
	min-height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px;
	margin: 0 15px 0 0;
	background: #fff;
	border-radius: var(--hrb-up-radius);
	box-sizing: border-box;
	overflow: hidden;
}


/* Logo proportional innerhalb des weißen Feldes */
.hrb-up-profile-header-logo img {
	display: block;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain;
}

/* Platzhalter-Symbol im Logo-Feld von Profil- und Stellenkopf, wenn kein Logo vorliegt;
   .hrb-up davor, weil .fa (später geladen) die Schriftgröße sonst zurücksetzt */
.hrb-up .hrb-up-logo-placeholder-icon {
	font-size: 4rem;
	line-height: 1;
	color: var(--hrb-up-border);
}

/* Rechter Bereich: Firmenname und Standort */
.hrb-up-profile-header-content {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	align-items: stretch;
	background: #eeeef1;
	color: #000;
}



/* Textbereich */
.hrb-up-profile-header-title {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/*padding: 10px 10px;*/
	background: #eeeef1;
	border-radius: 0;
	box-sizing: border-box;
}

@media (max-width: 766px) {
	.hrb-up-profile-header-title {
		padding: 0px;
	}
}

/* Firmenname */
.hrb-up-profile-header-title .hrb-up-company-name {
	margin: 0;
	padding: 0;
	color: #000;
	font-size: clamp(22px, 3vw, 34px);
	font-weight: 700;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

/* Halle und Stand unter dem Firmennamen */
.hrb-up-profile-header-fair {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: 100%;
	margin-top: auto;
}

.hrb-up-profile-header-location {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 24px;
	margin-top: 14px;
	color: #000;
	padding: 0.2rem 0.6rem;
	border-left: 3px solid var(--hrb-up-cta);
	border-radius: 0 var(--hrb-up-radius-s) var(--hrb-up-radius-s) 0;
	background: var(--hrb-up-tint);
	align-self: flex-start;
}

.hrb-up-profile-hall,
.hrb-up-profile-booth {
	display: inline-block;
	margin: 0;
	padding: 0;
	background: transparent;
	color: #000;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
}

.hrb-up-profile-hall {
	margin-right: 1rem;
}

.hrb-up-fair-visit-no-bar {
	display: flex;
	justify-content: flex-end;
}

/* Mobile Darstellung */
@media (max-width: 600px) {
	.hrb-up-profile-header {
		flex-direction: row;
		align-items: stretch;
		gap: 0;
		padding: 10px;
		display: flex;
	}

	/* Kleineres, weiterhin quadratisches Logo-Feld */
	.hrb-up-profile-header-logo {
		flex: 0 0 110px;
		width: 110px;
		height: 110px;
		min-width: 110px;
		min-height: 110px;
		padding: 8px;
		margin: 0 10px 0 0;
		border-radius: 10px;
	}

	.hrb-up-profile-header-logo img {
		max-width: 100% !important;
		max-height: 100% !important;
	}

	.hrb-up .hrb-up-logo-placeholder-icon {
		font-size: 2.75rem;
	}

	/*.hrb-up-profile-header-title {
		padding: 14px 8px;
	}*/

	.hrb-up-profile-header-title .hrb-up-company-name {
		font-size: 18px;
	}

	.hrb-up-profile-header-location {
		gap: 6px 12px;
		margin-top: 10px;
	}

	.hrb-up-profile-hall,
	.hrb-up-profile-booth {
		font-size: 13px !important;
	}
}


/*.hrb-up-company-logo {
	width: 200px;
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hrb-up-company-logo img {
	max-width: 200px;
	height: auto;
}*/

/* Messestand der aktuellen Subsite: Messe, Halle, Stand. */
.hrb-up-company-booth {
	margin-bottom: var(--hrb-up-gap-m);
	padding: var(--hrb-up-gap) var(--hrb-up-gap-m);
	border-left: 3px solid var(--hrb-up-cta);
	border-radius: 0 var(--hrb-up-radius) var(--hrb-up-radius) 0;
	background: var(--hrb-up-tint);
}

.hrb-up-company-booth p {
	margin: 0;
}

.hrb-up-company-booth .hrb-up-fair-name {
	font-weight: 600;
	color: var(--hrb-up-heading);
}

.hrb-up-company-booth .hrb-up-hall,
.hrb-up-company-booth .hrb-up-booth {
	display: inline-block;
	margin-right: var(--hrb-up-gap);
	font-weight: 600;
	color: var(--hrb-up-heading);
}

.hrb-up-job-company {
	margin: 0 0 var(--hrb-up-gap);
	font-size: 1.0625rem;
	color: var(--hrb-up-muted);
}

/* Kopfblock der Stellendetailseite: Titel und Ausstellername links, das Logo
   rechts in einem weißen Feld — Gestaltung wie der Profilkopf der
   Ausstellerseite. Ohne Logo bleibt nur der Textblock. */
.hrb-up-job-header {
	display: flex;
	align-items: center;
	gap: var(--hrb-up-gap-m);
	margin-bottom: var(--hrb-up-gap-l);
	padding: 15px 15px 15px 26px;
	background: #eeeef1;
	border-radius: 10px;
	box-sizing: border-box;
}

.hrb-up-job-header-text {
	flex: 1 1 auto;
	min-width: 0;
}

.hrb-up .hrb-up-job-header .hrb-up-job-title {
	margin-bottom: 0.5rem;
	overflow-wrap: break-word;
	hyphens: auto;
}

.hrb-up-job-header .hrb-up-job-company {
	margin: 0;
}

/* Nur auf einer Messe-Website: Halle und Stand (Markup und Optik wie im
   Profilkopf der Ausstellerseite) und die Schaltfläche „Zu den Tickets"
   in einer Zeile unter dem Ausstellernamen. */
.hrb-up-job-fair {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 16px;
	margin-top: 14px;
}

.hrb-up-job-fair .hrb-up-profile-header-location {
	margin-top: 0;
}

/* Besuchs-Hinweis am Seitenende (Nachtrag 1.107): Text links, Schaltfläche
   rechts am Rand; schmal untereinander. */
.hrb-up-fair-visit {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	/*gap: var(--hrb-up-gap-s) var(--hrb-up-gap);*/
	margin-top: var(--hrb-up-gap-l);
	padding: var(--hrb-up-gap) var(--hrb-up-gap-m);
	border-left: 3px solid var(--hrb-up-cta);
	border-radius: 0 var(--hrb-up-radius-s) var(--hrb-up-radius-s) 0;
	background: var(--hrb-up-tint);
}

.hrb-up-fair-visit .hrb-up-fair-visit-text {
	flex: 1 1 20rem;
	margin: 0;
	font-weight: 600;
	color: var(--hrb-up-text);
}

.hrb-up-fair-visit .hrb-up-tickets-link {
	flex: 0 0 auto;
	margin-left: auto;
}

@media (max-width: 600px) {
	.hrb-up-fair-visit {
		flex-direction: column;
		align-items: flex-start;
	}

	.hrb-up-fair-visit .hrb-up-fair-visit-text {
		flex-basis: auto;
	}

	.hrb-up-fair-visit .hrb-up-tickets-link {
		margin-left: 0;
	}
}

/* Schaltfläche wie .hrb-up-submit button, als Link. */
.hrb-up .hrb-up-tickets-link {
	display: inline-block;
	padding: 10px 20px;
	border-radius: var(--hrb-up-radius-button);
	background: var(--hrb-up-cta);
	font-size: 0.9rem;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.4;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	transition: background-color 0.15s ease;
	margin-left: auto;
}

@media (max-width: 766px) {
	.hrb-up .hrb-up-tickets-link {
		line-height: 1.1;
		padding: 6px 10px;
		/*margin-left:0px;*/
		width: min-content;
	}

	.hrb-up-profile-header-fair {
		display: flex;
		gap: 5px;
		/* Remove the gap */
		justify-content: flex-start;
		/* Prevent items from pushing to edges */
	}

	a.hrb-up-tickets-link {
		padding-right: 0;
		/* Removes the space inside the link on the right */
		margin-left: auto;
		/* Pushes the link to the far right of the flex parent */
		display: inline-block;
		/* Ensure it stays inline-block/flex to shrink-wrap */
		width: min-content;
	}

}



.hrb-up .hrb-up-tickets-link:hover,
.hrb-up .hrb-up-tickets-link:focus-visible {
	background: var(--hrb-up-cta-hover);
	color: #fff;
}

.hrb-up-job-header-logo {
	flex: 0 0 150px;
	width: 150px;
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px;
	background: #fff;
	border-radius: 10px;
	box-sizing: border-box;
	overflow: hidden;
}

.hrb-up-job-header-logo a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	height: 100% !important;
}

.hrb-up-job-header-logo img {
	display: block;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain;
}

@media (max-width: 600px) {
	.hrb-up-job-header {
		padding: 10px 10px 10px 14px;
		gap: var(--hrb-up-gap);
	}

	.hrb-up .hrb-up-job-header .hrb-up-job-title {
		font-size: 1.5rem;
	}

	.hrb-up-job-header-logo {
		flex-basis: 90px;
		width: 90px;
		height: 90px;
		padding: 8px;
	}
}

.hrb-up-job-meta,
.hrb-up-job-single .hrb-up-job-meta {
	margin-bottom: var(--hrb-up-gap-l);
}

/* Messestände eines Unternehmens (nur nicht-Messe-Ausgabeseiten). */
.hrb-up-appearance {
	margin-bottom: var(--hrb-up-gap);
	padding: var(--hrb-up-gap-m);
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius);
	background: var(--hrb-up-surface);
}

.hrb-up-appearance>h3 {
	margin-top: 0;
}

.hrb-up-appearance p {
	margin: 0 0 0.25rem;
	font-size: 0.9375rem;
}

.hrb-up-appearance .hrb-up-hall,
.hrb-up-appearance .hrb-up-booth {
	display: inline-block;
	margin-right: var(--hrb-up-gap);
	font-weight: 600;
	color: var(--hrb-up-heading);
}

/* Stellenliste auf der Unternehmensseite: dieselbe Zeilenform wie die
   Stellenübersicht, aber ohne Karten-Schatten im umgebenden Abschnitt. */
.hrb-up-company-jobs>ul {
	display: grid;
	gap: 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-company-jobs .hrb-up-job-item {
	padding: var(--hrb-up-gap) var(--hrb-up-gap-m);
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius);
	background: var(--hrb-up-surface);
}

.hrb-up-company-jobs .hrb-up-job-item-title {
	display: block;
	margin-bottom: 0.35rem;
	font-size: 1.0625rem;
	font-weight: 600;
}

/* ------------------------------------------------------------------ *
 * Ansprechpartner
 * ------------------------------------------------------------------ */

.hrb-up-contacts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
	gap: var(--hrb-up-gap);
	margin: 0 0 var(--hrb-up-gap-m);
	padding: 0;
	list-style: none;
}

.hrb-up-contact {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: var(--hrb-up-gap);
	/*border: 1px solid var(--hrb-up-border);*/
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-header-bg);
	font-size: 0.9375rem;
}

.hrb-up-contact-name {
	font-weight: 600;
	color: var(--hrb-up-heading);
}

.hrb-up-contact-phone {
	color: var(--hrb-up-muted);
}

/* Link zu Kalendertool (Nachtrag 1.104): „Termin vereinbaren“, nur wenn geliefert. */
.hrb-up-contact-calendar {
	color: var(--hrb-up-muted);
}

.hrb-up-contact-type {
	color: var(--hrb-up-muted);
}

/* Foto des Ansprechpartners: Größe 300, nie breiter als die Karte. */
.hrb-up-contact-photo {
	display: block;
	width: auto;
	max-width: min(100%, 300px);
	height: auto;
	margin: 0 0 0.5rem;
	border-radius: var(--hrb-up-radius-s);
}

.hrb-up-contact .fa {
	margin-right: 8px;
}

/* ------------------------------------------------------------------ *
 * Medien
 * ------------------------------------------------------------------ */

.hrb-up-company-images {
	display: block;
}

.hrb-up-company-images figure {
	margin: 0;
}

.hrb-up-company-images>h2+figure,
.hrb-up-company-images figure {
	display: inline-block;
	width: 100%;
	max-width: 15rem;
	margin: 0 var(--hrb-up-gap) var(--hrb-up-gap) 0;
	vertical-align: top;
}

.hrb-up-company-images img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--hrb-up-radius-s);
}

.hrb-up-company-images figcaption {
	margin-top: 0.35rem;
	font-size: 0.8125rem;
	color: var(--hrb-up-muted);
}

/* ------------------------------------------------------------------ *
 * Zusätze des Satelliten-Plugins
 *
 * NUR in dieser Kopie, nicht im Stylesheet des Netzwerks: Suche,
 * Zurück-Schaltfläche und Logo-Karussell gibt es ausschließlich im
 * Satelliten. JavaScript nur für das Logo-Karussell, das
 * ohne Skript als CSS-Reihe läuft; Gestaltung allein über die
 * --hrb-up-*-Tokens.
 * ------------------------------------------------------------------ */

/* Zurück-Schaltfläche über dem Inhalt der Detailseiten. */
.hrb-up-back {
	margin: 0 0 var(--hrb-up-gap-m);
}

.hrb-up .hrb-up-back-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 1rem;
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius-button);
	background: var(--hrb-up-surface);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition: border-color 0.15s ease;
}

/* Pfeil als Schmuck: der zweite Wert schließt ihn aus der Vorlesung aus. */
.hrb-up-back-link::before {
	content: "\2190";
	content: "\2190" / "";
}

.hrb-up .hrb-up-back-link:hover,
.hrb-up .hrb-up-back-link:focus-visible {
	border-color: var(--hrb-up-muted);
}

/* Frei platzierbare Suche: Formular wie die Such- und Filterleiste,
   Treffer als zwei kompakte Listen. */
.hrb-up-site-search-results {
	margin-block: var(--hrb-up-gap-l);
}

/* Treffer in zwei Spalten, Stellen links (Reihenfolge im Markup); unter
   zweimal 15rem untereinander (Telefon), ein einzelner Block nimmt die volle
   Breite. 15rem passt zwei Spalten auch in schmale Inhaltsbereiche (Twenty
   Twenty-Five: 645 px). */
.hrb-up-site-search-columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	column-gap: var(--hrb-up-gap-l);
	align-items: start;
}

.hrb-up-site-search-columns>.hrb-up-site-search-results {
	min-width: 0;
}

.hrb-up-site-search-list {
	display: grid;
	gap: 0.5rem;
	margin: 0 0 var(--hrb-up-gap);
	padding: 0;
	list-style: none;
}

.hrb-up-site-search-item {
	padding: 0.75rem var(--hrb-up-gap);
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-surface);
}

/* Linkfarbe aus `.hrb-up a`; ohne Basis-Seite steht der Name als Text. */
.hrb-up-site-search-item-link,
.hrb-up-site-search-item-name {
	font-weight: 600;
}

.hrb-up-site-search-item-name {
	color: var(--hrb-up-heading);
}

.hrb-up-site-search-item-meta {
	display: block;
	font-size: 0.875rem;
	color: var(--hrb-up-muted);
}

/* Ausstellerzeile mit Logo links. Das Logo-Feld ist genau so hoch wie die
   zwei Textzeilen einer Stellenzeile: Zwei unsichtbare Zeilen in Titel- und
   Meta-Schriftgröße geben die Höhe vor, das Bild füllt das Feld darüber. So
   stimmen die Zeilen beider Spalten auch mit den Schriftmaßen des Themes
   überein, und Aussteller ohne Ort stehen gleich hoch. */
.hrb-up-site-search-item-with-logo {
	display: flex;
	align-items: center;
	gap: var(--hrb-up-gap);
}

.hrb-up-site-search-item-logo {
	position: relative;
	flex: 0 0 4.5rem;
	display: block;
}

.hrb-up-site-search-item-logo::before,
.hrb-up-site-search-item-logo::after {
	content: "\00a0";
	content: "\00a0" / "";
	display: block;
	visibility: hidden;
}

.hrb-up-site-search-item-logo::after {
	font-size: 0.875rem;
}

.hrb-up-site-search-item-logo img,
.hrb-up-site-search-item-logo .fa {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.hrb-up-site-search-item-logo img {
	object-fit: contain;
	object-position: center;
}

/* Ohne Logo: helle Fläche mit Symbol wie in der Ausstellerübersicht */
.hrb-up .hrb-up-site-search-item-logo .fa {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-tint);
	font-size: 1.5rem;
	color: var(--hrb-up-border);
}

.hrb-up-site-search-item-text {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
}

.hrb-up-site-search-all {
	margin: 0;
	font-size: 0.9375rem;
	font-weight: 600;
}

/* Text nur für Vorlesehilfen (Hinweis „öffnet in neuem Tab", Ansage der
   Vorschläge). */
.hrb-up-screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Suchvorschläge (assets/js/search-suggest.js): Liste unter
   dem Freitextfeld, zwei Gruppen, am Ende „Alle anzeigen". Ohne Skript
   entsteht nichts davon. */
.hrb-up-suggest-field {
	position: relative;
}

.hrb-up-suggest {
	position: absolute;
	z-index: 20;
	top: 100%;
	left: 0;
	right: 0;
	min-width: 16rem;
	margin-top: 0.25rem;
	padding: 0.5rem 0;
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-surface);
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12);
}

.hrb-up-suggest[hidden] {
	display: none;
}

.hrb-up-suggest-list,
.hrb-up-suggest-list ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hrb-up-suggest-heading {
	display: block;
	padding: 0.35rem var(--hrb-up-gap) 0.2rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--hrb-up-muted);
}

.hrb-up-suggest-option {
	padding: 0.45rem var(--hrb-up-gap);
	cursor: pointer;
}

.hrb-up-suggest-option:hover,
.hrb-up-suggest-option[aria-selected="true"] {
	background: var(--hrb-up-tint);
}

.hrb-up-suggest-option[aria-selected="true"] {
	outline: 2px solid var(--hrb-up-muted);
	outline-offset: -2px;
}

.hrb-up-suggest-label {
	font-weight: 600;
	color: var(--hrb-up-heading);
}

.hrb-up-suggest-meta {
	display: block;
	font-size: 0.8125rem;
	color: var(--hrb-up-muted);
}

.hrb-up .hrb-up-suggest-all {
	display: block;
	margin-top: 0.25rem;
	padding: 0.5rem var(--hrb-up-gap) 0.25rem;
	border-top: 1px solid var(--hrb-up-border);
	font-size: 0.9375rem;
	font-weight: 600;
}

/* Logo-Karussell (Laufband): Die Reihe — Logos und am Ende
   die Kachel zur Unternehmensübersicht — steht im Markup doppelt; der Lauf
   verschiebt die Spur um genau eine Reihe und beginnt dann nahtlos von vorn.
   Ohne Skript (Rückfall) ist das -50 %, die Dauer eines Umlaufs kommt aus
   --hrb-up-slider-duration: Shortcode-Attribut `dauer` (setzt die Eigenschaft
   am Element) oder Theme, z. B.
       :root { --hrb-up-slider-duration: 60s; }
   Ohne beides gelten 40s. Mit Skript (assets/js/logo-slider.js) wird die Reihe
   so oft wiederholt, wie die Breite braucht; das Skript setzt
   --hrb-up-slider-shift (eine Reihe in Bildpunkten) und die Dauer aus dem
   Attribut `tempo` (Bildpunkte je Sekunde) — die Geschwindigkeit hängt dann
   nicht an der Zahl der Logos. */
.hrb-up-logo-slider-viewport {
	overflow: hidden;
}

.hrb-up-logo-slider-track {
	display: flex;
	align-items: center;
	width: max-content;
	margin: 0;
	padding: 0;
	list-style: none;
	animation: hrb-up-logo-slide var(--hrb-up-slider-duration, 40s) linear infinite;
}

/* ------------------------------------------------------------------ *
 * Logo-Kacheln
 * ------------------------------------------------------------------ */

.hrb-up-logo-slider-item {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 170px;
	height: 170px;
	margin-inline-end: var(--hrb-up-gap-l);
	padding: 15px;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

/* Dezenter Hover-Effekt */
.hrb-up-logo-slider-item:hover {
	border-color: #d0d0d0;
	box-shadow: 0 3px 9px rgba(0, 0, 0, 0.12);
}

/* Link füllt die Kachel und zentriert das Logo */
.hrb-up .hrb-up-logo-slider-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: 6px;
	text-decoration: none;
}

/* Logos proportional begrenzen */
.hrb-up-logo-slider-logo {
	display: block;
	flex: 0 1 auto;
	width: auto;
	height: auto;
	max-width: 150px;
	max-height: 120px;
	object-fit: contain;
}


/* Letzte Slider-Kachel: „Alle Aussteller ansehen“ */
.hrb-up-logo-slider-item.hrb-up-logo-slider-tile {
	border: 2px solid var(--hrb-up-cta);
}

/* Link und Inhalt der grünen Kachel */
.hrb-up .hrb-up-logo-slider-tile .hrb-up-logo-slider-link {
	color: var(--hrb-up-cta);
}

/* Text der Kachel */
.hrb-up .hrb-up-logo-slider-tile .hrb-up-logo-slider-tile-text {
	color: var(--hrb-up-cta);
	font-weight: 700;
}

/* Hover-Effekt */
.hrb-up-logo-slider-item.hrb-up-logo-slider-tile:hover {

	box-shadow: 0 3px 9px rgba(0, 0, 0, 0.16);
}

.hrb-up .hrb-up-logo-slider-tile:hover .hrb-up-logo-slider-tile-text {
	color: var(--hrb-up-cta);
}

/* ------------------------------------------------------------------ *
 * Kachel zur Unternehmensübersicht
 * ------------------------------------------------------------------ */

.hrb-up-logo-slider-tile-text {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	padding: 0 10px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--hrb-up-accent-ink);
	font-weight: 600;
	text-align: center;
	white-space: normal;
	transition: color 0.15s ease;
}

.hrb-up-logo-slider-link:hover .hrb-up-logo-slider-tile-text,
.hrb-up-logo-slider-link:focus-visible .hrb-up-logo-slider-tile-text {
	color: var(--hrb-up-accent);
}

/* ------------------------------------------------------------------ *
 * Laufband pausieren
 *
 * Bei Hover, Tastaturfokus, gesetzter Pause oder außerhalb des
 * sichtbaren Bereichs hält die Animation an.
 * ------------------------------------------------------------------ */

.hrb-up-logo-slider:hover .hrb-up-logo-slider-track,
.hrb-up-logo-slider:focus-within .hrb-up-logo-slider-track,
.hrb-up-logo-slider.is-paused .hrb-up-logo-slider-track,
.hrb-up-logo-slider.is-offscreen .hrb-up-logo-slider-track {
	animation-play-state: paused;
}

/* ------------------------------------------------------------------ *
 * Optionale Slider-Schaltfläche
 * ------------------------------------------------------------------ */

.hrb-up .hrb-up-logo-slider-toggle {
	display: inline-block;
	margin-top: var(--hrb-up-gap-s);
	padding: 0.25rem 0.75rem;
	border: 1px solid var(--hrb-up-border);
	border-radius: var(--hrb-up-radius-s);
	background: var(--hrb-up-surface);
	color: var(--hrb-up-text);
	font-family: inherit;
	font-size: 0.8125rem;
	line-height: 1.4;
	cursor: pointer;
}

.hrb-up .hrb-up-logo-slider-toggle:hover,
.hrb-up .hrb-up-logo-slider-toggle:focus-visible {
	border-color: var(--hrb-up-accent);
}

.hrb-up .hrb-up-logo-slider-toggle[hidden] {
	display: none;
}

/* ------------------------------------------------------------------ *
 * Animation
 * ------------------------------------------------------------------ */

@keyframes hrb-up-logo-slide {
	to {
		transform: translateX(var(--hrb-up-slider-shift, -50%));
	}
}

/* ------------------------------------------------------------------ *
 * Schmale Bildschirme
 * ------------------------------------------------------------------ */

@media (max-width: 47.9375rem) {
	.hrb-up-logo-slider-item {
		width: 180px;
		height: 90px;
		margin-inline-end: var(--hrb-up-gap-m);
		padding: 10px;
	}

	.hrb-up-logo-slider-logo {
		max-width: 160px;
		max-height: 55px;
	}

	.hrb-up-logo-slider-tile-text {
		font-size: 0.875rem;
	}
}

/* Reduzierte Bewegung (Pflicht): kein Lauf — die Logos stehen
   still und brechen um, Kopie, Wiederholungen und Schaltfläche entfallen. */

/* ------------------------------------------------------------------ *
 * Reduzierte Bewegung
 *
 * Bei entsprechender Systemeinstellung läuft das Karussell nicht.
 * Die Kopien werden ausgeblendet und die ursprünglichen Logos dürfen
 * umbrechen.
 * ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	.hrb-up-logo-slider-track {
		flex-wrap: wrap;
		width: auto;
		row-gap: var(--hrb-up-gap);
		animation: none;
	}

	.hrb-up-logo-slider-item[aria-hidden="true"],
	.hrb-up .hrb-up-logo-slider-toggle {
		display: none;
	}
}

/* ------------------------------------------------------------------ *
 * Schmale Darstellungen
 * ------------------------------------------------------------------ */

@media (max-width: 47.9375rem) {
	.hrb-up-search-filter {
		flex-direction: column;
		align-items: stretch;
	}

	.hrb-up-search-filter input[type="search"],
	.hrb-up-search-filter select {
		min-width: 0;
	}

	.hrb-up-search-filter input[type="search"] {
		border: 1px solid var(--hrb-up-border);
		margin-bottom: 7px;
		height: 45px;
	}

	.hrb-up-submit button {
		width: 100%;
	}

	.hrb-up-contacts {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hrb-up * {
		transition: none;
	}
}



/* Suchformular auf der Ergebnisliste verbreitern */
.hrb-up-results-search form.hrb-up-site-search-form>p.hrb-up-search.hrb-up-suggest-field {
	flex: 1 1 0;
	width: auto;
	min-width: 0;
	margin: 0;
}

.hrb-up-results-search form.hrb-up-site-search-form>p.hrb-up-search.hrb-up-suggest-field>label {
	display: block;
	width: 99%;
}

.hrb-up-results-search form.hrb-up-site-search-form>p.hrb-up-search.hrb-up-suggest-field input[type="search"] {
	display: block;
	width: 99%;
	min-width: 0;
	max-width: none;
	box-sizing: border-box;
}

/* Gemeinsame Suchleiste */
.hrb-up-site-search-form .hrb-up-searchbar {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 560px;
	min-height: 52px;
	padding: 4px;
	/*border: 1px solid #d0d5dd;
	border-radius: 999px;
	background: #fff;*/
	box-sizing: border-box;
	transition: border-color 0.15s ease,
		box-shadow 0.15s ease;
	/*border: 1px solid var(--hrb-up-border);*/
	border-radius: var(--hrb-up-radius-button);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	background: var(--hrb-up-surface);
}

body:not(.home) .hrb-up-site-search-form .hrb-up-searchbar {
	border-radius: var(--hrb-up-radius) !important;
}


/* Sichtbarer Fokus auf der gesamten Suchleiste */
.hrb-up-site-search-form .hrb-up-searchbar:focus-within {
	border-color: #216e4e;
	box-shadow: 0 0 0 2px #eeeef1;
}

/* Linker Bereich mit Lupe und Eingabe */
.hrb-up-site-search-form .hrb-up-searchbar-label {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	gap: 10px;
	padding-left: 14px;
	margin: 0;
	cursor: text;
}

/* Dekorative Lupe */
.hrb-up-site-search-form .hrb-up-searchbar-icon {
	flex: 0 0 auto;
	color: #667085;
}

/* Texteingabe */
.hrb-up-site-search-form .hrb-up-searchbar input[type="search"] {
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	min-height: 42px;
	padding: 8px 0;
	border: 0;
	outline: none;
	box-shadow: none;
	background: transparent;
	color: #344054;
	font: inherit;
	font-weight: normal;
	font-size: 17px;
}

/* Browser-eigene Fokus- und Rahmenstile vermeiden */
.hrb-up-site-search-form .hrb-up-searchbar input[type="search"]:focus {
	border: 0;
	outline: none;
	box-shadow: none;
}

/* Rechter Pfeil-Button */
.hrb-up-site-search-form .hrb-up-searchbar-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--hrb-up-radius-button);
	background: var(--hrb-up-cta);
	color: #ffffff;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

body:not(.home) .hrb-up-site-search-form .hrb-up-searchbar-submit {
	border-radius: 0px !important;
	background: #ffffff !important;
	color: var(--hrb-up-cta-hover);
}

.hrb-up-site-search-form .hrb-up-searchbar-submit:hover {
	background: var(--hrb-up-cta-hover);
}

.hrb-up-site-search-form .hrb-up-searchbar-submit:focus-visible {
	outline: 2px solid #216e4e;
	outline-offset: 2px;
}

.hrb-up-site-search-form .hrb-up-searchbar-label {
	flex: 1 1 auto;
	min-width: 0;
}

.hrb-up-site-search-form .hrb-up-searchbar input[type="search"] {
	min-width: 0;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hrb-up-site-search-form .hrb-up-searchbar input[type="search"]::placeholder {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Neue Suchleiste: einheitliche Höhe auch auf Mobilgeräten */
.hrb-up-site-search-form .hrb-up-searchbar {
	height: 52px;
	min-height: 52px;
	box-sizing: border-box;
	align-items: center;
}

/* Eingabefeld an die Suchleiste anpassen */
.hrb-up-site-search-form .hrb-up-searchbar input[type="search"] {
	height: 42px;
	min-height: 0;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-size: 17px;
	line-height: 1.4;
}

/* Pfeil-Button exakt ausrichten */
.hrb-up-site-search-form .hrb-up-searchbar-submit {
	width: 44px;
	height: 44px;
	min-height: 44px;
	box-sizing: border-box;
	flex-shrink: 0;
}

/* Label als Bezugspunkt für die Lupe */
.hrb-up-search-filter>p.hrb-up-search label {
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
}

/* Original-Lupen-SVG innerhalb des Suchfeldes */
.hrb-up-search-filter>p.hrb-up-search label::before {
	content: "";
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	background-color: currentColor;
	pointer-events: none;

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16' y1='16' x2='21' y2='21'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16' y1='16' x2='21' y2='21'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Platz für die Lupe im Eingabefeld schaffen */
.hrb-up-search-filter>p.hrb-up-search input[type="search"] {
	display: block;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding-left: 42px;
}

/* =========================================
   FILTERLEISTE IM JOB-ARCHIV – RESPONSIVE LAYOUT
   ========================================= */


/* DESKTOP: über 1366px – einzeilig */
@media (min-width: 1367px) {

	.hrb-up-job-archive form.hrb-up-search-filter {
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-end;
		gap: var(--hrb-up-gap);
		width: 100%;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>p {
		min-width: 0;
		margin: 0;
	}

	/* Suchfeld */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-search {
		flex: 2.5 1 0;
	}

	/* Stellentyp */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-stellentyp {
		flex: 1 1 0;
	}

	/* Branche */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-branche {
		flex: 1 1 0;
	}

	/* Beschäftigung: etwas breiter */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-beschaeftigung {
		flex: 1.5 1 0;
	}

	/* Karrierestatus */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-karrierestatus {
		flex: 1.2 1 0;
	}

	/* Button */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-submit {
		flex: 0 0 auto;
	}
}


/* =========================================
   TABLET: 769px bis 1366px
   ========================================= */

@media (min-width: 769px) and (max-width: 1366px) {

	.hrb-up-job-archive form.hrb-up-search-filter {
		display: grid;
		grid-template-columns: 1.5fr 1fr 0.5fr;
		gap: 12px;
		align-items: end;
		width: 100%;
		box-sizing: border-box;
	}

	/* Alle Formularfelder */
	.hrb-up-job-archive form.hrb-up-search-filter>p {
		min-width: 0;
		width: 100%;
		margin: 0;
	}

	/* Erste Zeile */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-search {
		grid-column: 1;
		grid-row: 1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-branche {
		grid-column: 2 / 4;
		grid-row: 1;
	}

	/* Zweite Zeile */
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-beschaeftigung {
		grid-column: 1;
		grid-row: 2;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-karrierestatus {
		grid-column: 2;
		grid-row: 2;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-submit {
		grid-column: 3;
		grid-row: 2;
	}

	/* Mit Stellentyp (Nachtrag 1.108): vier Spalten — Suche, Stellentyp, Branche;
	   darunter Beschäftigung (breiter), Karrierestatus, Button */
	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp) {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-search {
		grid-column: 1 / 3;
		grid-row: 1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-filter-stellentyp {
		grid-column: 3;
		grid-row: 1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-filter-branche {
		grid-column: 4;
		grid-row: 1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-filter-beschaeftigung {
		grid-column: 1 / 3;
		grid-row: 2;
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-filter-karrierestatus {
		grid-column: 3;
		grid-row: 2;
	}

	.hrb-up-job-archive form.hrb-up-search-filter:has(> .hrb-up-filter-stellentyp)>.hrb-up-submit {
		grid-column: 4;
		grid-row: 2;
	}

	/* Eingabe- und Auswahlfelder */
	.hrb-up-job-archive form.hrb-up-search-filter input,
	.hrb-up-job-archive form.hrb-up-search-filter select {
		width: 100%;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
	}

	/* Button */
	.hrb-up-job-archive form.hrb-up-search-filter button {
		width: 100%;
	}
}


/* =========================================
   SMARTPHONE QUERFORMAT: 616–768px
   ========================================= */

@media (min-width: 616px) and (max-width: 768px) {

	.hrb-up-job-archive form.hrb-up-search-filter {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
		align-items: end;
		width: 100%;
		box-sizing: border-box;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>p {
		min-width: 0;
		width: 100%;
		margin: 0;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-search,
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-stellentyp,
	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-branche {
		grid-column: 1 / -1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-beschaeftigung {
		grid-column: 1;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-filter-karrierestatus {
		grid-column: 2;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>.hrb-up-submit {
		grid-column: 1 / -1;
	}
}


/* =========================================
   SMARTPHONE HOCHFORMAT: bis 615px
   ========================================= */

@media (max-width: 615px) {

	.hrb-up-job-archive form.hrb-up-search-filter {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
		width: 100%;
		box-sizing: border-box;
	}

	.hrb-up-job-archive form.hrb-up-search-filter>p {
		grid-column: 1;
		grid-row: auto;
		min-width: 0;
		width: 100%;
		margin: 0;
	}
}


/* Eingabe- und Auswahlfelder – nur im Job-Archiv */
.hrb-up-job-archive form.hrb-up-search-filter input,
.hrb-up-job-archive form.hrb-up-search-filter select {
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/* Auf schmalen Bildschirmen dieselbe Höhe beibehalten */
@media (max-width: 767px) {
	.hrb-up-site-search-form .hrb-up-searchbar {
		height: 52px;
		min-height: 52px;
	}

	.hrb-up-site-search-form .hrb-up-searchbar input[type="search"] {
		height: 42px;
		min-height: 0;
		margin: 0;
	}
}