/* ============================================================
   G-Mesh · Scroll-reveal animations — CSS
   ============================================================ */

/* ----------------------------------------------------------
   Base: hidden state (before reveal)
   data-anim variants: fade-up | fade-down | fade-left | fade-right
---------------------------------------------------------- */
[data-anim].anim-ready {
  opacity: 0;
  transition:
    opacity  0.65s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

[data-anim="fade-up"].anim-ready    { transform: translateY(38px); }
[data-anim="fade-down"].anim-ready  { transform: translateY(-28px); }
[data-anim="fade-left"].anim-ready  { transform: translateX(38px); }
[data-anim="fade-right"].anim-ready { transform: translateX(-38px); }

/* ----------------------------------------------------------
   Visible state
---------------------------------------------------------- */
[data-anim].anim-visible {
  opacity: 1 !important;
  transform: none !important;
}

/* ----------------------------------------------------------
   Respect reduced-motion preference
---------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  [data-anim].anim-ready {
    transition: opacity 0.3s ease;
    transform: none !important;
  }
}

/* ----------------------------------------------------------
   Extra polish: nav slides in from top
---------------------------------------------------------- */
.gm-nav__inner[data-anim].anim-ready {
  transform: translateY(-100%);
}

/* ----------------------------------------------------------
   Stagger helper: children of flow list get micro-delays
   (handled via JS data-anim-delay, but this provides a
   CSS fallback for no-JS environments)
---------------------------------------------------------- */
.vox-flow-list .vox-step:nth-child(1) { --anim-delay: 0ms; }
.vox-flow-list .vox-step:nth-child(2) { --anim-delay: 110ms; }
.vox-flow-list .vox-step:nth-child(3) { --anim-delay: 220ms; }
.vox-flow-list .vox-step:nth-child(4) { --anim-delay: 330ms; }

/* ----------------------------------------------------------
   Feature card hover lift (bonus micro-interaction)
---------------------------------------------------------- */
.vox-feature-card {
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.vox-feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.10);
}

/* ----------------------------------------------------------
   Benefit card hover lift
---------------------------------------------------------- */
.benefit-card {
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.benefit-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.09);
}

/* ----------------------------------------------------------
   Stat card entrance pulse (hero stats)
---------------------------------------------------------- */
.gm-stat-card.anim-visible {
  animation: statPulse 0.5s 0.05s ease-out both;
}

@keyframes statPulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,255,255,0.25); }
  60%  { box-shadow: 0 0 0 10px rgba(255,255,255,0); }
  100% { box-shadow: none; }
}

/* ----------------------------------------------------------
   Accordion item slide-in polish
---------------------------------------------------------- */
.accordion-item {
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.accordion-item:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.07);
}

/* ----------------------------------------------------------
   Industry chips stagger entrance
---------------------------------------------------------- */
.industry-chip-grid span {
  transition: transform 0.22s ease, background 0.2s ease;
}
.industry-chip-grid span:hover {
  transform: translateY(-2px);
}

/* ----------------------------------------------------------
   CTA band button bounce on scroll-in
---------------------------------------------------------- */
.product-cta .btn-two.anim-visible {
  animation: btnBounceIn 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes btnBounceIn {
  from { transform: scale(0.85); opacity: 0; }
  to   { transform: scale(1);    opacity: 1; }
}

/* ----------------------------------------------------------
   Contact card smooth shadow on entrance
---------------------------------------------------------- */
.contact-card.anim-visible {
  animation: cardReveal 0.5s ease both;
}

@keyframes cardReveal {
  from { box-shadow: none; }
  to   { /* inherits existing shadow from theme */ }
}