/* =================================================================
   Miau Volver — enlace de vuelta a la categoría, en la ficha de producto
   =================================================================

   El bloque se imprime desde PHP dentro de la columna izquierda de la ficha,
   justo encima de la galería, así que ya hereda su ancho y su alineación: aquí
   solo va el aspecto del enlace.
   ================================================================= */

.miau-volver {
	width: 100%;
	/* La columna es flex con gap de 28px; se resta para que el enlace quede
	   pegado al hueco superior del contenedor y no al de la galería. */
	margin-bottom: -12px;
}

@media (min-width: 768px) {
	/* En escritorio el enlace se alinea con la primera línea del título, que
	   vive en la otra columna: ambas empiezan a la misma altura, pero el h1
	   (68px sobre una caja de 76px) baja sus mayúsculas ~9px respecto al texto
	   del enlace. Ese desfase es el que se compensa aquí. */
	.miau-volver {
		margin-top: 9px;
	}
}

.miau-volver__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: 'Albert Sans', sans-serif;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -0.32px;
	line-height: 1;
	color: #003CA5;
	text-decoration: none;
}

.miau-volver__link:hover,
.miau-volver__link:focus-visible {
	color: #003CA5;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.miau-volver__icon {
	flex: 0 0 auto;
	transition: transform .2s ease;
}

.miau-volver__link:hover .miau-volver__icon {
	transform: translateX(-3px);
}

@media (max-width: 767px) {
	.miau-volver {
		margin-bottom: -8px;
	}

	.miau-volver__link {
		font-size: 15px;
	}
}