/**
 * Akademische Jobs — Custom Styles
 * Design System: "The Academic Curator"
 *
 * Keine 1px Borders. Tiefe durch Hintergrundfarb-Abstufungen.
 * Newsreader (Serif) für Headlines, Inter (Sans) für Body.
 */

/* ═══════════════════════════════════════════════════════
   CSS Custom Properties (ergänzend zu theme.json)
   ═══════════════════════════════════════════════════════ */

:root {
  --akjobs-shadow-sm: 0 1px 3px rgba(26, 28, 30, 0.04);
  --akjobs-shadow-md: 0 4px 12px rgba(26, 28, 30, 0.06);
  --akjobs-shadow-lg: 0 20px 40px rgba(26, 28, 30, 0.06);
  --akjobs-transition: 200ms ease-in-out;
  --akjobs-radius-sm: 0.25rem;
  --akjobs-radius-md: 0.375rem;
  --akjobs-radius-lg: 0.5rem;
  --akjobs-radius-xl: 0.75rem;
}


/* ═══════════════════════════════════════════════════════
   Glassmorphism Header
   ═══════════════════════════════════════════════════════ */

.glass-header {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: var(--akjobs-shadow-sm);
  z-index: 100;
}

/* ── Nav Submenu (Sub-Items unter "Jobs") — CI-Styling ── */
.glass-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
  background: white;
  border: 1px solid rgba(0, 31, 66, 0.08);
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0, 31, 66, 0.12);
  padding: 0.5rem 0;
  min-width: 260px;
  z-index: 101;
}
.glass-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item {
  width: 100%;
}
.glass-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: block;
  width: 100%;
  padding: 0.55rem 1rem;
  font-family: var(--wp--preset--font-family--inter, sans-serif);
  font-style: normal;
  font-size: 0.95rem;
  color: var(--wp--preset--color--primary, #001e40);
  white-space: nowrap;
}
.glass-header .wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: rgba(0, 31, 66, 0.06);
}
/* Submenu-Pfeil (Chevron nach unten) am Parent-Item */
.glass-header .wp-block-navigation .has-child > .wp-block-navigation-item__content::after {
  content: " ▾";
  font-size: 0.8em;
  opacity: 0.6;
}

/* Header: Logo + Nav vertikal zentrieren */
.glass-header .is-content-justification-space-between.is-nowrap {
  align-items: center !important;
}
.glass-header .akjobs-nav {
  display: flex;
  align-items: center;
}
.glass-header .akjobs-nav-list {
  align-items: center;
}

/* ── Klassisches Hauptmenue (wp_nav_menu) Submenu-Dropdown ── */
.akjobs-nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2rem;
}
.akjobs-nav-list > li {
  position: relative;
}
.akjobs-nav-list > li > a {
  display: inline-block;
  padding: 0.5rem 0;
  color: var(--wp--preset--color--primary, #001e40);
  text-decoration: none;
  font-family: var(--wp--preset--font-family--newsreader, serif);
  font-style: italic;
  font-size: 1.125rem;
}
/* Chevron an Items die Kinder haben — inline ohne line-box-Erweiterung */
.akjobs-nav-list > li.menu-item-has-children > a::after {
  content: " ▾";
  font-size: 0.7em;
  opacity: 0.6;
  margin-left: 0.2rem;
  line-height: 0;
  vertical-align: middle;
}
/* Sub-Menu-Container (nested <ul class="sub-menu">) */
.akjobs-nav-list .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 280px;
  background: white;
  border: 1px solid rgba(0, 31, 66, 0.08);
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0, 31, 66, 0.12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.15s, transform 0.15s, visibility 0.15s;
  z-index: 101;
}
.akjobs-nav-list > li.menu-item-has-children:hover > .sub-menu,
.akjobs-nav-list > li.menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.akjobs-nav-list .sub-menu li {
  list-style: none;
}
.akjobs-nav-list .sub-menu a {
  display: block;
  padding: 0.55rem 1rem;
  color: var(--wp--preset--color--primary, #001e40);
  text-decoration: none;
  font-family: var(--wp--preset--font-family--inter, sans-serif);
  font-style: normal;
  font-size: 0.95rem;
  white-space: nowrap;
}
.akjobs-nav-list .sub-menu a:hover {
  background: rgba(0, 31, 66, 0.06);
}

/* Mobile Burger-Menu: Sub-Menu als offene Liste (kein Hover-Dropdown) */
@media (max-width: 900px) {
  body.akjobs-menu-open .akjobs-nav-list .sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    min-width: 0;
    width: 100%;
  }
  /* Parent "Jobs" mit Sub-Menu: kompaktes padding damit Sub-Items direkt
     anschließen. Alle möglichen Spacer (margin/padding auf sub-menu, li, a)
     explizit auf 0 setzen — WP-Default-CSS fuegt sonst line-height-margin. */
  body.akjobs-menu-open .akjobs-nav-list > li.menu-item-has-children > a {
    padding: 0.75rem 0.75rem 0.25rem !important;
    margin: 0 !important;
  }
  body.akjobs-menu-open .akjobs-nav-list > li.menu-item-has-children {
    padding-bottom: 0 !important;
    margin: 0 !important;
  }
  body.akjobs-menu-open .akjobs-nav-list .sub-menu li {
    margin: 0 !important;
  }
  body.akjobs-menu-open .akjobs-nav-list .sub-menu a {
    margin: 0 !important;
    line-height: 1.4 !important;
  }
  body.akjobs-menu-open .akjobs-nav-list > li.menu-item-has-children > a::after {
    content: "";
  }
  /* Sub-Items: keine Trennlinien (alle Seiten, nicht nur last-child), kleinere
     Schrift, Inter statt Newsreader. Wichtig: ganz unten !important weil die
     aeussere Regel .akjobs-nav-list li einen border-bottom primary setzt. */
  body.akjobs-menu-open .akjobs-nav-list .sub-menu,
  body.akjobs-menu-open .akjobs-nav-list .sub-menu li,
  body.akjobs-menu-open .akjobs-nav-list .sub-menu li:last-child {
    border: none !important;
    border-bottom: none !important;
    border-top: none !important;
    padding-bottom: 0 !important;
  }
  body.akjobs-menu-open .akjobs-nav-list .sub-menu a {
    font-family: var(--wp--preset--font-family--inter, sans-serif) !important;
    font-style: normal !important;
    font-size: 0.95rem !important;
    font-weight: 400 !important;
    padding: 0.4rem 1rem !important;
    opacity: 0.85;
  }
  body.akjobs-menu-open .akjobs-nav-list .sub-menu a:hover {
    opacity: 1;
    background: rgba(0, 31, 66, 0.04);
  }
}

/* Header Logo */
.akjobs-header-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}
.akjobs-header-logo img {
  max-height: 60px;
  width: auto;
}

/* Footer Logo */
.akjobs-footer-logo {
  display: inline-block;
  text-decoration: none;
}
.akjobs-footer-logo img {
  max-height: 80px;
  width: auto;
}

/* Footer Social Links */
.akjobs-footer-social {
  display: flex;
  gap: 1rem;
  margin-top: 0.5rem;
}
.akjobs-footer-social a {
  display: inline-flex;
  color: var(--wp--preset--color--outline-variant, #c3c6d1);
  text-decoration: none;
  transition: color 0.15s ease;
}
.akjobs-footer-social a svg {
  width: 28px;
  height: 28px;
}
.akjobs-footer-social a:hover,
.akjobs-footer-social a:focus-visible {
  color: var(--wp--preset--color--tertiary-fixed, #ffdea5);
}

/* Footer Navigation */
.akjobs-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.akjobs-footer-nav a {
  color: var(--wp--preset--color--outline-variant, #c3c6d1);
  text-decoration: none;
  transition: color 0.15s ease;
}
.akjobs-footer-nav a:hover,
.akjobs-footer-nav a:focus-visible {
  color: var(--wp--preset--color--tertiary-fixed, #ffdea5);
}

/* Kein Abstand zwischen Header und erstem Content-Block (Hero) */
.wp-site-blocks > .wp-block-group > main > .wp-block-cover:first-child,
.wp-site-blocks > main > .wp-block-cover:first-child,
main.wp-block-group > .wp-block-cover:first-child {
  margin-top: 0 !important;
}

/* Allgemein: Kein oberer Abstand nach sticky Header */
.wp-site-blocks > *:first-child,
.wp-site-blocks > .wp-block-template-part + * {
  margin-top: 0 !important;
}

/* Ratgeber-Single: Related-Band buendig an den Footer (globalen Block-Gap vor dem Footer entfernen) */
.single-ratgeber .wp-site-blocks > footer.wp-block-template-part {
  margin-top: 0 !important;
}

/* Sticky Footer: bei kurzen Seiten bleibt der Footer unten am Viewport-Rand */
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body > .wp-site-blocks {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
body > .wp-site-blocks > main {
  flex: 1 0 auto;
}

/* ═══════════════════════════════════════════════════════
   Institution-Detailseite: Logo oben rechts neben Titel
   ═══════════════════════════════════════════════════════ */
.akjobs-inst-header {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.5rem;
}
.akjobs-inst-header__text {
  flex: 1 1 auto;
  min-width: 0;
}
.akjobs-inst-header__text h1 {
  margin-top: 0;
}
.akjobs-inst-header__logo {
  flex: 0 0 auto;
  width: 140px;
  max-width: 35%;
  background: #ffffff;
  border-radius: var(--akjobs-radius-lg);
  box-shadow: var(--akjobs-shadow-sm);
  padding: 1rem;
  box-sizing: border-box;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0;
}
.akjobs-inst-header__logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
/* Featured-Image-Block rendert gar nichts wenn kein Thumbnail gesetzt —
   damit kein leerer Platzhalter nebenan steht: Wrapper nur anzeigen
   wenn ein Bild vorhanden ist. */
.akjobs-inst-header__logo:not(:has(img)) {
  display: none;
}
@media (max-width: 640px) {
  .akjobs-inst-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
  }
  .akjobs-inst-header__logo {
    width: 110px;
    max-width: 110px;
    padding: 0.75rem;
    align-self: center;
  }
}


/* ═══════════════════════════════════════════════════════
   Navigation: Aktiver Menüpunkt (Gold Underline)
   ═══════════════════════════════════════════════════════ */

/* Aktiver Link: Gold-Unterstrich + Primary-Farbe */
.wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current="page"],
.wp-block-navigation .wp-block-navigation-item.is-active > .wp-block-navigation-item__content,
.wp-block-navigation-item > a.wp-block-navigation-item__content[aria-current="page"] {
  color: var(--wp--preset--color--primary) !important;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed);
  padding-bottom: 0.25rem;
}

/* Hover auf Nav-Links */
.wp-block-navigation .wp-block-navigation-item > .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--primary) !important;
  transition: color var(--akjobs-transition);
}

/* Fallback: JS-basierte aktive Markierung (für wp_navigation ohne current-menu-item) */
.wp-block-navigation-item--active > .wp-block-navigation-item__content {
  color: var(--wp--preset--color--primary) !important;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed) !important;
  padding-bottom: 0.25rem;
}

/* Footer-Nav auf dunkelblauem Hintergrund: aktiver Link Gold statt Primary
   (Primary wäre sonst blau-auf-blau und unlesbar — siehe /kontakt/ Bug 20.04.) */
.has-primary-background-color .wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.has-primary-background-color .wp-block-navigation .wp-block-navigation-item.current_page_item > .wp-block-navigation-item__content,
.has-primary-background-color .wp-block-navigation .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current="page"],
.has-primary-background-color .wp-block-navigation .wp-block-navigation-item.is-active > .wp-block-navigation-item__content,
.has-primary-background-color .wp-block-navigation-item--active > .wp-block-navigation-item__content {
  color: var(--wp--preset--color--tertiary-fixed) !important;
}

/* Hover im Footer: ebenfalls Gold statt Primary */
.has-primary-background-color .wp-block-navigation .wp-block-navigation-item > .wp-block-navigation-item__content:hover {
  color: var(--wp--preset--color--tertiary-fixed) !important;
}

/* Klassisches Menü (akjobs-nav): aktiver Menüpunkt + Unterseiten.
   Transparent-Border auf allen Top-Level-Items (gleiche Höhe), gefärbt nur bei active.
   .glass-header-Prefix fuer hoehere Spezifitaet gegen WP-Core-Styles. */
.glass-header .akjobs-nav-list > li > a {
  border-bottom: 2px solid transparent !important;
  padding-bottom: 0.25rem !important;
}
.glass-header .akjobs-nav-list > li.current-menu-item > a,
.glass-header .akjobs-nav-list > li.current_page_item > a,
.glass-header .akjobs-nav-list > li.current-menu-ancestor > a {
  color: var(--wp--preset--color--primary) !important;
  border-bottom-color: var(--wp--preset--color--tertiary-fixed) !important;
}


/* ═══════════════════════════════════════════════════════
   Klassisches WP-Menü (Shortcode [akjobs_nav])
   ═══════════════════════════════════════════════════════ */

.akjobs-nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2rem;
  align-items: center;
}

.akjobs-nav-list li a {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-size: 1.125rem;
  color: var(--wp--preset--color--on-surface-variant);
  text-decoration: none;
  transition: color var(--akjobs-transition);
}

.akjobs-nav-list li a:hover {
  color: var(--wp--preset--color--primary);
}

/* Aktiver Menüpunkt: Gold-Unterstrich */
.akjobs-nav-list li.current-menu-item a,
.akjobs-nav-list li.current_page_item a,
.akjobs-nav-list li.current-menu-ancestor a {
  color: var(--wp--preset--color--primary);
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed);
  padding-bottom: 0.25rem;
}

/* Burger-Button (nur mobil sichtbar) */
.akjobs-burger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem;
  color: var(--wp--preset--color--primary);
  font-size: 1.5rem;
  line-height: 1;
}

/* Desktop: Close-Button ausblenden */
.akjobs-burger-close {
  display: none;
}

@media (max-width: 768px) {
  .akjobs-burger {
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 101;
    color: var(--wp--preset--color--primary) !important;
  }
  .akjobs-burger-close {
    display: block;
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--wp--preset--color--primary);
    padding: 0.5rem;
    line-height: 1;
  }
  .akjobs-nav {
    position: relative;
  }
  .akjobs-nav-list {
    display: none;
    flex-direction: column;
    gap: 0.75rem;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffff !important;
    padding: 5rem 2rem 2rem;
    margin: 0;
    list-style: none;
    z-index: 99999;
    align-items: center;
    justify-content: flex-start;
  }
  .akjobs-nav-list.is-open {
    display: flex;
  }
  body.akjobs-menu-open .glass-header {
    background: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body.akjobs-menu-open {
    overflow: hidden;
  }
  .akjobs-nav-list.is-open ~ .akjobs-burger,
  .akjobs-nav.is-open .akjobs-burger {
    z-index: 100000;
  }
  /* Burger-Icon (☰) verstecken wenn Menu offen — sonst ueberlappt es die Sub-Items */
  body.akjobs-menu-open .akjobs-burger {
    display: none !important;
  }
  /* Top-Level-Items: Trennlinie in Primary-Dunkelblau. Nutze > Combinator,
     damit Sub-Menu-Items NICHT erfasst werden. */
  .akjobs-nav-list > li {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid var(--wp--preset--color--primary);
    padding-bottom: 0.75rem;
  }
  .akjobs-nav-list > li:last-child {
    border-bottom: none;
  }
  .akjobs-nav-list > li > a {
    display: block;
    padding: 0.75rem;
    font-size: 1.25rem;
    color: var(--wp--preset--color--primary);
    text-decoration: none;
  }
  /* Sub-Menu-Items: niemals Trennlinien, auch ohne body-class-Abhaengigkeit */
  .akjobs-nav-list .sub-menu,
  .akjobs-nav-list .sub-menu li,
  .akjobs-nav-list .sub-menu li:last-child {
    border: 0 !important;
    padding-bottom: 0 !important;
  }
  .akjobs-nav-list .sub-menu li a {
    border: 0 !important;
  }
}


/* ═══════════════════════════════════════════════════════
   Hero Section
   ═══════════════════════════════════════════════════════ */

.hero-section .wp-block-cover__inner-container {
  max-width: 1400px;
  margin: 0 auto;
}

.hero-search-bar {
  box-shadow: var(--akjobs-shadow-lg);
  max-width: 900px;
}

.hero-search-bar .job_filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  width: 100%;
}

.hero-search-bar .search_jobs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  width: 100%;
}

.hero-search-bar input[type="text"],
.hero-search-bar select {
  border: none;
  background: transparent;
  padding: 1rem 1.5rem;
  font-size: 1rem;
  flex: 1;
  min-width: 150px;
}

.hero-search-bar input[type="text"]:focus,
.hero-search-bar select:focus {
  outline: none;
  background: var(--wp--preset--color--surface);
}


/* ═══════════════════════════════════════════════════════
   Editorial Underline (Gold Accent)
   ═══════════════════════════════════════════════════════ */

.editorial-underline {
  position: relative;
  text-decoration: none;
}

.editorial-underline::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--wp--preset--color--tertiary-fixed);
}


/* ═══════════════════════════════════════════════════════
   Job Cards (WP Job Manager Override)
   ═══════════════════════════════════════════════════════ */

.job_listings {
  list-style: none;
  padding: 0;
  margin: 0;
}

.job_listings .job_listing {
  background: var(--wp--preset--color--surface-container-lowest);
  border-radius: var(--akjobs-radius-xl);
  padding: 1.5rem 2rem;
  margin-bottom: 1rem;
  transition: box-shadow var(--akjobs-transition);
  border: none;
  box-shadow: var(--akjobs-shadow-sm);
}

.job_listings .job_listing:hover {
  box-shadow: var(--akjobs-shadow-md);
}

.job_listings .job_listing a {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}

