/* ==========================================================================
   B_77 OVERRIDE.CSS — Stand 16.05.2026, sauber neu aufgebaut
   ========================================================================== */

/* Content-Begrenzung auf großen Monitoren */
.hero, .stats, .sub-hero, footer {
  max-width: 1500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 900px) {
  .hero, .stats, .sub-hero, footer { max-width: 100% !important; }
}

/* Sales-Intelligence-Button */
.si-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 20px 40px !important;
  background: #00F5FF !important;
  color: #0A0A0A !important;
  border: 2px solid #00F5FF !important;
  font-family: "Inter Tight", sans-serif !important;
  font-size: 14px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  transition: all .3s !important;
}
.si-teaser:hover .si-cta {
  background: var(--bg) !important;
  color: #00F5FF !important;
  border-color: #00F5FF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px -10px rgba(0,245,255,.5) !important;
}
@media (max-width: 900px) {
  .si-cta { padding: 16px 28px !important; font-size: 13px !important; }
}

/* MINI-KARTEN unter den Services */
.mini-cards {
  max-width: 1400px !important;
  margin: 40px auto 0 !important;
  padding: 0 40px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 24px !important;
  box-sizing: border-box !important;
}
.mini-card {
  background: var(--bg-panel) !important;
  border: 1px solid var(--line) !important;
  padding: 32px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1) !important;
  text-decoration: none !important;
  color: inherit !important;
  display: block !important;
  min-width: 0 !important;
}
.mini-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: var(--ink) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .6s ease !important;
}
.mini-card:hover { border-color: var(--ink) !important; transform: translateY(-4px) !important; }
.mini-card:hover::before { transform: scaleX(1) !important; }
.mini-card-num {
  font-size: 11px !important;
  letter-spacing: .2em !important;
  color: var(--ink-mute) !important;
  margin-bottom: 28px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
}
.mini-card-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
  margin: 0 0 14px !important;
  color: var(--ink) !important;
}
.mini-card-text {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: var(--ink-dim) !important;
  margin: 0 0 28px !important;
}
.mini-card-arrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 11px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
  transition: gap .3s !important;
  font-weight: 600 !important;
}
.mini-card:hover .mini-card-arrow { gap: 20px !important; }
@media (max-width: 900px) {
  .mini-cards { grid-template-columns: 1fr !important; padding: 0 20px !important; }
  .mini-card { padding: 28px !important; }
}

/* AUS DEM MAGAZIN */
.magazine-section {
  padding: 120px 40px !important;
  background: var(--bg-2) !important;
  border-top: 1px solid var(--line) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
}
.magazine-section::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, #00F5FF 50%, transparent 100%) !important;
  opacity: 0.5 !important;
}
.magazine-head { max-width: 1400px !important; margin: 0 auto 60px !important; }
.magazine-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: "Inter Tight", sans-serif !important;
  font-size: 11px !important;
  letter-spacing: .28em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 600 !important;
  margin-bottom: 28px !important;
}
.magazine-pulse {
  width: 8px !important; height: 8px !important;
  border-radius: 50% !important;
  background: #00F5FF !important;
  box-shadow: 0 0 12px rgba(0,245,255,0.6) !important;
  animation: si-pulse 2.5s ease-in-out infinite !important;
}
.magazine-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: var(--ink) !important;
  margin: 0 !important;
  max-width: 900px !important;
}
.magazine-title em { font-style: italic !important; font-weight: 500 !important; }
.magazine-grid {
  max-width: 1400px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 24px !important;
}
.magazine-post {
  display: block !important;
  background: var(--bg-panel) !important;
  border: 1px solid var(--line) !important;
  padding: 32px !important;
  text-decoration: none !important;
  color: inherit !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1) !important;
  min-width: 0 !important;
}
.magazine-post::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: #00F5FF !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .5s ease !important;
}
.magazine-post:hover { border-color: var(--ink) !important; transform: translateY(-4px) !important; }
.magazine-post:hover::before { transform: scaleX(1) !important; }
.magazine-meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 11px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 500 !important;
  margin-bottom: 24px !important;
}
.magazine-rubric { color: #00F5FF !important; font-weight: 700 !important; }
.magazine-post-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  letter-spacing: -.02em !important;
  color: var(--ink) !important;
  margin: 0 0 16px !important;
}
.magazine-post-text {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: var(--ink-dim) !important;
  margin: 0 0 28px !important;
}
.magazine-read {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 11px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--ink) !important;
  transition: gap .3s !important;
}
.magazine-post:hover .magazine-read { gap: 18px !important; }
.magazine-foot { max-width: 1400px !important; margin: 60px auto 0 !important; text-align: center !important; }
.magazine-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 20px 40px !important;
  background: #00F5FF !important;
  color: #0A0A0A !important;
  border: 2px solid #00F5FF !important;
  font-family: "Inter Tight", sans-serif !important;
  font-size: 14px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all .3s !important;
}
.magazine-cta:hover {
  background: var(--bg) !important;
  color: #00F5FF !important;
  border-color: #00F5FF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px -10px rgba(0,245,255,.5) !important;
}
@media (max-width: 900px) {
  .magazine-section { padding: 80px 20px !important; }
  .magazine-grid { grid-template-columns: 1fr !important; }
  .magazine-cta { padding: 16px 28px !important; font-size: 13px !important; }
}

