
/* PAGE-SPECIFIC: Structural Steel Fabrication
   Hero line art: a beam travels through four plant stations (cut, drill, weld, mark).
   Uses only existing tokens. Reduced motion falls back to the base styles below
   (beam parked at station 04, all features shown) via the shared reduced-motion rule. */
.how-intro{max-width:60ch;margin:calc(var(--space-5) * -1) 0 var(--space-7)}
.fab-line{width:100%;height:auto}
.fab-line line,.fab-line polyline,.fab-line path,.fab-line rect,.fab-line ellipse{fill:none;stroke:var(--art-on-light);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.fab-line .fl-thin{stroke-width:.6}
.fab-line .fl-roller{stroke:var(--line-light);stroke-width:1}
.fab-line .fl-face,.fab-line .fl-plate{fill:var(--off-white)}
.fab-line .fl-tool rect{fill:var(--off-white)}
.fab-line .fl-stamp{fill:var(--yellow)}
.fab-line .fl-lbl circle{fill:none;stroke:var(--ink-muted);stroke-width:.7}
.fab-line text{font-family:var(--font-mono);font-size:7.5px;font-weight:500;letter-spacing:.06em;fill:var(--ink-muted)}
.fab-line .fl-cap{font-size:7px;fill:var(--black)}
.fab-line .fl-tag rect{fill:var(--yellow);stroke:var(--black);stroke-width:.6}
.fab-line .fl-tag line{stroke:var(--black);stroke-width:.5}
.fab-line .fl-num{fill:var(--black);font-weight:600;font-size:6.6px}
.fl-spark{opacity:0}
.fl-spark .core{fill:var(--yellow);stroke:none}
.fl-spark .halo{fill:var(--yellow);stroke:none;opacity:.3;transform-box:fill-box;transform-origin:center;animation:spark-pulse .3s ease-in-out infinite alternate}
.fl-beam{transform:translate(323.9px,187.0px);animation:fl-beam 16s cubic-bezier(.45,0,.35,1) infinite}
.fl-t1{animation:fl-t1 16s ease-in-out infinite}.fl-t2{animation:fl-t2 16s ease-in-out infinite}
.fl-t3{animation:fl-t3 16s ease-in-out infinite}.fl-t4{animation:fl-t4 16s ease-in-out infinite}
.fl-s1{animation:fl-s1 16s linear infinite}.fl-s2{animation:fl-s2 16s linear infinite}.fl-s3{animation:fl-s3 16s linear infinite}
.fl-f1{animation:fl-f1 16s linear infinite}.fl-f2{animation:fl-f2 16s linear infinite}
.fl-f3{animation:fl-f3 16s linear infinite}.fl-f4{animation:fl-f4 16s linear infinite}
@keyframes fl-beam{0%{transform:translate(-157.6px,-91.0px);opacity:0}3%{opacity:1}8%,20%{transform:translate(12.1px,7.0px)}26%,38%{transform:translate(116.0px,67.0px)}44%,56%{transform:translate(220.0px,127.0px)}62%,76%{transform:translate(323.9px,187.0px)}86%{opacity:1}92%,100%{transform:translate(502.3px,290.0px);opacity:0}}@keyframes fl-t1{0%,8%,20%,100%{transform:none}10%,18%{transform:translateY(17px)}}@keyframes fl-s1{0%,11%,17%,100%{opacity:0}12%,16%{opacity:1}}@keyframes fl-f1{0%,13%{opacity:0}14%,100%{opacity:1}}@keyframes fl-t2{0%,26%,38%,100%{transform:none}28%,36%{transform:translateY(17px)}}@keyframes fl-s2{0%,29%,35%,100%{opacity:0}30%,34%{opacity:1}}@keyframes fl-f2{0%,31%{opacity:0}32%,100%{opacity:1}}@keyframes fl-t3{0%,44%,56%,100%{transform:none}46%,54%{transform:translateY(17px)}}@keyframes fl-s3{0%,47%,53%,100%{opacity:0}48%,52%{opacity:1}}@keyframes fl-f3{0%,49%{opacity:0}50%,100%{opacity:1}}@keyframes fl-t4{0%,62%,76%,100%{transform:none}64%,74%{transform:translateY(17px)}}@keyframes fl-f4{0%,68%{opacity:0}69%,100%{opacity:1}}
