/* Data Motion (js/cc-data-motion.js). Start states apply only under html.cc-dm-ready, which the script adds; without it,
   or under reduced motion, everything shows at its final state. Transform and opacity only. */
.cc-dm-num { font-variant-numeric: tabular-nums; }
html.cc-dm-ready .cc-dm-bar { transform: scaleX(0); transform-origin: 0 50%; }
html.cc-dm-ready .cc-dm-in .cc-dm-bar { transform: none; transition: transform .95s cubic-bezier(.22, 1, .36, 1) var(--dm-d, 0ms); }
html.cc-dm-ready .cc-dm-seq { opacity: 0; transform: translateY(6px); }
html.cc-dm-ready .cc-dm-in .cc-dm-seq { opacity: 1; transform: none; transition: opacity .45s ease-out var(--dm-d, 0ms), transform .5s cubic-bezier(.22, 1, .36, 1) var(--dm-d, 0ms); }
html.cc-dm-ready .cc-dm-in .cc-code .cc-l-hi { transition-property: opacity, transform, background-color; }
/* Pipeline connectors draw left to right, then a pulse travels each one twice. */
html.cc-dm-ready .cc-scr-stack li + li::before { transform: scaleX(0); transform-origin: 0 50%; }
html.cc-dm-ready .cc-scr-stack.is-in li + li::before { transform: none; transition: transform .5s cubic-bezier(.22, 1, .36, 1) calc(var(--dm-d, 0ms) + 150ms); }
html.cc-dm-ready .cc-scr-stack.is-in li + li::after { content: ""; position: absolute; left: -22px; top: calc(50% - 2px); width: 6px; height: 6px; border-radius: 50%;
	background: #fff; opacity: 0; animation: cc-dm-pulse 1.6s cubic-bezier(.4, 0, .2, 1) calc(var(--dm-d, 0ms) + 700ms) 2; }
@keyframes cc-dm-pulse { 0% { opacity: 0; transform: translateX(0); } 20% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateX(16px); } }
/* The live status dot pulses a few times. */
html.cc-dm-ready .cc-dm-in .cc-scr-status i { animation: cc-dm-live 1.8s ease-out .6s 4; }
@keyframes cc-dm-live { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--color-main, #FF6B1F) 60%, transparent); } 100% { box-shadow: 0 0 0 8px transparent; } }
/* Map pins pop in order (IMG-24 Image with Numbered Points). */
html.cc-dm-ready .cc-dm-pin { opacity: 0; scale: .4; }
html.cc-dm-ready .cc-dm-in .cc-dm-pin { opacity: 1; scale: 1; transition: opacity .3s ease-out var(--dm-d, 0ms), scale .55s cubic-bezier(.34, 1.56, .64, 1) var(--dm-d, 0ms); }
/* A Screen in the hero rises into place with a slight scale. */
html.cc-dm-ready .ct7-ce-frame.has-screen > .cc-screen { opacity: 0; transform: translateY(28px) scale(.985); }
html.cc-dm-ready .ct7-ce-frame.has-screen > .cc-screen.cc-dm-in { opacity: 1; transform: none; transition: opacity .7s ease-out .25s, transform .9s cubic-bezier(.22, 1, .36, 1) .25s; }
@media (prefers-reduced-motion: reduce) {
	html.cc-dm-ready *:is(.cc-dm-bar, .cc-dm-seq, .cc-dm-pin, .cc-scr-stack li + li::before, .ct7-ce-frame.has-screen > .cc-screen) { opacity: 1 !important; transform: none !important; scale: 1 !important; transition: none !important; animation: none !important; }
}
@media print { html.cc-dm-ready *:is(.cc-dm-bar, .cc-dm-seq, .cc-dm-pin, .cc-screen) { opacity: 1 !important; transform: none !important; scale: 1 !important; } }
