/* --- CONTACT CTA: MASTER SETUP & RESPONSIVE --- */
:root {
  --bb-blue: #0b5fa5;
  --bb-gray: #2d3748;
  --bb-8-line: 8.2%;
}

.bb-cta-modul {
  background-color: #f5f6f7 !important;
  /* Konsistenter Sektionsabstand zum Rest der Seite */
  padding: 120px 0 !important;
  width: 100% !important;
}

.bb-cta-wrapper {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* HEADLINE: JETZT KONSISTENT (Sync mit Hero/Service/Team) */
.bb-cta-title {
  font-family: 'Poppins', sans-serif !important;
  font-size: 42px !important;
  color: var(--dark-blue) !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  margin: 0 0 52px 0 !important; 
  white-space: pre-wrap !important;
  hyphens: none !important;
}

.bb-cta-subline,
.bb-cta-subline * {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  color: var(--text-grey) !important;
  line-height: 1.6 !important;
}

.bb-cta-hinweis {
  font-family: 'Inter', sans-serif !important;
  color: #718096 !important;
  display: block !important;
  line-height: 1.2 !important;
  font-size: 14px !important;
  margin-top: 20px !important;
}

/* --- BUTTON-STYLING & HOVER --- */
.bb-cta-button {
  display: inline-block !important;
  background-color: var(--bb-blue) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  padding: 18px 50px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
  box-shadow: 0 4px 15px rgba(11, 95, 165, 0.15);
}

.bb-cta-button:hover {
  background-color: #0056b3 !important; 
  transform: translateY(-4px) !important; 
  box-shadow: 0 12px 30px rgba(11, 95, 165, 0.25) !important;
}

NEU:
.bb-cta-subline {
  max-width: 800px;
}

.bb-cta-hinweis {
  max-width: 800px;
  margin-top: 0 !important;
  margin-bottom: 35px !important;
}

/* --- RESPONSIVE ANPASSUNGEN --- */

@media (max-width: 1200px) {
  .bb-cta-title { font-size: 46px !important; }
}

@media (max-width: 767px) {
  .bb-cta-modul { padding: 80px 0 !important; }
  .bb-cta-wrapper { padding: 0 25px !important; }
  
  .bb-cta-title { 
    font-size: 32px !important; /* Konsistent zu den anderen Modulen */
    line-height: 1.2 !important;
    margin-bottom: 25px !important;
  }
  
  .bb-cta-subline, .bb-cta-subline * {
    font-size: 18px !important;
    margin-bottom: 85px !important;
  }
  
  .bb-cta-button {
    width: 100%; /* Volle Breite für bessere Bedienbarkeit auf Mobile */
    text-align: center;
    padding: 16px 30px !important;
    font-size: 15px !important;
  }
}

/* CTA SPACING OVERRIDE (ganz unten einfügen) */
.bb-cta-modul .bb-cta-subline,
.bb-cta-modul .bb-cta-subline * {
  margin: 0 !important;
}

.bb-cta-modul .bb-cta-subline {
  padding-bottom: 75px !important; /* Luft nach der Subline */
}

.bb-cta-modul .bb-cta-hinweis {
  margin-top: 0 !important;
  padding-bottom: 55px !important; /* Luft vor dem Button */
}


/* --- DUNKEL-VARIANTE (Farbschema = Dunkel) · additiv, Default bleibt hell --- */
.bb-cta-modul--dark {
  background-color: #0b1f3a !important;
}
.bb-cta-modul--dark .bb-cta-title {
  color: #ffffff !important;
}
.bb-cta-modul--dark .bb-cta-subline,
.bb-cta-modul--dark .bb-cta-subline * {
  color: #c8d4e0 !important;
}
.bb-cta-modul--dark .bb-cta-hinweis {
  color: #8fb2d6 !important;
}

/* --- HOVER wie globaler .bb-btn-primary (Navy-Wipe von oben) --- */
.bb-cta-button {
  position: relative !important;
  overflow: hidden !important;
  z-index: 0 !important;
  box-shadow: none !important;
  transition: color var(--bb-trans, 0.35s ease) !important;
}
.bb-cta-button::before {
  content: '' !important;
  position: absolute !important;
  top: -100% !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: #0b1f3a !important;
  transition: top var(--bb-trans, 0.35s ease) !important;
  z-index: -1 !important;
}
.bb-cta-button:hover::before { top: 0 !important; }
.bb-cta-button:hover {
  background-color: #0b5fa5 !important;
  color: #ffffff !important;
  transform: none !important;
  box-shadow: none !important;
}


/* ============================================================
   v1.1 · 19.10.2026 · Layout „Zwei Spalten mit Person-Karte“
   (Mockup Startseite v3, Sektion 10). Layout „classic“ unverändert.
   Tweak-Werte:
     Section-Pad   96px (unter 900px: 64px)
     Spalten       1.15fr / .85fr · Gap 56px
     Button        #0b5fa5 · 600 15px · Pad 14/26px · Radius 4px (Navy-Wipe bleibt)
     Hinweis       14px #9fb5cd
     Person-Karte  rgba(255,255,255,.05) · Linie rgba(255,255,255,.14) · Radius 6px · Foto 72px rund
   ============================================================ */
.bb-cta-modul.bb-cta-modul--split { padding: 96px 0 !important; }
.bb-cta-split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 56px;
  align-items: center;
}
.bb-cta-split__eyebrow {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0b5fa5;
  margin-bottom: 14px;
}
.bb-cta-modul--dark .bb-cta-split__eyebrow { color: #4f9ad9; }
.bb-cta-modul--split .bb-cta-split__title {
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: #0b1f3a !important;
  text-decoration: none !important;
  margin: 0 !important;
}
.bb-cta-modul--split.bb-cta-modul--dark .bb-cta-split__title { color: #ffffff !important; }
.bb-cta-modul--split .bb-cta-split__lead,
.bb-cta-modul--split .bb-cta-split__lead * {
  font-family: 'Inter', sans-serif !important;
  font-size: 18px !important;
  line-height: 1.65 !important;
  color: #5a6776 !important;
  margin: 0 !important;
}
.bb-cta-modul--split.bb-cta-modul--dark .bb-cta-split__lead,
.bb-cta-modul--split.bb-cta-modul--dark .bb-cta-split__lead * { color: #b9c7d8 !important; }
.bb-cta-modul--split .bb-cta-split__lead { margin-top: 18px !important; max-width: 62ch; }
.bb-cta-split__row { margin-top: 30px; display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.bb-cta-modul--split .bb-cta-split__btn {
  display: inline-block;
  position: relative;
  overflow: hidden;
  z-index: 0;
  background: #0b5fa5 !important;
  color: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  padding: 14px 26px !important;
  border-radius: 4px !important;
  border: 1px solid #0b5fa5;
  transition: color .35s ease;
}
.bb-cta-modul--split .bb-cta-split__btn::before {
  content: '';
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #0b1f3a;
  transition: top .35s ease;
  z-index: -1;
}
.bb-cta-modul--split .bb-cta-split__btn:hover::before { top: 0; }
.bb-cta-modul--split .bb-cta-split__hint { font-family: 'Inter', sans-serif; font-size: 14px; color: #9fb5cd; }

.bb-cta-split__person {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 6px;
  padding: 26px;
  display: flex;
  gap: 18px;
  align-items: center;
}
.bb-cta-split__ph {
  flex: 0 0 auto;
  display: block;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  background: linear-gradient(140deg, #1b3a5c, #0b1f3a);
  border: 1px solid rgba(255, 255, 255, .14);
}
.bb-cta-split__person .bb-cta-split__n { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 17px; color: #ffffff; }
.bb-cta-split__person .bb-cta-split__r { font-size: 14px; color: #9fb5cd; }
.bb-cta-split__person .bb-cta-split__m { display: inline-block; margin-top: 8px; font-size: 14px; color: #4f9ad9 !important; text-decoration: none !important; }

@media (max-width: 900px) {
  .bb-cta-modul.bb-cta-modul--split { padding: 64px 0 !important; }
  .bb-cta-split { grid-template-columns: 1fr; gap: 32px; }
}


/* v1.2 · 19.10.2026 · Anker-ID · Scroll-Abstand für fixierten Header
   Tweak-Wert: scroll-margin-top 90px */
.bb-cta-modul[id] { scroll-margin-top: 90px; }