.job_listings .job_listing .position h3 {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--wp--preset--color--primary);
  margin: 0 0 0.25rem 0;
}

.job_listings .job_listing .company strong {
  font-weight: 600;
  color: var(--wp--preset--color--on-surface);
}

.job_listings .job_listing .location,
.job_listings .job_listing .job-type {
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface-variant);
}

.job_listings .job_listing .meta {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--wp--preset--color--outline);
}

/* Date Badge */
.job_listings .job_listing .date time {
  font-size: 0.75rem;
  color: var(--wp--preset--color--outline);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Category Badge */
.job_listings .job_listing .job_listing-badges .job-type {
  background: var(--wp--preset--color--tertiary-fixed);
  color: var(--wp--preset--color--tertiary);
  padding: 0.25rem 0.75rem;
  border-radius: var(--akjobs-radius-sm);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}


/* ═══════════════════════════════════════════════════════
   Single Job Detail
   ═══════════════════════════════════════════════════════ */

.single-job_listing .job-detail-sidebar {
  background: var(--wp--preset--color--surface-container-low);
  border-radius: var(--akjobs-radius-xl);
  padding: 2rem;
  position: sticky;
  top: 6rem;
}

/* Logo in Eckdaten-Box — weiße CI-Box (analog Institution-Header) */
.akjobs-details-logo {
  margin-bottom: 1.5rem;
  background: #ffffff;
  border-radius: var(--akjobs-radius-lg);
  box-shadow: var(--akjobs-shadow-sm);
  padding: 1rem;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  overflow: hidden;
}

.akjobs-company-logo {
  max-width: 100%;
  max-height: 80px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Placeholder ohne eigenen Hintergrund — erbt die weiße Box */
.akjobs-logo-placeholder {
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
}

/* Eckdaten: Abstand unter Überschrift */
.job-detail-sidebar h3 {
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wp--preset--color--outline-variant);
}

/* Hochschulen-Seite: Stat-Boxen einheitlich */
.wp-block-columns:has(.wp-block-group[style*="border-radius"]) .wp-block-group > p:first-child {
  font-family: var(--wp--preset--font-family--newsreader) !important;
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  font-style: italic !important;
  margin-bottom: 0.25rem;
}

/* Abstand unter den Stat-Boxen */
.wp-block-columns:has(.wp-block-group[style*="border-radius"]) {
  margin-bottom: var(--wp--preset--spacing--60) !important;
}

/* Eckdaten Definition List */
.akjobs-details {
  margin: 0;
}

.akjobs-details dt {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--wp--preset--color--on-surface-variant);
  margin-bottom: 0.25rem;
  margin-top: 1.25rem;
}

.akjobs-details dt:first-child {
  margin-top: 0;
}

.akjobs-details dd {
  font-size: 1rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  margin-bottom: 0;
  margin-left: 0;
}

.akjobs-details dd a {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}

.akjobs-details dd a:hover {
  text-decoration: underline;
}

/* Kontextueller W-Besoldung-Ratgeber-Link: nicht fett (dd-Werte sind sonst 700) */
.akjobs-details dd a.akjobs-salary-ratgeber-link {
  font-weight: 400;
}

/* Bewerbungs-Button oben rechts über dem Job (nicht in der Sidebar) */
.akjobs-apply-top {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1.5rem;
}

.akjobs-apply-top .application-button {
  display: inline-block;
  padding: 1rem 2rem;
}
@media (max-width: 781px) {
  .akjobs-apply-top .application-button {
    display: block !important;
    width: 100% !important;
    text-align: center;
  }
}

/* Hochschulen-Seite: Boxen gleiche Höhe */
.wp-block-columns:has(.wp-block-group[style*="border-radius"]) {
  align-items: stretch;
}

.wp-block-columns:has(.wp-block-group[style*="border-radius"]) > .wp-block-column > .wp-block-group {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* WP Job Manager Standard-Meta ausblenden (Fallback) */
.single_job_listing .job_listing_meta,
.single_job_listing .job-manager-company,
.job_listing-company,
.job-overview,
ul.job-listing-meta,
.job-manager-application-wrapper,
.single-job_listing .wp-post-image {
  display: none !important;
}

/* Trennlinie unter dem Job-Titel */
.single-job_listing .wp-block-post-title,
.single_job_listing h1.entry-title,
.single-job_listing h1.wp-block-heading {
  padding-bottom: 1.5rem;
  border-bottom: 3px solid var(--wp--preset--color--primary);
  margin-bottom: 2rem;
}

.single-job_listing .job-description {
  line-height: 1.8;
}

.single-job_listing .job-description h3 {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--wp--preset--color--primary);
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}

.single-job_listing .job-description ul {
  padding-left: 1.5rem;
  margin-bottom: 1.5rem;
}

.single-job_listing .job-description li {
  margin-bottom: 0.5rem;
  color: var(--wp--preset--color--on-surface-variant);
}

.single-job_listing .job-description strong,
.single-job_listing .job-description b {
  font-weight: 700;
  color: var(--wp--preset--color--on-surface);
}

/* PDF Viewer */
.akjobs-pdf-viewer {
  margin-bottom: 1.5rem;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--wp--preset--color--surface-container-low);
  min-height: 600px;
}

.akjobs-pdf-link {
  margin-bottom: 1.5rem;
}

.akjobs-pdf-link a {
  display: inline-block;
  padding: 0.625rem 1.25rem;
  background: var(--wp--preset--color--surface-container-low);
  color: var(--wp--preset--color--primary);
  border-radius: 0.375rem;
  text-decoration: none;
  font-weight: 500;
  transition: background 0.2s;
}

.akjobs-pdf-link a:hover {
  background: var(--wp--preset--color--outline-variant);
}

.akjobs-pdf-text-fallback {
  margin-top: 1rem;
  border-top: 1px solid var(--wp--preset--color--outline-variant);
  padding-top: 1rem;
}

.akjobs-pdf-text-fallback summary {
  cursor: pointer;
  color: var(--wp--preset--color--on-surface-variant);
  font-size: 0.875rem;
  padding: 0.5rem 0;
}

/* Apply Button */
.single-job_listing .application-button {
  display: block;
  width: 100%;
  background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container));
  color: var(--wp--preset--color--on-primary);
  text-align: center;
  padding: 1.25rem 2rem;
  border-radius: var(--akjobs-radius-md);
  font-weight: 700;
  font-size: 1.125rem;
  text-decoration: none;
  box-shadow: var(--akjobs-shadow-md);
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
}

.single-job_listing .application-button:hover {
  box-shadow: var(--akjobs-shadow-lg);
  transform: translateY(-1px);
}

/* Button-Gruppe: Standard = untereinander (volle Breite) */
.akjobs-button-group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* Obere Button-Gruppe (neben Titel): nebeneinander, gleiche Höhe */
.is-content-justification-space-between .akjobs-button-group {
  flex-direction: row;
  align-items: stretch;
}
.is-content-justification-space-between .akjobs-button-group .application-button,
.is-content-justification-space-between .akjobs-button-group .source-button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  flex: 0 0 auto;
  margin-top: 0;
  white-space: nowrap;
}

/* Source Button (Gold) */
.single-job_listing .source-button {
  display: block;
  width: 100%;
  background: var(--wp--preset--color--tertiary-fixed);
  color: var(--wp--preset--color--primary);
  text-align: center;
  padding: 1.25rem 2rem;
  border-radius: var(--akjobs-radius-md);
  font-weight: 700;
  font-size: 1.125rem;
  text-decoration: none;
  box-shadow: var(--akjobs-shadow-md);
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
}

.single-job_listing .source-button:hover {
  box-shadow: var(--akjobs-shadow-lg);
  transform: translateY(-1px);
}


/* ═══════════════════════════════════════════════════════
   Hochschul-Cards
   ═══════════════════════════════════════════════════════ */

/* Hochschul-Verzeichnis: graue Karten auf noch hellerem Seitenhintergrund */
.page-template-page-hochschulen,
body.page-template-page-hochschulen main {
  background: #fafafa;
}

.institution-card {
  background: var(--wp--preset--color--surface-container);
  border-radius: var(--akjobs-radius-xl);
  padding: 1.5rem 1.5rem 5rem;  /* rechts unten: Platz für absolut positionierten Footer */
  box-shadow: var(--akjobs-shadow-sm);
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 320px;
  text-decoration: none;
  position: relative;
}

.institution-card:hover {
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-2px);
}

.institution-card .institution-logo {
  background: #ffffff;
  border-radius: 0.5rem;
  padding: 0.75rem;
  width: 70%;
  max-width: 160px;
  height: 90px;
  margin: 0 auto 1.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.institution-card .institution-logo img {
  max-width: 100%;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.institution-card .institution-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.institution-card .institution-short-name {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--wp--preset--color--primary);
  line-height: 1.3;
  margin-bottom: 0.2rem;
}

.institution-card .institution-full-name {
  font-size: 0.825rem;
  color: var(--wp--preset--color--on-surface);
  line-height: 1.4;
}

.institution-card .institution-location,
.institution-card .institution-type {
  font-size: 0.78rem;
  color: var(--wp--preset--color--on-surface-variant);
  line-height: 1.4;
}

.institution-card .institution-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: 1.5rem;
}

.institution-card .job-count-badge {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  white-space: nowrap;
}

.institution-card .institution-arrow {
  color: var(--wp--preset--color--primary);
  font-size: 1.1rem;
  font-weight: 700;
  transition: transform var(--akjobs-transition);
}

.institution-card:hover .institution-arrow {
  transform: translateX(3px);
}

/* ═══════════════════════════════════════════════════════
   Stat-Boxes (akjobs_stat_boxes Shortcode)
   ═══════════════════════════════════════════════════════ */
.akjobs-stat-boxes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: 1.5rem 0 2rem;
}

.akjobs-stat-box {
  border-radius: 0.75rem;
  padding: 1.75rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 140px;
}

.akjobs-stat-box--primary {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
}

/* Mittlere Box: cremefarben/akademika-gelb — hell und lesbar */
.akjobs-stat-box--tertiary {
  background: #f5e9ca;
  color: var(--wp--preset--color--primary);
}

.akjobs-stat-box--secondary {
  background: var(--wp--preset--color--surface-container-high);
  color: var(--wp--preset--color--on-surface);
}

.akjobs-stat-number {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-weight: 700;
  font-size: 2.75rem;
  line-height: 1;
  letter-spacing: -0.02em;
}

.akjobs-stat-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.9;
}

@media (max-width: 640px) {
  .akjobs-stat-boxes {
    grid-template-columns: 1fr;
  }
}

/* Institutions Grid */
.akjobs-institutions-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  grid-auto-rows: 1fr;
  column-gap: 1.5rem;
  row-gap: 1.5rem;
  margin-top: 1.5rem;
}

.akjobs-institutions-grid .institution-card {
  margin: 0;
  align-self: stretch;
}

.akjobs-institutions-grid .institution-card {
  display: block;
  text-decoration: none;
  color: inherit;
}

@media (max-width: 640px) {
  .akjobs-institutions-grid {
    grid-template-columns: 1fr;
  }
}

.akjobs-institutions-section-heading {
  font-family: "Newsreader", serif;
  font-style: italic;
  font-size: 1.75rem;
  font-weight: 600;
  margin: 2.5rem 0 0.5rem;
  color: var(--wp--preset--color--primary, #001e40);
}

.akjobs-institutions-section-heading:first-of-type {
  margin-top: 0;
}

.akjobs-institutions-section-count {
  font-style: normal;
  font-weight: 400;
  font-size: 1.125rem;
  color: var(--wp--preset--color--on-surface-variant, #5b6573);
  margin-left: 0.25rem;
}


/* ═══════════════════════════════════════════════════════
   Institution Job Cards
   ═══════════════════════════════════════════════════════ */

.akjobs-institution-jobs {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* ═══════════════════════════════════════════════════════
   Job Cards (wiederverwendbar: Hochschulseiten, /jobs/, Startseite)
   ═══════════════════════════════════════════════════════ */

.akjobs-job-list {
  display: grid;
  gap: 1rem;
}

.akjobs-job-card {
  position: relative;
  background: var(--wp--preset--color--surface-container-lowest);
  border-radius: var(--akjobs-radius-xl);
  padding: 1.5rem 2rem;
  box-shadow: var(--akjobs-shadow-sm);
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
  cursor: pointer;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}

/* Mobile: Card-Innen-Padding reduzieren — bei 380px Viewport sind 32px LR
   zu viel und der innere Inhalt wirkt eingequetscht / Badges brechen schlecht
   um (Beobachtung Single-Institution-Page Screenshot 0074). */
@media (max-width: 640px) {
  .akjobs-job-card {
    padding: 1.25rem 1rem;
  }
}

/* Single-Institution-Page (single-institution.html): <main> hat hardcoded
   padding 2rem LR — auf Mobile ueberbreit + visueller Konflikt mit den
   Cards. Auf Mobile auf 1rem reduzieren wie auf Hub-Pages (.akjobs-hub). */
@media (max-width: 640px) {
  .single-institution main.wp-block-group {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* Stretched-Link Pattern: Title-Link spannt sich per ::after über die ganze
   Card (via position:absolute relativ zum .akjobs-job-card, das position:
   relative ist). Ersetzt den früheren overlay-<a>, der als Inline-Element
   im article wpautop-Artefakte auslöste. Title-a selbst bleibt static —
   sonst würde das ::after sich nur an der title-a statt an der Card
   ausrichten. */
.akjobs-job-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* "Details ansehen"-Link muss über dem stretched-link liegen, damit es
   separat klickbar bleibt (gleicher Ziel-URL, aber bewusst eigener Trigger). */
.akjobs-job-card__link {
  position: relative;
  z-index: 2;
}

.akjobs-job-card:hover {
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-1px);
}

.akjobs-job-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.akjobs-job-card__category {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--wp--preset--color--tertiary-fixed);
  color: var(--wp--preset--color--tertiary);
  padding: 0.2rem 0.6rem;
  border-radius: var(--akjobs-radius-sm);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.akjobs-job-card__body {
  display: flex;
  gap: 1rem;
  /* align-items: flex-start verhindert, dass Chrome/Edge die Flex-Kinder
     (content + logo-wrap) auf gleiche Höhe stretchen. Ohne diese Zeile
     rendert Chromium/Blink das Default-`stretch`-Verhalten anders als
     Firefox — konkret so, dass die content-Spalte bei Cards mit kurzem
     Titel riesigen Leerraum zwischen Badges und Details-Link zeigt. */
  align-items: flex-start;
}

/* Mobile: Logo zwischen Titel und Company, Desktop: Logo rechts */
.akjobs-job-card__logo-mobile {
  display: none;
}

@media (max-width: 768px) {
  .akjobs-job-card__logo-mobile {
    display: block !important;
    margin-bottom: 0.5rem;
  }

  .akjobs-job-card__logo-wrap {
    display: none !important;
  }
}

.akjobs-job-card__content {
  flex: 1;
  min-width: 0;
}

.akjobs-job-card__date {
  display: block;
  text-align: right;
  font-size: 0.75rem;
  color: var(--wp--preset--color--outline);
  margin-bottom: 0.5rem;
}

.akjobs-job-card__logo-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.akjobs-job-card__logo {
  max-width: 80px;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.akjobs-job-card__title {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  font-weight: 700;
  font-size: 1.25rem;
  margin: 0 0 0.75rem 0;
  line-height: 1.35;
}

.akjobs-job-card__title a {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}

.akjobs-job-card__title a:hover {
  text-decoration: underline;
}

/* Metadaten-Badges */
.akjobs-job-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.akjobs-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--wp--preset--color--primary);
  color: #ffffff;
  padding: 0.25rem 0.65rem;
  border-radius: var(--akjobs-radius-md);
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
  /* Explizite line-height + min-height, damit Chrome/Blink alle Badges auf
     exakt gleiche Höhe rendert — egal ob mit Icon (SVG mit vertical-align:
     middle beeinflusst die Baseline) oder ohne Icon wie beim Fachgebiet-
     Badge. Firefox rendert ohne min-height korrekt, Chrome nicht. */
  line-height: 1;
  min-height: calc(0.75rem + 0.5rem + 2px);
}

.akjobs-badge--fachgebiet {
  background: var(--wp--preset--color--surface-container-high);
  color: var(--wp--preset--color--on-surface-variant);
}

.akjobs-badge--fachgebiet-more {
  background: var(--wp--preset--color--surface-container-high);
  color: var(--wp--preset--color--on-surface-variant);
  opacity: 0.7;
  font-style: italic;
}

/* SVG-Icons in Badges */
.akjobs-icon {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

.akjobs-icon svg {
  width: 0.85em;
  height: 0.85em;
  vertical-align: middle;
}

.akjobs-badge .akjobs-icon svg path,
.akjobs-badge .akjobs-icon svg g path {
  fill: #ffffff;
}

.akjobs-badge--fachgebiet .akjobs-icon svg path,
.akjobs-badge--fachgebiet .akjobs-icon svg g path {
  fill: var(--wp--preset--color--on-surface-variant);
}

.akjobs-job-card__link {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed);
  padding-bottom: 0.125rem;
}

.akjobs-job-card__company {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface-variant);
  margin-bottom: 0.75rem;
  font-weight: 500;
}

.akjobs-job-card__company .akjobs-icon svg path,
.akjobs-job-card__company .akjobs-icon svg g path {
  fill: var(--wp--preset--color--on-surface-variant);
}

/* ═══════════════════════════════════════════════════════
   Seitlicher Filter auf /jobs/ Seite (Stitch-Design)
   ═══════════════════════════════════════════════════════ */

/* ── WPJM Standard-CSS Reset (überschreibt Plugin-Styles) ── */
div.job_listings[data-per_page] {
  border-top: none !important;
  margin-bottom: 0 !important;
}

div.job_listings[data-per_page] .job_filters {
  background: none !important;
  border: none !important;
  zoom: unset !important;
}

div.job_listings[data-per_page] .job_filters::after,
div.job_listings[data-per_page] .job_filters::before {
  display: none !important;
}

div.job_listings[data-per_page] ul.job_listings {
  border-top: none !important;
  margin-bottom: 0 !important;
}

div.job_listings[data-per_page] .load_more_jobs {
  border-bottom: none !important;
}

/* ── Layout: Flex (Filter links, Jobs rechts) ── */
div.job_listings[data-per_page] {
  display: flex !important;
  gap: 2rem;
  align-items: flex-start;
  flex-wrap: wrap;
}

/* Filter-Sidebar */
div.job_listings[data-per_page] > form.job_filters {
  position: sticky;
  top: 6rem;
  width: 280px !important;
  min-width: 280px;
  background: var(--wp--preset--color--surface-container-low) !important;
  border-radius: 0 var(--akjobs-radius-xl) var(--akjobs-radius-xl) 0;
  padding: 1.5rem !important;
  flex-shrink: 0;
  order: -1;
}

/* Filter-Sidebar: Titel-Bereich */
div.job_listings[data-per_page] > form.job_filters::before {
  content: "Filter";
  display: block;
  font-family: var(--wp--preset--font-family--newsreader);
  font-size: 1.5rem;
  font-style: italic;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  margin-bottom: 1.5rem;
}

/* Remote-Checkbox ausblenden (alle Varianten) */
.job_filters .filter_by_remote,
.job_filters p.filter_by_remote,
.job_filters label[for="remote_position"],
.job_filters input#remote_position,
.job_filters [class*="remote"],
.search_jobs > div:last-of-type:has(input[type="checkbox"]) {
  display: none !important;
}

/* Filter-Sidebar: Innenlayout */
div.job_listings[data-per_page] > form.job_filters .search_jobs {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0 !important;
}

div.job_listings[data-per_page] > form.job_filters .search_jobs .search_location {
  padding-left: 0 !important;
}

div.job_listings[data-per_page] > form.job_filters .search_jobs .search_keywords {
  padding-right: 0 !important;
}

div.job_listings[data-per_page] > form.job_filters .search_jobs > div {
  width: 100%;
}

/* Submit-Button im Filter-Sidebar stylen */
div.job_listings[data-per_page] > form.job_filters .search_submit {
  margin-top: 0 !important;
}

div.job_listings[data-per_page] > form.job_filters .search_submit input,
div.job_listings[data-per_page] > form.job_filters .search_submit button {
  width: 100%;
  background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container));
  color: #ffffff;
  border: none;
  border-radius: var(--akjobs-radius-md);
  padding: 0.75rem 1rem;
  font-weight: 700;
  font-size: 0.875rem;
  cursor: pointer;
  transition: opacity var(--akjobs-transition);
}

