/* ==========================================================================
   Animaciones y microinteracciones de Wolf.
   Todo se desactiva si el usuario pidió "reducir movimiento".
   ========================================================================== */

/* Aparición al hacer scroll (la clase la agrega motion.js; sin JS todo se ve normal) */
.wolf-js .wolf-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition:
		opacity .6s cubic-bezier(.2, .7, .2, 1) var(--wolf-delay, 0ms),
		transform .6s cubic-bezier(.2, .7, .2, 1) var(--wolf-delay, 0ms);
}
.wolf-js .wolf-reveal.is-visible { opacity: 1; transform: none; }

/* Hero: entrada en cascada + fondo con movimiento lento */
.wolf-hero { position: relative; overflow: hidden; isolation: isolate; }
.wolf-hero::before {
	content: "";
	position: absolute;
	inset: -20%;
	z-index: -1;
	background: radial-gradient(circle at 30% 70%, rgba(6, 117, 233, .28), transparent 45%);
	animation: wolf-drift 14s ease-in-out infinite alternate;
}
.wolf-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 14px);
	pointer-events: none;
}
.wolf-hero > *,
.wolf-hero2__inner > * { animation: wolf-rise .8s cubic-bezier(.2, .7, .2, 1) both; }
.wolf-hero > *:nth-child(1),
.wolf-hero2__inner > *:nth-child(1) { animation-delay: .05s; }
.wolf-hero > *:nth-child(2),
.wolf-hero2__inner > *:nth-child(2) { animation-delay: .15s; }
.wolf-hero > *:nth-child(3),
.wolf-hero2__inner > *:nth-child(3) { animation-delay: .28s; }
.wolf-hero > *:nth-child(4),
.wolf-hero2__inner > *:nth-child(4) { animation-delay: .4s; }

/* Si el hero se convierte en bloque "Portada" con foto: zoom lento */
.wolf-hero .wp-block-cover__image-background { animation: wolf-kenburns 18s ease-out both; }

@keyframes wolf-rise {
	from { opacity: 0; transform: translateY(28px); }
	to   { opacity: 1; transform: none; }
}
@keyframes wolf-drift {
	from { transform: translate3d(-4%, 2%, 0) scale(1); }
	to   { transform: translate3d(6%, -4%, 0) scale(1.12); }
}
@keyframes wolf-kenburns {
	from { transform: scale(1.12); }
	to   { transform: scale(1); }
}

/* Botones rojos: brillo que cruza al pasar el mouse */
.wp-block-button:not(.is-style-wolf-outline) .wp-block-button__link,
.single_add_to_cart_button,
.wolf-btn {
	position: relative;
	overflow: hidden;
	transition: background-color .2s ease, transform .15s ease, box-shadow .2s ease;
}
.wp-block-button:not(.is-style-wolf-outline) .wp-block-button__link::after,
.single_add_to_cart_button::after,
.wolf-btn::after {
	content: "";
	position: absolute;
	top: 0;
	left: -60%;
	width: 40%;
	height: 100%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent);
	transform: skewX(-20deg);
	transition: left .55s ease;
	pointer-events: none;
}
.wp-block-button:not(.is-style-wolf-outline) .wp-block-button__link:hover::after,
.single_add_to_cart_button:hover::after,
.wolf-btn:hover::after { left: 130%; }
.wp-block-button__link:hover,
.single_add_to_cart_button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(6, 117, 233, .28); }
.wp-block-button__link:active,
.single_add_to_cart_button:active { transform: translateY(0); }

/* Tarjetas de producto: se elevan y la foto hace zoom */
ul.products li.product { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
ul.products li.product:hover { transform: translateY(-4px); }
ul.products li.product a img,
ul.products li.product .ct-media-container img { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
ul.products li.product .ct-media-container,
ul.products li.product a.woocommerce-LoopProduct-link { overflow: hidden; display: block; }
ul.products li.product:hover img { transform: scale(1.06); }

/* Calibres: el número se tiñe de rojo */
.wolf-calibres a strong { transition: color .2s ease; }
.wolf-calibres a:hover strong { color: var(--wolf-accent); }

/* Pasos: la línea roja crece al pasar el mouse */
.wolf-steps li { overflow: hidden; transition: border-color .2s ease, transform .2s ease; }
.wolf-steps li::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 3px;
	background: var(--wolf-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s ease;
}
.wolf-steps li:hover { border-color: rgba(255, 255, 255, .25); transform: translateY(-3px); }
.wolf-steps li:hover::after { transform: scaleX(1); }

/* Links del pie: subrayado animado */
.wolf-footer ul a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .25s ease, color .15s ease; }
.wolf-footer ul a:hover { background-size: 100% 1px; }

/* Accesibilidad: sin animaciones si el usuario lo pide */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
	.wolf-js .wolf-reveal { opacity: 1; transform: none; }
}