.connection-flow-caption{display:flex;justify-content:space-between;align-items:center;gap:20px}
.connection-flow-toggle{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid #626262;border-radius:4px;background:transparent;color:inherit;cursor:pointer}
.connection-flow-toggle svg{width:18px;height:18px}
body.calm-site main :is(.hub-network-path,.keycloud-network ol)>li:not(:last-child)::after{display:block;content:'';position:absolute;left:calc(100% - 10px);right:auto;top:68px;width:56px;height:2px;border:0;background:repeating-linear-gradient(90deg,#ffc846 0 9px,#626262 9px 18px);background-size:18px 2px;animation:connection-flow-x 2.8s linear infinite}
body.calm-site main .keycloud-network ol>li:not(:last-child)::after{top:50px;width:44px}
@keyframes connection-flow-x{to{background-position:36px 0}}
@keyframes connection-flow-y{to{background-position:0 36px}}
body.calm-site main .connection-flow-paused li::after,body.calm-site main .hub-motion-paused .hub-network-path li::after{animation-play-state:paused!important}
@media(max-width:900px){
 body.calm-site main :is(.keycloud-network ol,.hub-network-path){grid-template-columns:minmax(0,1fr);gap:36px}
 body.calm-site main .keycloud-network li{display:grid;grid-template-columns:100px minmax(0,1fr);min-height:110px;gap:20px;align-items:center;text-align:left;justify-content:initial}
 body.calm-site main .keycloud-network li>img{width:100px;height:100px;margin:0;object-fit:contain}
 body.calm-site main .keycloud-network li>img[src$="heimgard-door-app-icon.svg"]{width:72px;height:72px;margin:14px}
 body.calm-site main .keycloud-network li>svg.keycloud-mark{width:100px;height:100px}
 body.calm-site main .hub-network-path li{display:grid;grid-template-columns:100px minmax(0,1fr);text-align:left;column-gap:20px;align-items:center;min-height:110px}
 body.calm-site main .hub-network-visual{grid-row:1/3;height:110px}
 body.calm-site main .hub-network-path h3{align-self:end}
 body.calm-site main .hub-network-path p{align-self:start}
 body.calm-site main .hub-network-product img{width:100px;height:110px}
 body.calm-site main :is(.hub-network-path,.keycloud-network ol)>li:not(:last-child)::after{left:49px;top:calc(100% + 4px);width:2px;height:28px;background:repeating-linear-gradient(180deg,#ffc846 0 9px,#626262 9px 18px);background-size:2px 18px;animation:connection-flow-y 2.8s linear infinite}
}
@media(prefers-reduced-motion:reduce){body.calm-site main :is(.hub-network-path,.keycloud-network ol)>li::after{animation:none!important}.connection-flow-toggle{display:none}}
.connectivity-requirement{display:grid;grid-template-columns:minmax(160px,.34fr) minmax(0,1fr);gap:20px;margin:24px 0 0;padding:18px 20px;border-left:4px solid #ffc846;background:#f1f1f1;color:#282828;font-size:.92rem;line-height:1.55}.connectivity-requirement strong{font-weight:650}.keycloud-intro .connectivity-requirement{max-width:900px;background:rgba(0,0,0,.78);color:#fff;backdrop-filter:blur(8px)}html[data-theme="dark"] .connectivity-requirement{background:#111;color:#fff}@media(max-width:600px){.connectivity-requirement{grid-template-columns:1fr;gap:6px;padding:16px}}