/* Detail-page motion: task-specific illustrations, never live inference. */
.detail-hero.detail-hero-compact{padding-bottom:10px;margin-bottom:0}.detail-hero-compact h1{max-width:1000px}.detail-hero-compact .detail-intro{max-width:810px;font-size:18px;line-height:1.7}
.motion-scene{margin:8px 0 48px;scroll-margin-top:100px}.scene-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding:18px 0 24px}.scene-heading .eyebrow{font-size:10px;color:var(--cyan);letter-spacing:1.8px;margin-bottom:12px}.scene-heading h2{font-size:clamp(24px,2.15vw,33px);font-weight:400;letter-spacing:-.65px;margin-bottom:10px}.scene-heading p:last-child{font-size:14px;color:var(--muted);margin:0;max-width:740px}.scene-sequence-count{font-size:11px;letter-spacing:3px;color:#7498b3;white-space:nowrap;padding-bottom:4px}
.scene-stage{display:grid;grid-template-columns:minmax(0,1fr) 304px;border:1px solid var(--line);background:#0a131c}.scene-canvas{position:relative;min-width:0;overflow:hidden;isolation:isolate;height:clamp(440px,32vw,520px);background:radial-gradient(ellipse at 50% 40%,#172c3e 0%,#0b1722 57%,#071018 100%)}.scene-photo{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;opacity:.72;filter:saturate(.62)}.scene-canvas .scene-photo{object-position:center}.scene-vignette{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(2,9,15,.55),transparent 25%,transparent 70%,rgba(2,9,15,.9)),linear-gradient(90deg,rgba(2,9,15,.13),transparent 40%,rgba(2,9,15,.13));pointer-events:none}.scene-concept{position:absolute;z-index:3;left:24px;right:18px;top:20px;margin:0;color:#b1d3e7;font-size:9px;letter-spacing:.85px;line-height:1.5;display:flex;align-items:center;gap:8px}.scene-concept:before{content:"";width:4px;height:4px;background:var(--cyan);flex:none}.scene-art{position:absolute;inset:0;z-index:2;width:100%;height:100%;color:#87b8d9;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.scene-art .scene-grid{stroke:none;opacity:.7}.scene-canvas:has(.scene-photo) .scene-grid{opacity:.22}.scene-phase{opacity:0;transition:opacity .65s ease}.scene-phase-0{opacity:1}
[data-scene-stage="1"] .scene-phase-0,[data-scene-stage="2"] .scene-phase-0,[data-scene-stage="3"] .scene-phase-0{opacity:0}[data-scene-stage="1"] .scene-phase-1,[data-scene-stage="2"] .scene-phase-2,[data-scene-stage="3"] .scene-phase-3{opacity:1}
.scene-frame{stroke:#96d9ec;stroke-width:2.5}.scene-region{stroke:#71d5ed;fill:#66cff31c;stroke-width:2}.scene-review{stroke:#e5bd79;stroke-dasharray:7 6;stroke-width:2}.scene-leader{stroke:#a0d8ed;stroke-width:1.5;stroke-dasharray:4 6}.scene-scan{stroke:#7de5ff;stroke-width:2;filter:drop-shadow(0 0 9px #52c7ff);animation:scene-sweep 2.7s ease-in-out infinite alternate}.scene-pulse{fill:#8ce6ff25;stroke:#a6e6ff;transform-box:fill-box;transform-origin:center;animation:scene-breathe 2.4s ease-in-out infinite}.scene-cone{fill:#60c9e521;stroke:#79cbea;stroke-dasharray:5 8}.scene-path{stroke:#a5dced;stroke-width:2.5;stroke-dasharray:8 8;animation:scene-dash 2s linear infinite}.scene-diagram-base rect,.scene-paper rect,.scene-collect-card>rect{fill:#0e1e2c;stroke:#54748d;stroke-width:1}.scene-diagram-base path,.scene-diagram-base circle{stroke:#749dbb}.scene-link{stroke-dasharray:3 8;opacity:.5}.scene-active-node{fill:#5ebdff1c;stroke:#8cdeff;stroke-width:2}.scene-flow-packet{stroke:#9cd9f3;stroke-width:3;stroke-dasharray:7 642;animation:scene-packet 3s ease-in-out infinite}.scene-paper>path{stroke:#bddaea;stroke-width:4}.scene-paper g{stroke:#59758d;stroke-width:3}.scene-paper-right{opacity:.78}.scene-collect-card{stroke:#87acc6;stroke-width:2.2}.scene-collect-card>rect:nth-child(2){fill:#193449;stroke:#324f66}.scene-card-pattern{stroke:#306080;stroke-width:8;opacity:.5}.scene-canvas-fun{background:radial-gradient(ellipse at 45% 42%,#152b3b,#07121d 75%)}
.scene-art-labels{position:absolute;z-index:3;inset:0;pointer-events:none}.scene-art-label{position:absolute;right:24px;bottom:55px;color:#bee2f2;border-left:2px solid #79d1ef;background:#07121de6;padding:9px 12px;font-size:9px;letter-spacing:1.35px;line-height:1.5;opacity:0;transform:translateY(5px);transition:opacity .5s ease,transform .5s ease;max-width:85%}.scene-art-label-0{opacity:1;transform:none}[data-scene-stage="1"] .scene-art-label-0,[data-scene-stage="2"] .scene-art-label-0,[data-scene-stage="3"] .scene-art-label-0{opacity:0;transform:translateY(5px)}[data-scene-stage="1"] .scene-art-label-1,[data-scene-stage="2"] .scene-art-label-2,[data-scene-stage="3"] .scene-art-label-3{opacity:1;transform:none}.scene-bottom-line{position:absolute;z-index:3;left:24px;right:24px;bottom:18px;display:flex;justify-content:space-between;gap:15px;font-size:8px;letter-spacing:1.2px;color:#8bacbf}.scene-story{display:flex;flex-direction:column;min-width:0;border-left:1px solid var(--line);background:linear-gradient(120deg,#0e1c28,#0b151f)}.scene-steps{padding:20px 19px 0}.scene-step{display:flex;align-items:center;gap:14px;position:relative;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #7292aa1f;border-radius:0;padding:17px 12px;color:#90aabc;font-size:12px;line-height:1.45}.scene-step>span:first-child{font-size:10px;color:#6b8da6}.scene-step>span:nth-child(2){flex:1}.scene-step-arrow{font-size:17px;opacity:0}.scene-step[aria-pressed=true]{color:#e8f4fc;background:#25486361}.scene-step[aria-pressed=true]:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:#86d3ff}.scene-step[aria-pressed=true] .scene-step-arrow{opacity:1;color:#8bccf6}.scene-step:hover{color:white;background:#25486335}.scene-explanation{padding:25px 31px 20px;flex:1;min-height:170px}.scene-current{font-size:9px;letter-spacing:1.5px;color:#73a4c2;display:block;margin-bottom:12px}.scene-explanation h3{font-size:18px;line-height:1.4;font-weight:400;margin-bottom:12px}.scene-explanation p{font-size:13px;line-height:1.75;margin:0;color:#adc4d5;max-width:430px}.scene-controls{margin:0 27px;padding:15px 0 19px;border-top:1px solid var(--line);display:flex;align-items:center;gap:17px;flex-wrap:wrap}.scene-controls button{display:flex;align-items:center;gap:7px;background:none;border:0;padding:5px 0;font-size:11px;color:#c1d9e8;min-height:32px}.scene-controls button:hover{color:#fff}.scene-controls button:disabled{opacity:.65;cursor:default}.scene-controls [data-scene-status]{font-size:9px;color:#789aaf;margin-left:auto}.scene-footnote{font-size:10px;line-height:1.6;color:#819cac;margin:12px 0 0}.motion-scene[data-playing=false] *{animation-play-state:paused}.no-js .scene-steps,.no-js .scene-controls{display:none}.no-js .scene-explanation{display:flex;flex-direction:column;justify-content:center}.no-js .scene-art *{animation:none!important}
@keyframes scene-sweep{from{transform:translateY(-72px)}to{transform:translateY(77px)}}@keyframes scene-breathe{0%,100%{opacity:.58;transform:scale(.95)}50%{opacity:1;transform:scale(1.12)}}@keyframes scene-dash{to{stroke-dashoffset:-32}}@keyframes scene-packet{from{stroke-dashoffset:0}to{stroke-dashoffset:-642}}
@media(min-width:1600px){.scene-stage{grid-template-columns:minmax(0,1fr) 330px}.scene-canvas{height:520px}.scene-steps{padding-top:30px}.scene-step{padding-block:21px}.scene-explanation{padding-top:30px}}
@media(max-width:1050px){.scene-stage{grid-template-columns:minmax(0,1fr) 270px}.scene-canvas{aspect-ratio:auto;min-height:440px}.scene-art{object-fit:contain}.scene-photo{object-position:center}.scene-step{padding:15px 9px;font-size:11px;gap:10px}.scene-explanation{padding:22px 25px;min-height:150px}.scene-controls{margin:0 24px;gap:13px}}
@media(max-width:760px){.detail-hero.detail-hero-compact{padding-bottom:16px}.detail-hero-compact .detail-intro{font-size:16px}.motion-scene{margin-bottom:34px}.scene-heading{gap:16px;padding:22px 0}.scene-heading h2{font-size:24px;letter-spacing:-.4px;line-height:1.35}.scene-heading p:last-child{font-size:13px}.scene-sequence-count{display:none}.scene-stage{grid-template-columns:minmax(0,1fr)}.scene-canvas{height:auto;aspect-ratio:16/10;min-height:0}.scene-concept{top:15px;left:17px;font-size:8px;letter-spacing:.2px}.scene-story{border-left:0;border-top:1px solid var(--line)}.scene-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:12px 12px 0}.scene-step{font-size:12px;padding:13px 10px;gap:8px;min-height:54px}.scene-step-arrow{display:none}.scene-explanation{padding:22px 23px 18px;min-height:144px}.scene-explanation h3{font-size:19px}.scene-explanation p{font-size:13px;max-width:none}.scene-controls{margin:0 23px;padding:10px 0 13px}.scene-controls button{min-height:36px;font-size:12px}.scene-controls [data-scene-status]{font-size:10px}.scene-bottom-line{left:17px;right:17px;bottom:13px;font-size:7px;letter-spacing:.35px}.scene-art-label{right:17px;bottom:40px;font-size:8px;padding:6px 9px;letter-spacing:.5px}.scene-footnote{font-size:10px}.scene-heading .eyebrow{font-size:9px}}
@media(prefers-reduced-motion:reduce){.motion-scene *{animation:none!important;transition:none!important}}

/* Pause settles the selected stage immediately, including its fading labels. */
.motion-scene[data-playing=false] .scene-phase,
.motion-scene[data-playing=false] .scene-art-label{transition:none}
.scene-concept{font-size:11px;letter-spacing:.25px}
.scene-art-label{font-size:11px;letter-spacing:.65px}
@media(max-width:760px){
 .scene-concept{font-size:11px;line-height:1.45;max-width:calc(100% - 34px)}
 .scene-art-label{font-size:11px;letter-spacing:.25px}
 .scene-bottom-line{font-size:9px}
 .scene-footnote{font-size:11px}
 /* Both layers share the same crop, so inspection marks stay on the workpiece. */
 .scene-canvas-industrial .scene-photo,
 .scene-canvas-industrial .scene-art{transform:scale(1.7);transform-origin:66% 52%}
}
