/* Four-column data-egress graph, using the original Figma node assets. */
.eh-project-visual.eh-visual-bold{padding:0;background:radial-gradient(ellipse at 15% 10%,#5898ad38,transparent 70%),linear-gradient(135deg,#15283b,#101925 50%,#201c36)}
.bo-cover{display:block;width:100%;height:100%;overflow:hidden;font-family:Satoshi,sans-serif}
.bo-corner-brand{position:absolute;left:24px;top:24px;width:34px;height:30px;z-index:1;filter:brightness(0) invert(1);opacity:.94}
.bo-headings{fill:#a9b6c9;font-size:15px;font-weight:500}
.bo-label{fill:#d9e0eb;font-size:17px;font-weight:400;transition:fill .2s}
.bo-hit{fill:transparent}
.bo-shell{fill:#fff;stroke:#0ea5e9;stroke-width:2;transition:fill .2s,filter .2s}
.bo-source .bo-shell{stroke:#6366f1}
.bo-halo{fill:none;stroke:#7dd3fc;stroke-width:2;opacity:0;transition:opacity .2s}
.bo-edge{fill:none;stroke:#64748b;stroke-width:1.2;transition:opacity .2s,stroke .2s}
.bo-flow{opacity:0;stroke:#c6f1ff;stroke-width:2;stroke-dasharray:5 13}
.bo-node{transition:opacity .2s}
.bo-cover[data-active] .bo-node:not(.is-active),.bo-cover[data-active] .bo-edge:not(.is-active){opacity:.28}
.bo-edge.is-active{stroke:#38bdf8}
.bo-edge.is-active .bo-flow{opacity:1;animation:bo-route 1.5s linear infinite}
.bo-node.is-active .bo-shell{fill:#f0f9ff;filter:drop-shadow(0 0 7px #38bdf866)}
.bo-node.is-active .bo-halo{opacity:.6}
.bo-node.is-active .bo-label{fill:#fff}
.eh-visual-bold .eh-open{z-index:1}
@keyframes bo-route{to{stroke-dashoffset:-36}}
@media(max-width:600px){.bo-corner-brand{left:20px;top:20px;width:26px;height:23px}.bo-headings{font-size:20px}.bo-label{font-size:24px}}
@media(prefers-reduced-motion:reduce){.bo-edge.is-active .bo-flow{animation:none}.bo-node,.bo-shell,.bo-label,.bo-halo,.bo-edge{transition:none}}
/* Route details float over the graph without changing the card height. */
.eh-project-visual.eh-visual-bold{display:block;height:auto;aspect-ratio:auto;cursor:default}
.bo-viewport{position:relative;height:clamp(320px,48svh,480px)}
.bo-node{cursor:pointer;outline:none}
.bo-node:focus-visible .bo-halo{opacity:1;stroke:#fff;stroke-width:3;stroke-dasharray:4 3}
.bo-explore-hint{position:absolute;left:24px;right:24px;bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;color:#a9b6c9}
.bo-explore-hint a{display:inline-flex;align-items:center;min-height:32px;color:#eef5ff;text-decoration:none}
.bo-explore-hint a:hover{text-decoration:underline;text-underline-offset:4px}
.bo-explore-hint a:focus-visible{outline:2px solid #a5b4fc;outline-offset:3px}
.bo-tooltip{position:absolute;z-index:3;width:330px;max-width:calc(100% - 24px);max-height:calc(100% - 64px);overflow:auto;overscroll-behavior:contain;padding:18px 20px;background:linear-gradient(135deg,rgba(73,101,125,.48),rgba(19,29,48,.58));color:#f5f8ff;border:.5px solid rgba(226,241,255,.38);border-radius:14px;box-shadow:0 18px 44px rgba(0,8,20,.3),0 4px 12px rgba(0,8,20,.15),inset 0 1px 0 rgba(255,255,255,.12);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);font-size:13px;line-height:1.5}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.bo-tooltip{background:#23364a}}
.bo-tooltip-eyebrow{display:block;font-size:11px;color:#c3d4e5;margin-bottom:8px}
.bo-tooltip .bo-tooltip-title{display:block;font-size:18px;line-height:1.3;font-weight:600;letter-spacing:-.02em}
.bo-tooltip .bo-tooltip-description{margin:8px 0 16px;color:#e1eaf5;font-size:13px;line-height:1.5}
.bo-tooltip .bo-route-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 16px;padding:0}
.bo-route-steps div{min-width:0}.bo-route-steps dt{font-size:10px;color:#c3d4e5;margin-bottom:4px}.bo-route-steps dd{margin:0;font-size:12px;color:#f5f8ff}
.bo-tooltip .bo-tooltip-note{margin:0;color:#c3d4e5;font-size:11px;line-height:1.5}
.bo-tooltip[hidden]{display:none}
@media(max-width:999px){.bo-viewport{height:auto;aspect-ratio:1.35}}
@media(max-width:600px){.bo-viewport{aspect-ratio:1.05}.bo-explore-hint{left:16px;right:16px;bottom:8px;font-size:10px}.bo-tooltip{padding:14px 16px}.bo-tooltip .bo-tooltip-title{font-size:16px}.bo-tooltip .bo-tooltip-description{margin:6px 0 12px}.bo-tooltip .bo-route-steps{margin-bottom:12px}}

/* Logos remain paired with text in every route tooltip. */
.bo-tooltip .bo-route-steps dd{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.bo-tooltip .bo-route-steps .bo-route-logo{width:22px;height:22px;object-fit:contain;border-radius:3px;box-shadow:none;flex:none;transform:none;max-width:none}
.bo-tooltip .bo-route-steps dd span{overflow-wrap:anywhere}

/* Destination emphasis follows each node rather than enclosing the column. */
.bo-destination .bo-halo{opacity:.6;stroke:#67d8ff;stroke-width:2;filter:drop-shadow(0 0 4px #38bdf840)}
.bo-destination .bo-shell{stroke:#38bdf8;stroke-width:2.5}
.bo-destination .bo-label{fill:#d8f4ff}
.bo-destination.is-active .bo-halo{opacity:1;stroke:#a5edff;stroke-width:3}

/* The whole cover is one case-study link; nodes retain hover previews. */
a.eh-project-visual.eh-visual-bold{cursor:pointer;text-decoration:none}
a.eh-visual-bold:focus-visible{outline:3px solid #5850ec;outline-offset:5px}
@media(hover:none){a.eh-visual-bold .bo-explore-hint{display:none}}

.bo-tooltip .bo-route-logo[src$="pii-identity.svg"]{filter:brightness(0) invert(1)}