/* KI IM VERTRIEB — Phasen-Schaubild */
.ki-phases {
  padding: 120px 40px !important;
  background: var(--bg-2) !important;
  border-top: 1px solid var(--line) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
}
.ki-phases::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, #00F5FF 50%, transparent 100%) !important;
  opacity: 0.5 !important;
}
.ki-phases-head { max-width: 1400px !important; margin: 0 auto 60px !important; }
.ki-phases-label {
  font-size: 11px !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 600 !important;
  margin-bottom: 20px !important;
}
.ki-phases-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: var(--ink) !important;
  margin: 0 !important;
  max-width: 900px !important;
}
.ki-phases-title em { font-style: italic !important; font-weight: 500 !important; }
.ki-pipeline {
  max-width: 1400px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
.ki-phase {
  background: var(--bg-panel) !important;
  border: 1px solid var(--line) !important;
  padding: 32px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1) !important;
}
.ki-phase::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 2px !important;
  background: #00F5FF !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .5s ease !important;
}
.ki-phase:hover { border-color: var(--ink) !important; transform: translateY(-4px) !important; }
.ki-phase:hover::before { transform: scaleX(1) !important; }
.ki-phase-num {
  font-family: "Inter Tight", sans-serif !important;
  font-size: 12px !important;
  letter-spacing: .2em !important;
  font-weight: 700 !important;
  color: #00F5FF !important;
  margin-bottom: 24px !important;
}
.ki-phase-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: 24px !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
  color: var(--ink) !important;
  margin: 0 0 14px !important;
}
.ki-phase-text {
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: var(--ink-dim) !important;
  margin: 0 0 24px !important;
}
.ki-phase-tools { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
.ki-tool {
  display: inline-flex !important;
  padding: 5px 11px !important;
  font-size: 10.5px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--ink-dim) !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: var(--bg) !important;
}
@media (max-width: 1100px) { .ki-pipeline { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 720px) {
  .ki-phases { padding: 80px 20px !important; }
  .ki-pipeline { grid-template-columns: 1fr !important; }
  .ki-phase { padding: 28px !important; }
}

/* CTA-Section auf KI-Seite */
.cta-section {
  padding: 100px 40px !important;
  text-align: center !important;
  max-width: 900px !important;
  margin: 0 auto !important;
}
.cta-section .label {
  font-size: 11px !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 600 !important;
  margin-bottom: 20px !important;
}
.cta-section h2 {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: var(--ink) !important;
  margin: 0 0 24px !important;
}
.cta-section p {
  font-size: 17px !important;
  line-height: 1.6 !important;
  color: var(--ink-dim) !important;
  margin: 0 auto 40px !important;
  max-width: 720px !important;
}
.cta-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 18px 36px !important;
  background: var(--ink) !important;
  color: var(--bg) !important;
  font-size: 13px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all .3s !important;
  border: 2px solid var(--ink) !important;
}
.cta-btn:hover { background: transparent !important; color: var(--ink) !important; transform: translateY(-2px) !important; }