div.job_listings[data-per_page] > form.job_filters .search_submit input:hover,
div.job_listings[data-per_page] > form.job_filters .search_submit button:hover {
  opacity: 0.9;
}

/* Labels */
div.job_listings[data-per_page] > form.job_filters label {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.4rem;
}

/* Inputs & Selects — weiß hinterlegt */
div.job_listings[data-per_page] > form.job_filters input[type="text"],
div.job_listings[data-per_page] > form.job_filters select,
div.job_listings[data-per_page] > form.job_filters input[type="search"] {
  width: 100%;
  background: #ffffff;
  border: none;
  border-radius: var(--akjobs-radius-md);
  padding: 0.65rem 0.75rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface);
  font-family: var(--wp--preset--font-family--inter);
  transition: box-shadow var(--akjobs-transition);
}

div.job_listings[data-per_page] > form.job_filters input:focus,
div.job_listings[data-per_page] > form.job_filters select:focus {
  outline: 2px solid var(--wp--preset--color--primary-container);
  outline-offset: 1px;
}

/* Job-Listings rechts — volle Breite der rechten Spalte */
div.job_listings[data-per_page] > ul.job_listings {
  flex: 1;
  min-width: 0;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* "Weitere Jobangebote laden" — unter den Jobs, zentriert */
div.job_listings[data-per_page] > a.load_more_jobs,
div.job_listings[data-per_page] > .load_more_jobs {
  flex: 0 0 calc(100% - 280px - 2rem) !important;
  margin-left: auto !important;
  text-align: center !important;
  margin-top: 0.5rem;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  text-decoration: none !important;
  display: block !important;
}

div.job_listings[data-per_page] > a.load_more_jobs strong,
div.job_listings[data-per_page] > .load_more_jobs strong {
  display: inline-block;
  padding: 0.75rem 2.5rem;
  background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container));
  color: #ffffff;
  border-radius: var(--akjobs-radius-md);
  font-weight: 700;
  font-size: 0.875rem;
  transition: opacity var(--akjobs-transition);
}

div.job_listings[data-per_page] > a.load_more_jobs:hover strong {
  opacity: 0.9;
}

div.job_listings[data-per_page] > a.load_more_jobs:hover {
  opacity: 1;
}

/* WPJM-Standard ausblenden (RSS-Link, Filter-Tags) */
div.job_listings[data-per_page] .showing_jobs,
div.job_listings[data-per_page] .showing_applied_filters,
.job_filters .showing_jobs,
.showing_jobs {
  display: none !important;
}

div.job_listings[data-per_page] > noscript {
  display: none;
}

/* Loader */
div.job_listings[data-per_page] > .job_listings_loader {
  width: 100%;
  flex-basis: 100%;
  text-align: center;
}

/* Stellenart-Checkboxen: Ausklappbar als Accordion */
div.job_listings[data-per_page] > form.job_filters ul.job_types {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

div.job_listings[data-per_page] > form.job_filters ul.job_types.akjobs-expanded {
  max-height: 500px;
}

div.job_listings[data-per_page] > form.job_filters ul.job_types li {
  padding: 0;
  margin: 0;
}

div.job_listings[data-per_page] > form.job_filters ul.job_types li label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.5rem;
  border-radius: var(--akjobs-radius-sm);
  cursor: pointer;
  font-size: 0.8125rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--wp--preset--color--on-surface-variant);
  transition: background var(--akjobs-transition);
}

div.job_listings[data-per_page] > form.job_filters ul.job_types li label:hover {
  background: rgba(0, 30, 64, 0.05);
  color: var(--wp--preset--color--primary);
}

div.job_listings[data-per_page] > form.job_filters ul.job_types li input[type="checkbox"] {
  accent-color: var(--wp--preset--color--primary);
  width: 1rem;
  height: 1rem;
}

/* Stellenart-Bereich: Abstand zum vorherigen Filter */
div.job_listings[data-per_page] > form.job_filters .akjobs-filter-toggle,
div.job_listings[data-per_page] > form.job_filters ul.job_types {
  margin-top: 1.75rem;
}

div.job_listings[data-per_page] > form.job_filters ul.job_types {
  margin-top: 0.5rem;
}

/* Accordion Toggle-Button */
.akjobs-filter-toggle {
  display: block;
  width: 100%;
  background: #ffffff;
  border: none;
  border-radius: var(--akjobs-radius-md);
  padding: 0.65rem 2rem 0.65rem 0.75rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface);
  font-family: var(--wp--preset--font-family--inter);
  cursor: pointer;
  text-align: left;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23737780' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  transition: background-image 0.2s;
}

.akjobs-filter-toggle::after {
  display: none;
}

.akjobs-filter-toggle.akjobs-open {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23737780' d='M6 4l5 5H1z'/%3E%3C/svg%3E");
}

/* Ergebnis-Anzahl (als <li> in der Job-Liste) */
li.akjobs-results-count {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 1rem 0 !important;
  background: none !important;
  border: none !important;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface-variant);
  font-weight: 500;
}

.akjobs-filter-reset {
  display: block;
  width: 100%;
  margin-top: 1rem;
  padding: 0.5rem 0.75rem;
  background: none;
  border: 1px solid var(--wp--preset--color--outline-variant);
  border-radius: var(--akjobs-radius-md);
  color: var(--wp--preset--color--on-surface-variant);
  font-size: 0.8125rem;
  font-family: var(--wp--preset--font-family--inter);
  cursor: pointer;
  transition: all var(--akjobs-transition);
}

.akjobs-filter-reset:hover {
  background: var(--wp--preset--color--surface-container-lowest);
  color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}

/* Mobile: Filter über Jobs, alles volle Breite */
@media (max-width: 781px) {
  div.job_listings[data-per_page] {
    flex-direction: column;
    align-items: stretch;
  }
  div.job_listings[data-per_page] > form.job_filters {
    position: static;
    width: 100% !important;
    min-width: 0;
    border-radius: var(--akjobs-radius-xl);
    box-sizing: border-box;
  }
  div.job_listings[data-per_page] > ul.job_listings {
    width: 100% !important;
    box-sizing: border-box;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  div.job_listings[data-per_page] ul.job_listings .akjobs-job-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  div.job_listings[data-per_page] > a.load_more_jobs,
  div.job_listings[data-per_page] > .load_more_jobs {
    flex: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    text-align: center !important;
    box-sizing: border-box;
  }
}

/* Extra-Filter-Gruppen (Sidebar) — gleichmäßiger Abstand */
.akjobs-filter-group {
  margin-top: 1.75rem;
}

.akjobs-filter-group label {
  display: flex !important;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.4rem;
}

.akjobs-filter-group .akjobs-icon svg path,
.akjobs-filter-group .akjobs-icon svg g path {
  fill: var(--wp--preset--color--primary);
}

.akjobs-filter-group select {
  width: 100%;
  background-color: #ffffff !important;
  border: none;
  border-radius: var(--akjobs-radius-md);
  padding: 0.65rem 2rem 0.65rem 0.75rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface);
  font-family: var(--wp--preset--font-family--inter);
  cursor: pointer;
  transition: box-shadow var(--akjobs-transition);
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23737780' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.75rem center !important;
}

.akjobs-filter-group select:focus {
  outline: 2px solid var(--wp--preset--color--primary-container);
  outline-offset: 1px;
}

/* ── Vergütungs-Mehrfachauswahl-Dropdown ── */
.akjobs-verguetung-dropdown {
  position: relative;
}

.akjobs-verguetung-toggle {
  width: 100%;
  background-color: #ffffff !important;
  border: none;
  border-radius: var(--akjobs-radius-md);
  padding: 0.65rem 2rem 0.65rem 0.75rem;
  font-size: 0.875rem;
  color: var(--wp--preset--color--on-surface);
  font-family: var(--wp--preset--font-family--inter);
  cursor: pointer;
  text-align: left;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23737780' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.75rem center !important;
  transition: box-shadow var(--akjobs-transition);
}

.akjobs-verguetung-options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 100;
  background: #ffffff;
  border-radius: var(--akjobs-radius-md);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  max-height: 280px;
  overflow-y: auto;
  padding: 0.5rem 0;
  margin-top: 0.25rem;
}

.akjobs-verguetung-dropdown.akjobs-open .akjobs-verguetung-options {
  display: block;
}

.akjobs-verguetung-group-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.5rem 0.75rem 0.25rem;
}

.akjobs-verguetung-item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.75rem;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.15s;
}

.akjobs-verguetung-item:hover {
  background: var(--wp--preset--color--surface-container);
}

.akjobs-verguetung-item input[type="checkbox"] {
  accent-color: var(--wp--preset--color--primary);
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}

/* ── Job-Cards in WPJM-Liste ── */
/* AJAX rendert <article> oder <li> mit unserem Template */
div.job_listings[data-per_page] ul.job_listings .akjobs-job-card,
ul.job_listings .akjobs-job-card {
  background: var(--wp--preset--color--surface-container-lowest) !important;
  border-radius: var(--akjobs-radius-xl) !important;
  padding: 1.5rem 2rem !important;
  box-shadow: var(--akjobs-shadow-sm);
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
  margin-bottom: 1.25rem !important;
  border: none !important;
}

div.job_listings[data-per_page] ul.job_listings .akjobs-job-card:hover,
ul.job_listings .akjobs-job-card:hover {
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-1px);
}

/* WPJM li-Wrapper: komplett Reset */
div.job_listings[data-per_page] ul.job_listings li.job_listing,
ul.job_listings li.job_listing {
  padding: 0 !important;
  margin: 0 0 1.25rem 0 !important;
  background: none !important;
  border: none !important;
  list-style: none !important;
  display: block !important;
}

/* WPJM Standard-Link ausblenden (unser Template übernimmt) */
ul.job_listings li.job_listing > a {
  display: none !important;
}

.akjobs-job-card__link:hover {
  color: var(--wp--preset--color--tertiary);
}

/* Paginierung */
.akjobs-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.25rem;
  padding: 2rem 0;
}

.akjobs-pagination a,
.akjobs-pagination span.current {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 0.5rem;
  border-radius: var(--akjobs-radius-md);
  font-weight: 600;
  text-decoration: none;
  transition: all var(--akjobs-transition);
}

.akjobs-pagination a {
  background: var(--wp--preset--color--surface-container-lowest);
  color: var(--wp--preset--color--on-surface);
}

.akjobs-pagination a:hover {
  background: var(--wp--preset--color--surface-container-high);
}

.akjobs-pagination span.current {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
}


/* ═══════════════════════════════════════════════════════
   Newsletter Placeholder
   ═══════════════════════════════════════════════════════ */

.newsletter-placeholder {
  background: linear-gradient(135deg, var(--wp--preset--color--primary), var(--wp--preset--color--primary-container));
  border-radius: var(--akjobs-radius-xl);
  padding: 3rem;
  text-align: center;
  color: var(--wp--preset--color--on-primary);
  margin: 2rem 0;
}

.newsletter-placeholder h3 {
  font-family: var(--wp--preset--font-family--newsreader);
  font-style: italic;
  color: var(--wp--preset--color--on-primary);
}


/* ═══════════════════════════════════════════════════════
   Pagination
   ═══════════════════════════════════════════════════════ */

.job-manager-pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  padding: 2rem 0;
}

.job-manager-pagination a,
.job-manager-pagination span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--akjobs-radius-md);
  font-weight: 600;
  text-decoration: none;
  transition: all var(--akjobs-transition);
}

.job-manager-pagination a {
  background: var(--wp--preset--color--surface-container-lowest);
  color: var(--wp--preset--color--on-surface);
}

.job-manager-pagination a:hover {
  background: var(--wp--preset--color--surface-container-high);
}

.job-manager-pagination span.current {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
}


/* ═══════════════════════════════════════════════════════
   Filter Sidebar (WP Job Manager)
   ═══════════════════════════════════════════════════════ */

.job_filters .search_jobs div {
  margin-bottom: 1rem;
}

.job_filters label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
  color: var(--wp--preset--color--on-surface-variant);
  display: block;
  margin-bottom: 0.375rem;
}

.job_filters input[type="text"],
.job_filters select {
  width: 100%;
  padding: 0.75rem 1rem;
  background: var(--wp--preset--color--surface-container-high);
  border: none;
  border-bottom: 2px solid var(--wp--preset--color--primary);
  border-radius: var(--akjobs-radius-sm) var(--akjobs-radius-sm) 0 0;
  font-size: 1rem;
  color: var(--wp--preset--color--on-surface);
  transition: all var(--akjobs-transition);
}

.job_filters input[type="text"]:focus,
.job_filters select:focus {
  background: var(--wp--preset--color--surface-container-lowest);
  border-bottom-color: var(--wp--preset--color--tertiary-fixed);
  outline: none;
}

.job_filters input[type="submit"] {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary);
  border: none;
  padding: 1rem 2rem;
  border-radius: var(--akjobs-radius-md);
  font-weight: 700;
  cursor: pointer;
  width: 100%;
  transition: background var(--akjobs-transition);
}

.job_filters input[type="submit"]:hover {
  background: var(--wp--preset--color--primary-container);
}


/* ═══════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .hero-section .wp-block-cover {
    min-height: 500px !important;
  }

  .hero-section h1 {
    font-size: 2.25rem !important;
  }

  .hero-search-bar {
    border-left-width: 4px !important;
  }

  .single-job_listing .job-detail-sidebar {
    position: static;
  }

  /* Buttons responsive: immer untereinander + volle Breite */
  .akjobs-button-group,
  .is-content-justification-space-between .akjobs-button-group {
    flex-direction: column !important;
    width: 100%;
  }
  .akjobs-button-group .application-button,
  .akjobs-button-group .source-button,
  .single-job_listing .application-button,
  .single-job_listing .source-button {
    display: block !important;
    width: 100% !important;
    padding: 1rem 1rem;
    font-size: 1rem;
    box-sizing: border-box;
    white-space: normal;
  }

  /* Zwei-Spalten Layout auf Mobile → einspaltig */
  .single-job_listing .wp-block-columns {
    flex-direction: column !important;
  }
  .single-job_listing .wp-block-column {
    flex-basis: 100% !important;
  }

  /* Titel + Button Bereich: Stack statt nebeneinander */
  .single-job_listing .wp-block-group[style*="space-between"] {
    flex-direction: column !important;
    gap: 1rem;
  }
}

@media (max-width: 480px) {
  .hero-section h1 {
    font-size: 1.75rem !important;
  }

  .job_listings .job_listing {
    padding: 1rem 1.25rem;
  }

  .single-job_listing .application-button,
  .single-job_listing .source-button {
    padding: 0.875rem 0.75rem;
    font-size: 0.9375rem;
  }
}


/* ═══════════════════════════════════════════════════════
   FAQ / Details-Block (Accordion-Style)
   Wirkt auf /stellenanzeige-schalten/ und
   /anzeige-*-bestellung-erfolgreich/
   ═══════════════════════════════════════════════════════ */

.wp-block-details {
  background: var(--wp--preset--color--surface-container-lowest);
  border-radius: var(--akjobs-radius-lg);
  box-shadow: var(--akjobs-shadow-sm);
  margin-bottom: 0.75rem;
  padding: 0;
  overflow: hidden;
  transition: box-shadow var(--akjobs-transition);
}

