/* =========================
   KEYFRAMES
========================= */
@keyframes fadeUp    { from{opacity:0;transform:translateY(22px);} to{opacity:1;transform:translateY(0);} }
@keyframes lineUp    { to { transform:translateY(0); } }
@keyframes dot-pulse { 0%,100%{transform:scale(1);opacity:1;} 50%{transform:scale(1.7);opacity:.3;} }
@keyframes sc-fall   { 0%{top:-100%;} 60%{top:100%;} 100%{top:100%;} }

@keyframes orb-breathe {
  0%,100%{ box-shadow:0 0 0 12px rgba(7,62,129,.15), 0 0 40px rgba(7,62,129,.4); }
  50%    { box-shadow:0 0 0 22px rgba(7,62,129,.08), 0 0 60px rgba(7,62,129,.5); }
}
@keyframes node-float { 0%,100%{ transform:translateY(0px); } 50%{ transform:translateY(-9px); } }
@keyframes orbit-cw  { to { transform:rotate( 360deg); } }
@keyframes orbit-ccw { to { transform:rotate(-360deg); } }
@keyframes mq-scroll { from{transform:translateX(0);} to{transform:translateX(-50%);} }
@keyframes underline-draw { to { transform:scaleX(1); } }
@keyframes testimonial-scroll { from{transform:translateX(-50%);} to{transform:translateX(0);} }

/* =========================
   PLAY-BUTTON MOTION GRAPHICS
========================= */
#pa-e1 { animation: pa1 22s cubic-bezier(0.16,1,0.3,1) infinite; }
#pa-e2 { animation: pa2 22s cubic-bezier(0.16,1,0.3,1) infinite; }
#pa-e3 { animation: pa3 22s cubic-bezier(0.16,1,0.3,1) infinite; }
#pa-e4 { animation: pa4 22s cubic-bezier(0.16,1,0.3,1) infinite; }
#pa-e5 { animation: pa5 22s cubic-bezier(0.16,1,0.3,1) infinite; }

@keyframes pa1 {
  0%   { transform:translate(-55px,150px) scale(1); opacity:0; animation-timing-function:linear; }
  3%   { transform:translate(-10px,150px) scale(1); opacity:1; animation-timing-function:linear; }
  8%   { transform:translate(110px,150px) scale(1); animation-timing-function:cubic-bezier(0.16,1,0.3,1); }
  15%  { transform:translate(110px,150px) scale(1); }
  21%  { transform:translate(200px,132px) scale(2.1); }
  30%  { transform:translate(200px,132px) scale(2.1); }
  36%  { transform:translate(95px,105px) scale(0.7); }
  44%  { transform:translate(95px,105px) scale(0.7); }
  50%  { transform:translate(148px,146px) scale(0.84); }
  57%  { transform:translate(148px,146px) scale(0.84); }
  62%  { transform:translate(110px,150px) scale(1); }
  68%  { transform:translate(110px,150px) scale(1); }
  73%  { transform:translate(200px,150px) scale(0.14); }
  79%  { transform:translate(200px,150px) scale(0.14); }
  84%  { transform:translate(200px,150px) scale(1); opacity:1; }
  91%  { transform:translate(200px,150px) scale(1); }
  97%  { transform:translate(460px,150px) scale(1); opacity:1; }
  99%  { transform:translate(470px,150px) scale(1); opacity:0; }
  100% { transform:translate(-55px,150px) scale(1); opacity:0; }
}
@keyframes pa2 {
  0%   { transform:translate(200px,150px) scale(1); opacity:0; }
  8%   { transform:translate(200px,150px) scale(1); opacity:0; }
  13%  { transform:translate(200px,150px) scale(1); opacity:1; }
  15%  { transform:translate(200px,150px) scale(1); }
  21%  { transform:translate(312px,202px) scale(0.44); opacity:0.35; }
  30%  { transform:translate(312px,202px) scale(0.44); opacity:0.35; }
  36%  { transform:translate(200px,105px) scale(0.7); opacity:1; }
  44%  { transform:translate(200px,105px) scale(0.7); }
  50%  { transform:translate(170px,150px) scale(0.84); }
  57%  { transform:translate(170px,150px) scale(0.84); }
  58%  { transform:translate(170px,150px) scale(0.84); opacity:0; }
  60%  { transform:translate(290px,150px) scale(-1,1); opacity:0; }
  62%  { transform:translate(290px,150px) scale(-1,1); opacity:1; }
  68%  { transform:translate(290px,150px) scale(-1,1); opacity:1; }
  69%  { transform:translate(290px,150px) scale(-1,1); opacity:0; }
  71%  { transform:translate(78px,215px) scale(0.14); opacity:0; }
  73%  { transform:translate(78px,215px) scale(0.14); opacity:0.38; }
  79%  { transform:translate(78px,215px) scale(0.14); opacity:0.38; }
  84%  { transform:translate(200px,150px) scale(1); opacity:0; }
  100% { transform:translate(200px,150px) scale(1); opacity:0; }
}
@keyframes pa3 {
  0%   { transform:translate(200px,150px) scale(1); opacity:0; }
  13%  { transform:translate(200px,150px) scale(1); opacity:0; }
  17%  { transform:translate(290px,150px) scale(1); opacity:1; }
  21%  { transform:translate(290px,150px) scale(1); }
  27%  { transform:translate(88px,202px) scale(0.44); opacity:0.35; }
  30%  { transform:translate(88px,202px) scale(0.44); opacity:0.35; }
  36%  { transform:translate(305px,105px) scale(0.7); opacity:1; }
  44%  { transform:translate(305px,105px) scale(0.7); }
  50%  { transform:translate(162px,163px) scale(0.84); }
  57%  { transform:translate(162px,163px) scale(0.84); }
  62%  { transform:translate(162px,163px) scale(0.84); opacity:0; }
  73%  { transform:translate(322px,88px) scale(0.14); opacity:0.38; }
  79%  { transform:translate(322px,88px) scale(0.14); opacity:0.38; }
  84%  { transform:translate(200px,150px) scale(1); opacity:0; }
  100% { transform:translate(200px,150px) scale(1); opacity:0; }
}
@keyframes pa4 {
  0%   { transform:translate(148px,192px) scale(0.7); opacity:0; }
  33%  { transform:translate(148px,192px) scale(0.7); opacity:0; }
  36%  { transform:translate(148px,192px) scale(0.7); opacity:1; }
  44%  { transform:translate(148px,192px) scale(0.7); }
  50%  { transform:translate(184px,154px) scale(0.84); }
  57%  { transform:translate(184px,154px) scale(0.84); }
  62%  { transform:translate(200px,150px) scale(1); opacity:0; }
  100% { transform:translate(200px,150px) scale(1); opacity:0; }
}
@keyframes pa5 {
  0%   { transform:translate(252px,192px) scale(0.7); opacity:0; }
  33%  { transform:translate(252px,192px) scale(0.7); opacity:0; }
  36%  { transform:translate(252px,192px) scale(0.7); opacity:1; }
  44%  { transform:translate(252px,192px) scale(0.7); }
  50%  { transform:translate(252px,192px) scale(0.7); opacity:0; }
  100% { transform:translate(252px,192px) scale(0.7); opacity:0; }
}