/*
 * L'Éléphant — micro-interações globais
 * Aplicadas por js/link-hovers.js conforme o tipo de link.
 * Não alteram dimensões nem posicionamento do layout.
 */

@media (hover: hover) and (pointer: fine) {
	/* Links de texto: apenas redução de opacidade, sem underline animado. */
	a.elephant-hover-link {
		background-image: none !important;
		text-decoration: none !important;
		transition: opacity 0.28s ease;
	}

	a.elephant-hover-link:hover,
	a.elephant-hover-link:focus-visible {
		opacity: 0.65;
		text-decoration: none !important;
		border-bottom-color: transparent !important;
		box-shadow: none !important;
		background-image: none !important;
	}

	/* Nos links compostos do produto a linha seria demasiado longa.
	   O hover é tratado pelo próprio card. */
	.elephant-product-card__text.elephant-hover-link {
		background-image: none;
		opacity: 1;
	}

	/* Links de imagem: apenas um zoom muito subtil, sem deslocar o layout. */
	a.elephant-hover-media img {
		transition:
			transform 0.55s cubic-bezier(.22, 1, .36, 1),
			opacity 0.35s ease;
		transform-origin: center center;
	}

	a.elephant-hover-media:hover img,
	a.elephant-hover-media:focus-visible img {
		transform: scale(1.018);
		opacity: 0.94;
	}

	/* Produto: imagem responde primeiro; o título acompanha discretamente. */
	.elephant-product-card__image img {
		transition:
			transform 0.5s cubic-bezier(.22, 1, .36, 1),
			opacity 0.3s ease !important;
	}

	.elephant-product-card__title,
	.elephant-product-card__brand,
	.elephant-product-card__price {
		transition: opacity 0.3s ease;
	}

	.elephant-product-card:hover .elephant-product-card__image img {
		transform: scale(1.025);
	}

	.elephant-product-card:hover .elephant-product-card__title {
		opacity: 0.62;
	}

	.elephant-product-card:hover .elephant-product-card__brand,
	.elephant-product-card:hover .elephant-product-card__price {
		opacity: 0.78;
	}

}

@media (prefers-reduced-motion: reduce) {
	a.elephant-hover-link,
	a.elephant-hover-media img,
	.elephant-product-card__image img,
	.elephant-product-card__title,
	.elephant-product-card__brand,
	.elephant-product-card__price {
		transition: none !important;
	}
}

/* Projetos / Work: a imagem não cresce no hover.
 * Mantém-se apenas o tratamento de opacidade definido no layout de projetos. */
@media (hover: hover) and (pointer: fine) {
	.projeto-imagem a.elephant-hover-media img,
	.projeto-imagem a.elephant-hover-media:hover img,
	.projeto-imagem a.elephant-hover-media:focus-visible img {
		transform: none !important;
	}
}
