/* ── Orbit visual ─────────────────────────────────────────────────────────── */

.hero-visual {
  position: relative;
  aspect-ratio: 1;
}

.orbit-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  will-change: contents;
}

.orbit-core {
  position: absolute;
  top: 50%; left: 50%;
  width: 80px; height: 80px;
  transform: translate(-50%, -50%);
  animation: float 6s ease-in-out infinite;
  filter: drop-shadow(0 0 22px rgba(124,111,255,0.5));
  z-index: 1;
  pointer-events: none;
}

@keyframes float {
  0%, 100% { transform: translate(-50%, -50%) translateY(0)     rotate(0deg);    }
  33%       { transform: translate(-50%, -50%) translateY(-10px) rotate(2deg);    }
  66%       { transform: translate(-50%, -50%) translateY(5px)   rotate(-1.5deg); }
}

/* ── 3D tilt cards ────────────────────────────────────────────────────────── */

.tilt-card, .stat-card {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.12s ease, border-color 0.3s ease,
              box-shadow 0.3s ease, background-color 0.3s ease;
}
.tilt-card.is-tilting,
.stat-card.is-tilting {
  transition: transform 0.05s linear;
}

/* ── Violet colour tokens for Tailwind inline scope ──────────────────────── */
.text-violet-400 { color: #9b96ff; }
.bg-violet-500   { background-color: #7c6fff; }
.hover\:bg-violet-400:hover { background-color: #9b96ff; }
.border-violet-500\/40 { border-color: rgba(124,111,255,0.4); }