/* ============================================================
   ORVX AI v2 VISUALS (site-wide, shared)
   Brand tokens: #00E5A0 / #00B87A / #080C10 / #F0F4F8
   Vanilla CSS. Motion is transform/opacity, gated on
   prefers-reduced-motion. Homepage has its own inline copy.
   ============================================================ */

/* -- Scroll reveals: hidden only when JS set html.v2-anim -- */
html.v2-anim .reveal { opacity:0; translate:0 30px; transition:opacity .7s ease, translate .7s cubic-bezier(.2,.8,.2,1); }
html.v2-anim .reveal.visible { opacity:1; translate:0 0; }

/* -- 3D tilt cards (decorated at runtime by v2-visuals.js) -- */
.v2-tilt {
  position:relative;
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s cubic-bezier(.2,.8,.2,1), border-color .3s;
}
.v2-tilt .glow {
  position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:0;
  background:radial-gradient(440px circle at var(--mx,50%) var(--my,50%), rgba(0,229,160,0.12), transparent 60%);
  opacity:0; transition:opacity .3s;
}
.v2-tilt:hover .glow { opacity:1; }
.v2-tilt:hover { box-shadow:0 24px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(0,229,160,0.14); }

/* -- Perspective on common card grids -- */
.services-grid, .ind-grid, .why-cards, .pricing-grid, .support-grid, .steps-grid, .hero-stats { perspective:1200px; perspective-origin:50% 30%; }

/* -- Nav logo: push out on hover -- */
.nav-logo { transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.nav-logo:hover { transform:scale(1.07); }
.nav-logo .logo-mark { transition:box-shadow .3s; }
.nav-logo:hover .logo-mark { box-shadow:0 0 26px rgba(0,229,160,0.5); }

/* -- Closing CTA: perspective grid floor -- */
.grid-floor {
  position:absolute; left:50%; bottom:-12%; width:160%; height:62%;
  transform:translateX(-50%) perspective(620px) rotateX(62deg);
  background:
    linear-gradient(rgba(0,229,160,0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,229,160,0.16) 1px, transparent 1px);
  background-size:54px 54px;
  mask-image:linear-gradient(180deg, transparent 0%, #000 45%, #000 75%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 45%, #000 75%, transparent 100%);
  animation:v2gridfloor 5s linear infinite;
  pointer-events:none;
}
@keyframes v2gridfloor { to { background-position:0 54px, 0 0; } }

/* -- Cursor glow (injected by JS on fine pointers only) -- */
#cursor-glow {
  position:fixed; left:0; top:0; width:220px; height:220px; margin:-110px 0 0 -110px;
  border-radius:50%; pointer-events:none; z-index:9996;
  background:radial-gradient(circle, rgba(0,229,160,0.06) 0%, rgba(0,229,160,0.025) 40%, transparent 65%);
  mix-blend-mode:screen; opacity:0; transition:opacity .4s ease; will-change:transform;
}

/* -- Reduced motion: kill all animation, show everything, no glow -- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after { animation:none !important; transition:none !important; }
  html.v2-anim .reveal { opacity:1; translate:0 0; }
  .v2-tilt .glow, #cursor-glow { display:none !important; }
}