/* ══════════════════════════════════════════════════
   SM Infotel – Coming Soon  |  sminfotel-animations.css
   Dedicated animation file — paste separately
   ══════════════════════════════════════════════════ */

/* ── GENERIC FADE-UP UTILITY ─────────────────── */
.vtq-anim-fadein {
  opacity: 0;
  transform: translateY(18px);
  animation: vtqGenFadeUp 0.9s cubic-bezier(0.22,1,0.36,1) var(--vtq-d, 0s) both;
}

@keyframes vtqGenFadeUp {
  to { opacity:1; transform:translateY(0); }
}

/* ── LOGO SHIMMER ───────────────────────────── */
@keyframes vtqLogoShimmer {
  0%,100% { filter: drop-shadow(0 0 10px rgba(232,25,44,0.4)) drop-shadow(0 0 4px rgba(0,198,255,0.2)); }
  50%      { filter: drop-shadow(0 0 22px rgba(232,25,44,0.7)) drop-shadow(0 0 16px rgba(0,198,255,0.4)); }
}

.vtq-logo-wrap { animation: vtqLogoDrop 1.4s cubic-bezier(0.22,1,0.36,1) both, vtqLogoShimmer 4s 2s ease-in-out infinite; }

/* ── CIRCUIT NODE PULSE ──────────────────────── */
@keyframes vtqNodePulse {
  0%,100% { transform:scale(1);   opacity:0.6; }
  50%      { transform:scale(2);   opacity:1; }
}

@keyframes vtqNodeTrail {
  0%   { stroke-dashoffset: 100; opacity:0; }
  30%  { opacity:0.5; }
  100% { stroke-dashoffset: 0; opacity:0; }
}

/* ── GLITCH EFFECT ──────────────────────────── */
@keyframes vtqGlitch {
  0%,90%,100% { clip-path:none; transform:translate(0); }
  91%   { clip-path:inset(20% 0 60% 0); transform:translate(-4px,0); }
  92%   { clip-path:inset(50% 0 30% 0); transform:translate(4px,0); color: #e8192c; }
  93%   { clip-path:inset(70% 0 10% 0); transform:translate(-2px,0); }
  94%   { clip-path:none; transform:translate(0); }
}

.vtq-coming-soon { animation: vtqComingSoonGlow 2.5s ease-in-out infinite alternate, vtqGlitch 8s step-end infinite; }

/* ── HUD BORDER ANIMATION ───────────────────── */
@keyframes vtqHudBorderScan {
  0%   { box-shadow: 0 0 0 0 rgba(0,198,255,0), 0 0 30px rgba(0,198,255,0.06), inset 0 0 30px rgba(0,198,255,0.03); }
  50%  { box-shadow: 0 0 0 2px rgba(0,198,255,0.2), 0 0 40px rgba(0,198,255,0.12), inset 0 0 20px rgba(0,198,255,0.06); }
  100% { box-shadow: 0 0 0 0 rgba(0,198,255,0), 0 0 30px rgba(0,198,255,0.06), inset 0 0 30px rgba(0,198,255,0.03); }
}

.vtq-hud-wrap { animation: vtqHudIn 1s 1.6s cubic-bezier(0.22,1,0.36,1) forwards, vtqHudBorderScan 4s 2.6s ease-in-out infinite; }

/* ── SERVICE CARD HOVER GLOW ─────────────────── */
@keyframes vtqSvcGlow {
  from { box-shadow: none; }
  to   { box-shadow: 0 0 16px rgba(0,198,255,0.25); }
}

/* ── DATA STREAM TEXT FADE ───────────────────── */
@keyframes vtqDsCharFlash {
  0%,100% { opacity: 0.15; }
  50%      { opacity: 0.5; }
}

/* ── TICKER PAUSE ON HOVER ───────────────────── */
.vtq-alert-bar:hover .vtq-ticker-track { animation-play-state: paused; }

/* ── CTA BOX BORDER PULSE ────────────────────── */
@keyframes vtqCtaBorderPulse {
  0%,100% { border-color: rgba(232,25,44,0.35); }
  50%      { border-color: rgba(232,25,44,0.7); box-shadow: 0 0 20px rgba(232,25,44,0.15); }
}

.vtq-cta-box { animation: vtqCtaBorderPulse 3s ease-in-out infinite; }

/* ── PROGRESS BAR ANIMATION (JS-driven) ─────── */
/* .vtq-prog-fill width is animated via JS, transition defined in main css */

/* ── ALERT LABEL FLASH ───────────────────────── */
@keyframes vtqAlertFlash {
  0%,100% { background: #e8192c; }
  50%      { background: #ff4d5e; }
}

.vtq-alert-label:first-child { animation: vtqAlertFlash 2s ease-in-out infinite; }

/* ── PAGE LOAD OVERLAY ───────────────────────── */
@keyframes vtqBootOverlay {
  0%   { opacity:1; }
  80%  { opacity:1; }
  100% { opacity:0; pointer-events:none; }
}

/* ── FLOATING HEXAGONS (JS spawned) ─────────── */
@keyframes vtqHexFloat {
  0%   { transform:translateY(0) rotate(0deg);    opacity:0; }
  5%   { opacity:0.15; }
  95%  { opacity:0.1; }
  100% { transform:translateY(-110vh) rotate(180deg); opacity:0; }
}

.vtq-hex-particle {
  position: fixed;
  pointer-events: none;
  border: 1px solid;
  opacity: 0;
  animation: vtqHexFloat linear infinite;
}

/* ── SIGNAL WAVE RIPPLE (JS spawned) ─────────── */
@keyframes vtqSigRipple {
  0%   { transform:translate(-50%,-50%) scale(0); opacity:0.8; }
  100% { transform:translate(-50%,-50%) scale(3); opacity:0; }
}

.vtq-sig-ripple {
  position: fixed;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 2px solid var(--vtq-cyan);
  pointer-events: none; z-index: 9997;
  animation: vtqSigRipple 0.8s cubic-bezier(0,0.5,0.5,1) forwards;
}

/* ── BOOT SEQUENCE TEXT (JS spawned) ─────────── */
@keyframes vtqBootLine {
  from { opacity:0; transform:translateX(-6px); }
  to   { opacity:1; transform:translateX(0); }
}

/* ── CURSOR CLICK BURST ───────────────────────── */
@keyframes vtqClickBurst {
  0%   { transform:translate(-50%,-50%) scale(0); opacity:0.9; border-width:3px; }
  100% { transform:translate(-50%,-50%) scale(2.5); opacity:0; border-width:1px; }
}

.vtq-click-burst {
  position: fixed; z-index: 9998;
  width: 30px; height: 30px;
  border: 3px solid var(--vtq-red);
  border-radius: 50%;
  pointer-events: none;
  animation: vtqClickBurst 0.5s ease-out forwards;
}

/* ── NEON UNDERLINE ──────────────────────────── */
@keyframes vtqNeonPulse {
  0%,100% { box-shadow: 0 1px 0 0 rgba(0,198,255,0.4), 0 2px 8px rgba(0,198,255,0.15); }
  50%      { box-shadow: 0 1px 0 0 rgba(0,198,255,0.9), 0 2px 16px rgba(0,198,255,0.4); }
}

.vtq-mail-link { animation: vtqNeonPulse 2.5s ease-in-out infinite; }