/* User-supplied Integration Card composition, adapted to the existing HTML scene. */
#solution .solution-team-frame{display:block;aspect-ratio:auto}
#solution .solution-team-content{padding:clamp(300px,31vw,430px) 40px 24px}
.integration-flow{position:relative;isolation:isolate}
.integration-flow .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.integration-map{position:relative;height:280px;contain:layout paint}
.integration-nodes{list-style:none;margin:0;padding:0}
.integration-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.integration-node,.integration-hub{position:absolute;transform:translate(-50%,-50%);z-index:1;display:block;background:transparent;border:0;box-shadow:0 8px 22px #0006}
.integration-node{width:52px;height:52px}
.integration-card-art{display:block;width:100%;height:100%;object-fit:contain}
.integration-input{left:25%}
.integration-output{left:75%}
.integration-meet{left:22%;top:12%}.integration-teams{left:28%;top:50%}.integration-zoom{left:21%;top:88%}
.integration-crm{left:74%;top:14%}.integration-claude{left:79%;top:39%}.integration-gpt{left:72%;top:65%}.integration-slack{left:77%;top:87%}
.integration-hub{left:50%;top:50%;width:80px;height:80px}
.integration-value{position:absolute;z-index:2;top:calc(50% + 55px);left:50%;width:min(260px,calc(100% - 24px));transform:translateX(-50%);margin:0;color:#c6c6c6;font:300 14px/1.4 Inter,Arial,sans-serif;letter-spacing:.005em;text-align:center;text-wrap:balance;pointer-events:none}
.integration-wire{fill:none;stroke:var(--flow-stroke);stroke-width:1;opacity:.55;vector-effect:non-scaling-stroke}
/* A still glint on each thread (see integration-flow.js). */
.integration-glint{fill:none;stroke:var(--glint-stroke);stroke-width:1.4;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.9;filter:drop-shadow(0 0 3px #d8eadd66)}
@media(max-width:900px) and (min-width:601px){
 #solution .solution-team-content{padding:34vw 24px 24px}
 .integration-node{width:50px;height:50px}
 .integration-hub{width:78px;height:78px}
}
@media(max-width:600px){
 #solution .solution-team-content{padding:0 14px 26px}
 .integration-map{height:400px}
 .integration-node{width:48px;height:48px}
 .integration-meet{left:18%;top:18%}.integration-teams{left:50%;top:9%}.integration-zoom{left:82%;top:20%}
 .integration-hub{left:50%;top:49%;width:82px;height:82px}
 .integration-crm{left:12%;top:88%}.integration-claude{left:37%;top:80%}.integration-gpt{left:64%;top:90%}.integration-slack{left:88%;top:79%}
 .integration-value{position:static;transform:none;width:auto;max-width:260px;margin:4px auto 0;font-size:13px}
}
/* Source icons link to their platform pages: same look, a pointer and a slight lift in light on hover */
.integration-link{display:block;width:100%;height:100%;border-radius:inherit;transition:filter .25s ease}
.integration-link img{display:block;width:100%;height:100%}
.integration-link:hover{filter:brightness(1.18)}
.integration-link:focus-visible{outline:2px solid #a4bc80;outline-offset:3px}