/* QUOODIX-ANTEASER (aus styles.v2.css repliziert) */
.quoodix-stage {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  background: #0A0A0A !important;
  color: #FFFFFF !important;
  text-decoration: none !important;
  padding: 120px 40px !important;
  margin: 0 !important;
  border-top: 1px solid rgba(0,245,255,0.15) !important;
  border-bottom: 1px solid rgba(0,245,255,0.15) !important;
}
.quoodix-bg {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  pointer-events: none !important;
}
.quoodix-grid {
  position: absolute !important;
  inset: 0 !important;
  background-image:
    linear-gradient(rgba(0,245,255,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,245,255,0.06) 1px, transparent 1px) !important;
  background-size: 60px 60px !important;
  opacity: 0.5 !important;
}
.quoodix-connector {
  position: absolute !important;
  background: linear-gradient(90deg, transparent 0%, rgba(0,245,255,0.4) 50%, transparent 100%) !important;
  height: 1px !important;
  width: 100% !important;
}
.quoodix-connector-1 { top: 30% !important; }
.quoodix-connector-2 { top: 70% !important; }
.quoodix-floater {
  position: absolute !important;
  border-radius: 50% !important;
  background: rgba(0,245,255,0.4) !important;
  box-shadow: 0 0 20px rgba(0,245,255,0.5) !important;
  animation: quoodix-float 6s ease-in-out infinite !important;
}
.quoodix-floater-1 { width: 6px; height: 6px; top: 25%; left: 12%; animation-delay: 0s !important; }
.quoodix-floater-2 { width: 4px; height: 4px; top: 65%; left: 88%; animation-delay: 1.5s !important; }
.quoodix-floater-3 { width: 8px; height: 8px; top: 80%; left: 22%; animation-delay: 3s !important; }
.quoodix-floater-4 { width: 5px; height: 5px; top: 15%; left: 75%; animation-delay: 4s !important; }
.quoodix-floater-5 { width: 6px; height: 6px; top: 50%; left: 50%; animation-delay: 2s !important; }
@keyframes quoodix-float {
  0%, 100% { transform: translateY(0); opacity: 0.4; }
  50% { transform: translateY(-15px); opacity: 1; }
}
.quoodix-content {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  text-align: center !important;
}
.quoodix-eyebrow {
  font-size: 11px !important;
  letter-spacing: .35em !important;
  text-transform: uppercase !important;
  color: #00F5FF !important;
  font-weight: 600 !important;
  margin-bottom: 16px !important;
}
.quoodix-wordmark {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(64px, 10vw, 140px) !important;
  line-height: .9 !important;
  letter-spacing: -.04em !important;
  margin: 0 0 24px !important;
  color: #FFFFFF !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #00F5FF 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.quoodix-tagline {
  font-family: "Inter Tight", sans-serif !important;
  font-size: clamp(20px, 2.5vw, 28px) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: #FFFFFF !important;
  margin-bottom: 24px !important;
}
.quoodix-tagline em { font-style: italic !important; color: #00F5FF !important; }
.quoodix-description {
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,0.7) !important;
  max-width: 720px !important;
  margin: 0 auto 32px !important;
}
.quoodix-meta-row {
  display: flex !important;
  justify-content: center !important;
  gap: 40px !important;
  font-size: 12px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.5) !important;
}
.quoodix-meta-arrow { color: #00F5FF !important; font-weight: 600 !important; }
.quoodix-stage:hover .quoodix-meta-arrow { letter-spacing: .25em !important; transition: letter-spacing .3s !important; }

@media (max-width: 720px) {
  .quoodix-stage { padding: 80px 20px !important; }
  .quoodix-meta-row { flex-direction: column !important; gap: 12px !important; }
}

/* KI-CHECK-TEASER */
.check-teaser {
  padding: 100px 40px !important;
  background: var(--bg) !important;
  text-align: center !important;
}
.check-teaser-inner {
  max-width: 900px !important;
  margin: 0 auto !important;
}
.check-teaser-meta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 11px !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 600 !important;
  margin-bottom: 32px !important;
}
.check-teaser-pulse {
  width: 8px !important; height: 8px !important;
  border-radius: 50% !important;
  background: #00F5FF !important;
  box-shadow: 0 0 12px rgba(0,245,255,0.6) !important;
  animation: si-pulse 2.5s ease-in-out infinite !important;
}
@keyframes si-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 12px rgba(0,245,255,0.6); }
  50% { opacity: 0.5; box-shadow: 0 0 20px rgba(0,245,255,0.9); }
}
.check-teaser-title {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: var(--ink) !important;
  margin: 0 0 24px !important;
}
.check-teaser-highlight { color: #00F5FF !important; }
.check-teaser-text {
  font-size: 17px !important;
  line-height: 1.6 !important;
  color: var(--ink-dim) !important;
  margin: 0 auto 40px !important;
  max-width: 720px !important;
}
.check-teaser-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 14px !important;
}
.check-teaser .btn-check {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 20px 40px !important;
  background: #00F5FF !important;
  color: #0A0A0A !important;
  border: 2px solid #00F5FF !important;
  font-family: "Inter Tight", sans-serif !important;
  font-size: 14px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all .3s !important;
}
.check-teaser .btn-check:hover {
  background: var(--bg) !important;
  color: #00F5FF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px -10px rgba(0,245,255,.5) !important;
}
.check-teaser-note {
  font-size: 12px !important;
  color: var(--ink-mute) !important;
}
@media (max-width: 720px) {
  .check-teaser { padding: 80px 20px !important; }
  .check-teaser .btn-check { padding: 16px 28px !important; font-size: 13px !important; }
}

