/* =========================================================
   Seite „Bewerber“ (Original: Elementor post-606)
   Nutzt aus base.css: .hero, .sec, .panel, .timeline/.tl-*, .cta-box, .btn
   Präfix: .b-
   ========================================================= */

/* ---------- Hero (#50b61d2) ---------- */
.b-hero-title { max-width: none; background-color: #B3B3B305; }
.b-hero-text {                                   /* #5bf2003 */
  width: 710px;
  max-width: 100%;
  font-family: var(--f-text);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--c-white);
}
.b-hero-text p { margin-block-end: .9rem; }

/* ---------- Deine Vorteile (#65f6eac) ---------- */
.b-adv { padding-block: 80px 30px; }
.b-adv-inner { display: flex; flex-direction: column; }
.b-adv-heading {                                 /* #2dff2db */
  margin-bottom: 20px;
  font-family: var(--f-heading);
  font-size: 49px;
  font-weight: 600;
  line-height: 1.2em;
  text-align: center;
  color: #000;
}
.b-adv-grid {                                    /* #4b66b0a */
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.b-adv-card {                                    /* #7531cbf … */
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  padding: 20px 15px;
  border-radius: 8px;
  background: var(--c-panel);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
}
.b-adv-box { text-align: center; }               /* Image-Box, Bild oben */
.b-adv-img { display: inline-block; width: 20%; margin: 0; }
.b-adv-img img { border-radius: 2px; transition-duration: .3s; }
.b-adv-content { width: 100%; }
.b-adv-title {
  margin: .5rem 0 15px;
  font-family: var(--f-text);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--c-primary);
}
.b-adv-text {
  margin: 0;
  font-family: var(--f-text);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  color: #000;
}
.b-adv-btn { margin-top: 40px; }                 /* 20px Container-gap + 20px Widget-Abstand */
.b-btn-apply { border: 2px solid var(--c-white); }
.b-btn-apply:hover, .b-btn-apply:focus-visible { background: var(--c-secondary); border-color: var(--c-secondary); }

/* ---------- Formular-Kasten (#6bb0eeb / #02835ce) ---------- */
.b-form-sec { padding: 0 0 1px; }
.b-form-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 80px 100px;
  border-radius: 20px;
  background: var(--c-panel);
}
.b-form-box.is-animated { animation-delay: .2s; }

