/* Shared graph excerpts use actual template nodes and image assets. */
.workflow-map{display:block;width:100%;height:auto;flex:none;background:#faf9fc;background-image:radial-gradient(#e2deeb .65px,transparent .65px);background-size:18px 18px}
.home-tile .workflow-map{aspect-ratio:360/400;max-height:290px;object-fit:cover}
.home-tile:hover,.home-tile:focus-visible{border-color:#9c86ff;box-shadow:0 0 24px #8761ff25}
body:has(.workflow-marquee){overflow-x:clip}
.hero-showcase.workflow-marquee{display:block;position:relative;width:100vw;max-width:none;height:740px;margin:12px calc(50% - 50vw) 0;padding:16px 0 54px;overflow:hidden;perspective:none;mask-image:none}
.workflow-track,.workflow-group{position:relative;width:100%;height:100%;display:block}
.workflow-marquee .workflow-showcase{position:absolute;top:0;left:50%;width:440px;aspect-ratio:auto;border:0;border-radius:0;background:transparent;overflow:visible;box-shadow:none;animation:none;transform:translateX(calc(-50% + var(--offset,0px))) scale(var(--scale,1));transform-origin:50% 50%;transition:transform .8s cubic-bezier(.22,.61,.36,1),opacity .65s}
.workflow-marquee .workflow-map{border:1px solid #ebe7f1;border-radius:22px;box-shadow:0 14px 32px #28203409}
.workflow-marquee .is-central .workflow-map{border-color:#ddd5ee;box-shadow:0 16px 48px #49356a12}
.workflow-marquee .workflow-showcase:hover .workflow-map,.workflow-marquee .workflow-showcase:focus-visible .workflow-map{border-color:#b4a6ee;box-shadow:0 16px 48px #7562d41c,0 0 22px #69d7fc15}
.workflow-marquee .workflow-showcase>div{position:static;padding:19px 8px 0;background:none;color:#191722;text-align:center;opacity:0;transition:opacity .35s}
.workflow-marquee .is-central>div{opacity:1}
.workflow-marquee .workflow-showcase p{font-size:19px;line-height:1.4;margin:0 0 7px;font-weight:700}
.workflow-marquee .workflow-showcase span{padding:0;background:none;color:#75628e;font-size:12px}
/* The fish silhouette itself is the control: no tile, border or white backdrop. */
.graph-step{position:absolute;top:45%;z-index:20;width:56px;height:64px;display:grid;place-items:center;padding:8px;border:0;border-radius:0;background:transparent;box-shadow:none}
.graph-step svg{width:36px;height:44px;display:block;filter:drop-shadow(0 2px 8px #7057f127);transition:filter .2s}
.graph-step-prev{left:20px}.graph-step-next{right:20px}.graph-step-prev svg{transform:scaleX(-1)}
.graph-step:hover{background:transparent;box-shadow:none}
.graph-step:hover svg{filter:drop-shadow(0 0 10px #7b5df680)}
@media(max-width:650px){.hero-showcase.workflow-marquee{height:555px;padding-top:10px}.workflow-marquee .workflow-showcase{width:310px}.workflow-marquee .workflow-showcase p{font-size:17px}.graph-step{width:38px;height:52px;padding:4px;top:44%}.graph-step svg{width:27px;height:35px}.graph-step-prev{left:3px}.graph-step-next{right:3px}}
@media(prefers-reduced-motion:reduce){.workflow-marquee .workflow-showcase,.graph-step svg{transition:none}}