/*
Theme Name: SIDE Karriere
Description: Child-Theme von Twenty Twenty-Five für die Karriereseite des SIDE Design Hotels. Farben, Schriften und Stil-Bausteine in theme.json, Feinschliff in diesem Stylesheet.
Template: twentytwentyfive
Version: 3.3.1
Requires at least: 6.7
Text Domain: side-karriere
License: GPL-2.0-or-later
*/

/* Dachzeile über Überschriften */
.is-style-dachzeile {
	text-transform: uppercase;
	letter-spacing: 0.15em;
}

/* Kurze Linie unter Überschriften (wie auf side-hotel.de) */
.wp-block-separator.is-style-kurz {
	width: 48px;
	max-width: 48px;
	border: 0;
	border-top: 2px solid currentColor;
	margin-left: auto;
	margin-right: auto;
	opacity: 1;
}

/* FAQ: Details-Block mit +/− wie auf der Hauptseite */
.wp-block-details {
	border: 1px solid var(--wp--preset--color--rahmen);
	border-top: 0;
	padding: 0;
}
.wp-block-details:first-of-type,
:not(.wp-block-details) + .wp-block-details {
	border-top: 1px solid var(--wp--preset--color--rahmen);
}
.wp-block-details summary {
	list-style: none;
	cursor: pointer;
	padding: 0.9em 1.1em;
	font-weight: 600;
	display: flex;
	gap: 0.75em;
	align-items: baseline;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::before {
	content: "+";
	font-weight: 700;
	width: 1ch;
	flex: none;
}
.wp-block-details[open] summary::before { content: "−"; }
.wp-block-details[open] summary { border-bottom: 1px solid var(--wp--preset--color--rahmen); }
.wp-block-details > :not(summary) {
	padding-left: 1.1em;
	padding-right: 1.1em;
}
.wp-block-details > :last-child { padding-bottom: 1em; }

/* Bildkacheln: weiße Schrift gut lesbar */
.is-style-kachel .wp-block-cover__inner-container {
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.45);
}

/* Navigation im Kopf: Versalien wie auf der Hauptseite */
.side-header .wp-block-navigation {
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

/* Ruhige Bewegungen respektieren (fester Hintergrund) */
@media (prefers-reduced-motion: reduce) {
	.wp-block-cover.has-parallax { background-attachment: scroll; }
}

/* Blaue Flächen und dunkle Bild-Abschnitte: Überschriften, Links und Buttons in Weiß */
.has-weiss-color :is(h1, h2, h3, h4, h5, h6),
.has-weiss-color a:not(.wp-element-button),
.wp-block-cover:not(.is-light) :is(h1, h2, h3, h4, h5, h6),
.wp-block-cover:not(.is-light) a:not(.wp-element-button) {
	color: inherit;
}
.has-weiss-color a:not(.wp-element-button):hover,
.wp-block-cover:not(.is-light) a:not(.wp-element-button):hover {
	color: inherit;
	opacity: 0.8;
}
:is(.has-weiss-color, .wp-block-cover:not(.is-light)) .wp-block-button__link {
	color: #fff;
	border-color: #fff;
	background: transparent;
}
:is(.has-weiss-color, .wp-block-cover:not(.is-light)) .wp-block-button__link:is(:hover, :focus) {
	color: var(--wp--preset--color--primaer);
	background: #fff;
	border-color: #fff;
}

/* Video-Vorschau mit Play-Symbol (verlinkt zu YouTube, nichts wird eingebettet) */
.wp-block-image.is-style-video a {
	position: relative;
	display: block;
}
.wp-block-image.is-style-video a::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 72px;
	height: 72px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: rgba(2, 78, 108, 0.85) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / 36px no-repeat;
	transition: background-color 0.2s;
}
.wp-block-image.is-style-video a:hover::after {
	background-color: rgba(2, 78, 108, 1);
}
.wp-block-image.is-style-video figcaption {
	text-align: center;
	font-size: var(--wp--preset--font-size--klein);
}


/* Team: runde Ecken weglassen, Bilder gleich groß */
.side-person .wp-block-image img {
	width: 100%;
}

