/* RTS main site — spatial depth pass, homepage only.
   v2: v1 used black-tinted shadows at low opacity, which are invisible against the
   near-black page background (hsl(195 55% 3%)) and only changed anything on deliberate
   hover — so the page looked unchanged at a glance. Fixed by (a) giving every card a
   visible cyan-tinted glow + rim light AT REST, not just on interaction, and (b) making
   the hover/tilt state a much bigger jump (scale + lift + brighter ring), so the
   difference reads instantly instead of needing a slow hover to notice.
   Loaded after the bundle stylesheet so these win on shared selectors by source order —
   border-color needs !important since the inline `border` shorthand each card already
   carries would otherwise beat an external stylesheet rule regardless of order. */
:root {
  --rts-elev-1: 0 0 0 1px rgba(0,212,255,0.14), 0 16px 36px -14px rgba(0,0,0,0.75), 0 6px 22px rgba(0,212,255,0.12);
  --rts-elev-2: 0 0 0 1px rgba(0,212,255,0.28), 0 30px 56px -16px rgba(0,0,0,0.8), 0 10px 32px rgba(0,212,255,0.2);
  --rts-elev-3: 0 0 0 1.5px rgba(0,212,255,0.55), 0 44px 80px -18px rgba(0,0,0,0.85), 0 0 46px rgba(0,212,255,0.35), 0 14px 38px rgba(0,212,255,0.3);
}

.glass-card {
  box-shadow: var(--rts-elev-1);
  border-color: rgba(0,212,255,0.16) !important;
  transform: perspective(1000px) rotateX(0deg) rotateY(0deg) translateZ(0) scale(1);
}

.hover-lift:hover {
  transform: perspective(1000px) rotateX(0deg) rotateY(0deg) translateZ(30px) translateY(-12px) scale(1.035);
  box-shadow: var(--rts-elev-3);
  border-color: rgba(0,212,255,0.6) !important;
}

/* while JS is actively tilting a card, swap to a faster linear transition so the tilt
   tracks the cursor instead of chasing it through the resting 0.35s ease curve */
.glass-card.is-tilting {
  transition: transform 70ms linear, box-shadow 120ms linear, border-color 120ms linear !important;
  box-shadow: var(--rts-elev-3);
  border-color: rgba(0,212,255,0.6) !important;
}

@media (prefers-reduced-motion: reduce), (pointer: coarse) {
  .glass-card { box-shadow: var(--rts-elev-1); border-color: rgba(0,212,255,0.16) !important; transform: none; }
  .hover-lift:hover { box-shadow: var(--rts-elev-2); border-color: rgba(0,212,255,0.32) !important; }
}