/* ===================================================================
 * paricon stellenanzeige CSS – on-brand Stellenanzeige template
 * Loaded on the 12 job-page IDs only (see paricon-kit-css.php).
 * Mobile-first responsive. en-dashes only. paricon lowercase.
 * =================================================================== */

:root {
  --prc-cyan: #02CBFF;
  --prc-navy: #192D41;
  --prc-body: #1A2032;
  --prc-pink: #FF0071;
  --prc-white: #FFFFFF;
  --prc-muted: rgba(255,255,255,.55);
  --prc-meta: #948A54;
  --prc-card: #1f3450;
  --prc-card-hi: #243a59;
  --prc-radius: 14px;
  --prc-radius-lg: 22px;
  --prc-shadow: 0 8px 32px rgba(0,0,0,.35);
  --prc-anchor-offset: 96px;
  --prc-font: 'Barlow', 'Barlow Semi Condensed', system-ui, sans-serif;
}

/* ----- Reset within the new template scope ----- */
.prc-stellen-wrap,
.prc-stellen-wrap * {
  box-sizing: border-box;
  font-family: var(--prc-font);
}
/* Wrap uses BODY (#1A2032) to match the rest of the site's default
 * darker background. Section elements (.prc-hero, .prc-kpi-strip,
 * .prc-apply-cta) keep NAVY (#192D41) for elevation/contrast. */
.prc-stellen-wrap {
  background: var(--prc-body);
  color: var(--prc-muted);
  width: 100%;
  overflow-x: hidden;
}

/* Override Elementor page-level motion-effects layer that sets a NAVY
 * background on a handful of stellenanzeige pages (posts 2585, 2616,
 * 2626). The layer renders behind the wrap and bleeds through any gap.
 * Neutralize it so all 8 job pages match. (2026-05-26) */
body[class*="elementor-page-"] > .elementor-motion-effects-container > .elementor-motion-effects-layer {
  background-color: transparent !important;
  background-image: none !important;
}
.prc-stellen-wrap a { color: var(--prc-cyan); text-decoration: none; }
.prc-stellen-wrap a:hover { text-decoration: underline; }

/* Anchor scroll offset so sticky nav doesn't cover headings */
.prc-stellen-wrap [id] {
  scroll-margin-top: var(--prc-anchor-offset);
}

/* ----- Shared section layout ----- */
.prc-stellen-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 24px;
}
@media (min-width: 768px) {
  .prc-stellen-section { padding: 80px 32px; }
}
@media (min-width: 1024px) {
  .prc-stellen-section { padding: 96px 40px; }
}

/* ----- Eyebrow label (CYAN uppercase) ----- */
.prc-eyebrow {
  display: inline-block;
  color: var(--prc-cyan);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 18px;
  font-family: 'Barlow Semi Condensed', var(--prc-font);
}

/* ----- Headings ----- */
.prc-h2 {
  color: var(--prc-white);
  font-weight: 700;
  font-size: clamp(28px, 4.5vw, 48px);
  line-height: 1.05;
  letter-spacing: -.5px;
  margin: 0 0 28px;
}
.prc-h3 {
  color: var(--prc-white);
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.15;
  margin: 0 0 12px;
}

/* ===================================================================
 * 1. STICKY ANCHOR NAV
 * =================================================================== */
.prc-anchor-nav {
  /* position: fixed (NOT sticky) — sticky takes 69px in document flow even when
     translated off-screen, creating an unwanted gap between site nav and hero.
     Fixed removes it from flow entirely; the translate animates it in/out. */
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: rgba(25,45,65,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(2,203,255,.18);
  transform: translateY(-110%);
  transition: transform .3s ease;
}
/* When admin bar is visible, drop below it */
body.admin-bar .prc-anchor-nav { top: 32px; }
@media (max-width: 782px) {
  body.admin-bar .prc-anchor-nav { top: 46px; }
}
.prc-anchor-nav.is-visible {
  transform: translateY(0);
}
.prc-anchor-nav-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 24px;
  display: flex;
  gap: 8px;
  align-items: center;
  overflow-x: auto;
  scrollbar-width: none;
}
.prc-anchor-nav-inner::-webkit-scrollbar { display: none; }
.prc-anchor-nav a {
  color: var(--prc-muted);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  white-space: nowrap;
  position: relative;
  transition: color .2s ease, background .2s ease;
}
.prc-anchor-nav a:hover,
.prc-anchor-nav a.is-active {
  color: var(--prc-white);
  text-decoration: none;
  background: rgba(2,203,255,.1);
}
.prc-anchor-nav a.is-active::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 2px;
  height: 2px;
  background: var(--prc-cyan);
  border-radius: 2px;
}
.prc-anchor-nav .prc-anchor-apply {
  margin-left: auto;
  background: var(--prc-cyan);
  color: var(--prc-white) !important;
  padding: 8px 18px;
}
.prc-anchor-nav .prc-anchor-apply:hover {
  background: #00b8e6;
  text-decoration: none;
}

/* ===================================================================
 * 2. HERO
 * =================================================================== */
