/* Webtonia Bewerberportal – Layout-spezifisches CSS (Master-Prompt Abschnitt 9.4):
   zusätzliche Übersichts-Layouts "tiles"/"panel" (Nachtrag 01) sowie die Job-Detail-Vorlagen
   "split"/"minimal" (Master-Prompt Phase 2). Bewusst getrennt von wtb-frontend.css: dort
   bleiben ausschließlich die unveränderten Standard-Layouts "list" (Übersicht) und "classic"
   (Job-Detail). Farben laufen über CSS-Variablen mit Fallback-Kette. */

/* ===================== Kacheln (tiles) ===================== */

.wtb-jobs--tiles {
	display: grid;
	grid-template-columns: repeat( var( --wtb-tiles-cols, 4 ), 1fr );
	gap: 40px 32px;
	align-items: stretch;
}

@media ( max-width: 1024px ) {
	.wtb-jobs--tiles {
		grid-template-columns: repeat( 2, 1fr );
	}
}
@media ( max-width: 600px ) {
	.wtb-jobs--tiles {
		grid-template-columns: 1fr;
	}
}

.wtb-job-card--tiles {
	display: flex;
	flex-direction: column;
	padding: 0;
	border: 0;
}

.wtb-job-card--tiles .wtb-job-card__media {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	border-radius: var( --wtb-tile-radius, 14px );
	background: var( --wtb-bg-soft );
}
.wtb-job-card--tiles .wtb-job-card__media img,
.wtb-job-card--tiles .wtb-job-card__image-placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wtb-job-card--tiles .wtb-job-card__image-placeholder {
	background: linear-gradient( 135deg, var( --wtb-bg-soft ), color-mix( in srgb, var( --wtb-bg-soft ) 60%, black ) );
}

.wtb-job-card--tiles .wtb-job-card__media-overlay {
	position: absolute;
	inset: 0;
	background: var( --wtb-tile-overlay, rgba( 0, 0, 0, .38 ) );
	border-radius: inherit;
}

.wtb-job-card--tiles .wtb-job-card__media-icon {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var( --wtb-tile-icon-color );
	width: var( --wtb-tile-icon-size, 34px );
	height: var( --wtb-tile-icon-size, 34px );
	margin: auto;
	pointer-events: none;
}
.wtb-job-card--tiles .wtb-job-card__media-icon svg {
	width: 100%;
	height: 100%;
	stroke-width: 1.5;
}

@media ( prefers-reduced-motion: no-preference ) {
	.wtb-job-card--tiles .wtb-job-card__media img {
		transition: transform .25s ease;
	}
	.wtb-job-card--tiles .wtb-job-card__media-overlay {
		transition: opacity .25s ease;
	}
	.wtb-job-card--tiles .wtb-job-card__media-icon {
		transition: transform .25s ease;
	}
	.wtb-job-card--tiles:hover .wtb-job-card__media img {
		transform: scale( 1.03 );
	}
	.wtb-job-card--tiles:hover .wtb-job-card__media-overlay {
		opacity: .88;
	}
	.wtb-job-card--tiles:hover .wtb-job-card__media-icon {
		transform: scale( 1.12 );
	}
}

.wtb-job-card--tiles .wtb-job-card__content {
	display: flex;
	flex-direction: column;
	padding-top: 20px;
}

.wtb-job-card--tiles .wtb-job-card__title {
	margin: 0 0 20px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
}
.wtb-job-card--tiles .wtb-job-card__title a {
	color: var( --wtb-tile-title-color, var( --wtb-text ) ) !important;
	text-decoration: none !important;
}
.wtb-job-card--tiles .wtb-job-card__title a:hover {
	color: var( --wtb-tile-link-color, var( --wtb-primary ) ) !important;
}

.wtb-job-card--tiles .wtb-job-card__excerpt {
	margin: -12px 0 16px;
	color: var( --wtb-muted );
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var( --wtb-clamp-lines, 3 );
	overflow: hidden;
}

.wtb-job-card--tiles .wtb-job-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 30px;
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	font-size: 15.5px;
}
.wtb-job-card--tiles .wtb-job-card__meta-item {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var( --wtb-tile-meta-color, var( --wtb-primary ) );
}
.wtb-job-card--tiles .wtb-job-card__meta-item svg {
	flex-shrink: 0;
}

