/* ======================================================================
   PID BLOCKS — CARDS
   Grid sits on the block wrapper with cards as direct children, so no
   :has() and no !important are needed. Card colours come from CSS variables
   set per card (background, accent, and auto-contrast text).
   ====================================================================== */

/* ---- Grid (parent: pid/cards) ---- */
.wp-block-pid-cards {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 18px;
	align-items: stretch;
	margin: 32px 0;
}

.wp-block-pid-cards.pid-cards--cols-1 { grid-template-columns: 1fr; }
.wp-block-pid-cards.pid-cards--cols-2 { grid-template-columns: repeat( 2, 1fr ); }
.wp-block-pid-cards.pid-cards--cols-3 { grid-template-columns: repeat( 3, 1fr ); }
.wp-block-pid-cards.pid-cards--cols-4 { grid-template-columns: repeat( 4, 1fr ); }
.wp-block-pid-cards.pid-cards--cols-5 { grid-template-columns: repeat( 5, 1fr ); }
.wp-block-pid-cards.pid-cards--cols-6 { grid-template-columns: repeat( 6, 1fr ); }

@media ( max-width: 1024px ) {
	.wp-block-pid-cards.pid-cards--cols-2,
	.wp-block-pid-cards.pid-cards--cols-3,
	.wp-block-pid-cards.pid-cards--cols-4,
	.wp-block-pid-cards.pid-cards--cols-5,
	.wp-block-pid-cards.pid-cards--cols-6 {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 781px ) {
	.wp-block-pid-cards { grid-template-columns: 1fr; }
}

/* ---- Content alignment (parent modifier, cascades to cards) ---- */
.pid-cards--align-left .pid-card { text-align: left; }
.pid-cards--align-left .pid-card__icon { margin-right: auto; margin-left: 0; }

.pid-cards--align-center .pid-card { text-align: center; }
.pid-cards--align-center .pid-card__icon { margin-left: auto; margin-right: auto; }

.pid-cards--align-right .pid-card { text-align: right; }
.pid-cards--align-right .pid-card__icon { margin-left: auto; margin-right: 0; }

/* ---- Card (child: pid/card) ---- */
.wp-block-pid-card.pid-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	box-sizing: border-box;
	background: var( --pid-card-bg, #fff );
	border: 0;
	border-top: 3px solid var( --pid-card-accent, var( --pid-cyan ) );
	border-radius: var( --pid-radius-sm );
	padding: 20px 18px 18px;
	box-shadow: var( --pid-shadow );
	transition: transform var( --pid-transition ), box-shadow var( --pid-transition );
}

.wp-block-pid-card.pid-card:hover {
	transform: var( --pid-lift );
	box-shadow: var( --pid-shadow-hover );
}

.pid-card__icon {
	width: 40px;
	height: 40px;
	color: var( --pid-card-accent, var( --pid-cyan ) );
	margin-bottom: 12px;
}

.pid-card__icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

.pid-card__heading {
	color: var( --pid-card-heading, var( --pid-navy ) );
	font-weight: 700;
	font-size: 1.03rem;
	line-height: 1.3;
	margin: 0 0 6px;
}

.pid-card__text {
	color: var( --pid-card-text, var( --pid-near-black ) );
	font-size: 0.96rem;
	line-height: 1.5;
	margin: 0;
}

.pid-card__text p { margin: 0 0 0.6em; }
.pid-card__text p:last-child { margin-bottom: 0; }

.pid-card__link {
	display: inline-block;
	margin-top: 14px;
	font-weight: 600;
	color: var( --pid-card-link, var( --pid-cyan-accessible ) );
	text-decoration: none;
}

.pid-card__link:hover { text-decoration: underline; }

@media ( prefers-reduced-motion: reduce ) {
	.wp-block-pid-card.pid-card { transition: none; }
}