.prc-hero {
  background: var(--prc-navy);
  position: relative;
  overflow: hidden;
}
.prc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(60% 80% at 100% 0%, rgba(2,203,255,.12), transparent 60%),
    radial-gradient(50% 60% at 0% 100%, rgba(255,0,113,.07), transparent 70%);
  pointer-events: none;
}
.prc-hero-inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px 64px;
  display: grid;
  gap: 40px;
  grid-template-columns: 1fr;
}
@media (min-width: 1024px) {
  .prc-hero-inner {
    grid-template-columns: 6fr 4fr;
    padding: 120px 40px 96px;
    align-items: center;
    gap: 64px;
  }
}
.prc-hero h1 {
  color: var(--prc-white);
  font-weight: 700;
  font-size: clamp(40px, 7.5vw, 72px);
  line-height: 1;
  letter-spacing: -1.5px;
  margin: 0 0 28px;
  text-transform: none;
}
.prc-hero-lead {
  color: var(--prc-muted);
  font-size: clamp(16px, 1.6vw, 19px);
  line-height: 1.55;
  margin: 0 0 32px;
  max-width: 560px;
}

/* Hero meta chip row */
.prc-meta-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.prc-meta-chips li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(2,203,255,.08);
  border: 1px solid rgba(2,203,255,.28);
  color: var(--prc-white);
  font-size: 13px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 999px;
  white-space: nowrap;
}
.prc-meta-chips svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  color: var(--prc-cyan);
}

/* Hero buttons — we emit the SAME native markup that Home + Solution-page CTAs use:
   `<a class="elementor-button elementor-button-link elementor-size-sm">
       <span class="elementor-button-content-wrapper">
         <span class="elementor-button-text">…</span>
       </span>
    </a>`
   On Home + Portfolio that markup gets CYAN bg via the elementor-kit-9 inherited
   button rules. To make sure it ALWAYS renders correctly inside .prc-stellen-wrap
   (independent of kit-CSS loading order) we restate the same visual treatment with
   identical values (CYAN bg, 100px radius, 14px/20px padding, 16/700). */
.prc-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  margin-top: 4px;
}

/* Primary elementor-button CYAN pill (matches Home "Kostenlose Beratung" CTA exactly) */
.prc-stellen-wrap a.elementor-button.prc-hero-cta,
.prc-stellen-wrap a.prc-hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: 'Barlow', system-ui, sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0;
  padding: 14px 20px;
  border-radius: 100px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  text-decoration: none !important;
  background: var(--prc-cyan) !important;
  color: var(--prc-white) !important;
  transition: background .2s ease, transform .15s ease;
  cursor: pointer;
  white-space: nowrap;
}
.prc-stellen-wrap a.elementor-button.prc-hero-cta:hover,
.prc-stellen-wrap a.prc-hero-cta:hover {
  background: #00b8e6 !important;
  color: var(--prc-white) !important;
  transform: translateY(-1px);
  text-decoration: none !important;
}
.prc-stellen-wrap .prc-hero-cta .elementor-button-content-wrapper,
.prc-stellen-wrap .prc-hero-cta .elementor-button-text {
  line-height: 1;
  white-space: nowrap;
  color: inherit;
}

/* Secondary CYAN outline — matches the site's bdt-modal-button "Mehr erfahren"
   pattern from Portfolio pages exactly: transparent bg, 1px CYAN border,
   CYAN text, 6px radius (rounded rect, NOT pill), 14px/20px padding. */
.prc-stellen-wrap a.elementor-button.prc-hero-cta-secondary,
.prc-stellen-wrap a.prc-hero-cta-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: 'Barlow', system-ui, sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0;
  padding: 14px 20px;
  border-radius: 100px; /* STELLEN-5 2026-06-18: was 6px – pill to match primary (shape only; outline fill kept) */
  border: 1px solid var(--prc-cyan) !important;
  text-decoration: none !important;
  background: transparent !important;
  color: var(--prc-cyan) !important;
  transition: background .2s ease, color .2s ease, transform .15s ease;
  cursor: pointer;
  white-space: nowrap;
}
.prc-stellen-wrap a.elementor-button.prc-hero-cta-secondary:hover,
.prc-stellen-wrap a.prc-hero-cta-secondary:hover {
  background: rgba(2, 203, 255, 0.12) !important;
  color: var(--prc-cyan) !important;
  transform: translateY(-1px);
}
.prc-stellen-wrap .prc-hero-cta-secondary .elementor-button-content-wrapper,
.prc-stellen-wrap .prc-hero-cta-secondary .elementor-button-text {
  line-height: 1;
  white-space: nowrap;
  color: inherit;
}

/* Hero photo with corner brackets */
.prc-hero-photo {
  position: relative;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  aspect-ratio: 4 / 5;
  border-radius: var(--prc-radius-lg);
  overflow: hidden;
  background: var(--prc-card);
}
.prc-hero-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
.prc-hero-photo-frame {
  position: relative;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  padding: 16px;
}
.prc-hero-photo-frame::before,
.prc-hero-photo-frame::after,
.prc-hero-photo-frame > span.b1,
.prc-hero-photo-frame > span.b2 {
  content: "";
  position: absolute;
  width: 28px;
  height: 28px;
  border: 2px solid var(--prc-cyan);
}
.prc-hero-photo-frame::before { top: 0; left: 0; border-right: none; border-bottom: none; }
.prc-hero-photo-frame::after  { top: 0; right: 0; border-left: none; border-bottom: none; }
.prc-hero-photo-frame > span.b1 { bottom: 0; left: 0; border-right: none; border-top: none; }
.prc-hero-photo-frame > span.b2 { bottom: 0; right: 0; border-left: none; border-top: none; }
.prc-hero-caption {
  margin: 14px 0 0;
  color: var(--prc-muted);
  font-size: 13px;
  text-align: center;
  letter-spacing: .5px;
}
.prc-hero-caption strong {
  color: var(--prc-cyan);
  font-weight: 600;
  text-transform: uppercase;
}

