/**
 * Variant CSS: team--solo-portrait-overlay-name
 * Layer 2 — Path B team role (2026-06-10).
 *
 * One key person on a large cover portrait: name + role sit on a bottom gradient
 * scrim painted over the photo, bio reads below the image. Unlike editorial-split
 * (portrait beside a text column), quote-card, centered-statement, offset-accent,
 * stat-panel (dark box) and leadership-large-cards (3 cards), here the face fills
 * the frame like a magazine cover and the identity caption rides ON the photo.
 * The scrim is a CSS gradient so the white overlay text always has a dark backing
 * (KI-020 safe → --on-dark). Bio sits on the theme --background, so it is
 * polarity-aware (--text-primary). Portrait swapped by the photo system (team_1).
 */

body.aibt-universal .universal-team--solo-portrait-overlay-name {
	background: var(--background);
	color: var(--text-primary);
	padding-block: calc(clamp(var(--space-xl), 7vw, var(--space-2xl)) * var(--density, 1));
}

/* === Cover portrait ======================================================== */
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover {
	border-radius: var(--decor-radius);
	overflow: hidden;
	box-shadow: var(--decor-shadow-elevated);
	/* Generous portrait height; the inner caption anchors to the bottom. */
	min-height: clamp(440px, 64vw, 620px);
	padding: clamp(var(--space-lg), 4vw, var(--space-xl));
}
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover .wp-block-cover__image-background {
	filter: var(--photo-filter, none);
	transition: transform var(--duration-medium) var(--ease-elegant);
}
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover:hover .wp-block-cover__image-background {
	transform: scale(1.04);
}

/* Bottom gradient scrim so the overlay text is always legible over any photo.
   Sits above the image, below the caption. */
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		to top,
		rgba(0, 0, 0, 0.82) 0%,
		rgba(0, 0, 0, 0.5) 30%,
		rgba(0, 0, 0, 0.08) 58%,
		rgba(0, 0, 0, 0) 80%
	);
}
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	width: 100%;
}

/* === Overlay caption — always on the dark scrim (KI-020 safe) ============== */
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__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-2xs) 0 !important;
}
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__name {
	font-family: var(--font-display) !important;
	color: var(--on-dark, #FFFFFF) !important;
	margin: 0 0 var(--space-3xs) 0 !important;
}
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__role {
	font-family: var(--font-body) !important;
	font-size: var(--text-base) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-wide) !important;
	color: var(--on-dark, #FFFFFF) !important;
	opacity: 0.92;
	margin: 0 !important;
}

/* === Bio below the photo — polarity-aware on the section background ======== */
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__bio {
	font-family: var(--font-body) !important;
	font-size: var(--text-lg) !important;
	line-height: var(--leading-relaxed) !important;
	color: var(--text-primary) !important;
	opacity: 0.86;
	margin: clamp(var(--space-md), 3vw, var(--space-lg)) 0 0 0 !important;
	max-width: 56ch;
}

/* === Keyboard focus — visible ring on the focusable cover (a11y) =========== */
body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover:focus-within {
	outline: 2px solid var(--accent);
	outline-offset: var(--focus-offset, 4px);
}

/* === Reduced motion — neutralise the portrait zoom ========================= */
@media (prefers-reduced-motion: reduce) {
	body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover .wp-block-cover__image-background {
		transition: none;
	}
	body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover:hover .wp-block-cover__image-background {
		transform: none;
	}
}

/* === Responsive =========================================================== */
@media (max-width: 640px) {
	body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__cover {
		min-height: clamp(380px, 92vw, 480px);
	}
	body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__bio {
		font-size: var(--text-base) !important;
	}
	body.aibt-universal .universal-team--solo-portrait-overlay-name .universal-team__kicker {
		letter-spacing: var(--tracking-wider) !important;
	}
}
