.product-art .big-number{position:absolute;left:27px;top:48px;bottom:auto;font-size:135px;z-index:2;letter-spacing:-0.0425em}
.product-diagram{position:absolute;inset:0;width:100%;height:100%;z-index:1;stroke-width:1.4}
.product-art .art-caption{z-index:3;font-size:12px;letter-spacing:0.02em;max-width:calc(100% - 30px)}
.product-diagram .faint{opacity:.22}.product-diagram .art-surface{fill:#071f25}.product-b .art-surface{fill:#afd66f}.product-c .art-surface{fill:#dce7e3}
.launch-rings{transform-origin:425px 172px;animation:v-orbit-drift 16s ease-in-out infinite}
.launch-signal ellipse{animation:v-signal-flow 9s linear infinite}
.launch-window{animation:v-launch-float 6s ease-in-out infinite}
.ready-check{stroke-dasharray:75;animation:v-ready-mark 6s ease-in-out infinite}
.signal-dot{animation:v-dot-glow 4s ease-in-out infinite}.signal-dot.delay{animation-delay:1.8s}
.assembly{animation:v-assemble 6.5s ease-in-out infinite}.part-2{animation-delay:.6s}.part-3{animation-delay:1.2s}
.assembly-outline{opacity:.3;animation:v-grid-flow 12s linear infinite}.assembly-join{opacity:.5;animation:v-grid-flow 4s linear infinite}
.research-rings{transform-origin:423px 181px;animation:v-research-breathe 8s ease-in-out infinite}
.research-links{opacity:.25;stroke-dasharray:4 8;animation:v-grid-flow 9s linear infinite}
.question-node{animation:v-question-float 7s ease-in-out infinite}.q2{animation-delay:-2s}.q3{animation-delay:-4s}
.research-lens{animation:v-search 8s ease-in-out infinite}.research-focus{animation:v-dot-glow 4s ease-in-out infinite}
.tool-card{display:grid;grid-template-rows:14px 68px auto 29px;align-content:space-between;gap:8px;justify-content:stretch}
.tool-card .tool-visual{width:100%;height:68px;display:block;overflow:visible;opacity:.75;transition:opacity .3s}
.tool-card.chosen .tool-visual,.tool-card:hover .tool-visual,.tool-card:focus-visible .tool-visual{opacity:1}
.tool-card strong{align-self:center}.tool-card .tool-tag{justify-self:start;align-self:end;font-size:12px}.tool-card .tool-mark{top:18px;right:17px;font-size:19px}
.tool-visual .faint{opacity:.3}.tool-visual .typing-dot{animation:v-typing 3.5s ease-in-out infinite}.typing-dot.d2{animation-delay:.25s}.typing-dot.d3{animation-delay:.5s}
.chat-two{animation:v-chat 5s ease-in-out infinite}.journey-flow{animation:v-journey 5s linear infinite}
.sketch-frame{opacity:.35}.sketch-stroke,.code-stroke{stroke-dasharray:180;animation:v-draw-lines 6s ease-in-out infinite}.line-2{animation-delay:.7s}.sketch-cursor{animation:v-cursor 6s ease-in-out infinite}
.prototype-button{animation:v-button 5s ease-in-out infinite}.tap-ring{transform-origin:40px 57px;animation:v-tap 5s ease-in-out infinite}.prototype-response{stroke-dasharray:40;animation:v-response 5s ease-in-out infinite}
.system-tile{animation:v-system 7s ease-in-out infinite}.tile-2{animation-delay:.2s}.tile-3{animation-delay:.4s}.tile-4{animation-delay:.6s}.tile-5{animation-delay:.8s}
.review-scan{animation:v-scan 6s ease-in-out infinite}.review-highlight{animation:v-review 6s ease-in-out infinite}
.test-check{stroke-dasharray:26;animation:v-check 6s ease-in-out infinite}.check-2{animation-delay:.5s}.check-3{animation-delay:1s}
.improve-loop{animation:v-grid-flow 10s linear infinite}.improve-detail{stroke-dasharray:65;animation:v-draw-lines 6s ease-in-out infinite}
.motion-art:not(.art-active),.motion-art:not(.art-active) *{animation-play-state:paused!important}
.motion-off .motion-art,.motion-off .motion-art *{animation:none!important}
@keyframes v-orbit-drift{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(12deg)}}
@keyframes v-signal-flow{to{stroke-dashoffset:-462}}
@keyframes v-grid-flow{to{stroke-dashoffset:-90}}
@keyframes v-launch-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes v-ready-mark{0%,15%{stroke-dashoffset:75;opacity:.3}32%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.4}}
@keyframes v-dot-glow{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes v-assemble{0%,10%{transform:translateY(16px);opacity:.2}30%,82%{transform:translateY(0);opacity:1}100%{transform:translateY(16px);opacity:.2}}
@keyframes v-research-breathe{0%,100%{transform:scale(.96);opacity:.2}50%{transform:scale(1.04);opacity:.35}}
@keyframes v-question-float{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(-7px);opacity:1}}
@keyframes v-search{0%,100%{transform:translate(-5px,4px)}33%{transform:translate(10px,-8px)}66%{transform:translate(6px,9px)}}
@keyframes v-typing{0%,65%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@keyframes v-chat{0%,100%{opacity:.25;transform:translateY(3px)}50%{opacity:.6;transform:translateY(0)}}
@keyframes v-journey{to{stroke-dashoffset:-154}}
@keyframes v-draw-lines{0%,12%{stroke-dashoffset:180;opacity:.3}42%,86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.3}}
@keyframes v-cursor{0%,100%{transform:translate(-6px,-10px);opacity:.3}50%{transform:translate(4px,3px);opacity:.85}}
@keyframes v-button{0%,100%{fill:transparent}38%,52%{fill:currentColor;fill-opacity:.25}}
@keyframes v-tap{0%,25%,100%{transform:scale(.4);opacity:0}45%{transform:scale(1);opacity:.8}65%{transform:scale(1.8);opacity:0}}
@keyframes v-response{0%,40%{stroke-dashoffset:40;opacity:.2}65%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.2}}
@keyframes v-system{0%,12%,100%{transform:translateY(4px);opacity:.35}35%,80%{transform:translateY(0);opacity:1}}
@keyframes v-scan{0%,100%{transform:translateY(0);opacity:.3}55%{transform:translateY(52px);opacity:1}}
@keyframes v-review{0%,30%,100%{opacity:.1}55%,80%{opacity:.8}}
@keyframes v-check{0%,12%{stroke-dashoffset:26;opacity:.2}36%,84%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.2}}
@media(max-width:1100px){.product-art .big-number{left:20px;top:53px;font-size:112px}.product-art .art-caption{font-size:12px}.tool-card{grid-template-rows:14px 57px auto 29px}.tool-card .tool-visual{height:57px}}
@media(max-width:800px){.product-art .big-number{left:26px;top:54px;font-size:142px}.product-art .art-caption{font-size:12px}.tool-card{grid-template-rows:14px 64px auto 29px}.tool-card .tool-visual{height:64px}.tool-card .tool-tag{font-size:12px}}
@media(prefers-reduced-motion:reduce){.motion-art,.motion-art *{animation:none!important}}

.tool-card .tool-index{font-size:12px}

/* Give the numeral and animated artwork separate areas, even in narrow cards. */
.product-b,.product-c{container-type:inline-size}
.product-b .big-number,.product-c .big-number{left:5%;top:18%;font-size:82px;font-size:clamp(68px,30cqw,142px)}
.product-b .product-diagram,.product-c .product-diagram{inset:8% 4% 24% 49%;width:47%;height:68%}