.service-art{isolation:isolate;width:100%;height:clamp(130px,11vw,175px);color:var(--service-accent);place-items:center;margin-block:.9rem 1.3rem;display:grid;position:relative}.service-art:before{content:"";z-index:-1;background:radial-gradient(ellipse, color-mix(in srgb, var(--service-accent) 9%, transparent), transparent 68%);opacity:.6;pointer-events:none;transition:opacity .4s;position:absolute;inset:2% -8%}.service-art .service-diagram{stroke:currentColor;stroke-width:1.45px;stroke-linecap:round;stroke-linejoin:round;width:100%;max-width:360px;height:100%;filter:drop-shadow(0 0 2px color-mix(in srgb, var(--service-accent) 18%, transparent));display:block;overflow:visible}.service-surface{fill:#091523}.service-inset{fill:#071321}.service-outline,.service-detail,.service-chip-pins{opacity:.85}.service-lights,.service-junctions{fill:currentColor;stroke:none}.service-code{opacity:.85}.service-wire{opacity:.4;stroke-width:1.2px}.service-packet{stroke:#edfaff;stroke-width:2.2px;stroke-dasharray:9 100;stroke-dashoffset:109px;opacity:0;filter:drop-shadow(0 0 4px var(--service-accent))}.service-web-button{fill:color-mix(in srgb, var(--service-accent) 7%, #071321)}.service-cursor{fill:#071321;stroke-width:1.8px}.service-click-ring{opacity:0;stroke-width:1.2px;transform-box:fill-box;transform-origin:50%}.service-scan{opacity:0;stroke-width:2px;filter:drop-shadow(0 0 5px var(--service-accent))}.service-slider{fill:#091523;stroke-width:2px}.service-brackets{stroke-width:2px}.service-chip-halo{fill:color-mix(in srgb, var(--service-accent) 8%, transparent);opacity:.3;stroke:none}.service-ai-label{fill:currentColor;stroke:none;font:23px Arial,sans-serif}.service-gear{transform-origin:196.5px 87.5px}.service-check{stroke-width:2.1px}.service-server-light{fill:color-mix(in srgb, var(--service-accent) 8%, #091523)}.service-shield{filter:drop-shadow(0 0 3px color-mix(in srgb, var(--service-accent) 25%, transparent))}.service-card:is(:hover,:focus-within){border-color:color-mix(in srgb, var(--service-accent) 35%, transparent);box-shadow:0 12px 35px #0002, inset 0 1px color-mix(in srgb, var(--service-accent) 12%, transparent)}.service-card:is(:hover,:focus-within) .service-art:before{opacity:1}@media (prefers-reduced-motion:no-preference){.service-card.is-visible .service-art{animation:.9s cubic-bezier(.2,.7,.2,1) both service-art-arrive}.service-card.is-visible .service-packet{animation:1.4s ease-out both service-signal-entry}.service-card:is(:hover,:focus-within) .service-art{animation:none}.service-card:is(:hover,:focus-within) .service-packet{animation:1.5s linear 2 both service-signal-active}.service-card:is(:hover,:focus-within) .service-code path{stroke-dasharray:95;animation:1s ease-out both service-code-write}.service-card:is(:hover,:focus-within) .service-code path:nth-child(2){animation-delay:.12s}.service-card:is(:hover,:focus-within) .service-code path:nth-child(3){animation-delay:.24s}.service-card:is(:hover,:focus-within) .service-cursor{animation:2.3s cubic-bezier(.25,.7,.3,1) both service-cursor-click}.service-card:is(:hover,:focus-within) .service-click-ring{animation:1s ease-out .65s both service-click-ring}.service-card:is(:hover,:focus-within) .service-web-button{animation:1.5s ease-out .6s both service-button-flash}.service-card:is(:hover,:focus-within) .service-scan{animation:1.7s ease-out both service-screen-scan}.service-card:is(:hover,:focus-within) .service-slider--a{animation:1.9s ease-in-out both service-slider-a}.service-card:is(:hover,:focus-within) .service-slider--b{animation:1.9s ease-in-out .12s both service-slider-b}.service-card:is(:hover,:focus-within) .service-processor{animation:1.5s ease-out .2s 2 both service-processor-glow}.service-card:is(:hover,:focus-within) .service-gear{animation:2s cubic-bezier(.3,.1,.2,1) .35s both service-gear-turn}.service-card:is(:hover,:focus-within) .service-check{stroke-dasharray:1;animation:1s ease-out .7s both service-check-draw}.service-card:is(:hover,:focus-within) .service-chip-halo{animation:1.5s ease-out 2 both service-chip-charge}.service-card:is(:hover,:focus-within) .service-server-light{animation:1.5s ease-out 2 both service-led}.service-card:is(:hover,:focus-within) .light-b{animation-delay:.3s}.service-card:is(:hover,:focus-within) .service-cloud{animation:2.2s ease-in-out both service-cloud-breathe}.service-card>a:hover svg{transform:translate(3px)}}@keyframes service-art-arrive{0%{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes service-signal-entry{0%{opacity:0;stroke-dashoffset:109px}15%,65%{opacity:.8}to{stroke-dashoffset:-9px;opacity:0}}@keyframes service-signal-active{0%{opacity:0;stroke-dashoffset:109px}10%,60%{opacity:1}78%,to{stroke-dashoffset:-9px;opacity:0}}@keyframes service-code-write{0%{stroke-dashoffset:95px;opacity:.2}to{stroke-dashoffset:0;opacity:1}}@keyframes service-cursor-click{0%,to{transform:translate(0)}35%,65%{transform:translate(-42px,-9px)}45%{transform:translate(-41px,-7px)}}@keyframes service-click-ring{0%{opacity:.8;transform:scale(.4)}to{opacity:0;transform:scale(2.2)}}@keyframes service-button-flash{35%{fill:color-mix(in srgb, var(--service-accent) 40%, #071321)}}@keyframes service-screen-scan{0%{opacity:0;transform:translateY(0)}20%{opacity:.55}to{opacity:0;transform:translateY(80px)}}@keyframes service-slider-a{40%,65%{transform:translate(23px)}}@keyframes service-slider-b{40%,65%{transform:translate(-20px)}}@keyframes service-processor-glow{35%{fill:color-mix(in srgb, var(--service-accent) 16%, #091523);stroke:#e3f7ff}}@keyframes service-gear-turn{to{transform:rotate(180deg)}}@keyframes service-check-draw{0%{stroke-dashoffset:1px;opacity:.2}to{stroke-dashoffset:0;opacity:1}}@keyframes service-chip-charge{50%{opacity:.9}}@keyframes service-led{25%,45%{fill:var(--service-accent);filter:drop-shadow(0 0 4px var(--service-accent))}}@keyframes service-cloud-breathe{45%{transform:translateY(-3px)}}@media (width<=540px){.service-art{height:165px}}@media (prefers-reduced-motion:reduce){.service-art *,.service-art{transition:none!important;animation:none!important}}