/* Pre-animation hidden state */
.wow {
  opacity: 0;
  will-change: opacity, transform;
}

/* Default forward + up (replaces previous fadeInUp setup) */
.wow.fadeInUp { transform: translateY(28px); }
.wow.fadeInRight { transform: translateX(-28px); }
.wow.fadeInDown { transform: translateY(-28px); }
.wow.fadeInLeft { transform: translateX(28px); }

/* Premium variants — new keyframes for richer entrance */
.wow.scaleInUp {
  transform: translateY(24px) scale(0.96);
}
.wow.blurIn {
  filter: blur(8px);
}

/* Triggered visible state — premium spring-like easing */
.wow.is-visible {
  opacity: 1;
  transform: none;
  filter: none;
  transition:
    opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.85s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Stagger helper — apply via inline data-wow-delay */
.wow[data-wow-delay] { transition-delay: 0s; /* delay handled by JS */ }

/* Reduced-motion: respect it */
@media (prefers-reduced-motion: reduce) {
  .wow {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/* ============================================================
   PREMIUM HOVER PHYSICS for cards
   ============================================================ */

/* Service cards + generic pv-card-skin */
.pv-service-card,
.pv-card-skin,
.pv-cv__card {
  transition:
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, box-shadow;
}

.pv-service-card:hover,
.pv-card-skin:hover,
.pv-cv__card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 20px 40px -12px rgba(24, 38, 79, 0.18),
    0 8px 16px -8px rgba(24, 38, 79, 0.12);
}

/* Image lift inside cards */
.pv-service-card img,
.pv-card-skin img {
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}
.pv-service-card:hover img,
.pv-card-skin:hover img {
  transform: scale(1.04);
}

/* ============================================================
   BUTTON MICRO-INTERACTIONS
   ============================================================ */

.tf-button-primary,
.tf-button-secondary,
button[type="submit"] {
  position: relative;
  overflow: hidden;
  transition:
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    background-color 0.3s ease;
  will-change: transform;
}

.tf-button-primary:hover,
.tf-button-secondary:hover,
button[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -6px rgba(24, 38, 79, 0.32);
}

.tf-button-primary:active,
.tf-button-secondary:active,
button[type="submit"]:active {
  transform: translateY(0);
  transition-duration: 0.1s;
}

/* Animate arrow icons inside buttons */
.tf-button-primary i,
.tf-button-secondary i,
.tf-button-primary svg,
.tf-button-secondary svg {
  display: inline-block;
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}
.tf-button-primary:hover i,
.tf-button-secondary:hover i,
.tf-button-primary:hover svg,
.tf-button-secondary:hover svg {
  transform: translateX(4px);
}

/* ============================================================
   SMOOTH SCROLL
   ============================================================ */

html {
  scroll-behavior: smooth;
}

/* Prevent scroll-behavior from clashing with reduced-motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pv-service-card:hover,
  .pv-card-skin:hover,
  .pv-cv__card:hover,
  .tf-button-primary:hover,
  .tf-button-secondary:hover {
    transform: none;
  }
}

/* ============================================================
   PARALLAX TARGETS — must be positioned for transform
   ============================================================ */

.pv-page-title__bg,
.pv-contact-hero__bg {
  will-change: transform;
  transition: transform 0.05s linear; /* smooth out per-frame jumps */
}

@media (prefers-reduced-motion: reduce) {
  .pv-page-title__bg,
  .pv-contact-hero__bg {
    transform: none !important;
    transition: none !important;
  }
}