/* ============================================================
   v218 · Detailseiten als ein konsistentes System
   - Hero-Link entfernt
   - nahtloser Übergang Hero → erster Inhaltsbereich
   - gemeinsame Header-/Hero-/Navigationsgeometrie
   - gemeinsame CTA-Architektur
   ============================================================ */

/* Der zusätzliche Erkenntnissprung gehört nicht mehr in den Hero. */
.ledger-flow-nav--hero,
.pm-flow-nav--hero {
  display: none !important;
}

/* Einheitlicher Abschluss der Detailseiten-Heros. */
.i5-doc .subpage-keyvisual,
.ledger-doc .subpage-keyvisual,
.process-mining-doc .subpage-keyvisual,
.process-intelligence-doc .subpage-keyvisual {
  position: relative;
  overflow: visible;
  background:
    linear-gradient(180deg, rgba(11,14,18,0) 0%, rgba(10,10,12,.34) 74%, #0b0b0d 100%);
}

.i5-doc .subpage-keyvisual > .module-hero,
.ledger-doc .subpage-keyvisual > .module-hero,
.process-mining-doc .subpage-keyvisual > .module-hero,
.process-intelligence-doc .subpage-keyvisual > .module-hero {
  min-height: 760px !important;
  border-bottom: 0 !important;
  background-color: transparent !important;
}

/* Die Navigation bleibt der einzige Abschluss des Key Visuals. */
.detail-page-sequence,
.detail-page-sequence--intelligence {
  top: 660px !important;
}

/* Der erste Inhaltsbereich gehört visuell noch zur Hero-Erzählung. */
.i5-doc .subpage-keyvisual > :is(.i50-intro-section,.pm-intro-section,.pi-intro-section),
.ledger-doc .subpage-keyvisual > .ledger-event-section,
.process-mining-doc .subpage-keyvisual > .pm-intro-section,
.process-intelligence-doc .subpage-keyvisual > .pi-intro-section {
  position: relative;
  z-index: 3;
  margin-top: 0 !important;
  padding-top: 94px !important;
  border-top: 0 !important;
  background:
    radial-gradient(circle at 50% 0, rgba(198,177,116,.025), transparent 34%),
    #0b0b0d !important;
}

/* Kein harter horizontaler Schnitt zwischen Hero und erstem Inhalt. */
.i5-doc .subpage-keyvisual > .module-hero::after,
.ledger-doc .subpage-keyvisual > .module-hero::after,
.process-mining-doc .subpage-keyvisual > .module-hero::after,
.process-intelligence-doc .subpage-keyvisual > .module-hero::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 112px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(11,14,18,0), #0b0b0d 94%);
}

/* Header: gleiche Höhe, Achsen und aktiver Systemdesign-Kontext. */
.i5-doc ~ * { box-sizing: border-box; }
.site-header .nav {
  min-height: 86px;
}
.site-header .nav-system-button[aria-current="true"] {
  color: var(--accent, #c6b174);
}

/* ============================================================
   Gemeinsame CTA-Zone der deutschen Detailseiten
   ============================================================ */
.i5-doc .detail-page-cta,
.ledger-doc .detail-page-cta,
.process-mining-doc .detail-page-cta,
.process-intelligence-doc .detail-page-cta {
  position: relative;
  overflow: hidden;
  padding: 92px 0 98px !important;
  border-top: 1px solid rgba(198,177,116,.16) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(198,177,116,.065), transparent 42%),
    linear-gradient(180deg, #0e0e10, #0b0b0d) !important;
}

.detail-page-cta .detail-cta-container,
.detail-page-cta .ledger-cta-container {
  width: min(100% - 40px, 1120px);
  max-width: 1120px !important;
  margin-inline: auto;
}

.detail-page-cta .detail-cta-copy,
.detail-page-cta .ledger-cta-copy {
  max-width: 720px !important;
  margin: 0 !important;
}

.detail-page-cta .eyebrow {
  margin-bottom: 18px !important;
  color: rgba(218,210,189,.62) !important;
}

.detail-page-cta h2 {
  max-width: 700px !important;
  margin: 0 !important;
  color: #f5f3ee !important;
  font-size: clamp(2.15rem, 4.4vw, 3.45rem) !important;
  line-height: 1.01 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance;
}

.detail-page-cta .detail-cta-copy > p:not(.eyebrow),
.detail-page-cta .ledger-cta-copy > p:not(.eyebrow) {
  max-width: 650px !important;
  margin: 22px 0 0 !important;
  color: rgba(232,229,220,.72) !important;
  font-size: 1rem !important;
  line-height: 1.68 !important;
}

.detail-page-cta .detail-cta-actions,
.detail-page-cta .ledger-cta-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 20px 26px !important;
  margin-top: 32px !important;
}

