:root{
  --motion-ease:cubic-bezier(.22,.7,.2,1);
  --motion-distance:18px;
  --motion-fade:360ms;
  --motion-stagger:70ms;
 }
html.motion-ready [data-reveal],
html.motion-ready [data-reveal-group]>[data-reveal-item]{
  opacity:0;
  transform:translateY(var(--motion-distance));
  transition:opacity var(--motion-fade) ease,transform 520ms var(--motion-ease);
}

html.motion-ready [data-reveal].is-visible,
html.motion-ready [data-reveal-group].is-visible>[data-reveal-item].is-visible{
  opacity:1;
  transform:none;
}

html.motion-ready [data-reveal-group].is-visible>[data-reveal-item]{
  transition-delay:calc(var(--reveal-index,0) * var(--motion-stagger));
}

html.motion-ready [data-reveal=hero]>*{
  animation:hero-enter 720ms var(--motion-ease) both;
}

html.motion-ready [data-reveal=hero]>*:nth-child(2){animation-delay:80ms}
html.motion-ready [data-reveal=hero]>*:nth-child(3){animation-delay:150ms}
html.motion-ready [data-reveal=hero]>*:nth-child(4){animation-delay:220ms}
html.motion-ready [data-reveal=hero]>*:nth-child(5){animation-delay:290ms}

html.motion-ready .hero-scene.is-visible .scene-product,
html.motion-ready .station-stage.is-visible>img,
html.motion-ready .control-ui.is-visible{
  animation:scene-settle 800ms var(--motion-ease) both;
}

html.motion-ready .hero-scene.is-visible .hero-scene-card{
  animation:card-settle 620ms var(--motion-ease) 150ms both;
}

html.motion-ready .perimeter-card.is-visible .external-path{
  stroke-dasharray:900;
  stroke-dashoffset:900;
  animation:draw-line 900ms var(--motion-ease) 90ms forwards;
}

html.motion-ready .perimeter-card.is-visible .local-path{
  stroke-dasharray:900;
  stroke-dashoffset:900;
  animation:draw-line 1200ms var(--motion-ease) 220ms forwards;
}

html.motion-ready .rag-pipeline.is-visible>.pipeline-line{
  animation:pipeline-line-in 420ms var(--motion-ease) both;
}

html.motion-ready .rag-pipeline.is-visible>.pipeline-line:nth-child(2){animation-delay:95ms}
html.motion-ready .rag-pipeline.is-visible>.pipeline-line:nth-child(4){animation-delay:185ms}
html.motion-ready .rag-pipeline.is-visible>.pipeline-line:nth-child(6){animation-delay:275ms}
html.motion-ready .rag-pipeline.is-visible>.pipeline-line:nth-child(8){animation-delay:365ms}

html.motion-ready .scale-rail.is-visible::after,
html.motion-ready .process-rail.is-visible::after{
  animation:rail-progress 1050ms var(--motion-ease) 130ms both;
}

html.motion-ready .control-section.is-visible .chart-line{
  stroke-dasharray:1000;
  stroke-dashoffset:1000;
  animation:draw-chart 1100ms var(--motion-ease) 180ms forwards;
}

.workload-scene{
  opacity:0;
  visibility:hidden;
  transform:translateY(8px) scale(.985);
  transition:opacity 280ms ease,transform 420ms var(--motion-ease),visibility 0s linear 420ms;
}

.workload-panel[data-workload-panel=local-llm] .workload-scene--local-llm,
.workload-panel[data-workload-panel=rag] .workload-scene--rag,
.workload-panel[data-workload-panel=docs] .workload-scene--docs,
.workload-panel[data-workload-panel=coding] .workload-scene--coding,
.workload-panel[data-workload-panel=ocr] .workload-scene--ocr,
.workload-panel[data-workload-panel=assistants] .workload-scene--assistants,
.workload-panel[data-workload-panel=images] .workload-scene--images{
  opacity:1;
  visibility:visible;
  transform:none;
  transition-delay:0s;
}

.scene-aura,
.stage-glow,
.system-core-aura,
.contact-stage-glow{
  animation:restrained-glow 6s ease-in-out infinite;
}

