/* ==========================================================================
   Blocco: Territori – Card (csp-terr-card)
   Immagine a filo in alto, testo centrato, pulsante nero.
   .is-off → card spenta per la città selezionata (aggiunta da script.js
             del blocco "Territori"): immagine in grigio, testo e pulsante
             sbiaditi, pulsante non cliccabile.
   Nota: wp-block-library è disattivato sul front-end (functions.php), quindi
   anche lo stile di immagine e pulsante è definito qui.
   ========================================================================== */

.csp-terr-card {
	display: flex;
	flex-direction: column;
	background-color: #fff;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
	margin-bottom: 2rem;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* --------------------------------------------------------------------------
   Immagine
   -------------------------------------------------------------------------- */
.csp-terr-card .wp-block-image {
	margin: 0;
}
.csp-terr-card .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 275 / 170;
	object-fit: cover;
	transition: filter 0.3s ease, opacity 0.3s ease;
}

/* --------------------------------------------------------------------------
   Testo
   -------------------------------------------------------------------------- */
.csp-terr-wrap .csp-terr-card p {
	flex: 1 1 auto;
	font-family: "Gelasio";
	font-size: 15px;
	line-height: 1.4;
	text-align: center;
	color: #0E693A;
	margin: 0;
	padding: 1.25rem 2.25rem 1rem;
	transition: color 0.3s ease;
}

/* --------------------------------------------------------------------------
   Pulsante
   -------------------------------------------------------------------------- */
.csp-terr-card .wp-block-buttons {
	display: block;
	margin: 0;
	padding: 0 2.25rem 1.6rem;
}
.csp-terr-card .wp-block-button {
	display: block;
	width: 100%;
	margin: 0;
}
.csp-terr-wrap .csp-terr-card .wp-block-button__link {
	display: block;
	width: 100%;
	padding: 12px 16px;
	border: 0;
	border-radius: 0;
	background-color: #000;
	color: #fff;
	font-family: "futura-pt";
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	box-sizing: border-box;
	transition: background-color 0.25s ease, color 0.25s ease;
}
.csp-terr-wrap .csp-terr-card .wp-block-button__link:hover,
.csp-terr-wrap .csp-terr-card .wp-block-button__link:focus-visible {
	background-color: #0E693A;
	color: #fff;
}

/* --------------------------------------------------------------------------
   Card spenta
   -------------------------------------------------------------------------- */
.csp-terr-card.is-off {
	background-color: rgba(255, 255, 255, 0.55);
	box-shadow: none;
}
.csp-terr-card.is-off .wp-block-image img {
	filter: grayscale(1);
	opacity: 0.7;
}
.csp-terr-wrap .csp-terr-card.is-off p {
	color: #A5A5A5;
}
.csp-terr-wrap .csp-terr-card.is-off .wp-block-button__link {
	background-color: #DCDCDC;
	color: #fff;
	pointer-events: none;
	cursor: default;
}

@media (max-width: 767px) {
	.csp-terr-card {
		width: 100%;
		max-width: 360px;
		margin: 0 auto 1.5rem;
	}
}