.wtb-job-card--tiles .wtb-job-card__link {
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	margin-top: auto;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .05em;
	color: var( --wtb-tile-link-color, var( --wtb-primary ) ) !important;
	text-decoration: none !important;
}
.wtb-job-card--tiles .wtb-job-card__link {
	text-transform: var( --wtb-tile-link-transform, uppercase );
}
.wtb-job-card--tiles .wtb-job-card__link svg {
	flex-shrink: 0;
}
@media ( prefers-reduced-motion: no-preference ) {
	.wtb-job-card--tiles .wtb-job-card__link svg {
		transition: transform .2s ease;
	}
	.wtb-job-card--tiles .wtb-job-card__link:hover svg {
		transform: translateX( 5px );
	}
}

/* ===================== Panel (panel) ===================== */

.wtb-jobs--panel {
	display: grid;
	grid-template-columns: repeat( var( --wtb-panel-cols, 2 ), 1fr );
	gap: 28px;
	align-items: stretch;
}

@media ( max-width: 900px ) {
	.wtb-jobs--panel {
		grid-template-columns: 1fr;
	}
}

.wtb-job-card--panel {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0;
	border: 0;
	overflow: hidden;
	border-radius: var( --wtb-panel-radius, 0px );
	background: var( --wtb-panel-bg );
}

.wtb-job-card--panel .wtb-job-card__inner {
	display: grid;
	grid-template-columns: var( --wtb-panel-media-width, 1fr ) 1fr;
	flex: 1;
}
.wtb-job-card--panel.wtb-job-card--no-media .wtb-job-card__inner {
	grid-template-columns: 1fr;
}
.wtb-job-card--panel.wtb-job-card--no-media .wtb-job-card__media {
	display: none;
}

.wtb-job-card--panel .wtb-job-card__media {
	display: block;
	position: relative;
	height: 100%;
	width: 100%;
	background: var( --wtb-bg-soft );
}
.wtb-job-card--panel .wtb-job-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.wtb-job-card--panel .wtb-job-card__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var( --wtb-panel-padding, 32px );
	background: var( --wtb-panel-bg );
}

.wtb-job-card--panel .wtb-job-card__title {
	margin: 0 0 12px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.25;
}
.wtb-job-card--panel .wtb-job-card__title a {
	color: var( --wtb-panel-title-color, var( --wtb-text ) ) !important;
	text-decoration: none !important;
}
.wtb-job-card--panel .wtb-job-card__title a:hover {
	color: var( --wtb-panel-bar-bg, var( --wtb-primary ) ) !important;
}

.wtb-job-card--panel .wtb-job-card__excerpt {
	color: var( --wtb-panel-text-color, var( --wtb-muted ) );
	font-size: 16px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var( --wtb-clamp-lines, 6 );
	overflow: hidden;
}

.wtb-job-card--panel .wtb-job-card__meta--chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
	font-size: 14px;
}
.wtb-job-card--panel .wtb-job-card__meta--chips .wtb-job-card__meta-item {
	display: flex;
	align-items: center;
	gap: 6px;
	background: var( --wtb-bg-soft );
	border-radius: 20px;
	padding: 4px 12px;
	color: var( --wtb-text );
}

.wtb-job-card--panel .wtb-job-card__bar {
	margin-top: auto;
	display: flex !important;
	align-items: center;
	justify-content: var( --wtb-panel-bar-justify, center );
	gap: 14px;
	width: 100%;
	padding: 16px 24px;
	font-weight: 600;
	background: var( --wtb-panel-bar-bg, var( --wtb-primary ) ) !important;
	color: var( --wtb-panel-bar-color ) !important;
	text-decoration: none !important;
	box-sizing: border-box;
}
.wtb-job-card--panel .wtb-job-card__bar svg {
	flex-shrink: 0;
}
.wtb-job-card--panel .wtb-job-card__bar:hover {
	background: var( --wtb-panel-bar-bg-hover, color-mix( in srgb, var( --wtb-panel-bar-bg, var( --wtb-primary ) ) 85%, black ) ) !important;
}

