.connections-content{max-width:1540px;padding:18px 22px 44px}.connections-top-link{height:36px;padding:0 12px;display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:11px;text-decoration:none;white-space:nowrap}.connections-top-link svg{width:15px}.connections-hero{min-height:174px;border:1px solid #294047;border-radius:14px;padding:28px 32px;background:radial-gradient(circle at 82% 20%,#2c4249,transparent 29%),#15252c;color:#f4f5f4;display:flex;align-items:center;justify-content:space-between;gap:20px;overflow:hidden}.connections-eyebrow,.connections-kicker{font-size:10px;letter-spacing:.13em;font-weight:700}.connections-eyebrow{color:#99b3b9}.connections-kicker{color:var(--accent)}.connections-hero h1{font-size:25px;letter-spacing:-.045em;margin:10px 0 8px}.connections-hero p{font-size:12px;color:#c1cdce;line-height:1.7;margin:0}.hero-network{display:flex;align-items:center;gap:8px;flex:none;color:#e0c89f}.hero-network>i{width:54px;height:54px;border:1px solid #6b8790;border-radius:13px;display:grid;place-items:center;padding:15px}.hero-network>i:nth-of-type(2){background:#d1b06d;color:#17272d;border:0}.hero-network svg{width:24px;height:24px}.hero-network>span{width:26px;border-top:1px dashed #8da8ae}.connections-disclaimer{display:flex;align-items:flex-start;gap:7px;margin:12px 2px 18px;color:var(--muted);font-size:10px;line-height:1.6}.connections-disclaimer svg{width:14px;height:14px;flex:none;margin-top:1px}.connections-heading,.panel-heading{margin-bottom:12px}.connections-heading{display:flex;align-items:end;justify-content:space-between;gap:12px}.connections-heading h2,.panel-heading h2,.boundary-panel h2{font-size:17px;letter-spacing:-.035em;margin:5px 0 3px}.connections-heading p,.panel-heading p{font-size:11px;color:var(--muted);margin:0;line-height:1.5}.overview-badge{padding:7px 9px;border-radius:7px;background:var(--surface-2);color:var(--muted);font-size:10px;white-space:nowrap}.connection-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.connection-card{min-width:0;display:flex;flex-direction:column;padding:18px;border:1px solid var(--line);border-radius:13px;background:var(--surface);min-height:276px}.connection-card-top{display:flex;align-items:start;justify-content:space-between;gap:8px;margin-bottom:19px}.connection-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center}.connection-icon svg{width:21px;height:21px}.connection-icon.phone{background:var(--accent-soft);color:var(--accent)}.connection-icon.platform{background:var(--success-soft);color:var(--success)}.connection-icon.obs{background:var(--warning-soft);color:var(--warning)}.connection-badge{font-size:10px;padding:6px 8px;border-radius:7px;background:var(--surface-2);color:var(--muted);white-space:nowrap}.connection-step{font-size:9px;letter-spacing:.05em;color:var(--accent);font-weight:650}.connection-card h3{font-size:16px;letter-spacing:-.035em;margin:7px 0 7px}.connection-card p{font-size:11px;color:var(--muted);line-height:1.6;margin:0}.connection-meta{display:flex;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-top:11px;margin-top:auto;font-size:10px}.connection-meta span{color:var(--muted)}.connection-meta strong{text-align:right;font-size:10px}.connection-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:13px;padding:10px 11px;border-radius:8px;background:var(--surface-2);color:var(--muted);font-size:10px}.connection-foot svg{width:13px;height:13px;flex:none}.connection-foot.link{color:var(--accent);text-decoration:none}.connection-foot.link:hover{text-decoration:underline}.connections-lower{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.72fr);gap:12px;margin-top:13px}.flow-panel,.boundary-panel{min-width:0;border:1px solid var(--line);border-radius:13px;background:var(--surface);padding:19px}.flow-list{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:0}.flow-list li{display:flex;gap:12px;position:relative;padding:0 0 21px}.flow-list li:not(:last-child):before{content:"";position:absolute;left:16px;top:32px;bottom:0;border-left:1px solid var(--line)}.flow-list li:last-child{padding-bottom:0}.flow-number{width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none;font-size:11px;font-weight:700}.flow-list strong{font-size:11px}.flow-list p{font-size:10px;color:var(--muted);line-height:1.6;margin:4px 0 0}.flow-link{display:flex;align-items:center;gap:5px;color:var(--accent);font-size:10px;text-decoration:none;margin-top:19px}.flow-link svg{width:13px;height:13px}.boundary-item{display:flex;align-items:start;gap:10px;border-top:1px solid var(--line);padding:13px 0}.boundary-item:first-of-type{margin-top:13px}.boundary-item>svg{width:17px;height:17px;color:var(--accent);flex:none}.boundary-item strong{font-size:11px}.boundary-item p{font-size:10px;color:var(--muted);line-height:1.55;margin:3px 0 0}.boundary-note{font-size:9px;color:var(--muted);line-height:1.6;background:var(--surface-2);border-radius:8px;padding:10px;margin:2px 0 0}
@media(max-width:1180px){.connections-content{padding:15px}.hero-network>i{width:45px;height:45px;padding:11px}.hero-network>span{width:15px}.connection-card{padding:15px}.connections-lower{grid-template-columns:1fr}}
@media(max-width:980px){.connection-cards{grid-template-columns:1fr 1fr}.connection-card:last-child{grid-column:1/-1;min-height:220px}.connection-card{min-height:260px}.hero-network{display:none}}
@media(max-width:680px){.connections-content{padding:10px 10px 86px}.connections-top-link{width:36px;padding:0;justify-content:center}.connections-top-link span{display:none}.connections-hero{min-height:160px;padding:21px}.connections-hero h1{font-size:21px}.connections-hero p{font-size:11px}.connection-cards{grid-template-columns:1fr;gap:8px}.connection-card,.connection-card:last-child{grid-column:auto;min-height:0}.connection-card-top{margin-bottom:13px}.connection-meta{margin-top:18px}.flow-panel,.boundary-panel{padding:16px}}
@media(max-width:420px){.connections-heading{align-items:start;flex-direction:column}.connections-hero h1{font-size:19px}}
@media(max-height:620px){.section-nav{overflow-y:auto}.section-nav .connection-status{position:static;margin-top:18px}}
.overview-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.reset-demo{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:7px;padding:7px 9px;font-size:10px;cursor:pointer}.reset-demo:hover{color:var(--text);border-color:var(--accent)}