.wp-block-details:hover {
  box-shadow: var(--akjobs-shadow-md);
}

.wp-block-details[open] {
  box-shadow: var(--akjobs-shadow-md);
}

.wp-block-details > summary {
  list-style: none;
  cursor: pointer;
  padding: 1.125rem 1.5rem;
  padding-right: 3.25rem;
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--wp--preset--color--primary);
  position: relative;
  transition: color var(--akjobs-transition),
              background-color var(--akjobs-transition);
}

.wp-block-details > summary::-webkit-details-marker,
.wp-block-details > summary::marker {
  display: none;
  content: "";
}

.wp-block-details > summary::after {
  content: "";
  position: absolute;
  right: 1.5rem;
  top: 50%;
  width: 1rem;
  height: 1rem;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23001e40' stroke-width='2' stroke-linecap='round'><path d='M8 3v10M3 8h10'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transition: transform var(--akjobs-transition);
}

.wp-block-details[open] > summary::after {
  transform: translateY(-50%) rotate(45deg);
}

.wp-block-details > summary:hover {
  color: var(--wp--preset--color--on-primary-fixed, #001e40);
  background-color: rgba(255, 222, 165, 0.18);
}

.wp-block-details > summary:focus-visible {
  outline: 2px solid var(--wp--preset--color--tertiary-fixed);
  outline-offset: -2px;
}

.wp-block-details > :not(summary) {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  color: var(--wp--preset--color--on-surface-variant);
  line-height: 1.65;
}

.wp-block-details > :not(summary):first-of-type {
  padding-top: 0.25rem;
}

.wp-block-details > :not(summary):last-child {
  padding-bottom: 1.25rem;
  margin-bottom: 0;
}

.wp-block-details p {
  margin: 0 0 0.75rem 0;
}

.wp-block-details p:last-child {
  margin-bottom: 0;
}

/* Accent-Linie beim geöffneten Card — Gold-Unterstrich unter Summary */
.wp-block-details[open] > summary {
  border-bottom: 1px solid rgba(255, 222, 165, 0.6);
  margin-bottom: 0.75rem;
}


/* ───────────────────────────────────────────────
   CTA-Kontakt-Box unter dem FAQ
   Überschreibt die inline-styles der Gutenberg-Box
   (2px-Border + grauer Hintergrund → CI-konform)
   ─────────────────────────────────────────────── */

.wp-block-post-content div[style*="border:2px solid #001e40"],
.wp-block-post-content div[style*="border: 2px solid #001e40"],
.entry-content div[style*="border:2px solid #001e40"],
.entry-content div[style*="border: 2px solid #001e40"] {
  border: none !important;
  background: var(--wp--preset--color--surface-container-lowest) !important;
  background-image:
    linear-gradient(135deg,
      rgba(255, 222, 165, 0.12) 0%,
      rgba(255, 222, 165, 0) 60%) !important;
  box-shadow: var(--akjobs-shadow-md);
  border-radius: var(--akjobs-radius-lg) !important;
  padding: 1.75rem 2rem !important;
  color: var(--wp--preset--color--on-surface) !important;
  position: relative;
  overflow: hidden;
}

/* Gold-Akzent-Streifen links */
.wp-block-post-content div[style*="border:2px solid #001e40"]::before,
.wp-block-post-content div[style*="border: 2px solid #001e40"]::before,
.entry-content div[style*="border:2px solid #001e40"]::before,
.entry-content div[style*="border: 2px solid #001e40"]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--wp--preset--color--tertiary-fixed);
}

.wp-block-post-content div[style*="border:2px solid #001e40"] a,
.wp-block-post-content div[style*="border: 2px solid #001e40"] a,
.entry-content div[style*="border:2px solid #001e40"] a,
.entry-content div[style*="border: 2px solid #001e40"] a {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed);
  text-decoration: none;
  transition: color var(--akjobs-transition);
}

.wp-block-post-content div[style*="border:2px solid #001e40"] a:hover,
.wp-block-post-content div[style*="border: 2px solid #001e40"] a:hover,
.entry-content div[style*="border:2px solid #001e40"] a:hover,
.entry-content div[style*="border: 2px solid #001e40"] a:hover {
  color: var(--wp--preset--color--on-primary-fixed, #001e40);
}


/* Responsive: FAQ und CTA-Box auf Mobil kompakter */
@media (max-width: 600px) {
  .wp-block-details > summary {
    padding: 1rem 1.25rem;
    padding-right: 2.75rem;
    font-size: 0.9375rem;
  }

  .wp-block-details > summary::after {
    right: 1.125rem;
    width: 0.875rem;
    height: 0.875rem;
  }

  .wp-block-details > :not(summary) {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .wp-block-details > :not(summary):last-child {
    padding-bottom: 1rem;
  }

  .wp-block-post-content div[style*="border:2px solid #001e40"],
  .wp-block-post-content div[style*="border: 2px solid #001e40"],
  .entry-content div[style*="border:2px solid #001e40"],
  .entry-content div[style*="border: 2px solid #001e40"] {
    padding: 1.25rem 1.25rem 1.25rem 1.5rem !important;
    font-size: 0.9375rem;
  }
}


/* ═══════════════════════════════════════════════════════
   WP Table Builder Preistabelle — CI-Feinschliff
   /stellenanzeige-schalten/ und Bestellungs-Seiten
   ═══════════════════════════════════════════════════════ */

/* Container als Card mit deutlichem Shadow + Radius
   Plugin nutzt Specificity-Hack (.wptb-style-isolation:not(#...):not(#...) = 221)
   → wir schlagen es pauschal mit !important */
.wptb-container-legacy,
body .wptb-container-legacy {
  max-width: 1100px !important;
  margin: 2.5rem auto 3.5rem !important;
  padding: 2rem 1.5rem 2.5rem !important;
  background: var(--wp--preset--color--surface-container-lowest) !important;
  border-radius: var(--akjobs-radius-xl) !important;
  /* Navy-getönter Shadow: deutlich sichtbar, CI-konform */
  box-shadow: 0 10px 40px rgba(0, 31, 66, 0.10),
              0 2px 8px rgba(0, 31, 66, 0.05) !important;
  position: relative !important;
  overflow: visible !important;
}

/* Gold-Top-Akzent-Streifen (wiederholt die Sprache der CTA-Box im FAQ) */
.wptb-container-legacy::before,
body .wptb-container-legacy::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 2rem !important;
  right: 2rem !important;
  height: 3px !important;
  background: var(--wp--preset--color--tertiary-fixed) !important;
  border-radius: 0 0 2px 2px !important;
}

/* Tabelle an den Container anpassen */
.wptb-container-legacy .wptb-preview-table,
.wptb-style-isolation .wptb-preview-table,
.wptb-style-isolation table.wptb-table {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif !important;
  margin: 0 auto !important;
}

/* Globale Text-Farbe der Zellen — Plugin-Selector schlagen */
.wptb-container-legacy .wptb-preview-table tbody,
.wptb-style-isolation .wptb-preview-table tbody,
.wptb-style-isolation table.wptb-table tbody {
  color: var(--wp--preset--color--on-surface-variant) !important;
}

/* Header-Zellen (Standard/Premium): Newsreader italic */
.wptb-container-legacy .wptb-preview-table > tbody > tr:first-child .wptb-text-container,
.wptb-style-isolation .wptb-preview-table > tbody > tr:first-child .wptb-text-container,
.wptb-style-isolation table.wptb-table > tbody > tr:first-child .wptb-text-container {
  font-family: var(--wp--preset--font-family--newsreader), Newsreader, serif !important;
  font-style: italic !important;
  font-size: 1.75rem !important;
  letter-spacing: 0.01em !important;
  position: relative !important;
}

/* Premium-Spalte (letzte Header-Zelle): Gold-Akzent-Linie unter Titel */
.wptb-container-legacy .wptb-preview-table > tbody > tr:first-child
  > td:last-child .wptb-text-container::after,
.wptb-style-isolation .wptb-preview-table > tbody > tr:first-child
  > td:last-child .wptb-text-container::after,
.wptb-style-isolation table.wptb-table > tbody > tr:first-child
  > td:last-child .wptb-text-container::after {
  content: "" !important;
  display: block !important;
  width: 48px !important;
  height: 3px !important;
  background: var(--wp--preset--color--tertiary-fixed) !important;
  border-radius: 2px !important;
  margin: 0.5rem auto 0 !important;
}

/* Tooltip-Info-Icon in Primary */
.wptb-container-legacy .wptb-styled-list-icon[data-wptb-styled-list-icon-src="info-circle"],
.wptb-style-isolation .wptb-styled-list-icon[data-wptb-styled-list-icon-src="info-circle"] {
  fill: var(--wp--preset--color--primary) !important;
}

/* Feature-Listen-Text */
.wptb-container-legacy .wptb-styled-list-item-content,
.wptb-style-isolation .wptb-styled-list-item-content {
  color: var(--wp--preset--color--on-surface) !important;
  font-size: 0.9375rem !important;
  line-height: 1.5 !important;
}

/* Tooltip-Body */
.wptb-container-legacy .wptb-m-tooltip,
.wptb-style-isolation .wptb-m-tooltip {
  background: var(--wp--preset--color--primary) !important;
  color: #ffffff !important;
  border-radius: var(--akjobs-radius-md) !important;
  box-shadow: var(--akjobs-shadow-md) !important;
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif !important;
}

/* Responsive */
@media (max-width: 780px) {
  .wptb-container-legacy,
  body .wptb-container-legacy {
    padding: 0.5rem !important;
    margin: 1.25rem auto 2rem !important;
    border-radius: var(--akjobs-radius-lg) !important;
  }

  .wptb-container-legacy .wptb-preview-table > tbody > tr:first-child .wptb-text-container,
  .wptb-style-isolation .wptb-preview-table > tbody > tr:first-child .wptb-text-container,
  .wptb-style-isolation table.wptb-table > tbody > tr:first-child .wptb-text-container {
    font-size: 1.375rem !important;
  }

  .wptb-container-legacy .wptb-preview-table > tbody > tr:first-child
    > td:last-child .wptb-text-container::after,
  .wptb-style-isolation .wptb-preview-table > tbody > tr:first-child
    > td:last-child .wptb-text-container::after,
  .wptb-style-isolation table.wptb-table > tbody > tr:first-child
    > td:last-child .wptb-text-container::after {
    width: 36px !important;
    height: 2px !important;
    margin-top: 0.375rem !important;
  }
}


/* ═══════════════════════════════════════════════════════
   [akjobs_pricing] — Custom Pricing-Table
   2-Karten-Grid, mobil-responsive, vollständig im CI
   ═══════════════════════════════════════════════════════ */

.akjobs-pricing {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* 3 Parent-Rows: header, features, footer — Cards synchronisieren sich via subgrid */
  grid-template-rows: auto 1fr auto;
  gap: 1.5rem;
  max-width: 1000px;
  margin: 2.5rem auto 3.5rem;
  padding: 0 1rem;
  align-items: stretch;
}

.akjobs-pricing__card {
  position: relative;
  /* Subgrid: Cards übernehmen Rows vom Parent → Header/Features/Footer auf gleicher Höhe */
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  background: var(--wp--preset--color--surface-container-lowest);
  border-radius: var(--akjobs-radius-xl);
  padding: 2.25rem 2rem 2rem;
  box-shadow: 0 4px 16px rgba(0, 31, 66, 0.06),
              0 1px 3px rgba(0, 31, 66, 0.04);
  transition: box-shadow var(--akjobs-transition),
              transform var(--akjobs-transition);
}

/* Fallback für Browser ohne subgrid-Support (Chrome <117, Safari <16) */
@supports not (grid-template-rows: subgrid) {
  .akjobs-pricing {
    grid-template-rows: none;
  }
  .akjobs-pricing__card {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
  .akjobs-pricing__subtitle {
    min-height: 2.8rem;
  }
}

.akjobs-pricing__card:hover {
  box-shadow: 0 12px 32px rgba(0, 31, 66, 0.10),
              0 2px 8px rgba(0, 31, 66, 0.05);
  transform: translateY(-2px);
}

/* Premium-Card: Gold-Top-Streifen + stärkerer Shadow */
.akjobs-pricing__card.is-featured {
  box-shadow: 0 12px 40px rgba(0, 31, 66, 0.12),
              0 2px 8px rgba(0, 31, 66, 0.06);
}

.akjobs-pricing__card.is-featured::before {
  content: "";
  position: absolute;
  top: 0;
  left: 2rem;
  right: 2rem;
  height: 4px;
  background: var(--wp--preset--color--tertiary-fixed);
  border-radius: 0 0 3px 3px;
}

.akjobs-pricing__badge {
  position: absolute;
  top: -0.75rem;
  right: 2rem;
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--tertiary-fixed);
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  box-shadow: var(--akjobs-shadow-md);
}

/* Header */
.akjobs-pricing__header {
  text-align: center;
  margin-bottom: 1.5rem;
  padding-bottom: 1.25rem;
  position: relative;
}

.akjobs-pricing__header::after {
  content: "";
  display: block;
  width: 48px;
  height: 2px;
  background: var(--wp--preset--color--tertiary-fixed);
  border-radius: 2px;
  margin: 1rem auto 0;
}

.akjobs-pricing__name {
  font-family: var(--wp--preset--font-family--newsreader), serif;
  font-style: italic;
  font-weight: 500;
  font-size: 2rem;
  line-height: 1.2;
  color: var(--wp--preset--color--primary);
  margin: 0;
}

.akjobs-pricing__subtitle {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--wp--preset--color--on-surface-variant);
  margin: 0.625rem 0 0;
}

/* Features-Liste */
.akjobs-pricing__features {
  list-style: none;
  margin: 0 0 2rem;
  padding: 0;
}

.akjobs-pricing__feature {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(0, 31, 66, 0.06);
}

.akjobs-pricing__feature:last-child {
  border-bottom: none;
}

.akjobs-pricing__label {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.9375rem;
  line-height: 1.4;
  color: var(--wp--preset--color--on-surface);
}

.akjobs-pricing__value {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  flex-shrink: 0;
}

.akjobs-pricing__icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.akjobs-pricing__icon.is-check {
  color: #c59f59;
}

.akjobs-pricing__icon.is-cross {
  color: rgba(0, 31, 66, 0.35);
}

.akjobs-pricing__val {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
}

.akjobs-pricing__val.is-included {
  /* Screenreader-only — visuelles Icon reicht */
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.akjobs-pricing__val.is-excluded {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.akjobs-pricing__val.is-text {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
  font-size: 0.9375rem;
}

/* Footer: Preis + CTA */
.akjobs-pricing__footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 31, 66, 0.08);
}

.akjobs-pricing__price {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.akjobs-pricing__amount {
  font-family: var(--wp--preset--font-family--newsreader), serif;
  font-weight: 500;
  font-size: 2.5rem;
  line-height: 1;
  color: var(--wp--preset--color--primary);
}

.akjobs-pricing__vat {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.8125rem;
  color: var(--wp--preset--color--on-surface-variant);
}

.akjobs-pricing__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 280px;
  padding: 0.875rem 1.5rem;
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--tertiary-fixed);
  border-radius: 9999px;
  box-shadow: var(--akjobs-shadow-sm);
  transition: box-shadow var(--akjobs-transition),
              transform var(--akjobs-transition),
              background-color var(--akjobs-transition);
}

.akjobs-pricing__cta:hover {
  background: #002a5c;
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-1px);
  color: var(--wp--preset--color--tertiary-fixed);
}

/* Featured-Card: Gold-CTA für visuelles Highlight */
.akjobs-pricing__card.is-featured .akjobs-pricing__cta {
  background: var(--wp--preset--color--tertiary-fixed);
  color: var(--wp--preset--color--primary);
}

.akjobs-pricing__card.is-featured .akjobs-pricing__cta:hover {
  background: #ffd488;
  color: var(--wp--preset--color--primary);
}

/* Responsive: Unter 800px Karten untereinander */
@media (max-width: 800px) {
  .akjobs-pricing {
    grid-template-columns: 1fr;
    /* Kein subgrid nötig wenn Cards gestapelt — Flex reicht */
    grid-template-rows: none;
    gap: 2.75rem;
    margin: 1.5rem auto 2rem;
  }

  .akjobs-pricing__card {
    display: flex;
    flex-direction: column;
    grid-row: auto;
    grid-template-rows: none;
    padding: 2rem 1.5rem 1.75rem;
  }

  .akjobs-pricing__name {
    font-size: 1.75rem;
  }

  .akjobs-pricing__amount {
    font-size: 2.25rem;
  }
}

@media (max-width: 480px) {
  .akjobs-pricing__card {
    padding: 1.75rem 1.25rem 1.5rem;
  }

  .akjobs-pricing__feature {
    padding: 0.625rem 0;
  }

  .akjobs-pricing__label {
    font-size: 0.875rem;
  }
}


/* ═══════════════════════════════════════════════════════
   Menüpunkt „Stellenanzeige schalten" — permanenter CTA
   Gold-Pill, deutlich hervorgehoben, CI-konform
   ═══════════════════════════════════════════════════════ */

#menu-item-12593 > a,
.akjobs-nav-list li a[href*="stellenanzeige-schalten"],
.wp-block-navigation li a[href*="stellenanzeige-schalten"],
.wp-block-navigation-item a[href*="stellenanzeige-schalten"] {
  /* Schriftart passend zu anderen Nav-Items: Newsreader italic */
  font-family: var(--wp--preset--font-family--newsreader), Newsreader, serif !important;
  font-style: italic !important;
  font-weight: 500 !important;
  font-size: 1.0625rem !important;
  line-height: 1.5 !important;
  background: var(--wp--preset--color--tertiary-fixed) !important;
  color: var(--wp--preset--color--primary) !important;
  /* Symmetrisches Padding — Luft für italic-Descenders */
  padding: 0.625rem 1.375rem !important;
  border-radius: 9999px !important;
  border-bottom: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: var(--akjobs-shadow-sm);
  white-space: nowrap;
  transition: box-shadow var(--akjobs-transition),
              transform var(--akjobs-transition),
              background-color var(--akjobs-transition);
}