.ui-status-grid i,
.status-dot i,
.quiet-status i{
  animation:small-pulse 3s ease-in-out infinite;
}

@keyframes hero-enter{
  from{opacity:0;filter:blur(8px);transform:translateY(14px) scale(.985)}
  to{opacity:1;filter:blur(0);transform:none}
}

@keyframes scene-settle{
  from{opacity:0;filter:blur(5px);transform:translateY(12px) scale(.97)}
  to{opacity:1;filter:blur(0);transform:none}
}

@keyframes card-settle{
  from{opacity:0;filter:blur(4px);transform:translateY(14px)}
  to{opacity:1;filter:blur(0);transform:none}
}

@keyframes draw-line{to{stroke-dashoffset:0}}
@keyframes pipeline-line-in{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:scaleX(1)}}
@keyframes rail-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes draw-chart{to{stroke-dashoffset:0}}
@keyframes restrained-glow{0%,100%{opacity:.62}50%{opacity:.92}}
@keyframes small-pulse{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes hero-route-travel{to{stroke-dashoffset:-320}}
@keyframes hero-route-node-travel{0%,100%{opacity:.5}50%{opacity:1}}

.hero-routes path{
  animation:hero-route-travel 34s linear infinite;
}

.hero-routes path:nth-child(2){animation-duration:42s;animation-direction:reverse}
.hero-routes path:nth-child(3){animation-duration:52s}
.hero-route-node{animation:hero-route-node-travel 7s ease-in-out infinite}
.hero-route-node--b{animation-delay:-3.5s}

@media (max-width:760px){
  html.motion-ready .rag-pipeline.is-visible>.pipeline-line{animation-name:pipeline-line-in-vertical}
  html.motion-ready .scale-rail.is-visible::after,
  html.motion-ready .process-rail.is-visible::after{animation-name:rail-progress-vertical}
}

@keyframes pipeline-line-in-vertical{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}
@keyframes rail-progress-vertical{from{transform:scaleY(0)}to{transform:scaleY(1)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.motion-ready [data-reveal],
  html.motion-ready [data-reveal-group]>[data-reveal-item],
  html.motion-ready [data-reveal=hero]>*,
  .workload-scene,
  .hero-scene.is-visible .scene-product,
  .hero-scene.is-visible .hero-scene-card,
  .station-stage.is-visible>img,
  .control-ui.is-visible{
    opacity:1!important;
    visibility:visible!important;
    filter:none!important;
    transform:none!important;
    transition:none!important;
    animation:none!important;
  }

  .perimeter-card.is-visible .external-path,
  .perimeter-card.is-visible .local-path{
    stroke-dashoffset:0!important;
    animation:none!important;
  }

  .scene-aura,
  .stage-glow,
  .system-core-aura,
  .contact-stage-glow,
  .ui-status-grid i,
  .status-dot i,
  .quiet-status i,
  .hero-routes path,
  .hero-route-node,
  html.motion-ready .rag-pipeline.is-visible>.pipeline-line,
  html.motion-ready .scale-rail.is-visible::after,
  html.motion-ready .process-rail.is-visible::after,
  html.motion-ready .control-section.is-visible .chart-line{
    animation:none!important;
    opacity:1!important;
    transform:none!important;
    stroke-dashoffset:0!important;
  }

  .faq-answer,
  .faq-question i::after,
  .button,
  .nav-cta,
  .workload-chip,
  .workload-scene{
    transition:none!important;
  }
}

/* R3.2 route drawing stays inside the existing reveal system. */
html.motion-ready .hero-scene.is-visible .topology-path{
  stroke-dasharray:900;
  stroke-dashoffset:900;
  animation:draw-line 980ms var(--motion-ease) forwards;
}
html.motion-ready .hero-scene.is-visible .topology-path--model{animation-delay:90ms}
html.motion-ready .hero-scene.is-visible .topology-path--team{animation-delay:170ms}
html.motion-ready .hero-scene.is-visible .topology-path--runtime{animation-delay:250ms}

@media (prefers-reduced-motion:reduce){
  html.motion-ready .hero-scene.is-visible .topology-path{
    stroke-dashoffset:0!important;
    animation:none!important;
  }
}