/* ============================================================
   Showcase — griglia di schede fullscreen con foto + video ACF
   ============================================================ */
.nelb-showcase {
	display: grid;
	grid-template-columns: repeat(var(--nsc-cols, 2), 1fr);
	gap: 0;
}

.nsc-card {
	position: relative;
	display: block;
	height: 100vh; /* sovrascritta dal controllo responsive */
	overflow: hidden;
	color: var(--nsc-text, #fff);
	text-decoration: none;
}

.nsc-media { position: absolute; inset: 0; }
.nsc-media img,
.nsc-media .nsc-video,
.nsc-media .nsc-embed {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
}
.nsc-media img { object-fit: cover; object-position: center; display: block; }

/* il video sta sopra la foto: invisibile finche non parte */
.nsc-video {
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.8s ease;
	z-index: 2;
}
.nsc-card.is-on .nsc-video { opacity: 1; }

/* embed YT/Vimeo come sfondo (se il campo video e un link) */
.nsc-embed { overflow: hidden; z-index: 2; opacity: 0; transition: opacity 0.8s ease; }
.nsc-card.is-on .nsc-embed { opacity: 1; }
.nsc-embed iframe {
	position: absolute; top: 50%; left: 50%;
	transform: translate(-50%, -50%);
	border: 0; pointer-events: none;
	/* larghezza e altezza calcolate dal JS per coprire la scheda (cover) */
}

.nsc-overlay {
	position: absolute; inset: 0; z-index: 3;
	background: linear-gradient(transparent 45%, rgba(0, 0, 0, 0.55)), var(--nsc-overlay, rgba(0, 0, 0, 0.35));
	pointer-events: none;
	transition: opacity 0.3s ease;
}

.nsc-info {
	position: absolute; left: 4%; right: 4%; bottom: 5%; z-index: 4;
}
.nelb-showcase .nsc-title {
	margin: 0 0 10px;
	font-family: inherit;
	font-size: clamp(28px, 3.2vw, 58px);
	font-weight: 700;
	line-height: 1.05;
	color: var(--nsc-text, #fff);
}
.nelb-showcase .nsc-meta {
	font-size: clamp(13px, 1vw, 16px);
	letter-spacing: 0.02em;
	opacity: 0.85;
	color: var(--nsc-text, #fff);
}
/* batte i colori link/heading del tema */
.nelb-showcase a.nsc-card,
.nelb-showcase a.nsc-card:hover,
.nelb-showcase a.nsc-card:visited { color: var(--nsc-text, #fff); }
.nsc-sep { opacity: 0.5; padding: 0 4px; }

.nsc-card:hover .nsc-title { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }