/* =========================================================
   CJB Header 2026 – modernes Menü, Hero und Suchmaske
   Nur Kopfbereich. Farben unten in :root anpassbar.
   ========================================================= */
:root{
  --cjb-blau:#1F3A6E;      /* Hero-Hintergrund, Buttons */
  --cjb-blau-hell:#DBE4F5; /* Untertitel im Hero */
  --cjb-akzent:#F2C14E;    /* Button "Jobs finden" */
  --cjb-text:#18202C;
  --cjb-grau:#4B5565;
  --cjb-feld:#F4F6FA;
}

/* ---------- Kopfzeile / Menü (alle Seiten) ---------- */
#header .head{background:#fff;box-shadow:0 1px 0 #e6e9ef}
#header .loga img{max-height:64px;width:auto;height:auto}
#header .headmenu > .container{display:flex;align-items:center;justify-content:space-between}
#header .headmenu > .container:before,#header .headmenu > .container:after{display:none}
#header .headmenu .loga{width:auto;flex:0 0 auto;float:none}
#header .headmenu .col-md-9{width:auto;flex:1 1 auto;float:none}
#main-menu.navbar-collapse{padding:0 !important}
#main-menu .nav-menu{margin:0 !important}
#main-menu .nav-menu > li{padding:0 10px !important}
#main-menu .nav-menu > li > a{
  font-family:'Roboto',Arial,sans-serif;font-size:15px;font-weight:500;
  color:var(--cjb-text);letter-spacing:0;text-transform:none;
  padding-top:10px;padding-bottom:10px;transition:color .15s ease;
}
#main-menu .nav-menu > li > a:hover,
#main-menu .nav-menu > li.current-menu-item > a{color:var(--cjb-blau)}
/* Buttons rechts neben dem Menü: Anmelden + Für Arbeitgeber */
#menu-wrapper{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}
#menu-wrapper > .clear,#menu-wrapper > .clear-10{display:none}
#main-menu.navbar-collapse{flex:0 1 auto}
.cjb-header-actions{display:flex;align-items:center;gap:10px;margin-left:8px}
.cjb-header-actions a{
  display:inline-block;white-space:nowrap;font-family:'Roboto',Arial,sans-serif;font-size:15px;font-weight:500;
  line-height:20px;padding:11px 20px;border-radius:999px;text-decoration:none;transition:background .15s ease,color .15s ease;
}
.cjb-btn-outline{border:1.5px solid var(--cjb-text);color:var(--cjb-text) !important;background:#fff}
.cjb-btn-outline:hover{background:var(--cjb-text);color:#fff !important}
.cjb-btn-primary{border:1.5px solid var(--cjb-blau);background:var(--cjb-blau);color:#fff !important}
.cjb-btn-primary:hover{background:#142849;border-color:#142849}
/* Obere Leiste nur noch für eingeloggte Nutzer (Kontomenü) */
body:not(.logged-in) #header-bar{display:none}
#main-menu .nav-menu ul{border-radius:12px;box-shadow:0 12px 32px rgba(16,28,56,.14);overflow:hidden}

/* ---------- Hero (nur Startseite) ---------- */
.cjb-hero.homy-image{
  background-image:none !important;background-color:var(--cjb-blau) !important;
  height:auto !important;min-height:0 !important;padding:0 !important;
}
.cjb-hero.homy-has-overlay:before,.cjb-hero.homy-has-overlay:after,
.cjb-hero .banner-wrapper:before,.cjb-hero .banner-wrapper:after{display:none !important}
.cjb-hero .banner-wrapper{position:static !important;padding:64px 0 0 !important;background:none !important;height:auto !important}
.cjb-hero .title-search{text-align:left;max-width:820px;margin:0 0 40px;padding:0 15px}
.cjb-hero .title-search-title,.cjb-hero .title-search p{text-align:left !important}
.cjb-hero .title-search-title{
  font-family:'Roboto',Arial,sans-serif;font-weight:700;color:#fff;
  font-size:56px;line-height:1.08;letter-spacing:-.02em;margin:0 0 16px;text-shadow:none;
}
.cjb-hero .title-search p{font-size:20px;line-height:1.5;color:var(--cjb-blau-hell);margin:0;text-shadow:none}

/* Suchkarte, ragt unten aus dem blauen Band heraus */
.cjb-hero form#searchform{position:relative;z-index:5;margin-bottom:-56px}
.cjb-hero .search-wrap.fronty{background:transparent !important;padding:0 !important}
.cjb-hero .search-wrap.fronty > .container{
  display:flex;flex-wrap:wrap;gap:12px;align-items:stretch;
  background:#fff;border-radius:20px;padding:16px !important;
  box-shadow:0 18px 40px rgba(16,28,56,.18);width:auto;max-width:1140px;margin:0 15px;
}
.cjb-hero .search-wrap.fronty > .container:before,
.cjb-hero .search-wrap.fronty > .container:after{display:none}
.cjb-hero .search-wrap.fronty > .container > div{
  float:none;width:auto;padding:0 !important;position:relative;
}
.cjb-hero .search-wrap.fronty .col-md-5{flex:2 1 300px}
.cjb-hero .search-wrap.fronty .col-md-3{flex:1 1 200px}
.cjb-hero .search-wrap.fronty .col-md-2:not(:last-of-type){flex:0 1 170px}
.cjb-hero .search-wrap.fronty .col-md-2:last-of-type{flex:0 0 auto}

.cjb-hero .cjb-label{
  position:absolute;left:16px;top:10px;z-index:2;margin:0;
  font-size:12px;font-weight:600;color:var(--cjb-grau);pointer-events:none;
}
.cjb-hero .search-wrap input#search,
.cjb-hero .search-wrap input#near{
  height:64px !important;width:100% !important;box-sizing:border-box;
  background:var(--cjb-feld) !important;border:2px solid transparent !important;border-radius:12px !important;
  padding:24px 16px 6px !important;font-size:16px !important;color:var(--cjb-text) !important;box-shadow:none !important;
}
.cjb-hero .search-wrap input#search:focus,
.cjb-hero .search-wrap input#near:focus{border-color:var(--cjb-blau) !important;background:#fff !important;outline:0}
.cjb-hero .search-wrap .form-control-feedback{display:none}

/* Umkreis (normales Select oder Theme-Selectbox) */
.cjb-hero .search-wrap .radius{position:relative;height:64px}
.cjb-hero .search-wrap select#radius,
.cjb-hero .search-wrap .sbHolder{
  height:64px !important;width:100% !important;box-sizing:border-box;margin:0 !important;
  background:var(--cjb-feld) !important;border:2px solid transparent !important;border-radius:12px !important;
  padding:0 14px !important;font-size:16px !important;color:var(--cjb-text) !important;box-shadow:none !important;
}
.cjb-hero .search-wrap .sbSelector{line-height:60px !important;color:var(--cjb-text) !important;text-indent:2px;font-size:16px}

.cjb-hero .search-wrap button.submit{
  height:64px;min-width:170px;padding:0 28px;border:0;border-radius:12px;
  background:var(--cjb-akzent) !important;color:var(--cjb-text) !important;
  font-size:17px;font-weight:700;cursor:pointer;transition:filter .15s ease;
}
.cjb-hero .search-wrap button.submit:hover{filter:brightness(.95)}
.cjb-hero .search-wrap button.submit:focus-visible,
.cjb-hero .search-wrap input:focus-visible{outline:3px solid #9cc5f0;outline-offset:2px}

/* Vertrauens-Zahlen unter der Suchkarte */
.cjb-stats-wrap{clear:both;background:#f4f6fa;padding:88px 0 32px !important;margin:0 !important}
.cjb-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;max-width:1140px;margin:0 auto;padding:0 30px}
.cjb-stats div{font-size:14px;color:var(--cjb-grau);line-height:1.4}
.cjb-stats strong{display:block;font-size:28px;font-weight:700;color:var(--cjb-text);letter-spacing:-.01em}

/* ---------- Tablet / Handy ---------- */
@media (max-width:991px){
  .cjb-hero .title-search-title{font-size:42px}

}
@media (max-width:600px){
  .cjb-hero .banner-wrapper{padding-top:40px !important}
  .cjb-hero .title-search-title{font-size:34px}
  .cjb-hero .title-search p{font-size:17px}
  .cjb-hero .search-wrap.fronty > .container > div{flex:1 1 100% !important}
  .cjb-hero .search-wrap button.submit{width:100%}
  .cjb-stats strong{font-size:22px}
}

/* Handy: Logo + Menü-Button oben, darunter die zwei Buttons */
@media (max-width:767px){
  #header .headmenu > .container{flex-wrap:wrap;position:relative;padding-top:10px;padding-bottom:12px}
  #header .headmenu .col-md-9{flex:1 1 100%;padding:0}
  #header .loga img{max-height:52px}
  #header .headmenu .col-md-9,#header .headmenu .loga,#menu-wrapper{position:static !important}
  #menu-wrapper{justify-content:flex-start}
  .cjb-hero .search-wrap.fronty > .container{margin:0 !important}
  #header .navbar-toggle{position:absolute !important;top:18px !important;right:15px !important;margin:0 !important}
  .cjb-header-actions{order:2;width:100%;margin:4px 0 0;gap:8px}
  .cjb-header-actions a{flex:1 1 0;text-align:center;padding:10px 12px;font-size:14px}
  #main-menu.navbar-collapse{order:3;flex:1 1 100%}
  #main-menu .nav-menu > li{padding:0 !important}
}

/* Marken-Zeile über der Überschrift (Option A) */
.cjb-hero .cjb-eyebrow{
  font-family:'Roboto',Arial,sans-serif;font-size:14px;font-weight:700;line-height:1.2;
  letter-spacing:.14em;text-transform:uppercase;color:#9CC5F0;margin:0 0 14px;text-align:left;
}
@media (max-width:600px){.cjb-hero .cjb-eyebrow{font-size:12px;letter-spacing:.12em;margin-bottom:10px}}

/* ---------- Kategorie-Kacheln Startseite: einheitliche Linien-Icons statt Emojis ---------- */
.cjb-tiles .cjb-ico{font-size:0!important;line-height:0!important;position:relative;flex:0 0 auto}
.cjb-tiles .cjb-ico{width:48px;height:48px;border-radius:12px;background:#EAF0FA;margin-bottom:8px}
.cjb-tiles .cjb-ico::before{content:"";position:absolute;inset:12px;background:#1F3A6E;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.cjb-home .cjb-tiles a:hover .cjb-ico{background:#1F3A6E}
.cjb-home .cjb-tiles a:hover .cjb-ico::before{background:#fff}
.cjb-tiles a[href*="theologie"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202v5M9.5%204.5h5%22%2F%3E%3Cpath%20d%3D%22M5%2022V11l7-4%207%204v11%22%2F%3E%3Cpath%20d%3D%22M2%2022h20%22%2F%3E%3Cpath%20d%3D%22M10%2022v-4a2%202%200%200%201%204%200v4%22%2F%3E%3C%2Fsvg%3E")}
.cjb-tiles a[href*="paedagogik"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%205h6a4%204%200%200%201%204%204v12a3%203%200%200%200-3-3H2z%22%2F%3E%3Cpath%20d%3D%22M22%205h-6a4%204%200%200%200-4%204v12a3%203%200%200%201%203-3h7z%22%2F%3E%3C%2Fsvg%3E")}
.cjb-tiles a[href*="gesundheit"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19.5%2013.5%2012%2021l-7.5-7.5A5%205%200%200%201%2012%206.5a5%205%200%200%201%207.5%207z%22%2F%3E%3Cpath%20d%3D%22M8%2012.5h2.5l1.5-2.5%202%204%201.5-1.5H17%22%2F%3E%3C%2Fsvg%3E")}
.cjb-tiles a[href*="fundraising"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11%2014h2a2%202%200%200%200%200-4h-3c-.6%200-1.1.2-1.4.6L3%2016%22%2F%3E%3Cpath%20d%3D%22m7%2020%201.6-1.4c.3-.4.8-.6%201.4-.6h4c1.1%200%202.1-.4%202.8-1.2l4.6-4.4a2%202%200%200%200-2.8-2.8L14.4%2013%22%2F%3E%3Cpath%20d%3D%22M2%2015l6%206%22%2F%3E%3Cpath%20d%3D%22M19.5%205.5a2.1%202.1%200%200%200-3-3L16%203l-.5-.5a2.1%202.1%200%200%200-3%203L16%209z%22%2F%3E%3C%2Fsvg%3E")}
.cjb-tiles a[href*="mission"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cpath%20d%3D%22M2%2012h20%22%2F%3E%3Cpath%20d%3D%22M12%202a15%2015%200%200%201%200%2020a15%2015%200%200%201%200-20%22%2F%3E%3C%2Fsvg%3E")}
.cjb-tiles a[href*="kaufmaen"] .cjb-ico{--i:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%227%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M16%207V5a2%202%200%200%200-2-2h-4a2%202%200%200%200-2%202v2%22%2F%3E%3Cpath%20d%3D%22M2%2013h20%22%2F%3E%3C%2Fsvg%3E")}