/* rescue-bolt.html — hero animation (prefix: bl-)
   Theme: Isolated floating components (red) → backend skeleton (API / DB / Auth) stacks in */
@keyframes blGlow { 0%,100% { opacity: 0.08; } 50% { opacity: 0.2; } }
@keyframes blDrift {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-4px); }
}
@keyframes blSlide { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes blFlow  { 0% { stroke-dashoffset: 16; opacity: 0; } 25% { opacity: 1; } 75% { opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes blBlink { 0%,100% { opacity: 0.75; } 50% { opacity: 1; } }
.bl-glow   { animation: blGlow 3.5s ease-in-out infinite; }
.bl-float  { transform-box: fill-box; transform-origin: center; }
.bl-f1 { animation: blSlide 0.4s var(--ease-spring) 0.4s both, blDrift 3s ease-in-out 1.3s infinite; }
.bl-f2 { animation: blSlide 0.4s var(--ease-spring) 0.55s both, blDrift 3.4s ease-in-out 1.5s infinite; }
.bl-f3 { animation: blSlide 0.4s var(--ease-spring) 0.7s both, blDrift 3.2s ease-in-out 1.7s infinite; }
.bl-nobackend { animation: blBlink 2s ease-in-out 1.2s infinite; }
.bl-line  { animation: blSlide 0.4s ease-out 1.0s both; }
.bl-after g, .bl-after rect, .bl-after text { }
.bl-after { animation: blSlide 0.55s var(--ease-spring) 1.2s both; }
.bl-after rect:nth-of-type(2) { animation: blSlide 0.5s var(--ease-spring) 1.35s both; }
.bl-after rect:nth-of-type(3) { animation: blSlide 0.5s var(--ease-spring) 1.5s both; }
.bl-conn  { stroke-dasharray: 6; }
.bl-c1 { animation: blFlow 2.4s linear 1.8s infinite; }
.bl-c2 { animation: blFlow 2.4s linear 2.0s infinite; }
.bl-c3 { animation: blFlow 2.4s linear 2.2s infinite; }