:root{
  --jhb-fa-entry-green:#0e3c28;
  --jhb-fa-entry-mid:#579343;
  --jhb-fa-entry-mint:#e5f9f2;
  --jhb-fa-entry-orange:#e9620b;
  --jhb-fa-entry-line:rgba(14,60,40,.14);
}

.jhb-fa-entry,
.jhb-fa-entry *{box-sizing:border-box}

.jhb-fa-entry{
  width:min(100%,620px);
  min-height:70px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  padding:13px 15px;
  border:1px solid var(--jhb-fa-entry-line);
  border-radius:20px;
  background:linear-gradient(135deg,#fff 0%,#fbfefd 52%,var(--jhb-fa-entry-mint) 100%);
  box-shadow:0 12px 30px rgba(14,60,40,.07);
  color:var(--jhb-fa-entry-green);
  text-decoration:none;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}

.jhb-fa-entry:hover,
.jhb-fa-entry:focus-visible{
  color:var(--jhb-fa-entry-green);
  transform:translateY(-2px);
  border-color:rgba(87,147,67,.34);
  box-shadow:0 18px 38px rgba(14,60,40,.11);
}

.jhb-fa-entry:focus-visible{
  outline:3px solid rgba(233,98,11,.24);
  outline-offset:3px;
}

.jhb-fa-entry__icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:var(--jhb-fa-entry-mint);
  color:var(--jhb-fa-entry-green);
}

