/* System categories surround the supplied TelePlan brand, with quiet data pulses. */
.integration-section--network {
  grid-template-columns: minmax(280px,.85fr) minmax(0,1.35fr);
  gap: clamp(30px,4vw,70px);
  align-items: center;
}
.integration-section--network .integration-copy { min-width:0; }
.integration-section--network .integration-copy h2 { font-size:clamp(32px,3.2vw,46px); line-height:1.15; }
.integration-section--network .integration-copy h2 span { color:#177ea7; }
.integration-specialists { display:grid; gap:12px; margin:27px 0 22px; }
.integration-specialist { display:flex; align-items:center; gap:20px; background:#fff; border:1px solid #dce7ef; border-radius:16px; padding:18px 20px; }
.integration-specialist--hubspot { border-color:#f5d6c8; }
.integration-specialist img { display:block; flex:0 0 112px; width:112px; height:44px; object-fit:contain; }
.integration-specialist--salesforce img { height:56px; }
.integration-specialist strong { display:block; font-size:13px; line-height:1.4; }
.integration-specialist span { display:block; margin-top:5px; color:#5a7286; font-size:12px; line-height:1.5; }
.integration-section--network .integration-visual--network { min-width:0; max-width:none; width:100%; grid-column:2; grid-row:1; }
.integration-map-caption { text-align:center; color:#56758c; font-size:13px; margin:0 0 22px; }
.integration-network {
  isolation:isolate;
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 124px minmax(0,1fr);
  grid-template-rows:repeat(3,80px) 72px;
  gap:20px 24px;
}
.integration-routes { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:-1; }
.integration-route { fill:none; stroke:#b7d3e4; stroke-width:1.5; }
.integration-route.is-active { stroke:#73afcc; }
.integration-pulse { fill:none; stroke:#46b7e8; stroke-width:2.2; stroke-linecap:round; stroke-dasharray:9 91; stroke-dashoffset:100; opacity:0; filter:drop-shadow(0 0 3px #4ec9ff80); }
.integration-core { grid-column:2; grid-row:1/4; align-self:center; justify-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; width:124px; height:114px; background:#fff; border:1px solid #cce2ef; border-radius:24px; box-shadow:0 12px 40px #1176a31a,0 0 0 8px #ebf6fc; }
.integration-core-logo { width:108px; height:auto; display:block; }
.integration-core-mark { display:none; }
.integration-core>span { font-size:11px; color:#52778e; margin-top:13px; }
.integration-node { display:flex; align-items:center; justify-content:flex-start; gap:12px; min-width:0; width:100%; background:#fff; color:#153d58; border:1px solid #d5e4ee; border-radius:15px; padding:15px; cursor:pointer; text-align:left; transition:border-color .2s,box-shadow .2s,background .2s; }
.integration-node svg { flex:0 0 44px; width:44px; height:44px; padding:8px; border-radius:12px; background:var(--icon-bg,#e2f5fc); stroke:var(--icon-ink,#0684b4); stroke-width:1.8; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.integration-node span { font-size:14px; line-height:1.4; overflow-wrap:break-word; }
.integration-node:hover { border-color:#90bfd7; background:#f9fcff; }
.integration-node[aria-pressed="true"] { border-color:#178ac3; background:#f0faff; box-shadow:0 0 0 2px #0f8fc515; }
.integration-node[data-integration-area="crm"] { grid-area:1/1; --icon-ink:#d75a32; --icon-bg:#fff0e8; }
.integration-node[data-integration-area="erp"] { grid-area:2/1; --icon-ink:#7554bc; --icon-bg:#f0eafa; }
.integration-node[data-integration-area="patients"] { grid-area:3/1; --icon-ink:#168573; --icon-bg:#e5f6f0; }
.integration-node[data-integration-area="service"] { grid-area:1/3; --icon-ink:#4d65c2; --icon-bg:#ebefff; }
.integration-node[data-integration-area="phone"] { grid-area:2/3; --icon-ink:#0684b4; --icon-bg:#e2f5fc; }
.integration-node[data-integration-area="commerce"] { grid-area:3/3; --icon-ink:#a96b11; --icon-bg:#fff4d9; }
.integration-node[data-integration-area="custom"] { grid-area:4/1/5/4; justify-self:center; width:max-content; max-width:100%; padding:12px 22px; --icon-ink:#ad4d8d; --icon-bg:#faeaf4; }
.integration-example-wrap { margin-top:24px; background:#ffffffa8; border:1px solid #dbe8f0; border-radius:16px; padding:20px 23px; }
.integration-example-label { color:#5a7589; letter-spacing:1.3px; font-size:10px; font-weight:600; margin-bottom:8px; }
#integration-example { min-height:50px; font-size:14px; line-height:1.65; margin-bottom:8px; color:#305670; }
#integration-example strong { color:#096d9a; }
.integration-availability { margin:0; font-size:11px; color:#5f788b; }
@media(prefers-reduced-motion:no-preference) {
  .integration-motion-active .integration-pulse { animation:integration-data-pulse 7s linear infinite; animation-delay:var(--pulse-delay,0s); }
}
@keyframes integration-data-pulse {
  0%,5% { stroke-dashoffset:100; opacity:0; }
  15% { opacity:.65; }
  64% { opacity:.65; }
  76%,100% { stroke-dashoffset:-9; opacity:0; }
}
@media(max-width:1100px) {
  .integration-section--network { grid-template-columns:1fr; gap:32px; }
  .integration-section--network .integration-copy { grid-column:1; grid-row:1; max-width:760px; justify-self:center; width:100%; }
  .integration-section--network .integration-copy h2 br { display:none; }
  .integration-specialists { grid-template-columns:1fr 1fr; }
  .integration-specialist { gap:15px; padding:17px; }
  .integration-specialist img { flex-basis:95px; width:95px; }
  .integration-section--network .integration-visual--network { grid-column:1; grid-row:2; max-width:760px; justify-self:center; }
  .integration-network { grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr); }
  .integration-core { width:150px; height:126px; }
  .integration-core-logo { width:128px; }
}
@media(max-width:600px) {
  .integration-specialists { grid-template-columns:1fr; }
  .integration-specialist img { flex-basis:115px; width:115px; }
  .integration-network { grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr); gap:16px 12px; grid-template-rows:repeat(3,100px) 66px; }
  .integration-core { width:76px; height:90px; border-radius:19px; box-shadow:0 10px 24px #1176a313,0 0 0 5px #ebf6fc; }
  .integration-core-logo { display:none; }
  .integration-core-mark { display:block; width:50px; height:40px; }
  .integration-core>span { margin-top:8px; font-size:10px; }
  .integration-node { flex-direction:column; justify-content:center; gap:6px; text-align:center; padding:8px 5px; border-radius:12px; }
  .integration-node span { font-size:12px; }
  .integration-node svg { flex-basis:36px; width:36px; height:36px; padding:6px; border-radius:10px; }
  .integration-node[data-integration-area="custom"] { flex-direction:row; gap:12px; padding-inline:18px; }
  .integration-example-wrap { padding:18px; }
  #integration-example { min-height:92px; font-size:13px; }
}
@media(forced-colors:active) {
  .integration-route { stroke:CanvasText; }
  .integration-pulse { display:none; }
  .integration-node[aria-pressed="true"] { outline:2px solid Highlight; }
  .integration-node svg { background:transparent; stroke:ButtonText; }
}