/* ---------- Voraussetzungen (#732907e) ---------- */
.b-req { padding-block: 80px; }
.b-req-inner { display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.b-req-heading {                                 /* #49de4f5 */
  font-family: var(--f-heading);
  font-size: 48px;
  font-weight: 600;
  line-height: 1.2em;
  text-align: center;
  color: #000;
}
.b-req-lead {                                    /* #f37d02b */
  margin-bottom: 30px;
  font-family: var(--f-text);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  color: #000;
}
.b-req-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.b-req-card {
  min-width: 0;                                  /* Elementor-Grid-Kinder schrumpfen unter min-content */
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  padding: 50px 30px;
  border-radius: 10px;
  background: var(--c-panel);
}
.b-req-img { text-align: center; }
.b-req-img img { display: inline-block; vertical-align: middle; width: 15%; }
.b-req-card-title {
  font-family: var(--f-heading);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2em;
  text-align: center;
  color: #000;
}
.b-req-text {
  font-family: var(--f-text);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  color: #000;
}

/* ---------- Bewerbungsprozess (#10651c1) – Zeitstrahl aus base.css ---------- */
.b-process { padding-block: 50px 80px; }
.b-process-sub {                                 /* #0e8b892 */
  font-family: var(--f-text);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  color: #000;
}
.b-timeline.is-animated { animation-delay: .2s; }
.b-timeline .tl-item--right .tl-num { top: 49%; }
/* Streifen: 3rem breit, schrumpft wie im Original (Flex-Shrink gegen das 100%-breite Text-Widget):
   ergibt ≈37px bei 1440, ≈42px bei 800, ≈38px bei 390 */
.b-timeline .tl-strip { flex: 0 1 3rem; align-self: center; }  /* Karte: align-items center, Streifen wird nicht gestreckt */
.b-timeline .tl-content { flex: 0 1 100%; }
/* h3 in Elementor-Image-Box: margin-block-start .5rem (Theme) – fehlt in base.css .tl-title */
.b-timeline .tl-title { margin-top: .5rem; }

/* ---------- FAQ (#5835061 / Nested Accordion #a2296b5) ---------- */
.b-faq { padding-block: 60px; }
.b-faq-inner { display: flex; flex-direction: column; gap: 20px; }
.b-faq-heading {                                 /* #41c7be7 */
  font-family: var(--f-heading);
  font-size: 45px;
  font-weight: 600;
  line-height: 1.2em;
  text-align: center;
  color: var(--c-primary);
}
.b-accordion {
  --acc-title-font: var(--f-text);
  --acc-title-size: 20px;
  --acc-title-weight: 700;
  --acc-title-lh: 1.4;
  --acc-title-color: #000;
  --acc-title-hover: var(--c-secondary);
  --acc-title-active: var(--c-secondary);
  --acc-icon-size: 15px;
  --acc-space-between: 18px;
  --acc-distance: 0px;
  --acc-padding: 20px;
  --acc-border: 0 none;
  --acc-content-padding: 0 20px 20px;
  --acc-item-shadow: 0 0 25px 0 rgba(0, 0, 0, .125);
}
.b-accordion .acc-body {                         /* #47f2dcf … */
  font-family: var(--f-text);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  color: #000;
}
.b-accordion .acc-body p { margin-block-end: 0; }

/* ---------- CTA (#5595364) – .cta-box aus base.css ---------- */
.b-cta-title { font-size: 40px; }

/* =========================================================
   TABLET ≤ 1024px
   ========================================================= */
@media (max-width: 1024px) {
  .b-hero-text { line-height: 1.5; }

  .b-adv-grid { grid-template-columns: repeat(2, 1fr); }
  .b-adv-title { font-size: 16px; line-height: 1.5; }
  .b-adv-text { line-height: 1.5; }

  .b-form-box { padding: 60px 15px; }

  .b-req-lead { font-size: 16px; line-height: 1.5; }
  .b-req-text { line-height: 1.5; }

  .b-process-sub { font-size: 16px; line-height: 1.5; }
  .b-timeline .tl-item:nth-child(5) { gap: 20px; }

  .b-accordion { --acc-title-size: 16px; --acc-title-lh: 1.5; }
  .b-accordion .acc-body { line-height: 1.5; }

  .b-cta-title { font-size: 24px; }
}

/* =========================================================
   MOBIL ≤ 767px
   ========================================================= */
@media (max-width: 767px) {
  .b-hero-text { line-height: 1.4; }

  .b-adv { padding-block: 30px; }
  .b-adv-heading { font-size: 24px; line-height: 1.1em; }
  .b-adv-grid { grid-template-columns: 1fr; }
  .b-adv-title, .b-adv-text { line-height: 1.4; }
  .b-btn-apply { font-size: 14px; }

  .b-form-box { padding: 30px; }

  .b-req { padding-block: 30px; }
  .b-req-heading { align-self: center; width: 240px; max-width: 240px; font-size: 24px; line-height: 1.1em; }
  .b-req-lead, .b-req-text { line-height: 1.4; }
  .b-req-grid { grid-template-columns: 1fr; }
  /* Elementor: --flex-wrap-mobile → mehrzeiliger Spalten-Flex; Chrome berechnet die Höhe des Bild-Widgets
     dabei ohne das prozentual breite Bild (nur Zeilenhöhe) → Titel rückt wie im Original ans Icon heran */
  .b-req-card { flex-wrap: wrap; }
  .b-req-card-title { font-size: 18px; line-height: 1.1em; }

  .b-process .title-grotesk { font-size: 2rem; }
  .b-process-sub { line-height: 1.4; }
  .b-timeline .tl-item:nth-child(5) { gap: 0; }
  .b-timeline .tl-item:nth-child(2) .tl-strip,
  .b-timeline .tl-item:nth-child(5) .tl-strip { min-height: 8.5rem; }
  .b-timeline .tl-item:nth-child(2) .tl-card { padding-right: 1rem; }
  .b-timeline .tl-title { font-size: 20px; }

  .b-faq-heading { font-size: 24px; line-height: 1.1em; }
  .b-accordion { --acc-title-lh: 1.4; }
  .b-accordion .acc-body { line-height: 1.4; }

  .b-cta-title { line-height: 1.1em; }
}