.jhb-fa-entry__icon svg,
.jhb-fa-menu-item__icon svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.jhb-fa-entry__copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.jhb-fa-entry__copy strong{font-size:.96rem;line-height:1.25;font-weight:850;color:inherit}
.jhb-fa-entry__copy small{font-size:.76rem;line-height:1.4;color:#64776f}
.jhb-fa-entry__arrow{font-size:1.15rem;color:var(--jhb-fa-entry-mid);transition:transform .2s ease}
.jhb-fa-entry:hover .jhb-fa-entry__arrow,.jhb-fa-entry:focus-visible .jhb-fa-entry__arrow{transform:translateX(3px)}

/* Kontaktseite: kompakter Fachkräfte-Einstieg im Hero. */
.jhb-fa-entry--hero{
  width:auto;
  min-height:46px;
  grid-template-columns:28px auto auto;
  gap:8px;
  padding:8px 13px;
  border-radius:999px;
  background:rgba(229,249,242,.96);
  border-color:rgba(87,147,67,.24);
  box-shadow:0 8px 22px rgba(14,60,40,.08);
}
.jhb-fa-entry--hero .jhb-fa-entry__icon{width:28px;height:28px;border-radius:999px;background:#fff}
.jhb-fa-entry--hero .jhb-fa-entry__icon svg{width:17px;height:17px}
.jhb-fa-entry--hero .jhb-fa-entry__copy strong{font-size:.82rem}
.jhb-fa-entry--hero .jhb-fa-entry__copy small{display:none}
.jhb-fa-entry--hero .jhb-fa-entry__arrow{font-size:.95rem}


/* Berlin-Seiten: gleicher CTA, aber im Berliner Blau/Creme-System. */
.jhb-fa-berlin-entry{
  display:flex;
  justify-content:center;
  width:100%;
  margin-top:14px;
}
.jhb-fa-entry--berlin{
  width:auto;
  min-height:46px;
  grid-template-columns:28px auto auto;
  gap:8px;
  padding:8px 13px;
  border-radius:999px;
  background:#eaf4ff;
  border-color:rgba(30,95,159,.20);
  color:#1e5f9f;
  box-shadow:0 8px 20px rgba(30,95,159,.08);
}
.jhb-fa-entry--berlin .jhb-fa-entry__icon{
  width:28px;
  height:28px;
  border-radius:999px;
  background:#fff;
  color:#1e5f9f;
}
.jhb-fa-entry--berlin .jhb-fa-entry__icon svg{width:17px;height:17px}
.jhb-fa-entry--berlin .jhb-fa-entry__copy strong{font-size:.82rem}
.jhb-fa-entry--berlin .jhb-fa-entry__copy small{display:none}
.jhb-fa-entry--berlin .jhb-fa-entry__arrow{color:#1e5f9f;font-size:.95rem}
.jhb-fa-entry--berlin:hover,
.jhb-fa-entry--berlin:focus-visible{
  background:#1e5f9f;
  border-color:#1e5f9f;
  color:#fff;
}
.jhb-fa-entry--berlin:hover .jhb-fa-entry__icon,
.jhb-fa-entry--berlin:focus-visible .jhb-fa-entry__icon{color:#1e5f9f}
.jhb-fa-entry--berlin:hover .jhb-fa-entry__arrow,
.jhb-fa-entry--berlin:focus-visible .jhb-fa-entry__arrow{color:#fff}

/* Standortseiten: CTA nach dem vorhandenen Kontaktblock. */
.jhb-fa-location-entry{
  width:min(100%,760px);
  margin:28px auto 0;
  display:flex;
  justify-content:center;
}
.jhb-fa-location-entry .jhb-fa-entry{width:100%}

/* Angebotsseiten: zweite, ruhigere Aktion auf dunklem Abschlussbereich. */
.jhb-fa-entry--inverse{
  width:auto;
  min-height:48px;
  grid-template-columns:30px auto auto;
  gap:8px;
  padding:8px 15px;
  border-radius:999px;
  background:rgba(255,255,255,.95);
  border-color:rgba(255,255,255,.48);
  box-shadow:0 10px 24px rgba(5,28,23,.16);
}
.jhb-fa-entry--inverse .jhb-fa-entry__icon{width:30px;height:30px;border-radius:999px}
.jhb-fa-entry--inverse .jhb-fa-entry__icon svg{width:18px;height:18px}
.jhb-fa-entry--inverse .jhb-fa-entry__copy strong{font-size:.86rem}
.jhb-fa-entry--inverse .jhb-fa-entry__copy small{display:none}

/* Desktop-Hauptnavigation. */
@media (min-width:1025px){
  .site-header .header-navigation .jhb-fa-menu-item--desktop>a,
  #masthead .header-navigation .jhb-fa-menu-item--desktop>a{
    min-height:31px;
    margin-left:6px;
    padding:4px 10px;
    display:inline-flex;
    align-items:center;
    gap:5px;
    border:1px solid rgba(87,147,67,.22);
    border-radius:999px;
    background:var(--jhb-fa-entry-mint);
    color:var(--jhb-fa-entry-green);
    box-shadow:0 3px 10px rgba(14,60,40,.05);
    font-size:14px;
    font-weight:800;
    line-height:1;
    text-decoration:none;
    transition:background-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  }
  .site-header .header-navigation .jhb-fa-menu-item--desktop>a:hover,
  .site-header .header-navigation .jhb-fa-menu-item--desktop>a:focus-visible,
  #masthead .header-navigation .jhb-fa-menu-item--desktop>a:hover,
  #masthead .header-navigation .jhb-fa-menu-item--desktop>a:focus-visible{
    background:var(--jhb-fa-entry-mid);
    border-color:var(--jhb-fa-entry-mid);
    color:#fff;
    transform:translateY(-1px);
    box-shadow:0 6px 14px rgba(14,60,40,.10);
  }
  .site-header .jhb-fa-menu-item__icon,
  #masthead .jhb-fa-menu-item__icon{display:grid;place-items:center;width:16px;height:16px}
  .site-header .jhb-fa-menu-item__icon svg,
  #masthead .jhb-fa-menu-item__icon svg{width:14px;height:14px}
}

/* Mobiles Kadence-Menü: eigener, klarer CTA statt vierter Schnellaktion. */
@media (max-width:1024px){
  .mobile-navigation .jhb-fa-menu-item--mobile,
  .mobile-navigation .jhb-fa-menu-item--desktop,
  .mobile-menu-container .jhb-fa-menu-item--mobile,
  .mobile-menu-container .jhb-fa-menu-item--desktop,
  .popup-drawer .jhb-fa-menu-item--mobile,
  .popup-drawer .jhb-fa-menu-item--desktop,
  #mobile-menu .jhb-fa-menu-item--mobile,
  #mobile-menu .jhb-fa-menu-item--desktop{
    margin:14px 14px 8px;
  }

  .mobile-navigation .jhb-fa-menu-item--mobile>a,
  .mobile-navigation .jhb-fa-menu-item--desktop>a,
  .mobile-menu-container .jhb-fa-menu-item--mobile>a,
  .mobile-menu-container .jhb-fa-menu-item--desktop>a,
  .popup-drawer .jhb-fa-menu-item--mobile>a,
  .popup-drawer .jhb-fa-menu-item--desktop>a,
  #mobile-menu .jhb-fa-menu-item--mobile>a,
  #mobile-menu .jhb-fa-menu-item--desktop>a{
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:11px 16px;
    border:1px solid rgba(87,147,67,.26);
    border-radius:16px;
    background:linear-gradient(135deg,#f7fffb,var(--jhb-fa-entry-mint));
    color:var(--jhb-fa-entry-green);
    font-weight:850;
    text-align:center;
    box-shadow:0 10px 24px rgba(14,60,40,.08);
  }

  .mobile-navigation .jhb-fa-menu-item__icon,
  .mobile-menu-container .jhb-fa-menu-item__icon,
  .popup-drawer .jhb-fa-menu-item__icon,
  #mobile-menu .jhb-fa-menu-item__icon{display:grid;place-items:center;width:24px;height:24px}

  .jhb-fa-entry--hero{margin-inline:auto}
  .jhb-fa-location-entry{margin-top:22px}
}

@media (max-width:640px){
  .jhb-fa-entry{grid-template-columns:38px minmax(0,1fr) auto;padding:12px;border-radius:18px}
  .jhb-fa-entry__icon{width:38px;height:38px;border-radius:12px}
  .jhb-fa-entry__copy strong{font-size:.9rem}
  .jhb-fa-entry__copy small{font-size:.72rem}
  .jhb-fa-entry--inverse{width:100%;max-width:22rem;justify-content:center;grid-template-columns:28px auto auto}
}

@media (prefers-reduced-motion:reduce){
  .jhb-fa-entry,.jhb-fa-entry__arrow,
  .jhb-fa-menu-item>a{transition:none}
  .jhb-fa-entry:hover,.jhb-fa-entry:focus-visible{transform:none}
}
