.services-showcase{background:#f8faf3;color:#171a17;padding:96px var(--gutter)}.services-container{max-width:1200px;margin:auto}.services-intro{text-align:center;margin-bottom:40px}.services-label{font-size:16px;font-weight:500;letter-spacing:1.5px;margin:0 0 18px;color:#25282b}.services-intro h2{font-size:48px;font-weight:700;line-height:1.15;letter-spacing:-.035em;max-width:850px;margin:auto}.services-intro>p:last-child{font-size:20px;line-height:1.5;max-width:680px;margin:20px auto 0;color:#6b7280}.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.service-card{background:#fff;border:1px solid #f3f4f6;border-radius:24px;padding:32px 32px 0;display:grid;grid-template-rows:58px minmax(130px,auto) 210px;justify-items:center;text-align:center;overflow:hidden;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}.service-card h3{font-size:24px;font-weight:600;line-height:1.2;letter-spacing:-.6px;margin:0;align-self:center}.service-card>p{font-size:17px;line-height:1.5;color:#6b7280;margin:16px 0 24px;align-self:start}.service-discuss{font-size:12px;font-weight:500;border:1px solid #d1d5db;border-radius:9px;min-height:36px;padding:9px 12px;color:#25282b;align-self:start;background:#fff;transition:border-color .2s,background .2s}.service-discuss:hover{border-color:#8bd10a;background:#f3f4f6}.service-card:hover,.service-card:focus-within{transform:translateY(-4px);border-color:#8bd10a;box-shadow:0 12px 30px #25282b10}.services-showcase a:focus-visible{outline:2px solid #25282b;outline-offset:5px}.service-art{width:calc(100% + 64px);height:210px;background:linear-gradient(180deg,#fff 0%,#f3f4f6 48%,#d1d5db 100%);display:grid;place-items:center;align-self:end}.service-art svg{width:100%;max-width:310px;height:180px;fill:#fff;stroke:#8bd10a;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.service-art text{font-family:Inter,Arial,sans-serif;font-size:9px;fill:#8bd10a;stroke:none;text-anchor:middle}.service-art .connector{fill:none;stroke:#8bd10a;stroke-dasharray:3 5}.service-art .assemble rect,.service-art .accent,.service-art .bars rect{fill:#f3f4f6;stroke:#8bd10a}.service-art .pulse{fill:#8bd10a;stroke:none}.service-art .grid{fill:none;stroke:#d1d5db}.service-art .forecast,.service-art .green-line{fill:none;stroke:#8bd10a;stroke-width:2.5}.service-art .flow{fill:none;stroke:#8bd10a;stroke-width:4;stroke-dasharray:12 180}.services-cta{text-align:center;margin-top:40px}.services-showcase .animated-button{background:#171a17;color:#fff}.animated-button:hover{scale:1.045;background:#8bd10a;color:#10120f;border-color:#ffffff33;box-shadow:none}
.service-art .assemble{animation:modules-assemble 5s ease infinite}.service-art .pulse{animation:dashboard-update 5s ease infinite}.service-art .delay{animation-delay:.7s}.service-art .reveal{animation:interface-reveal 5s ease infinite}.service-art .complete{animation:task-finish 5s ease infinite}.service-art .flow{animation:workflow-flow 5s linear infinite}.service-art .nodes rect{animation:node-activate 5s ease infinite}.service-art .nodes rect:nth-child(2){animation-delay:.5s}.service-art .nodes rect:nth-child(3){animation-delay:1s}.service-art .bars{transform-origin:140px 140px;animation:bars-rise 5s ease infinite}.service-art .forecast{stroke-dasharray:100;animation:forecast-draw 5s ease infinite}.service-card .service-art *{animation-play-state:paused}.service-card.is-visible .service-art *{animation-play-state:running}
@keyframes modules-assemble{0%,10%{opacity:.25;transform:translateY(10px)}35%,85%,100%{opacity:1;transform:translateY(0)}}@keyframes dashboard-update{0%,15%,100%{opacity:.35;transform:translateY(0)}35%,70%{opacity:1;transform:translateY(-4px)}}@keyframes interface-reveal{0%,10%{opacity:.2;transform:translateY(7px)}35%,85%,100%{opacity:1;transform:translateY(0)}}@keyframes task-finish{0%,35%{opacity:.15;transform:translateY(5px)}60%,90%,100%{opacity:1;transform:translateY(0)}}@keyframes workflow-flow{0%,10%{stroke-dashoffset:0;opacity:0}20%{opacity:1}75%{stroke-dashoffset:-180;opacity:1}85%,100%{stroke-dashoffset:-180;opacity:0}}@keyframes node-activate{0%,15%,100%{fill:#fff}40%,70%{fill:#f3f4f6}}@keyframes bars-rise{0%,10%{transform:scaleY(.3)}40%,90%,100%{transform:scaleY(1)}}@keyframes forecast-draw{0%,30%{stroke-dashoffset:100}65%,90%,100%{stroke-dashoffset:0}}
@media(max-width:1100px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.services-showcase{padding-block:56px}.services-grid{grid-template-columns:1fr}.services-intro h2{font-size:32px}.services-intro>p:last-child{font-size:18px}.service-card h3{font-size:22px}.services-cta .animated-button{max-width:100%;height:auto;min-height:48px;padding-block:12px}}@media(prefers-reduced-motion:reduce){.service-card,.service-card:hover,.service-card:focus-within{transform:none;transition:none}.service-card .service-art *{animation:none!important;opacity:1;transform:none}.service-art .forecast{stroke-dashoffset:0}.service-art .flow{display:none}.animated-button:hover{scale:1}}
/* AI Agents: independent, filled network illustration. */
.service-art .ai-agent-network{max-width:360px;width:100%;height:210px;fill:none;stroke:none}
.ai-agent-network .ai-robot{animation:ai-bob 5.5s ease-in-out infinite}
.ai-agent-network .ai-signals{animation:ai-data-flow 5.5s linear infinite}
.ai-agent-network .ai-eyes{transform-box:fill-box;transform-origin:center;animation:ai-blink 5.5s ease infinite}
.ai-agent-network .ai-contact-top,.ai-agent-network .ai-contact-bottom{animation:ai-card-float 5.5s ease-in-out infinite}
.ai-agent-network .ai-contact-bottom{animation-delay:-2.75s}
@keyframes ai-bob{0%,15%,85%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes ai-data-flow{0%,15%{stroke-dashoffset:115;opacity:0}25%{opacity:1}75%{stroke-dashoffset:-115;opacity:1}85%,100%{stroke-dashoffset:-115;opacity:0}}
@keyframes ai-blink{0%,43%,49%,100%{transform:scaleY(1)}46%{transform:scaleY(.15)}}
@keyframes ai-card-float{0%,15%,85%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.ai-agent-network *{animation:none!important;transform:none!important}.ai-agent-network .ai-signals{opacity:0}}
/* Data arrives at the agent, then completed tasks return to the tools. */
.ai-agent-network .ai-dot{offset-rotate:0deg;filter:drop-shadow(0 0 3px #8bd10a90);animation:ai-dot-travel 6s ease-in-out infinite}
.ai-dot-one{offset-path:path('M73 61 L97 61 L97 86 Q97 101 112 101 L133 101')}
.ai-dot-two{offset-path:path('M227 99 L248 99 Q261 99 261 86 L261 59 L278 59');animation-delay:1.5s!important}
.ai-dot-three{offset-path:path('M76 173 L91 173 L91 150 Q91 138 103 138 L132 138');animation-delay:.6s!important}
.ai-dot-four{offset-path:path('M227 137 L257 137 Q269 137 269 149 L269 172 L288 172');animation-delay:2.2s!important}
.ai-agent-network .ai-task-tick{transform-box:fill-box;transform-origin:center;animation:ai-task-confirm 6s ease infinite}
.ai-agent-network .ai-tick-stroke{stroke-dasharray:1;animation:ai-check-draw 6s ease infinite}
.ai-tick-top,.ai-tick-top .ai-tick-stroke{animation-delay:1.5s!important}
.ai-tick-bottom,.ai-tick-bottom .ai-tick-stroke{animation-delay:.6s!important}
.ai-tick-data,.ai-tick-data .ai-tick-stroke{animation-delay:2.2s!important}
@keyframes ai-dot-travel{0%,10%{offset-distance:0%;opacity:0}18%{opacity:1}55%{offset-distance:100%;opacity:1}62%,100%{offset-distance:100%;opacity:0}}
@keyframes ai-task-confirm{0%,55%{opacity:0;transform:scale(.7)}65%,86%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
@keyframes ai-check-draw{0%,60%{stroke-dashoffset:1}72%,100%{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-dot{display:none}.ai-agent-network .ai-task-tick{opacity:1;transform:none}.ai-agent-network .ai-tick-stroke{stroke-dashoffset:0}}
/* A single agent reads the knowledge base, decides, and completes a task. */
.ai-agent-network .ai-mini-agent{offset-path:path('M298 155 L269 155 L269 149 Q269 137 257 137 L227 137 L218 117 L227 99 L248 99 Q261 99 261 86 L261 59 L278 59');offset-rotate:0deg;filter:drop-shadow(0 2px 3px #25282b40);animation:ai-agent-journey 10s ease-in-out infinite}
.ai-agent-network .ai-stage-review{animation:ai-stage-review 10s linear infinite}
.ai-agent-network .ai-stage-decide{animation:ai-stage-decide 10s linear infinite}
.ai-agent-network .ai-stage-act{animation:ai-stage-act 10s linear infinite}
.ai-agent-network .ai-journey-labels text{fill:#25282b;font-size:7px}
@keyframes ai-agent-journey{0%{offset-distance:0%;opacity:0}5%,20%{offset-distance:0%;opacity:1}42%,58%{offset-distance:48%;opacity:1}80%,92%{offset-distance:100%;opacity:1}97%,100%{offset-distance:100%;opacity:0}}
@keyframes ai-stage-review{0%,24%{opacity:1}30%,100%{opacity:0}}
@keyframes ai-stage-decide{0%,35%{opacity:0}42%,58%{opacity:1}65%,100%{opacity:0}}
@keyframes ai-stage-act{0%,73%{opacity:0}80%,92%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-mini-agent{offset-distance:48%;opacity:1}.ai-agent-network .ai-journey-labels text{opacity:1}}
/* Workflow Automation: CRM builder, branching actions, and message delivery. */
.service-art .workflow-builder-art{max-width:360px;width:100%;height:210px;fill:none;stroke:none}.workflow-builder-art text{font-family:Inter,Arial,sans-serif;font-size:6.5px;text-anchor:start;fill:#25282b;stroke:none}.workflow-builder-art .wf-title{font-size:8px;font-weight:600}.workflow-builder-art .wf-status{font-size:5px;fill:#25282b}.workflow-builder-art .wf-micro{font-size:4.5px}.workflow-builder-art .wf-phone text[fill]{fill:#f3f4f6}
.workflow-builder-art .wf-moving-signal{animation:wf-route 7s linear infinite}.workflow-builder-art .wf-email-done{animation:wf-email-success 7s ease infinite}.workflow-builder-art .wf-message-done,.workflow-builder-art .wf-chat-reply{animation:wf-message-success 7s ease infinite}.workflow-builder-art .wf-completed-chip{animation:wf-finish 7s ease infinite}.workflow-builder-art .wf-phone{animation:wf-phone-float 7s ease-in-out infinite}
@keyframes wf-route{0%,10%{stroke-dashoffset:96;opacity:0}15%{opacity:1}50%{stroke-dashoffset:-96;opacity:1}60%,100%{stroke-dashoffset:-96;opacity:0}}
@keyframes wf-email-success{0%,30%{opacity:.1}42%,90%{opacity:1}100%{opacity:.1}}
@keyframes wf-message-success{0%,45%{opacity:.1}60%,90%{opacity:1}100%{opacity:.1}}
@keyframes wf-finish{0%,60%{opacity:0;transform:translateY(4px)}72%,90%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes wf-phone-float{0%,15%,85%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.workflow-builder-art *{animation:none!important;transform:none!important;opacity:1}.workflow-builder-art .wf-moving-signal{display:none}}
/* Sequential abstract workflow, with no screens or channel-specific labels. */
.service-art .workflow-nodes-art{max-width:360px;width:100%;height:210px;fill:none;stroke:none}.workflow-nodes-art .wn-node{fill:url(#wn-face);stroke:#d1d5db;stroke-width:1.2}.workflow-nodes-art .wn-route{stroke-dasharray:1;animation:wn-route 8s linear infinite}.workflow-nodes-art .wn-dot{offset-rotate:0deg;animation:wn-travel 8s ease-in-out infinite}.workflow-nodes-art .wn-check{animation:wn-confirm 8s linear infinite}.workflow-nodes-art .wn-route-1,.workflow-nodes-art .wn-route-2,.workflow-nodes-art .wn-dot-1,.workflow-nodes-art .wn-dot-2{animation-delay:1.8s}.workflow-nodes-art .wn-route-3,.workflow-nodes-art .wn-route-4,.workflow-nodes-art .wn-dot-3,.workflow-nodes-art .wn-dot-4{animation-delay:3.6s}.workflow-nodes-art .wn-check-0{animation-delay:-1.2s}.workflow-nodes-art .wn-check-1{animation-delay:.6s}.workflow-nodes-art .wn-check-2{animation-delay:2.4s}.workflow-nodes-art .wn-final-check{stroke-dasharray:1;animation:wn-final 8s ease infinite}.workflow-nodes-art .wn-success{animation:wn-success 8s ease infinite}.workflow-nodes-art text{font-size:7px;text-anchor:middle;fill:#8bd10a}
@keyframes wn-route{0%,5%{stroke-dashoffset:1;opacity:0}8%{opacity:1}25%,70%{stroke-dashoffset:0;opacity:1}90%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes wn-travel{0%,5%{offset-distance:0%;opacity:0}8%{opacity:1}25%{offset-distance:100%;opacity:1}30%,100%{offset-distance:100%;opacity:0}}
@keyframes wn-confirm{0%,25%{opacity:0}30%,75%{opacity:1}90%,100%{opacity:0}}
@keyframes wn-final{0%,67%{stroke-dashoffset:1;opacity:0}75%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes wn-success{0%,75%{opacity:0}82%,92%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.workflow-nodes-art *{animation:none!important}.workflow-nodes-art .wn-dot{display:none}.workflow-nodes-art .wn-route,.workflow-nodes-art .wn-final-check{stroke-dashoffset:0}.workflow-nodes-art .wn-check,.workflow-nodes-art .wn-success{opacity:1}}
/* Data Analytics: incoming data, analysis, forecast, then an insight. */
.service-art .analytics-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.analytics-art text{font-family:Inter,Arial,sans-serif;text-anchor:start;font-size:8px;fill:#8bd10a;stroke:none}.analytics-art .da-title{font-size:8px;font-weight:600}.analytics-art .da-small{font-size:5px;letter-spacing:.4px}.analytics-art .da-pipeline{animation:da-data-flow 7s linear infinite}.analytics-art .da-bars{transform-origin:210px 162px;animation:da-bar-build 7s ease infinite}.analytics-art .da-chart-line{stroke-dasharray:1;animation:da-line-build 7s ease infinite}.analytics-art .da-chart-area{animation:da-analysis 7s ease infinite}.analytics-art .da-forecast{animation:da-forecast-build 7s ease infinite}.analytics-art .da-result{animation:da-insight-ready 7s ease infinite}
@keyframes da-data-flow{0%,5%{stroke-dashoffset:86;opacity:0}12%{opacity:1}35%{stroke-dashoffset:-86;opacity:1}45%,100%{stroke-dashoffset:-86;opacity:0}}
@keyframes da-bar-build{0%,15%{transform:scaleY(.15);opacity:.3}40%,90%,100%{transform:scaleY(1);opacity:1}}
@keyframes da-line-build{0%,30%{stroke-dashoffset:1}60%,90%,100%{stroke-dashoffset:0}}
@keyframes da-analysis{0%,35%{opacity:0}60%,90%,100%{opacity:1}}
@keyframes da-forecast-build{0%,55%{opacity:0}70%,90%,100%{opacity:1}}
@keyframes da-insight-ready{0%,68%{opacity:0;transform:translateY(3px)}78%,92%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.analytics-art *{animation:none!important;transform:none!important;opacity:1}.analytics-art .da-chart-line{stroke-dashoffset:0}.analytics-art .da-pipeline{display:none}}
.analytics-art .da-pie-segments{animation:da-pie-update 7s ease-in-out infinite;transform-origin:0 0}.analytics-art .da-pie-live-dot{animation:da-pie-pulse 7s ease infinite}
@keyframes da-pie-update{0%,15%,100%{transform:rotate(-12deg)}45%,75%{transform:rotate(18deg)}}
@keyframes da-pie-pulse{0%,20%,100%{opacity:.4}45%,75%{opacity:1}}
@media(prefers-reduced-motion:reduce){.analytics-art .da-pie-segments,.analytics-art .da-pie-live-dot{animation:none!important;transform:none!important;opacity:1}}
/* Management systems: three scenes crossfade inside a stable frame. */
.service-art .management-story-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.management-story-art text{font-family:Inter,Arial,sans-serif;fill:#8bd10a;stroke:none;text-anchor:start;font-size:7px}.management-story-art .ms-title{font-size:8px;font-weight:600}.management-story-art .ms-small{font-size:5.5px}.management-story-art .ms-step{font-size:7px;fill:#8bd10a}.management-story-art .ms-metric{font-size:15px;font-weight:600}.management-story-art .ms-scene{animation:ms-scene-cycle 9s linear infinite;opacity:0}.management-story-art .ms-scene-two{animation-delay:-6s}.management-story-art .ms-scene-three{animation-delay:-3s}.management-story-art .ms-assignment{animation:ms-assign-task 9s ease-in-out infinite}.management-story-art .ms-task-success{animation:ms-task-confirm 9s ease infinite}.management-story-art .ms-progress{transform-origin:63px 149px;animation:ms-progress-fill 9s ease infinite}.management-story-art .ms-summary-bars{transform-origin:230px 166px;animation:ms-summary-grow 9s ease infinite}.management-story-art .ms-indicator{animation:ms-indicator-cycle 9s linear infinite}.management-story-art .ms-indicator-two{animation-delay:-6s}.management-story-art .ms-indicator-three{animation-delay:-3s}
@keyframes ms-scene-cycle{0%{opacity:0}4%,28%{opacity:1}33%,100%{opacity:0}}
@keyframes ms-assign-task{0%,36%{transform:translateX(0)}46%,48%{transform:translateX(88px)}58%,100%{transform:translateX(176px)}}
@keyframes ms-task-confirm{0%,55%{opacity:0}59%,65%{opacity:1}69%,100%{opacity:0}}
@keyframes ms-progress-fill{0%,67%{transform:scaleX(.2)}82%,100%{transform:scaleX(1)}}
@keyframes ms-summary-grow{0%,67%{transform:scaleY(.3)}82%,100%{transform:scaleY(1)}}
@keyframes ms-indicator-cycle{0%,30%{fill:#8bd10a}34%,100%{fill:#d1d5db}}
@media(prefers-reduced-motion:reduce){.management-story-art *{animation:none!important;transform:none!important}.management-story-art .ms-scene-one,.management-story-art .ms-scene-two{opacity:0!important}.management-story-art .ms-scene-three{opacity:1!important}}
/* Custom Software: real Python, typed into a scrolling editor. */
.python-editor{width:88%;height:178px;border-radius:10px;overflow:hidden;background:#25282b;border:1px solid #25282b;box-shadow:0 5px 0 -2px #d1d5db,0 12px 22px -12px #25282b50;text-align:left;align-self:center}.python-editor-title{height:27px;background:#25282b;border-bottom:1px solid #25282b;padding:0 10px;display:flex;align-items:center;gap:10px;font-size:7px;color:#d1d5db}.python-window-dots{font-size:6px;letter-spacing:2px;color:#8bd10a}.python-language{margin-left:auto;color:#8bd10a}.python-code-viewport{height:130px;overflow:hidden;padding:8px 0;scroll-behavior:auto}.python-code-row{display:flex;min-height:12px;font:7px/12px Consolas,'Courier New',monospace;color:#f3f4f6;white-space:pre}.python-line-number{width:25px;flex-shrink:0;text-align:right;padding-right:8px;color:#6b7280;user-select:none}.python-line-text{padding-right:8px}.python-keyword{color:#d1d5db}.python-string{color:#8bd10a}.python-number{color:#8bd10a}.python-function{color:#8bd10a}.python-comment{color:#6b7280}.python-editor-status{height:21px;border-top:1px solid #25282b;background:#25282b;display:flex;justify-content:space-between;align-items:center;padding:0 9px;font-size:6px;color:#9ca3af}.python-line-text:last-child::after{content:'▏';color:#8bd10a}.service-art:has(.python-editor){display:grid;place-items:center}
/* Light Python editor theme. */
.python-editor{background:#fff;border-color:#d1d5db}.python-editor-title{background:#f6f9f0;border-color:#f3f4f6;color:#8bd10a}.python-language{color:#8bd10a}.python-code-row{color:#25282b}.python-line-number{color:#9ca3af}.python-keyword{color:#8bd10a}.python-string{color:#8bd10a}.python-number{color:#8bd10a}.python-function{color:#8bd10a}.python-comment{color:#6b7280}.python-editor-status{background:#f6f9f0;border-color:#f3f4f6;color:#6b7280}.python-line-text:last-child::after{color:#8bd10a}
/* First management scene: three records move into validated rows. */
.management-story-art .ms-import-record{animation:ms-record-import 9s ease infinite}.management-story-art .ms-organized-record{animation:ms-record-ready 9s ease infinite}.management-story-art .ms-import-record-1,.management-story-art .ms-organized-record-1{animation-delay:.4s}.management-story-art .ms-import-record-2,.management-story-art .ms-organized-record-2{animation-delay:.8s}
@keyframes ms-record-import{0%,3%{opacity:1;transform:translate(0,0)}14%{opacity:1;transform:translate(88px,-9px)}18%,100%{opacity:0;transform:translate(88px,-9px)}}
@keyframes ms-record-ready{0%,14%{opacity:0}19%,30%{opacity:1}34%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.management-story-art .ms-import-record,.management-story-art .ms-organized-record{animation:none!important}}
/* Make the AI hub visibly active while its card is on screen. */
.ai-agent-network .ai-robot{animation:ai-lively-bob 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.ai-agent-network .ai-contact-top,.ai-agent-network .ai-contact-bottom{animation:ai-lively-card 4s ease-in-out infinite}.ai-agent-network .ai-contact-bottom{animation-delay:-2s}
.ai-agent-network .ai-eyes{animation:ai-blink 3s ease infinite}
.ai-agent-network .ai-signals{animation:ai-continuous-signal 3.6s linear infinite}
.ai-agent-network .ai-dot{r:4;animation:ai-continuous-dot 3.6s linear infinite}
.ai-agent-network .ai-dot-two{animation-delay:-.9s!important}.ai-agent-network .ai-dot-three{animation-delay:-1.8s!important}.ai-agent-network .ai-dot-four{animation-delay:-2.7s!important}
.ai-agent-network .ai-task-tick,.ai-agent-network .ai-tick-stroke{animation-duration:4s}
.ai-agent-network .ai-halo{transform-box:fill-box;transform-origin:center;animation:ai-hub-breathe 3.6s ease-in-out infinite}
@keyframes ai-lively-bob{0%,100%{transform:translateY(3px) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes ai-lively-card{0%,100%{transform:translateY(2px)}50%{transform:translateY(-4px)}}
@keyframes ai-continuous-signal{from{stroke-dashoffset:117;opacity:.8}to{stroke-dashoffset:0;opacity:.8}}
@keyframes ai-continuous-dot{0%{offset-distance:0%;opacity:0}8%,90%{opacity:1}100%{offset-distance:100%;opacity:0}}
@keyframes ai-hub-breathe{0%,100%{transform:scale(.97);opacity:.6}50%{transform:scale(1.04);opacity:1}}
@media(prefers-reduced-motion:reduce){.ai-agent-network *{animation:none!important;transform:none!important}.ai-agent-network .ai-dot{display:none}}
/* Look at a connected tool, think, then return a result. */
.ai-agent-network .ai-head{transform-origin:180px 135px;animation:ai-head-decide 12s ease-in-out infinite}.ai-agent-network .ai-eyes{animation:ai-gaze-decide 12s ease-in-out infinite}.ai-agent-network .ai-thinking{animation:ai-thinking-stage 12s linear infinite}.ai-agent-network .ai-thinking circle{animation:ai-thinking-dot 1.2s ease-in-out infinite}.ai-agent-network .ai-thought-two{animation-delay:.2s}.ai-agent-network .ai-thought-three{animation-delay:.4s}
.ai-agent-network .ai-task-tick{animation:ai-result-left 12s ease infinite;animation-delay:0s!important}.ai-agent-network .ai-tick-top{animation-name:ai-result-right}.ai-agent-network .ai-tick-data{animation-name:ai-result-right}.ai-agent-network .ai-tick-stroke{animation:none;animation-delay:0s!important;stroke-dashoffset:0}
@keyframes ai-head-decide{0%,100%{transform:rotate(0)}8%,20%{transform:rotate(-7deg)}28%,42%{transform:rotate(-2deg)}48%{transform:rotate(-5deg)}58%,68%{transform:rotate(7deg)}75%,84%{transform:rotate(2deg)}90%{transform:rotate(5deg)}}
@keyframes ai-gaze-decide{0%,100%{transform:translateX(0) scaleY(1)}8%,20%{transform:translate(-4px,1px) scaleY(1)}28%,38%{transform:translate(0,-1px) scaleY(.75)}40%{transform:translate(0,-1px) scaleY(.1)}43%,48%{transform:translateX(-3px) scaleY(1)}58%,68%{transform:translate(4px,-1px) scaleY(1)}75%,81%{transform:translate(0,-1px) scaleY(.75)}83%{transform:translate(0,-1px) scaleY(.1)}86%,92%{transform:translateX(3px) scaleY(1)}}
@keyframes ai-thinking-stage{0%,22%,45%,70%,88%,100%{opacity:0}27%,39%,75%,83%{opacity:1}}
@keyframes ai-thinking-dot{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@keyframes ai-result-left{0%,43%,56%,100%{opacity:0;transform:scale(.7)}47%,52%{opacity:1;transform:scale(1)}}
@keyframes ai-result-right{0%,86%,99%,100%{opacity:0;transform:scale(.7)}90%,96%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.ai-agent-network *{animation:none!important;transform:none!important}.ai-agent-network .ai-thinking{display:none}.ai-agent-network .ai-task-tick{opacity:1}}
/* Finish the flow, crossfade to success, then restart. */
.workflow-nodes-art .wn-diagram{animation:wn-diagram-fade 8s ease infinite}
.workflow-nodes-art .wn-success{animation:wn-completion-screen 8s ease infinite}
.workflow-nodes-art .wn-success-title{font-size:15px;font-weight:600;fill:#25282b}
@keyframes wn-diagram-fade{0%,72%{opacity:1}81%,97%{opacity:0}100%{opacity:1}}
@keyframes wn-completion-screen{0%,75%{opacity:0;transform:translateY(4px)}84%,93%{opacity:1;transform:translateY(0)}99%,100%{opacity:0;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.workflow-nodes-art .wn-diagram{animation:none!important;opacity:1}.workflow-nodes-art .wn-success{display:none}}
/* One shared timeline prevents delayed branches carrying over into a new loop. */
.workflow-nodes-art .wn-route,.workflow-nodes-art .wn-dot,.workflow-nodes-art .wn-check{animation-delay:0s!important}
.workflow-nodes-art .wn-route-0{animation-name:wn-start-wire}.workflow-nodes-art .wn-route-1,.workflow-nodes-art .wn-route-2{animation-name:wn-branch-wire}.workflow-nodes-art .wn-route-3,.workflow-nodes-art .wn-route-4{animation-name:wn-merge-wire}
.workflow-nodes-art .wn-dot-0{animation-name:wn-start-dot}.workflow-nodes-art .wn-dot-1,.workflow-nodes-art .wn-dot-2{animation-name:wn-branch-dot}.workflow-nodes-art .wn-dot-3,.workflow-nodes-art .wn-dot-4{animation-name:wn-merge-dot}
.workflow-nodes-art .wn-check-0{animation-name:wn-start-check}.workflow-nodes-art .wn-check-1{animation-name:wn-process-check}.workflow-nodes-art .wn-check-2{animation-name:wn-branch-check}
@keyframes wn-start-wire{0%,10%{stroke-dashoffset:1;opacity:0}12%{opacity:1}25%,75%{stroke-dashoffset:0;opacity:1}82%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes wn-branch-wire{0%,27%{stroke-dashoffset:1;opacity:0}29%{opacity:1}46%,75%{stroke-dashoffset:0;opacity:1}82%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes wn-merge-wire{0%,49%{stroke-dashoffset:1;opacity:0}51%{opacity:1}67%,75%{stroke-dashoffset:0;opacity:1}82%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes wn-start-dot{0%,10%{offset-distance:0%;opacity:0}12%{opacity:1}25%{offset-distance:100%;opacity:1}27%,100%{offset-distance:100%;opacity:0}}
@keyframes wn-branch-dot{0%,27%{offset-distance:0%;opacity:0}29%{opacity:1}46%{offset-distance:100%;opacity:1}49%,100%{offset-distance:100%;opacity:0}}
@keyframes wn-merge-dot{0%,49%{offset-distance:0%;opacity:0}51%{opacity:1}67%{offset-distance:100%;opacity:1}70%,100%{offset-distance:100%;opacity:0}}
@keyframes wn-start-check{0%,4%{opacity:0}8%,75%{opacity:1}82%,100%{opacity:0}}
@keyframes wn-process-check{0%,24%{opacity:0}27%,75%{opacity:1}82%,100%{opacity:0}}
@keyframes wn-branch-check{0%,46%{opacity:0}49%,75%{opacity:1}82%,100%{opacity:0}}
/* Faster synchronized workflow loop. */
.workflow-nodes-art .wn-route,.workflow-nodes-art .wn-dot,.workflow-nodes-art .wn-check,.workflow-nodes-art .wn-final-check,.workflow-nodes-art .wn-diagram,.workflow-nodes-art .wn-success{animation-duration:6s}
/* Rounded white editor with a raised Python file tab. */
.python-editor{border-radius:17px;background:#fff;border:1px solid #f3f4f6;box-shadow:0 6px 0 -3px #f3f4f6,0 14px 26px -15px #25282b40}
.python-editor-title{height:36px;background:#eef1eb;border:0;padding:0 10px;gap:12px;align-items:flex-end}
.python-window-dots{display:flex;gap:5px;align-self:center;flex-shrink:0}
.python-window-dots i{width:7px;height:7px;border-radius:50%;background:#8bd10a}
.python-window-dots i:nth-child(2){background:#8bd10a}.python-window-dots i:nth-child(3){background:#8bd10a}
.python-file-tab{display:flex;align-items:center;gap:7px;background:#fff;border-radius:10px 10px 0 0;padding:10px 12px 9px;font-size:8px;line-height:1;color:#25282b;white-space:nowrap}
.python-file-tab b{color:#8bd10a;font-size:10px;font-weight:700}
.python-code-viewport{height:121px;padding-top:9px;background:#fff}
.python-editor-status{background:#fff}
/* Four enlarged code lines in the editor viewport. */
.python-code-viewport{height:120px;padding:4px 0}
.python-code-row{min-height:28px;font-size:10px;line-height:28px}
.python-line-number{width:28px;padding-right:8px}
/* Compact, readable four-line code view. */
.python-editor{height:133px}
.python-code-viewport{height:76px;padding:4px 0}
.python-code-row{min-height:17px;font-size:10px;line-height:17px}
/* Larger code, tight leading, no cursor bars or empty rows. */
.python-line-text:last-child::after{content:none}
.python-editor{width:92%;height:141px}
.python-code-viewport{height:84px;padding:4px 0}
.python-code-row{font-size:12px;line-height:19px;min-height:19px}
.python-line-number{font-size:9px;width:25px;padding-right:6px}
/* Code-only window. */
.python-editor{height:100px;padding:8px 0}
.python-code-viewport{height:84px;padding:4px 12px}
.python-code-viewport{padding-left:24px;padding-right:18px}
/* Restore window controls without filename or line numbers. */
.python-editor{height:120px;padding:0}
.python-editor-title{height:28px;padding:0 14px;align-items:center}
.python-code-viewport{height:92px;padding:8px 18px 8px 24px}
/* Web development: build the page, adapt it, and confirm it is ready. */
.service-art .web-build-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.web-build-art text{font-family:Inter,Arial,sans-serif;text-anchor:start;fill:#25282b;stroke:none}.web-build-art .web-small{font-size:5px}.web-build-art .web-logo{font-size:11px;font-weight:700}.web-build-art .web-heading{font-size:19px;font-weight:700;letter-spacing:-.6px}.web-build-art .web-logo-small{font-size:6px;font-weight:700}.web-build-art .web-mobile-title{font-size:5px;font-weight:600}.web-build-art .web-button-label{fill:#25282b}
.web-build-art .web-layout{animation:web-layout-build 8s ease infinite}.web-build-art .web-content{animation:web-content-build 8s ease infinite}.web-build-art .web-action{animation:web-action-build 8s ease infinite}.web-build-art .web-mobile{animation:web-mobile-build 8s ease infinite}.web-build-art .web-ready{animation:web-ready-build 8s ease infinite}.web-build-art .web-pointer{animation:web-pointer-move 8s ease infinite}
@keyframes web-layout-build{0%{opacity:0;transform:translateY(4px)}12%,88%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes web-content-build{0%,12%{opacity:0;transform:translateY(5px)}32%,88%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes web-action-build{0%,28%{opacity:0}40%,88%{opacity:1}100%{opacity:0}}
@keyframes web-mobile-build{0%,40%{opacity:0;transform:translate(8px,4px)}60%,88%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(0,0)}}
@keyframes web-ready-build{0%,65%{opacity:0;transform:translateY(4px)}76%,90%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes web-pointer-move{0%,30%{transform:translate(30px,12px)}45%,85%,100%{transform:translate(0,0)}}
@media(prefers-reduced-motion:reduce){.web-build-art *{animation:none!important;transform:none!important;opacity:1}}
/* Management systems: a clear dashboard with illustrative business activity. */
.service-art .management-dashboard-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.management-dashboard-art text{font-family:Inter,Arial,sans-serif;text-anchor:start;fill:#25282b;stroke:none}.management-dashboard-art .md-title{font-size:9px;font-weight:600}.management-dashboard-art .md-demo{font-size:5px;fill:#6b7280;letter-spacing:.6px}.management-dashboard-art .md-brand{font-size:5px;font-weight:600;fill:#25282b}.management-dashboard-art .md-sidebar text{font-size:6.5px;fill:#d1d5db}.management-dashboard-art .md-label{font-size:6px;font-weight:500;fill:#6b7280}.management-dashboard-art .md-value{font-size:13px;font-weight:700;fill:#25282b}.management-dashboard-art .md-total{font-size:11px;font-weight:700}.management-dashboard-art .md-paid{font-size:5px;font-weight:600}.management-dashboard-art .md-notification{font-size:8px;font-weight:600}.management-dashboard-art .md-bars{transform-origin:180px 176px;animation:md-bars-live 6s ease infinite}.management-dashboard-art .md-order-chip{animation:md-order-arrives 6s ease infinite}.management-dashboard-art .md-pos{animation:md-pos-float 6s ease-in-out infinite}
@keyframes md-bars-live{0%,8%{transform:scaleY(.65)}35%,85%,100%{transform:scaleY(1)}}
@keyframes md-order-arrives{0%,25%{opacity:0;transform:translateY(6px)}40%,85%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes md-pos-float{0%,100%{transform:translateY(1px)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.management-dashboard-art *{animation:none!important;transform:none!important;opacity:1}}
/* Clearer dashboard typography and a quieter palette. */
.management-dashboard-art .md-label{font-size:6.5px;fill:#6b7280}.management-dashboard-art .md-value{font-size:12px;fill:#25282b}.management-dashboard-art .md-sidebar text{font-size:6.5px;fill:#f3f4f6}.management-dashboard-art .md-title{font-size:9px;fill:#25282b}.management-dashboard-art .md-notification{font-size:8px;fill:#25282b}
/* Management app: three useful views, selected by its sidebar. */
.service-art .management-app-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.management-app-art text{font-family:Inter,Arial,sans-serif;text-anchor:start;stroke:none;fill:#25282b}.management-app-art .ma-app-title{font-size:8px;font-weight:600}.management-app-art .ma-demo{font-size:5px;fill:#6b7280}.management-app-art .ma-brand{font-size:6px;fill:#d1d5db;font-weight:600}.management-app-art .ma-nav-labels text{font-size:7px;font-weight:500;fill:#f3f4f6}.management-app-art .ma-view-title{font-size:9px;font-weight:600}.management-app-art .ma-kpi-label{font-size:5px;fill:#6b7280}.management-app-art .ma-kpi-value{font-size:11px;font-weight:700;fill:#25282b}.management-app-art .ma-tab{fill:#8bd10a;animation:ma-tab-cycle 12s linear infinite}.management-app-art .ma-view{animation:ma-view-cycle 12s linear infinite;opacity:0}.management-app-art .ma-dashboard,.management-app-art .ma-tab-dashboard{animation-delay:-8s}.management-app-art .ma-customers,.management-app-art .ma-tab-customers{animation-delay:-4s}.management-app-art .ma-cursor{animation:ma-cursor-select 12s ease-in-out infinite}.management-app-art .ma-chart-line{stroke-dasharray:1;animation:ma-chart-build 12s ease infinite}.management-app-art .ma-pie{animation:ma-pie-update 12s ease infinite;transform-origin:0 0}.management-app-art .ma-reply-chip,.management-app-art .ma-customer-chip{animation:ma-chip-float 4s ease-in-out infinite}
@keyframes ma-view-cycle{0%{opacity:0}3%,28%{opacity:1}33%,100%{opacity:0}}
@keyframes ma-tab-cycle{0%,30%{opacity:.22}34%,100%{opacity:0}}
@keyframes ma-cursor-select{0%,25%,100%{transform:translate(82px,103px)}34%,58%{transform:translate(82px,133px)}67%,91%{transform:translate(82px,163px)}}
@keyframes ma-chart-build{0%,34%{stroke-dashoffset:1}52%,100%{stroke-dashoffset:0}}
@keyframes ma-pie-update{0%,34%{transform:rotate(-15deg)}55%,100%{transform:rotate(15deg)}}
@keyframes ma-chip-float{0%,100%{transform:translateY(2px)}50%{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.management-app-art *{animation:none!important;transform:none!important}.management-app-art .ma-inbox,.management-app-art .ma-customers,.management-app-art .ma-cursor{display:none}.management-app-art .ma-dashboard{opacity:1}.management-app-art .ma-tab-inbox,.management-app-art .ma-tab-customers{opacity:0}.management-app-art .ma-tab-dashboard{opacity:.22}.management-app-art .ma-chart-line{stroke-dashoffset:0}}
/* Dense workflow network with three synchronized processing waves. */
.service-art .complex-workflow-art{width:100%;max-width:360px;height:210px;fill:none;stroke:none}.complex-workflow-art text{font-family:Inter,Arial,sans-serif;stroke:none}.complex-workflow-art .cw-hub-title{font-size:8px;font-weight:600;fill:#f3f4f6;text-anchor:start}.complex-workflow-art .cw-success-title{font-size:15px;font-weight:600;fill:#25282b;text-anchor:middle}.complex-workflow-art .cw-network{animation:cw-network-cycle 8s ease infinite}.complex-workflow-art .cw-success{animation:cw-success-cycle 8s ease infinite}.complex-workflow-art .cw-route{stroke-dasharray:1;animation:cw-route-cycle 8s linear infinite;animation-delay:calc(var(--stage)*1.4s)}.complex-workflow-art .cw-dot{offset-rotate:0deg;animation:cw-dot-cycle 8s linear infinite;animation-delay:calc(var(--stage)*1.4s)}.complex-workflow-art .cw-check{animation:cw-check-cycle 8s linear infinite;animation-delay:calc(var(--stage)*1.4s)}.complex-workflow-art .cw-progress{transform-origin:150px 135px;animation:cw-progress-cycle 8s linear infinite}
@keyframes cw-route-cycle{0%,5%{stroke-dashoffset:1;opacity:0}7%{opacity:1}20%,70%{stroke-dashoffset:0;opacity:1}80%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes cw-dot-cycle{0%,5%{offset-distance:0%;opacity:0}7%{opacity:1}20%{offset-distance:100%;opacity:1}23%,100%{offset-distance:100%;opacity:0}}
@keyframes cw-check-cycle{0%,20%{opacity:0}24%,70%{opacity:1}80%,100%{opacity:0}}
@keyframes cw-progress-cycle{0%,5%{transform:scaleX(0)}65%,100%{transform:scaleX(1)}}
@keyframes cw-network-cycle{0%,70%{opacity:1}80%,97%{opacity:0}100%{opacity:1}}
@keyframes cw-success-cycle{0%,75%{opacity:0;transform:translateY(4px)}84%,92%{opacity:1;transform:translateY(0)}99%,100%{opacity:0;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.complex-workflow-art *{animation:none!important;transform:none!important}.complex-workflow-art .cw-dot,.complex-workflow-art .cw-success{display:none}.complex-workflow-art .cw-network,.complex-workflow-art .cw-check{opacity:1}.complex-workflow-art .cw-route{stroke-dashoffset:0}}

/* Solid brand lime accents on white service cards. */
.service-art{background:#fff}.service-card:hover,.service-card:focus-within{border-color:#8bd10a}

/* White card backgrounds; artwork keeps its existing colors. */

/* Color accents coordinated with each illustration. */
.management-app-art .ma-tab{fill:#8bd10a}.management-app-art .ma-kpi-value{fill:#25282b}.web-build-art .web-button-label{fill:#fff}.web-build-art .web-heading{fill:#25282b}

/* Deliberate component colors, rather than a single hue washed over the artwork. */
.ai-agent-network .ai-wires{stroke:#d1d5db}
.ai-agent-network .ai-contact-top>path:last-child,.ai-agent-network .ai-contact-bottom>path:last-child{stroke:#d1d5db}
.ai-agent-network .ai-journey-labels text{fill:#6b7280}
.ai-agent-network .ai-task-tick circle{fill:#8bd10a}
.ai-agent-network .ai-tick-stroke{stroke:#fff}
.ai-agent-network .ai-thinking{fill:#8bd10a}
.ai-agent-network .ai-eyes{fill:#f3f4f6}
.complex-workflow-art .cw-hub-title{fill:#f8fafc}
.complex-workflow-art .cw-success-title{fill:#25282b}
.complex-workflow-art .cw-node-person circle:not(.cw-check),.complex-workflow-art .cw-node-person path:not(.cw-check){fill:#8bd10a}
.complex-workflow-art .cw-node-gear circle:not(.cw-check){stroke:#8bd10a}
.complex-workflow-art .cw-node-gear circle[r="3"]{fill:#8bd10a;stroke:none}
.complex-workflow-art .cw-node-gear path:not(.cw-check){stroke:#8bd10a}
.complex-workflow-art .cw-check:is(circle){fill:#8bd10a}
.complex-workflow-art .cw-check:is(path){stroke:#fff}
.complex-workflow-art .cw-success circle:first-child{fill:#f3f4f6;stroke:#d1d5db}
.complex-workflow-art .cw-success circle:nth-child(2){fill:#8bd10a}
.complex-workflow-art .cw-success path{stroke:#fff}

/* Shared illustration family: brand lime, neutral UI, tiny teal accents. */
.service-card{background:#fff}
.service-art{background:radial-gradient(ellipse at 50% 65%,#8bd10a1f 0%,#8bd10a0a 42%,#ffffff00 73%),#fff}
.service-art text,.management-app-art text,.web-build-art text,.analytics-art text{fill:#4b5563}
.management-app-art .ma-nav-labels text,.management-app-art .ma-brand,.complex-workflow-art .cw-hub-title{fill:#fff}
.management-app-art .ma-tab{fill:#8bd10a}
.management-app-art .ma-kpi-value,.web-build-art .web-heading,.complex-workflow-art .cw-success-title{fill:#25282b}
.web-build-art .web-button-label{fill:#25282b}
.ai-agent-network .ai-wires{stroke:#d1d5db}
.ai-agent-network .ai-signals,.ai-agent-network .ai-tick-stroke{stroke:#8bd10a}
.ai-agent-network .ai-task-tick circle,.complex-workflow-art .cw-check:is(circle){fill:#8bd10a}
.ai-agent-network .ai-tick-stroke,.complex-workflow-art .cw-check:is(path){stroke:#25282b}
.ai-agent-network .ai-thinking{fill:#8bd10a}
.ai-agent-network .ai-eyes{fill:#fff}
.ai-agent-network .ai-dot-one{fill:#14b8a6}
.ai-agent-network .ai-journey-labels text{fill:#6b7280}
.complex-workflow-art .cw-node-person circle:not(.cw-check),.complex-workflow-art .cw-node-person path:not(.cw-check){fill:#8bd10a}
.complex-workflow-art .cw-node-gear circle:not(.cw-check),.complex-workflow-art .cw-node-gear path:not(.cw-check){stroke:#8bd10a}
.complex-workflow-art .cw-node-gear circle[r="3"]{fill:#8bd10a;stroke:none}
.complex-workflow-art .cw-dot{fill:#14b8a6}
.complex-workflow-art .cw-success circle:first-child{fill:#8bd10a1f;stroke:#8bd10a55}
.complex-workflow-art .cw-success circle:nth-child(2){fill:#8bd10a}
.complex-workflow-art .cw-success path{stroke:#25282b}
.analytics-art .da-pie-segments path:nth-child(2){fill:#14b8a6}
.analytics-art .da-pie-segments path:nth-child(3){fill:#d1d5db}
.management-app-art .ma-pie path:nth-child(2){fill:#14b8a6}
.management-app-art .ma-pie path:nth-child(3){fill:#d1d5db}
.web-build-art .web-ready circle{fill:#14b8a6}
.python-code-row{color:#25282b}
.python-keyword{color:#609509}.python-string{color:#4b5563}.python-number{color:#14b8a6}.python-function{color:#609509}.python-comment{color:#9ca3af}
.python-window-dots i{background:#d1d5db}.python-window-dots i:nth-child(2){background:#14b8a6}.python-window-dots i:nth-child(3){background:#8bd10a}

/* Blue antenna tips and travelling data indicators. */
.ai-agent-network .ai-head>circle{fill:#3b82f6}
.ai-agent-network .ai-travel-dots .ai-dot{fill:#3b82f6}
.ai-agent-network .ai-signals{stroke:#3b82f6}
.complex-workflow-art .cw-dot{fill:#3b82f6}



/* Expressions share the existing read → think → respond timeline. */
.ai-agent-network .ai-expression-attentive{animation:ai-face-attentive 12s linear infinite}
.ai-agent-network .ai-eyes{fill:#67e8f9;animation:ai-face-attentive 12s linear infinite,ai-gaze-decide 12s ease-in-out infinite}
.ai-agent-network .ai-expression-thinking{animation:ai-face-thinking 12s linear infinite;opacity:0}
.ai-agent-network .ai-expression-response{animation:ai-face-response 12s linear infinite;opacity:0}
@keyframes ai-face-attentive{0%,22%,57%,70%,100%{opacity:1}26%,54%,74%,97%{opacity:0}}
@keyframes ai-face-thinking{0%,22%,45%,70%,88%,100%{opacity:0}27%,40%,75%,84%{opacity:1}}
@keyframes ai-face-response{0%,43%,57%,86%,100%{opacity:0}47%,53%,90%,97%{opacity:1}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-expression-thinking,.ai-agent-network .ai-expression-response{display:none}.ai-agent-network .ai-expression-attentive{opacity:1;animation:none!important}}

/* Message appears as the robot delivers each response. */
.ai-agent-network .ai-response-bubble{opacity:0;transform-origin:190px 85px;animation:ai-response-message 12s ease infinite}
@keyframes ai-response-message{0%,43%,57%,86%,100%{opacity:0;transform:translateY(5px) scale(.9)}47%,53%,90%,97%{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-response-bubble{display:none}}

/* Brand green antenna tips; travelling data dots remain blue. */
.ai-agent-network .ai-head>circle{fill:#8bd10a}

/* Antenna tips match the cyan eyes and response bubble. */
.ai-agent-network .ai-head>circle{fill:#67e8f9}

/* Standard red, amber, green window controls on the code editor. */
.python-window-dots i{background:#ff5f57}.python-window-dots i:nth-child(2){background:#febc2e}.python-window-dots i:nth-child(3){background:#28c840}

/* Black antenna tips and brand green response accents. */
.ai-agent-network .ai-head>circle{fill:#000}

/* Neutral gray robot antenna tips. */
.ai-agent-network .ai-head>circle{fill:#9ca3af}

/* A little more brand green around the white agent. */
.ai-agent-network .ai-halo{stroke:#8bd10a;stroke-opacity:.2;stroke-width:12}
.ai-agent-network .ai-contact-top>rect,.ai-agent-network .ai-contact-bottom>rect{stroke:#a6ce69;stroke-width:1.2}
.ai-agent-network .ai-task-tick circle{fill:#8bd10a}

/* Dotted directional connections replace individual blue particles. */
.ai-agent-network .ai-wires{stroke:#d1d5db;stroke-dasharray:1 6;stroke-linecap:round}
.ai-agent-network .ai-signals{stroke:#8bd10a;stroke-width:2;stroke-dasharray:1 6;stroke-linecap:round;animation:ai-dotted-flow 1.2s linear infinite}
@keyframes ai-dotted-flow{from{stroke-dashoffset:0;opacity:.85}to{stroke-dashoffset:-28;opacity:.85}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-signals{animation:none!important;opacity:.6}}

/* Subtle floating cards, staggered across the grid. */
.service-card{box-shadow:0 8px 24px rgba(25,35,20,.07),0 2px 6px rgba(25,35,20,.04);animation:service-card-float 6s ease-in-out infinite}
.service-card:nth-child(2),.service-card:nth-child(5){animation-delay:-2s}
.service-card:nth-child(3),.service-card:nth-child(6){animation-delay:-4s}
.service-card:hover,.service-card:focus-within{animation-play-state:paused;box-shadow:0 14px 32px rgba(25,35,20,.11),0 3px 8px rgba(25,35,20,.05)}
@keyframes service-card-float{0%,100%{translate:0 0}50%{translate:0 -6px}}
@media(prefers-reduced-motion:reduce){.service-card{animation:none;translate:none}}

.services-label{color:#8bd10a}


.services-heading-accent{color:#8bd10a}

/* Why Origin: dark bento section with static product illustrations. */
.why-origin{background:radial-gradient(ellipse at 50% 10%,#8bd10a10,transparent 55%),#090c09;color:#fff;padding:96px var(--gutter)}
.wo-container{max-width:1200px;margin:auto}.wo-header{text-align:center;margin-bottom:40px}.wo-label{display:inline-block;border:1px solid #8bd10a40;background:#8bd10a0c;border-radius:999px;padding:8px 15px;font-size:12px;letter-spacing:1.5px;color:#8bd10a;font-weight:500}.wo-header h2{font-size:clamp(32px,4vw,48px);letter-spacing:-.035em;line-height:1.15;margin:20px 0}.wo-header>p{color:#a5aaa5;font-size:18px;line-height:1.5;max-width:680px;margin:auto}
.wo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.wo-card{position:relative;display:flex;flex-direction:column;padding:24px;border-radius:24px;background:#ffffff0b;border:1px solid #ffffff12;box-shadow:inset 0 1px 20px #8bd10a04;min-height:330px;transition:transform .25s ease,border-color .25s ease;overflow:hidden}.wo-wide{grid-column:span 2}.wo-card:hover,.wo-card:focus-visible{transform:translateY(-4px);border-color:#8bd10a80;outline:none}.wo-art{height:170px;display:grid;align-items:center;margin-bottom:20px;flex-shrink:0}.wo-copy h3{font-size:21px;line-height:1.25;margin:0 0 12px;letter-spacing:-.5px}.wo-copy p{font-size:15px;line-height:1.6;color:#aeb4ae;margin:0}.wo-detail{display:none}.wo-card:hover .wo-summary,.wo-card:focus .wo-summary{display:none}.wo-card:hover .wo-detail,.wo-card:focus .wo-detail{display:block}.wo-card:hover .wo-art,.wo-card:focus .wo-art{height:135px}
.wo-chat{display:grid;gap:14px}.wo-chat>div{display:flex;gap:10px;align-items:center}.wo-chat i{font-style:normal;display:grid;place-items:center;width:27px;height:27px;flex-shrink:0;border-radius:50%;background:#ffffff14;color:#e5e7eb;font-size:11px}.wo-chat p{font-size:12px;line-height:1.4;margin:0;border-radius:12px;padding:10px 12px;background:#ffffff09;border:1px solid #ffffff12}.wo-chat small{display:block;margin-top:5px;color:#828a82;font-size:11px}.wo-chat>div:last-child p{border-color:#8bd10a30;background:#8bd10a0c}.wo-chat>div:last-child i{color:#8bd10a;border:1px solid #8bd10a40}
.wo-tickets{display:grid;gap:10px}.wo-tickets>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 10px;border-radius:9px;background:#ffffff05;border:1px solid #ffffff0e;font-size:12px;color:#cdd2cd}.wo-tickets b{font-size:11px;font-weight:500;white-space:nowrap;padding:5px 7px;border-radius:999px;background:#8bd10a16;color:#8bd10a}.wo-tickets .wo-progress{background:transparent;border:1px solid #8bd10a40}
.wo-chart-caption,.wo-chart-labels{display:flex;justify-content:space-between;color:#aeb4ae;font-size:11px}.wo-chart-caption span{color:#8bd10a;font-size:18px}.wo-bars{height:115px;display:flex;gap:15px;align-items:flex-end;padding:0 12px;border-bottom:1px solid #ffffff18}.wo-bars i{flex:1;background:#8bd10a70;border-radius:5px 5px 0 0}.wo-bars i:last-child{background:#8bd10a}.wo-chart-labels{margin-top:8px}.wo-network{width:100%;height:160px}
.wo-time-header{display:flex;justify-content:space-between;margin-bottom:14px;font-size:11px;color:#aeb4ae}.wo-time-header span:last-child{color:#8bd10a}.wo-time-row{display:grid;grid-template-columns:75px 1fr;gap:12px;align-items:center;margin:8px 0;font-size:11px;color:#d1d5db}.wo-time-row>div{background:repeating-linear-gradient(90deg,transparent 0%,transparent 19.5%,#ffffff09 19.5%,#ffffff09 20%);height:17px}.wo-time-row i{display:block;height:17px;background:#ffffff20;border-radius:4px}.wo-time-row .wo-current{background:#8bd10a}
.wo-footer{text-align:center;margin-top:40px}.wo-footer p{font-size:13px;color:#929b92;margin:16px 0 0}
.wo-card.wo-reveal{opacity:0;translate:0 20px;transition:opacity .6s ease,translate .6s ease,transform .25s ease,border-color .25s ease}.wo-card.wo-reveal.wo-visible{opacity:1;translate:0 0}
@media(max-width:1000px){.wo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wo-wide{grid-column:span 2}}
@media(max-width:650px){.why-origin{padding:64px var(--gutter)}.wo-grid{grid-template-columns:1fr}.wo-wide{grid-column:auto}.wo-header>p{font-size:16px}.wo-card{min-height:310px}}
@media(hover:none){.wo-card .wo-detail{display:block;margin-top:10px}.wo-card .wo-summary{display:none}}
@media(prefers-reduced-motion:reduce){.wo-card,.wo-card.wo-reveal{transition:none;opacity:1;translate:none}}

/* Crossfade the illustration into a text-only detail view. */
.wo-card .wo-art{transition:opacity .35s ease,transform .35s ease;opacity:1;transform:translateY(0)}
.wo-card .wo-copy{transition:transform .4s ease}
.wo-card .wo-detail{display:block;position:absolute;left:24px;right:24px;top:92px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .35s ease,transform .4s ease,visibility .35s}
.wo-card .wo-summary{transition:opacity .2s ease}
.wo-card:hover .wo-art,.wo-card:focus .wo-art{height:170px;opacity:0;transform:translateY(-12px);pointer-events:none}
.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{transform:translateY(-190px)}
.wo-card .wo-copy{position:static}
.wo-card:hover .wo-summary,.wo-card:focus .wo-summary{display:block;opacity:0;visibility:hidden}
.wo-card:hover .wo-detail,.wo-card:focus .wo-detail{opacity:1;visibility:visible;transform:translateY(0);top:214px}
@media(hover:none){.wo-card .wo-detail{position:static;opacity:1;visibility:visible;transform:none;margin-top:0}.wo-card .wo-summary{display:none}.wo-card:hover .wo-art,.wo-card:focus .wo-art{opacity:1;transform:none}.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{transform:none}}
@media(prefers-reduced-motion:reduce){.wo-card .wo-art,.wo-card .wo-copy,.wo-card .wo-detail,.wo-card .wo-summary{transition:none}}
/* Keep the detail layout anchored inside its own text panel. */
.wo-card .wo-copy{position:absolute;left:24px;right:24px;top:214px;transition:top .4s ease;transform:none}
.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{top:28px;transform:none}
.wo-card .wo-detail{position:absolute;left:0;right:0;top:68px}
.wo-card:hover .wo-detail,.wo-card:focus .wo-detail{top:68px}
@media(hover:none){.wo-card .wo-copy,.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{position:relative;left:auto;right:auto;top:auto}.wo-card .wo-detail{position:static}}

/* Match the Why Origin section-label pill. */
.services-label{display:inline-block;border:1px solid #8bd10a40;background:#8bd10a0c;border-radius:999px;padding:8px 15px;font-size:12px;letter-spacing:1.5px;color:#8bd10a;font-weight:500}


/* Industries: vertical tabs and one focused detail panel. */
.industry-section{padding:96px var(--gutter);background:#fafbf8;color:#25282b}.industry-container{max-width:1200px;margin:auto}.industry-header{text-align:center;margin-bottom:40px}.industry-label{display:inline-block;padding:8px 15px;border:1px solid #8bd10a40;background:#8bd10a0c;border-radius:999px;color:#8bd10a;font-size:12px;font-weight:500;letter-spacing:1.5px}.industry-header h2{font-size:clamp(32px,4vw,48px);line-height:1.15;letter-spacing:-.035em;margin:20px 0}.industry-header>p{font-size:18px;line-height:1.5;color:#6b7280;margin:0}.industry-layout{display:grid;grid-template-columns:minmax(0,35fr) minmax(0,65fr);gap:24px;align-items:stretch}.industry-tabs{display:flex;flex-direction:column;gap:12px}.industry-tab{display:flex;align-items:center;gap:14px;position:relative;border:1px solid #e1e5dd;background:#fff;border-radius:13px;padding:15px 18px;text-align:left;font:500 16px/1.4 Inter,Arial,sans-serif;color:#6b7280;cursor:pointer;min-height:72px;transition:border-color .2s,background .2s}.industry-tab:hover{border-color:#badc89}.industry-tab[aria-selected="true"]{background:#f0f7e5;color:#25282b;font-weight:700;border-color:#d1e4b5}.industry-tab[aria-selected="true"]::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;background:#8bd10a;border-radius:3px}.industry-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#f3f4f6;flex-shrink:0}.industry-icon svg{width:22px;height:22px}.industry-tab[aria-selected="true"] .industry-icon{background:#8bd10a22;color:#78b209}.industry-tab:focus-visible,.industry-panel:focus-visible,.industry-footer a:focus-visible{outline:2px solid #8bd10a;outline-offset:4px}.industry-panels{display:grid;border-radius:24px;border:1px solid #e1e5dd;background:radial-gradient(ellipse at 100% 100%,#8bd10a15,transparent 55%),#fff;box-shadow:0 10px 30px #25282b06;overflow:hidden}.industry-panel{padding:40px;grid-area:1/1}.industry-panel[hidden]{display:none}.industry-panel h3{font-size:30px;line-height:1.2;letter-spacing:-.8px;margin:0 0 18px}.industry-description{font-size:17px;line-height:1.6;color:#6b7280;margin:0 0 30px;max-width:600px}.industry-features{border-top:1px solid #e5e7eb;padding-top:28px;display:grid;gap:24px}.industry-feature{display:flex;align-items:flex-start;gap:14px}.industry-feature i{width:7px;height:7px;margin-top:8px;background:#8bd10a;border-radius:50%;flex-shrink:0}.industry-feature h4{font-size:16px;line-height:1.4;margin:0 0 7px;font-weight:700}.industry-feature p{font-size:15px;line-height:1.5;color:#6b7280;margin:0}.industry-panel.is-entering{animation:industry-in .25s ease both}.industry-panel.is-leaving{animation:industry-out .12s ease both}.industry-footer{text-align:center;margin:32px 0 0;font-size:16px;color:#6b7280}.industry-footer a{color:#78b209;font-weight:500;margin-left:8px}@keyframes industry-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes industry-out{to{opacity:0;transform:translateY(-5px)}}
@media(max-width:760px){.industry-section{padding:64px var(--gutter)}.industry-layout{grid-template-columns:1fr}.industry-tabs{flex-direction:row;overflow-x:auto;padding:4px 4px 10px;gap:10px}.industry-tab{flex-shrink:0;white-space:nowrap;border-radius:999px;min-height:54px;padding:10px 15px;font-size:14px;gap:9px}.industry-icon{width:28px;height:28px;border-radius:50%}.industry-icon svg{width:18px;height:18px}.industry-tab[aria-selected="true"]::before{display:none}.industry-panel{padding:28px 24px}.industry-panel h3{font-size:26px}.industry-footer a{display:block;margin:8px 0 0}}
@media(prefers-reduced-motion:reduce){.industry-tab{transition:none}.industry-panel.is-entering,.industry-panel.is-leaving{animation:none}}

/* Shared section-heading typography, based on the approved Services heading. */
:root{--section-heading-size:48px;--section-heading-weight:700;--section-heading-leading:1.15;--section-heading-tracking:-.035em}
.services-intro h2,.wo-header h2,.industry-header h2,.approach h2,.contact h2{font-family:Inter,Arial,sans-serif;font-size:var(--section-heading-size);font-weight:var(--section-heading-weight);line-height:var(--section-heading-leading);letter-spacing:var(--section-heading-tracking)}
@media(max-width:650px){:root{--section-heading-size:32px}}

.section-heading-accent{color:#8bd10a}

/* CTA video and the shared transparent animated button. */
.contact-video-section{position:relative;isolation:isolate;min-height:480px;height:65svh;max-height:800px;background:#090c09;display:grid;place-items:end center;padding:48px var(--gutter);overflow:hidden}
.contact-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.contact-video-content{text-align:center;position:relative;max-width:100%}
.contact-video-content .animated-button{background:transparent;color:#fff}
.contact-video-content .animated-button:hover{background:#8bd10a;color:#10120f}
.contact-video-content .contact-note{color:#fff;background:#090c09b3;border-radius:12px;padding:12px;max-width:440px;font-size:14px}
@media(max-width:650px){.contact-video-section{min-height:320px;height:50svh;padding-bottom:32px}}

/* Full-height responsive CTA video. */
.contact-video-section{height:100svh;min-height:100svh;max-height:none;padding-bottom:clamp(32px,8svh,80px)}
.contact-video{width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:650px){.contact-video-section{height:100svh;min-height:100svh;padding-bottom:48px}}

/* Wide rounded video card with the CTA beneath it. */
.contact-video-section{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;align-items:center;gap:32px;padding:80px var(--gutter);overflow:visible}
.contact-video-card{position:relative;width:100%;max-width:1200px;aspect-ratio:16/6;border-radius:28px;overflow:hidden;background:#101510}
.contact-video-card .contact-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.contact-video-content{flex-shrink:0}
@media(max-width:650px){.contact-video-section{height:auto;min-height:0;padding:56px var(--gutter);gap:24px}.contact-video-card{aspect-ratio:16/8;border-radius:20px}}


/* Light GridMotion background, contained behind Services. */
.services-showcase{position:relative;isolation:isolate;overflow:hidden}
.services-grid-background{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.65;mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent);mask-composite:intersect;-webkit-mask-composite:source-in}
.grid-motion__plane{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-12deg)}
.grid-motion__row{position:absolute;display:flex;gap:16px;width:max-content;will-change:transform}
.grid-motion__tile{flex:none;width:var(--gm-tile-w);height:var(--gm-tile-h);border-radius:14px;border:1px solid rgba(24,24,27,.08);background:#f0f1ee;box-shadow:inset 0 1px 0 #fff;background-image:radial-gradient(circle at center,#ffffff80,transparent 75%)}
.services-container{position:relative}
@media(prefers-reduced-motion:reduce){.grid-motion__row{will-change:auto}}

/* Stronger contrast for the moving grid on the light Services background. */
.services-grid-background{opacity:.9}
.services-grid-background .grid-motion__tile{background:#e2e6dc;border-color:#c5cdbb;box-shadow:inset 0 1px 0 #ffffffb3,0 3px 10px #25282b08}

.services-grid-background .grid-motion__tile{background:#cbd2c2;border-color:#a8b29c}

.services-grid-background .grid-motion__tile{overflow:hidden}.grid-motion__tile img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

/* Smaller tiles remain unshaded with the original 16px gaps. */
.services-grid-background{opacity:1;mask-image:none;-webkit-mask-image:none;mask-composite:add;-webkit-mask-composite:source-over}.services-grid-background .grid-motion__tile{box-shadow:none;background-image:none}.services-grid-background .grid-motion__tile img{opacity:1;filter:none}

/* Temporarily hide illustrations; their markup and animation code remain. */
.service-card>.service-art{display:none}
.service-card{grid-template-rows:58px auto;padding:28px 32px;align-content:start}
.service-card>p{margin:14px 0 0}
@media(max-width:650px){.service-card{padding:24px}}

/* The same looping image grid behind the dark Why Origin section. */
.why-origin{position:relative;isolation:isolate;overflow:hidden}
.origin-grid-background{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.22}
.origin-grid-background .grid-motion__tile{background:#151a15;border-color:#ffffff18;overflow:hidden;box-shadow:none;background-image:none}
.wo-container{position:relative}
.why-origin .wo-card{background:rgba(13,18,13,.9)}

.origin-grid-background{opacity:1;mask-image:none;-webkit-mask-image:none}



.origin-grid-background{opacity:.9}

.origin-grid-background{opacity:.8}

.origin-grid-background{opacity:.75}

.origin-grid-background{opacity:.7}

.services-grid-background{opacity:.7}

/* Dark Services grid, retaining the 30% fade. */
.services-showcase{background:#090c09;color:#fff}
.services-grid-background{opacity:.7}
.services-grid-background .grid-motion__tile{background:#151a15;border-color:#ffffff18}
.services-intro>p:last-child{color:#a5aaa5}
.service-card{color:#171a17}

/* Slightly translucent dark Services cards. */
.service-card{background:rgba(13,18,13,.88);color:#fff;border-color:#ffffff20}
.service-card>p{color:#b6bdb6}
.service-card:hover,.service-card:focus-within{border-color:#8bd10a;box-shadow:0 14px 32px #00000030}

/* Restore light Services and white compact cards; illustrations stay hidden. */
.services-showcase{background:#f8faf3;color:#171a17}
.services-intro>p:last-child{color:#6b7280}
.service-card{background:#fff;color:#171a17;border-color:#e1e5dd;box-shadow:0 8px 24px rgba(25,35,20,.07),0 2px 6px rgba(25,35,20,.04)}
.service-card>p{color:#6b7280}
.service-card:hover,.service-card:focus-within{border-color:#8bd10a;box-shadow:0 14px 32px rgba(25,35,20,.11),0 3px 8px rgba(25,35,20,.05)}
.service-card>.service-art{display:none}

.service-card-video{grid-template-rows:58px auto auto}.service-video{width:100%;margin-top:24px;border-radius:14px;overflow:hidden;background:#fff;aspect-ratio:16/9;opacity:1}.service-video video{display:block;width:100%;height:100%;object-fit:cover;opacity:1;filter:none}

/* Separate app workflow artwork; previous service illustrations remain hidden. */
.service-card-workflow{grid-template-rows:58px auto auto}
.service-app-workflow{width:calc(100% + 32px);margin-top:20px}
.service-app-workflow .app-workflow-art{width:100%;height:auto;display:block;fill:none;stroke:none}
.app-workflow-art text{font-family:Inter,Arial,sans-serif;stroke:none;text-anchor:start;fill:#303830}
.app-workflow-art .app-flow-name{font-size:12px;font-weight:600}.app-workflow-art .app-flow-caption{font-size:11px;fill:#6b7280}
.app-flow-lines{animation:app-workflow-running 1.4s linear infinite}
@keyframes app-workflow-running{to{stroke-dashoffset:-28}}
@media(prefers-reduced-motion:reduce){.app-flow-lines{animation:none}}

.service-custom-image{width:100%;margin-top:24px;border-radius:14px;overflow:hidden}.service-custom-image img{display:block;width:100%;height:auto;opacity:1}

.service-agent-image{width:100%;margin-top:24px;border-radius:14px;overflow:hidden}.service-agent-image img{display:block;width:100%;height:auto;opacity:1}

.service-custom-app{width:calc(100% + 24px);margin-top:24px}.custom-app-art{display:block;width:100%;height:auto}.custom-app-art .cs-step{animation:custom-app-reveal 6s ease infinite}.custom-app-art .cs-step-1{animation-delay:.5s}.custom-app-art .cs-step-2{animation-delay:1s}@keyframes custom-app-reveal{0%{opacity:.45}25%,90%,100%{opacity:1}}@media(prefers-reduced-motion:reduce){.custom-app-art .cs-step{animation:none}}

.service-app-workflow .complex-workflow-art{display:block;width:100%;height:230px}.cw-logo-node svg{stroke:none}

.service-app-workflow .ordered-workflow-art{display:block;width:100%;height:auto}
.ow-flow{animation:ow-dots 1.2s linear infinite}.ow-network{animation:ow-network 7s ease infinite}.ow-success{opacity:0;animation:ow-success 7s ease infinite}
@keyframes ow-dots{to{stroke-dashoffset:-28}}
@keyframes ow-network{0%,70%,100%{opacity:1}80%,96%{opacity:0}}
@keyframes ow-success{0%,76%,100%{opacity:0}84%,94%{opacity:1}}
@media(prefers-reduced-motion:reduce){.ow-flow,.ow-network,.ow-success{animation:none}.ow-success{display:none}}

/* Logo workflow stays visible without a completion screen. */
.service-app-workflow .cw-network{animation:none;opacity:1}

.service-management-summary{width:calc(100% + 24px);margin-top:24px}.management-summary-art{display:block;width:100%;height:auto}

/* Live dashboard cycle: metrics settle, then refresh together. */
.ms-new-ring{animation:ms-ring-live 5s ease-in-out infinite}
.ms-live-trend{stroke-dasharray:1;animation:ms-trend-live 5s ease infinite}
.ms-live-bar{transform-box:fill-box;transform-origin:center bottom;animation:ms-bars-live 5s ease-in-out infinite}
.ms-live-progress{transform-box:fill-box;transform-origin:left center;animation:ms-progress-live 5s ease infinite}
@keyframes ms-ring-live{0%,100%{stroke-dasharray:175 270}55%,80%{stroke-dasharray:245 270}}
@keyframes ms-trend-live{0%{stroke-dashoffset:1}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
@keyframes ms-bars-live{0%,100%{transform:scaleY(.55)}50%,80%{transform:scaleY(1)}}
@keyframes ms-progress-live{0%,100%{transform:scaleX(.6)}50%,80%{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.management-summary-art *{animation:none!important}.ms-live-trend{stroke-dashoffset:0}}

.service-agent-art{width:calc(100% + 32px);margin-top:24px}.service-agent-art .ai-agent-network{width:100%;height:230px;display:block;fill:none;stroke:none}

/* Alternate workflow with a two-way customer conversation. */
.ai-agent-network .ai-workflow-scene{animation:ai-workflow-scene 20s ease infinite}
.ai-agent-network .ai-conversation-scene{opacity:0;animation:ai-conversation-scene 20s ease infinite}
.ai-agent-network .ai-conversation-call{animation:ai-call-channel 20s ease infinite}
.ai-agent-network .ai-conversation-chat{opacity:0;animation:ai-chat-channel 20s ease infinite}
.ai-to-customer,.ai-from-customer{animation:ai-dialog-flow 1.2s linear infinite}
@keyframes ai-workflow-scene{0%,44%,100%{opacity:1}49%,94%{opacity:0}}
@keyframes ai-conversation-scene{0%,44%,100%{opacity:0}49%,94%{opacity:1}}
@keyframes ai-call-channel{0%,65%{opacity:1}70%,100%{opacity:0}}
@keyframes ai-chat-channel{0%,65%{opacity:0}70%,94%{opacity:1}100%{opacity:0}}
@keyframes ai-dialog-flow{to{stroke-dashoffset:-28}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-workflow-scene{animation:none!important;opacity:1}.ai-agent-network .ai-conversation-scene{display:none}}

/* Faster conversation scene with a balanced pair and customer-facing gaze. */
.ai-agent-network .ai-workflow-scene{animation-duration:12s;animation-name:ai-workflow-fast}
.ai-agent-network .ai-conversation-scene{animation-duration:12s;animation-name:ai-conversation-fast;translate:-35px 0}
.ai-agent-network .ai-conversation-call,.ai-agent-network .ai-conversation-chat{animation-duration:12s}
.ai-agent-network .ai-robot{animation:ai-conversation-position 12s ease infinite}
.ai-agent-network .ai-halo,.ai-agent-network>circle{animation:ai-backdrop-scene 12s ease infinite}
.ai-agent-network .ai-head{animation:ai-head-customer 12s ease-in-out infinite}
.ai-agent-network .ai-eyes{animation:ai-face-attentive 12s linear infinite,ai-eyes-customer 12s ease-in-out infinite}
@keyframes ai-workflow-fast{0%,28%,100%{opacity:1}34%,94%{opacity:0}}
@keyframes ai-conversation-fast{0%,28%,100%{opacity:0}34%,94%{opacity:1}}
@keyframes ai-backdrop-scene{0%,28%,100%{opacity:1}34%,94%{opacity:0}}
@keyframes ai-conversation-position{0%,28%,100%{transform:translateX(0)}34%,94%{transform:translateX(-40px)}}
@keyframes ai-head-customer{0%,100%{transform:rotate(0)}10%,20%{transform:rotate(-6deg)}34%,94%{transform:rotate(5deg)}}
@keyframes ai-eyes-customer{0%,100%{transform:translateX(0)}10%,20%{transform:translateX(-3px)}34%,94%{transform:translateX(4px)}}
@media(prefers-reduced-motion:reduce){.ai-agent-network .ai-robot,.ai-agent-network .ai-head,.ai-agent-network .ai-eyes{animation:none!important;transform:none!important}.ai-agent-network .ai-halo,.ai-agent-network>circle{animation:none!important;opacity:1}}

/* Restore the saved Web App and Data Analytics illustrations. */
.service-card-restored-art{grid-template-rows:58px auto 210px}.service-card-restored-art>.service-art{display:grid;margin-top:20px;width:calc(100% + 64px)}

/* Two-second code intro before the existing website preview. */
.service-art:has(.web-code-scene){position:relative}
.web-code-scene,.web-preview-scene{position:absolute;inset:0;display:grid;place-items:center}
.web-code-scene{animation:web-code-intro 10s linear infinite}
.web-preview-scene{animation:web-preview-intro 10s linear infinite}
@keyframes web-code-intro{0%,18%{opacity:1}23%,96%{opacity:0}100%{opacity:1}}
@keyframes web-preview-intro{0%,18%{opacity:0}23%,96%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.web-code-scene{display:none}.web-preview-scene{animation:none;opacity:1}}

/* Scene timing is controlled by one JS clock, not independent looping fades. */
.web-code-scene,.web-preview-scene{animation:none;transition:opacity .35s ease}
.web-code-scene{opacity:1}.web-preview-scene{opacity:0}
.service-art[data-phase="preview"] .web-code-scene{opacity:0}
.service-art[data-phase="preview"] .web-preview-scene{opacity:1}
.service-art[data-phase="return"] .web-code-scene{opacity:1}
.service-art[data-phase="return"] .web-preview-scene{opacity:0}
.web-preview-scene .web-build-art *{animation-iteration-count:1;animation-fill-mode:forwards}
.web-preview-scene .web-build-art .web-layout,.web-preview-scene .web-build-art .web-content,.web-preview-scene .web-build-art .web-action,.web-preview-scene .web-build-art .web-mobile,.web-preview-scene .web-build-art .web-ready{animation-fill-mode:both}
@keyframes web-layout-build{0%{opacity:0;transform:translateY(4px)}12%,100%{opacity:1;transform:translateY(0)}}
@keyframes web-content-build{0%,12%{opacity:0;transform:translateY(5px)}32%,100%{opacity:1;transform:translateY(0)}}
@keyframes web-action-build{0%,28%{opacity:0}40%,100%{opacity:1}}
@keyframes web-mobile-build{0%,40%{opacity:0;transform:translate(8px,4px)}60%,100%{opacity:1;transform:translate(0,0)}}
@keyframes web-ready-build{0%,65%{opacity:0;transform:translateY(4px)}76%,100%{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.web-code-scene,.web-preview-scene{transition:none}.web-code-scene{display:none}.web-preview-scene{opacity:1!important}}

/* Restored management workspace: Inbox, Dashboard, Customers. */
.service-management-summary .management-app-art{display:block;width:100%;height:210px;fill:none;stroke:none}

/* Grid moved to Industries with its existing size, speed, and opacity. */
.industry-section{position:relative;isolation:isolate;overflow:hidden}.industry-container{position:relative}

/* Dark Industries theme with the existing image grid. */
.industry-section{background:#090c09;color:#fff}
.industry-header>p,.industry-footer{color:#b0b8b0}
.industry-tab{background:rgba(13,18,13,.92);border-color:#ffffff20;color:#b0b8b0}
.industry-icon{background:#ffffff0c}
.industry-tab:hover{border-color:#8bd10a60}
.industry-tab[aria-selected="true"]{background:#1c2b12;color:#fff;border-color:#8bd10a55}
.industry-tab[aria-selected="true"] .industry-icon{background:#8bd10a22;color:#8bd10a}
.industry-panels{background:radial-gradient(ellipse at 100% 100%,#8bd10a12,transparent 55%),rgba(13,18,13,.94);border-color:#ffffff20;box-shadow:0 10px 30px #00000025}
.industry-description,.industry-feature p{color:#b0b8b0}
.industry-features{border-color:#ffffff20}
.industry-footer a{color:#8bd10a}

/* White Industries tabs and detail panel over the dark background. */
.industry-tab{background:#fff;border-color:#e1e5dd;color:#6b7280}
.industry-icon{background:#f3f4f6}
.industry-tab[aria-selected="true"]{background:#f0f7e5;color:#25282b;border-color:#d1e4b5}
.industry-panels{background:radial-gradient(ellipse at 100% 100%,#8bd10a15,transparent 55%),#fff;border-color:#e1e5dd;color:#25282b}
.industry-description,.industry-feature p{color:#6b7280}
.industry-features{border-color:#e5e7eb}

/* Vertical copy of the Industries grid behind Services. */
.services-showcase{position:relative;isolation:isolate;overflow:hidden}
.services-vertical-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.7}
.services-vertical-grid .grid-motion__tile{overflow:hidden;background:#151a15;border-color:#ffffff18;box-shadow:none;background-image:none}
.grid-motion__tile--vertical{position:relative}
.grid-motion__tile--vertical img{position:absolute;left:50%;top:50%;width:var(--gm-tile-h);height:var(--gm-tile-w);max-width:none;transform:translate(-50%,-50%) rotate(-90deg);object-fit:cover}

/* Fade the edge grid into a white center behind Services content. */
.services-showcase{background:#fff}
.services-vertical-grid{mask-image:linear-gradient(to right,#000 0%,#000 3%,transparent 15%,transparent 85%,#000 97%,#000 100%);-webkit-mask-image:linear-gradient(to right,#000 0%,#000 3%,transparent 15%,transparent 85%,#000 97%,#000 100%)}
.services-container{background:#fff}
.service-card{background:#fff}



/* Let the grid mask fade naturally without a rectangular content backdrop. */
.services-container{background:transparent}

/* Two service cards per row; stack on small screens. */
.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:650px){.services-grid{grid-template-columns:1fr}}

/* Full-strength grid with a narrow fade around the white Services panel. */
.services-vertical-grid{opacity:1;mask-image:none;-webkit-mask-image:none}
.services-container{background:#fff;isolation:isolate}
.services-container::before,.services-container::after{content:"";position:absolute;top:0;bottom:0;width:48px;pointer-events:none;z-index:-1}
.services-container::before{right:100%;background:linear-gradient(to right,#ffffff00,#fff)}
.services-container::after{left:100%;background:linear-gradient(to right,#fff,#ffffff00)}
@media(max-width:650px){.services-container::before,.services-container::after{width:20px}}

/* Preserve the former three-column card width within a two-column layout. */
.services-grid{max-width:792px;width:100%;margin-inline:auto}

/* Align the white panel and its fades with the narrower card grid. */
.services-container{max-width:840px}

/* Smooth the top entry into Services without fading the side grid. */
.services-vertical-grid{mask-image:linear-gradient(to bottom,transparent 0,#000 180px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 180px)}
.services-container{padding-top:24px}
@media(max-width:650px){.services-vertical-grid{mask-image:linear-gradient(to bottom,transparent 0,#000 110px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 110px)}}

/* Glass Services cards with no surrounding white panel or edge fades. */
.services-container{background:transparent;padding-top:0}
.services-container::before,.services-container::after{display:none}
.service-card{background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.8);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 8px 28px #25282b15,inset 0 1px 0 #ffffffb3}
.service-card:hover,.service-card:focus-within{background:rgba(255,255,255,.85);border-color:#8bd10a}

/* Dark Services background and white heading; glass cards stay unchanged. */
.services-showcase{background:#090c09}
.services-vertical-grid{background:#090c09}
.services-intro h2,.services-intro h2 .services-heading-accent{color:#fff}
.services-intro>p:last-child{color:#c0c7c0}

.services-intro h2,.services-intro h2 .services-heading-accent,.services-intro>p:last-child{color:#000}

/* Separate clean white heading area from the grid below. */
.services-showcase{padding-top:48px;background:linear-gradient(to bottom,#fff 0,#fff var(--services-header-end,330px),#090c09 var(--services-header-end,330px))}
.services-intro{position:relative;isolation:isolate;padding-bottom:32px;margin-bottom:40px}
.services-intro::before{content:"";position:absolute;z-index:-1;top:-48px;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:#fff}
.services-intro h2,.services-intro h2 .services-heading-accent,.services-intro>p:last-child{color:#000}
.services-vertical-grid{top:var(--services-header-end,330px);mask-image:none;-webkit-mask-image:none}
@media(max-width:650px){.services-showcase{padding-top:32px}.services-intro::before{top:-32px}}

.services-vertical-grid{opacity:.75}

/* Restore three service cards per desktop row. */
.services-container{max-width:1200px}
.services-grid{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.services-grid{grid-template-columns:1fr}}

/* Plain white Services background; card styling stays unchanged. */
.services-showcase{background:#fff}

/* Soft brand-green fades around the Services section. */
.services-showcase{background:radial-gradient(ellipse 460px 520px at 0% 38%,#8bd10a20,transparent 75%),radial-gradient(ellipse 440px 480px at 100% 76%,#8bd10a1c,transparent 75%),#fff}

/* More visible deep-green fades on both sides. */
.services-showcase{background:radial-gradient(ellipse 560px 720px at 0% 50%,#3f681b66,transparent 78%),radial-gradient(ellipse 560px 720px at 100% 50%,#3f681b66,transparent 78%),#fff}

/* Matching deep-green side gradients for Why Choose Us. */
.why-origin{background:radial-gradient(ellipse 560px 720px at 0% 50%,#3f681b66,transparent 78%),radial-gradient(ellipse 560px 720px at 100% 50%,#3f681b66,transparent 78%),#090c09}

/* One continuous Services background without the old heading panel. */
.services-intro::before{display:none}

/* Asymmetric pools of color inspired by the reference placement. */
.services-showcase{background:radial-gradient(ellipse 480px 550px at 0% 25%,#3f681b66,transparent 78%),radial-gradient(ellipse 520px 620px at 100% 78%,#3f681b55,transparent 78%),#fff}
.why-origin{background:radial-gradient(ellipse 480px 550px at 0% 24%,#3f681b66,transparent 78%),radial-gradient(ellipse 520px 620px at 100% 80%,#3f681b55,transparent 78%),#090c09}

/* Slightly brighter green glows, preserving the staggered placement. */
.services-showcase{background:radial-gradient(ellipse 480px 550px at 0% 25%,#689e2866,transparent 78%),radial-gradient(ellipse 520px 620px at 100% 78%,#689e2855,transparent 78%),#fff}
.why-origin{background:radial-gradient(ellipse 480px 550px at 0% 24%,#689e2866,transparent 78%),radial-gradient(ellipse 520px 620px at 100% 80%,#689e2855,transparent 78%),#090c09}

/* Distinct Services glow placement; Why Choose Us remains unchanged. */
.services-showcase{background:radial-gradient(ellipse 620px 440px at 88% 16%,#689e2855,transparent 78%),radial-gradient(ellipse 430px 580px at 5% 84%,#689e2866,transparent 80%),#fff}

/* Quiet green wash behind Services, with a clean white center. */
.services-showcase{background:radial-gradient(ellipse 900px 500px at 50% 100%,#8bd10a14,transparent 80%),#fff}

/* Layered green light around the cards, keeping the heading clean. */
.services-showcase{background:radial-gradient(ellipse 760px 340px at 28% 43%,#8bd10a30 0%,#8bd10a12 45%,transparent 76%),radial-gradient(ellipse 540px 420px at 86% 79%,#689e2838 0%,#8bd10a0c 55%,transparent 80%),radial-gradient(ellipse 1000px 180px at 50% 100%,#edf5e2 0%,transparent 80%),#fff}

/* Soft abstract green blend inspired by the supplied reference. */
.services-showcase{background:radial-gradient(ellipse 65% 38% at 36% 12%,#b5e78a 0%,#caeda366 58%,transparent 85%),radial-gradient(ellipse 58% 35% at 77% 62%,#b3e594b3 0%,#c8eba166 58%,transparent 88%),radial-gradient(ellipse 55% 32% at 7% 88%,#d3efa7 0%,transparent 85%),radial-gradient(ellipse 48% 30% at 93% 12%,#fffbc7 0%,transparent 85%),#eff6d5}

.services-intro h2 .services-heading-accent{color:#8bd10a}

/* Glass floating Services cards; contents and layout unchanged. */
.service-card{background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 10px 30px #25351a12,inset 0 1px 0 #ffffffcc;animation:service-card-float 6s ease-in-out infinite}
.service-card:hover,.service-card:focus-within{background:rgba(255,255,255,.72);animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.service-card{animation:none}}

/* White section entrance fading into the existing abstract greens. */
.services-showcase{background:linear-gradient(to bottom,#fff 0%,#ffffffee 8%,#ffffff80 19%,#ffffff00 34%),radial-gradient(ellipse 65% 38% at 36% 12%,#b5e78a 0%,#caeda366 58%,transparent 85%),radial-gradient(ellipse 58% 35% at 77% 62%,#b3e594b3 0%,#c8eba166 58%,transparent 88%),radial-gradient(ellipse 55% 32% at 7% 88%,#d3efa7 0%,transparent 85%),radial-gradient(ellipse 48% 30% at 93% 12%,#fffbc7 0%,transparent 85%),#eff6d5}

/* White technology marquee between Hero and Services. */
.technology-strip{background:#fff;padding:28px 0;overflow:hidden;border:0}
.technology-track{display:flex;width:max-content;animation:technology-scroll 35s linear infinite}
.technology-group{display:flex;align-items:center;gap:64px;padding-right:64px;flex-shrink:0}
.technology-logo{display:flex;align-items:center;gap:12px;white-space:nowrap;color:#343b40;font-family:Inter,Arial,sans-serif;font-size:19px;font-weight:600}
.technology-logo img{width:32px;height:32px;object-fit:contain}
@keyframes technology-scroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.technology-track{animation:none}.technology-strip{overflow-x:auto}}

/* More breathing room below the hero before the technology logos. */
.technology-strip{padding-top:60px;padding-bottom:32px}

.technology-title{text-align:center;font:500 16px/1.4 Inter,Arial,sans-serif;letter-spacing:.3px;color:#6b7280;margin:0 0 28px}

/* Optional lamp decoration, isolated for easy removal. */
.lamp-glow{position:absolute;top:0;left:50%;width:72%;height:95px;transform:translateX(-50%);pointer-events:none;background:conic-gradient(from 90deg at 50% 0%,transparent 0deg,#8bd10a00 40deg,#8bd10a26 70deg,#8bd10a00 90deg,transparent 180deg);filter:blur(5px);opacity:.8}
.lamp-glow::before{content:"";position:absolute;top:1px;left:19%;width:62%;height:2px;background:#8bd10a;border-radius:999px;box-shadow:0 2px 10px #8bd10a80,0 6px 24px #8bd10a55}

/* Dedicated space for the saved lamp beneath the Why Origin heading. */
.wo-header{margin-bottom:28px}.wo-lamp-stage{position:relative;height:130px;margin:0 auto 20px;max-width:800px}.wo-lamp-stage .lamp-glow{width:100%;height:125px;background:radial-gradient(ellipse at 50% 0%,#8bd10a45,transparent 72%);opacity:1}.wo-lamp-stage .lamp-glow::before{left:25%;width:50%;height:3px}
@media(max-width:650px){.wo-lamp-stage{height:100px;margin-bottom:12px}.wo-lamp-stage .lamp-glow{height:95px}}

/* Crisp Services-only presentation with aligned artwork. */
.services-showcase{background:radial-gradient(ellipse 1100px 420px at 50% 0%,#8bd10a12,transparent 78%),#fff}
.services-grid>.service-card{background:#fff;border:1px solid #e2e7dc;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:0 6px 20px #24351b0a;grid-template-rows:64px 145px 245px;padding:28px 28px 20px}
.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{background:#fff;border-color:#8bd10a;box-shadow:0 10px 26px #24351b12}
.service-card h3{height:64px;display:flex;align-items:center;justify-content:center;align-self:start}
.service-card>p{color:#454d43;margin:14px 0 18px}
.service-card>.service-agent-art,.service-card>.service-app-workflow,.service-card>.service-custom-app,.service-card>.service-management-summary,.service-card-restored-art>.service-art{grid-row:3;align-self:end;width:100%;height:225px;margin:0;background:#fff}
.service-card-restored-art>.service-art{display:grid}
.service-card .service-art{background:#fff}
.service-card .service-agent-art svg,.service-card .service-app-workflow svg,.service-card .service-custom-app svg,.service-card .service-management-summary svg{width:100%;height:225px;display:block}
@media(max-width:650px){.services-grid>.service-card{padding:24px;grid-template-rows:64px 145px 225px}}

/* White breathing room and a seamless entry from the technology strip. */
.technology-strip{padding-bottom:72px}
.services-showcase{padding-top:64px;background:linear-gradient(to bottom,#fff 0,#ffffff00 240px),radial-gradient(ellipse 1100px 420px at 50% 100px,#8bd10a12,transparent 78%),#fff}
@media(max-width:650px){.technology-strip{padding-bottom:48px}.services-showcase{padding-top:48px}}

/* Sidebar builds at center, docks left, then opens its app views. */
.management-app-art .ma-brand{font-size:8px;fill:#fff}
.management-app-art .ma-nav-labels text{font-size:9px;fill:#fff;font-weight:600}
.management-app-art .ma-sidebar-build{animation:ma-sidebar-intro 18s ease-in-out infinite}
.management-app-art .ma-shell,.management-app-art .ma-panels-build{animation:ma-panels-intro 18s ease infinite}
.management-app-art .ma-nav-labels text{animation:ma-label-intro 18s ease infinite}
.management-app-art .ma-nav-labels text:nth-child(2){animation-name:ma-label-two}
.management-app-art .ma-nav-labels text:nth-child(3){animation-name:ma-label-three}
.management-app-art .ma-view,.management-app-art .ma-tab{animation-duration:18s;animation-delay:0s}
.management-app-art .ma-inbox{animation-name:ma-inbox-stage}.management-app-art .ma-customers{animation-name:ma-customers-stage}.management-app-art .ma-dashboard{animation-name:ma-dashboard-stage}
.management-app-art .ma-tab-inbox{animation-name:ma-inbox-stage}.management-app-art .ma-tab-customers{animation-name:ma-customers-stage}.management-app-art .ma-tab-dashboard{animation-name:ma-dashboard-stage}
.management-app-art .ma-cursor{animation:ma-new-cursor 18s ease infinite}
@keyframes ma-sidebar-intro{0%{opacity:0;transform:translateX(120px) scale(.9)}6%,20%{opacity:1;transform:translateX(120px) scale(1)}30%,95%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(0)}}
@keyframes ma-panels-intro{0%,25%{opacity:0;transform:translateX(12px)}33%,95%{opacity:1;transform:translateX(0)}100%{opacity:0}}
@keyframes ma-label-intro{0%,5%{opacity:0;transform:translateY(6px)}10%,95%{opacity:1;transform:translateY(0)}100%{opacity:0}}
@keyframes ma-label-two{0%,14%{opacity:0;transform:translateY(6px)}19%,95%{opacity:1;transform:translateY(0)}100%{opacity:0}}
@keyframes ma-label-three{0%,10%{opacity:0;transform:translateY(6px)}15%,95%{opacity:1;transform:translateY(0)}100%{opacity:0}}
@keyframes ma-inbox-stage{0%,28%{opacity:0}34%,49%{opacity:1}53%,100%{opacity:0}}
@keyframes ma-customers-stage{0%,51%{opacity:0}56%,70%{opacity:1}74%,100%{opacity:0}}
@keyframes ma-dashboard-stage{0%,72%{opacity:0}77%,94%{opacity:1}100%{opacity:0}}
@keyframes ma-new-cursor{0%,29%,100%{opacity:0;transform:translate(82px,103px)}34%,49%{opacity:1;transform:translate(82px,103px)}56%,70%{opacity:1;transform:translate(82px,163px)}77%,94%{opacity:1;transform:translate(82px,133px)}}
@media(prefers-reduced-motion:reduce){.management-app-art .ma-sidebar-build,.management-app-art .ma-shell,.management-app-art .ma-panels-build,.management-app-art .ma-nav-labels text{animation:none!important;opacity:1;transform:none}.management-app-art .ma-dashboard{opacity:1}}

/* Sidebar labels pop into place in Inbox, Customers, Dashboard order. */
.management-app-art .ma-sidebar-build{transform-origin:58px 125px}
.management-app-art .ma-nav-labels text:nth-child(2){animation-name:ma-label-three}
.management-app-art .ma-nav-labels text:nth-child(3){animation-name:ma-label-two}
@keyframes ma-sidebar-intro{0%{opacity:0;transform:translateX(120px) scale(.65)}6%{opacity:1;transform:translateX(120px) scale(1.05)}10%{transform:translate(120px,-3px) scale(1)}16%{transform:translate(120px,2px) scale(1)}20%{transform:translate(120px,-2px) scale(1)}30%,95%{opacity:1;transform:translateX(0) scale(1)}100%{opacity:0;transform:translateX(0) scale(1)}}
@keyframes ma-label-intro{0%,5%{opacity:0;transform:translateY(7px) scale(.85)}9%{opacity:1;transform:translateY(-2px) scale(1.04)}12%,95%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0}}
@keyframes ma-label-three{0%,10%{opacity:0;transform:translateY(7px) scale(.85)}14%{opacity:1;transform:translateY(-2px) scale(1.04)}17%,95%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0}}
@keyframes ma-label-two{0%,14%{opacity:0;transform:translateY(7px) scale(.85)}18%{opacity:1;transform:translateY(-2px) scale(1.04)}21%,95%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0}}
@keyframes ma-new-cursor{0%,29%,100%{opacity:0;transform:translate(82px,103px)}34%,49%{opacity:1;transform:translate(82px,103px)}56%,70%{opacity:1;transform:translate(82px,133px)}77%,94%{opacity:1;transform:translate(82px,163px)}}

/* Faster docking, followed by a small right-panel pop. */
.management-app-art .ma-panels-build,.management-app-art .ma-shell{transform-origin:220px 126px}
@keyframes ma-sidebar-intro{0%{opacity:0;transform:translateX(120px) scale(.65)}6%{opacity:1;transform:translateX(120px) scale(1.05)}10%{transform:translate(120px,-3px) scale(1)}16%{transform:translate(120px,2px) scale(1)}20%{transform:translate(120px,-2px) scale(1)}24%,95%{opacity:1;transform:translateX(0) scale(1)}100%{opacity:0;transform:translateX(0) scale(1)}}
@keyframes ma-panels-intro{0%,21%{opacity:0;transform:translateX(10px) scale(.88)}26%{opacity:1;transform:translateX(0) scale(1.025)}29%,95%{opacity:1;transform:translateX(0) scale(1)}100%{opacity:0}}
@keyframes ma-inbox-stage{0%,23%{opacity:0}28%,49%{opacity:1}53%,100%{opacity:0}}

/* Faster Management Systems sequence across all three views. */
.management-app-art .ma-sidebar-build,.management-app-art .ma-shell,.management-app-art .ma-panels-build,.management-app-art .ma-nav-labels text,.management-app-art .ma-view,.management-app-art .ma-tab,.management-app-art .ma-cursor{animation-duration:12s}

.management-app-art .ma-sidebar-build,.management-app-art .ma-shell,.management-app-art .ma-panels-build,.management-app-art .ma-nav-labels text,.management-app-art .ma-view,.management-app-art .ma-tab,.management-app-art .ma-cursor{animation-duration:8s}

.service-card h3{transition:color .25s ease}.service-card:hover h3,.service-card:focus-within h3{color:#8bd10a}

.service-card h3{transition:color .25s ease,transform .3s cubic-bezier(.2,.8,.2,1);transform-origin:center}.service-card:hover h3,.service-card:focus-within h3{transform:scale(1.04)}@media(prefers-reduced-motion:reduce){.service-card h3{transition:none}.service-card:hover h3,.service-card:focus-within h3{transform:none}}

.technology-strip{padding-top:84px}

/* Services cards retain their clean white background. */

/* Full-strength Why Origin lamp light. */
.wo-lamp-stage .lamp-glow{opacity:1;background:radial-gradient(ellipse at 50% 0%,#8bd10a 0%,#8bd10a80 30%,transparent 72%)}
.wo-lamp-stage .lamp-glow::before{opacity:1;background:#8bd10a;box-shadow:0 2px 12px #8bd10a,0 8px 28px #8bd10a}

/* Balance the logo strip between Hero and Services. */
.technology-strip{padding-bottom:36px}
.services-showcase{padding-top:48px}
@media(max-width:650px){.technology-strip{padding-bottom:36px}.services-showcase{padding-top:48px}}

/* Conic lamp beams and a concentrated light pool, adapted from LampContainer. */
.wo-lamp-stage{height:200px;max-width:960px;margin-bottom:24px}
.wo-lamp-stage .lamp-glow{position:absolute;inset:0;width:100%;height:100%;transform:none;background:none;filter:none;opacity:1}
.wo-lamp-stage .lamp-glow::before{display:none}
.lamp-beam{position:absolute;top:26px;width:50%;height:170px;mask-image:linear-gradient(to bottom,#000,transparent);-webkit-mask-image:linear-gradient(to bottom,#000,transparent)}
.lamp-beam-left{right:50%;background:conic-gradient(from 70deg at center top,#8bd10a,transparent 55%,transparent)}
.lamp-beam-right{left:50%;background:conic-gradient(from 290deg at center top,transparent,transparent 45%,#8bd10a)}
.lamp-pool{position:absolute;top:24px;left:50%;width:48%;height:105px;transform:translateX(-50%);background:#8bd10a;filter:blur(40px);opacity:.65;border-radius:50%}
.lamp-bar{position:absolute;left:19%;top:25px;width:62%;height:3px;background:#8bd10a;box-shadow:0 0 10px #8bd10a66}
@media(max-width:650px){.wo-lamp-stage{height:150px}.lamp-beam{height:130px}.lamp-pool{height:75px;filter:blur(28px)}}

/* Heading sits within the light falling from the lamp above. */
.wo-lamp-stage{margin-bottom:-105px}.wo-header{position:relative;z-index:1;padding-top:0;margin-bottom:48px}@media(max-width:650px){.wo-lamp-stage{margin-bottom:-75px}}

.wo-label-above{text-align:center;margin-bottom:20px;position:relative;z-index:2}
.wo-lamp-stage{margin-bottom:-145px;mask-image:radial-gradient(ellipse at 50% 22%,#000 25%,#000 50%,transparent 85%);-webkit-mask-image:radial-gradient(ellipse at 50% 22%,#000 25%,#000 50%,transparent 85%)}
.wo-header h2{margin-top:0}
@media(max-width:650px){.wo-lamp-stage{margin-bottom:-110px}}

.wo-lamp-stage{margin-bottom:-129px}@media(max-width:650px){.wo-lamp-stage{margin-bottom:-94px}}

.wo-header h2 .section-heading-accent{color:#fff}

/* Why Origin: illuminated introduction left, bento cards right. */
.wo-container{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);column-gap:48px;align-items:start}
.wo-label-above{grid-column:1;grid-row:1;text-align:left;margin-bottom:20px}
.wo-lamp-stage{grid-column:1;grid-row:2;width:100%;max-width:none}
.wo-header{grid-column:1;grid-row:3;text-align:left;margin-bottom:0}
.wo-header h2{font-size:var(--section-heading-size);max-width:430px}
.wo-header>p{margin:0;max-width:420px}
.wo-grid{grid-column:2;grid-row:1 / span 4;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.wo-grid .wo-wide{grid-column:span 2}
.wo-card{padding:20px;min-height:330px}
.wo-card .wo-copy{left:20px;right:20px}
.wo-footer{grid-column:1 / -1;grid-row:5}
@media(max-width:1000px){.wo-container{display:block}.wo-label-above,.wo-header{text-align:center}.wo-header h2,.wo-header>p{margin-inline:auto}.wo-lamp-stage{max-width:800px}.wo-header{margin-bottom:40px}.wo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.wo-grid{grid-template-columns:1fr}.wo-grid .wo-wide{grid-column:auto}}

/* Center the illuminated intro within the left column. */
.wo-label-above,.wo-header{text-align:center}
.wo-header h2,.wo-header>p{margin-inline:auto}
.wo-lamp-stage{justify-self:center;margin-bottom:-100px;mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,#000 42%,transparent 76%);-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 20%,#000 42%,transparent 76%)}
@media(max-width:650px){.wo-lamp-stage{margin-bottom:-70px}}

/* Keep only the lower-right glow in Why Choose Us. */
.why-origin{background:radial-gradient(ellipse 520px 620px at 100% 80%,#689e2855,transparent 78%),#090c09}

/* Soft lamp bar instead of a sharp top line. */
.wo-lamp-stage .lamp-bar{background:linear-gradient(to right,transparent,#8bd10a80 25%,#8bd10a80 75%,transparent);opacity:.45;filter:blur(2px);box-shadow:0 0 12px #8bd10a55}

/* Reveal the lamp only from the bar downward; no glow above it. */
.wo-lamp-stage .lamp-glow{clip-path:inset(25px 0 0 0)}
.wo-lamp-stage .lamp-bar{background:#8bd10a;opacity:1;filter:none;box-shadow:0 0 10px #8bd10a66;mask-image:none;-webkit-mask-image:none}

/* Soft off-white lamp and brand-green Businesses. */
.wo-lamp-stage .lamp-beam-left{background:conic-gradient(from 70deg at center top,#e8e8e5,transparent 55%,transparent)}
.wo-lamp-stage .lamp-beam-right{background:conic-gradient(from 290deg at center top,transparent,transparent 45%,#e8e8e5)}
.wo-lamp-stage .lamp-pool{background:radial-gradient(ellipse,#f2f2ee 0%,#dfdfdb 48%,transparent 78%);opacity:.72;filter:blur(30px)}
.wo-lamp-stage .lamp-bar{background:#fff;box-shadow:0 0 10px #ffffff66}
.wo-header h2 .wo-business-accent{color:#8bd10a}

/* One vertical image column along the left edge of Why Origin. */
.why-origin{position:relative;overflow:hidden}
.wo-container{position:relative;z-index:1}
.wo-image-column{position:absolute;left:clamp(20px,3vw,56px);top:0;bottom:0;width:clamp(140px,19vw,280px);overflow:hidden;opacity:.3;pointer-events:none;mask-image:linear-gradient(to right,#000,transparent);-webkit-mask-image:linear-gradient(to right,#000,transparent)}
.wo-image-column-track{animation:wo-column-scroll 100s linear infinite;will-change:transform}
.wo-image-column-group{display:flex;flex-direction:column;gap:16px;padding-bottom:16px}
.wo-image-column-group img{display:block;width:100%;aspect-ratio:1.33;object-fit:cover;border-radius:16px}
@keyframes wo-column-scroll{to{transform:translateY(-50%)}}
@media(prefers-reduced-motion:reduce){.wo-image-column-track{animation:none}}

/* Temporarily hide the Why Origin light bar. */
.wo-lamp-stage .lamp-bar{visibility:hidden}

/* Intro placement while the reusable lamp is detached. */
.wo-header{grid-row:2}


/* Restore the Why Origin lamp and introduction placement. */
.wo-lamp-stage .lamp-bar{visibility:visible}
.wo-header{grid-row:3}


/* Intro placement with the image column and no lamp. */
.wo-header{grid-row:2}

/* Alternate dark and white cards across the first two Why Origin rows. */
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)){background:#fff;color:#202620;border-color:#e2e7dc;box-shadow:0 8px 24px #00000014}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)):hover,.why-origin .wo-card:is(:nth-child(2),:nth-child(3)):focus-visible{border-color:#8bd10a}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-copy p{color:#505950}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-chat p{background:#f4f6f2;border-color:#e2e7dc;color:#303830}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-chat i{background:#eef2e9;color:#42513c}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-chat small{color:#657061}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-chat>div:last-child p{background:#f0f7e5;border-color:#d8e8bc}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets>div{background:#f5f7f2;border-color:#e2e7dc;color:#394239}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets b{color:#527d08;background:#eaf4d8}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets .wo-progress{background:transparent;border-color:#b6d882}

.wo-card:nth-child(3) .wo-chart-caption,.wo-card:nth-child(3) .wo-chart-labels{color:#596350}
.wo-card:nth-child(3) .wo-bars{border-bottom-color:#dce3d5}

/* Full-card photography; the original illustrations remain saved and hidden. */
.services-grid>.service-card{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;min-height:474px;padding:28px;text-align:left;background:#151b17;color:#fff}
.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{background:#151b17}
.services-grid>.service-card>.service-art,.services-grid>.service-card>.service-agent-art,.services-grid>.service-card>.service-app-workflow,.services-grid>.service-card>.service-custom-app,.services-grid>.service-card>.service-management-summary{display:none}
.service-card>.service-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.services-grid>.service-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#080e1208 10%,#080e1260 42%,#080e12eb 100%);z-index:-1;pointer-events:none}
.services-grid>.service-card>h3{align-self:auto;min-height:0;color:#fff;margin:0 0 16px}
.services-grid>.service-card>p{align-self:auto;margin:0;color:#e5e9e5;font-size:16px;line-height:1.55}
.services-grid>.service-card:hover>h3{color:#8bd10a}
@media(max-width:650px){.services-grid>.service-card{min-height:430px;padding:24px}}

/* Scroll-driven Origin approach: a fixed headline behind rising process cards. */
.origin-journey{position:relative;height:260vh;background:#090c09;color:#fff}
.journey-sticky{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 60%,#8bd10a06,transparent 65%)}
.journey-kicker{position:absolute;top:96px;left:0;right:0;text-align:center;font-size:12px;letter-spacing:.2em;color:#a7b09f}
.journey-title{position:absolute;left:5%;right:5%;top:30%;margin:0;font-size:clamp(64px,10.8vw,166px);line-height:.95;font-weight:500;letter-spacing:-.065em;z-index:0;will-change:transform}
.journey-title span{display:block;text-align:right;font-family:inherit;font-weight:inherit;font-style:normal;color:#8bd10a;opacity:.75;margin-top:12px}
.journey-layer{position:absolute;inset:0;z-index:1;pointer-events:none}
.journey-card{position:absolute;width:clamp(220px,23vw,320px);padding:28px;border:1px solid #ffffff24;border-radius:26px;background:linear-gradient(145deg,#343a30f5,#151a16fa);box-shadow:0 20px 60px #0005,inset 0 1px 0 #ffffff14;will-change:transform}
.journey-card-0{left:22%;top:17%}.journey-card-1{right:8%;top:40%}.journey-card-2{left:10%;top:70%}.journey-card-3{right:24%;top:106%}
.journey-card svg{width:56px;height:56px;fill:none;stroke:#a8ca75;stroke-width:1.3;margin-bottom:20px}
.journey-number{position:absolute;right:25px;top:27px;color:#8bd10a;font-size:12px;letter-spacing:.1em}
.journey-card h3{font-size:21px;line-height:1.2;letter-spacing:-.025em;margin:0 0 12px}.journey-card p{font-size:14px;line-height:1.55;color:#b4bcb0;margin:0}.journey-card-tag{display:block;margin-top:22px;text-transform:uppercase;font-size:10px;letter-spacing:.17em;color:#818e76}
.journey-token{position:absolute;left:54%;top:77%;width:128px;height:128px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:25px;background:#8bd10a;color:#142008;font-size:29px;font-weight:700;box-shadow:0 16px 40px #0004;transform:rotate(-6deg)}.journey-token span{font-size:9px;margin-top:10px}
.journey-mini{position:absolute;left:29%;top:146%;width:210px;padding:22px;background:#242b21;border:1px solid #ffffff25;border-radius:24px}.journey-mini>span{font-size:12px;color:#b5c2ac}.journey-mini svg{width:100%;height:70px;fill:none;stroke:#8bd10a;stroke-width:2;margin:16px 0}.journey-mini b{font-size:14px}
.journey-scroll-hint{position:absolute;bottom:28px;left:5%;font-size:10px;letter-spacing:.17em;color:#899281}.journey-scroll-hint span{margin-left:16px;color:#8bd10a}
@media(max-width:700px){.origin-journey{height:240vh}.journey-sticky{min-height:560px}.journey-title{top:35%;font-size:clamp(54px,12vw,84px)}.journey-card{width:44%;padding:18px;border-radius:19px}.journey-card h3{font-size:17px}.journey-card p{font-size:12px}.journey-card svg{width:40px;height:40px;margin-bottom:12px}.journey-card-0{left:5%;top:20%}.journey-card-1{right:5%;top:55%}.journey-card-2{left:5%;top:94%}.journey-card-3{right:5%;top:132%}.journey-token{left:64%;top:15%;width:96px;height:96px;font-size:23px}.journey-mini{left:8%;top:174%;width:170px}.journey-kicker{top:85px}}
@media(prefers-reduced-motion:reduce){.origin-journey{height:auto;padding:70px 20px}.journey-sticky{position:relative;height:auto;min-height:0;overflow:visible}.journey-kicker,.journey-title{position:static}.journey-title{font-size:clamp(50px,8vw,110px);margin:30px 0 45px}.journey-layer{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.journey-card{position:static;width:auto;transform:none!important}.journey-token,.journey-mini,.journey-scroll-hint{display:none}}

/* Faster scroll travel, with independent idle floating on each layer. */
.origin-journey{height:175vh}
.journey-layer>[data-journey-speed]{animation:journey-float 4.8s ease-in-out infinite}
.journey-card-1{animation-delay:-1.2s!important}.journey-card-2{animation-delay:-2.4s!important}.journey-card-3{animation-delay:-3.6s!important}
.journey-token{animation-delay:-1.8s!important}.journey-mini{animation-delay:-3s!important}
.journey-title{animation:journey-float 6s ease-in-out infinite;animation-delay:-2s}
@keyframes journey-float{0%,100%{translate:0 0}50%{translate:0 -14px}}
@media(max-width:700px){.origin-journey{height:185vh}}
@media(prefers-reduced-motion:reduce){.origin-journey{height:auto}.journey-layer>[data-journey-speed],.journey-title{animation:none}}

/* A shared visual language links the partnership section to the journey. */
.why-origin{padding-top:110px;padding-bottom:0;background:radial-gradient(ellipse 700px 650px at 100% 48%,#8bd10a09,transparent 78%),#090c09}
.wo-container{column-gap:64px;row-gap:0;align-items:start}
.wo-label-above{text-align:left;margin:0 0 26px}
.wo-label-above .wo-label{border:0;border-radius:0;padding:0;background:none;color:#a7b09f;font-size:12px;letter-spacing:.2em}
.wo-header{text-align:left;grid-row:2;margin:0}
.wo-header h2{margin:0 0 28px;max-width:430px;line-height:1.12;letter-spacing:-.045em}
.wo-header>p{margin:0;max-width:350px;font-size:18px;line-height:1.7;color:#a7b09f}
.wo-grid{gap:22px}
.why-origin .wo-card{border-radius:26px;background:linear-gradient(145deg,#30362cf5,#151a16fa);border-color:#ffffff24;box-shadow:0 20px 50px #0003,inset 0 1px 0 #ffffff12;min-height:350px;padding-top:40px}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)){background:linear-gradient(145deg,#fff,#f1f4ec);border-color:#e2e7dc;box-shadow:0 20px 50px #0002}
.wo-card-index{position:absolute;right:22px;top:16px;color:#8bd10a;font-size:11px;letter-spacing:.12em}
.wo-card:is(:nth-child(2),:nth-child(3)) .wo-card-index{color:#527d08}
.wo-card .wo-copy{top:228px}
.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{top:42px}
.wo-footer{margin-top:52px;text-align:left;grid-column:1;grid-row:3;align-self:start}
.wo-footer p{font-size:12px;max-width:300px;color:#899281;line-height:1.6}
.wo-journey-bridge{grid-column:1/-1;grid-row:6;display:flex;flex-direction:column;align-items:center;text-align:center;padding:90px 0 30px}
.wo-bridge-line{display:block;width:1px;height:85px;background:linear-gradient(transparent,#8bd10a70);position:relative}
.wo-bridge-line::after{content:"";position:absolute;bottom:0;left:-3px;width:7px;height:7px;border-radius:50%;background:#8bd10a;box-shadow:0 0 18px #8bd10a50}
.wo-journey-bridge p{color:#899281;font-size:20px;line-height:1.5;letter-spacing:-.02em;margin:26px 0 20px}.wo-journey-bridge strong{color:#e5eadf;font-weight:500}
.wo-journey-bridge a{display:grid;place-items:center;width:42px;height:42px;border:1px solid #ffffff25;border-radius:50%;color:#8bd10a;text-decoration:none;transition:background .2s}.wo-journey-bridge a:hover{background:#8bd10a16}
@media(max-width:1000px){.wo-label-above,.wo-header,.wo-footer{text-align:center}.wo-header h2,.wo-header>p,.wo-footer p{margin-inline:auto}.wo-header{margin-bottom:44px}.wo-journey-bridge{padding-top:60px}}
@media(max-width:650px){.why-origin{padding-top:70px}.wo-header>p{font-size:16px}.wo-journey-bridge p{font-size:18px}}
@media(hover:none){.wo-card .wo-copy,.wo-card:hover .wo-copy,.wo-card:focus .wo-copy{position:relative;top:auto}.why-origin .wo-card{min-height:350px}}

/* Floating partnership composition, leading into the scroll-driven journey. */
.why-origin{padding-top:100px;background:radial-gradient(ellipse 700px 550px at 50% 48%,#8bd10a08,transparent 80%),#090c09}
.wo-container{display:flex;flex-direction:column;align-items:center;max-width:1240px}
.wo-label-above{text-align:center;margin-bottom:28px}
.wo-header{text-align:center;max-width:920px;margin:0 auto 72px}
.wo-header h2{max-width:920px;margin:0 auto 24px;font-size:clamp(44px,6.3vw,88px);font-weight:500;line-height:1.04;letter-spacing:-.055em}
.wo-header h2 .wo-business-accent{color:#8bd10a}
.wo-header>p{max-width:520px;margin:auto;color:#a7b09f;font-size:18px;line-height:1.6}
.wo-grid{display:grid;width:100%;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px;align-items:start;padding:20px 0 45px}
.why-origin .wo-grid>.wo-card{grid-column:span 2;min-height:350px;border-radius:28px;background:linear-gradient(145deg,#30362cf5,#151a16fa);color:#fff;border:1px solid #ffffff24;box-shadow:0 24px 60px #0004,inset 0 1px 0 #ffffff14;animation:wo-orbit-float 6s ease-in-out infinite;will-change:transform;transition:border-color .25s,box-shadow .25s;transform:rotate(var(--wo-tilt,0deg))}
.why-origin .wo-grid>.wo-card:nth-child(1){margin-top:48px;--wo-tilt:-3deg;animation-delay:-1s}
.why-origin .wo-grid>.wo-card:nth-child(2){margin-top:0;--wo-tilt:2deg;animation-delay:-3s}
.why-origin .wo-grid>.wo-card:nth-child(3){margin-top:65px;--wo-tilt:-2deg;animation-delay:-4.5s}
.why-origin .wo-grid>.wo-card:nth-child(4){grid-column:2/span 2;margin-top:-12px;--wo-tilt:2deg;animation-delay:-2s}
.why-origin .wo-grid>.wo-card:nth-child(5){grid-column:4/span 2;margin-top:24px;--wo-tilt:-2deg;animation-delay:-5s}
.why-origin .wo-grid>.wo-card:hover,.why-origin .wo-grid>.wo-card:focus-within{animation-play-state:paused;border-color:#8bd10a80;box-shadow:0 28px 65px #0005,0 0 24px #8bd10a09}
.why-origin .wo-card .wo-copy p{color:#b4bcb0}
.why-origin .wo-card .wo-card-index{color:#8bd10a}
.why-origin .wo-card .wo-chat p{background:#ffffff09;border-color:#ffffff15;color:#e5e7eb}
.why-origin .wo-card .wo-chat i{background:#ffffff14;color:#dce4d5}
.why-origin .wo-card .wo-chat small{color:#9ba693}
.why-origin .wo-card .wo-chat>div:last-child p{background:#8bd10a0c;border-color:#8bd10a30}
.why-origin .wo-card .wo-tickets>div{background:#ffffff05;border-color:#ffffff12;color:#cdd2cd}
.why-origin .wo-card .wo-tickets b{background:#8bd10a16;color:#b0e55b}
.why-origin .wo-card .wo-tickets .wo-progress{background:transparent;border-color:#8bd10a40}
.why-origin .wo-card .wo-chart-caption,.why-origin .wo-card .wo-chart-labels{color:#aeb4ae}
.why-origin .wo-card .wo-bars{border-bottom-color:#ffffff18}
.wo-footer{text-align:center;margin:42px auto 0}.wo-footer p{max-width:none;margin-inline:auto}
.wo-journey-bridge{padding-top:42px;padding-bottom:15px}
@keyframes wo-orbit-float{0%,100%{transform:translateY(0) rotate(var(--wo-tilt,0deg))}50%{transform:translateY(-18px) rotate(calc(var(--wo-tilt,0deg) + 1deg))}}
@media(max-width:1000px){.wo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.why-origin .wo-grid>.wo-card:nth-child(n){grid-column:auto;margin-top:0}.why-origin .wo-grid>.wo-card:nth-child(even){margin-top:36px}.why-origin .wo-grid>.wo-card:last-child{grid-column:1/-1;max-width:480px;width:100%;justify-self:center}.wo-header{margin-bottom:48px}}
@media(max-width:650px){.why-origin{padding-top:72px}.wo-grid{grid-template-columns:1fr;gap:34px;padding-inline:10px}.why-origin .wo-grid>.wo-card:nth-child(n){grid-column:1;margin-top:0;width:100%;max-width:none;--wo-tilt:0deg;min-height:350px}.wo-header h2{font-size:44px}.wo-header>p{font-size:16px}.wo-footer{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.why-origin .wo-grid>.wo-card{animation:none;transform:none;will-change:auto}}

/* Scroll entrances use translate/scale independently of the floating transform. */
.why-origin.wo-scroll-motion .wo-card.wo-reveal{opacity:var(--wo-enter-opacity,1);translate:var(--wo-enter-x,0px) var(--wo-enter-y,0px);scale:var(--wo-enter-scale,1);transition:translate .3s ease-out,scale .3s ease-out,opacity .3s ease-out,border-color .25s,box-shadow .25s}
.why-origin.wo-scroll-motion .wo-card .wo-art{clip-path:inset(0 calc((1 - var(--wo-art-reveal,1)) * 100%) 0 0);transition:clip-path .35s ease-out,opacity .35s,transform .35s}
@media(prefers-reduced-motion:reduce){.why-origin.wo-scroll-motion .wo-card.wo-reveal{opacity:1;translate:none;scale:1;transition:none}.why-origin.wo-scroll-motion .wo-card .wo-art{clip-path:none;transition:none}}

/* JavaScript provides the same exponential ease-out as the Approach scene. */
.why-origin.wo-scroll-motion .wo-card.site-flight-layer{translate:0 0;transition:scale .3s ease-out,opacity .3s ease-out,border-color .25s,box-shadow .25s}
@media(prefers-reduced-motion:reduce){.site-flight-layer{translate:none!important}}

/* Keep the Approach heading stationary; only its cards float. */
.journey-title{animation:none;will-change:auto}

/* Why Origin starts fully visible in place; scrolling only moves cards upward. */
.why-origin .wo-header{margin-bottom:32px}
.why-origin .wo-grid{padding-top:0}
.why-origin .wo-grid>.wo-card.wo-reveal{opacity:1;translate:0 0;scale:1;animation:none;transform:rotate(var(--wo-tilt,0deg));transition:border-color .25s,box-shadow .25s}
.why-origin .wo-card .wo-art{clip-path:none}
@media(prefers-reduced-motion:reduce){.why-origin .wo-grid>.wo-card.wo-reveal{transform:none}}

/* A text-only opening, then a short card arrival before the original flight. */
.origin-journey{height:175vh}
@media(max-width:700px){.origin-journey{height:185vh}}
@media(prefers-reduced-motion:reduce){.origin-journey{height:auto}}

/* Restore the original split Why Origin layout, retaining card scroll parallax. */
.why-origin{padding:96px var(--gutter);background:radial-gradient(ellipse 520px 620px at 100% 80%,#689e2855,transparent 78%),#090c09}
.why-origin .wo-container{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);column-gap:48px;row-gap:0;align-items:start;max-width:1200px;margin:auto}
.why-origin .wo-label-above{grid-column:1;grid-row:1;text-align:center;margin:0 0 20px}
.why-origin .wo-label{display:inline-block;padding:8px 16px;border:1px solid #8bd10a40;border-radius:999px;background:#8bd10a05;color:#8bd10a;font-size:12px;letter-spacing:.1em}
.why-origin .wo-header{grid-column:1;grid-row:2;text-align:center;margin:0}
.why-origin .wo-header h2{font-size:var(--section-heading-size);font-weight:700;line-height:1.15;letter-spacing:-.035em;max-width:430px;margin:0 auto 24px}
.why-origin .wo-header>p{max-width:420px;margin:auto;font-size:18px;line-height:1.5}
.why-origin .wo-grid{grid-column:2;grid-row:1/span 4;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0;width:100%}
.why-origin .wo-grid>.wo-card:nth-child(n){grid-column:auto;margin:0;min-height:330px;max-width:none;width:auto;padding:20px;border-radius:24px;--wo-tilt:0deg;animation:none;transform:none;background:rgba(13,18,13,.9);color:#fff;border-color:#ffffff12;box-shadow:inset 0 1px 20px #8bd10a04}
.why-origin .wo-grid>.wo-card:last-child{grid-column:1/-1;width:auto;justify-self:stretch}
.why-origin .wo-grid>.wo-card:is(:nth-child(2),:nth-child(3)){background:#fff;color:#202620;border-color:#e2e7dc;box-shadow:0 8px 24px #00000014}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)) .wo-copy p{color:#505950}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets>div{background:#f5f7f2;border-color:#e2e7dc;color:#394239}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets b{color:#527d08;background:#eaf4d8}
.why-origin .wo-card:is(:nth-child(2),:nth-child(3)) .wo-tickets .wo-progress{background:transparent;border-color:#b6d882}
.why-origin .wo-card:nth-child(3) .wo-chart-caption,.why-origin .wo-card:nth-child(3) .wo-chart-labels{color:#596350}
.why-origin .wo-card:nth-child(3) .wo-bars{border-bottom-color:#dce3d5}
.why-origin .wo-card .wo-copy{top:214px}
.why-origin .wo-card:hover .wo-copy,.why-origin .wo-card:focus .wo-copy{top:28px}
.why-origin .wo-footer{grid-column:1/-1;grid-row:5;text-align:center;margin:40px auto 0}
@media(max-width:1000px){.why-origin .wo-container{display:block}.why-origin .wo-header{margin-bottom:40px}.why-origin .wo-image-column{opacity:.15}}
@media(max-width:650px){.why-origin{padding:64px var(--gutter)}.why-origin .wo-grid{grid-template-columns:1fr}.why-origin .wo-grid>.wo-card:nth-child(n){grid-column:1;min-height:330px}.why-origin .wo-header>p{font-size:16px}}
@media(hover:none){.why-origin .wo-card .wo-copy,.why-origin .wo-card:hover .wo-copy,.why-origin .wo-card:focus .wo-copy{position:relative;top:auto}}

/* Stationary heading and one deck position; scrolling advances card pairs. */
.why-origin.wo-pinned-sequence{height:300svh;padding-top:0;padding-bottom:0;overflow:clip}
.why-origin.wo-pinned-sequence .wo-container{position:sticky;top:64px;height:calc(100svh - 64px);min-height:490px;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);grid-template-rows:auto auto auto;align-content:center;column-gap:48px}
.why-origin.wo-pinned-sequence .wo-label-above{grid-column:1;grid-row:1}
.why-origin.wo-pinned-sequence .wo-header{grid-column:1;grid-row:2;margin:0}
.why-origin.wo-pinned-sequence .wo-footer{grid-column:1;grid-row:3;margin:28px 0 0}
.why-origin.wo-pinned-sequence .wo-grid{grid-column:2;grid-row:1/span 3;position:relative;display:block;height:370px;overflow:hidden;align-self:center}
.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(n){position:absolute;top:8px;left:0;width:calc(50% - 9px);height:350px;min-height:350px;margin:0;animation:none;transform:none;transition:border-color .25s,box-shadow .25s;will-change:translate,opacity}
.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(even){left:calc(50% + 9px)}
.why-origin.wo-pinned-sequence .wo-grid>.wo-card:last-child{left:0;width:100%}
.why-origin.wo-pinned-sequence .wo-card .wo-copy{top:214px}
.why-origin.wo-pinned-sequence .wo-card:hover .wo-copy,.why-origin.wo-pinned-sequence .wo-card:focus .wo-copy{top:28px}
@media(max-width:1000px){.why-origin.wo-pinned-sequence .wo-container{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;gap:12px;align-content:center;padding:20px 0}.why-origin.wo-pinned-sequence .wo-label-above{grid-column:1;grid-row:1;margin:0}.why-origin.wo-pinned-sequence .wo-header{grid-column:1;grid-row:2}.why-origin.wo-pinned-sequence .wo-header h2{font-size:34px;max-width:650px;margin-bottom:10px}.why-origin.wo-pinned-sequence .wo-header>p{font-size:14px;max-width:500px}.why-origin.wo-pinned-sequence .wo-grid{grid-column:1;grid-row:3;width:100%;max-width:700px;margin:auto}.why-origin.wo-pinned-sequence .wo-footer{display:none}}
@media(max-width:650px){.why-origin.wo-pinned-sequence{height:450svh}.why-origin.wo-pinned-sequence .wo-container{top:60px;height:calc(100svh - 60px);min-height:540px}.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(n){left:0;width:100%}.why-origin.wo-pinned-sequence .wo-header h2{font-size:30px}}
@media(hover:none){.why-origin.wo-pinned-sequence .wo-card .wo-copy,.why-origin.wo-pinned-sequence .wo-card:hover .wo-copy{top:auto}}

/* The image reel shares the pinned frame, but only its constant CSS loop moves it. */
.why-origin .wo-container{isolation:isolate}
.why-origin .wo-container>.wo-image-column{left:calc((100% - 100vw)/2 + clamp(20px,3vw,56px));top:0;bottom:0;z-index:-1}
.why-origin.wo-pinned-sequence .wo-image-column-track{animation:wo-column-scroll 100s linear infinite}
@media(prefers-reduced-motion:reduce){.why-origin.wo-pinned-sequence .wo-image-column-track{animation:none}}

/* Short native scroll timeline: fast card changes without intercepting page scroll. */
.why-origin.wo-pinned-sequence{height:calc(100svh + 420px)}
@media(max-width:650px){.why-origin.wo-pinned-sequence{height:calc(100svh + 780px)}}

/* Give the pinned Why Origin cards more room without changing the sequence. */
.why-origin.wo-pinned-sequence .wo-container{max-width:1300px;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);column-gap:40px}
.why-origin.wo-pinned-sequence .wo-grid{height:425px}
.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(n){height:405px;min-height:405px;padding:24px}
.why-origin.wo-pinned-sequence .wo-card .wo-art{height:195px}
.why-origin.wo-pinned-sequence .wo-card .wo-copy{top:245px;left:24px;right:24px}
.why-origin.wo-pinned-sequence .wo-card:hover .wo-copy,.why-origin.wo-pinned-sequence .wo-card:focus .wo-copy{top:28px}
.why-origin.wo-pinned-sequence .wo-card .wo-network{height:185px}
.why-origin.wo-pinned-sequence .wo-card .wo-bars{height:140px}
@media(max-width:1000px){.why-origin.wo-pinned-sequence .wo-container{grid-template-columns:1fr}.why-origin.wo-pinned-sequence .wo-grid{max-width:780px}}
@media(max-width:650px),(max-height:730px){.why-origin.wo-pinned-sequence .wo-grid{height:370px}.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(n){height:350px;min-height:350px;padding:20px}.why-origin.wo-pinned-sequence .wo-card .wo-art{height:170px}.why-origin.wo-pinned-sequence .wo-card .wo-copy{top:214px;left:20px;right:20px}.why-origin.wo-pinned-sequence .wo-card .wo-network{height:160px}.why-origin.wo-pinned-sequence .wo-card .wo-bars{height:115px}.why-origin.wo-pinned-sequence .wo-card:hover .wo-copy,.why-origin.wo-pinned-sequence .wo-card:focus .wo-copy{top:28px}}
@media(hover:none){.why-origin.wo-pinned-sequence .wo-card .wo-copy,.why-origin.wo-pinned-sequence .wo-card:hover .wo-copy{top:auto}}

/* Background light follows the exact same deck displacement in both directions. */
.why-origin.wo-pinned-sequence{background:#090c09}
.why-origin.wo-pinned-sequence .wo-container{overflow:clip;overflow-clip-margin:300px}
.wo-deck-glow{position:absolute;right:-240px;top:0;width:650px;z-index:-1;pointer-events:none;background-image:radial-gradient(ellipse 520px 350px at 100% 80%,#689e2855,transparent 78%);background-size:100% var(--wo-glow-step,420px);background-repeat:repeat-y;will-change:translate}
@media(prefers-reduced-motion:reduce){.wo-deck-glow{display:none}}

/* One moving background glow, without repeated copies. */
.wo-deck-glow{background-repeat:no-repeat;background-size:100% 100%}

/* Pin the section at the viewport top, including the area behind the navbar. */
.why-origin.wo-pinned-sequence .wo-container{top:0;height:100svh;background:#090c09;padding-top:64px;box-sizing:border-box}
@media(max-width:650px){.why-origin.wo-pinned-sequence .wo-container{top:0;height:100svh;padding-top:60px}}

/* Fade the moving glow's boundaries into the section background. */
.wo-deck-glow{mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 65%,transparent 100%)}

/* Larger Why Origin heading within the existing pinned layout. */
.why-origin .wo-header h2{font-size:56px}
@media(max-width:1000px){.why-origin.wo-pinned-sequence .wo-header h2{font-size:40px}}
@media(max-width:650px){.why-origin.wo-pinned-sequence .wo-header h2{font-size:34px}}

/* Card changes occupy real scroll distance; no scrollbar jumps at release. */
.why-origin.wo-pinned-sequence{height:calc(100svh + 600px)}
@media(max-width:650px){.why-origin.wo-pinned-sequence{height:calc(100svh + 1080px)}}

/* More reading time before and during the Approach card flight. */
.origin-journey{height:340vh}
@media(max-width:700px){.origin-journey{height:400vh}}
@media(prefers-reduced-motion:reduce){.origin-journey{height:auto}}

/* Calm Services cards: stationary at rest and on hover. */
.services-grid>.service-card,.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{animation:none;translate:none;transform:none}
.services-grid>.service-card h3,.services-grid>.service-card:hover h3,.services-grid>.service-card:focus-within h3{transform:none}

/* Industries: stationary dark surfaces that sit clearly over the image grid. */
.industry-section .origin-grid-background{opacity:.35}
.industry-section .industry-container{z-index:1}
.industry-section .industry-tab{background:rgba(16,22,16,.96);border-color:#ffffff20;color:#c5cfc1;box-shadow:0 4px 16px #00000018;backdrop-filter:blur(12px);transform:none;translate:none}
.industry-section .industry-tab:hover{background:#1c271a;border-color:#8bd10a70}
.industry-section .industry-tab[aria-selected="true"]{background:#243617;border-color:#8bd10a80;color:#fff}
.industry-section .industry-icon{background:#ffffff09;color:#a6b69b}
.industry-section .industry-tab[aria-selected="true"] .industry-icon{background:#8bd10a20;color:#8bd10a}
.industry-section .industry-panels{background:radial-gradient(ellipse at 100% 100%,#8bd10a0a,transparent 55%),rgba(14,20,14,.97);border-color:#ffffff22;color:#fff;box-shadow:0 16px 40px #00000030;backdrop-filter:blur(14px);transform:none;translate:none;animation:none}
.industry-section .industry-panel h3,.industry-section .industry-feature h4{color:#f1f5ec}
.industry-section .industry-description,.industry-section .industry-feature p,.industry-section .industry-header>p,.industry-section .industry-footer{color:#bdc9b5}
.industry-section .industry-features{border-color:#ffffff18}
.industry-section .industry-footer a{color:#8bd10a}
@keyframes industry-in{from{opacity:0}to{opacity:1}}
@keyframes industry-out{to{opacity:0}}

/* CTA navigation starts behind the navbar, with the video/button group centered. */
.contact-video-section{min-height:100svh;justify-content:center;padding:96px var(--gutter) 32px;scroll-margin-top:-80px;gap:32px}
.contact-video-card{max-height:calc(100svh - 200px);flex-shrink:0}
@media(max-width:650px){.contact-video-section{min-height:100svh;padding:84px var(--gutter) 24px;scroll-margin-top:-76px;gap:24px}.contact-video-card{max-height:calc(100svh - 180px)}}

/* Blend the left image reel's top and bottom edges into the dark panel. */
.why-origin .wo-image-column{mask-image:linear-gradient(to right,#000,transparent),linear-gradient(to bottom,transparent 0%,#000 8%,#000 86%,transparent 100%);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,#000,transparent),linear-gradient(to bottom,transparent 0%,#000 8%,#000 86%,transparent 100%);-webkit-mask-composite:source-in}

/* Equal logo slots and equal seam spacing for a continuous marquee. */
.technology-group{gap:64px;padding-right:64px}
.technology-logo{width:104px;height:72px;flex:0 0 104px;justify-content:center;gap:0}
.technology-logo img{width:68px;height:44px;object-fit:contain}
.technology-track{animation-duration:var(--technology-duration,35s)}

/* Reverse-order companion row, moving in the opposite direction. */
.technology-track-reverse{margin-top:32px;animation-direction:reverse}

/* Service cards: clear common regions, concise icon anchors, and tech tags. */
.services-grid>.service-card{background:#fff;color:#171a17;border:1px solid #e5e7eb;box-shadow:0 6px 24px #10120f08;border-radius:24px;padding:30px;min-height:360px;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:0;backdrop-filter:none;animation:none;transform:none;translate:none;transition:border-color .25s,box-shadow .25s}
.services-grid>.service-card::before,.services-grid>.service-card::after{content:none}
.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{transform:none;translate:none;box-shadow:0 10px 32px #10120f0d;border-color:#8bd10a66}
.service-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:15px;background:#8bd10a12;color:#8bd10a;margin-bottom:22px;flex-shrink:0;transition:background .25s}
.service-icon svg{width:30px;height:30px;transition:transform .25s ease}
.service-card:hover .service-icon svg{transform:scale(1.08)}
.service-card:hover .service-icon{background:#8bd10a18;color:#8bd10a}
.services-grid>.service-card>h3{font-size:24px;line-height:1.25;font-weight:700;color:#171a17;min-height:60px;margin:0 0 14px;transform:none;align-self:stretch}
.services-grid>.service-card:hover>h3{color:#8bd10a;transform:none}
.services-grid>.service-card>p{color:#454d43;font-size:16px;line-height:1.6;margin:0 0 24px;align-self:stretch}
.service-tech-tags{display:flex;flex-wrap:wrap;gap:8px 16px;list-style:none;padding:18px 0 0;margin:auto 0 0;border-top:1px solid #edf0e9;color:#59634f;font-size:12px;line-height:1.5}
.service-tech-tags li{display:flex;align-items:center;gap:6px}
.service-tech-tags li::before{content:'';width:4px;height:4px;border-radius:50%;background:#8bd10a;flex-shrink:0}
@media(max-width:650px){.services-grid>.service-card{padding:26px;min-height:0}.services-grid>.service-card>h3{min-height:0}.service-tech-tags{margin-top:0}}
@media(prefers-reduced-motion:reduce){.service-icon svg{transition:none}.service-card:hover .service-icon svg{transform:none}}

/* Hover: a small card enlargement and the shared brand-green heading only. */
.services-grid>.service-card{transition:scale .25s ease;scale:1}
.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{scale:1.025;transform:none;translate:none;background:#fff;border-color:#e5e7eb;box-shadow:0 6px 24px #10120f08}
.services-grid>.service-card>h3{transition:color .25s ease}
.services-grid>.service-card:hover>h3,.services-grid>.service-card:focus-within>h3{color:#8bd10a;transform:none}
.service-card:hover .service-icon{background:#8bd10a12;color:#8bd10a}
.service-card:hover .service-icon svg{transform:none}
@media(prefers-reduced-motion:reduce){.services-grid>.service-card{transition:none}.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{scale:1}}

/* Static raised service cards: elevation without idle movement. */
.services-grid>.service-card{box-shadow:0 4px 8px #10120f04,0 16px 40px -12px #10120f24;border-color:#e5e7eb;animation:none;translate:none}
.services-grid>.service-card:hover,.services-grid>.service-card:focus-within{box-shadow:0 4px 8px #10120f04,0 16px 40px -12px #10120f24}

/* A single soft vertical brand glow on the left side. */
.services-showcase{background:#fff}

/* Soft brand light centered behind the card group. */
.services-grid{position:relative;isolation:isolate}
.services-grid::before{content:"";position:absolute;inset:-60px -90px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 65% 75% at 50% 50%,#8bd10a26 0%,#8bd10a10 48%,transparent 82%);filter:blur(28px)}

.services-grid>.service-card>p{color:#000000}

.services-grid>.service-card>p{font-weight:400}

.services-grid>.service-card>h3{font-size:26px}

.grid-motion__row{gap:var(--gm-gap,16px)}

/* Flexible rows fill remaining space; section and glow follow the grid's height. */
.services-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.services-grid>.service-card{flex:1 1 calc((100% - 48px)/3);min-width:0;max-width:none}
.services-grid>.service-card:only-child{max-width:580px}
.services-grid[hidden]{display:none}
@media(max-width:1100px){.services-grid>.service-card{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:650px){.services-grid>.service-card{flex-basis:100%}}

.journey-title span{color:#8bd10a;opacity:1}

.journey-card svg,.journey-mini svg{stroke:#8bd10a;opacity:1}
.journey-number{color:#8bd10a;opacity:1}

.journey-card p{color:#edf1e9;opacity:1;line-height:1.6}

.journey-connection{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;overflow:visible;transition:opacity .16s}
.journey-connection.is-visible{opacity:1}
.journey-connection path{fill:none;stroke:#8bd10a;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1000;stroke-dashoffset:1000}
.journey-connection-halo{stroke-width:7;opacity:.2;filter:blur(4px)}
.journey-connection-line{stroke-width:1.8;filter:drop-shadow(0 0 5px #8bd10a70)}
.journey-connection.is-visible path{animation:journey-connect .8s cubic-bezier(.2,.7,.3,1) forwards}
.journey-layer{z-index:2}
@keyframes journey-connect{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.journey-connection.is-visible path{animation:none;stroke-dashoffset:0}}

/* Keep the decorative layer transparent to input, but enable its actual cards. */
.journey-layer>.journey-card{pointer-events:auto;user-select:text;-webkit-user-select:text}

/* Fine travelling thread with quiet circular connection points. */
.journey-connection-line{stroke-width:1.3;filter:none}
.journey-connection-halo{stroke-width:3;opacity:.1;filter:blur(2px)}
.journey-connection.is-visible path{animation:journey-connect 2.8s linear forwards}
.journey-thread-node circle:first-child{fill:#090c09;stroke:#e7eddf;stroke-width:1.2;opacity:.9}
.journey-thread-node circle:last-child{fill:#8bd10a;stroke:none}
.journey-thread-node{opacity:0}
.journey-connection.is-visible .journey-thread-node{animation:journey-node-in .3s ease forwards}
.journey-connection.is-visible .journey-thread-node:nth-of-type(2){animation-delay:.9s}
.journey-connection.is-visible .journey-thread-node:nth-of-type(3){animation-delay:1.8s}
.journey-connection.is-visible .journey-thread-node:nth-of-type(4){animation-delay:2.6s}
@keyframes journey-node-in{to{opacity:1}}
@media(prefers-reduced-motion:reduce){.journey-connection.is-visible .journey-thread-node{animation:none;opacity:1}}

/* Fixed wave geometry; one reversible drawing progress drives thread and nodes. */
.journey-connection.is-visible path,.journey-connection.is-visible .journey-thread-node{animation:none}
.journey-connection-line{stroke:#8bd10a;stroke-width:1.4;filter:drop-shadow(0 0 3px #8bd10a99)}
.journey-connection-halo{stroke:#8bd10a;stroke-width:8;opacity:.25;filter:blur(6px)}

/* Dashed curved thread inspired by the looped reference. */
.journey-connection-line{stroke-dasharray:8 9;stroke-dashoffset:0;stroke-width:1.8}
.journey-connection-halo{stroke-dasharray:none;stroke-dashoffset:0;opacity:.12;stroke-width:5}

.journey-light-trail{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:0;overflow:visible;filter:drop-shadow(0 0 4px #8bd10aaa) drop-shadow(0 0 10px #8bd10a55)}

.industry-section{background:#ffffff;color:#171a17}
.industry-header h2{color:#171a17}
.industry-header>p,.industry-footer{color:#454d43}

.industry-section{min-height:100svh;background:#ffffff}
.industry-section::before,.industry-section::after{content:none}

/* Shared heading typography, based on Why Choose Us. Approach remains independent. */
:root{--shared-heading-size:56px;--shared-description-size:18px;--shared-label-size:12px}
.shared-section-title{font-family:Inter,Arial,sans-serif!important;font-size:var(--shared-heading-size)!important;font-weight:700!important;line-height:1.15!important;letter-spacing:-.035em!important}
.shared-section-description{font-size:var(--shared-description-size)!important;font-weight:400!important;line-height:1.5!important}
.shared-section-label{font-size:var(--shared-label-size)!important;font-weight:500!important;letter-spacing:.1em!important}
@media(max-width:1000px){:root{--shared-heading-size:40px;--shared-description-size:16px}}
@media(max-width:650px){:root{--shared-heading-size:34px;--shared-description-size:16px}}
/* Industry carousel adapted from the supplied responsive card component. */
.industry-carousel{max-width:1240px;margin:36px auto 0;overflow:hidden;padding:20px 0;color:#090c09;outline:none}
.ic-industry-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 24px;margin-top:12px;margin-bottom:24px}
.ic-industry-button{border:1px solid #e5e7eb;border-radius:999px;background:#fff;color:#303830;padding:12px 18px;font-family:inherit;font-size:16px;font-weight:500;line-height:1.4;cursor:pointer;transition:border-color .2s,background-color .2s}
.ic-industry-button:hover{border-color:#8bd10a}
.ic-industry-button[aria-pressed=true]{background:#8bd10a;border-color:#8bd10a;color:#090c09}
.ic-industry-button:focus-visible{outline:2px solid #8bd10a;outline-offset:4px}
@media(max-width:767px){.ic-industry-buttons{gap:8px;padding:0 16px;margin-top:8px;margin-bottom:20px}.ic-industry-button{font-size:14px;padding:10px 13px}}
.ic-stage{position:relative;height:460px;width:100%;touch-action:pan-y}
.ic-card{position:absolute;left:50%;top:50%;border-radius:32px;background:#fff;box-shadow:0 10px 30px #5f6d7714,0 4px 12px #5f6d7710;border:1px solid #e5e7eb;overflow:hidden;transition:transform .65s cubic-bezier(.22,1,.36,1),width .65s cubic-bezier(.22,1,.36,1),height .65s cubic-bezier(.22,1,.36,1),opacity .35s;cursor:pointer}
.ic-preview{position:absolute;inset:8px;border-radius:24px;overflow:hidden;transition:opacity .25s}
.ic-preview img,.ic-photo{width:100%;height:100%;object-fit:cover}
.ic-content{position:absolute;inset:0;padding:28px;display:flex;gap:24px;opacity:0;transition:opacity .3s}
.ic-card.is-active{cursor:default}.ic-card.is-active .ic-content{opacity:1}.ic-card.is-active .ic-preview{opacity:0;pointer-events:none}
.ic-copy{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:22px;padding:8px 0}
.ic-eyebrow{font-size:16px;font-weight:500;color:#090c09;background:none;padding:0;border-radius:0}
.ic-copy h3{font-size:26px;line-height:1.15;letter-spacing:-.035em;margin:0;color:#090c09}
.ic-copy p{font-size:17px;line-height:1.6;margin:auto 0;color:#303830}
.ic-tags{font-size:12px;color:#42513b;background:#f4f7ef;padding:10px 12px;border-radius:6px;line-height:1.7}
.ic-photo{width:44%;flex-shrink:0;border-radius:22px}
.ic-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:26px}
.ic-dots{display:flex;gap:8px;align-items:center}.ic-dots button{width:8px;height:8px;border:0;border-radius:3px;background:#e6eddd;padding:0;overflow:hidden;cursor:pointer;transition:width .3s}.ic-dots button[aria-pressed=true]{width:80px}.ic-dots span{display:block;width:100%;height:100%;background:#8bd10a;transform:scaleX(0);transform-origin:left}
.ic-arrow{width:38px;height:38px;border:1px solid #e5e7eb;border-radius:50%;background:white;color:#090c09;cursor:pointer;font-size:20px}.ic-pause{border:0;background:none;color:#42513b;font-size:12px;cursor:pointer}.ic-status{font-size:12px;text-align:center;margin:12px 0 0;color:#52604b;min-height:18px}
.ic-controls button:focus-visible,.industry-carousel:focus-visible{outline:2px solid #8bd10a;outline-offset:5px}
@media(max-width:1119px){.ic-stage{height:405px}.ic-content{padding:22px;gap:18px}.ic-copy h3{font-size:23px}.ic-copy p{font-size:15px}.ic-copy{gap:16px}}
@media(max-width:767px){.ic-stage{height:465px}.ic-content{padding:18px;flex-direction:column;gap:14px}.ic-copy{gap:12px;flex:1}.ic-copy h3{font-size:21px}.ic-copy p{font-size:14px;line-height:1.5}.ic-photo{width:100%;height:170px}.ic-eyebrow{font-size:14px}.ic-tags{font-size:10px;padding:5px 8px}.ic-controls{gap:12px}.ic-dots button[aria-pressed=true]{width:48px}}
@media(prefers-reduced-motion:reduce){.ic-card,.ic-content,.ic-preview{transition:none}}







.industry-cta{display:flex;justify-content:center;margin-top:30px;padding:0 20px}
.industry-cta .animated-button:not(:hover){background:#8bd10a;color:#fff;border-color:#8bd10a}



/* Gentle local floating stays independent of direct, native scroll movement. */
.origin-journey .journey-layer>[data-journey-speed]{animation:journey-float 4.8s ease-in-out infinite;transition:none}
.origin-journey .journey-title{animation:none;translate:none;transition:none}
@media(prefers-reduced-motion:reduce){
 .origin-journey .journey-layer>[data-journey-speed]{animation:none;translate:none}
}

/* Service-card layout and hover motion share one set of rules. */
.services-grid>.service-card{
 position:relative;height:410px;min-height:410px;padding:30px;overflow:hidden;scale:1;
 --service-reveal-time:750ms;--service-reveal-ease:cubic-bezier(.4,0,.2,1);
}
.services-grid>.service-card:is(:hover,:focus-within){scale:1}
.services-grid>.service-card>.service-icon{margin-bottom:22px;opacity:1;translate:0 0}
.services-grid>.service-card>h3{min-height:60px;margin-bottom:14px;translate:0 0}
.services-grid>.service-card>p{font-size:16px;line-height:1.5;margin-bottom:16px;opacity:1;translate:0 0}
.services-grid>.service-card>.service-illustration{
 display:grid;place-items:center;position:absolute;top:100px;bottom:auto;left:20px;right:20px;
 width:auto;height:180px;margin:0;align-self:auto;background:transparent;
 opacity:0;visibility:visible;translate:0 210px;pointer-events:none;
}
.services-grid>.service-card>.service-illustration>svg{width:100%;height:180px;max-width:100%;object-fit:contain}
.services-grid>.service-card>.service-icon,
.services-grid>.service-card>h3,
.services-grid>.service-card>p,
.services-grid>.service-card>.service-illustration{
 transition:translate var(--service-reveal-time) var(--service-reveal-ease),
 opacity var(--service-reveal-time) var(--service-reveal-ease),color .25s;
}
.services-grid>.service-card:is(:hover,:focus-within)>.service-icon,
.services-grid>.service-card:is(:hover,:focus-within)>p{translate:0 -78px;opacity:0;visibility:visible;pointer-events:none}
.services-grid>.service-card:is(:hover,:focus-within)>h3{translate:0 -78px}
.services-grid>.service-card:is(:hover,:focus-within)>.service-illustration{opacity:1;translate:0 0;visibility:visible}
.services-grid>.service-card>.service-tech-tags{
 position:absolute;left:24px;right:24px;bottom:22px;margin:0;padding:12px 0 0;z-index:1;
 display:flex;flex-wrap:wrap;gap:6px;border-top:0;
 font-size:13px;font-weight:600;line-height:1.5;color:#27351b;opacity:1;
}
.services-grid>.service-card>.service-tech-tags li{padding:4px 8px;border:1px solid #cdddba;border-radius:9px;background:#f0f6e8}
.services-grid>.service-card>.service-tech-tags li::before{width:5px;height:5px;background:#5c890c}
@media(max-width:650px){.services-grid>.service-card{height:430px;min-height:430px;padding:26px}}
@media(hover:none){
 .services-grid>.service-card>.service-icon,.services-grid>.service-card>p{opacity:0;translate:0 -78px;pointer-events:none}
 .services-grid>.service-card>h3{translate:0 -78px}
 .services-grid>.service-card>.service-illustration{opacity:1;translate:0 0}
}
@media(prefers-reduced-motion:reduce){
 .services-grid>.service-card>.service-icon,.services-grid>.service-card>h3,
 .services-grid>.service-card>p,.services-grid>.service-card>.service-illustration{transition:none}
}

/* A simple customer-to-sale path for the first Why Origin card. */
.wo-sales-flow{display:flex;align-items:center;justify-content:center;gap:7px;width:100%}
.wo-sales-step{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;gap:12px;padding:18px 4px;border:1px solid #ffffff24;border-radius:14px;background:#ffffff06;color:#edf1e9}
.wo-sales-step svg{width:30px;height:30px;color:#8bd10a}
.wo-sales-step span{font-size:11px;line-height:1.3;white-space:nowrap}
.wo-sales-step.wo-sales-win{background:#8bd10a14;border-color:#8bd10a65}
.wo-sales-arrow{color:#8bd10a;font-size:18px;flex:none}

.wo-sales-illustration{width:100%}.wo-sales-caption{color:#8bd10a;font-size:11px;font-weight:600;line-height:1.4;text-align:center;margin-bottom:14px}

/* Slightly clearer Why Origin image reel; retain soft edge fades. */
.why-origin .wo-image-column{opacity:.45}
@media(max-width:1000px){.why-origin .wo-image-column{opacity:.25}}

/* Two-stage service reveal: icon and title first, then description and illustration. */
.services-grid>.service-card{--service-reveal-time:350ms}
.services-grid>.service-card>.service-icon,
.services-grid>.service-card>h3,
.services-grid>.service-card>p,
.services-grid>.service-card>.service-illustration{transition-delay:0s}
.services-grid>.service-card:is(:hover,:focus-within)>p,
.services-grid>.service-card:is(:hover,:focus-within)>.service-illustration{transition-delay:350ms}
@media(prefers-reduced-motion:reduce){
 .services-grid>.service-card:is(:hover,:focus-within)>p,
 .services-grid>.service-card:is(:hover,:focus-within)>.service-illustration{transition-delay:0s}
}

/* Soft green light in the open right-hand side of Approach. */
.origin-journey .journey-sticky::before{
 content:"";position:absolute;right:-190px;top:42%;width:650px;height:580px;
 background:radial-gradient(ellipse at center,#8bd10a30 0%,#8bd10a14 32%,#8bd10a06 52%,transparent 72%);
 pointer-events:none;z-index:-1;
}
@media(max-width:700px){.origin-journey .journey-sticky::before{right:-220px;width:440px;height:460px}}

/* Readable industry text and distinct benefit tags at every screen size. */
.industry-carousel .ic-stage{height:580px}
.industry-carousel .ic-copy{gap:16px}
.industry-carousel .ic-eyebrow{font-size:18px;font-weight:600}
.industry-carousel .ic-copy h3{font-size:30px;line-height:1.2}
.industry-carousel .ic-copy p{font-size:18px;line-height:1.55;color:#202920}
.industry-carousel .ic-tags{display:flex;flex-wrap:wrap;gap:8px;background:none;padding:0;font-size:14px;line-height:1.4;color:#25351b}
.industry-carousel .ic-tag{padding:7px 10px;border:1px solid #c8d8b5;border-radius:8px;background:#edf5e3;font-weight:600}
@media(max-width:1119px){.industry-carousel .ic-stage{height:600px}.industry-carousel .ic-copy h3{font-size:27px}.industry-carousel .ic-copy p{font-size:17px}}
@media(max-width:767px){
 .industry-carousel .ic-stage{height:650px}
 .industry-carousel .ic-copy h3{font-size:24px}
 .industry-carousel .ic-copy p{font-size:16px;line-height:1.5}
 .industry-carousel .ic-eyebrow{font-size:16px}
 .industry-carousel .ic-tags{font-size:13px;gap:6px}
 .industry-carousel .ic-tag{padding:6px 8px}
 .industry-carousel .ic-photo{height:140px;flex-shrink:0}
}

/* Soft green light behind the right side of Why Origin. */
.why-origin .wo-container::after{
 content:"";position:absolute;right:-220px;top:25%;width:650px;height:580px;
 background:radial-gradient(ellipse at center,#8bd10a30 0%,#8bd10a14 32%,#8bd10a06 52%,transparent 72%);
 pointer-events:none;z-index:-1;
}
@media(max-width:650px){.why-origin .wo-container::after{right:-240px;width:440px;height:460px}}

/* Blend Approach into CTA without a clipped glow or background-color seam. */
.origin-journey .journey-sticky::before{top:auto;bottom:0}
.origin-journey + .contact-video-section{background:#090c09;border-top:0}

/* Slightly lower, smaller, bolder industry card headings. */
.industry-carousel .ic-copy h3{font-size:28px;margin-top:20px}
@media(max-width:1119px){.industry-carousel .ic-copy h3{font-size:25px}}
@media(max-width:767px){.industry-carousel .ic-copy h3{font-size:22px}}

/* Hero typography inspired by the supplied reference; CTA rules remain unchanged. */
.hero .hero-content{padding-left:var(--gutter);padding-right:var(--gutter);text-align:left}
.hero .hero-content > .eyebrow{display:inline-flex;align-self:flex-start;width:fit-content;padding:7px 14px;border:1px solid #ffffff30;border-radius:999px;background:#ffffff0a;gap:10px;margin-bottom:30px;font-size:12px!important;font-weight:600!important;line-height:1.4;letter-spacing:.045em!important;text-transform:uppercase}
.hero #hero-title{max-width:1200px;font-size:clamp(46px,5.25vw,100px)!important;font-weight:400!important;line-height:1.04!important;letter-spacing:-.025em!important;word-spacing:.06em}
.hero #hero-title .headline-line{font-weight:inherit;overflow-wrap:normal}
.hero .hero-intro > p{word-spacing:.025em;max-width:880px;font-size:clamp(18px,1.4vw,26px)!important;font-weight:400!important;line-height:1.5!important;color:#ededeb}
.hero .hero-intro{max-width:900px;margin-top:36px}
@media(max-width:1100px){.hero #hero-title{font-size:clamp(44px,5.7vw,64px)!important}.hero .hero-content{padding-inline:var(--gutter)}}
@media(max-width:700px){.hero .hero-content{padding-inline:24px}.hero #hero-title{font-size:clamp(34px,7.5vw,52px)!important;line-height:1.08!important}.hero .hero-content > .eyebrow{font-size:10px!important;padding:6px 10px;margin-bottom:24px}.hero .hero-intro > p{font-size:16px!important}.hero .hero-intro{margin-top:26px}}
@media(max-height:700px) and (min-width:701px){.hero #hero-title{font-size:clamp(44px,8.8vh,76px)!important}.hero .hero-content > .eyebrow{margin-bottom:20px}.hero .hero-intro{margin-top:24px}.hero .hero-intro > p{font-size:18px!important}}

/* Promote only the nearby Why Origin cards; no extra transform easing layer. */
.why-origin.wo-pinned-sequence .wo-grid>.wo-card:nth-child(n){translate:none;will-change:auto}
.why-origin.wo-pinned-sequence.wo-motion-visible .wo-grid>.wo-card:nth-child(n){will-change:transform}