/* ===================================================================
 * 3. KPI STRIP
 * =================================================================== */
.prc-kpi-strip {
  background: var(--prc-navy);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.prc-kpi-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 24px;
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr 1fr;
}
@media (min-width: 768px) {
  .prc-kpi-inner { grid-template-columns: repeat(4, 1fr); padding: 40px 32px; gap: 24px; }
}
.prc-kpi-tile {
  position: relative;
  padding: 18px 4px;
  text-align: center;
}
.prc-kpi-tile + .prc-kpi-tile::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 25%;
  bottom: 25%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(2,203,255,.35), transparent);
}
@media (max-width: 767px) {
  .prc-kpi-tile + .prc-kpi-tile::before { display: none; }
}
.prc-kpi-label {
  color: var(--prc-cyan);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0 0 6px;
}
.prc-kpi-value {
  color: var(--prc-white);
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.15;
  margin: 0;
}

/* ===================================================================
 * 4. CONTENT SECTIONS (Profil, Aufgaben)
 * =================================================================== */
/* Profil/Aufgaben section — slightly darker NAVY gradient as a rounded card */
.prc-stellen-section--alt {
  background: linear-gradient(180deg, var(--prc-navy) 0%, var(--prc-body) 100%);
  border-radius: var(--prc-radius-lg);
  margin-left: 16px;
  margin-right: 16px;
}
@media (min-width: 1024px) {
  .prc-stellen-section--alt {
    margin-left: auto;
    margin-right: auto;
    max-width: 1240px;            /* slight inset from page edge so corners are visible */
  }
}
.prc-section-num {
  color: var(--prc-cyan);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.prc-check-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .prc-check-list { grid-template-columns: 1fr 1fr; gap: 20px 40px; }
}
.prc-check-list li {
  position: relative;
  padding: 0 0 0 36px;
  color: var(--prc-white);
  font-size: 16px;
  line-height: 1.55;
  font-weight: 400;
}
.prc-check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 22px;
  height: 22px;
  background: rgba(2,203,255,.14);
  border-radius: 6px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2302CBFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
  background-size: 14px 14px;
  background-position: center;
  background-repeat: no-repeat;
}
.prc-check-list li strong {
  color: var(--prc-white);
  font-weight: 700;
}

/* ===================================================================
 * 5. BENEFITS GRID (4-col on desktop)
 * =================================================================== */
/* Benefits section — rounded "card" container holding the 4-col icon grid */
.prc-benefits {
  background: var(--prc-body);
  border-radius: var(--prc-radius-lg);
  margin-left: 16px;
  margin-right: 16px;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .prc-benefits {
    margin-left: auto;
    margin-right: auto;
    max-width: 1240px;
  }
}
.prc-benefits-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: 1fr;
}
@media (min-width: 600px) { .prc-benefits-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .prc-benefits-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; } }

.prc-benefit-card {
  background: var(--prc-card);
  border: 1px solid rgba(2,203,255,.08);
  border-radius: var(--prc-radius);
  padding: 24px 22px;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.prc-benefit-card:hover {
  transform: translateY(-2px);
  border-color: rgba(2,203,255,.32);
  background: var(--prc-card-hi);
}
.prc-benefit-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(2,203,255,.14);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  color: var(--prc-cyan);
}
.prc-benefit-icon svg {
  width: 24px;
  height: 24px;
}
.prc-benefit-card h3 {
  color: var(--prc-white);
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 8px;
  line-height: 1.2;
}
.prc-benefit-card p {
  color: var(--prc-muted);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

/* ===================================================================
 * 6. APPLY CTA
 * =================================================================== */
.prc-apply-cta {
  background: var(--prc-navy);
  position: relative;
  overflow: hidden;
}
.prc-apply-cta::before {
  content: "";
  position: absolute;
  inset: -20% -20%;
  background: radial-gradient(40% 60% at 50% 50%, rgba(2,203,255,.18), transparent 60%);
  pointer-events: none;
}
.prc-apply-card {
  position: relative;
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
  background: var(--prc-card);
  border: 1px solid rgba(2,203,255,.22);
  border-radius: var(--prc-radius-lg);
  padding: 48px 32px;
  box-shadow: var(--prc-shadow);
}
.prc-apply-card .prc-eyebrow { margin-bottom: 12px; }
.prc-apply-card .prc-h2 { margin-bottom: 12px; }
.prc-apply-card p {
  color: var(--prc-muted);
  font-size: 16px;
  line-height: 1.5;
  margin: 0 0 28px;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

/* ===================================================================
 * 7. CONTACT CARD
 * Outer section is a rounded "card container" matching the benefits +
 * profil/aufgaben sections — gives the page a consistent rounded-corner
 * design rhythm flowing into the site footer below.
 * =================================================================== */
.prc-contact {
  background: var(--prc-body);
  border-radius: var(--prc-radius-lg);
  margin-left: 16px;
  margin-right: 16px;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .prc-contact {
    margin-left: auto;
    margin-right: auto;
    max-width: 1240px;
  }
}
.prc-contact-card {
  max-width: 880px;
  margin: 0 auto;
  background: var(--prc-card);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--prc-radius-lg);
  padding: 32px;
  display: grid;
  gap: 28px;
  grid-template-columns: 1fr;
  align-items: center;
  text-align: center;
}
@media (min-width: 640px) {
  .prc-contact-card {
    grid-template-columns: 200px 1fr;
    text-align: left;
    padding: 36px 40px;
    gap: 36px;
  }
}
.prc-contact-photo {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--prc-navy);
  border: 3px solid var(--prc-cyan);
  margin: 0 auto;
  box-shadow: 0 8px 32px rgba(2,203,255,.18);
}
.prc-contact-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 25%;
}
.prc-contact-body .prc-eyebrow { margin-bottom: 8px; }
.prc-contact-body h3 {
  color: var(--prc-white);
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 6px;
}
.prc-contact-role {
  color: var(--prc-muted);
  font-size: 15px;
  margin: 0 0 14px;
}
.prc-contact-mail {
  display: inline-block;
  color: var(--prc-pink) !important;
  font-weight: 700;
  font-size: 17px;
  border-bottom: 2px solid transparent;
  transition: border-color .2s ease;
}
.prc-contact-mail:hover {
  border-bottom-color: var(--prc-pink);
  text-decoration: none;
}

