/* ============================================================
   motion.css — Premium Service (safe, from-scratch)
   ============================================================ */

/* Only elements that JS marks will start hidden. If JS fails, nothing is hidden. */
html.motion-wait .motion-bloom,
html.motion-wait .motion-scroll {
  opacity: 0;
}

/* Center bloom */
.motion-bloom {
  will-change: transform, opacity, filter;
}
.motion-bloom.motion-bloom-ready {
  opacity: 1;
}

/* Scroll reveal base states */
.motion-scroll {
  will-change: transform, opacity;
}
.motion-scroll.motion-from-left {
  opacity: 0;
  transform: translateX(-80px);
}
.motion-scroll.motion-from-right {
  opacity: 0;
  transform: translateX(80px);
}
.motion-scroll.motion-from-up {
  opacity: 0;
  transform: translateY(28px);
}

.motion-scroll.motion-visible {
  opacity: 1 !important;
  transform: none !important;
  transition:
    opacity .8s ease,
    transform 1.1s cubic-bezier(.2,.7,.2,1);
}
.motion-scroll.motion-delay-1 { transition-delay: .08s; }
.motion-scroll.motion-delay-2 { transition-delay: .16s; }
.motion-scroll.motion-delay-3 { transition-delay: .24s; }
.motion-scroll.motion-delay-4 { transition-delay: .32s; }
.motion-scroll.motion-delay-5 { transition-delay: .40s; }

.motion-scroll.motion-done {
  transition: none !important;
}

/* Mobile: keep the motion, but shorten the travel distance so content stays readable */
@media (max-width: 767px) {
  .motion-scroll.motion-from-left,
  .motion-scroll.motion-from-right {
    transform: translateX(0) translateY(28px);
  }
  .motion-scroll.motion-visible {
    transform: none !important;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  html.motion-wait .motion-bloom,
  html.motion-wait .motion-scroll,
  .motion-bloom,
  .motion-scroll {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
    animation: none !important;
  }
}

/* Floating phone / WhatsApp glow */
@keyframes ps-pulse-wa {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37,211,102,.35); }
  50% { box-shadow: 0 0 0 12px rgba(37,211,102,0); }
}
@keyframes ps-pulse-phone {
  0%, 100% { box-shadow: 0 0 0 0 rgba(242,138,26,.35); }
  50% { box-shadow: 0 0 0 12px rgba(242,138,26,0); }
}
@keyframes ps-ring {
  0%, 100% { transform: rotate(0deg); }
  10% { transform: rotate(-14deg); }
  20% { transform: rotate(14deg); }
  30% { transform: rotate(-10deg); }
  40% { transform: rotate(10deg); }
  50% { transform: rotate(0deg); }
}

.fab-whatsapp {
  animation: ps-pulse-wa 2.4s ease-in-out infinite;
}
.fab-phone {
  animation: ps-pulse-phone 2.8s ease-in-out infinite;
}
.fab-phone svg {
  animation: ps-ring 3.2s ease-in-out infinite;
}
.fab-whatsapp:hover,
.fab-phone:hover {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .fab-whatsapp,
  .fab-phone,
  .fab-phone svg {
    animation: none !important;
  }
}