.ra-connect{--connect-surface:var(--color-background-surface);--connect-surface-2:var(--color-background-muted);--connect-line:var(--color-border);--connect-ink:var(--color-text-primary);--connect-ink-soft:var(--color-text-secondary);--connect-accent:var(--color-text-accent);--connect-accent-tint:color-mix(in srgb, var(--color-text-accent) 12%, transparent);--connect-shadow:var(--shadow-low);--connect-ease:var(--ease-standard)}.ra-connect .ra-stage{background:var(--connect-surface);border:1px solid var(--connect-line);box-shadow:var(--connect-shadow);border-radius:20px;padding:clamp(28px,5vw,56px) clamp(18px,4vw,40px);position:relative;overflow:hidden}.ra-flow{margin:0}.ra-flow-track{grid-template-columns:repeat(3,minmax(0,1fr) 52px) minmax(0,1fr);align-items:center;display:grid}.ra-flow-node{border:1px solid var(--connect-line);background:var(--connect-surface-2);min-width:0;min-height:112px;color:var(--connect-ink);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);text-align:center;border-radius:14px;justify-content:center;align-items:center;gap:10px;padding:18px 12px;line-height:1.25;display:flex}.ra-flow-icon{width:34px;height:34px;color:var(--connect-accent);background:var(--connect-accent-tint);border-radius:50%;flex:0 0 34px;place-items:center;display:grid}.ra-flow-icon svg{width:18px;height:18px;display:block}.ra-flow-connector{background:var(--connect-accent);opacity:.72;transform-origin:0;height:2px;transition:transform .7s var(--connect-ease);transition-delay:calc(var(--i,0) * .14s);position:relative;transform:scaleX(1)}.ra-flow-connector:after{content:"";border-top:2px solid var(--connect-accent);border-right:2px solid var(--connect-accent);width:8px;height:8px;position:absolute;top:50%;right:-1px;transform:translateY(-50%)rotate(45deg)}.js .ra-connect:not(.in) .ra-flow-connector{transform:scaleX(0)}.ra-flow .cap{text-align:center;color:var(--connect-ink-soft);font-size:var(--font-size-base);margin-top:24px}@media (max-width:640px){.ra-connect .ra-stage{padding:28px 18px}.ra-flow-track{grid-template-columns:1fr}.ra-flow-node{justify-self:center;width:min(100%,230px);min-height:76px;padding:14px}.ra-flow-connector{transform-origin:top;justify-self:center;width:2px;height:30px;transform:scaleY(1)}.ra-flow-connector:after{inset:auto auto -1px 50%;transform:translate(-50%)rotate(135deg)}.js .ra-connect:not(.in) .ra-flow-connector{transform:scaleY(0)}}@media (prefers-reduced-motion:reduce){.ra-flow-connector{transition:none!important;transform:none!important}}