/* Nur für Screenreader sichtbar */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* Sprungmarken nicht unter dem festen Kopf verstecken */
html {
	scroll-padding-top: 120px;
	scroll-behavior: smooth;
}

/* ---- 1.4: Angleichung an side-hotel.de ---- */

/* Menü im Kopf: weiß, Versalien, ohne Unterstreichung, dünne Linie beim Hover */
.side-header,
.side-header .wp-block-navigation,
.side-header .wp-block-navigation a,
.side-header .wp-block-navigation-item__content {
	color: #fff !important;
}
.side-header .wp-block-navigation a {
	text-decoration: none;
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	position: relative;
	padding-bottom: 4px;
}
.side-header .wp-block-navigation a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -2px;
	width: 0;
	height: 1px;
	background: currentColor;
	transform: translateX(-50%);
	transition: width 0.2s;
}
.side-header .wp-block-navigation a:hover::after,
.side-header .wp-block-navigation a:focus::after {
	width: 18px;
}
.side-header .wp-block-navigation__responsive-container-open,
.side-header .wp-block-navigation__responsive-container-close {
	color: #fff;
}
.side-header .wp-block-social-links .wp-social-link svg { fill: #fff; }

/* Überschriften wie auf der Hauptseite: Didot, regulär, SIDE-Blau, zentriert über kurzer Linie */
:where(.wp-block-post-content) :is(h1, h2, h3, h4) strong,
:where(.wp-block-post-content) :is(h1, h2, h3, h4) b {
	font-weight: inherit;
}
:where(.wp-block-post-content) :is(h2, h3) + .wp-block-separator.is-style-kurz {
	margin-top: 0.9rem;
	margin-bottom: 1.6rem;
}
.wp-block-separator.is-style-kurz {
	border-top-width: 2px;
	width: 54px;
	max-width: 54px;
}

/* 1.5: Wortabstand der Didot-Ersatzschrift etwas öffnen */
:is(h1, h2, h3, h4) { word-spacing: 0.06em; }

/* ---- 2.0: Feedback 14.10. ---- */

/* Kopf wie auf der Hauptseite: links Icons und Menü, Logo rechts */
.side-header-links { flex: 1 1 auto; min-width: 0; }
.side-header-menu { width: 100%; }
.side-header .wp-block-button__link { white-space: nowrap; font-size: 0.875rem; padding: 0.45em 1.1em; }
.side-header .side-header-social { gap: 0.9rem; }
.side-header .side-header-social .wp-social-link { opacity: 0.9; }
.side-header .side-header-social .wp-social-link:hover { opacity: 1; }
.side-header-logo { flex: none; }
@media (max-width: 781px) {
	.side-header .side-header-social { display: none; }
	.side-header-menu { gap: 1rem; }
}

/* FAQ als Karten (wie alte Jobs-Seite): Antwort sichtbar, Button unten */
.side-faq-karte {
	border: 1px solid var(--wp--preset--color--rahmen);
	padding: clamp(1.5rem, 3vw, 2.5rem);
	height: 100%;
	box-sizing: border-box;
}
.side-faq-karte > .wp-block-buttons { margin-top: auto; padding-top: 0.5rem; }
.side-faq-karte h3.side-faq-frage {
	font-size: clamp(1.3rem, 1.8vw, 1.6rem);
	text-align: left;
}
.side-faq-karte h3 + .wp-block-separator { display: none; }

/* Linksbündige Überschrift: kurze Linie ebenfalls links */
.has-text-align-left + .wp-block-separator.is-style-kurz { margin-left: 0; }

/* Bilder-Slider "Dein neuer Arbeitsplatz" */
.side-slider__huelle { position: relative; }
.wp-block-gallery.side-slider {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 20px !important;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.wp-block-gallery.side-slider::-webkit-scrollbar { display: none; }
.wp-block-gallery.side-slider > .wp-block-image {
	flex: 0 0 auto !important;
	width: min(85%, 560px) !important;
	margin: 0 !important;
	scroll-snap-align: start;
}
.wp-block-gallery.side-slider > .wp-block-image img {
	width: 100% !important;
	height: clamp(220px, 28vw, 380px) !important;
	object-fit: cover;
}
.side-slider__pfeil {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 3px;
	background: var(--wp--preset--color--primaer);
	color: #fff;
	cursor: pointer;
	z-index: 2;
}
.side-slider__pfeil:hover { background: #013a51; }
.side-slider__pfeil[hidden] { display: none; }
.side-slider__pfeil--vor { right: 10px; }
.side-slider__pfeil--zurueck { left: 10px; }

/* Karte im Kontakt-Abschnitt */
.side-karte__map {
	height: clamp(300px, 40vw, 450px);
	width: 100%;
	margin-bottom: 1.5rem;
	z-index: 0;
}
.side-karte__pin { background: none; border: 0; }
.side-karte .leaflet-container { font-family: inherit; }
.side-karte .leaflet-popup-content a { color: var(--wp--preset--color--primaer); }

/* Team: Namen in Hotelblau */
.side-person .has-primaer-color strong { font-weight: 600; }

/* Benefits: weiße Box, Überschrift in SIDE-Blau, Vorteile zweispaltig in der Textschrift */
.wp-block-cover .side-benefits-box :is(h1, h2, h3) { color: var(--wp--preset--color--primaer); }
.wp-block-cover .side-benefits-box .wp-block-separator { color: var(--wp--preset--color--primaer) !important; border-color: var(--wp--preset--color--primaer) !important; }
.side-benefits {
	list-style: none;
	padding-left: 0;
	margin-top: 2rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
	gap: 1rem 3rem;
	columns: auto;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--wp--preset--color--schrift);
}
.side-benefits li {
	margin: 0;
	padding-left: 1.6rem;
	position: relative;
}
.side-benefits li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.75em;
	width: 0.9rem;
	border-top: 2px solid var(--wp--preset--color--primaer);
}

/* Linie unter Überschriften auf dunklem Grund ebenfalls weiß */
:is(.has-weiss-color, .wp-block-cover:not(.is-light)) .wp-block-separator { color: #fff; border-color: #fff; }

/* Tablet: Menü passt nicht in eine Zeile, deshalb schon bis 1099px das Menü-Symbol */
@media (min-width: 600px) and (max-width: 1099px) {
	.side-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.side-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* OpenStreetMap-Kacheln hell und grau, passend zur Hauptseite */
.side-karte__kacheln { filter: grayscale(1) brightness(1.06) contrast(0.9); }

/* 2.1.2: Titelvideo ganz zeigen (16:9, nichts abgeschnitten) */
.wp-block-post-content > .wp-block-cover:first-child:has(> video.wp-block-cover__video-background) {
	min-height: 0 !important;
	aspect-ratio: 16 / 9 !important;
}

/* 2.1.2: Menü wie Hauptseite: Maax Regular, 16 px, ohne Sperrung */
.side-header .wp-block-navigation a {
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: 0.01em;
}

/* 2.1.3: Desktop: Titelvideo füllt genau den sichtbaren Bereich unter dem Kopf (wie alte Seite) */
@media (min-width: 768px) {
	.wp-block-post-content > .wp-block-cover:first-child:has(> video.wp-block-cover__video-background) {
		aspect-ratio: auto !important;
		height: calc(100svh - var(--side-kopf, 90px) - var(--wp-admin--admin-bar--height, 0px));
	}
}

/* 2.1.4: FAQ-Karten auf dem Handy einspaltig (WordPress 6.9 erzwingt sonst zwei Spalten) */
@media (max-width: 781px) {
	.side-faq { grid-template-columns: 1fr !important; }
}

/* ---------- Offene Stellen (Onboard) ---------- */
.side-stellen { margin-top: var(--wp--preset--spacing--40); }
.side-stellen__filter { display: flex; gap: .75rem; align-items: center; justify-content: center; margin-bottom: 2rem; }
.side-stellen__filter select { font: inherit; padding: .45rem 2rem .45rem .75rem; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 3px; background: #fff; color: inherit; }
/* Karten wie die Angebote auf der Hauptseite: Bild oben, fetter Titel, Text, Button */
.side-stellen__liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 3rem 2rem; }
@media (min-width: 782px) { .side-stellen__liste { grid-template-columns: repeat(2, 1fr); } }
.side-stelle { display: flex; flex-direction: column; }
.side-stelle[hidden] { display: none; }
.side-stelle__bild { display: block; aspect-ratio: 40 / 21; overflow: hidden; margin-bottom: 1.1rem; }
.side-stelle__bild img, .side-stelle__ohne-bild { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.side-stelle__ohne-bild { background: var(--wp--preset--color--primaer); display: flex !important; align-items: center; justify-content: center; }
.side-stelle__ohne-bild img { width: 22%; height: auto; object-fit: contain; }
.side-stelle:hover .side-stelle__bild img { transform: scale(1.03); }
.side-stelle__titel { font-family: var(--wp--preset--font-family--sans); font-weight: 600; font-size: 1.15rem; line-height: 1.35; margin: 0 0 .35rem; letter-spacing: 0; }
.side-stelle__titel a { color: var(--wp--preset--color--schrift); text-decoration: none; }
.side-stelle__titel a:hover { color: var(--wp--preset--color--primaer); }
.side-stelle__meta { font-size: .9rem; opacity: .75; margin: 0 0 1.5rem; }
.side-stelle__teaser { margin: 0 0 1.5rem; font-size: .95rem; }
.side-stelle__aktion { margin-top: auto; }
.side-stellen-leer { margin-top: 2rem; }

.side-stelle-detail { padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30); }
.side-stelle-detail > * { max-width: 46rem; margin-left: auto; margin-right: auto; }
.side-stelle-detail__kopf { text-align: center; }
.side-stelle-detail__zurueck { font-size: .9rem; margin: 0 0 1.5rem; }
.side-stelle-detail__titel { margin: 0; }
.side-stelle-detail__meta { opacity: .8; }
.side-stelle-detail__aktion { justify-content: center; margin-top: 1.25rem; }
.side-stelle-detail__inhalt { margin-top: var(--wp--preset--spacing--40); }
.side-stelle-detail__fakten { box-sizing: border-box; display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 1rem; margin: 0 0 2rem; padding: 1.25rem; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 3px; }
.side-stelle-detail__fakten dt { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; opacity: .7; }
.side-stelle-detail__fakten dd { margin: .2rem 0 0; }
.side-stelle-detail__text h3 { font-family: var(--wp--preset--font-family--sans); font-weight: 600; font-size: 1.1rem; letter-spacing: 0; color: var(--wp--preset--color--schrift); margin: 1.75rem 0 .5rem; }
/* Aufzählungen kompakt wie auf der Hauptseite: Punkt vor dem Text, keine Einrückung */
.side-stelle-detail__text ul { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.side-stelle-detail__text li { margin: 0; padding-left: .9em; text-indent: -.9em; }
.side-stelle-detail__text ul li::before { content: "•"; display: inline-block; width: .9em; text-indent: 0; }
.side-stelle-detail__text p { margin: 0 0 1rem; }
/* Über uns + Ansprechperson */
.side-stelle-detail__ueber-uns { margin-top: var(--wp--preset--spacing--40); }
.side-stelle-detail__ueber-uns h2, .side-stelle-detail__ueber-uns h3 { font-family: var(--wp--preset--font-family--sans); font-weight: 600; font-size: 1.1rem; letter-spacing: 0; color: var(--wp--preset--color--schrift); margin: 0 0 .5rem; }
.side-kontakt { box-sizing: border-box; margin-top: var(--wp--preset--spacing--40); padding: 1.5rem; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 3px; }
.side-kontakt__titel { font-family: var(--wp--preset--font-family--sans); font-weight: 600; font-size: 1.1rem; letter-spacing: 0; color: var(--wp--preset--color--primaer); margin: 0 0 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--wp--preset--color--rahmen); }
.side-kontakt__person { display: flex; align-items: center; gap: 1.25rem; }
.side-kontakt__person.wp-block-group { gap: 1.25rem; }
.side-kontakt__foto { flex: none; width: 5rem; height: 5rem; margin: 0; object-fit: cover; border-radius: 8px; }
.side-kontakt__foto img { display: block; width: 5rem; height: 5rem; object-fit: cover; border-radius: 8px; }
.side-kontakt__name { margin: 0; font-weight: 600; }
.side-kontakt__daten > * { margin: 0; }
.side-kontakt__daten > * + * { margin-top: .25rem; }
.side-kontakt__rolle { opacity: .8; }
.side-kontakt__daten a { color: var(--wp--preset--color--primaer); text-decoration: none; }
.side-kontakt__daten a:hover, .side-kontakt__daten a:focus-visible { text-decoration: underline; }
.side-stelle-detail__bewerben { margin-top: var(--wp--preset--spacing--50); padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--wp--preset--color--rahmen); text-align: center; }
.side-stelle-detail__bewerben .wp-block-buttons { justify-content: center; }

/* ---------- Bewerbungsformular ---------- */
.side-bewerbung { max-width: 46rem; margin: var(--wp--preset--spacing--40) auto 0; text-align: left; }
.side-bewerbung__stelle { margin: 0 0 1.25rem; }
.side-bewerbung__raster { display: grid; grid-template-columns: 1fr; gap: 1rem 1.5rem; }
@media (min-width: 640px) { .side-bewerbung__raster { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .side-bewerbung__feld--schmal, .side-bewerbung__feld--breit { grid-column: 1 / -1; } .side-bewerbung__feld--schmal select { max-width: calc(50% - .75rem); } }
.side-bewerbung__feld { margin: 0; display: flex; flex-direction: column; gap: .35rem; }
.side-bewerbung label { font-weight: 600; font-size: .95rem; }
.side-bewerbung abbr { text-decoration: none; color: var(--wp--preset--color--primaer); }
.side-bewerbung input[type=text], .side-bewerbung input[type=email], .side-bewerbung input[type=tel], .side-bewerbung select, .side-bewerbung textarea {
	box-sizing: border-box; width: 100%; padding: .7rem .8rem; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 3px;
	background: #fff; color: inherit; font: inherit; font-size: 1rem; }
.side-bewerbung input[type=file] { max-width: 100%; font: inherit; font-size: .95rem; padding: .55rem 0; }
.side-bewerbung :is(input, select, textarea):focus-visible { outline: 2px solid var(--wp--preset--color--primaer); outline-offset: 1px; border-color: var(--wp--preset--color--primaer); }
.side-bewerbung [aria-invalid=true] { border-color: #b3261e; }
.side-bewerbung__hinweis { font-size: .85rem; opacity: .75; }
.side-bewerbung__fehler { font-size: .9rem; color: #b3261e; }
.side-bewerbung__meldung { margin: 0 0 1.25rem; padding: .9rem 1rem; border-left: 4px solid #b3261e; background: #fbeeed; }
.side-bewerbung__einwilligung { display: grid; grid-template-columns: auto 1fr; gap: .25rem .75rem; align-items: start; margin: 1.25rem 0 0; }
.side-bewerbung__einwilligung input { width: 1.15rem; height: 1.15rem; margin: .2rem 0 0; accent-color: var(--wp--preset--color--primaer); }
.side-bewerbung__einwilligung label { font-weight: 400; }
.side-bewerbung__einwilligung .side-bewerbung__fehler { grid-column: 2; }
.side-bewerbung .wp-block-buttons { display: flex; justify-content: center; margin-top: 1.5rem; }
.side-bewerbung button { cursor: pointer; }
.side-bewerbung__pflicht { font-size: .85rem; opacity: .75; margin: .75rem 0 0; }
.side-bewerbung__falle { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.side-bewerbung__danke { max-width: 46rem; margin: var(--wp--preset--spacing--40) auto 0; padding: 1.5rem; border: 1px solid var(--wp--preset--color--primaer); border-radius: 3px; }
.side-bewerbung__danke h3 { margin-top: 0; color: var(--wp--preset--color--primaer); }
.side-stelle-detail__alternativ { max-width: 46rem; margin: var(--wp--preset--spacing--40) auto 0; font-size: .95rem; }

/* ---------- Ton-Schalter am Titelvideo ---------- */
.side-ton { position: absolute; right: 1.25rem; bottom: 1.25rem; z-index: 3; width: 2.75rem; height: 2.75rem; padding: .6rem; border: 1px solid #fff; border-radius: 50%; background: rgba(0,0,0,.35); color: #fff; cursor: pointer; transition: background .2s; }
.side-ton:hover, .side-ton:focus-visible { background: var(--wp--preset--color--primaer); }
.side-ton:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.side-ton svg { display: block; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.side-ton svg path:first-child { fill: currentColor; }
.side-ton .side-ton__an, .side-ton[aria-pressed="true"] .side-ton__aus { display: none; }
.side-ton[aria-pressed="true"] .side-ton__an { display: block; }

/* Stellenseite mit Bild (aus Onboard, lokal gespeichert) */
.side-stelle-detail__kopf.hat-bild { position: relative; max-width: none; margin: calc(-1 * var(--wp--preset--spacing--50)) calc(-1 * var(--wp--preset--spacing--30)) 0; padding: clamp(4rem, 12vw, 9rem) var(--wp--preset--spacing--30) clamp(3rem, 8vw, 6rem); background: #000 var(--side-stelle-bild) center / cover no-repeat; color: #fff; }
.side-stelle-detail__kopf.hat-bild::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.side-stelle-detail__kopf.hat-bild > * { position: relative; max-width: 46rem; margin-left: auto; margin-right: auto; }
.side-stelle-detail__kopf.hat-bild .side-stelle-detail__titel, .side-stelle-detail__kopf.hat-bild a:not(.wp-element-button) { color: #fff; }
.side-stelle-detail__kopf.hat-bild .side-stelle-detail__meta { opacity: .9; }
.side-stelle-detail__kopf.hat-bild .wp-block-separator { color: #fff; background-color: #fff; border-color: #fff; }
.side-stelle-detail__kopf.hat-bild .wp-element-button { color: #fff; border-color: #fff; background: transparent; }
.side-stelle-detail__kopf.hat-bild .wp-element-button:hover, .side-stelle-detail__kopf.hat-bild .wp-element-button:focus { background: #fff; color: var(--wp--preset--color--primaer); }

/* ---------- Stellenseite Layout 2: Text links, Bild rechts ---------- */
.side-stelle-geteilt { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; }
.side-stelle-geteilt__bild { order: -1; min-height: 42vw; background: var(--wp--preset--color--primaer) var(--side-stelle-bild-klein, none) center / cover no-repeat; display: flex; align-items: center; justify-content: center; }
.side-stelle-geteilt__logo { width: 28%; max-width: 10rem; height: auto; }
.side-stelle-geteilt__text { box-sizing: border-box; padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) var(--wp--preset--spacing--50); }
.side-stelle-geteilt__text > * { max-width: 46rem; }
.side-stelle-geteilt__titel { margin: 0; color: var(--wp--preset--color--primaer); }
.side-stelle-geteilt__chips { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 1.25rem 0 0; padding: 0 0 1.5rem; border-bottom: 1px solid var(--wp--preset--color--rahmen); }
.side-chip { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .65rem; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 3px; font-size: .9rem; line-height: 1.3; }
.side-chip__icon { flex: none; color: var(--wp--preset--color--primaer); }
.side-stelle-geteilt__inhalt { margin-top: var(--wp--preset--spacing--40); }
.side-stelle-geteilt__inhalt .side-stelle-detail__text > :first-child { margin-top: 0; }
.side-stelle-geteilt__schwebend { position: sticky; bottom: 1.25rem; z-index: 2; display: flex; justify-content: center; margin-top: var(--wp--preset--spacing--40); }
.side-stelle-geteilt__schwebend .wp-element-button { background: var(--wp--preset--color--primaer); color: #fff; box-shadow: 0 .4rem 1.2rem rgba(0,0,0,.18); }
.side-stelle-geteilt__schwebend .wp-element-button:hover, .side-stelle-geteilt__schwebend .wp-element-button:focus-visible { background: #fff; color: var(--wp--preset--color--primaer); }
.side-stelle-geteilt .side-stelle-detail__bewerben { text-align: left; }
.side-stelle-geteilt .side-stelle-detail__bewerben > h2 { margin-top: 0; }
.side-stelle-geteilt .side-bewerbung, .side-stelle-geteilt .side-stelle-detail__alternativ { margin-left: 0; }
@media (min-width: 960px) {
	.side-stelle-geteilt { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
	.side-stelle-geteilt__bild { order: 0; position: sticky; top: 0; height: 100vh; min-height: 0; background-image: var(--side-stelle-bild, none); }
	.side-stelle-geteilt__text { padding: var(--wp--preset--spacing--50) clamp(1.5rem, 4vw, 4rem) var(--wp--preset--spacing--60); }
	.side-stelle-geteilt__text > * { margin-left: auto; margin-right: 0; }
}

/* ---------- Bewerbungsformular als Fenster ---------- */
html:has(.side-bewerben-fenster[open]) { overflow: hidden; }
.side-bewerben-fenster { box-sizing: border-box; width: min(52rem, calc(100vw - 2rem)); max-width: none; max-height: calc(100vh - 2rem); margin: auto; padding: var(--wp--preset--spacing--40) clamp(1.25rem, 4vw, 3rem); border: 0; border-radius: 3px; background: #fff; color: inherit; overflow: auto; box-shadow: 0 1rem 3rem rgba(0,0,0,.25); }
.side-bewerben-fenster::backdrop { background: rgba(0,0,0,.55); }
.side-bewerben-fenster .side-stelle-detail__bewerben { margin: 0; padding: 0; border: 0; text-align: left; }
.side-bewerben-fenster .side-stelle-detail__bewerben > h2 { margin-top: 0; padding-right: 2.5rem; }
.side-bewerben-fenster .side-bewerbung, .side-bewerben-fenster .side-stelle-detail__alternativ, .side-bewerben-fenster .side-bewerbung__danke { margin-left: 0; margin-right: 0; max-width: none; }
.side-bewerben-fenster__zu { position: sticky; top: 0; float: right; z-index: 2; display: flex; padding: .45rem; margin: -.5rem -.5rem 0 0; border: 1px solid var(--wp--preset--color--rahmen); border-radius: 50%; background: #fff; color: var(--wp--preset--color--primaer); cursor: pointer; }
.side-bewerben-fenster__zu:hover, .side-bewerben-fenster__zu:focus-visible { background: var(--wp--preset--color--primaer); color: #fff; }
@media (max-width: 639px) {
	.side-bewerben-fenster { width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
}
/* Layout 2: Fenster über die ganze Seite, Formular links, Stellenbild rechts (wie bei Onboard). */
.side-bewerben-fenster__bild { display: none; }
@media (min-width: 960px) {
	.side-bewerben-fenster.ist-geteilt { width: 100vw; height: 100vh; max-height: 100vh; margin: 0; inset: 0; padding: 0; border-radius: 0; box-shadow: none; }
	.side-bewerben-fenster.ist-geteilt[open] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
	.side-bewerben-fenster.ist-geteilt .side-bewerben-fenster__inhalt { box-sizing: border-box; padding: var(--wp--preset--spacing--50) clamp(1.5rem, 4vw, 4rem) var(--wp--preset--spacing--60); }
	.side-bewerben-fenster.ist-geteilt .side-bewerben-fenster__inhalt > * { max-width: 46rem; margin-left: auto; }
	.side-bewerben-fenster.ist-geteilt .side-bewerben-fenster__zu { margin: 0 0 0 1rem; }
	.side-bewerben-fenster.ist-geteilt .side-bewerben-fenster__bild { display: block; position: sticky; top: 0; height: 100vh; background: var(--wp--preset--color--primaer) var(--side-stelle-bild, none) center / cover no-repeat; }
	.side-bewerben-fenster__bild .side-stelle-geteilt__logo { display: block; width: 28%; max-width: 10rem; margin: 40vh auto 0; }
}