#menu-item-12593 > a:hover,
.akjobs-nav-list li a[href*="stellenanzeige-schalten"]:hover,
.wp-block-navigation li a[href*="stellenanzeige-schalten"]:hover,
.wp-block-navigation-item a[href*="stellenanzeige-schalten"]:hover {
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-1px);
  background: #ffd488 !important;
  color: var(--wp--preset--color--primary) !important;
  border-bottom: none !important;
}

/* Aktiv (User ist auf /stellenanzeige-schalten/): invertiert — Primary-Pill */
#menu-item-12593.current-menu-item > a,
#menu-item-12593.current_page_item > a,
.akjobs-nav-list li.current-menu-item a[href*="stellenanzeige-schalten"],
.akjobs-nav-list li.current_page_item a[href*="stellenanzeige-schalten"] {
  background: var(--wp--preset--color--primary) !important;
  color: var(--wp--preset--color--tertiary-fixed) !important;
  border-bottom: none !important;
  box-shadow: var(--akjobs-shadow-md);
  /* Gleiche Pill-Geometrie wie Idle-State — symmetrisch */
  padding: 0.625rem 1.375rem !important;
  line-height: 1.5 !important;
}

/* Mobile (Burger-Menü ausgeklappt): Pill-Look anpassen */
@media (max-width: 900px) {
  #menu-item-12593 > a,
  .akjobs-nav-list li a[href*="stellenanzeige-schalten"] {
    display: inline-block;
    margin-top: 0.25rem;
  }
}


/* ═══════════════════════════════════════════════════════
   [akjobs_related_jobs] — „Weitere Jobs dieser Hochschule"
   ═══════════════════════════════════════════════════════ */

.akjobs-related-jobs {
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 1px solid rgba(0, 31, 66, 0.08);
}

.akjobs-related-jobs__heading {
  font-family: var(--wp--preset--font-family--newsreader), serif;
  font-style: italic;
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1.2;
  color: var(--wp--preset--color--primary);
  margin: 0 0 1.5rem;
  position: relative;
  padding-bottom: 0.75rem;
}

.akjobs-related-jobs__heading::after {
  content: "";
  display: block;
  width: 48px;
  height: 2px;
  background: var(--wp--preset--color--tertiary-fixed);
  border-radius: 2px;
  margin-top: 0.75rem;
}

/* 1-Spalten-Grid — angeglichen an die reguläre Jobliste (Logo rechts, Company links) */
.akjobs-related-jobs__grid,
.akjobs-institution-jobs__grid {
  grid-template-columns: 1fr;
}

.akjobs-related-jobs__more {
  margin: 1.5rem 0 0;
  text-align: right;
}

.akjobs-related-jobs__more a {
  font-family: var(--wp--preset--font-family--inter), system-ui, sans-serif;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed);
  padding-bottom: 2px;
  transition: color var(--akjobs-transition);
}

.akjobs-related-jobs__more a:hover {
  color: var(--wp--preset--color--on-primary-fixed, #001e40);
}

@media (max-width: 780px) {
  .akjobs-related-jobs {
    margin-top: 3rem;
    padding-top: 2rem;
  }

  .akjobs-related-jobs__heading {
    font-size: 1.5rem;
  }

  .akjobs-related-jobs__grid {
    grid-template-columns: 1fr;
  }

  .akjobs-related-jobs__more {
    text-align: left;
  }
}


/* ═══════════════════════════════════════════════════════
   Startseite: Feature-Boxen (3 Spalten)
   "Alle Hochschulen, ein Portal" / "Gezielte Suche" / "Täglich aktuell"
   Match über die Icon-Dateinamen via :has() — verhindert, dass
   andere wp-block-columns auf der Seite versehentlich gestyled werden.
   ═══════════════════════════════════════════════════════ */

.wp-block-columns:has(img[src*="university-1"]) > .wp-block-column,
.wp-block-columns:has(img[src*="find-job"]) > .wp-block-column,
.wp-block-columns:has(img[src*="24-hours"]) > .wp-block-column {
  background: var(--wp--preset--color--surface-container-lowest, #ffffff);
  border-radius: var(--akjobs-radius-xl);
  box-shadow: var(--akjobs-shadow-sm);
  padding: 2rem 1.5rem;
  transition: box-shadow var(--akjobs-transition), transform var(--akjobs-transition);
}

.wp-block-columns:has(img[src*="university-1"]) > .wp-block-column:hover,
.wp-block-columns:has(img[src*="find-job"]) > .wp-block-column:hover,
.wp-block-columns:has(img[src*="24-hours"]) > .wp-block-column:hover {
  box-shadow: var(--akjobs-shadow-md);
  transform: translateY(-2px);
}

/* Innere Elemente: Icon + Heading + Text zentriert, saubere Abstände */
.wp-block-columns:has(img[src*="university-1"]) > .wp-block-column > figure,
.wp-block-columns:has(img[src*="find-job"]) > .wp-block-column > figure,
.wp-block-columns:has(img[src*="24-hours"]) > .wp-block-column > figure {
  margin: 0 0 1rem 0;
}

.wp-block-columns:has(img[src*="university-1"]) > .wp-block-column > h3,
.wp-block-columns:has(img[src*="find-job"]) > .wp-block-column > h3,
.wp-block-columns:has(img[src*="24-hours"]) > .wp-block-column > h3 {
  text-align: center;
  margin: 0 0 0.75rem 0;
}

.wp-block-columns:has(img[src*="university-1"]) > .wp-block-column > p,
.wp-block-columns:has(img[src*="find-job"]) > .wp-block-column > p,
.wp-block-columns:has(img[src*="24-hours"]) > .wp-block-column > p {
  text-align: center;
  margin: 0;
  line-height: 1.5;
}


/* ═══════════════════════════════════════════════════════
   Gutenberg-Buttons: Premium-Hover-Effekt
   Gleiche Optik wie "Weitere Jobangebote laden" — smooth Farb-Fade,
   leichter Lift, Glow-Shadow. Gilt für alle .wp-block-button__link
   (Fill-Style); .is-style-outline-Variante bleibt unberührt.
   ═══════════════════════════════════════════════════════ */

.wp-block-button .wp-block-button__link {
  transition:
    opacity 0.25s var(--akjobs-transition-ease, ease-out),
    box-shadow 0.25s var(--akjobs-transition-ease, ease-out),
    transform 0.25s var(--akjobs-transition-ease, ease-out),
    filter 0.25s var(--akjobs-transition-ease, ease-out),
    background-position 0.25s var(--akjobs-transition-ease, ease-out);
  /* background-size > 100% erlaubt dem Gradient, sich beim Hover zu verschieben
     → Farbe ändert sich dezent ohne harten Wechsel. */
  background-size: 150% 150%;
  background-position: 0% 0%;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible {
  opacity: 0.95;
  box-shadow:
    0 6px 20px rgba(0, 31, 66, 0.2),
    0 0 0 1px rgba(255, 255, 255, 0.08) inset;
  transform: translateY(-1px);
  filter: brightness(1.08);
  background-position: 100% 100%;
}

/* Outline-Style: nur dezenter Glow + Lift, keine Filter-Veränderung */
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
  box-shadow: 0 4px 14px rgba(0, 31, 66, 0.12);
  transform: translateY(-1px);
}

/* ═════════════════════════════════════════════════════════
   Fachbereich-Hub-Seiten (taxonomy-fachgebiet.php)
   ═════════════════════════════════════════════════════════ */

.akjobs-hub {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.5rem 1rem;
}

.akjobs-breadcrumbs {
  font-size: 0.875rem;
  color: var(--wp--preset--color--primary);
  margin-bottom: 1rem;
  opacity: 0.8;
}
.akjobs-breadcrumbs a {
  color: inherit;
  text-decoration: none;
}
.akjobs-breadcrumbs a:hover {
  text-decoration: underline;
}
.akjobs-breadcrumbs__current {
  font-weight: 600;
}

.akjobs-hub-hero {
  padding: 2rem 0 1.5rem;
  border-bottom: 1px solid rgba(0, 31, 66, 0.08);
  margin-bottom: 2rem;
}

/* Mobil: der Abstand Header -> Breadcrumbs ist sonst zu groß (main padding-top
   4rem inline + Hero padding-top 2rem ~= 96px). Auf Handys deutlich reduzieren.
   !important überschreibt das Inline-padding-top des <main> aus dem Block-Template. */
@media (max-width: 600px) {
  .akjobs-hub { padding-top: 1.25rem !important; }
  .akjobs-hub-hero { padding-top: 0.5rem; }
}

.akjobs-hub-hero__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: italic;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
  line-height: 1.15;
  margin: 0 0 1rem;
  color: var(--wp--preset--color--primary);
}

.akjobs-hub-hero__intro {
  font-size: 1.125rem;
  line-height: 1.65;
  color: rgba(0, 31, 66, 0.82);
}
.akjobs-hub-hero__intro p { margin: 0 0 0.75rem; }
.akjobs-hub-hero__intro p:last-child { margin-bottom: 0; }

.akjobs-hub-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

.akjobs-badge--count {
  background: var(--wp--preset--color--primary);
  color: #fff;
  padding: 0.4rem 0.9rem;
  border-radius: 9999px;
  font-weight: 600;
  font-size: 0.875rem;
}
.akjobs-badge--primary-count {
  background: rgba(0, 31, 66, 0.08);
  color: var(--wp--preset--color--primary);
  padding: 0.4rem 0.9rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
}

/* Related-Box: Interdisziplinaere Felder */
.akjobs-hub-related {
  background: linear-gradient(180deg, rgba(212, 175, 55, 0.06) 0%, rgba(212, 175, 55, 0.02) 100%);
  border-left: 3px solid var(--wp--preset--color--tertiary-fixed);
  padding: 1.25rem 1.5rem;
  border-radius: 0 8px 8px 0;
  margin-bottom: 2rem;
}
.akjobs-hub-related__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: normal;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 0.75rem;
  color: var(--wp--preset--color--primary);
}
.akjobs-hub-related__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.akjobs-hub-related__item {
  display: flex;
}
.akjobs-hub-related__link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  min-height: 3.25rem;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 6px;
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  font-size: 0.9375rem;
  line-height: 1.3;
  transition: background 0.15s, transform 0.15s;
}
.akjobs-hub-related__name {
  text-align: left;
}
.akjobs-hub-related__link:hover {
  background: #fff;
  transform: translateX(2px);
}
.akjobs-hub-related__count {
  font-size: 0.8125rem;
  color: rgba(0, 31, 66, 0.6);
  white-space: nowrap;
  margin-left: auto;
}
.akjobs-hub-related__title--centered {
  text-align: center;
  font-size: var(--wp--preset--font-size--xx-large);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 1.25rem;
}

/* Hub-Listings-Grid */
.akjobs-hub-listings__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: italic;
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0 0 1rem;
  color: var(--wp--preset--color--primary);
}

.akjobs-hub-listings__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 720px) {
  .akjobs-hub-listings__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.akjobs-hub-listings__empty {
  padding: 2rem;
  text-align: center;
  color: rgba(0, 31, 66, 0.6);
  background: rgba(0, 31, 66, 0.04);
  border-radius: 8px;
}

/* Cross-Display-Highlight fuer Job-Cards die von Fremd-Fachbereich stammen */
.akjobs-job-card--cross {
  border-top: 2px solid var(--wp--preset--color--tertiary-fixed);
}

.akjobs-badge--fach {
  background: rgba(0, 31, 66, 0.08);
  color: var(--wp--preset--color--primary);
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  line-height: 1;
  min-height: calc(0.75rem + 0.5rem + 2px);
  display: inline-flex;
  align-items: center;
}
.akjobs-badge--fach.akjobs-badge--cross {
  background: linear-gradient(180deg, rgba(212, 175, 55, 0.18), rgba(212, 175, 55, 0.08));
  color: var(--wp--preset--color--primary);
  font-weight: 600;
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.35) inset;
}

/* Pagination: nutzt das bestehende .akjobs-pagination-Styling aus Zeile 1727+.
   Hier zusaetzlich: WP paginate_links generiert .page-numbers Klassen (kein
   direktes <a> oder <span class="current">). Alias die CSS entsprechend. */
.akjobs-pagination .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 0.75rem;
  border-radius: var(--akjobs-radius-md, 8px);
  font-weight: 600;
  text-decoration: none;
  background: var(--wp--preset--color--surface-container-lowest, rgba(0, 31, 66, 0.04));
  color: var(--wp--preset--color--on-surface, var(--wp--preset--color--primary));
  transition: background 0.15s;
}
.akjobs-pagination .page-numbers.current {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--on-primary, #fff);
}
.akjobs-pagination a.page-numbers:hover {
  background: var(--wp--preset--color--surface-container-high, rgba(0, 31, 66, 0.1));
}

/* Hub-Filter-Bar: Checkbox-Dropdowns via <details>/<summary> (kein JS) */
.akjobs-hub-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 1.5rem;
  padding: 0.85rem 1.25rem;
  background: rgba(0, 31, 66, 0.03);
  border-radius: 10px;
  align-items: center;  /* einheitliche vertikale Ausrichtung statt stretch */
}

