/* ======================== SPINNING CIRCLE ANIMATION ======================== */
/* Animation is handled by spinning-circle.js using requestAnimationFrame */
/* These are just the base SVG styles */

.spinning-circle .bg-ring {
  fill: none;
  stroke: #E8ECF0;
}

.spinning-circle .progress-ring {
  fill: none;
  stroke-linecap: round;
}

/* ======================== PAGE ENTER ANIMATION ======================== */
@keyframes slideInRight {
  from {
    transform: translateX(30px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.page-content {
  animation: slideInRight 0.3s ease-out;
}

/* ======================== CARD FADE IN ======================== */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeInUp 0.3s ease-out;
}