section.m12_job_vacancies .m12_item_content {
	background-color:#f1f1f1;
	height:100%;
}

section.m12_job_vacancies .m12_stellenangebote_container_content {
	padding:20px;
}

section.m12_job_vacancies p {
	margin:0;
}

section.m12_job_vacancies .m12_item {
	margin-bottom:30px;
}

section.m12_job_vacancies .m12_stellenangebote_container_load_more {
	width: 100%;
    display: table;
}

section.m12_job_vacancies .m12_stellenangebote_load_more {
    display: table;
}

section.m12_job_vacancies .m12_stellenangebote_load_more_container {
	position:relative;
	width:200px;
}

section.m12_job_vacancies .m12_stellenangebote_load_more_loader {
    position: absolute;
    width: 20px;
    transform: translate(50%, 0);
    cursor:default;
}

section.m12_job_vacancies .m12_stellenangebote_load_more_text {
	text-align:center;
	cursor:pointer;
}

section.m12_job_vacancies .m12_teaser_zusatzinformationen_container,
section.m12_job_vacancies .m12_link_container {
	margin-top:20px;
}

section.m12_job_vacancies .m12_stellenangebote_pagination_container {
	display:table;
}

section.m12_job_vacancies .m12_stellenangebote_pagination_container > div {
	float:left;
	cursor:pointer;
}

section.m12_job_vacancies .pagination_active {
	color:#b04453;
}

section.m12_job_vacancies[data-text-kurzen="true"] .m12_title_text_container {
	height: 120px;
    overflow: hidden;
}

section.m12_job_vacancies .m12_image_container img {
	width:100%;
}

section.m12_job_vacancies .m12_teaser_zusatzinformationen_container,
section.m12_job_vacancies .m12_teaser_zusatzinformationen_main {
	display:table;
	width:100%;
}
/* =========================================================
   hone Stellenangebote (Wrapper-Klasse "hone_stellen")
   Figma 04_Karriere-02 (46:2): Sektionstitel zentriert (Gold-span),
   2-spaltiges Raster dunkler Karten 721x154 (#2b2b2b, 1px
   rgba(255,255,255,.15)), Pfeil-Quadrat 41px oben rechts.
   Titel und Untertitel stehen im Entwurf bei ein- UND zweizeiligen
   Karten auf derselben Hoehe -> feste Positionen (Titel min-height
   52px = zwei Zeilen), NICHT senkrecht zentriert.
   Vertikal-Abstand der Sektion aus dem Abstand-Klonfeld.
   ========================================================= */

section.m12_job_vacancies.hone_stellen {
	background: transparent;
}

section.m12_job_vacancies.hone_stellen .m12_hone_titel_container {
	margin-bottom: 54px;
	text-align: center;
}

/* Groesse kommt zentral aus project.css (.mM_title_container h2) */
section.m12_job_vacancies.hone_stellen .m12_hone_titel {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
}

section.m12_job_vacancies.hone_stellen .m12_hone_titel span {
	color: #a5936f;
}

section.m12_job_vacancies.hone_stellen .m12_hone_grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 23px 20px;
}

/* Innenrand rechts = 26 Rand + 41 Pfeil + 81 Fuge (Entwurf: Textspalte 524 von 721).
   Alle Werte um den 1px-Rahmen verringert, damit die Karte auf 154 kommt:
   1 + 28 + 52 (Titel) + 20 + 26 (Untertitel) + 26 + 1 = 154. */
section.m12_job_vacancies.hone_stellen .m12_hone_card {
	position: relative;
	display: block;
	min-height: 154px;
	box-sizing: border-box;
	padding: 28px 147px 26px 48px;
	background-color: #2b2b2b;
	border: 1px solid rgba(255, 255, 255, 0.15);
	text-decoration: none;
	transition: background-color .3s, border-color .3s;
}

section.m12_job_vacancies.hone_stellen a.m12_hone_card:hover {
	background-color: #1f1f1f;
	border-color: rgba(255, 255, 255, 0.3);
}

/* Das Theme zwingt h3 und Link-Inhalte global in Versalien — der Entwurf
   zeigt Titel und Untertitel der Karte im Normalsatz. */
section.m12_job_vacancies.hone_stellen .m12_hone_card,
section.m12_job_vacancies.hone_stellen .m12_hone_card * {
	text-transform: none;
}

section.m12_job_vacancies.hone_stellen .m12_hone_card_titel {
	margin: 0;
	min-height: 52px;          /* zwei Zeilen à 26px */
	font-size: 0.9rem;         /* 18px (Basis 20px) */
	line-height: 1.4444;       /* 26px */
	font-weight: 500;
	letter-spacing: 0.875px;
	color: #fff;
}

section.m12_job_vacancies.hone_stellen .m12_hone_card_text {
	margin: 20px 0 0 0;
	font-size: 0.8rem;         /* 16px (Basis 20px) */
	line-height: 1.625;        /* 26px */
	letter-spacing: 0.45px;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.5);
}

/* Pfeil-Quadrat oben rechts (Figma Group 16: 41px, weisser 30%-Rand, weisses Dreieck) */
section.m12_job_vacancies.hone_stellen .m12_hone_card_arrow {
	position: absolute;
	top: 20px;                 /* + 1px Rahmen = 21 wie im Entwurf */
	right: 25px;
	width: 41px;
	height: 41px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-sizing: border-box;
}

section.m12_job_vacancies.hone_stellen .m12_hone_card_arrow::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 7px solid #fff;
}

section.m12_job_vacancies.hone_stellen a.m12_hone_card:hover .m12_hone_card_arrow {
	border-color: #a5936f;
}

section.m12_job_vacancies.hone_stellen a.m12_hone_card:hover .m12_hone_card_arrow::after {
	border-left-color: #a5936f;
}

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
	section.m12_job_vacancies.hone_stellen .m12_hone_card {
		padding-right: 106px;   /* 25 + 41 + 40 Fuge */
	}
}

/* Ab hier einspaltig: zweispaltig blieben von 350px Karte nur noch 196px
   Textspalte uebrig, der Titel zerfiel in vier Zeilen. */
@media (max-width: 991px) {
	section.m12_job_vacancies.hone_stellen .m12_hone_grid {
		grid-template-columns: 1fr;
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_card {
		padding: 24px 87px 24px 30px;   /* rechts: 20 + 41 + 26 Fuge */
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_card_arrow {
		top: 20px;
		right: 20px;
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_titel_container {
		margin-bottom: 40px;
	}
}

@media (max-width: 575px) {
	section.m12_job_vacancies.hone_stellen .m12_hone_titel {
		line-height: 1.15;
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_card_titel {
		min-height: 0;
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_card_text {
		margin-top: 14px;
	}
}

/* Sehr schmal: der Pfeil frisst sonst die Textspalte auf */
@media (max-width: 380px) {
	section.m12_job_vacancies.hone_stellen .m12_hone_card {
		padding: 20px;
	}

	section.m12_job_vacancies.hone_stellen .m12_hone_card_arrow {
		position: static;
		display: block;
		margin-top: 20px;
	}
}
