/* Industry scenes. Base styles = final/static frame. Animations run only on svg.anim.run */
.anim{width:100%;height:auto;display:block;overflow:hidden}
.anim .lbl{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;fill:#97A3B1;text-transform:uppercase}
.anim .ln{fill:none;stroke:rgba(255,255,255,.2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.anim .ln.t{stroke:#41C3D3;stroke-opacity:.7}
.anim .ln2{fill:none;stroke:rgba(255,255,255,.09);stroke-width:1}
.anim .pipe{fill:none;stroke:rgba(255,255,255,.1);stroke-width:13;stroke-linecap:round;stroke-linejoin:round}
.anim .draw{stroke-dasharray:1;stroke-dashoffset:0}
.anim .flow{fill:none;stroke-dasharray:.03 .22;stroke-dashoffset:0;stroke-linecap:round;stroke-linejoin:round}
.anim .flow.slow{stroke-dasharray:.02 .48;opacity:.85}
.anim .flow.fast{stroke-dasharray:.06 .94}
.anim .dot{stroke-dasharray:.001 2;stroke-dashoffset:-1}
.anim .pop,.anim .ring,.anim .rise,.anim .level,.anim .assemble,.anim .node{transform-box:fill-box;transform-origin:center}
.anim .rise,.anim .level{transform-origin:50% 100%}
.anim .level{transform:scaleY(var(--l,1))}
.anim .ring{opacity:.28}
.anim .spin,.anim .sway{transform-box:view-box}
.anim .sway{transform:rotate(-6deg)}.anim .sway.rev{transform:rotate(6deg)}
.anim .lit{fill:#F7931E}
.anim .move{transform:translateX(260px)}
.anim .twinkle{opacity:.8}

.anim.run .draw{animation:a-draw 1.8s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0s)}
.anim.run .flow{animation:a-flow var(--t,4s) linear infinite;animation-delay:var(--d,0s)}
.anim.run .pop{animation:a-pop .9s cubic-bezier(.34,1.35,.64,1) both;animation-delay:var(--d,0s)}
.anim.run .ring{animation:a-ring 2.8s cubic-bezier(.16,1,.3,1) infinite;animation-delay:var(--d,0s)}
.anim.run .blink{animation:a-blink 2.4s ease-in-out infinite;animation-delay:var(--d,0s)}
.anim.run .node{animation:a-node 2.4s ease-in-out infinite;animation-delay:var(--d,0s)}
.anim.run .spin{animation:a-spin 5s linear infinite}
.anim.run .level{animation:a-level 3.6s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
.anim.run .drop{animation:a-drop 1.8s ease-in infinite}
.anim.run .rise{animation:a-rise 1.1s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0s)}
.anim.run .fall{animation:a-fall 2.7s cubic-bezier(.55,0,.7,.4) infinite;animation-delay:var(--d,0s)}
.anim.run .sway{animation:a-sway 5s ease-in-out infinite alternate}
.anim.run .sway.rev{animation-name:a-sway-r}
.anim.run .assemble{animation:a-assemble 1.4s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0s)}
.anim.run .twinkle{animation:a-blink 1.9s ease-in-out infinite;animation-delay:var(--d,0s)}
.anim.run .move{animation:a-move 7.2s linear infinite;animation-delay:var(--d,0s)}
.anim.run .dot{animation:a-dot 6s cubic-bezier(.45,0,.55,1) infinite}
.anim.run .lit1{animation:a-lit1 6s infinite}.anim.run .lit2{animation:a-lit2 6s infinite}.anim.run .lit3{animation:a-lit3 6s infinite}.anim.run .lit4{animation:a-lit4 6s infinite}.anim.run .lit5{animation:a-lit5 6s infinite}
.anim.paused *{animation-play-state:paused!important}

@keyframes a-draw{from{stroke-dashoffset:1}}
@keyframes a-flow{to{stroke-dashoffset:-1}}
@keyframes a-pop{from{opacity:0;transform:scale(.4)}}
@keyframes a-ring{0%{transform:scale(.55);opacity:.85}100%{transform:scale(1.9);opacity:0}}
@keyframes a-blink{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes a-node{0%,100%{fill:#0C131C}45%,55%{fill:#41C3D3}}
@keyframes a-spin{to{transform:rotate(360deg)}}
@keyframes a-level{from{transform:scaleY(calc(var(--l,1) * .35))}to{transform:scaleY(var(--l,1))}}
@keyframes a-drop{0%{transform:translateY(-6px);opacity:0}25%{opacity:1}85%{opacity:1}100%{transform:translateY(24px);opacity:0}}
@keyframes a-rise{from{transform:scaleY(0)}}
@keyframes a-fall{0%{transform:translate(0,0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translate(var(--dx,0),178px);opacity:0}}
@keyframes a-sway{from{transform:rotate(-9deg)}to{transform:rotate(7deg)}}
@keyframes a-sway-r{from{transform:rotate(9deg)}to{transform:rotate(-7deg)}}
@keyframes a-assemble{from{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.6)}}
@keyframes a-move{from{transform:translateX(0)}to{transform:translateX(620px)}}
@keyframes a-dot{0%{stroke-dashoffset:0}80%,100%{stroke-dashoffset:-1}}
@keyframes a-lit1{0%,1%{fill:#121B27}3%,92%{fill:#F7931E}100%{fill:#121B27}}
@keyframes a-lit2{0%,16%{fill:#121B27}18%,92%{fill:#F7931E}100%{fill:#121B27}}
@keyframes a-lit3{0%,36%{fill:#121B27}38%,92%{fill:#F7931E}100%{fill:#121B27}}
@keyframes a-lit4{0%,56%{fill:#121B27}58%,92%{fill:#F7931E}100%{fill:#121B27}}
@keyframes a-lit5{0%,78%{fill:#121B27}80%,92%{fill:#F7931E}100%{fill:#121B27}}

/* Scene panel (service hero / home feature) */
.scene-panel{position:relative;border-radius:24px;border:1px solid var(--line-d2);background:radial-gradient(120% 90% at 80% 0%,rgba(14,138,152,.16),transparent 60%),linear-gradient(160deg,#0E1621,#0A1018);overflow:hidden;isolation:isolate}
.scene-panel::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:24px 24px}
.scene-panel{padding-bottom:30px}
.scene-panel .anim{padding:6px}
.scene-meta{position:absolute;left:18px;right:18px;bottom:14px;display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d)}
.scene-meta .live{display:inline-flex;align-items:center;gap:7px;color:var(--teal)}
.scene-meta .live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 8px var(--teal)}

/* Card hover preview */
.svc-scene{position:absolute;top:14px;right:14px;width:38%;max-width:150px;opacity:0;transform:translateY(6px) scale(.96);transition:opacity .45s var(--ease),transform .6s var(--ease);pointer-events:none;border-radius:12px;background:rgba(7,11,17,.55)}
.svc-scene .lbl{display:none}
.svc-top .tag{transition:opacity .3s}
@media (hover:hover){
  .svc-link:hover .svc-scene,.svc-link:focus-visible .svc-scene{opacity:1;transform:none}
  .svc-link:hover .svc-top .tag,.svc-link:focus-visible .svc-top .tag{opacity:0}
}
@media (hover:none){.svc-scene{display:none}}
@media (prefers-reduced-motion:reduce){.anim *{animation:none!important}}