@media ( max-width: 600px ) {
	.wtb-job-card--panel .wtb-job-card__inner {
		grid-template-columns: 1fr;
	}
	.wtb-job-card--panel .wtb-job-card__media {
		aspect-ratio: 16 / 9;
		height: auto;
	}
}

/* ===================== Job-Detail-Vorlage "split" ===================== */

.wtb-job--split {
	/* Hero randlos über die Viewport-Breite; Inhaltsbreite kommt aus der Einstellung. */
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.wtb-job--split .wtb-job__backlink-wrap {
	margin: 0 0 16px;
}
.wtb-job--split .wtb-job__backlink {
	color: rgba( 255, 255, 255, .85 ) !important;
}
.wtb-job--split .wtb-job__backlink:hover {
	color: #fff !important;
}

.wtb-job__split-hero {
	position: relative;
	overflow: hidden;
	min-height: 420px;
	display: flex;
	align-items: flex-end;
	background: var( --wtb-primary );
}
.wtb-job__split-hero-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wtb-job__split-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient( to top, rgba( 0, 0, 0, .65 ), rgba( 0, 0, 0, 0 ) 65% );
}
.wtb-job__split-hero--fallback .wtb-job__split-hero-overlay {
	background: none;
}
.wtb-job__split-hero-inner {
	position: relative;
	z-index: 1;
	max-width: var( --wtb-widget-maxwidth ) !important;
	margin: 0 auto;
	padding: 40px var( --wtb-container-padding-extra, 0px );
	width: 100%;
	box-sizing: border-box;
}
.wtb-job__split-hero-inner .wtb-job__title {
	color: #fff;
	margin: 0;
}

.wtb-job__split-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	list-style: none;
	margin: 0 auto;
	padding: 20px var( --wtb-container-padding-extra, 0px );
	max-width: var( --wtb-widget-maxwidth ) !important;
	box-sizing: border-box;
	width: 100%;
}
.wtb-job__split-facts-chip {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var( --wtb-bg-soft );
	border-radius: 999px;
	padding: 8px 16px;
	color: var( --wtb-text );
}
.wtb-job__split-facts-chip svg {
	color: var( --wtb-primary );
	flex-shrink: 0;
}

