/**
 * whatsapp-button.css
 * -----------------------------------------------------------------------
 * Estilo DIRETO (CSS puro) do botão flutuante do WhatsApp.
 *
 * A barra de áudio fixa (ver audio-player.css) é centralizada e, em
 * telas largas, não chega perto da borda direita — então o WhatsApp
 * pode ficar bem colado no rodapé. Só no mobile ela quase encosta nas
 * bordas, então ali o botão sobe um pouco pra não sobrepor.
 * ----------------------------------------------------------------------- */

.whatsapp-button {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	z-index: 70;
	width: 74px;
	height: 74px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease;
	animation: whatsappPulse 2.6s ease-in-out infinite;
}

@media (max-width: 640px) {
	.whatsapp-button {
		bottom: 95px;
	}
}

.whatsapp-button:hover {
	animation-play-state: paused;
	transform: scale(1.08);
}

.whatsapp-button__icon {
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: drop-shadow(0 8px 18px rgba(32, 26, 21, 0.3));
}

@keyframes whatsappPulse {
	0%,
	100% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.06);
	}
}

@media (prefers-reduced-motion: reduce) {
	.whatsapp-button {
		animation: none;
	}
}