/* ===================================================================
 * 8. STICKY APPLY BAR (mobile only)
 * =================================================================== */
.prc-sticky-apply {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 60;
  display: none;
  background: var(--prc-cyan);
  color: var(--prc-white);
  border-radius: 100px;
  padding: 14.4px 26px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  box-shadow: 0 12px 32px rgba(2,203,255,.35);
  text-decoration: none !important;
  transform: translateY(120%);
  transition: transform .3s ease;
}
.prc-sticky-apply.is-visible { transform: translateY(0); }
.prc-sticky-apply:hover { background: #00b8e6; text-decoration: none !important; }
@media (max-width: 767px) {
  .prc-sticky-apply { display: block; }
}

/* ===================================================================
 * MOBILE — global responsive polish (overlap, overflow, padding)
 * Reduces section padding, allows long apply-CTA text to wrap so it
 * never overflows narrow viewports, tightens anchor-nav cramming.
 * =================================================================== */
@media (max-width: 767px) {
  /* Apply-card button — let long "Jetzt bewerben als <Role> →" wrap to 2 lines
     instead of forcing nowrap and overflowing. Needs !important to beat the
     desktop .prc-hero-cta { white-space: nowrap } at higher specificity. */
  .prc-stellen-wrap .prc-apply-card a.uicore-btn,
  .prc-stellen-wrap .prc-apply-card a.prc-hero-cta,
  .prc-stellen-wrap .prc-apply-card a.elementor-button {
    white-space: normal !important;
    text-align: center;
    line-height: 1.25;
    padding: 14px 22px;
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
    display: inline-flex;
  }
  .prc-stellen-wrap .prc-apply-card .elementor-button-text {
    white-space: normal !important;
    overflow-wrap: break-word;
  }
  .prc-apply-card {
    padding: 36px 20px;
  }

  /* Anchor-nav — tighter on mobile, single-row scroll */
  .prc-anchor-nav-inner {
    padding: 0 14px;
    gap: 16px;
    font-size: 13px;
  }
  .prc-anchor-nav-inner a { padding: 12px 0; }
  .prc-anchor-nav-inner a.prc-anchor-apply {
    padding: 8px 14px;
    font-size: 12px;
  }

  /* Section padding reductions */
  .prc-stellen-section { padding: 56px 20px; }
  .prc-stellen-section .prc-h2 { font-size: 30px; line-height: 1.15; }
  .prc-hero-inner { padding: 60px 20px 48px; }
  .prc-hero h1 { font-size: 36px; line-height: 1.1; }
  .prc-hero-lead { font-size: 16px; }

  /* Rounded section cards: tighten horizontal margin so corners are visible
     without eating too much content width */
  .prc-benefits,
  .prc-contact,
  .prc-stellen-section--alt {
    margin-left: 12px;
    margin-right: 12px;
  }

  /* KPI strip — keep 2x2 grid but tighten gap + smaller labels */
  .prc-kpi-strip { padding: 28px 16px; }
  .prc-kpi-inner { gap: 18px 12px; }
  .prc-kpi-label { font-size: 11px; letter-spacing: 2px; }
  .prc-kpi-value { font-size: 16px; }

  /* Contact card on mobile — keep single column, photo above */
  .prc-contact-card {
    padding: 28px 22px;
    gap: 20px;
  }
  .prc-contact-photo {
    width: 140px;
    height: 140px;
  }
}

/* Tiny phones (≤ 380px) — extra compression */
@media (max-width: 380px) {
  .prc-hero h1 { font-size: 30px; }
  .prc-stellen-section .prc-h2 { font-size: 26px; }
  .prc-anchor-nav-inner { gap: 12px; }
  .prc-stellen-section { padding: 48px 16px; }
}

/* ===================================================================
 * 9. BACK LINK — no section background; sits directly on prc-stellen-wrap
 * NAVY so it flows visually into the marquee + site footer below.
 * =================================================================== */
.prc-back-link {
  text-align: center;
  padding: 48px 24px 80px;
  background: transparent;
}
.prc-back-link a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--prc-cyan);
  font-size: 15px;
  font-weight: 600;
  padding: 12px 24px;
  border: 1px solid rgba(2,203,255,.35);
  border-radius: 999px;
  transition: background .2s ease;
}
.prc-back-link a:hover {
  background: rgba(2,203,255,.1);
  text-decoration: none;
}