.wtb-job__layout--split {
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	gap: 24px;
	align-items: start;
	max-width: var( --wtb-widget-maxwidth ) !important;
	margin: 0 auto;
	padding: 0 var( --wtb-container-padding-extra, 0px );
	box-sizing: border-box;
	width: 100%;
}
.wtb-job__layout--split .wtb-job__sidebar {
	position: sticky;
	top: 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.wtb-job__split-apply-btn {
	width: 100%;
	box-sizing: border-box;
}

.wtb-job__split-cta-wrap {
	max-width: var( --wtb-widget-maxwidth ) !important;
	margin: 30px auto 0;
	padding: 0 var( --wtb-container-padding-extra, 0px );
	box-sizing: border-box;
	width: 100%;
}
.wtb-job__split-cta-wrap .wtb-job__footer-cta {
	width: 100%;
	box-sizing: border-box;
}

.wtb-job__split-form-wrap {
	max-width: var( --wtb-widget-maxwidth ) !important;
	margin: 40px auto 0;
	padding: 40px var( --wtb-container-padding-extra, 0px );
	/* Kein weicher (oft hellgrüner) Flächenhintergrund hinter dem Formular. */
	background: transparent;
	scroll-margin-top: 24px;
	box-sizing: border-box;
	width: 100%;
}
.wtb-job__split-form-wrap .wtb-form-wrap {
	max-width: none;
	width: 100%;
	margin: 0;
	box-sizing: border-box;
}

@media ( max-width: 900px ) {
	.wtb-job__layout--split {
		grid-template-columns: 1fr;
	}
}

/* ===================== Job-Detail-Vorlage "minimal" ===================== */

.wtb-job--minimal {
	padding-left: var( --wtb-container-padding-extra, 0px );
	padding-right: var( --wtb-container-padding-extra, 0px );
}
.wtb-job__minimal-inner {
	max-width: 820px;
	margin: 0 auto;
}
.wtb-job--minimal > .wtb-job__footer-cta {
	width: 100%;
	box-sizing: border-box;
	margin-top: 30px;
}

.wtb-job__facts--inline {
	color: var( --wtb-muted );
	font-size: .95rem;
	margin: 0 0 24px;
}

.wtb-job__minimal-section {
	padding-top: 24px;
	margin-top: 24px;
	border-top: 1px solid var( --wtb-border );
}
.wtb-job__minimal-section:first-of-type {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}
.wtb-job--minimal .wtb-job__hero-media {
	aspect-ratio: 16 / 9;
	border-radius: var( --wtb-radius, 10px );
	margin-bottom: 0;
}

.wtb-job__contact-card--compact {
	display: flex;
	align-items: center;
	gap: 16px;
	background: none;
	border: 0;
	box-shadow: none;
	position: static;
	padding: 0;
}
.wtb-job__contact-card--compact .wtb-job__contact-photo {
	flex: 0 0 auto;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	overflow: hidden;
}
.wtb-job__contact-card--compact .wtb-job__contact-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wtb-job__contact-card--compact .wtb-job__contact-body {
	padding: 0;
}
.wtb-job__contact-card--compact .wtb-job__contact-name {
	margin: 0;
}
.wtb-job__contact-card--compact .wtb-job__contact-position {
	margin: 2px 0 6px;
}
.wtb-job__contact-card--compact .wtb-job__contact-line {
	display: inline-block;
	margin: 0 12px 0 0;
}

/* ===================== Elementor Theme-Builder-Bausteine (Widgets 3-9) ===================== */

.wtb-eb-hero {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: var( --wtb-bg-soft );
}
.wtb-eb-hero__media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wtb-eb-hero__media--placeholder {
	background: var( --wtb-bg-soft );
}
.wtb-eb-hero__overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.wtb-eb-title {
	margin: 0;
}

.wtb-eb-content {
	line-height: 1.7;
}
.wtb-eb-content h2,
.wtb-eb-content h3 {
	color: var( --wtb-primary );
}
.wtb-eb-content ul {
	padding-left: 20px;
}

.wtb-eb-facts {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wtb-eb-facts--list .wtb-eb-facts__item {
	margin-bottom: 6px;
}
.wtb-eb-facts--chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.wtb-eb-facts--chips .wtb-eb-facts__item {
	background: var( --wtb-bg-soft );
	border-radius: 20px;
	padding: 6px 14px;
}
.wtb-eb-facts--table {
	width: 100%;
	border-collapse: collapse;
}
.wtb-eb-facts--table td,
.wtb-eb-facts--table th {
	padding: 8px 12px;
	border-bottom: 1px solid var( --wtb-border );
	text-align: left;
}
.wtb-eb-facts__label {
	font-weight: 600;
	color: var( --wtb-text );
}
.wtb-eb-facts__value {
	color: var( --wtb-muted );
}

.wtb-eb-apply-btn--sticky-mobile {
	position: static;
}
@media ( max-width: 768px ) {
	.wtb-eb-apply-btn--sticky-mobile {
		position: fixed;
		left: 16px;
		right: 16px;
		bottom: 16px;
		z-index: 100;
		width: auto !important;
		box-shadow: 0 8px 24px rgba( 0, 0, 0, .25 );
	}
}
@media ( prefers-reduced-motion: no-preference ) {
	.wtb-eb-apply-btn--sticky-mobile {
		transition: transform .2s ease;
	}
}

/* ===================== Job-Detail: Fokus (Phase 4) ===================== */

.wtb-job--focus {
	/* Breite kommt von .wtb-job (Einstellung Maximale Breite). */
	padding-left: var( --wtb-container-padding-extra, 0 );
	padding-right: var( --wtb-container-padding-extra, 0 );
}

.wtb-job__layout--focus {
	display: grid;
	grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

.wtb-job__sidebar--focus {
	position: sticky;
	top: 24px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.wtb-job__focus-facts {
	background: var( --wtb-bg-soft, #f6faf2 );
	border-radius: var( --wtb-radius, 10px );
	padding: 16px 18px;
}

.wtb-job__focus-apply-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}

.wtb-job__focus-toc-title {
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var( --wtb-muted, #5c626a );
}

.wtb-job__focus-toc-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wtb-job__focus-toc-item {
	margin: 0 0 6px;
}

.wtb-job__focus-toc-item--h3 {
	padding-left: 12px;
	font-size: .95em;
}

.wtb-job__focus-toc-item a {
	color: var( --wtb-text, #3F444B );
	text-decoration: none;
}

.wtb-job__focus-toc-item a:hover,
.wtb-job__focus-toc-item a:focus {
	color: var( --wtb-primary );
	outline: none;
}

.wtb-job__focus-toc-item a:focus-visible {
	outline: 2px solid var( --wtb-primary );
	outline-offset: 2px;
}

.wtb-job__col-main--focus .wtb-job__hero-media {
	margin-bottom: 20px;
	border-radius: var( --wtb-radius, 10px );
	overflow: hidden;
}

.wtb-job__focus-form-wrap {
	margin-top: 32px;
}

.wtb-job__focus-mobile-bar {
	display: none;
}

@media ( max-width: 900px ) {
	.wtb-job__layout--focus {
		grid-template-columns: 1fr;
	}

	.wtb-job__sidebar--focus {
		position: static;
		order: 2;
	}

	.wtb-job__col-main--focus {
		order: 1;
	}

	.wtb-job__focus-mobile-bar:not([hidden]) {
		display: block;
		position: fixed;
		left: 16px;
		right: 16px;
		bottom: 16px;
		z-index: 100;
	}

	.wtb-job__focus-mobile-bar-btn {
		display: flex;
		width: 100%;
		justify-content: center;
		box-shadow: 0 8px 24px rgba( 0, 0, 0, .2 );
	}
}

@media ( prefers-reduced-motion: no-preference ) {
	.wtb-job__focus-mobile-bar:not(.wtb-job__focus-mobile-bar--no-motion) .wtb-job__focus-mobile-bar-btn {
		transition: opacity .2s ease, transform .2s ease;
	}
}

/* ===================== Job-Detail: Magazin (Phase 4) ===================== */

.wtb-job--magazine {
	/* Breite kommt von .wtb-job (Einstellung Maximale Breite). */
	padding-left: var( --wtb-container-padding-extra, 0 );
	padding-right: var( --wtb-container-padding-extra, 0 );
}

.wtb-job__magazine-header {
	margin-bottom: 20px;
}

.wtb-job__magazine-eyebrow {
	margin: 0 0 8px;
	color: var( --wtb-primary );
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.wtb-job__magazine-hero {
	margin: 0 0 28px;
}

.wtb-job__magazine-hero-media {
	display: block;
	width: 100%;
	height: auto;
	max-height: 520px;
	object-fit: cover;
	border-radius: var( --wtb-radius, 10px );
}

.wtb-job__magazine-caption {
	margin: 10px 0 0;
	font-size: 14px;
	color: var( --wtb-muted, #5c626a );
}

.wtb-job__magazine-caption--solo {
	margin-bottom: 24px;
}

.wtb-job__magazine-content {
	margin-bottom: 36px;
}

@media ( min-width: 1100px ) {
	.wtb-job__magazine-content {
		column-count: 2;
		column-gap: 48px;
	}

	.wtb-job__magazine-content h2,
	.wtb-job__magazine-content h3,
	.wtb-job__magazine-content ul,
	.wtb-job__magazine-content ol,
	.wtb-job__magazine-content figure,
	.wtb-job__magazine-content blockquote {
		break-inside: avoid;
	}
}

.wtb-job__contact-card--banner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 24px;
	align-items: center;
	background: var( --wtb-bg-soft, #f6faf2 );
	border-radius: var( --wtb-radius, 10px );
	padding: 24px;
	margin-bottom: 32px;
	box-shadow: none;
	border: 0;
	position: static;
}

.wtb-job__contact-banner-photo {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	flex-shrink: 0;
}

.wtb-job__contact-banner-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.wtb-job__contact-banner-text .wtb-job__contact-name {
	margin: 0;
}

.wtb-job__contact-banner-text .wtb-job__contact-position {
	margin: 4px 0 8px;
}

.wtb-job__contact-banner-links {
	text-align: right;
}

.wtb-job__contact-banner-links .wtb-job__contact-line {
	margin: 0 0 6px;
}

.wtb-job__magazine-form {
	border: 1px solid var( --wtb-border, #e2e5e9 );
	border-radius: var( --wtb-radius, 10px );
	padding: 28px;
	margin-bottom: 32px;
	background: var( --wtb-bg-soft, #f6faf2 );
}

@media ( max-width: 768px ) {
	.wtb-job__contact-card--banner {
		grid-template-columns: 1fr;
		text-align: left;
	}

	.wtb-job__contact-banner-links {
		text-align: left;
	}
}

/* ===================== Übersicht: Raster + Kompakt (Phase 4) ===================== */

.wtb-jobs--grid {
	display: grid;
	grid-template-columns: repeat( var( --wtb-grid-cols, 3 ), minmax( 0, 1fr ) );
	gap: 24px;
	align-items: stretch;
}

.wtb-job-card--grid {
	display: flex;
	flex-direction: column;
	background: var( --wtb-bg-soft, #f6faf2 );
	border-radius: var( --wtb-radius, 10px );
	overflow: hidden;
	border: 1px solid var( --wtb-border, #e2e5e9 );
}

.wtb-job-card--grid .wtb-job-card__media {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.wtb-job-card--grid .wtb-job-card__media img,
.wtb-job-card--grid .wtb-job-card__image-placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.wtb-job-card--grid .wtb-job-card__content {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 18px;
	gap: 10px;
}

.wtb-job-card--grid .wtb-job-card__btn {
	margin-top: auto;
	align-self: flex-start;
}

.wtb-jobs--compact {
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 1px solid var( --wtb-border, #e2e5e9 );
	border-radius: var( --wtb-radius, 10px );
	overflow: hidden;
}

.wtb-job-card--compact {
	display: grid;
	grid-template-columns: minmax( 0, 1.4fr ) minmax( 0, 1fr ) auto;
	gap: 16px;
	align-items: center;
	padding: 14px 18px;
	border-bottom: 1px solid var( --wtb-border, #e2e5e9 );
	background: transparent;
	box-shadow: none;
}

.wtb-job-card--compact:last-child {
	border-bottom: 0;
}

.wtb-job-card--compact .wtb-job-card__title {
	margin: 0;
	font-size: 16px;
}

.wtb-job-card--compact .wtb-job-card__meta--inline {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var( --wtb-muted, #5c626a );
	font-size: 13px;
}

.wtb-job-card--compact .wtb-job-card__btn {
	white-space: nowrap;
}

.wtb-jobs__filter {
	margin-bottom: 20px;
}

.wtb-jobs__filter-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.wtb-jobs__filter-link {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid var( --wtb-border, #e2e5e9 );
	color: var( --wtb-text, #3F444B );
	text-decoration: none;
	font-size: 13px;
}

.wtb-jobs__filter-link.is-active,
.wtb-jobs__filter-link:hover,
.wtb-jobs__filter-link:focus {
	border-color: var( --wtb-primary );
	color: var( --wtb-primary );
	outline: none;
}

.wtb-jobs__filter-link:focus-visible {
	outline: 2px solid var( --wtb-primary );
	outline-offset: 2px;
}

.wtb-jobs__pagination {
	margin-top: 28px;
}

.wtb-jobs__pagination .page-numbers {
	display: inline-flex;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.wtb-jobs__pagination a,
.wtb-jobs__pagination span {
	display: inline-block;
	min-width: 36px;
	padding: 6px 10px;
	text-align: center;
	border: 1px solid var( --wtb-border, #e2e5e9 );
	border-radius: var( --wtb-radius, 10px );
	text-decoration: none;
	color: var( --wtb-text, #3F444B );
}

.wtb-jobs__pagination .current {
	background: var( --wtb-primary );
	border-color: var( --wtb-primary );
	color: #fff;
}

@media ( max-width: 900px ) {
	.wtb-jobs--grid {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}
}

@media ( max-width: 600px ) {
	.wtb-jobs--grid {
		grid-template-columns: 1fr;
	}

	.wtb-job-card--compact {
		grid-template-columns: 1fr;
		gap: 8px;
	}
}