/* ===================================================================
   MOYO — Products archive styling
   File: solvior-child/inc/pages/products/products.css

   Page-scoped: enqueued only on the /products/ archive (the relabelled
   `projects` CPT). Scoped to .tj-project-page so the homepage projects
   section (same .project-item markup) is untouched.
   =================================================================== */

/* ---- Uniform card height ----
   The theme sizes a .project-item by its image's natural height, so image
   cards differ row-to-row and an image-LESS card (Finance, Billing, CRM …)
   collapses entirely. Force EVERY card to one fixed height and make the
   image cover it, so the whole grid is even. Title/tags overlay the bottom
   (theme already absolute-positions .project-content there). */
.tj-project-page .project-item {
	height: 340px;
	background: #1b2a4a; /* MOYO navy — shows on image-less cards */
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
	border: 1px solid transparent;
}

/* Image fills the fixed card (cover, not stretch). */
.tj-project-page .project-item .project-image,
.tj-project-page .project-item .project-image a {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
.tj-project-page .project-item .project-image a img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- Card hover polish (lift + shadow + blue border) ----
   Matches the services-archive hover language so the two pages feel like one
   design. */
.tj-project-page .project-item:hover {
	transform: translateY(-8px) !important; /* beat the .wow transform:none below */
	box-shadow: 0 18px 40px rgba(0, 117, 255, .12);
	border-color: var(--tj-color-theme-primary, #0075ff);
}

/* ---- Force all cards visible ----
   Cards use `wow fadeInUp`: WOW.js hides them, then reveals on scroll. With
   WOW.js janking the thread some cards never get revealed and stay invisible
   ("not all showing"). Force them shown — content visibility beats the fade. */
.tj-project-page .project-item.wow {
	visibility: visible !important;
	opacity: 1 !important;
	animation: none !important;
	transform: none !important;
}