/* ============================================================
   HIGH VALUE DEALS — detail panel animation
   Panel: 1070×624px (rendered). Image scale: 50% of 2140×1248.
   Popover PNG: sugarai-insight-popover.png (1052×426px → displayed at 526×213px)
============================================================ */

.hvd-panel {
  position: relative;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.hvd-panel.is-animating {
  opacity: 1;
}

/* Scene overlay — covers the full panel */
.hvd-scene {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 10;
}

/* ——— Cursor ——— */

.hvd-cursor {
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  opacity: 0;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.18));
  will-change: transform, opacity;
}

/* ——— Popover ——— */

.hvd-popover {
  position: absolute;
  /* Positioned below the "Stalled 14 days" pill (New Logo Initiative row) */
  top: 268px;
  left: 298px;
  width: 530px;
  height: auto;
  opacity: 0;
  border-radius: 12px;
  will-change: opacity, transform;
}

/* ——— Animations (triggered by .is-animating on the panel) ——— */

/* Cursor moves from off-panel right → "Stalled 14 days" pill (~635px, ~265px) */
.hvd-panel.is-animating .hvd-cursor {
  animation: hvd-cursor 2200ms 500ms cubic-bezier(0.4, 0, 0.2, 1) both;
}

.hvd-panel.is-animating .hvd-popover {
  animation: hvd-popover 2000ms 1700ms ease-out both;
}

@keyframes hvd-cursor {
  0%   { opacity: 0; transform: translate(1000px, 120px); }
  14%  { opacity: 1; transform: translate(1000px, 120px); }
  45%  { opacity: 1; transform: translate(685px, 265px); }
  54%  { opacity: 1; transform: translate(685px, 265px) scale(0.82); }
  63%  { opacity: 1; transform: translate(685px, 265px) scale(1); }
  82%  { opacity: 1; transform: translate(685px, 265px); }
  100% { opacity: 0; transform: translate(685px, 265px); }
}

@keyframes hvd-popover {
  0%   { opacity: 0; transform: translateY(6px); }
  10%  { opacity: 1; transform: translateY(0); }
  100% { opacity: 1; transform: translateY(0); }
}