/*
 * 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: linha fina que entra da esquerda. */
	a.elephant-hover-link {
		background-image: linear-gradient(currentColor, currentColor);
		background-repeat: no-repeat;
		background-position: 0 100%;
		background-size: 0 1px;
		transition:
			background-size 0.38s cubic-bezier(.22, 1, .36, 1),
			opacity 0.28s ease;
	}

	a.elephant-hover-link:hover,
	a.elephant-hover-link:focus-visible {
		background-size: 100% 1px;
		opacity: 0.72;
	}

	/* 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;
	}

	/* Menu principal: o underline é suficiente; mantém a composição quieta. */
	#main-menu a.elephant-hover-link,
	#mobile-menu a.elephant-hover-link,
	.elephant-shop__filters a.elephant-hover-link,
	.elephant-topbar a.elephant-hover-link,
	footer a.elephant-hover-link {
		background-position: 0 calc(100% - 1px);
	}
}

@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;
	}
}