/**
 * Variant CSS: contact--whatsapp-direct-band
 * Layer 2 — Path B contact role (2026-06-06).
 * Warm full-bleed band inviting direct chat: centered intro + big tappable handle + WhatsApp/Messenger CTAs.
 * A8/A9-safe — every centered element keeps horizontal-auto margins.
 */

body.aibt-universal .universal-contact--whatsapp-direct-band {
	/* Warm accent-tinted band (theme-agnostic, KI-020-safe — text stays --text-primary). */
	background:
		radial-gradient(120% 140% at 50% 0%, color-mix(in srgb, var(--accent) 14%, var(--background)) 0%, var(--background) 70%);
	color: var(--text-primary);
	padding-block: calc(clamp(var(--space-lg), 6vw, var(--space-2xl, 5rem)) * var(--density, 1));
}

/* Intro: centered, horizontal-auto margins (A8/A9). */
body.aibt-universal .universal-contact--whatsapp-direct-band .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--whatsapp-direct-band .universal-contact__headline {
	font-family: var(--font-display) !important;
	color: var(--text-primary) !important;
	max-width: 18ch;
	margin: 0 auto var(--space-sm) auto !important;
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__headline em {
	font-style: normal;
	color: var(--accent);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .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;
	max-width: 52ch;
	margin: 0 auto var(--space-lg) auto !important;
}

/* Big tappable handle: phone/handle with chat-app badges. */
body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-sm);
	flex-wrap: wrap;
	max-width: max-content;
	margin: 0 auto var(--space-lg) auto;
	padding: 0.7rem 1.4rem 0.7rem 0.8rem;
	background: var(--background-card, color-mix(in srgb, var(--ink) 3%, var(--background)));
	border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
	border-radius: var(--decor-radius-pill);
	box-shadow: 0 12px 30px color-mix(in srgb, var(--ink) 10%, transparent);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-icons {
	display: inline-flex;
	align-items: center;
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-badge {
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--decor-radius-pill);
	color: var(--cta-text-primary);
	background: var(--accent);
}

/* Overlap the two badges for an avatar-stack feel. */
body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-badge--ms {
	margin-left: -12px;
	background: color-mix(in srgb, var(--accent) 70%, var(--ink));
	box-shadow: 0 0 0 2px var(--background-card, var(--background));
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-link {
	font-family: var(--font-display);
	font-size: clamp(var(--text-lg), 2.6vw, 1.75rem);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--text-primary);
	text-decoration: none;
	transition: color var(--duration-fast) var(--ease-default);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-link:hover {
	color: var(--accent);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* CTA buttons row: WhatsApp primary, Messenger outline. */
body.aibt-universal .universal-contact--whatsapp-direct-band .wp-block-buttons {
	gap: var(--space-sm);
	margin-bottom: var(--space-md);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .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);
	padding: 0.95rem 2.1rem;
	min-height: var(--target-min, 44px);
	transition: background var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default), color var(--duration-fast) var(--ease-default), transform var(--duration-fast) var(--ease-default);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta--wa .wp-block-button__link {
	color: var(--cta-text-primary);
	background: var(--cta-bg-primary);
	border: 1px solid var(--cta-bg-primary);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta--wa .wp-block-button__link:hover {
	background: var(--accent-hover);
	border-color: var(--accent-hover);
	transform: translateY(-1px);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta--ms .wp-block-button__link {
	color: var(--text-primary);
	background: transparent;
	border: 1px solid color-mix(in srgb, var(--ink) 30%, transparent);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta--ms .wp-block-button__link:hover {
	border-color: var(--accent);
	color: var(--accent);
	transform: translateY(-1px);
}

body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta .wp-block-button__link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* Reassurance note: centered, horizontal-auto margins (A8/A9). */
body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__note {
	font-family: var(--font-body) !important;
	font-size: var(--text-sm) !important;
	color: var(--text-secondary) !important;
	margin: 0 auto !important;
}

/* Mobile: shrink handle + stack CTAs full width. */
@media (max-width: 781px) {
	body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle {
		padding-inline: 1rem;
	}

	body.aibt-universal .universal-contact--whatsapp-direct-band .wp-block-buttons .wp-block-button {
		width: 100%;
	}

	body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta .wp-block-button__link {
		width: 100%;
	}
}

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

/* Respect reduced-motion: kill hover transitions/transforms. */
@media (prefers-reduced-motion: reduce) {
	body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__handle-link,
	body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta .wp-block-button__link {
		transition: none;
	}

	body.aibt-universal .universal-contact--whatsapp-direct-band .universal-contact__cta .wp-block-button__link:hover {
		transform: none;
	}
}
