/**
 * Vapesline — 3D depth styles
 * Layered soft shadows + transform-friendly cards. No neon.
 */

.vl-3d-card {
	transform-style: preserve-3d;
	will-change: transform;
	transition:
		transform 0.8s cubic-bezier(0.25, 0.1, 0.25, 1),
		box-shadow 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
	box-shadow:
		0 1px 2px rgba(17, 17, 19, 0.04),
		0 8px 24px rgba(17, 17, 19, 0.06),
		0 20px 40px rgba(17, 17, 19, 0.04);
}

.vl-3d-card.is-tilting {
	/* Near-instant apply while JS lerps; keeps motion sluggish via follow speed */
	transition:
		transform 0.05s linear,
		box-shadow 0.75s ease;
	box-shadow:
		0 2px 4px rgba(17, 17, 19, 0.05),
		0 14px 32px rgba(17, 17, 19, 0.1),
		0 28px 56px rgba(17, 17, 19, 0.08);
	z-index: 2;
}

/* Product / category / line cards share depth chrome */
.vl-product-card,
.vl-cat-card,
.vl-lines-slide {
	transform-style: preserve-3d;
}

.vl-product-card .vl-product-thumb,
.vl-cat-card,
.vl-lines-slide__media {
	overflow: hidden;
}

.vl-product-card .vl-product-img,
.vl-cat-card img,
.vl-lines-slide__media img {
	transition: transform 0.85s cubic-bezier(0.25, 0.1, 0.25, 1);
	will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
	.vl-product-card:hover .vl-product-img,
	.vl-cat-card:hover img,
	.vl-lines-slide:hover .vl-lines-slide__media img {
		transform: scale(1.05);
	}
}

/* Hero parallax target — transforms only */
.vl-hero-geekbar__bg.vl-3d-parallax-bg {
	will-change: auto;
	transform: none !important;
	transition: none;
}

.vl-hero-geekbar,
.vl-hero--geekbar {
	overflow: hidden;
	perspective: none;
}

/* Soft depth on elevated surfaces without glow */
.vl-shop-all-banner,
.vl-cta-card {
	box-shadow:
		0 1px 2px rgba(17, 17, 19, 0.04),
		0 12px 36px rgba(17, 17, 19, 0.07);
}

@media (hover: none), (pointer: coarse) {
	.vl-3d-card,
	.vl-product-card,
	.vl-cat-card,
	.vl-lines-slide {
		transform: none !important;
	}

	.vl-3d-card.is-tilting {
		box-shadow:
			0 1px 2px rgba(17, 17, 19, 0.04),
			0 8px 24px rgba(17, 17, 19, 0.06);
	}
}

@media (prefers-reduced-motion: reduce) {
	.vl-3d-card,
	.vl-product-card,
	.vl-cat-card,
	.vl-lines-slide,
	.vl-hero-geekbar__bg.vl-3d-parallax-bg {
		transform: none !important;
		transition: none !important;
	}

	.vl-product-card .vl-product-img,
	.vl-cat-card img,
	.vl-lines-slide__media img {
		transform: none !important;
		transition: none !important;
	}
}
