/**
 * Variant CSS: about--founders-duo
 * Layer 2 - Path B universal ABOUT variant (two founders side by side).
 *
 * Concept: a left-aligned shared intro (kicker + headline + lead) followed by a
 * two-column row of EQUAL founder cards. Each card = square portrait, then the
 * person's name (focal), role (accent eyebrow) and a short bio. Reads as a
 * partner duo behind the brand - distinct from the single founder-portrait-quote
 * and from the decorative dual-image-story (which is one narrative + 2 photos).
 *
 * Surface contract: section sits on --background; portraits use aspect-ratio +
 * object-fit so any source crops cleanly. Names = --text-primary, role =
 * --accent eyebrow, bio = --text-secondary. Semantic tokens only; never a
 * hardcoded hex on a theme surface; never color:var(--bg-main) as foreground.
 * Mobile: the two columns stack to a single full-width column at <=781px.
 */

/* === Section shell ======================================================== */
body.aibt-universal .universal-about--founders-duo {
	background: var(--background);
	color: var(--text-primary);
	border-bottom: 1px solid var(--divider-primary);
}

/* === Shared intro ========================================================= */
body.aibt-universal .universal-about--founders-duo .universal-about__intro {
	max-width: 60ch;
	margin: 0 0 clamp(2.5rem, 6vh, 4.5rem) 0;
}

body.aibt-universal .universal-about--founders-duo .universal-about__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-md) 0 !important;
}

body.aibt-universal .universal-about--founders-duo h2.universal-about__headline,
body.aibt-universal .universal-about--founders-duo .universal-about__headline {
	font-family: var(--font-display) !important;
	color: var(--text-primary) !important;
	margin: 0 0 var(--space-md) 0 !important;
}

body.aibt-universal .universal-about--founders-duo .universal-about__headline em {
	font-style: italic;
	color: var(--accent);
}

body.aibt-universal .universal-about--founders-duo .universal-about__lead {
	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;
}

/* === Founders row =========================================================
   Mobile-first: each card is full width and stacks. The core wp:columns row
   reflows to two equal columns at the desktop breakpoint below. Equal widths
   keep both founders visually peer-level (no implied seniority). */
body.aibt-universal .universal-about--founders-duo .universal-about__founders {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: var(--space-lg) !important;
	margin: 0 !important;
}

body.aibt-universal .universal-about--founders-duo .universal-about__founder {
	display: flex !important;
	flex-direction: column;
	flex: 1 1 100%;
	margin: 0 !important;
}

/* Square portrait - aspect-ratio + object-fit crop any source cleanly. */
body.aibt-universal .universal-about--founders-duo .universal-about__photo {
	margin: 0 0 var(--space-md) 0 !important;
	width: 100%;
}

body.aibt-universal .universal-about--founders-duo .universal-about__photo img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	display: block;
	border-radius: var(--decor-radius, 0px);
}

/* Name = focal display type. */
body.aibt-universal .universal-about--founders-duo h3.universal-about__name,
body.aibt-universal .universal-about--founders-duo .universal-about__name {
	font-family: var(--font-display) !important;
	font-weight: 600 !important;
	font-size: clamp(1.35rem, 1.6vw, 1.65rem) !important;
	color: var(--text-primary) !important;
	line-height: 1.2 !important;
	letter-spacing: -0.01em !important;
	margin: 0 0 var(--space-xs) 0 !important;
}

/* Role = small accent eyebrow under the name. */
body.aibt-universal .universal-about--founders-duo .universal-about__role {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-wide) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0 0 var(--space-sm) 0 !important;
}

/* Short bio. */
body.aibt-universal .universal-about--founders-duo .universal-about__bio {
	font-family: var(--font-body) !important;
	font-size: var(--text-sm) !important;
	line-height: var(--leading-relaxed) !important;
	color: var(--text-secondary) !important;
	margin: 0 !important;
	max-width: 42ch;
}

/* === Desktop: 2-up equal row (>=782px) ==================================== */
@media (min-width: 782px) {
	body.aibt-universal .universal-about--founders-duo .universal-about__founder {
		/* two per row, accounting for one gap */
		flex: 1 1 calc(50% - (var(--space-lg) / 2));
	}
}

/* Tighten the wide kicker tracking on phones: a wide uppercase label fragments
   words at narrow widths. Cap to 0 (A5 clipping guard). */
@media (max-width: 640px) {
	body.aibt-universal .universal-about--founders-duo .universal-about__kicker {
		letter-spacing: 0 !important;
	}
}
