/* ---- ABOUT PAGE TEAM — MASONRY CARDS WITH EXPANDABLE BIO (Phase: team accordion) ----
 * Scoped entirely under .blq-team-card-v2* so it cannot collide with the
 * existing .blq-team-* classes shared with the homepage teaser / grid in
 * components.css. Uses native <details>/<summary> for the expand/collapse,
 * same grid-template-rows smooth-height technique already used by
 * .blq-faq-item in components.css — no JS required.
 */

.blq-team-card-v2-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.5rem;
	align-items: start; /* required for the staggered/masonry offset below */
}

.blq-team-card-v2 {
	display: flex;
	flex-direction: column;
	background: var(--blq-card, #fff);
	border: 1px solid var(--blq-rule);
}

/* Staggered masonry look — offset alternating columns without a JS library */
.blq-team-card-v2:nth-child(3n+2) { margin-top: 2.5rem; }
.blq-team-card-v2:nth-child(3n+3) { margin-top: 1rem; }

.blq-team-card-v2-photo {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--blq-sand);
}
.blq-team-card-v2-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.blq-team-card-v2-years-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	display: flex;
	align-items: center;
	gap: 0.6rem;
	background: var(--blq-espresso);
	color: var(--blq-ink-invert);
	padding: 0.6rem 1rem;
	border-radius: 12px;
	box-shadow: 0 6px 16px rgba(46, 34, 28, 0.28);
}
.blq-team-card-v2-years-badge strong {
	font-family: var(--blq-font-display);
	font-style: italic;
	font-weight: 700;
	color: var(--blq-gold);
	font-size: 2rem;
	line-height: 1;
}
.blq-team-card-v2-years-label {
	font-size: 9.5px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	line-height: 1.25;
}

.blq-team-card-v2-summary {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
	padding: 1.25rem 1.5rem;
	-webkit-tap-highlight-color: transparent;
}
.blq-team-card-v2-summary::-webkit-details-marker { display: none; }
.blq-team-card-v2-summary::marker { content: ''; }

.blq-team-card-v2-id h3 { margin: 0 0 0.35rem; font-size: 1.15rem; }
.blq-team-card-v2-id .blq-team-role { margin-bottom: 0; }

.blq-team-card-v2-toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-shrink: 0;
	color: var(--blq-gold);
}
.blq-team-card-v2-toggle-label {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}
.blq-team-card-v2-toggle-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid var(--blq-gold);
	border-radius: 50%;
	font-size: 1rem;
	line-height: 1;
	transition: transform 300ms var(--blq-ease, ease);
	flex-shrink: 0;
}
.blq-team-card-v2-details[open] .blq-team-card-v2-toggle-icon { transform: rotate(45deg); }

.blq-team-card-v2-bio {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 300ms var(--blq-ease, ease);
}
.blq-team-card-v2-bio-inner {
	overflow: hidden;
	min-height: 0;
	padding: 0 1.5rem;
}
.blq-team-card-v2-details[open] .blq-team-card-v2-bio { grid-template-rows: 1fr; }
.blq-team-card-v2-details[open] .blq-team-card-v2-bio-inner { padding-bottom: 1.5rem; }

.blq-team-card-v2-years {
	font-family: var(--blq-font-display);
	font-style: italic;
	color: var(--blq-gold);
	font-weight: 600;
	margin: 0 0 0.5rem;
}
.blq-team-card-v2-bio-inner p:last-child {
	color: var(--blq-ink-muted);
	font-size: 0.92rem;
	margin: 0;
}

@media (max-width: 1023px) and (min-width: 768px) {
	.blq-team-card-v2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.blq-team-card-v2:nth-child(3n+3) { margin-top: 0; }
	.blq-team-card-v2:nth-child(2n) { margin-top: 2.5rem; }
}

@media (max-width: 767px) {
	.blq-team-card-v2-grid { grid-template-columns: 1fr; gap: 2rem; }
	.blq-team-card-v2:nth-child(n) { margin-top: 0; }
	.blq-team-card-v2-summary { padding: 1rem 1.25rem; }
	.blq-team-card-v2-toggle-label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.blq-team-card-v2-bio,
	.blq-team-card-v2-toggle-icon { transition: none; }
}