/* ==============================================================================
   RVIT 4D / 9D PURE CSS SPATIAL DEPTH SYSTEM (Zero-JS-Lag Edition)
   100% GPU-Composited Hardware Acceleration — Instant 144Hz / 120Hz / 60Hz Smoothness
   ============================================================================== */

:root {
  --rvit-4d-gold: #fbbf24;
  --rvit-4d-amber: #d97706;
  --rvit-4d-cyan: #38bdf8;
  --rvit-4d-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --rvit-4d-depth-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.5), 0 0 20px rgba(251, 191, 36, 0.18);
}

/* ==========================================================================
   1. PURE CSS 4D SPATIAL DEPTH & ELEVATION (Zero JS Overhead)
   ========================================================================== */
.rvit-tilt-card,
.rvit-3d-card,
.aq-cc,
.plc-stat-card,
.r-card,
.section-card,
.dept-card {
  position: relative;
  will-change: transform, box-shadow;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transition: transform 0.25s var(--rvit-4d-spring), box-shadow 0.25s ease, border-color 0.25s ease;
  contain: layout style;
}

.rvit-tilt-card:hover,
.rvit-3d-card:hover,
.aq-cc:hover,
.r-card:hover {
  transform: translateY(-4px) scale(1.012);
  box-shadow: var(--rvit-4d-depth-shadow);
  border-color: rgba(251, 191, 36, 0.5) !important;
}

/* ==========================================================================
   2. HOLOGRAPHIC 4D GLASS ACCENTS & PRISM BORDERS
   ========================================================================== */
.rvit-4d-glass {
  background: rgba(12, 30, 61, 0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(251, 191, 36, 0.25);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}

/* ==========================================================================
   3. INSTANT 4D TACTILE BUTTONS (Pure CSS GPU Interaction)
   ========================================================================== */
.rvit-magnetic-btn,
.hero-btn,
.plc-cta-btn,
.aq-btn1,
.aq-btn2,
.btn-call-now {
  position: relative;
  transition: transform 0.2s var(--rvit-4d-spring), box-shadow 0.2s ease;
  will-change: transform;
  transform: translateZ(0);
}

.rvit-magnetic-btn:hover,
.hero-btn:hover,
.plc-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(251, 191, 36, 0.35);
}

.rvit-magnetic-btn:active,
.hero-btn:active,
.plc-cta-btn:active {
  transform: translateY(0px) scale(0.97);
}

/* ==========================================================================
   4. LIVE RADAR BEACON (Lightweight CSS Pulse)
   ========================================================================== */
.rvit-radar-beacon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 9px;
  height: 9px;
  vertical-align: middle;
}

.rvit-radar-core {
  width: 7px;
  height: 7px;
  background: #10b981;
  border-radius: 50%;
  box-shadow: 0 0 8px #10b981;
}

.rvit-radar-wave {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 1.5px solid #10b981;
  border-radius: 50%;
  animation: rvitRadarPulse 2.4s cubic-bezier(0.25, 1, 0.5, 1) infinite;
  will-change: transform, opacity;
}

@keyframes rvitRadarPulse {
  0% {
    transform: scale(1);
    opacity: 0.8;
  }
  100% {
    transform: scale(3.0);
    opacity: 0;
  }
}

/* ==========================================================================
   5. KINETIC NUMERIC FORMAT
   ========================================================================== */
.rvit-counter-num {
  font-variant-numeric: tabular-nums;
  display: inline-block;
}

/* ==========================================================================
   6. ACCESSIBILITY - PREFERS REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .rvit-tilt-card,
  .rvit-3d-card {
    transform: none !important;
  }
}