/* ==========================================================================
   Motion layer – GSAP (assets/js/motion.js) owns all motion. These rules neutralise
   the CSS-only transitions so nothing animates twice, and add the drawn lines,
   masks, progress bar and packet the motion script uses.
   ========================================================================== */
[data-reveal] { opacity: 1; transform: none; transition: none; }
.vg-ticker__track { animation: none; }
.vg-viz__line { stroke-dasharray: none; stroke-dashoffset: 0; transition: none; }
.vg-viz__area { opacity: 0; transition: none; }
.vg-viz__dot, .vg-viz__label, .vg-hero-sys__signal, .vg-flow__step, .vg-bars__bar { opacity: 1; transform: none; transition: none; }
.vg-process--row .vg-process__step::before, .vg-feature::before { display: none; }
.vg-gs__rail::after { transition: none; }
.vg-gs.is-visible .vg-gs__rail::after { width: 0; height: 0; }
.vg-gs .vg-gs__rail.is-drawn::after, .vg-gs.is-visible .vg-gs__rail.is-drawn::after { height: calc(var(--vg-gs-progress, 0) * (100% - 24px)); width: 2px; }
@media (min-width: 1024px) { .vg-gs .vg-gs__rail.is-drawn::after, .vg-gs.is-visible .vg-gs__rail.is-drawn::after { height: 2px; width: calc(var(--vg-gs-progress, 0) * (100% - 24px)); } }

/* Line masks for SplitText headlines */
.vg-line-mask { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.vg-line { display: block; }

/* Page scroll progress – a thin growth line along the top edge */
.vg-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: var(--vg-green); transform: scaleX(0); transform-origin: left; z-index: 200; pointer-events: none; }

/* Drawn top-lines for feature cards and process steps */
.vg-feature, .vg-process--row .vg-process__step { position: relative; }
.vg-drawline { position: absolute; top: -1px; left: 0; height: 2px; width: 2.5rem; background: var(--vg-green); }
.vg-process--row .vg-process__step .vg-drawline { width: 100%; }
@media (max-width: 899px) { .vg-process .vg-drawline { display: none; } }

/* Travelling packet on the automation flow */
.vg-flow__list { position: relative; }
.vg-flow__packet { position: absolute; left: calc(1.25rem + 12px); top: 0; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--vg-yellow); box-shadow: 0 0 0 4px rgba(255,204,0,.25); opacity: 0; pointer-events: none; z-index: 2; }

/* Pinned growth-system section needs its own background so nothing shows through */
.vg-system { background: var(--vg-bg); }
/* Reduced motion: tangle shows its resolved state */
.vg-reduced .vg-tangle .vg-tangle__label--order { opacity: 1; }
.vg-reduced .vg-tangle .vg-tangle__label--chaos, .vg-reduced .vg-tangle .vg-tangle__link--extra { opacity: 0; }
/* Neutralise every remaining CSS-only reveal so GSAP is the single source of motion */
.vg-ui__cal-day, .vg-market__list li { opacity: 1; transform: none; transition: none; }
.vg-ui__cal-day--off { opacity: .5; }