/*
 * NEMRA Blocks — Contact Block widget (V2, Figma 571:22589).
 * Centered eyebrow + serif heading above a 680px row of green contact
 * cards: uppercase label, 20px value, light-green icon chip top-right,
 * small supporting line at the bottom.
 */

.nemra-contact-block {
	width: 100%;
	max-width: 1312px;
	margin: 0 auto;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 80px;
	font-family: var(--nemra-font-body, 'Poppins', system-ui, sans-serif);
	color: var(--nemra-dark, #17171a);
}

.nemra-contact-block__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	text-align: center;
}

.nemra-contact-block__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: rgba(23, 23, 26, 0.64);
}

.nemra-contact-block__eyebrow-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--nemra-green, #4c7f39);
}

.nemra-contact-block__heading {
	margin: 0;
	font-family: var(--nemra-font-body, 'Poppins', system-ui, sans-serif);
	font-size: 48px;
	line-height: 1.2;
	letter-spacing: -1.5px;
	font-weight: 500;
	color: var(--nemra-dark, #17171a);
}

/* Cards — 680px row of two green cards */
.nemra-contact-block__cards {
	display: flex;
	gap: 16px;
	width: 100%;
	max-width: 680px;
}

.nemra-contact-block__card {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 220px;
	padding: 24px;
	box-sizing: border-box;
	border-radius: 8px;
	background: var(--nemra-green, #4c7f39);
	color: var(--nemra-light, #fcfdfd);
	text-decoration: none;
}

.nemra-contact-block__card-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.nemra-contact-block__card-text {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
}

.nemra-contact-block__card-label {
	font-size: 10px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffffff;
}

/* Body/Large is Poppins Regular. The comp node still binds the DEPRECATED
 * `Body/Body - Large` token (42dot Sans Medium), so it renders at 500 in
 * Figma — see design-tokens.json `_deprecated_token_set`. We already ignore
 * that token's family (the site has no 42dot Sans); ignoring half a stale
 * token and honouring the other half is what produced this drift. */
.nemra-contact-block__card-value {
	font-size: 20px;
	font-weight: 400;
	line-height: 28px;
	color: var(--nemra-light, #fcfdfd);
	overflow-wrap: break-word;
}

.nemra-contact-block__card-icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 37px;
	height: 37px;
	border-radius: 8px;
	background: var(--nemra-green-light, #def5d6);
	color: var(--nemra-green, #4c7f39);
	font-size: 18px;
}

.nemra-contact-block__card-icon svg { width: 20px; height: 20px; fill: currentColor; }
.nemra-contact-block__card-icon svg.nemra-icon { fill: none; stroke: currentColor; }

.nemra-contact-block__card-desc {
	margin: 0;
	max-width: 200px;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: var(--nemra-light, #fcfdfd);
}

@media (max-width: 767px) {
	.nemra-contact-block { gap: 48px; }
	/* Mobile comp is left-aligned. */
	.nemra-contact-block__header { align-items: flex-start; text-align: left; }
	.nemra-contact-block__cards { flex-direction: column; max-width: none; }
	/* Mobile comp 797:22547/55: cards are content-height (132/116), padding 20,
	 * 16px between contact row and support line. Desktop's flex-basis 0 must
	 * not survive into the column layout — it collapses the cards, and the
	 * old min-height:180px floor that hid that is where the extra padding
	 * came from. */
	.nemra-contact-block__card { flex: 0 0 auto; height: auto; gap: 16px; padding: 20px; }
	/* Mobile comp: label sits 4px above the value (desktop uses 12), and the
	 * support line runs the full card width (desktop hugs at 200). */
	.nemra-contact-block__card-text { gap: 4px; }
	.nemra-contact-block__card-desc { max-width: none; }
}

/* Mobile mode type - appended at the END of the file so it outranks the
 * rules above at equal specificity (same pattern as events-featured).
 * Mobile comp 797:22545: section title is Heading/H2 (2 lines x 43 in a 352
 * box = 36/1.2), not the old 34 hardcode. */
@media (max-width: 991px) {
	.nemra-contact-block .nemra-contact-block__heading {
		font-size: var(--nemra-t-h2-size, 48px);
		line-height: var(--nemra-t-h2-lh, 1.2);
		letter-spacing: var(--nemra-t-h2-ls, -1.5px);
	}

}
