.job-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20rem;
  gap: 2.5rem;
  align-items: start;
  
  padding-bottom: 3rem;
}
.job-detail > .jn-spalte {
  position: sticky; top: 96px; display: grid; gap: 1rem;
  
  padding-top: 2.4rem;
  
  padding-bottom: 2.5rem;
}

@media (max-width: 1000px) {
  .job-detail { grid-template-columns: 1fr; gap: 1.75rem; }
  .job-detail > .jn-spalte { position: static; padding-top: 0; }
}

.jn-karte {
  border: 1px solid #dde3ea; border-radius: 14px; background: #fff;
  padding: 1.1rem 1.2rem;
}
.jn-kopf {
  font-size: .72rem; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: #5a6b7d; margin-bottom: .7rem;
}
.jn-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.jn-liste li { margin: 0; }
.jn-liste a, .jn-liste .jn-hier {
  display: grid; grid-template-columns: 1fr auto; gap: .1rem .6rem;
  padding: .55rem .65rem; border-radius: 10px; text-decoration: none;
  color: inherit; border: 1px solid transparent;
}
.jn-liste a:hover { background: rgba(0, 137, 160, .07); border-color: rgba(0, 137, 160, .35); }
.jn-liste a:focus-visible { outline: 2px solid #0089a0; outline-offset: 1px; }

.jn-liste .jn-hier { background: #f1f5f8; border-color: #dde3ea; cursor: default; }
.jn-titel { font-weight: 700; font-size: .93rem; }
.jn-eck { grid-column: 1; font-size: .78rem; color: #6b7a89; }

.jn-status {
  grid-row: span 2; align-self: center;
  font-size: .7rem; font-weight: 700; letter-spacing: .04em;
  padding: .15rem .55rem; border-radius: 50px; white-space: nowrap;
}
.jn-status.frei { background: #e3f3e8; color: #0f7a36; border: 1px solid #a9d9bb; }

.jn-status.initiativ { background: #e2f1f4; color: #056b7d; border: 1px solid #a5d5de; }
.jn-status.besetzt { background: #eef1f4; color: #6b7a89; border: 1px solid #d5dce3; }

.jn-alle {
  display: inline-block; margin-top: .85rem; font-size: .85rem; font-weight: 700;
  color: #b8530c; text-decoration: none; border-bottom: 1px solid currentColor;
}
.jn-alle:hover { color: #8f3f08; }

.jn-cta p { margin: 0 0 .7rem; font-size: .88rem; line-height: 1.5; }
.jn-tel {
  display: block; font-size: 1.15rem; font-weight: 800; color: #0f1e2e;
  text-decoration: none; margin-bottom: .7rem;
}
.jn-btn { width: 100%; justify-content: center; text-align: center; }

.jn-band-sec {
  padding: 0;
  
  background: #143024;
  border-bottom: 1px solid rgba(0, 0, 0, .3);
}
.jn-band {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem;
  padding: .5rem 0; min-height: 48px;
}
.jn-band-h {
  font-size: .72rem; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: rgba(255, 255, 255, .72);
  padding-right: .9rem; margin-right: .2rem;
  border-right: 1px solid rgba(255, 255, 255, .16);
}
.jn-band-h em { font-style: normal; letter-spacing: 0; text-transform: none;
                font-weight: 400; color: rgba(255, 255, 255, .5); }
.jn-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.jn-chip {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .3rem .6rem .3rem .7rem; border-radius: 8px;
  text-decoration: none; color: #fff; border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease;
}
.jn-chip:hover { background: rgba(255, 255, 255, .09); border-color: rgba(255, 255, 255, .2); }
.jn-chip:focus-visible { outline: 2px solid #7fd4e3; outline-offset: 1px; }
.jn-chip .jn-titel { font-size: .86rem; font-weight: 600; }

.jn-band .jn-status { padding: .05rem .45rem; font-size: .66rem; }
.jn-band .jn-status.frei { background: rgba(88, 214, 141, .18); color: #7ee2a8; border-color: rgba(126, 226, 168, .45); }
.jn-band .jn-status.initiativ { background: rgba(125, 211, 227, .16); color: #8fdcea; border-color: rgba(143, 220, 234, .4); }
.jn-band .jn-status.besetzt { background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .55); border-color: rgba(255, 255, 255, .18); }

@media (max-width: 760px) {
  
  .jn-band { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .jn-band::-webkit-scrollbar { display: none; }
  .jn-band-h { flex: 0 0 auto; }
  .jn-chips { flex-wrap: nowrap; }
  .jn-chip { flex: 0 0 auto; }
}