/* ===================================================================
 * KARRIERE CARD GRID REFRESH (on page 944)
 * =================================================================== */
.prc-karriere-card {
  background: var(--prc-card);
  border: 1px solid rgba(2,203,255,.08);
  border-radius: var(--prc-radius);
  padding: 28px 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 100%;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
  min-height: 280px;
}
.prc-karriere-card:hover {
  transform: translateY(-3px);
  border-color: rgba(2,203,255,.4);
  background: var(--prc-card-hi);
  box-shadow: var(--prc-shadow);
}
.prc-karriere-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(2,203,255,.14);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--prc-cyan);
}
.prc-karriere-card-icon svg { width: 24px; height: 24px; }

.prc-karriere-card h3 {
  color: var(--prc-white);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.prc-karriere-card-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--prc-cyan);
  margin-top: -4px;
}
.prc-karriere-card-cta {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--prc-cyan);
  color: var(--prc-white) !important;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .3px;
  padding: 10px 18px;
  border-radius: 100px;
  text-decoration: none !important;
  transition: background .2s ease;
}
.prc-karriere-card-cta:hover { background: #00b8e6; text-decoration: none !important; }

.prc-karriere-card--initiativ {
  background: linear-gradient(135deg, var(--prc-card) 0%, #243f63 100%);
  border-color: rgba(255,0,113,.3);
}
.prc-karriere-card--initiativ .prc-karriere-card-icon {
  background: rgba(255,0,113,.15);
  color: var(--prc-pink);
}

/* ===================================================================
 * Hide legacy Elementor template chrome on stellen pages
 * (the old white-photo hero, accordion, pink contact circle)
 * Scope by body.page-id-<N> selectors – CSS-only, no inline overrides.
 * =================================================================== */
.prc-stellen-hide-legacy .uicore-content > .elementor-section:not(.prc-stellen-wrap-section) {
  /* No-op safety – generator emits clean data so legacy sections won't exist. */
}

/* ===================================================================
 * Hero visual variants (A=portrait default, B=wanted-silhouette, C=video)
 * Switcher: ?hero=A|B|C — JS adds body.prc-hero-A|B|C and toggles [hidden]
 * =================================================================== */
.prc-hero-visual { position: relative; display: flex; align-items: center; justify-content: center; }
.prc-variant[hidden] { display: none !important; }

/* Variant B: wanted silhouette */
.prc-hero-photo--silhouette {
  display: flex; align-items: flex-end; justify-content: center;
  background: linear-gradient(160deg, rgba(2,203,255,.06) 0%, rgba(255,0,113,.04) 100%);
  color: var(--prc-cyan);
  position: relative;
  aspect-ratio: 1 / 1.05;
  max-height: 420px;
}
.prc-hero-photo--silhouette svg { width: 70%; height: auto; margin-bottom: -2px; opacity: .85; }
.prc-hero-photo-tag {
  position: absolute; top: 14px; right: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--prc-pink); color: var(--prc-white);
  font-weight: 700; font-size: 22px; line-height: 1;
  box-shadow: 0 4px 16px rgba(255,0,113,.35);
}
body.prc-hero-B .prc-hero-caption strong { color: var(--prc-cyan); }

/* Variant C: video (lite-yt click-to-load) */
.prc-hero-photo--video { padding: 0; aspect-ratio: 16 / 10; max-height: 420px; }
.prc-video-play {
  position: relative; display: block; width: 100%; height: 100%;
  background: #000; border: 0; padding: 0; cursor: pointer;
  border-radius: inherit; overflow: hidden;
}
.prc-video-play img {
  width: 100%; height: 100%; object-fit: cover;
  opacity: .85; transition: opacity .2s ease, transform .4s ease;
}
.prc-video-play:hover img { opacity: 1; transform: scale(1.02); }
.prc-video-play-icon {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 78px; height: 78px; border-radius: 50%;
  background: var(--prc-cyan); color: var(--prc-navy);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 28px; padding-left: 6px;
  box-shadow: 0 10px 32px rgba(2,203,255,.45);
  transition: transform .2s ease, background .2s ease;
}
.prc-video-play:hover .prc-video-play-icon { transform: translate(-50%, -50%) scale(1.08); }

/* ===================================================================
 * Site footer integration
 * - Stellen pages use _wp_page_template = 'elementor_header_footer' so the
 *   real header + footer (post 89 + 303) render automatically.
 * - The footer template's FIRST section (elementor-element-21399cd6) is a
 *   "Lösungen. Expertise. Partnerschaft." CTA that we don't want above the
 *   stellen page's own apply-CTA. Hide it scoped to the stellen page IDs.
 * =================================================================== */
body.page-id-2616 .elementor-303 .elementor-element-21399cd6,
body.page-id-2603 .elementor-303 .elementor-element-21399cd6,
body.page-id-2585 .elementor-303 .elementor-element-21399cd6,
body.page-id-2569 .elementor-303 .elementor-element-21399cd6,
body.page-id-2517 .elementor-303 .elementor-element-21399cd6,
body.page-id-2516 .elementor-303 .elementor-element-21399cd6,
body.page-id-2621 .elementor-303 .elementor-element-21399cd6,
body.page-id-2626 .elementor-303 .elementor-element-21399cd6,
body.page-id-2631 .elementor-303 .elementor-element-21399cd6,
body.page-id-3226 .elementor-303 .elementor-element-21399cd6,
body.page-id-3227 .elementor-303 .elementor-element-21399cd6,
body.page-id-2413 .elementor-303 .elementor-element-21399cd6 {
  display: none !important;
}

/* Belt-and-suspenders: also kill any UiCore page-title bar that might still
   render on these pages (some plugins re-attach it via filters). */
body.page-id-2616 .uicore-page-title,
body.page-id-2603 .uicore-page-title,
body.page-id-2585 .uicore-page-title,
body.page-id-2569 .uicore-page-title,
body.page-id-2517 .uicore-page-title,
body.page-id-2516 .uicore-page-title,
body.page-id-2621 .uicore-page-title,
body.page-id-2626 .uicore-page-title,
body.page-id-2631 .uicore-page-title,
body.page-id-3226 .uicore-page-title,
body.page-id-3227 .uicore-page-title,
body.page-id-2413 .uicore-page-title {
  display: none !important;
}

/* Push the prc-stellen-wrap up under the sticky header (which is transparent on dark NAVY) */
body[class*="page-id"] .prc-stellen-wrap {
  margin-top: 0;
}

/* ===================================================================
 * Variant switcher chip group (visible to editors + when ?hero= in URL)
 * Sits fixed top-right, light overlay, dismissive but clickable.
 * =================================================================== */
.prc-variant-switcher {
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(25, 45, 65, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(2, 203, 255, 0.28);
  border-radius: 100px;
  padding: 8px 10px 8px 14px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.45);
}
.prc-variant-label {
  color: rgba(255, 255, 255, 0.7);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.prc-variant-buttons { display: inline-flex; gap: 4px; }
.prc-variant-btn {
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  padding: 6px 14px;
  border-radius: 100px;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease;
  cursor: pointer;
}
.prc-variant-btn:hover {
  background: rgba(2, 203, 255, 0.12);
  color: #fff !important;
}
.prc-variant-btn.is-active {
  background: var(--prc-cyan);
  color: var(--prc-white) !important;
}
/* Push down on small screens to avoid the WP admin bar */
body.admin-bar .prc-variant-switcher { top: 46px; }
@media (max-width: 600px) {
  /* Compact, top-right corner — does NOT block the sticky-apply at bottom. */
  .prc-variant-switcher {
    top: 12px;
    right: 12px;
    left: auto;
    bottom: auto;
    padding: 4px 6px;
    gap: 4px;
    border-radius: 100px;
    font-size: 11px;
  }
  .prc-variant-label { display: none; }
  .prc-variant-btn { padding: 5px 8px; font-size: 10px; }
}

/* ===================================================================
 * Variant D — full-bleed team-photoshoot photo hero
 * Pattern from About page (post 427): photo as cover bg, text overlays it.
 * Toggle is via body.prc-hero-D — JS sets this when ?hero=D
 * =================================================================== */
/* Variant D — matches the kontakt-v2 hero pattern exactly:
   full-bleed photo edge-to-edge, transparent→navy 95% gradient bottom-anchored
   at 55→100% transition, content overlays at the bottom of the photo. */
body.prc-hero-D .prc-hero {
  background-image:
    linear-gradient(180deg, rgba(26,32,50,0) 55%, rgba(26,32,50,0.95) 100%),
    url("/wp-content/uploads/2025/05/Loesungen-Header-Unternehmen.webp");
  background-size: cover, cover;
  background-position: center center, center center;
  background-repeat: no-repeat, no-repeat;
  min-height: 720px;
  /* Edge-to-edge, no rounding (matches kontakt-v2) */
  border-radius: 0;
  margin: 0;
  max-width: none;
  overflow: hidden;
}
@media (min-width: 1024px) {
  body.prc-hero-D .prc-hero {
    margin: 0;
    max-width: none;
  }
}
/* Mobile: shift bg-position right so the team subjects stay framed when narrower */
@media (max-width: 767px) {
  body.prc-hero-D .prc-hero {
    background-position: right center, right center;
    min-height: 560px;
  }
}
body.prc-hero-D .prc-hero::before {
  /* Soften the existing radial-gradient ambient so the photo dominates */
  opacity: .35;
}
body.prc-hero-D .prc-hero-inner {
  grid-template-columns: 1fr;       /* text takes full width, no right photo */
  align-items: flex-end;            /* push content to bottom over the gradient */
  min-height: 720px;                /* matches .prc-hero min-height for proper bottom anchoring */
  padding-bottom: 80px;             /* breathing room from the gradient bottom edge */
}
@media (max-width: 767px) {
  body.prc-hero-D .prc-hero-inner {
    min-height: 560px;
    padding-bottom: 48px;
  }
}
body.prc-hero-D .prc-hero-text {
  max-width: 760px;
}
body.prc-hero-D .prc-hero-visual {
  display: none;                    /* hide side photo frame in D — bg is the photo */
}
/* H1 + lead get a subtle text-shadow to stay legible against photo midtones */
body.prc-hero-D .prc-hero h1 {
  text-shadow: 0 4px 24px rgba(0,0,0,.45);
}
body.prc-hero-D .prc-hero-lead {
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
}
/* Eyebrow + chips slightly more opaque so they pop against the photo */
body.prc-hero-D .prc-eyebrow {
  background: rgba(2,203,255,.14);
  padding: 6px 14px;
  border-radius: 100px;
  text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
body.prc-hero-D .prc-meta-chips li {
  background: rgba(25,45,65,.55);
  border-color: rgba(2,203,255,.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Update variant-switcher to fit 4 buttons cleanly on mobile */
@media (max-width: 600px) {
  .prc-variant-switcher { padding: 6px 8px; }
  .prc-variant-btn { padding: 6px 10px; font-size: 11px; }
}

/* ===================================================================
 * MERGED APPLY-CTA + CONTACT CARD (2026-05-26)
 * Replaces the separate .prc-apply-cta + .prc-contact sections with one
 * unified card: photo (left) + headline / paragraph / button / contact
 * details (right). The page's _elementor_data has been rewritten on all
 * 10 active stellenanzeige IDs to emit .prc-merged-cta directly. The
 * display:none rule below catches any page whose data write missed.
 * =================================================================== */
.prc-merged-card {
  position: relative;
  max-width: 980px;
  margin: 0 auto;
  background: var(--prc-card);
  border: 1px solid rgba(2, 203, 255, 0.18);
  border-radius: var(--prc-radius-lg);
  padding: 40px 36px;
  box-shadow: var(--prc-shadow);
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: center;        /* vertically center photo vs content column (2026-05-26) */
  text-align: center;
  overflow: hidden;
}
@media (min-width: 640px) {
  .prc-merged-card {
    grid-template-columns: 200px 1fr;
    gap: 36px;
    padding: 44px 44px;
    text-align: left;
  }
}
.prc-merged-card::before {
  content: "";
  position: absolute;
  inset: -30% -30%;
  background: radial-gradient(40% 60% at 18% 30%, rgba(2,203,255,.16), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.prc-merged-card > * { position: relative; z-index: 1; }

.prc-merged-photo {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--prc-navy);
  border: 3px solid var(--prc-cyan);
  box-shadow: 0 8px 32px rgba(2,203,255,.18);
  margin: 0 auto;
}
.prc-merged-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 25%;
}

.prc-merged-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.prc-merged-body .prc-eyebrow { margin: 0 0 2px; }
.prc-merged-body .prc-h2 {
  margin: 0 0 2px;
  font-size: clamp(22px, 2.6vw, 30px);
  line-height: 1.15;
  color: var(--prc-white);
}
.prc-merged-body > p {
  color: var(--prc-muted);
  font-size: 16px;
  line-height: 1.5;
  margin: 0 0 8px;
  max-width: 620px;
}
.prc-merged-button {
  align-self: stretch;
  margin: 4px 0 4px;
}
@media (min-width: 640px) {
  .prc-merged-button { align-self: flex-start; }
}

/* Override .prc-hero-cta site-wide `white-space: nowrap` on mobile only —
 * long job-title button text ("Jetzt bewerben als SAP Solution Consultant →")
 * needs to wrap below ~640px or it overflows the card on small phones. */
@media (max-width: 639px) {
  .prc-stellen-wrap a.elementor-button.prc-hero-cta.prc-merged-button,
  .prc-stellen-wrap a.prc-hero-cta.prc-merged-button,
  .prc-stellen-wrap .prc-hero-cta.prc-merged-button .elementor-button-content-wrapper,
  .prc-stellen-wrap .prc-hero-cta.prc-merged-button .elementor-button-text {
    white-space: normal;
    line-height: 1.3;
  }
  .prc-stellen-wrap a.elementor-button.prc-hero-cta.prc-merged-button {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
  }
}

.prc-merged-contact {
  margin-top: 16px;
  padding-top: 18px;
  border-top: 1px solid rgba(2, 203, 255, 0.16);
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
}
@media (min-width: 640px) {
  .prc-merged-contact { align-items: flex-start; }
}
.prc-merged-contact .prc-eyebrow { margin: 0 0 2px; }
.prc-merged-contact-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}
@media (min-width: 640px) {
  .prc-merged-contact-line { justify-content: flex-start; }
}
.prc-merged-name {
  font-size: 19px;
  font-weight: 700;
  color: var(--prc-white);
}
.prc-merged-role {
  font-size: 14px;
  color: var(--prc-muted);
}
.prc-merged-mail {
  display: inline-block;
  color: var(--prc-pink) !important;
  font-weight: 700;
  font-size: 16px;
  border-bottom: 2px solid transparent;
  transition: border-color .2s ease;
}
.prc-merged-mail:hover { border-bottom-color: var(--prc-pink); text-decoration: none !important; }

/* Fallback: hide OLD separate sections if any page's data write missed */
.prc-apply-cta,
.prc-contact { display: none !important; }

/* ===================================================================
 * SECTIONS ACCORDION — Profil / Aufgaben / Benefits as 3-item accordion
 * (2026-05-26). Mirrors the R+V success story HERAUSFORDERUNG/LÖSUNG/NUTZEN
 * design: dark rounded card per item, cyan uppercase title with cyan +
 * icon when closed, pink title with pink × icon when open. Inner content
 * (checkmark bullets, benefit cards) keeps its existing styling.
 * =================================================================== */
.prc-acc {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.prc-acc__item {
  background: rgba(31, 52, 80, 0.65);
  border: 1px solid rgba(2, 203, 255, 0.10);
  border-radius: var(--prc-radius-lg);
  overflow: hidden;
  transition: border-color .25s ease, background .25s ease;
}
.prc-acc__item.is-open {
  border-color: rgba(255, 0, 113, 0.25);
  background: rgba(31, 52, 80, 0.92);
}
.prc-acc__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  padding: 28px 36px;
  background: transparent;
  border: none;
  cursor: pointer;
  font-family: var(--prc-font);
  font-size: clamp(22px, 2.6vw, 34px);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--prc-cyan);
  text-align: left;
  line-height: 1.1;
  transition: color .2s ease;
  -webkit-tap-highlight-color: transparent;
}
.prc-acc__item.is-open .prc-acc__title { color: var(--prc-pink); }
.prc-acc__title:hover { color: var(--prc-pink); }
.prc-acc__title:focus-visible { outline: 2px solid var(--prc-cyan); outline-offset: 2px; }
@media (max-width: 600px) {
  .prc-acc__title { padding: 22px 22px; }
}

/* Plus/Close icon: circular ring + two bars; closed = +, open = × via 45° rotation */
.prc-acc__icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  position: relative;
  transition: transform .25s ease;
}
.prc-acc__icon::before,
.prc-acc__icon::after {
  content: "";
  position: absolute;
  background: currentColor;
  border-radius: 1px;
  top: 50%; left: 50%;
  transition: transform .25s ease;
}
.prc-acc__icon::before { width: 16px; height: 2px; transform: translate(-50%, -50%); }
.prc-acc__icon::after  { width: 2px; height: 16px; transform: translate(-50%, -50%); }
.prc-acc__item.is-open .prc-acc__icon::before { transform: translate(-50%, -50%) rotate(45deg); }
.prc-acc__item.is-open .prc-acc__icon::after  { transform: translate(-50%, -50%) rotate(-45deg); opacity: 0; }
/* The :before bar rotates 45°; :after fades out — produces a clean × from the + */
.prc-acc__item.is-open .prc-acc__icon { transform: rotate(0deg); }
/* (we keep ::after for symmetry but transparent so it doesn't double-stroke) */

/* Collapse / expand using grid-template-rows trick (Chrome 117+, Firefox 117+, Safari 17+) */
.prc-acc__content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s ease;
}
.prc-acc__item.is-open .prc-acc__content { grid-template-rows: 1fr; }
.prc-acc__content > div { overflow: hidden; }
.prc-acc__content-inner { padding: 4px 36px 36px 36px; }
@media (max-width: 600px) {
  .prc-acc__content-inner { padding: 4px 22px 28px 22px; }
}

/* Tighten inner spacing — h2 + bullets/cards don't need section-level padding */
.prc-acc__content-inner .prc-h2 {
  margin-top: 0;
  margin-bottom: 18px;
  color: var(--prc-white);
  font-size: clamp(22px, 2.4vw, 30px);
}
.prc-acc__content-inner .prc-check-list { margin: 0; }
.prc-acc__content-inner .prc-benefits-grid { margin-top: 0; }

/* The 3 sections are now wrapped inside .prc-acc-section — its top/bottom
 * padding stays inherited from .prc-stellen-section. Drop the old alt
 * row-stripe styling that the previous 2-section design used. */
.prc-acc-section { padding-top: 32px; padding-bottom: 32px; }

/* ===================================================================
 * INTRO SECTION — left "Du stehst..." question + right pink headline + body
 * (Student / Praktikant / Abschlussarbeit roles only — 2026-05-26)
 * Mirrors the live page's 2-column "Dann bist du bei paricon genau Richtig!"
 * pitch block. Other roles don't get this section.
 * =================================================================== */
.prc-intro-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: start;
}
@media (min-width: 900px) {
  .prc-intro-grid {
    grid-template-columns: 1fr 1.35fr;
    gap: 56px;
  }
}
.prc-intro-question p {
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.4;
  color: var(--prc-muted);
  margin: 0;
  font-weight: 400;
}
.prc-intro-question p strong {
  color: var(--prc-white);
  font-weight: 700;
}
.prc-intro-headline {
  color: var(--prc-pink);
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 700;
  margin: 0 0 24px;
  line-height: 1.2;
}
.prc-intro-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.prc-intro-body p {
  color: var(--prc-muted);
  font-size: 16px;
  line-height: 1.6;
  margin: 0;
}
.prc-intro-body p strong {
  color: var(--prc-white);
  font-weight: 700;
}

/* STELLEN-1 (2026-06-18): restore the two bottom Wanted-poster corner brackets
   (template-wide). The inline prc-pariconese-css inside each page's HTML widget
   hides span.b1/.b2 with display:none!important; this higher-specificity rule
   (html body … .prc-variant-B > span.b1/.b2) beats it regardless of source order. */
html body .prc-stellen-wrap .prc-hero-photo-frame.prc-variant-B > span.b1,
html body .prc-stellen-wrap .prc-hero-photo-frame.prc-variant-B > span.b2 {
  display: block !important;
  position: absolute;
  width: 28px; height: 28px;
  border: 2px solid var(--prc-cyan);
  z-index: 2;
}
html body .prc-stellen-wrap .prc-hero-photo-frame.prc-variant-B > span.b1 { bottom: 0; left: 0; border-right: none; border-top: none; }
html body .prc-stellen-wrap .prc-hero-photo-frame.prc-variant-B > span.b2 { bottom: 0; right: 0; border-left: none; border-top: none; }