/* ── Sidebar-Layout: Filter links, Jobs rechts (Hub-Seiten analog zur Startseite) ── */
.akjobs-hub-listings--sidebar {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
  flex-wrap: wrap;
}
.akjobs-hub-listings--sidebar > form.akjobs-hub-filters {
  flex: 0 0 280px;
  width: 280px;
  max-width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  gap: 0.9rem;
  padding: 1.5rem;
  margin: 0;
  position: sticky;
  top: 6rem;
  background: var(--wp--preset--color--surface-container-low, rgba(0, 31, 66, 0.03));
  border-radius: 12px;
  order: -1;
}
.akjobs-hub-listings--sidebar > form.akjobs-hub-filters::before {
  content: "Filter";
  display: block;
  font-family: var(--wp--preset--font-family--newsreader, serif);
  font-size: 1.5rem;
  font-style: italic;
  font-weight: 700;
  color: var(--wp--preset--color--primary, #001e40);
  margin-bottom: 0.25rem;
}
.akjobs-hub-listings--sidebar > form.akjobs-hub-filters .akjobs-hub-filter-dd,
.akjobs-hub-listings--sidebar > form.akjobs-hub-filters .akjobs-hub-filter-input {
  width: 100%;
}
.akjobs-hub-listings--sidebar > form.akjobs-hub-filters .akjobs-hub-filter-dd summary {
  width: 100%;
  justify-content: space-between;
}
.akjobs-hub-listings--sidebar .akjobs-hub-filters__actions {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.akjobs-hub-listings--sidebar .akjobs-hub-filters__apply {
  width: 100%;
}
.akjobs-hub-listings__main {
  flex: 1 1 0;
  min-width: 0;
}
@media (max-width: 900px) {
  /* Wie auf der Startseite: align-items stretch + flex-direction column.
     Ohne stretch behaelt die Sidebar ihre 280px-Breite + padding und ragt
     rechts ueber den Viewport hinaus. */
  .akjobs-hub-listings--sidebar {
    flex-direction: column;
    align-items: stretch;
  }
  .akjobs-hub-listings--sidebar > form.akjobs-hub-filters {
    position: static;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    flex: 0 0 auto;
    order: 0;
  }
  /* Inputs + Dropdowns auf volle Breite der Sidebar */
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-input,
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-dd {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    display: block;
    box-sizing: border-box;
  }
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-input input,
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-dd summary {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  /* Mobile-Fix: Panel inline statt absolute — sonst clippen Sidebar-/Listing-Container
     das absolute Dropdown weg ("Pfeil dreht sich, aber Liste sichtbar nicht"). */
  .akjobs-hub-filter-dd .akjobs-hub-filter-dd__panel {
    position: static;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-top: 0.4rem;
    box-shadow: none;
    border: 1px solid rgba(0, 31, 66, 0.12);
  }
}

.akjobs-hub-filter-input {
  display: inline-flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 10rem;
}
.akjobs-hub-filter-input__label {
  font-size: 0.75rem;
  color: var(--wp--preset--color--on-surface-variant, #555);
  padding-left: 0.5rem;
}
.akjobs-hub-filter-input input {
  height: 2.5rem;
  border: 1px solid rgba(0, 31, 66, 0.15);
  border-radius: 6px;
  padding: 0 0.75rem;
  font-size: 0.9rem;
  background: white;
  box-sizing: border-box;
}
.akjobs-hub-filter-input input:focus {
  outline: none;
  border-color: var(--wp--preset--color--primary, #001e40);
  box-shadow: 0 0 0 2px rgba(0, 31, 66, 0.12);
}

.akjobs-hub-filter-dd {
  position: relative;
  display: inline-block;
}
.akjobs-hub-filter-dd summary {
  list-style: none;
  cursor: pointer;
  box-sizing: border-box;
  height: 2.5rem;
  min-width: 140px;
  padding: 0 2rem 0 0.9rem;
  background: #fff;
  border: 1px solid rgba(0, 31, 66, 0.15);
  border-radius: 6px;
  color: var(--wp--preset--color--primary);
  font-size: 0.9375rem;
  font-weight: 500;
  white-space: nowrap;
  user-select: none;
  display: flex;
  align-items: center;
  transition: border-color 0.15s, background 0.15s;
}
.akjobs-hub-filter-dd summary::-webkit-details-marker { display: none; }
.akjobs-hub-filter-dd summary::after {
  content: '';
  position: absolute;
  right: 0.85rem;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  width: 0.55rem;
  height: 0.55rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  margin-top: -3px;
  transform: translateY(-50%) rotate(45deg);
  opacity: 0.7;
  transition: transform 0.15s;
}
.akjobs-hub-filter-dd[open] summary {
  border-color: var(--wp--preset--color--primary);
}
.akjobs-hub-filter-dd[open] summary::after {
  transform: translateY(-50%) rotate(-135deg);
  margin-top: 2px;
}
.akjobs-hub-filter-dd.is-active summary {
  background: rgba(212, 175, 55, 0.12);
  border-color: var(--wp--preset--color--tertiary-fixed);
  font-weight: 600;
}
.akjobs-hub-filter-dd__panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 20;
  min-width: 220px;
  max-width: 320px;
  max-height: 60vh;
  overflow-y: auto;
  padding: 0.35rem;
  background: #fff;
  border: 1px solid rgba(0, 31, 66, 0.15);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(0, 31, 66, 0.08);
  display: block;  /* kein flex -- vermeidet erzwungene gaps */
}
/* Hard-Reset um Parent-Theme/WP-Core label-Styles zu uebersteuern */
.akjobs-hub-filter-dd__panel label.akjobs-hub-filter-dd__option {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3rem 0.55rem !important;
  margin: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  line-height: 1.2 !important;
  font-size: 0.9125rem;
  font-weight: 400;
  border-radius: 4px;
  color: var(--wp--preset--color--primary);
  cursor: pointer;
  text-transform: none !important;
  letter-spacing: 0 !important;
  box-sizing: border-box;
}
.akjobs-hub-filter-dd__panel label.akjobs-hub-filter-dd__option:hover {
  background: rgba(0, 31, 66, 0.05);
}
.akjobs-hub-filter-dd__panel label.akjobs-hub-filter-dd__option input[type="checkbox"] {
  margin: 0 !important;
  padding: 0 !important;
  width: 14px;
  height: 14px;
  min-width: 14px;
  flex-shrink: 0;
  cursor: pointer;
}
.akjobs-hub-filter-dd__group {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(0, 31, 66, 0.5);
  padding: 0.55rem 0.55rem 0.15rem;
  font-weight: 600;
}
.akjobs-hub-filter-dd__group:first-child { padding-top: 0.15rem; }

.akjobs-hub-filter-dd--verguetung .akjobs-hub-filter-dd__panel {
  min-width: 300px;
  max-width: 360px;
}
.akjobs-hub-filter-dd--region .akjobs-hub-filter-dd__panel {
  min-width: 280px;
  max-width: 360px;
  max-height: 480px;
  overflow-y: auto;
  padding: 0;
}

/* ═══ Zweistufiges Region-Panel ═══ */
.akjobs-region-panel {
  display: flex;
  flex-direction: column;
  font-size: 0.875rem;
}
.akjobs-region-panel__step {
  padding: 0.6rem 0.75rem;
}
.akjobs-region-panel__step:not(:last-child) {
  border-bottom: 1px solid rgba(0, 31, 66, 0.1);
}
.akjobs-region-panel__label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(0, 31, 66, 0.5);
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.akjobs-region-panel__country,
.akjobs-region-panel__region {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3rem 0.1rem;
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1.3;
}
.akjobs-region-panel__country {
  font-weight: 500;
}
.akjobs-region-panel__country input[type="checkbox"],
.akjobs-region-panel__region input[type="checkbox"] {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.akjobs-region-panel__hint {
  font-size: 0.8125rem;
  color: rgba(0, 31, 66, 0.55);
  font-style: italic;
  padding: 0.2rem 0.1rem 0.4rem;
}
.akjobs-region-panel__group {
  margin-top: 0.5rem;
  padding-top: 0.4rem;
  border-top: 1px dashed rgba(0, 31, 66, 0.1);
}
.akjobs-region-panel__group:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.akjobs-region-panel__group-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(0, 31, 66, 0.7);
  margin-bottom: 0.25rem;
}
.akjobs-region-panel__group .akjobs-region-panel__region {
  padding-left: 0.4rem;
}

/* Hub-Listings AJAX-Loading-State */
[data-akjobs-hub-listing] {
  position: relative;
  transition: opacity 200ms ease;
}
[data-akjobs-hub-listing].is-loading {
  opacity: 0.55;
  pointer-events: none;
}
[data-akjobs-hub-listing].is-loading::after {
  content: "";
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  width: 22px;
  height: 22px;
  border: 2px solid rgba(0, 31, 66, 0.18);
  border-top-color: var(--wp--preset--color--primary, #001e40);
  border-radius: 50%;
  animation: akjobs-hub-spin 0.7s linear infinite;
}
@keyframes akjobs-hub-spin { to { transform: rotate(360deg); } }

/* /jobs/ — Region-Dropdown ist <details> mit eigenem Toggle-Button-Look */
.akjobs-region-dropdown {
  position: relative;
  width: 100%;
}
.akjobs-region-dropdown__toggle {
  cursor: pointer;
  padding: 0.5rem 0.85rem;
  border: 1px solid rgba(0, 31, 66, 0.18);
  border-radius: 4px;
  background: #fff;
  font-size: 0.875rem;
  list-style: none;
  user-select: none;
}
.akjobs-region-dropdown__toggle::-webkit-details-marker { display: none; }
.akjobs-region-dropdown__toggle::after {
  content: " ▾";
  color: rgba(0, 31, 66, 0.5);
  font-size: 0.75em;
}
.akjobs-region-dropdown[open] .akjobs-region-dropdown__toggle::after {
  content: " ▴";
}
.akjobs-region-dropdown[open] .akjobs-region-panel {
  position: absolute;
  z-index: 50;
  top: calc(100% + 4px);
  left: 0;
  min-width: 280px;
  max-height: 480px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid rgba(0, 31, 66, 0.18);
  border-radius: 4px;
  box-shadow: 0 6px 20px rgba(0, 31, 66, 0.12);
  padding: 0;
}
.akjobs-region-dropdown.is-active .akjobs-region-dropdown__toggle {
  border-color: var(--wp--preset--color--primary, #001e40);
  font-weight: 600;
}
.akjobs-hub-filter-dd__group-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
}
.akjobs-hub-filter-dd__option--compact {
  padding: 0.25rem 0.35rem;
  font-size: 0.8125rem;
  gap: 0.35rem;
  min-width: 0;
}

/* Action-Wrapper: haelt Apply + Reset zusammen, wenn Flex-Wrap die Filter-Bar umbricht */
.akjobs-hub-filters__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.akjobs-hub-filters__apply {
  box-sizing: border-box;
  height: 2.5rem;
  padding: 0 1.1rem;
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 1px solid var(--wp--preset--color--primary);
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.9375rem;
  cursor: pointer;
  transition: filter 0.15s;
}
.akjobs-hub-filters__apply:hover {
  filter: brightness(1.1);
}
.akjobs-hub-filters__reset {
  box-sizing: border-box;
  height: 2.5rem;
  padding: 0 0.5rem;
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  font-size: 0.875rem;
  opacity: 0.7;
  display: flex;
  align-items: center;
  white-space: nowrap;
}

/* Ergebnis-Zaehler oberhalb der Job-Listings */
.akjobs-hub-listings__count {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: rgba(0, 31, 66, 0.7);
}
.akjobs-hub-listings__count strong {
  color: var(--wp--preset--color--primary);
  font-weight: 700;
}
.akjobs-hub-filters__reset:hover {
  opacity: 1;
  text-decoration: underline;
}

@media (max-width: 640px) {
  .akjobs-hub-filters { padding: 0.85rem; }
  /* Position: fixed nur ausserhalb des Sidebar-Layouts — sonst springt das Panel
     aus der Sidebar heraus und ueberlagert den Rest. Im Sidebar-Layout erbt es
     position: static aus dem 900px-Mobile-Override darueber. */
  .akjobs-hub-listings:not(.akjobs-hub-listings--sidebar) .akjobs-hub-filter-dd__panel {
    position: fixed;
    left: 1rem;
    right: 1rem;
    max-width: none;
  }
  /* Verguetung-Panel: min-width 300px auf Desktop OK, sprengt aber im Sidebar-
     Layout (Sidebar ist auf < 360px Viewport schmaler als 300px). Mobile auf
     100% normalisieren. */
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-dd--verguetung .akjobs-hub-filter-dd__panel {
    min-width: 0;
    max-width: 100%;
  }
}
@media (max-width: 900px) {
  /* Auch im 640..900px-Range schon greifen — Sidebar wird ab 900px zur Vollbreite,
     das Verguetung-Panel muss spaetestens hier mitziehen. */
  .akjobs-hub-listings--sidebar .akjobs-hub-filter-dd--verguetung .akjobs-hub-filter-dd__panel {
    min-width: 0;
    max-width: 100%;
  }
}

/* SEO-Pillar-Body unterhalb der Jobliste (Term-Meta akjobs_body).
   Typografie/Tabellen/Quellen-Box erbt die Komponente von .akjobs-ratgeber-article
   (gleiche CI wie die Ratgeber). Hier nur Abtrennung + volle Breite. */
.akjobs-hub-body {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 31, 66, 0.08);
}
/* Erstes H2 im Body nicht so weit abstossen wie zwischen Artikel-Sektionen */
.akjobs-hub-body.akjobs-ratgeber-article > h2:first-child { margin-top: 0.5rem; }
/* Body-Tabellen laufen ueber die volle Content-Breite (wie der Fliesstext).
   Damit die 2-spaltige Gehaltstabelle dabei nicht in der Mitte auseinander-
   gezogen wirkt, sitzt die Wert-Spalte (letzte Spalte) rechtsbuendig am
   Tabellenrand. Vertikale Abstaende, da nackte <table> von .akjobs-ratgeber-
   article sonst margin:0 erben. */
.akjobs-hub-body.akjobs-ratgeber-article table {
  margin-top: 1.75rem;
  margin-bottom: 1.75rem;
}
.akjobs-hub-body.akjobs-ratgeber-article table th:last-child,
.akjobs-hub-body.akjobs-ratgeber-article table td:last-child {
  text-align: right;
}

/* Dynamische Hub-Statistiken ("… in Zahlen") zwischen Jobliste und Pillar-Text */
.akjobs-hub-stats {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 31, 66, 0.08);
}
.akjobs-hub-stats__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-weight: 700;
  font-size: 1.7rem;
  line-height: 1.25;
  color: var(--wp--preset--color--primary);
  margin: 0 0 0.5rem;
}
.akjobs-hub-stats__lead {
  font-size: 0.9375rem;
  color: rgba(0, 31, 66, 0.7);
  margin: 0 0 1.5rem;
}
.akjobs-hub-stats__grid {
  display: grid;
  /* min(100%, 260px): auf sehr schmalen Screens darf die Spalte unter 260px
     fallen statt den Container (und damit den Viewport) zu sprengen. */
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 1.25rem;
}
.akjobs-hub-stats__panel {
  background: rgba(0, 31, 66, 0.025);
  border: 1px solid rgba(0, 31, 66, 0.08);
  border-radius: 8px;
  padding: 1rem 1.1rem 1.1rem;
}
.akjobs-hub-stats__panel-title {
  font-weight: 700;
  font-size: 1rem;
  color: var(--wp--preset--color--primary);
  margin: 0 0 0.75rem;
}
.akjobs-hub-stats__list {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: akjobs-stat;
}
.akjobs-hub-stats__row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.55rem;
  border-radius: 5px;
  overflow: hidden;
  font-size: 0.9375rem;
  line-height: 1.3;
}
.akjobs-hub-stats__row + .akjobs-hub-stats__row { margin-top: 0.15rem; }
.akjobs-hub-stats__bar {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  background: linear-gradient(90deg, rgba(212, 175, 55, 0.22), rgba(212, 175, 55, 0.08));
  border-radius: 5px;
  z-index: 0;
}
.akjobs-hub-stats__label {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  color: rgba(0, 31, 66, 0.9);
  /* Lange Fachrichtungs-/Hochschulnamen umbrechen lassen statt per nowrap die
     Karte (und damit den mobilen Viewport) zu sprengen. */
  overflow-wrap: anywhere;
}
.akjobs-hub-stats__label a {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}
.akjobs-hub-stats__label a:hover { text-decoration: underline; }
.akjobs-hub-stats__value {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  font-weight: 700;
  color: var(--wp--preset--color--primary);
  font-variant-numeric: tabular-nums;
}

/* FAQ + Cross-Parents unten */
.akjobs-hub-faq {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(0, 31, 66, 0.08);
}
.akjobs-hub-faq h2 {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: normal;
  font-weight: 700;
  font-size: 1.7rem;
  line-height: 1.25;
  color: var(--wp--preset--color--primary);
  margin: 0 0 1rem;
}

.akjobs-hub-cross-parents {
  margin-top: 2rem;
  padding: 1rem 1.25rem;
  background: rgba(0, 31, 66, 0.03);
  border-radius: 8px;
  font-size: 0.875rem;
  color: rgba(0, 31, 66, 0.7);
}
.akjobs-hub-cross-parents a {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
}


/* Fachbereich-Overview-Page (/fachbereich/) */
.akjobs-fachbereich-overview {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.5rem 1rem;
}
.akjobs-fg-section {
  margin-bottom: 2.5rem;
}
.akjobs-fg-section__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: italic;
  font-size: 1.75rem;
  font-weight: 500;
  margin: 0 0 1rem;
  color: var(--wp--preset--color--primary);
  border-bottom: 1px solid rgba(0, 31, 66, 0.1);
  padding-bottom: 0.5rem;
  /* Lange Komposita (z.B. „...wissenschaften") brechen sonst mobil aus dem Container */
  overflow-wrap: break-word;
  hyphens: auto;
}
.akjobs-fg-section__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.75rem;
}
.akjobs-hub-tile {
  display: flex;
  flex-direction: column;
  padding: 0.85rem 1rem;
  background: rgba(0, 31, 66, 0.03);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.akjobs-hub-tile:hover {
  background: rgba(0, 31, 66, 0.06);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 31, 66, 0.08);
}
.akjobs-hub-tile__name {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
  font-size: 0.9375rem;
  line-height: 1.3;
}
.akjobs-hub-tile__count {
  font-size: 0.8125rem;
  color: rgba(0, 31, 66, 0.6);
  margin-top: 0.25rem;
}

/* Mega-Menu */
.akjobs-megamenu {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.5rem;
  padding: 1.5rem;
  background: #fff;
  box-shadow: 0 12px 30px rgba(0, 31, 66, 0.12);
  max-width: 1100px;
}
.akjobs-megamenu__group {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(0, 31, 66, 0.55);
  margin: 0 0 0.5rem;
  font-weight: 600;
}
.akjobs-megamenu__column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.akjobs-megamenu__column li {
  margin-bottom: 0.35rem;
}
.akjobs-megamenu__column a {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  font-size: 0.9375rem;
}
.akjobs-megamenu__column a:hover {
  text-decoration: underline;
}
.akjobs-megamenu__more {
  margin-top: 0.5rem !important;
  font-style: italic;
  color: rgba(0, 31, 66, 0.6);
}


/* Hub-Listings-Override: WPJM content-job_listing.php liefert .akjobs-job-card
   Grid-Container ist .akjobs-hub-listings__grid — Override von display:grid
   zu WPJM-Standard-Listing (Liste mit full-width cards) */
.akjobs-hub-listings__grid {
  display: block;  /* Cards stacked */
}
.akjobs-hub-listings__grid .akjobs-job-card {
  margin-bottom: 1rem;
}

/* Related-Box: jetzt UNTER den Listings, nicht oben */
.akjobs-hub-related {
  margin-top: 3rem;
}

/* Breadcrumb-Fix: Block-Theme-Link-Styles brachen Inline-Layout.
   Explizites Flex + nowrap auf Items verhindert Line-Breaks. */
.akjobs-hub .akjobs-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0 0 1.25rem;
  font-size: 0.875rem;
}
.akjobs-hub .akjobs-breadcrumbs a,
.akjobs-hub .akjobs-breadcrumbs span {
  display: inline;
  white-space: nowrap;
}
.akjobs-hub .akjobs-breadcrumbs a {
  color: var(--wp--preset--color--primary);
  opacity: 0.7;
  text-decoration: none;
}
.akjobs-hub .akjobs-breadcrumbs a:hover {
  opacity: 1;
  text-decoration: underline;
}
.akjobs-hub .akjobs-breadcrumbs__current {
  color: var(--wp--preset--color--primary);
  font-weight: 600;
}

/* Cross-Parents-Box: Pill-Style-Links mit Icon-Separatoren */
.akjobs-hub-cross-parents {
  margin-top: 3rem;
  padding: 1.25rem 1.5rem;
  background: rgba(0, 31, 66, 0.035);
  border-left: 3px solid rgba(0, 31, 66, 0.15);
  border-radius: 0 8px 8px 0;
  font-size: 0.9375rem;
  color: rgba(0, 31, 66, 0.75);
}
.akjobs-hub-cross-parents p {
  margin: 0;
  line-height: 1.75;
}
.akjobs-hub-cross-parents a {
  display: inline-block;
  padding: 0.15rem 0.65rem;
  margin: 0.15rem 0.15rem;
  background: #fff;
  border: 1px solid rgba(0, 31, 66, 0.12);
  border-radius: 9999px;
  color: var(--wp--preset--color--primary);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.875rem;
  transition: background 0.15s, border-color 0.15s;
}
.akjobs-hub-cross-parents a:hover {
  background: var(--wp--preset--color--tertiary-fixed);
  border-color: var(--wp--preset--color--tertiary-fixed);
  text-decoration: none;
}

.akjobs-hub-verweis-jobportale {
  margin-top: 2rem;
}
.akjobs-hub-verweis-jobportale > *:first-child {
  margin-top: 0;
}
.akjobs-hub-verweis-jobportale > *:last-child {
  margin-bottom: 0;
}

