/* JHB Wegweiser System 2.0.0 – 30-mobile-accessibility */
/* =========================================================
   Mobile – einheitliche Premium-Chip-Leiste
   ========================================================= */

@media (max-width: 767px){
  .jhb-guide-system.jhb-guide{
    --jhb-guide-shadow-color:rgba(var(--jhb-guide-page-rgb),.045);
    --jhb-guide-arrow-shadow:0 3px 8px rgba(var(--jhb-guide-page-rgb),.06), inset 0 1px 0 rgba(255,255,255,.74);
    contain:layout style;
  }

  .jhb-guide-system.jhb-guide--spacing-normal{
    padding:10px 0 16px;
  }

  .jhb-guide-system.jhb-guide--spacing-compact{
    padding:7px 0 12px;
  }

  .jhb-guide-system.jhb-guide--spacing-none{
    padding:0;
  }

  .jhb-guide-system .jhb-guide__wrap{
    width:min(440px,calc(100vw - 32px));
    max-width:calc(100vw - 32px);
  }

  .jhb-guide-system.jhb-guide--job-detail{
    /* Job-Kompass wrapper safety: nie breiter als der umgebende Job-Container. */
    min-width:0;
    box-sizing:border-box;
    --jhb-guide-green:var(--jhb-guide-accent,var(--jhb-guide-page-accent));
    --jhb-guide-green-dark:var(--jhb-guide-accent-dark,var(--jhb-guide-page-accent-dark));
    --jhb-guide-active-bg:rgba(var(--jhb-guide-page-rgb),.095);
    --jhb-guide-active-bg-hover:rgba(var(--jhb-guide-page-rgb),.14);
    --jhb-guide-border-color:rgba(var(--jhb-guide-page-rgb),.16);
    --jhb-guide-line-color:rgba(var(--jhb-guide-page-rgb),.11);
    --jhb-guide-shadow-color:rgba(var(--jhb-guide-page-rgb),.065);
    --jhb-guide-arrow-bg:rgba(255,253,249,.58);
    --jhb-guide-arrow-border:rgba(var(--jhb-guide-page-rgb),.14);
    --jhb-guide-arrow-color:var(--jhb-guide-green-dark);
    --jhb-guide-arrow-shadow:0 4px 10px rgba(var(--jhb-guide-page-rgb),.075), inset 0 1px 0 rgba(255,255,255,.72);
    width:100%;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    transform:none;
    overflow:hidden;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__wrap{
    width:100%;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  .jhb-guide-system .jhb-guide__shell{
    position:relative;
    width:100%;
    max-width:100%;
    gap:7px;
    justify-items:stretch;
    overflow:visible;
  }

  .jhb-guide-system .jhb-guide__nav-intro{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:30px;
    margin:0 auto 6px;
    text-align:center;
  }

  .jhb-guide-system .jhb-guide__mobile-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:18px;
    margin:0;
    color:var(--jhb-guide-green-dark);
    font-size:.64rem;
    font-weight:920;
    line-height:1;
    letter-spacing:.12em;
    text-align:center;
    text-transform:uppercase;
    opacity:.82;
  }

  .jhb-guide-system .jhb-guide__nav-icon{
    width:16px;
    height:16px;
  }

  .jhb-guide-system .jhb-guide__nav-icon::before{
    left:50%;
    top:50%;
    width:5px;
    height:5px;
    transform:translate(-58%,-50%) rotate(45deg);
  }

  .jhb-guide-system .jhb-guide__nav-label-desktop,
  .jhb-guide-system .jhb-guide__nav-hint{
    display:none;
  }

  .jhb-guide-system .jhb-guide__nav-label-mobile{
    display:inline;
  }

  .jhb-guide-system .jhb-guide__scroll-controls{
    display:none;
    align-items:center;
    justify-content:center;
    gap:6px;
    flex:0 0 auto;
  }

  .jhb-guide-system .jhb-guide__shell.is-scrollable .jhb-guide__scroll-controls{
    display:inline-flex;
  }

  .jhb-guide-system .jhb-guide__items{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:6px;
    width:100%;
    min-width:0;
    max-width:100%;
    margin:0 auto;
    padding:7px 14px;
    border:1px solid var(--jhb-guide-border-color);
    border-radius:999px;
    background:rgba(255,253,249,.94);
    box-shadow:0 4px 10px var(--jhb-guide-shadow-color),inset 0 1px 0 rgba(255,255,255,.90);
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-x:contain;
    scroll-snap-type:none;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    contain:layout paint;
    touch-action:pan-x pan-y;
    scroll-padding-inline:14px;
  }

  .jhb-guide-system .jhb-guide__items::-webkit-scrollbar{
    display:none;
  }

  .jhb-guide-system .jhb-guide__shell::before,
  .jhb-guide-system .jhb-guide__shell::after{
    content:"";
    position:absolute;
    bottom:0;
    z-index:3;
    width:44px;
    height:54px;
    pointer-events:none;
    opacity:0;
    transition:opacity .16s ease;
  }

  .jhb-guide-system .jhb-guide__shell::before{
    left:0;
    border-radius:999px 0 0 999px;
    background:linear-gradient(90deg,rgba(255,253,249,.98) 0%,rgba(255,253,249,.86) 38%,rgba(255,253,249,0) 100%);
  }

  .jhb-guide-system .jhb-guide__shell::after{
    right:0;
    border-radius:0 999px 999px 0;
    background:linear-gradient(90deg,rgba(255,253,249,0) 0%,rgba(255,253,249,.86) 62%,rgba(255,253,249,.98) 100%);
  }

  .jhb-guide-system .jhb-guide__shell.can-scroll-prev::before,
  .jhb-guide-system .jhb-guide__shell.can-scroll-next::after{
    opacity:1;
  }

  .jhb-guide-system .jhb-guide__scroll-arrow{
    position:relative;
    z-index:5;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    padding:0;
    border:1px solid var(--jhb-guide-arrow-border);
    border-radius:999px;
    background:rgba(255,253,249,.82);
    color:var(--jhb-guide-arrow-color);
    box-shadow:var(--jhb-guide-arrow-shadow);
    cursor:pointer;
    opacity:.28;
    pointer-events:none;
    transform:none;
    transition:opacity .14s ease,background-color .14s ease,border-color .14s ease,color .14s ease,transform .14s ease;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }

  .jhb-guide-system .jhb-guide__scroll-arrow span{
    display:block;
    width:7px;
    height:7px;
    border-top:2px solid currentColor;
    border-right:2px solid currentColor;
  }

  .jhb-guide-system .jhb-guide__scroll-arrow--prev span{
    transform:rotate(-135deg);
    margin-left:2px;
  }

  .jhb-guide-system .jhb-guide__scroll-arrow--next span{
    transform:rotate(45deg);
    margin-right:2px;
  }

  .jhb-guide-system .jhb-guide__shell.can-scroll-prev .jhb-guide__scroll-arrow--prev,
  .jhb-guide-system .jhb-guide__shell.can-scroll-next .jhb-guide__scroll-arrow--next{
    opacity:.94;
    pointer-events:auto;
  }

  .jhb-guide-system .jhb-guide__scroll-arrow:hover,
  .jhb-guide-system .jhb-guide__scroll-arrow:focus-visible{
    color:var(--jhb-guide-arrow-color);
    outline:none;
    transform:translateY(-1px);
  }

  .jhb-guide-system .jhb-guide__scroll-arrow:disabled{
    opacity:.24;
    pointer-events:none;
  }

  @media (prefers-reduced-motion:no-preference){
    .jhb-guide-system .jhb-guide__shell.can-scroll-next .jhb-guide__scroll-arrow--next span{
      animation:jhb-guide-scroll-hint-next 1.5s ease-in-out infinite;
    }

    .jhb-guide-system .jhb-guide__shell.can-scroll-prev .jhb-guide__scroll-arrow--prev span{
      animation:jhb-guide-scroll-hint-prev 1.5s ease-in-out infinite;
    }
  }

  @keyframes jhb-guide-scroll-hint-next{
    0%,100%{
      opacity:.55;
      transform:translateX(-1px) rotate(45deg);
    }
    45%{
      opacity:1;
      transform:translateX(2px) rotate(45deg);
    }
  }

  @keyframes jhb-guide-scroll-hint-prev{
    0%,100%{
      opacity:.55;
      transform:translateX(1px) rotate(-135deg);
    }
    45%{
      opacity:1;
      transform:translateX(-2px) rotate(-135deg);
    }
  }

  .jhb-guide-system .jhb-guide__item,
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5){
    flex:0 0 auto;
    min-height:40px;
    padding:9px 12px;
    border:0;
    border-radius:999px;
    background:transparent;
    text-align:center;
    scroll-snap-align:start;
  }

  .jhb-guide-system .jhb-guide__item:nth-child(odd),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="3"] .jhb-guide__item:nth-child(-n+2),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="4"] .jhb-guide__item:nth-child(-n+2),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(-n+4),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="6"] .jhb-guide__item:nth-child(-n+4),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="7"] .jhb-guide__item:nth-child(-n+6),
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="8"] .jhb-guide__item:nth-child(-n+6){
    border-right:0;
    border-bottom:0;
  }

  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5)::before{
    display:none;
  }

  .jhb-guide-system .jhb-guide__item::after{
    display:none;
  }

  .jhb-guide-system .jhb-guide__item-main,
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5) .jhb-guide__item-main{
    width:auto;
    text-align:center;
  }

  .jhb-guide-system .jhb-guide__item-label,
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5) .jhb-guide__item-label{
    max-width:none;
    margin:0 auto;
    color:var(--jhb-guide-green-dark);
    font-size:.77rem;
    font-weight:860;
    line-height:1;
    letter-spacing:.01em;
    text-align:center;
    text-transform:none;
    white-space:nowrap;
  }

  .jhb-guide-system .jhb-guide__item small,
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5) small{
    display:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__shell{
    display:grid;
    width:100%;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    gap:10px;
    padding:10px;
    border:1px solid rgba(var(--jhb-guide-page-rgb),.14);
    border-radius:28px;
    background:
      radial-gradient(340px 120px at 50% 0%, rgba(var(--jhb-guide-page-rgb),.055), transparent 72%),
      linear-gradient(180deg,rgba(255,253,249,.98),rgba(255,248,243,.91));
    box-shadow:0 8px 18px rgba(var(--jhb-guide-page-rgb),.045), inset 0 1px 0 rgba(255,255,255,.92);
    overflow:hidden;
    contain:layout paint;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__shell::before,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__shell::after{
    display:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__scroll-controls{
    display:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__mobile-label{
    margin:0 auto 1px;
    color:var(--jhb-guide-green-dark);
    opacity:.72;
    letter-spacing:.15em;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
    scroll-snap-type:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5){
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    min-height:48px;
    padding:9px 10px;
    border:1px solid rgba(var(--jhb-guide-page-rgb),.13);
    border-radius:18px;
    background:rgba(255,255,255,.62);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.84);
    scroll-snap-align:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:nth-child(1){order:1}
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:nth-child(2){order:2}
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:nth-child(3){order:5;grid-column:1 / -1;min-height:46px;background:linear-gradient(180deg,rgba(var(--jhb-guide-page-rgb),.075),rgba(255,255,255,.60))}
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:nth-child(4){order:3}
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:nth-child(5){order:4}

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item-main{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    width:100%;
    text-align:center;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item-label,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5) .jhb-guide__item-label{
    max-width:100%;
    color:var(--jhb-guide-green-dark);
    font-size:.78rem;
    font-weight:900;
    line-height:1.08;
    letter-spacing:.005em;
    text-align:center;
    white-space:normal;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item small,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5) small{
    display:block;
    max-width:24ch;
    margin:0 auto;
    color:#687986;
    font-size:.61rem;
    font-weight:760;
    line-height:1.12;
    letter-spacing:.002em;
    text-align:center;
    white-space:normal;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item-arrow{
    display:none;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item.is-active,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:hover,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item:focus-visible{
    background:linear-gradient(180deg,rgba(var(--jhb-guide-page-rgb),.115),rgba(var(--jhb-guide-page-rgb),.055));
    border-color:rgba(var(--jhb-guide-page-rgb),.20);
    box-shadow:inset 0 0 0 1px rgba(var(--jhb-guide-page-rgb),.085),0 4px 10px rgba(var(--jhb-guide-page-rgb),.04);
  }


  .jhb-guide-system.jhb-guide--freier-traeger{
    background:transparent;
  }

  .jhb-guide-system.jhb-guide--freier-traeger .jhb-guide__items{
    background:rgba(255,255,255,.92);
    box-shadow:0 6px 16px rgba(84,48,24,.055),inset 0 1px 0 rgba(255,255,255,.9);
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items{
    min-width:0;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item{
    overflow:hidden;
  }
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__scroll-arrow{
    display:none;
  }

  .jhb-guide-system .jhb-guide__item:hover,
  .jhb-guide-system .jhb-guide__item:focus-visible,
  .jhb-guide-system .jhb-guide__item:active,
  .jhb-guide-system .jhb-guide__item.is-active{
    background:var(--jhb-guide-active-bg);
    box-shadow:inset 0 0 0 1px var(--jhb-guide-line-color);
    transform:none;
  }

  .jhb-guide-system .jhb-guide__item{
    transition:background-color .14s ease,box-shadow .14s ease,color .14s ease;
    touch-action:manipulation;
  }

  .jhb-guide-system .jhb-guide__shell::before,
  .jhb-guide-system .jhb-guide__shell::after{
    transition:none;
  }

  .jhb-guide-system-stickybar{
    display:none;
  }
}


  .jhb-guide-system.jhb-guide--kontakt-wegweiser{
    --jhb-guide-arrow-bg:rgba(255,253,249,.72);
    --jhb-guide-arrow-border:rgba(85,113,90,.16);
    --jhb-guide-arrow-color:#31553A;
  }

  .jhb-guide-system.jhb-guide--standort{
    --jhb-guide-arrow-bg:rgba(255,253,249,.72);
    --jhb-guide-arrow-border:rgba(var(--jhb-guide-page-rgb),.16);
    --jhb-guide-arrow-color:var(--jhb-guide-green-dark);
  }

  .jhb-guide-system.jhb-guide--leistungen,
  .jhb-guide-system.jhb-guide--ambulante-hilfen,
  .jhb-guide-system.jhb-guide--stationaere-hilfen{
    --jhb-guide-arrow-bg:rgba(255,248,241,.74);
    --jhb-guide-arrow-border:rgba(233,98,11,.16);
    --jhb-guide-arrow-color:#C95409;
  }

@media (max-width: 380px){
  .jhb-guide-system .jhb-guide__wrap{
    width:min(420px,calc(100vw - 28px));
    max-width:calc(100vw - 28px);
  }

  .jhb-guide-system .jhb-guide__item,
  .jhb-guide-system .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5){
    min-height:38px;
    padding:8px 10px;
  }

  .jhb-guide-system .jhb-guide__item-label{
    font-size:.74rem;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__wrap{
    width:100%;
    max-width:100%;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__shell{
    gap:8px;
    padding:9px;
    border-radius:24px;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items{
    gap:7px;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item,
  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__items[data-jhb-guide-count="5"] .jhb-guide__item:nth-child(5){
    min-height:46px;
    padding:8px 8px;
    border-radius:16px;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item-label{
    font-size:.73rem;
  }

  .jhb-guide-system.jhb-guide--job-detail .jhb-guide__item small{
    font-size:.58rem;
  }

}

@media (prefers-reduced-motion: reduce){
  .jhb-guide-system *,
  .jhb-guide-system *::before,
  .jhb-guide-system *::after,
  .jhb-guide-system-stickybar *,
  .jhb-guide-system-stickybar *::before,
  .jhb-guide-system-stickybar *::after,
  .jhb-guide-system-stickybar{
    animation:none;
    transition:none;
    scroll-behavior:auto;
  }
}

@media (max-width: 820px){
  .jhb-job-guide-slot .jhb-guide-system.jhb-guide--job-detail{
    width:100%;
    max-width:472px;
    margin-left:auto;
    margin-right:auto;
  }

  .jhb-job-guide-slot .jhb-guide-system.jhb-guide--job-detail .jhb-guide__wrap{
    width:100%;
    max-width:100%;
  }
}