/* ============================================================================
   Varsh Global Technologies — Circular cursor follower
   Self-contained. Desktop (fine pointer) only; disabled on touch / mobile.
   The native arrow cursor stays visible — this only adds a ring that trails
   the pointer. Does not alter any existing layout, colours or behaviour.
   ========================================================================== */

@media (hover: hover) and (pointer: fine) {
  .vg-cursor-ring {
    position: fixed;
    top: 0;
    left: 0;
    width: 36px;
    height: 36px;
    margin: -18px 0 0 -18px;
    border: 1px solid rgba(10, 22, 40, .35);
    border-radius: 50%;
    background: transparent;
    pointer-events: none;
    z-index: 999999;
    opacity: 0;
    transition: opacity .3s ease,
                width .25s ease,
                height .25s ease,
                margin .25s ease,
                border-color .25s ease;
    will-change: transform;
  }

  /* On dark sections the dark border would vanish — lighten it there.
     Sections in this site use these wrapper classes for dark backgrounds. */
  .vg-cursor-ring.on-dark {
    border-color: rgba(255, 255, 255, .5);
  }

  .vg-cursor-ring.is-visible {
    opacity: 1;
  }

  /* Interactive elements — ring opens up a little */
  .vg-cursor-ring.is-active {
    width: 52px;
    height: 52px;
    margin: -26px 0 0 -26px;
    border-color: rgba(10, 22, 40, .5);
  }

  .vg-cursor-ring.on-dark.is-active {
    border-color: rgba(255, 255, 255, .75);
  }

  /* Press feedback */
  .vg-cursor-ring.is-down {
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
  }
}