/* CTA-Section Fix: explizit transparenter Hintergrund */
.cta-section {
  background: transparent !important;
  margin: 0 auto !important;
}
.cta-section .label {
  display: block !important;
  text-align: center !important;
}

/* CTA-SECTION: explizit hell, mittig, keine schwarze Box */
section.cta-section {
  background: var(--bg) !important;
  color: var(--ink) !important;
  padding: 120px 40px !important;
  margin: 0 auto !important;
  text-align: center !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.cta-section > * {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.cta-section .label {
  display: block !important;
  font-size: 11px !important;
  letter-spacing: .25em !important;
  text-transform: uppercase !important;
  color: var(--ink-mute) !important;
  font-weight: 600 !important;
  margin-bottom: 20px !important;
}
.cta-section h2 {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: var(--ink) !important;
  margin: 0 0 24px !important;
  background: transparent !important;
}
.cta-section p {
  font-size: 17px !important;
  line-height: 1.6 !important;
  color: var(--ink-dim) !important;
  margin: 0 auto 40px !important;
  max-width: 720px !important;
  background: transparent !important;
}
.cta-section .cta-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 18px 36px !important;
  background: var(--ink) !important;
  color: var(--bg) !important;
  font-size: 13px !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all .3s !important;
  border: 2px solid var(--ink) !important;
}
.cta-section .cta-btn:hover {
  background: transparent !important;
  color: var(--ink) !important;
  transform: translateY(-2px) !important;
}

/* CTA-Section: alle Texte zentriert */
.cta-section, .cta-section * {
  text-align: center !important;
}

/* HARTER FIX: CTA-Section komplett zentriert, mit Container */
section.cta-section {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 120px 40px !important;
}
section.cta-section .label,
section.cta-section h2,
section.cta-section p {
  width: 100% !important;
  max-width: 900px !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}
section.cta-section h2 {
  font-family: "Inter Tight", sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4.5vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  margin: 0 auto 24px !important;
}
