/* Barnsley Singers Profile and Team blocks. */
.bs-profile {
	--bs-red: var(--wp--preset--color--red, #BD1522);
	--bs-secondary: var(--wp--preset--color--secondary, #4A4A4A);
	--bs-paper: var(--wp--preset--color--paper, #F5F5F5);
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 1.25rem 2rem;
	align-items: start;
}
/* Doubled class beats the theme's general spacing for page content. */
.bs-profile.bs-profile {
	margin-block: 2.5rem;
}
.bs-profile__photo {
	margin: 0;
	position: relative;
}
.bs-profile__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: var(--bs-paper);
	border-bottom: 4px solid var(--bs-red);
}
.bs-profile__img.is-placeholder {
	border-bottom-color: var(--wp--preset--color--rule, #DCDCDC);
}
.bs-profile__body > * {
	margin-block: 0;
}
.bs-profile .bs-profile__name {
	margin: 0;
	font-size: var(--wp--preset--font-size--large, 1.5rem);
	line-height: 1.2;
}
.bs-profile__role {
	margin-top: 0.35rem !important;
	font-family: var(--wp--preset--font-family--heading, inherit);
	font-size: 0.95rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--bs-secondary);
}
.bs-profile__bio {
	margin-top: 0.9rem !important;
}
.bs-profile__more {
	margin-top: 0.75rem !important;
}

/* Card: photo on top. Used by the Card style and inside a Team block. */
.bs-profile.is-style-card,
.bs-team .bs-profile {
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
}
.bs-team .bs-profile.bs-profile {
	margin-block: 0;
}
.bs-profile.is-style-card .bs-profile__name,
.bs-team .bs-profile .bs-profile__name {
	font-size: 1.15rem;
}
.bs-profile.is-style-card .bs-profile__bio,
.bs-team .bs-profile .bs-profile__bio {
	font-size: var(--wp--preset--font-size--small, 0.9375rem);
}

/* Team grid. */
.bs-team {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.5rem 2rem;
	margin-block: 2rem 2.5rem;
}
.bs-team > .block-list-appender {
	align-self: center;
}

@media (max-width: 900px) {
	.bs-team {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 600px) {
	.bs-profile {
		grid-template-columns: minmax(0, 1fr);
	}
	.bs-profile__photo {
		max-width: 280px;
	}
	.bs-team {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Editor only: flag a photo with no alt text. */
.bs-profile__alt-flag {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	padding: 0.15rem 0.5rem;
	background: #000;
	color: #fff;
	font-size: 0.8rem;
}

/* ------------------------------------------------------------------
 * Feature band: full width, photo filling three edges of its half and
 * fading into the text side. Bands alternate white (photo left) and
 * black (photo right). Phones: photo on top, fading into the text below.
 * ------------------------------------------------------------------ */
.bs-profile.is-band {
	--bs-band: #fff;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 0;
	min-height: clamp(360px, 34vw, 500px);
	padding: 0;
	align-items: stretch;
}
.bs-profile.is-band.is-reversed {
	--bs-band: #000;
}
.bs-profile.bs-profile.is-band {
	margin-block: 0;
}
/* Space above the first band and below the last one. */
.wp-block-post-content > :not(.is-band) + .bs-profile.bs-profile.is-band {
	margin-top: 2.5rem;
}
.wp-block-post-content > .bs-profile.is-band + :not(.is-band) {
	margin-top: 3.5rem !important;
}
.bs-profile.is-band .bs-profile__photo {
	position: relative;
	overflow: hidden;
	min-height: 100%;
}
.bs-profile.is-band .bs-profile__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
	object-position: center 10%;
	border: 0;
}
.bs-profile.is-band .bs-profile__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, transparent 60%, var(--bs-band) 100%);
	pointer-events: none;
}
.bs-profile.is-band.is-reversed .bs-profile__photo {
	order: 2;
}
.bs-profile.is-band.is-reversed .bs-profile__photo::after {
	background: linear-gradient(to left, transparent 60%, var(--bs-band) 100%);
}
.bs-profile.is-band .bs-profile__body {
	align-self: center;
	box-sizing: border-box;
	width: 100%;
	max-width: 36rem;
	padding: 3rem clamp(1.5rem, 5vw, 4.5rem);
}
.bs-profile.is-band.is-reversed .bs-profile__body {
	justify-self: end;
}
.bs-profile.is-band .bs-profile__name {
	font-size: var(--wp--preset--font-size--x-large, 2rem);
}
/* Short accent bar under the role: red on white, white on black. */
.bs-profile.is-band .bs-profile__role::after {
	content: "";
	display: block;
	width: 2.5rem;
	height: 4px;
	margin-top: 0.9rem;
	background: var(--bs-red);
}
.bs-profile.is-band.is-reversed .bs-profile__role {
	color: var(--wp--preset--color--rule, #DCDCDC);
}
.bs-profile.is-band.is-reversed .bs-profile__role::after {
	background: #fff;
}
.bs-profile.is-band .bs-profile__bio {
	margin-top: 1.25rem !important;
}

@media (max-width: 781px) {
	.bs-profile.is-band {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
	}
	.bs-profile.is-band .bs-profile__photo,
	.bs-profile.is-band.is-reversed .bs-profile__photo {
		order: 0;
		max-width: none;
		aspect-ratio: 4 / 3;
		min-height: 0;
	}
	.bs-profile.is-band .bs-profile__photo::after,
	.bs-profile.is-band.is-reversed .bs-profile__photo::after {
		background: linear-gradient(to bottom, transparent 55%, var(--bs-band) 100%);
	}
	.bs-profile.is-band .bs-profile__body,
	.bs-profile.is-band.is-reversed .bs-profile__body {
		justify-self: stretch;
		max-width: none;
		margin-top: -1.5rem;
		position: relative;
		padding: 0 1rem 2.5rem;
	}
	.bs-profile.is-band .bs-profile__name {
		font-size: var(--wp--preset--font-size--large, 1.5rem);
	}
}