/* ═════════════════════════════════════════════════════════════════════════════
   Factory.ai Animations — Mechanical / Technical
   Replaces organic blobs with precision timing
   ═════════════════════════════════════════════════════════════════════════════ */

/* ── Data Grid Pulse — background grid subtle pulsation ── */
@keyframes gridPulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.5; }
}

/* ── Dot Pulse — terminal-style heartbeat ── */
@keyframes dotPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.3); opacity: 0.6; }
}

/* ── Mechanical Scan — CRT scanline ── */
@keyframes scanLine {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}

/* ── Blink — cursor/terminal ── */
@keyframes blink { 50% { opacity: 0; } }

/* ── Signal Pulse — accent dot glow ── */
@keyframes signalPulse {
  0%, 100% { box-shadow: 0 0 4px var(--accent), 0 0 0 0 rgba(212, 86, 40, 0.4); }
  50% { box-shadow: 0 0 8px var(--accent), 0 0 0 6px rgba(212, 86, 40, 0); }
}

/* ── Border Draw — dashed border reveal ── */
@keyframes borderDraw {
  0% { border-color: transparent; }
  100% { border-color: var(--border); }
}

/* ── Glitch Flicker — subtle text/element glitch ── */
@keyframes glitchFlicker {
  0%, 100% { opacity: 1; transform: translate(0); }
  2% { opacity: 0.8; transform: translate(-1px, 1px); }
  4% { opacity: 1; transform: translate(1px, -1px); }
  6% { opacity: 1; transform: translate(0); }
}

/* ── Data Flow — horizontal ticker for accents ── */
@keyframes dataFlow {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* ── Typewriter Cursor — block cursor blink ── */
@keyframes typeCursor {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

/* ── Theme Transition ── */
.theme-transition-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  pointer-events: none;
  overflow: hidden;
}

/* Ripple Rings (Aesthetic "Drop in Lake" effect) */
.ripple-ring {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
  border: 2px solid var(--accent);
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
}

/* View Transition API Support */
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  z-index: 1;
}

::view-transition-new(root) {
  z-index: 2;
}

/* Circular Reveal Keyframes */
@keyframes circular-reveal {
  from {
    clip-path: circle(0% at var(--ripple-x) var(--ripple-y));
  }
  to {
    clip-path: circle(150% at var(--ripple-x) var(--ripple-y));
  }
}

.revealing::view-transition-new(root) {
  animation: 700ms cubic-bezier(0.4, 0, 0.2, 1) circular-reveal;
}
