/**
 * Variant CSS: contact--multi-office-tabs-static
 * Layer 2 — Path B contact role (2026-06-06).
 * Static city tab row above a single office panel (faux map + address/hours/CTA).
 */

body.aibt-universal .universal-contact--multi-office-tabs-static {
	background: var(--background);
	color: var(--text-primary);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__intro {
	margin-bottom: var(--space-lg);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .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 0 var(--space-sm) 0 !important;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__headline {
	font-family: var(--font-display) !important;
	color: var(--text-primary) !important;
	margin: 0 0 var(--space-sm) 0 !important;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__deck {
	font-family: var(--font-body) !important;
	font-size: var(--text-lg) !important;
	line-height: var(--leading-relaxed) !important;
	color: var(--text-secondary) !important;
	margin: 0 !important;
}

/* City tab row: static pills, first one accented as the active office. */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tabs {
	gap: var(--space-xs);
	margin-bottom: var(--space-lg);
	border-bottom: 1px solid color-mix(in srgb, var(--ink) 14%, transparent);
	padding-bottom: var(--space-sm);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab {
	font-family: var(--font-body) !important;
	font-size: var(--text-sm) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-wide) !important;
	color: var(--text-secondary) !important;
	background: transparent;
	border: 1px solid color-mix(in srgb, var(--ink) 16%, transparent);
	border-radius: var(--decor-radius-pill);
	padding: 0.55rem 1.3rem;
	margin: 0 !important;
	transition: color var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default), background var(--duration-fast) var(--ease-default);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab:hover {
	color: var(--text-primary) !important;
	border-color: color-mix(in srgb, var(--accent) 55%, transparent);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab--active {
	color: var(--cta-text-primary) !important;
	background: var(--accent);
	border-color: var(--accent);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab--active:hover {
	color: var(--cta-text-primary) !important;
	background: var(--accent-hover);
	border-color: var(--accent-hover);
}

/* Keyboard focus ring on the static pills (editor-clickable elements). */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* Office panel: two stretched columns. */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__panel {
	gap: var(--space-lg);
	align-items: stretch;
}

/* Faux map: CSS-painted street grid + center pin (themed placeholder). */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__mapcol {
	display: flex;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map {
	position: relative;
	width: 100%;
	min-height: 340px;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--decor-radius);
	border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
	background:
		color-mix(in srgb, var(--accent) 7%, var(--background));
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-road {
	position: absolute;
	background: color-mix(in srgb, var(--ink) 12%, transparent);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-road--a {
	top: 38%;
	left: 0;
	right: 0;
	height: 10px;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-road--b {
	top: 0;
	bottom: 0;
	left: 56%;
	width: 10px;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-road--c {
	top: 74%;
	left: 0;
	right: 0;
	height: 7px;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-block {
	position: absolute;
	background: color-mix(in srgb, var(--ink) 6%, transparent);
	border-radius: 3px;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-block--1 {
	top: 10%;
	left: 10%;
	width: 30%;
	height: 18%;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-block--2 {
	top: 50%;
	left: 64%;
	width: 24%;
	height: 16%;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-pin {
	position: absolute;
	top: 38%;
	left: 56%;
	transform: translate(-50%, -100%);
	color: var(--accent);
	filter: drop-shadow(0 4px 6px color-mix(in srgb, var(--ink) 30%, transparent));
	z-index: 2;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map-label {
	position: absolute;
	left: var(--space-sm);
	bottom: var(--space-sm);
	max-width: calc(100% - 2 * var(--space-sm));
	font-family: var(--font-body);
	font-size: var(--text-xs);
	font-weight: 600;
	color: var(--text-primary);
	background: var(--background);
	border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
	border-radius: var(--decor-radius);
	padding: 0.5rem 0.85rem;
	box-shadow: 0 2px 8px color-mix(in srgb, var(--ink) 12%, transparent);
}

/* Info column: address / phone / hours rows with leading icons + CTA. */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__infocol {
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
	padding: clamp(var(--space-md), 2.4vw, var(--space-lg));
	background: var(--background-card, color-mix(in srgb, var(--ink) 3%, var(--background)));
	border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
	border-radius: var(--decor-radius);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__officename {
	font-family: var(--font-display) !important;
	font-size: var(--text-xl) !important;
	color: var(--text-primary) !important;
	margin: 0 0 var(--space-2xs) 0 !important;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__row {
	gap: var(--space-sm);
	align-items: flex-start;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__rowicon {
	flex: 0 0 auto;
	display: inline-flex;
	color: var(--accent);
	margin-top: 0.15rem;
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__rowtext {
	font-family: var(--font-body) !important;
	font-size: var(--text-base) !important;
	line-height: var(--leading-relaxed) !important;
	color: var(--text-secondary) !important;
	margin: 0 !important;
}

/* CTA: primary token button (centered-safe — left-justified, not centered). */
body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta {
	margin-top: var(--space-2xs);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta .wp-block-button__link {
	font-family: var(--font-body);
	font-weight: 600;
	font-size: var(--text-sm);
	letter-spacing: var(--tracking-wide);
	color: var(--cta-text-primary);
	background: var(--cta-bg-primary);
	border: 1px solid var(--cta-bg-primary);
	padding: 0.95rem 2rem;
	min-height: var(--target-min, 44px);
	transition: background var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default), transform var(--duration-fast) var(--ease-default);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta .wp-block-button__link:hover {
	background: var(--accent-hover);
	border-color: var(--accent-hover);
	transform: translateY(-1px);
}

body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta .wp-block-button__link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* Stack on tablet/mobile; map drops above info. */
@media (max-width: 781px) {
	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__mapcol,
	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__infocol {
		flex-basis: 100% !important;
	}

	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__map {
		min-height: 260px;
	}
}

/* Cap uppercase letter-spacing on small screens (A5). */
@media (max-width: 640px) {
	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__kicker {
		letter-spacing: var(--tracking-wider) !important;
	}

	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab {
		letter-spacing: 0 !important;
	}
}

/* Respect reduced-motion: kill hover transitions. */
@media (prefers-reduced-motion: reduce) {
	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__tab,
	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta .wp-block-button__link {
		transition: none;
	}

	body.aibt-universal .universal-contact--multi-office-tabs-static .universal-contact__cta .wp-block-button__link:hover {
		transform: none;
	}
}