/* svc-api.html — hero animation (prefix: ap-)
   Theme: OpenAPI spec → generated SDKs + token-bucket rate limiter + live request log */
@keyframes apGlow { 0%,100% { opacity: 0.08; } 50% { opacity: 0.2; } }
@keyframes apFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes apTokDrain {
  0%   { opacity: 1; transform: translateY(0); }
  50%  { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(22px); }
}
@keyframes apLogIn { from { opacity: 0; transform: translateX(-12px); } to { opacity: 1; transform: translateX(0); } }
.ap-glow { animation: apGlow 3.5s ease-in-out infinite; }
.ap-spec { animation: apFade 0.5s var(--ease-spring) 0.4s both; }
.ap-sdk  { }
.ap-sdk1 { animation: apFade 0.45s var(--ease-spring) 0.7s both; }
.ap-sdk2 { animation: apFade 0.45s var(--ease-spring) 0.85s both; }
.ap-sdk3 { animation: apFade 0.45s var(--ease-spring) 1.0s both; }
.ap-sdk4 { animation: apFade 0.45s var(--ease-spring) 1.15s both; }
.ap-bucket { animation: apFade 0.5s var(--ease-spring) 1.25s both; }
.ap-tok { transform-box: fill-box; transform-origin: center; }
.ap-t1 { animation: apTokDrain 3s ease-in-out 1.8s infinite; }
.ap-t2 { animation: apTokDrain 3s ease-in-out 2.0s infinite; }
.ap-t3 { animation: apTokDrain 3s ease-in-out 2.2s infinite; }
.ap-t4 { animation: apTokDrain 3s ease-in-out 2.4s infinite; }
.ap-t5 { animation: apTokDrain 3s ease-in-out 2.6s infinite; }
.ap-t6 { animation: apTokDrain 3s ease-in-out 2.8s infinite; }
.ap-t7 { animation: apTokDrain 3s ease-in-out 3.0s infinite; }
.ap-log  { animation: apFade 0.5s var(--ease-spring) 1.4s both; }
.ap-line { animation: apLogIn 0.4s ease-out both; }
.ap-log1 { animation-delay: 1.7s; }
.ap-log2 { animation-delay: 1.9s; }
.ap-log3 { animation-delay: 2.1s; }