/* ===========================
   ANIMATIONS — Estados iniciais GSAP + Reduced Motion
   Machado Plataformas
   Depende de: variables.css
=========================== */

/* ── Estados iniciais para data-animate ── */
[data-animate] {
  will-change: opacity, transform;
}

[data-animate="fade-up"] {
  opacity: 0;
  transform: translateY(60px);
}

[data-animate="fade-in"] {
  opacity: 0;
}

[data-animate="slide-left"] {
  opacity: 0;
  transform: translateX(-60px);
}

[data-animate="slide-right"] {
  opacity: 0;
  transform: translateX(60px);
}

[data-animate="scale-in"] {
  opacity: 0;
  transform: scale(0.92);
}

/* lines — gerenciado por SplitText + overflow hidden no wrapper */
[data-animate="lines"] {
  opacity: 0;
}


/* ── Cursor Customizado ── */
#cursor,
#cursor-follower {
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: 9998;
  mix-blend-mode: normal;
}

#cursor {
  width: 10px;
  height: 10px;
  background-color: var(--color-primary-light);
  transform: translate(-50%, -50%);
}

#cursor-follower {
  width: 36px;
  height: 36px;
  border: 1.5px solid var(--color-primary-light);
  background-color: transparent;
  transform: translate(-50%, -50%);
  transition: opacity var(--dur-fast) ease, transform var(--dur-fast) ease;
}

#cursor.cursor--hover {
  transform: translate(-50%, -50%) scale(2.5);
  background-color: var(--color-primary-light);
  opacity: 0.4;
}

#cursor-follower.cursor--hover {
  opacity: 0;
}

/* Cursor sobre stage de produto: anel maior + dot some */
#cursor.cursor--view {
  opacity: 0;
}

#cursor-follower.cursor--view {
  width: 60px;
  height: 60px;
  border-color: rgba(255, 255, 255, 0.35);
  transition:
    width 0.35s var(--ease-machado),
    height 0.35s var(--ease-machado),
    border-color 0.35s var(--ease-machado),
    opacity 0.2s ease;
}

/* Cursor oculto em touch */
@media (hover: none) {
  #cursor, #cursor-follower { display: none; }
}

/* ── WhatsApp Flutuante ── */
.whatsapp-float {
  position: fixed;
  bottom: var(--space-6);
  right: var(--space-6);
  z-index: 999;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-whatsapp);
  transition: transform var(--dur-normal) ease, box-shadow var(--dur-normal) ease;
}

.whatsapp-float:hover {
  transform: translateY(-0.125rem);
  box-shadow: var(--shadow-whatsapp);
}

.whatsapp-float__button {
  pointer-events: none;
}

@media (max-width: 767px) {
  .whatsapp-float {
    right: var(--space-4);
    bottom: var(--space-4);
  }

  .whatsapp-float .btn__label,
  .whatsapp-float .btn__plus {
    min-height: 3.25rem;
  }

  .whatsapp-float .btn__label {
    padding-inline: var(--space-4);
    font-size: var(--text-sm);
  }

  .whatsapp-float .btn__plus {
    min-width: 3.25rem;
  }
}

/* ── Prefers Reduced Motion — desabilita TODAS as animações ── */
@media (prefers-reduced-motion: reduce) {
  [data-animate] {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }

  [data-animate="fade-up"],
  [data-animate="fade-in"],
  [data-animate="slide-left"],
  [data-animate="slide-right"],
  [data-animate="scale-in"],
  [data-animate="lines"] {
    opacity: 1;
    transform: none;
  }

  #cursor,
  #cursor-follower,
  .whatsapp-float,
  .btn,
  .btn::before,
  .btn--split,
  .btn--split .btn__label,
  .btn--split .btn__plus,
  .hero-scroll__line {
    animation: none;
    transition-duration: var(--dur-instant);
  }

  .btn--split:hover {
    transform: none;
    filter: none;
  }

  .btn--split:hover .btn__plus,
  .btn--split:active .btn__plus {
    transform: none;
  }

  .dep-btn:hover,
  .dep-btn:active,
  .produto-gallery__btn:hover,
  .produto-gallery__btn:active,
  .produtos-arrow:hover,
  .produtos-arrow:active {
    transform: none;
  }
}