/* Integrations: closing window, same design as the MCP page closer. Scoped to .mcpx-close and .mcpx-ring. */
.mcpx-close{padding-top:96px}
.mcpx-close__window{--reveal:1;position:relative;isolation:isolate;overflow:hidden;display:grid;align-content:center;min-height:clamp(560px,80vh,780px);border-radius:var(--r-lg);background:#001b31;color:#fff;margin-bottom:96px;clip-path:inset(calc((1 - var(--reveal)) * 8%) calc((1 - var(--reveal)) * 11%) round var(--r-lg))}
@media(prefers-reduced-motion:no-preference){.js .mcpx-close__window{--reveal:0}}
.mcpx-close__photo{position:absolute;inset:0;z-index:-2;overflow:hidden;background-color:#0a1420;filter:brightness(.62) saturate(.48) contrast(.92)}
.mcpx-close__still{position:absolute;top:-3%;left:-3%;width:106%;height:106%;max-width:none;object-fit:cover;object-position:center;pointer-events:none;user-select:none}
.mcpx-close__vid{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;pointer-events:none;display:block;border:0}
.mcpx-close__photo:has(.mcpx-close__vid) .mcpx-close__still{top:0;left:0;width:100%;height:100%;animation:none}
@media(prefers-reduced-motion:reduce){.mcpx-close__vid{display:none}}

@media(prefers-reduced-motion:no-preference){.mcpx-close__still{animation:mcpx-drift 26s ease-in-out infinite alternate}}
@keyframes mcpx-drift{from{transform:scale(1.02) translate3d(-1%,0,0)}to{transform:scale(1.1) translate3d(1.5%,-1%,0)}}
.mcpx-close__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,14,24,.52) 0%,rgba(8,14,24,.18) 46%),linear-gradient(180deg,rgba(8,14,24,.55),rgba(8,14,24,.46))}
.mcpx-close__dots{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.mcpx-close__scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,27,49,.64) 0%,rgba(0,27,49,.42) 28%,rgba(0,27,49,.40) 52%,rgba(0,27,49,.86) 100%)}
.mcpx-close__body{position:relative;display:grid;gap:1.4rem;justify-items:start;padding:clamp(2.25rem,6vw,5rem) clamp(1.25rem,5vw,4.5rem);max-width:50rem}
.mcpx-close__body>*{margin:0}
.mcpx-close__body .nx-eyebrow{color:#9fbed5}
.mcpx-close h2{font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:1.02;letter-spacing:-.042em;color:#fff;max-width:14ch}
.mcpx-close h2 em{color:#55d8fe}
.mcpx-close__p{max-width:32rem;font-size:18px;line-height:1.65;color:rgba(255,255,255,.88)}
.mcpx-close .nx-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin:0}

/* Primary site-blue pill on the dark closer, same tokens as Get a demo on MCP pages. */
.mcpx-close .btn{
  --bg:#1a73d9;--fill:#155fb8;--fg:#fff;--fill-fg:#fff;
  --chip:#fff;--chip-fg:#1a73d9;--chip-on:#fff;--chip-on-fg:#155fb8;
  background:#1a73d9;color:#fff;
}
.mcpx-close .btn:hover,.mcpx-close .btn:focus-visible{color:#fff}
.mcpx-close .nx-link{color:#fff}
.mcpx-ring{position:absolute;z-index:-1;right:-12%;top:50%;width:min(640px,110%);aspect-ratio:1;translate:0 -50%;pointer-events:none;overflow:visible}
.mcpx-ring path{fill:none;stroke-linecap:round}
.mcpx-ring__inner{stroke:rgba(255,255,255,.2);stroke-width:.7}
.mcpx-ring__arcs path{stroke-width:1;stroke-dasharray:1;stroke-dashoffset:0}.mcpx-ring__arcs path.is-here{stroke-width:2.4}
.mcpx-ring__arcs{transform-box:view-box;transform-origin:50% 50%}
.mcpx-ring .mcpx-ring__mark{transform-box:view-box;transform-origin:50% 50%}.mcpx-ring .mcpx-ring__mark path{fill:rgba(255,255,255,.16);stroke:none}
@media(prefers-reduced-motion:no-preference){
.mcpx-ring__inner{opacity:0;transition:opacity 1.2s var(--ease-out) .1s}
.mcpx-ring__arcs{transform:rotate(-48deg);transition:transform 1.6s var(--ease-expo) .1s}
.mcpx-ring__arcs path{stroke-dashoffset:1;transition:stroke-dashoffset .6s var(--ease-out);transition-delay:calc(var(--k) * 80ms + 200ms)}
.mcpx-ring .mcpx-ring__mark{opacity:0;transition:opacity 1.4s var(--ease-out) .6s}
.mcpx-ring.is-in .mcpx-ring__inner,.mcpx-ring.is-in .mcpx-ring__mark{opacity:1}
.mcpx-ring.is-in .mcpx-ring__arcs{transform:none}.mcpx-ring.is-in .mcpx-ring__arcs path{stroke-dashoffset:0}
.mcpx-ring.is-in{animation:mcpx-ring 54s linear 1.8s infinite}
.mcpx-ring.is-in .mcpx-ring__mark{animation:mcpx-ring 54s linear 1.8s infinite reverse}
.mcpx-ring.is-in.is-still,.mcpx-ring.is-in.is-still .mcpx-ring__mark{animation-play-state:paused}
}
@keyframes mcpx-ring{to{rotate:360deg}}
@media(max-width:760px){.mcpx-close{padding-top:64px}.mcpx-close__window{margin-bottom:64px;min-height:0}.mcpx-ring{right:-40%;top:18%;width:150%;opacity:.7}.mcpx-close__p{font-size:16.5px}}
.mcpx-close{padding-bottom:0}

/* Supported AI clients in the landing closer. Tiles stay still, with no hover motion. */
.mcpx-close__clients{width:100%;max-width:32rem;display:grid;gap:.7rem}
.mcpx-close__row{list-style:none;margin:0;padding:0;width:100%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.mcpx-close__client{display:grid;justify-items:center;align-content:center;gap:8px;min-height:76px;padding:10px 4px 8px;border:1px solid #ffffff1f;border-radius:14px;background:#ffffff08;color:#fff;cursor:default}
.mcpx-close__client:hover,.mcpx-close__client:focus,.mcpx-close__client:focus-visible,.mcpx-close__client:active{transform:none;background:#ffffff08;border-color:#ffffff1f;color:#fff;filter:none;box-shadow:none}
.mcpx-close__mark{width:24px;height:24px;display:block;color:#fff}
.mcpx-close__client span{font:500 11px/1.25 var(--head);letter-spacing:-.01em;color:#d8e6f2;text-align:center}
.mcpx-close__any{margin:0;font:500 12px/1.4 var(--mono);letter-spacing:.04em;color:#8eabc2}
@media(max-width:760px){.mcpx-close__clients{max-width:none}.mcpx-close__row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mcpx-close__client{min-height:72px}}

/* Primary pill hover/focus uses the darker fill, even if the ::before wipe is disabled. */
a.btn[href="/get-a-demo/"]:hover,a.btn[href="/get-a-demo/"]:focus-visible,
a.btn[href="/get-a-demo"]:hover,a.btn[href="/get-a-demo"]:focus-visible,
a.btn[href="https://www.unitq.com/get-a-demo/"]:hover,a.btn[href="https://www.unitq.com/get-a-demo/"]:focus-visible,
a.btn[href="https://www.unitq.com/get-a-demo"]:hover,a.btn[href="https://www.unitq.com/get-a-demo"]:focus-visible,
a.btn[href="/mcp/"]:hover,a.btn[href="/mcp/"]:focus-visible,
.on-dark .btn:hover,.on-dark .btn:focus-visible,
.window .btn:hover,.window .btn:focus-visible,
.mcpx-close .btn:hover,.mcpx-close .btn:focus-visible,
.hero.on-dark .btn:hover,.hero.on-dark .btn:focus-visible{background:#1a73d9;color:#fff;box-shadow:0 0 0 2px #fff}
.btn:hover,.btn:focus-visible{background:var(--fill);color:var(--fill-fg)}
