/* ═══════════════════════════════════════════════════════
   SignZen — Centralized @keyframes
   All animation definitions for funcionalidades pages.
   Declared once here; pages must NOT redeclare these.
═══════════════════════════════════════════════════════ */

/* ── Shared across all pages ── */
@keyframes fhFloat {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-9px); }
}

@keyframes fhSpin {
  to { transform: rotate(360deg); }
}

@keyframes fhProgress {
  0%   { width: 0%;  }
  65%  { width: 78%; }
  100% { width: 0%;  }
}

@keyframes fhPulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .4; transform: scale(.7); }
}

@keyframes fhScan {
  0%   { top: 0;    opacity: 1; }
  50%  { top: 100%; opacity: .5; }
  100% { top: 0;    opacity: 1; }
}

/* ── Glow effects ── */
@keyframes shieldGlow {
  0%,100% { filter: drop-shadow(0 0 6px rgba(59,130,246,.35)); }
  50%      { filter: drop-shadow(0 0 18px rgba(59,130,246,.65)); }
}

@keyframes sealGlow {
  0%,100% { box-shadow: 0 8px 24px rgba(59,130,246,.3); }
  50%      { box-shadow: 0 8px 36px rgba(59,130,246,.6); }
}

/* ── documentos.html ── */
@keyframes dniScan {
  0%   { top: 0%;   opacity: 1; }
  50%  { top: 100%; opacity: .6; }
  100% { top: 0%;   opacity: 1; }
}

@keyframes ocrBlink {
  0%,100% { opacity: 0; }
  40%,60% { opacity: 1; }
}

@keyframes alertPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(239,68,68,.3); }
  50%      { box-shadow: 0 0 0 6px rgba(239,68,68,0); }
}

/* ── rostros.html ── */
@keyframes faceScan {
  0%   { top: 0%;   opacity: 1; }
  50%  { top: 100%; opacity: .5; }
  100% { top: 0%;   opacity: 1; }
}

@keyframes dotBlink {
  0%,100% { opacity: 0; transform: scale(0); }
  40%,60% { opacity: 1; transform: scale(1); }
}

@keyframes connPulse {
  0%   { left: 0%;   opacity: 1; }
  100% { left: 100%; opacity: 0; }
}

@keyframes timerFill {
  0%  { stroke-dashoffset: 226; }
  65% { stroke-dashoffset: 30;  }
  100%{ stroke-dashoffset: 226; }
}

/* ── firma.html ── */
@keyframes sigWrite {
  0%,20%  { clip-path: inset(0 100% 0 0); opacity: 0; }
  40%,80% { clip-path: inset(0 0% 0 0);   opacity: 1; }
  90%,100%{ clip-path: inset(0 0% 0 0);   opacity: .6; }
}

@keyframes penMove {
  0%,15%  { left: 0%;  opacity: 0; }
  25%     { opacity: 1; }
  80%     { left: 80%; opacity: 1; }
  90%,100%{ left: 82%; opacity: 0; }
}

@keyframes trailGrow {
  0%,15%  { width: 0%;  }
  80%     { width: 80%; }
  90%,100%{ width: 0%;  }
}

/* ── otp.html ── */
@keyframes blink {
  0%,100% { opacity: 1; }
  50%     { opacity: 0; }
}

@keyframes boxPulse {
  0%,100% { border-color: rgba(59,130,246,.7); }
  50%      { border-color: rgba(59,130,246,.3); }
}

@keyframes sendPulse {
  0%   { opacity: 1; transform: scale(1);   }
  100% { opacity: 0; transform: scale(1.5); }
}

/* ── formularios.html ── */
@keyframes dataFlow {
  to { left: 150%; }
}

@keyframes highlightPulse {
  0%,100% { opacity: 1; }
  50%     { opacity: .5; }
}

/* ── auditoria.html ── */
@keyframes livePulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(34,197,94,.2); }
  50%      { box-shadow: 0 0 0 6px rgba(34,197,94,0);  }
}

@keyframes stampRotate {
  to { transform: rotate(360deg); }
}

@keyframes chainPulse {
  0%   { top: 0%;   opacity: 1; }
  100% { top: 100%; opacity: 0; }
}