/**
 * About page — design-system layout.
 */

.bw-main--about {
	padding-top: 0;
	padding-bottom: 0;
}

.bw-about-hero {
	margin-bottom: 0 !important;
	text-align: left;
}

.bw-about-hero__shell {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: clamp(28px, 5vw, 56px);
	align-items: center;
}

.bw-about-hero__copy {
	min-width: 0;
}

.bw-about-hero__title {
	max-width: 16ch;
}

.bw-about-hero__lead {
	max-width: 38rem;
}

.bw-about-hero__sub {
	margin: 16px 0 0;
	max-width: 36rem;
	color: var(--brand-navy);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.55;
}

.bw-about-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.bw-about-hero__media {
	margin: 0;
	overflow: hidden;
	border-radius: var(--radius-2xl, 20px);
	border: 1px solid var(--brand-border);
	background: var(--brand-bg);
	box-shadow: var(--shadow-md, 0 12px 32px rgba(15, 23, 42, 0.08));
}

.bw-about-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 5 / 4;
}

.bw-about-section-head {
	margin-bottom: clamp(28px, 4vw, 40px);
	max-width: 42rem;
}

.bw-about-section-head .bw-eyebrow {
	display: inline-flex;
	margin-bottom: 10px;
}

.bw-about-section-head__title {
	margin: 0;
	color: var(--brand-navy);
	font-family: var(--font-family);
	font-size: clamp(1.6rem, 2.6vw, 2.15rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.2;
}

.bw-about-section-head__lead {
	margin: 14px 0 0;
	color: var(--bw-body-strong, var(--brand-navy));
	font-size: 16.5px;
	line-height: 1.65;
}

/* ---------- Who we are (Healthcare Trust panel pattern) ---------- */
.bw-about-who {
	padding: clamp(48px, 7vw, 88px) 0;
	background: var(--brand-bg);
}

.bw-about-who__panel {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(28px, 5vw, 56px);
	align-items: center;
}

.bw-about-who__media {
	margin: 0;
	overflow: hidden;
	border-radius: var(--radius-2xl, 20px);
	border: 1px solid var(--brand-border);
	background: var(--brand-bg);
}

.bw-about-who__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 4 / 3;
}

.bw-about-who__copy .bw-eyebrow {
	display: inline-flex;
	margin-bottom: 12px;
}

.bw-about-who__copy .bw-about-section-head__title {
	margin-bottom: 0;
}

.bw-about-who__copy p {
	margin: 16px 0 0;
	color: var(--brand-body);
	font-size: 16px;
	line-height: 1.65;
	max-width: 36rem;
}

.bw-about-who__note {
	color: var(--brand-navy) !important;
	font-weight: 500;
}

/* ---------- Mission / vision (Voice Use cases pattern) ---------- */
.bw-about-mv.bw-voice-usecases {
	padding-top: clamp(48px, 7vw, 80px);
	padding-bottom: clamp(48px, 7vw, 80px);
	background: var(--brand-bg-soft);
}

.bw-about-mv__rows.bw-voice-usecases__rows {
	margin-top: 0;
}

.bw-about-mv .bw-fcopy .bw-eyebrow {
	display: inline-flex;
	margin-bottom: 0;
}

.bw-about-mv .bw-fcopy .bw-h2 {
	margin-top: 14px;
	margin-bottom: 16px;
	font-size: clamp(24px, 2.8vw, 32px);
	font-weight: 500;
	letter-spacing: -0.025em;
	line-height: 1.15;
	max-width: 20ch;
}

.bw-about-mv .bw-fcopy p {
	font-size: clamp(16px, 1.4vw, 18px);
	line-height: 1.6;
	max-width: 34rem;
	color: var(--bw-body);
}

.bw-about-mv .bw-fcopy p + p {
	margin-top: 14px;
}

.bw-about-mv .bw-visual.bw-visual--voice-uc-mission {
	--vuc-bg-top: #eef6ff;
	--vuc-bg-mid: #f8fbff;
	--vuc-blob-blue: #7eb6ff;
	--vuc-blob-pink: #f2a8bc;
}

.bw-about-mv .bw-visual.bw-visual--voice-uc-vision {
	--vuc-bg-top: #fff7ed;
	--vuc-bg-mid: #fffaf5;
	--vuc-blob-blue: #fdba74;
	--vuc-blob-pink: #fcd34d;
	--vuc-blob-peach: #fed7aa;
}

/* ---------- Principles (Healthcare Capabilities slider pattern) ---------- */
.bw-about-principles.bw-healthcare-caps {
	background: var(--brand-bg);
}

/* ---------- CTA ---------- */
.bw-about-cta.bw-finalcta {
	padding: 0;
	background: var(--brand-bg);
}

@media (max-width: 980px) {
	.bw-about-hero__shell,
	.bw-about-who__panel {
		grid-template-columns: 1fr;
	}

	.bw-about-hero__media {
		max-width: 36rem;
	}

	.bw-about-hero__title {
		max-width: 18ch;
	}
}

@media (max-width: 640px) {
	.bw-about-hero__title {
		max-width: none;
	}

	.bw-about-hero__media {
		max-width: none;
	}
}
