/* AEDO engineering diagram system — figure styling + restrained scroll reveal.
   Usage:
     <figure class="eng-figure" data-anim>
       <span class="eng-fig-tag">Figure N — Title</span>
       <svg ...> ...inline SVG... </svg>
       <figcaption class="eng-figcaption">...</figcaption>
     </figure>
   Then include eng-diagram.js on the page.
   Animatable SVG elements take one motion class + an optional delay class:
     a-draw  -> stroke draws itself in   (element needs pathLength="1")
     a-fade  -> fades in
     a-pop   -> fades + scales in
     d1..d4  -> stagger the start
   Motion is enhancement only: it is fully disabled under prefers-reduced-motion,
   and the hidden-initial state engages only after JS adds .anim-ready, so no-JS
   users (and non-rendering crawlers) always see the complete static diagram. */

.eng-figure{margin:28px 0 10px;background:#0a1622;border:1px solid #1a2a3a;border-radius:12px;padding:18px 18px 8px;}
.eng-figure svg{width:100%;height:auto;display:block;}
.eng-fig-tag{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#5b92e5;display:block;margin:0 2px 10px;}
.eng-figcaption{font-size:12px;color:#6b84a8;line-height:1.6;margin:12px 2px 6px;font-style:italic;}
.eng-figcaption strong{color:#9fb4cc;font-style:normal;}

@media (prefers-reduced-motion: no-preference){
  .eng-figure[data-anim].anim-ready .a-draw{stroke-dasharray:1;stroke-dashoffset:1;}
  .eng-figure[data-anim].anim-ready .a-fade{opacity:0;}
  .eng-figure[data-anim].anim-ready .a-pop{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;}
  .eng-figure[data-anim].play .a-draw{animation:eqdraw 1s ease forwards;}
  .eng-figure[data-anim].play .a-fade{animation:eqfade .7s ease forwards;}
  .eng-figure[data-anim].play .a-pop{animation:eqpop .63s cubic-bezier(.2,.8,.3,1.25) forwards;}
  /* Delay must be scoped to .play and declared after the animation shorthands
     above (which reset animation-delay to 0) so the stagger actually applies. */
  .eng-figure[data-anim].play .d1{animation-delay:.38s;}
  .eng-figure[data-anim].play .d2{animation-delay:.81s;}
  .eng-figure[data-anim].play .d3{animation-delay:1.25s;}
  .eng-figure[data-anim].play .d4{animation-delay:1.69s;}
}
@keyframes eqdraw{to{stroke-dashoffset:0;}}
@keyframes eqfade{to{opacity:1;}}
@keyframes eqpop{to{opacity:1;transform:scale(1);}}