/* ────────────────────────────────────────────────────────────────
   Newsletter-Form (Hero-Style mit Hintergrundbild)
   ──────────────────────────────────────────────────────────────── */
.akjobs-newsletter {
  position: relative;
  margin: 3rem 0 0;
  padding: 4rem 1.5rem;
  background-image:
    linear-gradient(rgba(0, 14, 30, 0.72), rgba(0, 14, 30, 0.72)),
    url("../img/newsletter-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 12px;
  text-align: center;
  color: #fff;
  font-family: var(--wp--preset--font-family--inter, "Inter", sans-serif);
}
.akjobs-newsletter__title {
  font-family: var(--wp--preset--font-family--newsreader, serif);
  font-size: 1.875rem;
  font-style: italic;
  font-weight: 700;
  color: #fff;
  margin: 0 auto 0.35rem;
  max-width: 38rem;
  line-height: 1.2;
}
.akjobs-newsletter .akjobs-newsletter__intro {
  margin: 0 auto 0.9rem;
  max-width: 42rem;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.akjobs-newsletter__form {
  display: flex;
  flex-direction: column;
  max-width: 32rem;
  margin: 0 auto;
}
/* Vertikale Abstände zwischen Form-Children über Lobotomized-Owl-Selector
   mit !important, da WP Job Manager / TwentyTwentyFive-Defaults
   margin-bottom auf form-children resetten */
.akjobs-newsletter .akjobs-newsletter__form > * + * {
  margin-top: 0.75rem !important;
}
.akjobs-newsletter__hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.akjobs-newsletter__label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.akjobs-newsletter__row {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: stretch;
}
.akjobs-newsletter .akjobs-newsletter__form input[type="email"] {
  flex: 1;
  min-width: 0;
  height: 2.5rem;
  min-height: 0;
  padding: 0 0.85rem;
  font-family: inherit;
  font-size: 0.9375rem;
  line-height: 1.2;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 6px;
  color: var(--wp--preset--color--primary, #001e40);
  transition: border-color 0.15s, box-shadow 0.15s;
  box-sizing: border-box;
}
.akjobs-newsletter__form input[type="email"]:focus {
  outline: none;
  border-color: #fff;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}
.akjobs-newsletter__consent {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.75rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.82);
  cursor: pointer;
  text-align: left;
}
.akjobs-newsletter__consent input[type="checkbox"] {
  flex-shrink: 0;
  margin-top: 0.2rem;
  width: 0.9rem;
  height: 0.9rem;
  accent-color: var(--wp--preset--color--primary, #001e40);
  cursor: pointer;
}
.akjobs-newsletter__consent a {
  color: #fff;
  text-decoration: underline;
}
.akjobs-newsletter .akjobs-newsletter__submit {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 2.5rem;
  min-height: 0;
  padding: 0 1.4rem;
  font-family: inherit;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1;
  background: var(--wp--preset--color--tertiary-fixed, #ffdea5);
  color: var(--wp--preset--color--primary, #001e40);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: box-shadow 0.15s, transform 0.05s;
  white-space: nowrap;
}
.akjobs-newsletter__submit:hover:not(:disabled) {
  box-shadow: 0 4px 12px rgba(255, 222, 165, 0.35);
  transform: translateY(-1px);
}
.akjobs-newsletter__submit:active:not(:disabled) {
  transform: translateY(1px);
}
.akjobs-newsletter__submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}
.akjobs-newsletter__submit-spinner {
  display: none;
  width: 0.9rem;
  height: 0.9rem;
  margin-left: 0.4rem;
  vertical-align: middle;
  border: 2px solid rgba(0, 31, 66, 0.3);
  border-top-color: var(--wp--preset--color--primary, #001e40);
  border-radius: 50%;
  animation: akjobs-spin 0.7s linear infinite;
}
.akjobs-newsletter.is-loading .akjobs-newsletter__submit-spinner {
  display: inline-block;
}
@keyframes akjobs-spin {
  to { transform: rotate(360deg); }
}
.akjobs-newsletter__status {
  font-size: 0.8125rem;
  line-height: 1.45;
  min-height: 1rem;
  color: rgba(255, 255, 255, 0.92);
}
.akjobs-newsletter__status.is-success {
  color: #b6f0c9;
}
.akjobs-newsletter__status.is-error {
  color: #ffc4c0;
}

.akjobs-newsletter--compact {
  padding: 2rem 1.5rem;
  margin-top: 2rem;
}
.akjobs-newsletter--compact .akjobs-newsletter__intro {
  margin-bottom: 1rem;
  font-size: 0.9375rem;
}

@media (max-width: 600px) {
  .akjobs-newsletter {
    padding: 2rem 1.25rem;
    background-position: right center;
  }
  .akjobs-newsletter__title {
    font-size: 1.5rem;
  }
  .akjobs-newsletter__row {
    flex-direction: column;
  }
  /* Größere Touch-Targets + 16px Schrift verhindert iOS-Auto-Zoom beim Fokussieren.
     !important schlägt eventuelle Plugin-/Theme-Resets (analog zur form>* Lobotomized-Owl-Regel oben). */
  .akjobs-newsletter .akjobs-newsletter__form input[type="email"] {
    height: 3rem !important;
    min-height: 3rem !important;
    font-size: 1rem !important;
    padding: 0 1rem !important;
    line-height: 1.2 !important;
  }
  .akjobs-newsletter .akjobs-newsletter__submit {
    width: 100% !important;
    height: 3rem !important;
    min-height: 3rem !important;
    font-size: 1rem !important;
    padding: 0 1.4rem !important;
  }
}

/* ════════════════════════════════════════════════════════════════════
   Ratgeber (CPT)
   ════════════════════════════════════════════════════════════════════ */

/* Hero (Single, Academics-Style) ------------------------------------ */
/* Full-Width Brand-Blau Banner mit Pill -> Titel -> Bild -> Excerpt -> Meta.
   Bricht aus dem 760px-Content-Container per alignfull aus. */
.akjobs-ratgeber-hero-wrap {
  padding: 0;
}
.akjobs-ratgeber-hero {
  background: linear-gradient(135deg, #001e40 0%, #003366 100%);
  color: #fff;
  padding: 3rem 1.25rem 3.25rem;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0;
  margin-bottom: 3rem;
  width: 100vw;
  max-width: 100vw;
  box-sizing: border-box;
  overflow: hidden;
}
.akjobs-ratgeber-hero__inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.akjobs-ratgeber-hero__topline {
  margin-bottom: 1rem;
}
.akjobs-ratgeber-hero__pill {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 500;
  padding: 0.3rem 0.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  text-decoration: none;
  letter-spacing: 0.03em;
  border: 1px solid rgba(255, 255, 255, 0.2);
  transition: background 0.15s ease;
}
.akjobs-ratgeber-hero__pill:hover {
  background: rgba(255, 255, 255, 0.22);
}
.akjobs-ratgeber-hero__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.75rem, 4vw, 2.875rem);
  line-height: 1.18;
  margin: 0 0 1.5rem;
  color: #fff;
  max-width: 960px;
}
.akjobs-ratgeber-hero__figure {
  width: 100%;
  max-width: 720px;
  margin: 0 0 1.5rem;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}
.akjobs-ratgeber-hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.akjobs-ratgeber-hero__excerpt {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 1.5rem;
  max-width: 640px;
}
.akjobs-ratgeber-hero__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.4rem 1rem;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.7);
}
.akjobs-ratgeber-hero__meta-item {
  position: relative;
  padding-left: 1rem;
}
.akjobs-ratgeber-hero__meta-item::before {
  content: "·";
  position: absolute;
  left: 0;
  color: rgba(255, 255, 255, 0.4);
}
.akjobs-ratgeber-hero__meta-item:first-child {
  padding-left: 0;
}
.akjobs-ratgeber-hero__meta-item:first-child::before {
  content: none;
}

/* Article body ------------------------------------------------------ */
.akjobs-ratgeber-article {
  font-size: 1.0625rem;
  line-height: 1.7;
}
.akjobs-ratgeber-article h2 {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-weight: 700;
  font-size: 1.7rem;
  margin: 3.75rem 0 1rem;
  line-height: 1.25;
  color: var(--wp--preset--color--primary, #001e40);
  scroll-margin-top: 6rem; /* Anker-Sprung-Offset wegen Sticky-Header */
}
/* Erstes H2 nach dem Intro nicht uebermaessig weit abstossen */
.akjobs-ratgeber-article > .wp-block-post-content > h2:first-child {
  margin-top: 1.5rem;
}
.akjobs-ratgeber-article h3 {
  font-weight: 600;
  font-size: 1.25rem;
  margin: 1.75rem 0 0.5rem;
}
.akjobs-ratgeber-article p,
.akjobs-ratgeber-article ul,
.akjobs-ratgeber-article ol {
  margin: 0 0 1rem;
}
/* Tabellen: WP-Block-Wrapper UND nackte Tabellen einheitlich
   - Width 100% inkl. is-style-stripes-Variante (Core-Default ist auto)
   - Header in Primary-Blau + weisser Schrift + Gold-Bottom-Border
   - Eigenes Zebra-Striping (Core's is-style-stripes-Hintergrund wird ueberschrieben)
   - Caption italic, kleiner, dezent */
.akjobs-ratgeber-article .wp-block-table {
  width: 100%;
  margin: 1.75rem 0;
}
.akjobs-ratgeber-article .wp-block-table table,
.akjobs-ratgeber-article table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
  font-size: 0.9375rem;
  border: 1px solid rgba(0, 30, 64, 0.12);
  border-radius: 6px;
  overflow: hidden;
  table-layout: fixed;
  word-wrap: break-word;
}
.akjobs-ratgeber-article .wp-block-table thead,
.akjobs-ratgeber-article table thead {
  background: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-article .wp-block-table th,
.akjobs-ratgeber-article table th {
  background: var(--wp--preset--color--primary, #001e40) !important;
  color: #fff !important;
  font-weight: 600;
  text-align: left;
  padding: 0.7rem 0.9rem;
  border: 0;
  border-bottom: 2px solid var(--wp--preset--color--tertiary-fixed, #d4af37);
  letter-spacing: 0.01em;
}
.akjobs-ratgeber-article .wp-block-table td,
.akjobs-ratgeber-article table td {
  background: #fff;
  padding: 0.65rem 0.9rem;
  border: 0;
  border-bottom: 1px solid rgba(0, 30, 64, 0.08);
  vertical-align: top;
}
/* Saubere deutsche Silbentrennung in Zellen statt Mitten-im-Wort-Bruch
   (table-layout:fixed quetscht lange Komposita sonst hart um) */
.akjobs-ratgeber-article .wp-block-table th,
.akjobs-ratgeber-article table th,
.akjobs-ratgeber-article .wp-block-table td,
.akjobs-ratgeber-article table td {
  -webkit-hyphens: auto;
  hyphens: auto;
}
.akjobs-ratgeber-article .wp-block-table tbody tr:nth-child(even) td,
.akjobs-ratgeber-article table tbody tr:nth-child(even) td {
  background: rgba(0, 30, 64, 0.03);
}
.akjobs-ratgeber-article .wp-block-table tbody tr:last-child td,
.akjobs-ratgeber-article table tbody tr:last-child td {
  border-bottom: 0;
}
/* Core's is-style-stripes ueberschreibt nth-child mit eigenem BG — neutralisieren */
.akjobs-ratgeber-article .wp-block-table.is-style-stripes,
.akjobs-ratgeber-article .wp-block-table.is-style-stripes table {
  border-color: rgba(0, 30, 64, 0.12);
}
.akjobs-ratgeber-article .wp-block-table.is-style-stripes tbody tr {
  background: transparent;
}
.akjobs-ratgeber-article .wp-block-table.is-style-stripes tbody tr:nth-child(even) td {
  background: rgba(0, 30, 64, 0.03);
}
.akjobs-ratgeber-article .wp-block-table figcaption,
.akjobs-ratgeber-article .wp-block-table .wp-element-caption {
  font-style: italic;
  font-size: 0.8125rem;
  color: rgba(0, 30, 64, 0.6);
  margin-top: 0.5rem;
  text-align: left;
}

/* Quellenangabe unter Tabellen — abgesetzte Box, schliesst an die Tabelle an */
.akjobs-ratgeber-article .akjobs-ratgeber-quelle {
  margin: -1rem 0 1.85rem;
  padding: 0.55rem 0.85rem 0.6rem 0.85rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: #51607a;
  background: rgba(0, 30, 64, 0.04);
  border-left: 3px solid var(--wp--preset--color--tertiary-fixed, #d4af37);
  border-radius: 0 6px 6px 0;
}
.akjobs-ratgeber-article .akjobs-ratgeber-quelle a {
  color: inherit;
  text-decoration: underline;
}

/* Fachbereich-Icon-Boxen werden seit dem Industriepromotion-Artikel (06/2026) als
   rohes HTML mit Inline-<style> direkt im Beitragsinhalt ausgeliefert (Klassen
   akjobs-fb-*). Grund: WP-Rocket-„Used CSS" cached Theme-CSS-Aenderungen stale, und
   wp-block-group bricht das CSS-Grid-Stretch. Inline-im-Content umgeht beides.
   Daher hier bewusst KEINE Theme-CSS fuer diese Komponente. */

/* Article: Info-Box & Take-Away (Block-Pattern-Konsumenten) -------- */
.akjobs-ratgeber-infobox {
  background: rgba(0, 30, 64, 0.04);
  border-left: 3px solid rgba(0, 30, 64, 0.3);
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  border-radius: 0 8px 8px 0;
}
.akjobs-ratgeber-infobox p:last-child {
  margin-bottom: 0;
}
.akjobs-ratgeber-takeaway {
  background: linear-gradient(180deg, rgba(212, 175, 55, 0.1) 0%, rgba(212, 175, 55, 0.04) 100%);
  border-left: 4px solid var(--wp--preset--color--tertiary-fixed, #d4af37);
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  border-radius: 0 8px 8px 0;
  font-weight: 500;
}
.akjobs-ratgeber-takeaway::before {
  content: "Take-Away";
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(0, 30, 64, 0.6);
  margin-bottom: 0.25rem;
  font-weight: 600;
}

/* Article: W-Besoldung Bundeslaender-Box (Cross-Link Master <-> Land) -- */
.akjobs-laender-box {
  margin: 2rem 0;
  padding: 1.15rem 1.4rem 1.25rem;
  background: linear-gradient(180deg, rgba(0, 30, 64, 0.06) 0%, rgba(0, 30, 64, 0.025) 100%);
  border: 1px solid rgba(0, 30, 64, 0.12);
  border-left: 4px solid var(--wp--preset--color--tertiary-fixed, #d4af37);
  border-radius: 0 10px 10px 0;
}
.akjobs-laender-box__title {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  color: var(--wp--preset--color--primary, #001e40);
}
.akjobs-laender-box__title strong {
  font-weight: 700;
}
.akjobs-laender-box__intro {
  margin: 0 0 0.85rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: #3a4660;
}
.akjobs-laender-box__list {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.9;
}
.akjobs-laender-box__list a {
  color: var(--wp--preset--color--primary, #001e40);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.akjobs-laender-box__list a:hover {
  color: var(--wp--preset--color--tertiary-fixed, #d4af37);
}
.akjobs-laender-box__current {
  color: var(--wp--preset--color--primary, #001e40);
  font-weight: 700;
}
.akjobs-laender-box__sep {
  color: rgba(0, 30, 64, 0.35);
  margin: 0 0.15rem;
}

/* Article: Vergleichs-Karten (a. D. vs. em., Laender AT/CH) --------- */
.akjobs-ratgeber-article .akjobs-vergleich {
  margin: 1.75rem 0 2rem;
}
.akjobs-ratgeber-article .akjobs-vergleich-card {
  background: #fff;
  border: 1px solid rgba(0, 30, 64, 0.12);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0, 30, 64, 0.07);
  height: 100%;
  padding: 0;
}
/* Aufeinanderfolgende, gestapelte Karten (AT/CH) */
.akjobs-ratgeber-article .akjobs-vergleich-card + .akjobs-vergleich-card {
  margin-top: 1rem;
}
/* Gestapelte Einzelkarten: Abstand zum Folgeinhalt; in Spalten regelt das Grid den Abstand */
.akjobs-ratgeber-article .akjobs-vergleich-card {
  margin-bottom: 1.75rem;
}
.akjobs-ratgeber-article .wp-block-column > .akjobs-vergleich-card {
  margin-bottom: 0;
}
.akjobs-ratgeber-article .akjobs-vergleich-card__title {
  margin: 0;
  padding: 0.7rem 1.15rem;
  font-size: 1.05rem;
  line-height: 1.3;
  color: #fff;
  background: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-article .akjobs-vergleich-card__title strong {
  font-weight: 700;
}
.akjobs-ratgeber-article .akjobs-vergleich-card__title span {
  font-weight: 400;
  font-size: 0.8125rem;
  opacity: 0.82;
}
.akjobs-ratgeber-article .akjobs-vergleich-card--em .akjobs-vergleich-card__title {
  background: linear-gradient(135deg, #a9841a 0%, #d4af37 100%);
  color: #1a1400;
}
.akjobs-ratgeber-article .akjobs-vergleich-card--em .akjobs-vergleich-card__title span {
  opacity: 0.7;
}
.akjobs-ratgeber-article .akjobs-vergleich-card ul {
  margin: 0;
  padding: 0.9rem 1.25rem 1rem 2.25rem;
  font-size: 0.9375rem;
  line-height: 1.55;
}
.akjobs-ratgeber-article .akjobs-vergleich-card li {
  margin: 0 0 0.45rem;
}
.akjobs-ratgeber-article .akjobs-vergleich-card li:last-child {
  margin-bottom: 0;
}
/* Karten in Spalten gleich hoch + auf Mobile sauberer Abstand */
.akjobs-ratgeber-article .akjobs-vergleich.wp-block-columns {
  gap: 1rem;
}
@media (max-width: 781px) {
  .akjobs-ratgeber-article .akjobs-vergleich.wp-block-columns .wp-block-column + .wp-block-column {
    margin-top: 1rem;
  }
}

/* Inhaltsverzeichnis ----------------------------------------------- */
.akjobs-ratgeber-toc {
  background: rgba(0, 30, 64, 0.03);
  border: 1px solid rgba(0, 30, 64, 0.08);
  border-radius: 8px;
  margin: 0 0 2rem;
}
.akjobs-ratgeber-toc__toggle {
  appearance: none;
  -webkit-appearance: none;
  display: block;
  position: relative;
  width: 100%;
  height: 40px;
  line-height: 40px; /* vertical-center via line-height = height (single-line, bombenfest) */
  padding: 0 2.5rem 0 1rem; /* rechts Platz fuer Chevron */
  margin: 0;
  background: none;
  border: 0;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 600;
  text-align: left;
  color: var(--wp--preset--color--primary, #001e40);
  cursor: pointer;
  box-sizing: border-box;
}
.akjobs-ratgeber-toc__chevron {
  position: absolute;
  right: 0.9rem;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1;
  transition: transform 0.18s ease;
}
.akjobs-ratgeber-toc__toggle[aria-expanded="true"] .akjobs-ratgeber-toc__chevron {
  transform: translateY(-50%) rotate(180deg);
}
.akjobs-ratgeber-toc__list {
  display: none;
  list-style: none;
  margin: 0 !important; /* gegen ol-default 1em vom Parent-Theme/WP-Core */
  padding: 0;
  counter-reset: toc;
}
.akjobs-ratgeber-toc__list.is-open {
  display: block;
  margin: 0 !important;
  padding-top: 0.5rem !important;
  padding-right: 1rem !important;
  padding-bottom: 0.5rem !important;
  padding-left: 2.25rem !important;
  border-top: 1px solid rgba(0, 30, 64, 0.08);
}
.akjobs-ratgeber-toc__list li {
  counter-increment: toc;
  margin: 0.25rem 0;
  font-size: 0.9375rem;
}
.akjobs-ratgeber-toc__list li::before {
  content: counter(toc) ". ";
  color: rgba(0, 30, 64, 0.4);
  margin-right: 0.25rem;
}
.akjobs-ratgeber-toc__list a {
  color: rgba(0, 30, 64, 0.8);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.akjobs-ratgeber-toc__list a:hover {
  border-bottom-color: currentColor;
}

/* Archive (Card-Grid) ----------------------------------------------- */
.akjobs-ratgeber-archive {
  max-width: 1200px;
  margin: 0 auto;
}
.akjobs-ratgeber-archive__head {
  margin-bottom: 1.5rem;
}
.akjobs-ratgeber-archive__head h1 {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-weight: 500;
  font-size: clamp(2rem, 4vw, 3rem);
  margin: 0 0 0.5rem;
  color: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-archive__lead {
  font-size: 1.0625rem;
  color: rgba(0, 30, 64, 0.7);
  max-width: 720px;
  margin: 0;
}
.akjobs-ratgeber-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1.5rem 0 2rem;
  border-bottom: 1px solid rgba(0, 30, 64, 0.1);
  padding-bottom: 0.75rem;
}
.akjobs-ratgeber-tab {
  background: none;
  border: 1px solid rgba(0, 30, 64, 0.15);
  border-radius: 999px;
  padding: 0.4rem 0.9rem;
  font-family: inherit;
  font-size: 0.875rem;
  color: rgba(0, 30, 64, 0.7);
  cursor: pointer;
  transition: all 0.15s ease;
}
.akjobs-ratgeber-tab:hover {
  border-color: var(--wp--preset--color--primary, #001e40);
  color: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-tab.is-active {
  background: var(--wp--preset--color--primary, #001e40);
  border-color: var(--wp--preset--color--primary, #001e40);
  color: #fff;
}

.akjobs-ratgeber-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem;
}
.akjobs-ratgeber-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border: 1px solid rgba(0, 30, 64, 0.08);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.akjobs-ratgeber-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 30, 64, 0.08);
}
.akjobs-ratgeber-card__thumb {
  aspect-ratio: 16 / 9;
  background-size: cover;
  background-position: center;
  background-color: #f4efe5;
}
.akjobs-ratgeber-card__thumb--placeholder {
  background: linear-gradient(135deg, rgba(0, 30, 64, 0.08) 0%, rgba(0, 30, 64, 0.02) 100%);
}
.akjobs-ratgeber-card__body {
  padding: 1rem 1.125rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}
.akjobs-ratgeber-card__pill {
  align-self: flex-start;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  background: rgba(0, 30, 64, 0.06);
  color: rgba(0, 30, 64, 0.7);
}
.akjobs-ratgeber-card__title {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.3;
  margin: 0;
  color: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-card__excerpt {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: rgba(0, 30, 64, 0.7);
  margin: 0;
}
.akjobs-ratgeber-card__meta {
  font-size: 0.8125rem;
  color: rgba(0, 30, 64, 0.55);
  margin-top: auto;
}
.akjobs-ratgeber-empty {
  font-style: italic;
  color: rgba(0, 30, 64, 0.6);
  padding: 2rem 0;
  text-align: center;
}
.akjobs-ratgeber-pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin: 2.5rem 0 0;
  flex-wrap: wrap;
}
.akjobs-ratgeber-pagination a,
.akjobs-ratgeber-pagination span {
  padding: 0.4rem 0.8rem;
  border-radius: 6px;
  text-decoration: none;
  color: rgba(0, 30, 64, 0.7);
  border: 1px solid rgba(0, 30, 64, 0.1);
}
.akjobs-ratgeber-pagination .current {
  background: var(--wp--preset--color--primary, #001e40);
  color: #fff;
  border-color: transparent;
}

/* Hub-Related auf Single-Ratgeber (Stellen + weitere Ratgeber) ----- */
/* Full-Bleed-Band ueber die volle Breite (via centerWideBlocks), buendig zum Footer. */
.akjobs-hub-related--ratgeber {
  background: rgba(0, 30, 64, 0.03);
  border-left: 0;
  border-radius: 0;
  box-sizing: border-box;
  margin: 3rem 0 0;
  padding: 2.5rem 1.5rem;
}
.akjobs-hub-related--ratgeber .akjobs-hub-related__inner {
  max-width: 1100px;
  margin: 0 auto;
}
.akjobs-hub-related--ratgeber .akjobs-hub-related__title {
  margin-bottom: 1rem;
}
.akjobs-hub-related--stellen .akjobs-hub-related__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.5rem;
}
.akjobs-hub-related-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(0, 30, 64, 0.08);
  border-radius: 6px;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease, transform 0.15s ease;
}
.akjobs-hub-related-card:hover {
  background: #fff;
  transform: translateX(2px);
}
.akjobs-hub-related-card__name {
  font-weight: 500;
  font-size: 0.9375rem;
}
.akjobs-hub-related-card__count {
  font-size: 0.8125rem;
  color: rgba(0, 30, 64, 0.6);
  white-space: nowrap;
}

@media (max-width: 720px) {
  .akjobs-ratgeber-hero {
    padding: 2rem 1rem 2.25rem;
    margin-bottom: 2rem;
  }
  .akjobs-ratgeber-hero__title {
    font-size: 1.6rem;
    line-height: 1.2;
    margin-bottom: 1.25rem;
  }
  .akjobs-ratgeber-hero__figure {
    margin-bottom: 1.25rem;
    border-radius: 8px;
  }
  .akjobs-ratgeber-hero__excerpt {
    font-size: 0.9375rem;
    line-height: 1.55;
    margin-bottom: 1.25rem;
  }
  .akjobs-ratgeber-hero__meta {
    font-size: 0.75rem;
    gap: 0.25rem 0.75rem;
  }
  .akjobs-ratgeber-hero__pill {
    font-size: 0.75rem;
    padding: 0.25rem 0.7rem;
  }
  .akjobs-ratgeber-article {
    font-size: 1rem;
  }
  .akjobs-ratgeber-article h2 {
    font-size: 1.375rem;
    margin-top: 3rem;
  }
  .akjobs-ratgeber-card-grid {
    grid-template-columns: 1fr;
  }
  /* Tabellen bei sehr schmalen Viewports horizontal scrollbar machen,
     damit zwei-/drei-spaltige Tabellen nicht durch table-layout:fixed
     unleserlich gequetscht werden */
  .akjobs-ratgeber-article .wp-block-table {
    overflow-x: auto;
  }
  .akjobs-ratgeber-article .wp-block-table table,
  .akjobs-ratgeber-article table {
    min-width: 520px;
  }
  /* Hub-Body-Tabellen (Stellenart-/Fachgebiet-Hubs) NICHT auf 520px zwingen:
     sie haben keinen overflow-x-Scroll-Container und wuerden sonst mobil rechts
     ueber den Viewport ragen. Die schlanken 2-Spalten-Gehaltstabellen passen
     sich stattdessen der Breite an. Hoehere Spezifitaet schlaegt die 520px-Regel. */
  .akjobs-hub-body.akjobs-ratgeber-article .wp-block-table table,
  .akjobs-hub-body.akjobs-ratgeber-article table {
    min-width: 0;
  }
}

/* Anti-Overflow-Guard fuer den 100vw-Hero auf Single-Ratgeber-Pages.
   overflow-x: clip ist die moderne Variante von hidden: schneidet nur
   horizontal ab, ohne Body als scroll-container zu setzen (was Mobile-
   sticky-Position-Sachen brechen kann). Globaler Scope, weil die WP-
   Body-Klasse je nach Plugin-Setup nicht zuverlaessig `single-ratgeber`
   bekommt. Wirkt nur, wenn etwas darunter ueber 100vw rausragt. */
html, body {
  overflow-x: clip;
}

/* ===== Partner-Grid (Shortcode [akjobs_partners], Seite /partner/) ===== */
.akjobs-partner-grid {
  display: grid;
  grid-template-columns: repeat(var(--akjobs-partner-cols, 4), 1fr);
  gap: 1.25rem;
  margin: 2rem 0;
}
.akjobs-partner-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1.5rem 1rem;
  min-height: 140px;
  background: var(--wp--preset--color--surface-container-lowest, #fff);
  border: 1px solid var(--wp--preset--color--outline, #d8dde3);
  border-radius: 12px;
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.akjobs-partner-card:hover {
  border-color: var(--wp--preset--color--primary, #001e40);
  box-shadow: 0 6px 20px rgba(0, 30, 64, .10);
  transform: translateY(-2px);
}
.akjobs-partner-card__logo {
  max-width: 100%;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.akjobs-partner-card__logo--text {
  font-family: var(--wp--preset--font-family--newsreader, Georgia, serif);
  font-style: italic;
  font-size: 1.25rem;
  line-height: 1.2;
  color: var(--wp--preset--color--primary, #001e40);
  text-align: center;
}
.akjobs-partner-card__name {
  font-size: .9rem;
  font-weight: 500;
  color: var(--wp--preset--color--on-surface, #1a1c1e);
  text-align: center;
}
.akjobs-partner-card--nolink { cursor: default; }
.akjobs-partner-empty { color: var(--wp--preset--color--on-surface-variant, #5a5f66); }

@media (max-width: 900px) {
  .akjobs-partner-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .akjobs-partner-grid { grid-template-columns: repeat(2, 1fr); gap: .85rem; }
  .akjobs-partner-card { min-height: 110px; padding: 1rem .75rem; }
  .akjobs-partner-card__logo { max-height: 48px; }
}

/* ===== Ratgeber: Übersichts-Box „Das Wichtigste in Kürze" ===== */
.akjobs-ratgeber-summary {
  background: rgba(0, 30, 64, 0.05);
  border-left: 4px solid var(--wp--preset--color--secondary, #c8a04b);
  border-radius: 8px;
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0 2rem;
}
.akjobs-ratgeber-summary__title {
  font-size: 1.1rem;
  margin: 0 0 0.5rem !important;
  color: var(--wp--preset--color--primary, #001e40);
}
.akjobs-ratgeber-summary ul { margin: 0 !important; padding-left: 1.1rem; }
.akjobs-ratgeber-summary li { margin: 0.35rem 0; }

/* ===== Ratgeber: Job-Karussell (Shortcode [akjobs_prof_carousel]) ===== */
/* Farbiges Band, deutlich breiter als die Textspalte und auf den Viewport
   zentriert. margin-left:50% + translateX(-50%) zentriert auf die Spaltenmitte
   (= Viewport-Mitte), width:min(...) haelt es responsiv und ohne Overflow. */
.akjobs-ratgeber-article .akjobs-jobcarousel {
  width: min(92vw, 1100px);
  max-width: none;
  margin: 2.75rem 0;
  margin-left: 50%;
  transform: translateX(-50%);
  padding: 2.5rem 0;
  background: linear-gradient(135deg, #001e40 0%, #003366 100%);
  border-radius: 14px;
  box-sizing: border-box;
}
/* Heading + Intro im blauen Band (weisser Text, zentriert).
   Mit .akjobs-ratgeber-article praefixiert, sonst gewinnt die globale
   .akjobs-ratgeber-article h2 / p Regel (hoehere Spezifitaet) und faerbt
   die Ueberschrift dunkelblau -> auf dem Band unsichtbar. */
.akjobs-ratgeber-article .akjobs-jobcarousel__heading {
  font-family: var(--wp--preset--font-family--newsreader), Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.4rem, 2.6vw, 1.9rem);
  line-height: 1.2;
  color: #fff;
  text-align: center;
  margin: 0 0 0.5rem;
}
.akjobs-ratgeber-article .akjobs-jobcarousel__intro {
  color: rgba(255, 255, 255, 0.85);
  text-align: center;
  font-size: 1rem;
  line-height: 1.55;
  max-width: 640px;
  margin: 0 auto 1.75rem;
}
.akjobs-jobcarousel__inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 1.25rem;
}
.akjobs-jobcarousel__viewport {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.akjobs-jobcarousel__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scroll-behavior: smooth;
  padding: 0.5rem 0.25rem;
  flex: 1 1 auto;
  -webkit-overflow-scrolling: touch;
  /* Scrollbar ausblenden — Position wird ueber die Punkt-Anzeige kommuniziert */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.akjobs-jobcarousel__track::-webkit-scrollbar { display: none; }
/* Carousel-Cards verwenden dasselbe Markup/Styling wie die Startseiten-Card
   (.akjobs-job-card). Hier nur die Carousel-spezifischen Overrides: feste,
   etwas schmalere Breite + Scroll-Snap. Padding leicht reduziert, damit der
   Inhalt in der schmaleren Karte nicht eingequetscht wirkt. */
.akjobs-jobcarousel__track .akjobs-job-card {
  flex: 0 0 360px;
  scroll-snap-align: start;
  padding: 1.25rem 1.4rem;
}
.akjobs-jobcarousel__nav {
  flex: 0 0 auto;
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid var(--wp--preset--color--outline, #d8dde3);
  background: #fff;
  color: var(--wp--preset--color--primary, #001e40);
  font-size: 1.6rem; line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s ease, opacity .15s ease;
}
.akjobs-jobcarousel__nav:hover:not(:disabled) { background: #eef2f8; }
.akjobs-jobcarousel__nav:disabled { opacity: .3; cursor: default; }
.akjobs-jobcarousel__actions {
  display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; justify-content: center;
}
/* Buttons auf dem blauen Band: weiss gefuellt, damit sie sich abheben
   (dunkelblau auf dunkelblau waere unsichtbar). Beide Buttons gleich breit
   (flex: 1 1 240px + gemeinsamer max-width) und Text zentriert, auch wenn er
   bei einem Button auf zwei Zeilen umbricht. */
.akjobs-jobcarousel__btn {
  flex: 1 1 240px;
  max-width: 340px;
  display: flex; align-items: center; justify-content: center;
  padding: .75rem 1.4rem; border-radius: 8px;
  font-size: .9rem; font-weight: 600; text-decoration: none; text-align: center;
  background: #fff; color: var(--wp--preset--color--primary, #001e40);
  border: 1px solid #fff;
}
.akjobs-jobcarousel__btn:hover { opacity: .9; }

/* Scroll-Status (academics-Style): aktiver Pill in Gold, uebrige als Punkte. */
.akjobs-jobcarousel__progress {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.45rem;
  margin: 1.5rem 0 0;
}
.akjobs-jobcarousel__dot {
  width: 8px; height: 8px;
  padding: 0; border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.35);
  cursor: pointer;
  transition: width .25s ease, background .25s ease;
}
.akjobs-jobcarousel__dot.is-active {
  width: 26px;
  background: var(--wp--preset--color--tertiary-fixed, #ffdea5);
}
.akjobs-jobcarousel__dot:hover:not(.is-active) {
  background: rgba(255, 255, 255, 0.6);
}
@media (max-width: 600px) {
  .akjobs-jobcarousel__nav { display: none; }
  .akjobs-jobcarousel__track .akjobs-job-card { flex-basis: 82%; }
  /* Buttons gestapelt auf volle, gleiche Breite (Cap aufheben) */
  .akjobs-jobcarousel__btn { max-width: none; flex-basis: 100%; }
}

/* (#3) Newsletter im Ratgeber: nur etwas breiter als die Textspalte (wie Startseite),
   viewport-zentriert, NICHT full-bleed */
.akjobs-ratgeber-article .akjobs-newsletter {
  width: min(90vw, 880px);
  max-width: none;
  margin: 3rem 0;
  margin-left: 50%;
  transform: translateX(-50%);
  box-sizing: border-box;
}
/* Newsletter-Titel ist ein <h2>: die Ratgeber-h2-Regel ueberschreibt sonst das
   margin:0 auto und schiebt die Titel-Box nach links → hier wieder zentrieren. */
.akjobs-ratgeber-article .akjobs-newsletter__title {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}