.detail-page-next-link {
  display: inline-grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  max-width: 560px;
  padding: 8px 0 10px;
  border-bottom: 1px solid rgba(198,177,116,.30);
  color: inherit;
  text-decoration: none;
  transition: border-color 180ms ease, transform 180ms ease;
}

.detail-page-next-label {
  color: rgba(245,243,238,.31);
  font-size: .62rem;
  font-weight: 720;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.detail-page-next-text {
  color: rgba(245,243,238,.92);
  font-size: .92rem;
  font-weight: 680;
  line-height: 1.35;
}
.detail-page-next-arrow {
  color: rgba(198,177,116,.78);
  font-size: 1rem;
}

@media (hover:hover) and (pointer:fine) {
  .detail-page-next-link:hover {
    border-bottom-color: rgba(198,177,116,.76);
    transform: translateX(3px);
  }
}
.detail-page-next-link:focus-visible {
  outline: 1px solid rgba(198,177,116,.82);
  outline-offset: 5px;
}

/* Page-specific notes remain subordinate and share the same rhythm. */
.detail-page-cta :is(.pm-cta-note,.pi-cta-note) {
  max-width: 650px !important;
  margin-top: 22px !important;
  color: rgba(245,243,238,.42) !important;
  font-size: .74rem !important;
  letter-spacing: .01em;
}

@media (max-width: 860px) {
  .i5-doc .subpage-keyvisual > .module-hero,
  .ledger-doc .subpage-keyvisual > .module-hero,
  .process-mining-doc .subpage-keyvisual > .module-hero,
  .process-intelligence-doc .subpage-keyvisual > .module-hero {
    min-height: 830px !important;
  }

  .detail-page-sequence,
  .detail-page-sequence--intelligence {
    top: 738px !important;
  }

  .i5-doc .subpage-keyvisual > :is(.i50-intro-section,.pm-intro-section,.pi-intro-section),
  .ledger-doc .subpage-keyvisual > .ledger-event-section,
  .process-mining-doc .subpage-keyvisual > .pm-intro-section,
  .process-intelligence-doc .subpage-keyvisual > .pi-intro-section {
    padding-top: 66px !important;
  }

  .detail-page-cta {
    padding: 72px 0 78px !important;
  }
  .detail-page-cta .detail-cta-container,
  .detail-page-cta .ledger-cta-container {
    width: min(100% - 28px, 1120px);
  }
  .detail-page-cta .detail-cta-actions,
  .detail-page-cta .ledger-cta-actions {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  .detail-page-next-link {
    width: 100%;
    max-width: none;
  }
  .detail-page-cta .button {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .i5-doc .subpage-keyvisual > .module-hero,
  .ledger-doc .subpage-keyvisual > .module-hero,
  .process-mining-doc .subpage-keyvisual > .module-hero,
  .process-intelligence-doc .subpage-keyvisual > .module-hero {
    min-height: 820px !important;
  }

  .detail-page-sequence,
  .detail-page-sequence--intelligence {
    top: 724px !important;
  }

  .detail-page-cta h2 {
    font-size: clamp(2rem, 11vw, 2.8rem) !important;
  }
  .detail-page-next-link {
    gap: 8px;
  }
  .detail-page-next-label {
    font-size: .56rem;
  }
  .detail-page-next-text {
    font-size: .86rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .detail-page-next-link { transition: none; }
}

/* Einheitliche sekundäre Demo-Aktion auf allen fortlaufenden Detailseiten. */
.detail-page-cta .button.secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 11px 18px !important;
  border: 1px solid rgba(198,177,116,.42) !important;
  background: transparent !important;
  color: rgba(245,243,238,.90) !important;
  box-shadow: none !important;
}
@media (hover:hover) and (pointer:fine) {
  .detail-page-cta .button.secondary:hover {
    border-color: rgba(198,177,116,.78) !important;
    background: rgba(198,177,116,.08) !important;
    color: #f5f3ee !important;
  }
}