/* Slide Agentenablauf: ein Rahmen Agent, darin drei gleich gestaltete
   Kaesten mit Pfeilen dazwischen. Keine Farbfuellung, keine seitlichen
   Farbrahmen, keine Schatten, keine Verlaeufe. */

.kopplungbody { display: flex; flex-direction: column; gap: var(--space-4); height: 100%; }

.agent { flex: 1; min-height: 0; border: 2px solid var(--color-text-primary); border-radius: 0; padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); }
.agent > h3 { margin: 0; font-size: clamp(.95rem, 1.3vw, 1.4rem); color: var(--color-text-primary); }

.reihe { flex: 1; min-height: 0; display: grid; grid-template-columns: .9fr auto 2.3fr auto 1.7fr; align-items: stretch; gap: var(--space-3); }

.pfeil { display: flex; align-items: center; color: var(--color-text-muted); font-size: clamp(1.1rem, 1.7vw, 1.8rem); line-height: 1; }

.kasten { border: 1px solid var(--color-text-primary); border-radius: 0; padding: var(--space-3) var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; background: var(--color-surface); }
.kasten > h4 { margin: 0; font-size: clamp(.85rem, 1.15vw, 1.25rem); color: var(--color-text-primary); }
.kasten.modell { justify-content: center; align-items: center; text-align: center; }

.teile { flex: 1; min-height: 0; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); grid-auto-rows: 1fr; gap: var(--space-2); }
.teile li { display: flex; align-items: center; justify-content: center; text-align: center; border: 1px solid var(--color-border); border-radius: 0; background: var(--color-surface); padding: .35em .6em; font-size: clamp(.68rem, .82vw, .92rem); line-height: 1.2; color: var(--color-text-primary); overflow-wrap: anywhere; }
.teile a { color: var(--color-primary); }
.teile a:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

@media (max-width: 800px) {
    .reihe { grid-template-columns: 1fr; }
    .pfeil { justify-content: center; transform: rotate(90deg); }
}

.kopplungbody .kasten p, .kopplungbody .ablaufbeispiel { margin: 0; font-size: .9rem; line-height: 1.4; overflow-wrap: anywhere; }
