/**
 * Variant CSS: contact--map-band-cards
 * Layer 2 — Path B contact map variants (2026-05-28).
 */

body.aibt-universal .universal-contact--map-band-cards {
	background: var(--background);
	color: var(--text-primary);
	text-align: center;
}

/* Restore WP constrained-layout centering (margin:0 overrides zero auto margins). */
body.aibt-universal .universal-contact.universal-contact--map-band-cards .has-text-align-center {
	margin-inline: auto !important;
}

body.aibt-universal .universal-contact--map-band-cards .universal-contact__intro {
	margin-bottom: var(--space-lg);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__kicker {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important; font-weight: 600 !important;
	letter-spacing: var(--tracking-widest) !important; text-transform: uppercase !important;
	color: var(--accent) !important; margin: 0 auto var(--space-sm) auto !important;
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__headline {
	font-family: var(--font-display) !important; color: var(--text-primary) !important; margin: 0 !important;
}

/* === Map band === */
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map {
	position: relative;
	min-height: 300px;
	background-color: var(--background-alt);
	background-image:
		repeating-linear-gradient(0deg, transparent 0 42px, var(--divider-primary) 42px 43px),
		repeating-linear-gradient(90deg, transparent 0 42px, var(--divider-primary) 42px 43px);
	border: 1px solid var(--divider-primary);
	border-radius: var(--decor-radius);
	overflow: hidden;
	margin-bottom: var(--space-lg);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-road {
	position: absolute; background: var(--divider-primary); opacity: 0.85;
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-road--a {
	width: 170%; height: 16px; top: 44%; left: -35%; transform: rotate(-9deg);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-road--b {
	width: 16px; height: 200%; left: 70%; top: -50%; transform: rotate(14deg);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-park {
	position: absolute; width: 160px; height: 90px; left: 14%; bottom: 12%;
	background: var(--accent); opacity: 0.12; border-radius: 46% 54% 50% 48%;
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-pin {
	position: absolute; left: 50%; top: 48%; transform: translate(-50%, -100%);
	color: var(--accent); z-index: 2; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.28));
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__map-label {
	position: absolute; left: var(--space-md); bottom: var(--space-md);
	background: var(--background); color: var(--text-primary);
	font-family: var(--font-body); font-size: var(--text-sm); font-weight: 600;
	padding: 0.55rem 0.95rem; border: 1px solid var(--divider-primary);
	box-shadow: var(--decor-shadow-elevated); max-width: 72%; line-height: 1.4; text-align: left;
}

/* === Cards === */
body.aibt-universal .universal-contact--map-band-cards .universal-contact__cards {
	gap: var(--space-md);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__card {
	background: var(--background-alt);
	border: var(--decor-border-width) solid var(--divider-primary);
	border-radius: var(--decor-radius);
	padding: var(--space-md) var(--space-md);
	text-align: left;
	/* Subtle lift on hover — match the rest of the contact card library. */
	transition: transform var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__card:hover {
	transform: translateY(-3px);
	border-color: var(--accent);
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__card-label {
	font-family: var(--font-body) !important; font-size: var(--text-xs) !important;
	font-weight: 600 !important; letter-spacing: var(--tracking-wider) !important;
	text-transform: uppercase !important; color: var(--accent) !important;
	margin: 0 0 var(--space-2xs) 0 !important;
}
body.aibt-universal .universal-contact--map-band-cards .universal-contact__card-value {
	font-family: var(--font-body) !important; font-size: var(--text-base) !important;
	font-weight: 500 !important; line-height: var(--leading-relaxed) !important;
	color: var(--text-primary) !important; margin: 0 !important; word-break: break-word;
}

@media (max-width: 781px) {
	body.aibt-universal .universal-contact--map-band-cards .universal-contact__cards { flex-wrap: wrap; }
	body.aibt-universal .universal-contact--map-band-cards .universal-contact__card { flex-basis: 100%; }
	body.aibt-universal .universal-contact--map-band-cards .universal-contact__map { min-height: 240px; }
}

/* Cap letter-spacing on small screens (avoids cramped uppercase kicker/labels). */
@media (max-width: 640px) {
	body.aibt-universal .universal-contact--map-band-cards .universal-contact__kicker,
	body.aibt-universal .universal-contact--map-band-cards .universal-contact__card-label {
		letter-spacing: var(--tracking-wider) !important;
	}
}
