/* ============================================================
   remodel.guide — Decision Map Connector Animation
   Animates on top of existing grid layout in style.css —
   does not override .decision-item or .decision-num layout
   ============================================================ */

/* Add position context for the connector track */
.decision-map {
  position: relative;
}

/* Gray rail behind all items */
.decision-map::before {
  content: '';
  position: absolute;
  left: 22px;
  top: 24px;
  bottom: 24px;
  width: 2px;
  background: var(--border);
  z-index: 0;
  pointer-events: none;
}

/* Active state — number turns full brass */
.decision-item.connector-active .decision-num {
  color: #B5904A;
  transition: color 0.3s ease;
}

/* Pulse on activation */
@keyframes node-pulse {
  0%   { text-shadow: 0 0 0 rgba(181, 144, 74, 0.5); }
  60%  { text-shadow: 0 0 12px rgba(181, 144, 74, 0); }
  100% { text-shadow: none; }
}

.decision-item.connector-active .decision-num {
  animation: node-pulse 0.55s ease-out forwards;
}

/* Mobile — hide the connector track */
@media (max-width: 640px) {
  .decision-map::before {
    display: none;
  }
}