/* Progressive motion enhancements. Loaded after the main stylesheet. */
html { scroll-behavior: auto; }

.motion-reveal,
.motion-child,
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1), transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.motion-reveal.visible,
.motion-child.visible,
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.motion-child,
.reveal { transition-delay: var(--motion-delay, 0ms); }
.reveal-delay { --motion-delay: 120ms; }

.button { transition: transform 220ms ease, box-shadow 220ms ease, background 220ms ease; }
.button:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 14px 28px rgba(15, 23, 42, .14); }

.service-card,
.reason-card,
.testimonial-card { transition: transform 250ms ease, box-shadow 250ms ease, background 250ms ease; }

.service-card:hover,
.reason-card:hover,
.testimonial-card:hover { transform: translateY(-6px); box-shadow: 0 16px 32px rgba(15, 23, 42, .12); }

.client-logo-card { transition: transform 250ms ease, box-shadow 250ms ease; }
.client-logo-card:hover { transform: scale(1.03); box-shadow: 0 13px 30px rgba(15, 23, 42, .13); }

/* Popup brand icons are inline SVGs, not Lucide placeholders. */
.modal-socials a {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  color: var(--muted);
  transition: color 250ms ease, transform 250ms ease;
}

.modal-socials svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
  stroke: none;
  overflow: visible;
}

.modal-socials a:hover {
  color: var(--primary);
  transform: scale(1.08);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .motion-reveal,
  .motion-child,
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
  }
  .button,
  .service-card,
  .reason-card,
  .testimonial-card,
  .client-logo-card { transition: none !important; }
}